@charset "utf-8";
/* CSS Document */

html, body { margin:0px; }

body { width:100%; font-size-adjust:100%; -webkit-text-size-adjust:100%; box-sizing:border-box; position:relative; color:#000000; font-size:16px; font-family:"Lato", "微軟正黑體", "Microsoft JhengHei", sans-serif; overflow:hidden-x; overflow-y:auto; }

a { outline:none; text-decoration:none; }

ul, ol { list-style:none; margin:0; padding:0; }
li { vertical-align:top; }

h1, h2, h3, h4, h5, p { padding:0; margin:0; }

img { border:none; }

input, select, textarea { font-family:"Lato", "微軟正黑體", "Microsoft JhengHei", sans-serif; }

input:focus, select:focus, textarea:focus { border-color:#66afe9; outline:0; -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); box-shadow:inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); outline:thin dotted; outline:5px auto -webkit-focus-ring-color; outline-offset:-2px; }

button, input[type=submit], input[type=reset], input[type=button] { -webkit-appearance:none; appearance:none; }

/* ---------------- clear fix ---------------- */

.clearfix:after { content:"."; display:block; clear:both; visibility:hidden; xline-height:0; height:0; font-size:0; }
.clearfix { display:inline-block; }
html[xmlns] .clearfix { display:block; }
* html .clearfix { height:1%; }

/*-------------------------------------------------------------------------------------*/
/* LAYOUT */

#wrap { width:100%; background-color:#ffffff; box-sizing:border-box; position:relative; z-index:1000; overflow:hidden;height: auto !important; min-height: 100vh; }
#wrap .container { width:100%; max-width:1272px; padding-left:15px; padding-right:15px; margin:0px auto; position:relative; box-sizing:border-box; display:block; }
#wrap .container {
	display: flex;
	/* align-items: center; */
	flex-wrap: wrap;
}

#wrap .overlay { position:absolute; left:0; top:0; z-index:5000; width:0; height:0; background-color:rgba(0,0,0,0.3); opacity:0; transition-delay:0.3s; -webkit-transition-delay:0.3s; -moz-transition-delay:0.3s; }
.box {
  display: flex;
  flex-flow: column;
  height: 100%;
}

.box .row {
 /* border: 1px dotted grey;*/
}

.box .row.top {
  min-width:100%;
  flex: 0 1 auto;
  /* The above is shorthand for:
  flex-grow: 0,
  flex-shrink: 1,
  flex-basis: auto
  */
}

.box .row.middle {
  flex: 1 1 auto;
}

.box .row.bottom {
  flex: 0 1 82px;
}

#top { padding-top:4px; background-repeat:repeat-x; background-position:center top;  position:relative; z-index:101; display:block; }
#top {
	padding: 10px 0 8px 0;
}
#top .logo_area { float:left; position:relative; display:flex; align-items:center; flex-grow: 1}
#top .logo { float:left; width:152px; padding-right:8px; position:relative; }
#top .logo:after { position:absolute; right:0; top:50%; content:""; width:1px; height:77%; background-color:#ff9e0f; transform:translateY(-50%); }
#top .logo img { width:100%; display:block; }
#top .course_logo { width:105px; padding-left:10px; }
#top .course_logo img { width:100%; display:block; }

/*#top .login_info { position:absolute; right:123px; top:0; width:auto;}*/
#top .login_info {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	/*flex-grow: 1;*/
	margin-right: 10px;

}
#top .login_info img {display: inline; width: 48px; background: #FFFFFF; object-fit: contain; float: left; }
#top .login_info .login_welcome { color: #0485ca; line-height: 24px; float: right; font-weight: bold; margin-left: 4px;}
/*#top .login_btn { position:absolute; right:7px; top:0; width:114px; }*/
#top .login_btn {
	width: 114px;
}
#top .login_btn img { width:100%; display:block; }
#top .login_btn i { font-size:30px; line-height:inherit; margin-right:6px; }

/*#top .mobile_btn { position:absolute; right:15px; top:50%; z-index:10; display:none; margin-top:-20px; }*/
#top .mobile_btn {
	display: none;
}
#top .mobile_btn a { display:block; width:40px; height:40px; background-color:rgba(255,255,255,0.39); box-sizing:border-box; text-align:center; text-transform:uppercase; font-weight:700; font-size:0; color:#268ddd; line-height:40px; }
#top .mobile_btn a i { font-size:30px; line-height:inherit; margin-right:6px; }
#top .mobile_btn a:hover { text-decoration:none; }

#menu { background-color:#ff9e0f; position:relative; height: 46px;}
#menu:after { position:absolute; left:0; top:100%; z-index:1; content:""; width:100%; height:8px; background:url(../img/menu_shadow.png) repeat-x center top; }
#menu .menu_area { box-sizing:border-box; }
/*#menu .menu_area ul.menu_list { font-size:0; margin:0 -23px; text-align:center; }*/
#menu .menu_area ul.menu_list { font-size:0; margin:0; text-align:center; }
#menu .menu_area ul.menu_list > li { display:inline-block; vertical-align:top; position:relative; box-sizing: border-box; }
#menu .menu_area ul.menu_list > li.mobile_only { display:none; }
/*#menu .menu_area ul.menu_list > li > a.lv1 { display:block; height:46px; background-color:transparent; padding:0 23px; font-size:0; color:#ffffff; font-weight:700; line-height:44px; transition:all 0.3s ease; }*/
#menu .menu_area ul.menu_list > li > a.lv1 { display:flex; height:46px; background-color:transparent; padding:0 23px; font-size:0; color:#ffffff; font-weight:700; line-height:44px; transition:all 0.3s ease; }
#menu .menu_area ul.menu_list > li > a.lv1 img { display:block; vertical-align:top; margin:auto 0;}
#menu .menu_area ul.menu_list > li > a.lv1 i { display:none; }
#menu .menu_area ul.menu_list > li.active > a.lv1, 
#menu .menu_area ul.menu_list > li > a.lv1:hover {background-color: #b7f596;}

#menu .menu_area ul.dropdown_menu {position: absolute;left: 0px;top:100%;z-index:100;width: 208px;padding:6px 0;background-color: #559234;display:none;margin-top: 1px;}
#menu .menu_area ul.dropdown_menu > li { position:relative; }
#menu .menu_area ul.dropdown_menu > li > a.lv2 { display:block; width:100%; padding:6px 15px; box-sizing:border-box; font-size:15px; color:#ffffff; font-weight:bold; text-align:left; transition:all 0.3s ease; }
#menu .menu_area ul.dropdown_menu > li > a.lv2 i { display:none; }
#menu .menu_area ul.dropdown_menu > li:hover > a.lv2,
#menu .menu_area ul.dropdown_menu > li > a.lv2:hover {background-color: #8adb5f;color:#ffffff;}

#menu .menu_area ul.subdrop_menu { position:absolute; right:-160px; top:0; z-index:1500; width:160px; padding:6px 0; background-color:#66ba49; box-sizing:border-box; box-shadow:5px 5px 5px rgba(0,0,0,0.3); text-align:left; }
#menu .menu_area ul.subdrop_menu > li { }
#menu .menu_area ul.subdrop_menu > li > a.lv3 { display:block; padding:6px 15px; font-size:13px; color:#ffffff; transition:all 0.2s ease; }
#menu .menu_area ul.subdrop_menu > li > a.lv3:hover { background-color:#419c2c; }
#mobile_menu { position:fixed; top:0; left:0; z-index:1; width:280px; height:100%; background-color:#32c8e0; transition:transform 0.5s ease; overflow:hidden; box-sizing:border-box; display:none; transform:translate3d(-280px, 0, 0); -webkit-transform:translate3d(-280px, 0, 0); -moz-transform:translate3d(-280px, 0, 0); }
#mobile_menu .menu_area { width:100%; height:100%; overflow-y:auto; box-sizing:border-box; background:none; }
#mobile_menu .menu_area ul.menu_list { }
#mobile_menu .menu_area ul.menu_list > li { display:block; border-bottom:1px solid #cccccc;  position:relative; box-sizing:border-box; }
#mobile_menu .menu_area ul.menu_list > li > a.lv1 { display:block; padding:15px 65px 15px 15px; margin:0; background-color:#268ddd; box-sizing:border-box; position:relative; font-size:16px; text-transform:uppercase; color:#ffffff; line-height:20px; }
#mobile_menu .menu_area ul.menu_list > li > a.lv1 img { display:none; }
#mobile_menu .menu_area ul.menu_list > li > a.lv1 i { position:absolute; right:0; top:0; width:50px; height:50px; text-align:center; line-height:50px; font-size:20px; color:#ffffff; font-style:normal; transition:all 0.3s ease; }
#mobile_menu .menu_area ul.menu_list > li > a.lv1 i:before { position:absolute; left:50%; top:50%; content:""; width:0; height:0; margin-left:-4px; margin-top:-6px; border-style:solid; border-width:6px 0 6px 8px; border-color:transparent transparent transparent #ffffff; }
#mobile_menu .menu_area ul.menu_list > li.openDrop > a.lv1 i { transform:rotate(90deg); }

#mobile_menu .menu_area ul.dropdown_menu { padding-top:6px; padding-bottom:12px; background-color:#95dcf5; border-top:1px solid #cccccc; display:none; }
#mobile_menu .menu_area ul.dropdown_menu > li { display:block; position:relative; }
#mobile_menu .menu_area ul.dropdown_menu > li > a.lv2 { display:block; padding:8px 15px; margin:0; box-sizing:border-box; font-size:16px; color:#ffffff; }
#mobile_menu .menu_area ul.dropdown_menu > li > a.lv2 i { position:absolute; right:10px; top:0; width:30px; height:30px; text-align:center; line-height:30px; font-size:20px; color:#017570; font-style:normal; transition:all 0.3s ease; }
#mobile_menu .menu_area ul.dropdown_menu > li.openDrop > a.lv2 i { transform:rotate(90deg); }

#mobile_menu .menu_area ul.subdrop_menu { display:none; padding:2px 15px 10px 35px; list-style:disc; font-size:14px; color:#017570; }
#mobile_menu .menu_area ul.subdrop_menu > li { }
#mobile_menu .menu_area ul.subdrop_menu > li > a.lv3 { display:block; padding:2px 0; color:#017570; }
#main { position:relative; overflow:hidden; }
#main .container { z-index:1; }
#main .banner_show { margin-top:27px; }
#main .banner_show .banner { width:100%; border-radius:13px; box-sizing:border-box; }
#main .banner_show .banner img { width:100%; border-radius:5px; display:block; }

#main .banner_show .owl-nav { position:absolute; left:0; right:0; top:50%; width:100%; }
#main .banner_show .owl-prev,
#main .banner_show .owl-next { position:absolute; top:0; transform:translateY(-50%); outline:none; }
#main .banner_show .owl-prev span,
#main .banner_show .owl-next span { display:block; width:36px; height:55px; background-image:url(../img/teacher/banner_row.png); background-repeat:no-repeat; background-size:auto 100%; font-size:0; }
#main .banner_show .owl-prev { left:-59px; }
#main .banner_show .owl-next { right:-59px; }
#main .banner_show .owl-prev span { background-position:left top; }
#main .banner_show .owl-next span { background-position:right top; }

#main .content_area { width:100%; display:flex; flex-direction:row-reverse; align-items:stretch; position:relative; }
#main .right_side { display:flex; width:155px; padding:30px 0 50px 0; box-sizing:border-box; position:relative; flex-wrap: wrap; }
#main .right_side:before { position:absolute; left:0; top:0; content:""; width:100vw; height:100%; background-image:url(../img/student/right_side_shadow.png); background-repeat:repeat-y; background-position:left top; }
#main .right_side .icon_img img { width:auto; max-width:100%; max-height:140px; margin:0 auto; }
/*#main .right_side .icon_label { width: 100%; text-align: center; font-size: 22px; font-weight: bold; color:#2165c1; height: 50px; position: absolute; border-bottom: solid 3px lightseagreen; padding-bottom: 5px; box-sizing: border-box; }*/
/*20191016-wzh*/
#main .right_side {
	display: flex;
	flex-direction: column;
}
#main .right_side .icon_label {
    width: 168px;
    height: 58px;
    margin-left: 30px;
	background-image: url(../attachment/iconPixel/changyong.png);
    background-repeat: no-repeat;
    background-size: contain;
}
/*#main .right_side .icon_list { margin-top: 50px; }*/
/*20191016-wzh*/
#main .right_side .icon_list {
	display: flex;
	flex-direction: column;
}
#main .main_side { display:flex; flex:1; width:100%; padding-right:87px; padding-top:30px; position:relative; box-sizing:border-box; flex-wrap:wrap; }

#main .title_area { width:100%; display:flex; align-items:flex-start; }
#main .title_area > img { max-width:100%; display:block; }
#main .title_area .title_icon { position:relative; z-index:1; }
#main .title_area .title_icon img { display:block; margin-right:-10px; }
#main .title_area .title { width:100%; display:flex; padding-bottom:18px; background:url(../img/student/title_dots.png) no-repeat right bottom; box-sizing:border-box; position:relative; align-items:center; }
#main .title_area .title_img { }
#main .title_area .title_img img { max-height:71px; display:block; }
/*#main .title_area .title_name { display:block; width:100%; padding-left:58px; padding-right:312px; background:url(../img/student/title_row.png) no-repeat left center; box-sizing:border-box; position:relative; font-size:42px; color:#008cd7; font-weight:700; line-height:1; }*/

/*#main .sorting_tool { position:absolute; right:87px; top:56px; text-align:right; }*/
#topMain .sorting_tool select { display:inline-block; vertical-align:top; width:100%; height:33px; padding:4px 12px; font-size:15px; color:#4f8a8b; font-weight:700; background:#fffff8; background:-moz-linear-gradient(top,  #ffffff 0%, #fffff8 100%); background:-webkit-linear-gradient(top,  #ffffff 0%,#fffff8 100%); background:linear-gradient(to bottom,  #ffffff 0%,#fffff8 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#fffff8',GradientType=0 ); border:2px solid #4f8a8b; border-radius:8px 8px 8px 8px; box-sizing:border-box; -webkit-appearance:none; appearance:none; -webkit-box-shadow:inset 0 1px 1px rgba(79, 138, 139, 0.075); box-shadow:inset 0 1px 1px rgba(79, 138, 139, 0.075); -webkit-transition:border-color ease-in-out .15s, box-shadow ease-in-out .15s; -o-transition:border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition:border-color ease-in-out .15s, box-shadow ease-in-out .15s;outline:0; }
#topMain .sorting_tool .select_area { display:inline-block; vertical-align:top; min-width:120px; background:#fffff8; background:-moz-linear-gradient(top,  #ffffff 0%, #fffff8 100%); background:-webkit-linear-gradient(top,  #ffffff 0%,#fffff8 100%); background:linear-gradient(to bottom,  #ffffff 0%,#fffff8 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#fffff8',GradientType=0 );  border-radius: 0; margin:0 0px; position:relative; cursor:pointer; }
#topMain .sorting_tool .select_area:before { position:absolute; right:15px; top:50%; z-index:1; content:""; width:0; height:0; border-style:solid; border-width:5px 4.5px 0 4.5px; border-color:#4f8a8b transparent transparent transparent; transform:translateY(-50%); }
#topMain .sorting_tool .select_area select { padding-right:40px; background:transparent; position:relative; z-index:2; }

#main .content { width:100%; display:block; padding:0px 0; }

#main .back_to_top { position:fixed; right:245px; bottom:30px; width:60px; display:none; cursor:pointer; }
#main .back_to_top.onBottom { /*position:absolute;*/ bottom:105px !important; }
#main .back_to_top img { width:100%; display:block; }

#main .multipage { padding-top:14px; padding-top:50px; margin:0 -7px; font-size:0; text-align:right; clear:both; }
#main .multipage a { display:inline-block; zoom:1; *display:inline; vertical-align:top; width:22px; height:22px; margin:0 2px; text-align:center; line-height:20px; font-size:13px; color:#000000; transition:all 0.2s ease; }
#main .multipage a.row,
#main .multipage a.back,
#main .multipage a.next { width:26px; margin:0 7px; background-color:#797979; color:#ffffff; }
#main .multipage a.onpage, 
#main .multipage a:hover { background-color:#df4d35; color:#ffffff; }
#main .multipage .select_area { display:none; vertical-align:top; width:100%; max-width:160px; background-color:#ffffff; vertical-align:top; border-radius:2px; position:relative; cursor:pointer; }
#main .multipage .select_area:before { position:absolute; right:8px; top:50%; z-index:1; content:"\f107"; font:normal normal normal 18px/1 FontAwesome; transform:translateY(-50%); }
#main .multipage .select_area select { width:100%; height:38px; padding-left:10px; padding-right:40px; background-color:transparent; border:1px solid #dbdad8; box-sizing:border-box; border-radius:2px; position:relative; z-index:2; font-size:13px; color:#000000; -webkit-appearance:none; appearance:none; outline:none; }

#main .main_bg_patten { position:absolute; left:0; bottom:0; width:100%; }
#main .main_bg_patten img { width:100%; display:block; }

#footer { padding:14px 0; position:relative; background-color:#28c6df; }
#footer .container { display:table; }
#footer .footer_logo { display:table-cell; vertical-align:middle; width:212px; padding-right:30px; box-sizing:border-box; }
#footer .footer_logo img { width:100%; }
#footer .company_link { display:table-cell; vertical-align:middle; width:184px; }
#footer .company_link select { display:block; width:100%; height:28px; padding:4px 12px; font-size:13px; color:#000000; background:#fdfdfd; background:-moz-linear-gradient(top,  #fdfdfd 0%, #d7f1f8 100%); background:-webkit-linear-gradient(top,  #fdfdfd 0%,#d7f1f8 100%); background:linear-gradient(to bottom,  #fdfdfd 0%,#d7f1f8 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdfdfd', endColorstr='#d7f1f8',GradientType=0 ); border:1px solid #d69c46; border-radius:4px; box-sizing:border-box; -webkit-appearance:none; appearance:none; -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075); -webkit-transition:border-color ease-in-out .15s, box-shadow ease-in-out .15s; -o-transition:border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition:border-color ease-in-out .15s, box-shadow ease-in-out .15s; }
#footer .company_link .select_area { display:inline-block; vertical-align:top; width:100%; background:#fdfdfd; background:-moz-linear-gradient(top,  #fdfdfd 0%, #d7f1f8 100%); background:-webkit-linear-gradient(top,  #fdfdfd 0%,#d7f1f8 100%); background:linear-gradient(to bottom,  #fdfdfd 0%,#d7f1f8 100%); border-radius:6px; position:relative; cursor:pointer; }
#footer .company_link .select_area:before { position:absolute; right:15px; top:50%; z-index:1; content:""; width:0; height:0; border-style:solid; border-width:0 4px 5px 4px; border-color:transparent transparent #008cd6 transparent; transform:translateY(-50%); }
#footer .company_link .select_area select { padding-right:40px; background-color:transparent; }
#footer .copyright { display:table-cell; vertical-align:middle; font-size:19px; color:#000000; font-weight:700; line-height:1; text-align:right; }
#footer .copyright ul { padding:2px 0; margin:0 -12px; font-size:0; }
#footer .copyright li { color:#ffeccc; display:inline-block; vertical-align:top; padding:0 12px; border-left:2px solid #a3e9fa; font-size:14px; }
#footer .copyright li:first-child { border-left:none; }
#footer .copyright li a { color:#ffeccc; }
#footer .copyright p { font-size:12px; padding:6px 0 2px 0; }
#footer .copyright a { color:#ffeccc; }
#footer .copyright a:hover { text-decoration:underline; }

/*-------------------------------------------------------------------------------------*/
/* INDEX */

.index_box_area { padding:26px 0 33px 0; margin:-13px -18px; display:block; }
.index_box_area .index_box_item { float:left; padding:13px 18px; box-sizing:border-box; }
.index_box_area .index_box { width:100%; padding:12px 14px; border-radius:10px; background-color:rgba(255,255,255,0.4); box-shadow:inset 0 0 32px rgba(255,85,0,0.4); box-sizing:border-box; }
.index_box_area .index_box.non_bg { background-color:transparent; box-shadow:none; }
.index_box_area .index_box_title {
	display: flex;
    align-items: center;
    width: 100%;
    padding-bottom: 6px;
    max-height: 71px;
    /*height: 45px;*/
}
.index_box_area .index_box_title .title_img {display:table-cell;vertical-align: bottom;}
.index_box_area .index_box_title .title_img img { display:block; max-width: 100%;}
/*.index_box_area .index_box_title .title_dot { display:table-cell; vertical-align:top; width:100%; background:url(../img/student/index_box_title_dot.png) repeat-x left 80%; }*/
.index_box_area .index_box_content { width:100%; height:218px; padding:0 14px; position:relative; box-sizing:border-box; }

/*.index_img { width:100%; height:300px; text-align:right; }*/
.index_img { width:100%; height:95px; text-align:right; }
.index_img img { max-width:100%; margin-bottom:-17px; }

.index_icon_list { display:table; font-size:0; text-align:center; margin:0 auto; }
/*.index_icon_list .index_icon_item { display:inline-block; vertical-align:top; padding:0 20px; box-sizing:border-box; }*/
.index_icon_list .index_icon_item {display:table-cell;vertical-align:middle;padding:0 20px;overflow: hidden;}
.index_icon_list .index_icon { width:100%; }
.index_icon_list .index_icon img { max-width:100%; display:inline-block; vertical-align:middle; }

.index_ball_list { width:100%; max-width:658px; padding:10px 29px; box-sizing:border-box; margin:0 auto; }
.index_ball_list .index_ball_item { float:left; width:33.3333334%; }
.index_ball_list .index_ball { width:100%; }
.index_ball_list .index_ball img { width:100%; display:block; }

.index_ball_list.owl-carousel .index_ball_item { width:100%; }
.index_ball_list.owl-carousel .owl-nav { position:absolute; left:0; top:50%; width:100%; }
.index_ball_list.owl-carousel .owl-prev, 
.index_ball_list.owl-carousel .owl-next { position:absolute; top:0;transform:translateY(-50%); outline:none; }
.index_ball_list.owl-carousel .owl-prev span, 
.index_ball_list.owl-carousel .owl-next span { display:block; width:36px; height:55px; background-image:url(../img/student/index_box_row.png); background-repeat:no-repeat; background-size:auto 100%; font-size:0; }
.index_ball_list.owl-carousel .owl-prev { left:0; }
.index_ball_list.owl-carousel .owl-next { right:0; }
.index_ball_list.owl-carousel .owl-prev span { background-position:left top; }
.index_ball_list.owl-carousel .owl-next span { background-position:right top; }

/*-------------------------------------------------------------------------------------*/
/* INNER PAGE */

.icon_section { width:100%; padding-bottom:30px; display:block; }
.icon_section:first-child { padding-top:20px; }
.icon_section .icon_box { width:100%; padding:16px 20px 12px 20px; border-radius:10px; background-color:rgba(255,255,255,0.4); box-shadow:inset 0 0 32px rgba(255,85,0,0.4); box-sizing:border-box; }

.icon_list { margin:-6px -5px; display:block; font-size:0; position:relative; }
.icon_list .icon_item { display:inline-block; vertical-align:top; width:16.6666667%; padding:6px 5px; box-sizing:border-box; }
.icon_list .icon { width:100%; text-align:center; display:block; }
.icon_list .icon_img { width:100%; }
.icon_list .icon_img img { width:100%; display:block; }
.icon_list .icon_title { padding-top:8px; font-size:25px; color:#333333; font-weight:700; display:none; }

.right_side .icon_list { margin:-10px 0; }
.right_side .icon_list .icon_item { width:100%; padding: 0; }
.right_side .icon_list .icon_title { font-size:27px; color:#0c67a6; }

/*-------------------------------------------------------------------------------------*/
/* DETAIL PAGE */

.download_all_area{text-align: right;}
.download_all_area  .dl_btn { display: inline-block }
.download_all_area  .dl_btn a {display:block;padding: 0 10px; height: 36px;background-color:orange;border-radius:9px;margin:0 auto;font-size:18px;color:#ffffff;font-weight:700;line-height:36px;text-align:center;margin-bottom: 18px;}
.download_all_area  .dl_btn a img {padding-left:8px;vertical-align:baseline;}
.download_all_area  .dl_btn a:hover { background-color: gold; }
.download_all_area  .hidden { display:none; }

.detail_area { width:100%; display:block; }

.detail_area .sub_title_area .sub_title_name { color:#2165c1; font-size:30px; font-weight: 700; }
.detail_area .tab_area { font-size: 0; }
.detail_area .tab_area a.tab_btn { display: inline-block; height: 36px;background-color:#209bdf;border-radius:12px 12px 0 0;margin:0 auto;font-size:18px;color:#ffffff;font-weight:700;line-height:36px;text-align:center;margin-bottom: 1px; margin-right: 1px; padding: 0 20px; }

.detail_area table { width:100%; text-align:center; border:none; border-collapse:collapse; font-size:16px; color:#000000; }
.detail_area table td { padding:5px; margin:0; border:none; background-color:#ffffff; box-sizing:border-box; }
.detail_area table tr:nth-child(2n+1) td { background-color:#f2f4f4; }
.detail_area table tr:first-child td { padding:9px 12px; background-color:#70da5f; color:#ffffff; font-size: 20px; font-weight: bold; }

.detail_area table td.book { width:106px; }
.detail_area table td.unit { width:92px; }
.detail_area table td.name { width:auto; }
.detail_area table td.type { width:76px; color:#64c054; }
.detail_area table td.dl_btn { width:162px; }
.detail_area table td.dl_btn a { display:block; width:88px; height:32px; background-color:#2092df; border-radius:9px; margin:0 auto; font-size:16px; color:#ffffff; font-weight:700; line-height:32px; text-align:center; }
.detail_area table td.dl_btn a img { padding-left:8px; vertical-align:baseline; }
.detail_area table td.col_btn a { display:block; width:88px; height:32px; background-color:#2092df; border-radius:9px; margin:0 auto; font-size:16px; color:#ffffff; font-weight:700; line-height:32px; text-align:center; }
.detail_area table td.col_btn a:visited { background-color: MediumPurple; }
.detail_area table td.col_btn a img { padding-left:8px; vertical-align:baseline; }
.detail_area table .hidden { display:none; }

/*-------------------------------------------------------------------------------------*/
/* eTool */

.eTool_list_area { display: inline-block; width: 100%; margin-bottom: 100px; }
.eTool_list_area:hover { }
.eTool { min-width:80px;max-width:300px;float:left;display:inline-block; overflow:hidden;text-overflow:ellipsis;text-align:center; margin: 1%; width: 18%; }
.eTool .over_item { width: 16.5%; position: absolute; vertical-align: middle; text-align: center; display: none; background-color: whitesmoke; min-width:80px;max-width:300px;}
.eTool:hover .over_item { display: block; border-radius: 15px; } 
.eTool .over_item a .btn_download { display: block; height: 36px;background-color:#2ba8bb;border-radius:15px;margin:2% auto;font-size:18px;color:#ffffff;font-weight:700;line-height:36px;text-align:center;padding: 0 20px; }
.eTool .over_item a .btn_download.disabled { background-color: silver; }
.eTool .over_item a:visited .btn_download:hover,
.eTool .over_item a .btn_download:hover { background-color: #91dede;color:#175aae; }
.eTool .over_item a:visited .btn_download  { background-color: MediumPurple ;color: white; }
.eTool .tool_name { color: #000000; font-weight: 600; font-size: 20px; min-height: 50px; }

/*-------------------------------------------------------------------------------------*/
/* MATHS READ */

.maths_read_list_area { display: inline-block; width: 100%; margin-bottom: 100px; }
.maths_read_list_area:hover {  }
.maths_read { min-width:80px;max-width:300px;float:left;display:inline-block; overflow:hidden;text-overflow:ellipsis;text-align:center; margin: 1%; width: 23%; }
.maths_read .cover_area img {max-width: 100%; width: 100%; }
.maths_read .cover_area .item_cover {max-width: 100%; width: 21%; position: absolute; display: inline-block; text-align: center; }
.maths_read .cover_area .item_cover_hover {max-width: 100%; width: 21%; display:none; position: absolute; text-align: center; }
.maths_read .over_item { width: 21%; position: absolute; vertical-align: middle; text-align: center; display: none; background-color: whitesmoke; z-index: 1000; }
.maths_read:hover .over_item { display: block; border-radius: 15px; } 
.maths_read:hover .cover_area .item_cover { display: none; } 
.maths_read:hover .cover_area .item_cover_hover { display: block; } 
.maths_read .over_item .btn_download { display: block; height: 36px;background-color:#2ba8bb;border-radius:15px;margin:2% auto;font-size:18px;color:#ffffff;font-weight:700;line-height:36px;text-align:center;padding: 0 20px; }
.maths_read .over_item .btn_download.disabled { background-color: silver; }
.maths_read .over_item .btn_download:hover { background-color: #91dede;color:#175aae; }
.maths_read .item_name { color: #000000; font-weight: 600; font-size: 20px; min-height: 50px; }

/*-------------------------------------------------------------------------------------*/
/* POSTER */

.poster_box { width:100%; max-width:986px; padding:58px 46px 35px 46px; background-color:#96eef1; border:2px solid #96eef1; box-sizing:border-box; border-radius:35px; box-shadow:inset 0 0 6px 4px rgba(255,255,255,0.9), 0 0 27px 6px rgba(255,255,255,0.9); }
.poster_box .poster_list { margin:0 -11px; display:block; }
.poster_box .poster_item { float:left; width:25%; max-width:222px; padding:0 11px; box-sizing:border-box; }
.poster_box .poster { width:100%; text-align:center; }
.poster_box .poster_photo { width:100%; height:auto; padding:0 5px 25px 5px; box-sizing:border-box; }
.poster_box .poster_photo img { display:block; margin:auto; box-shadow:0 0 5px rgba(0,0,0,0.3); }
.poster_box .poster_info { width:100%; padding-top:14px; border-top:2px solid deepskyblue; font-weight:700; }
.poster_box .poster_title { font-size:32px; color:#175aae; }
.poster_box .poster_desc { font-size:22px; color:#e54000; text-align: center;}

.poster_box .poster_list.owl-carousel { margin:0; }
.poster_box .poster_list .owl-item { }
.poster_box .poster_list .owl-item .poster_item { width:100%; padding:0; }
.poster_box .poster_list .owl-nav { position:absolute; left:0; top:30%; width:100%; }
.poster_box .poster_list .owl-prev, 
.poster_box .poster_list .owl-next { position:absolute; top:0; width:45px; height:108px; background-image:url(../img/teacher/poster_list_row.png) !important; background-repeat:no-repeat; background-size:cover; outline:none; cursor:pointer; }
.poster_box .poster_list .owl-prev { left:-45px; background-position:left top !important; }
.poster_box .poster_list .owl-next { right:-45px; background-position:right top !important; }

/*-------------------------------------------------------------------------------------*/
/* COURSE */

.course_box { width:100%; min-height:240px; padding:40px 0; background-color:rgba(255,255,255,0.6); box-sizing:border-box; border-radius:35px; box-shadow:inset 0 0 6px 4px rgba(50,204,204,0.2), 0 0 27px 4px rgba(255,255,255,0.9); position:relative; }
.course_box .course_header { padding:0 66px; font-size:0; }
.course_box .course_header .title_img { display:inline-block; vertical-align:top; width:21%; }
.course_box .course_header .title_img img { width:100%; display:block; -webkit-filter:drop-shadow(3px 3px 3px rgba(0,0,0,0.6)); filter:drop-shadow(3px 3px 3px rgba(0,0,0,0.6)); }
.course_box .course_header .title { display:inline-block; vertical-align:top; width:76.5%; }
.course_box .course_header .title img { display:block; width:100%; }

.course_box .course_content { width:100%; padding:0 21.5% 0 52px; box-sizing:border-box; position:relative; z-index:1; display:block; }
.course_box .new_course_info { float:left; width:46.5%; max-width:324px; text-align:center; }
.course_box .new_course_list_area { float:right; width:48.9%; max-width:340px; position:relative; text-align:center; }
.course_box .new_course_list_topic { position:absolute; left:0; bottom:100%; width:100%; padding-bottom:12px; font-size:33px; color:#000000; font-weight:700; }
.course_box .new_course_list { display:block; margin:0 -11px; }
.course_box .new_course_item { float:left; width:50%; padding:0 11px; box-sizing:border-box; }
.course_box .new_course { width:100%; }
.course_box .new_course_cover { width:100%; border:2px solid #999999; box-sizing:border-box; box-shadow:5px 5px 5px rgba(0,0,0,0.5); }
.course_box .new_course_cover img { width:100%; display:block; }
.course_box .new_course_name { padding-top:14px; font-size:29px; color:#175bae; font-weight:700; }
.course_box .new_course_info .new_course_item { width:100%; padding:0; }
.course_box .new_course_info .new_course_name { color:#000000; }

.course_box .course_img_patten { position:absolute; right:-2px; bottom:10px; width:20.5%; xwidth:202px; box-sizing:border-box; text-align:right; }
.course_box .course_img_patten img { width:100%; display:inline-block; vertical-align:top; -webkit-filter:drop-shadow(3px 3px 3px rgba(0,0,0,0.3)); filter:drop-shadow(3px 3px 3px rgba(0,0,0,0.3)); }

/*-------------------------------------------------------------------------------------*/
/* EDITOR CONTENT */

.editor_content { min-height:420px; display:block; color:#000000; line-height:1.5; }
.editor_content:after { content:""; display:block; width:100%; clear:both; }
.editor_content .table_area { width:100%; overflow-x:auto; }
.editor_content iframe { max-width:100%; box-sizing:border-box; }
.editor_content img { max-width:100%; box-sizing:border-box; }
.editor_content table { max-width:100%; box-sizing:border-box; }

table.mobile_block { width:100% !important; }

/* Tag default values */
.editor_content ul, 
.editor_content ol { display:block; margin:1em 0; padding-left:40px; padding-left:20px; }
.editor_content ul { list-style-type:disc; }
.editor_content ol { list-style-type:decimal; }
/*
.editor_content h1 { margin:0.67em 0; }
.editor_content h2 { margin:0.83em 0; }
.editor_content h3 { margin:1em 0; }
.editor_content h4 { margin:1.33em 0; }
.editor_content h5 { margin:1.67em 0; }
.editor_content h6 { margin:2.33em 0; }
.editor_content p { margin:1em 0; }
*/

/*-------------------------------------------------------------------------------------*/
/* pop up calendar( w3school) */

.modal { display: none; position: fixed; z-index: 9999; left: 0;top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); /* Fallback color */ background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ }
.modal-content { background-color: whitesmoke; margin: 15% auto; padding: 0; border: 1px solid #888; width: 35%; max-width: 400px; min-width: 320px; }
.modal-content .login_box_title_area { background-color: gold; padding: 10px; }
.modal-content .login_box_title_area .login_box_title { font-size: 16px;  }
.modal-content .login_box_title_area .close { color: #aaa; float: right; font-size: 28px; font-weight: bold; margin-top: -10px; }
.modal-content .login_box_title_area .close:hover, .close:focus { color: black; text-decoration: none; cursor: pointer; }
.modal-content .login_box_content { background-color: whitesmoke; padding: 20px; }
.modal-content .login_box_content table { text-align: center; width: 280px; }
.modal-content .login_box_content table td { padding: 0; font-size: 16px; width: 200px; }
.modal-content .login_box_content table td:first-child { width: 60px; }
.modal-content .login_box_content table td label { font-size: 14px; }
.modal-content .login_box_content table td input[type=text],
.modal-content .login_box_content table td input[type=password] { width: 100%; padding: 5px; border: solid silver 1px; }
.modal-content .login_box_content table td input[type=button], 
.modal-content .login_box_content table td input[type=submit] { float: right; background-color: gold; border: solid 1px orange; }
.modal-content .login_box_content .login_error_message { color: red; }

@media screen and (max-width: 767px){
.modal-content { width: 80%; height: auto; }
.modal-content { width: 70%; height: auto; }
}

.loginForm{ width: 100%; padding: 12px 20px; margin: 8px 0; box-sizing: border-box; }
.myButton{ -moz-box-shadow:inset 0px 1px 3px 0px #91b8b3; -webkit-box-shadow:inset 0px 1px 3px 0px #91b8b3; box-shadow:inset 0px 1px 3px 0px #91b8b3; background:#2092df;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#2092df', endColorstr='#6c7c7c',GradientType=0); background-color:#2092df; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; border:1px solid #566963; display:inline-block; cursor:pointer;
	color:#ffffff; font-family:Arial; font-size:15px; font-weight:bold; padding:11px 23px; text-decoration:none; text-shadow:0px -1px 0px #2b665e; margin-top: 15px;
}
.myButton:hover{ filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#2ba8bb', endColorstr='#768d87',GradientType=0); background-color:#2ba8bb; }
.myButton:active { position:relative; top:1px; }