@charset "utf-8";
@import url("reset.css");
@import url("loading.css");
@import url("showDialog.css");

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> Main <<<------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/



html { height:100% }
body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; -webkit-text-size-adjust:none; font-size:12px; overflow-y:scroll }
body, td, th { font-size:12px; font-family: /*Arial,*/ "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "Microsoft JhengHei", "新細明體", "PMingLiU", sans-serif; }.iframe_ch { display:none }
.middle{ vertical-align:middle; }
.hide{ display:none;}
.width100{ width:100%; }

/*提示文字內容*/
#tip_box { position: fixed; line-height:22px; background-image:url(../../admin/images/bg.png); color: #FFF; padding-left:10px; padding-right:10px; padding-top:5px; padding-bottom:5px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; margin-left:10px; }
/*提示圖片處理*/
.tip { cursor:pointer; cursor:hand }


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Common <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#pager{width:100%; height:100px; line-height:100px; text-align:center; margin:0 auto;}

.button1{float:left; width:100px; height:35px; line-height:35px; background:#969e9e; text-align:center; letter-spacing:3px; color:#FFF; font-size:14px; cursor:pointer; cursor:hand;}
.button2{float:left; width:100px; height:35px; line-height:35px; background:#00909a; text-align:center; letter-spacing:3px; color:#FFF; font-size:14px; cursor:pointer; cursor:hand;}
.button3{display:inline-block; border:1px solid #b6b6b6; width:115px; height:28px; line-height:28px; text-align:center; font-weight:bold; color:#484A49; font-size:15px; letter-spacing:1px; -webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px; cursor:hand; cursor:pointer; }
.button3:hover{-webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; color:#fff; background:#484A49; }
.button3_on{display:inline-block; color:#fff; background:#484A49; border:1px solid #b6b6b6; width:115px; height:28px; line-height:28px; text-align:center; font-weight:bold; font-size:15px; letter-spacing:1px; -webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px; cursor:hand; cursor:pointer; }
.button4{background:#dd1431; color:#FFF; font-size:18px; letter-spacing:1px; width:150px; height:37px; line-height:37px; text-align:center; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; cursor:pointer; cursor:hand;}
.button4:hover{ background:#fc687d; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s;}

.text{ color:#555; font-size:12px; font-family:"微軟正黑體"; width:250px; height:100px; padding:5px; margin:5px 0 ; }

.input1 { width:435px; height:30px; border:1px solid #dfdfdf; margin:10px 0; padding:0 0 0 5px; outline:0; color:#383634; letter-spacing:1px;}
.order{ cursor:hand; cursor:pointer; margin-top:-5px;}
.gotop{position:absolute; bottom:0; right:5px; cursor:hand; cursor:pointer;}

#mobile_menu{ display:none;}

#hideMenu{ position:absolute; top:0; right:0; width:275px; overflow:hidden; display:none; }
#hideMenu .bTitle{width:100%; padding:20px 0; text-align:center; font-size:30px; background:#009099; color:#FFF; letter-spacing:5px;}
#hideMenu ul{ list-style:none; margin:0; padding:0; }
#hideMenu ul li{ display:inline-block; width:100%; background:#fff; color:#004A29; padding:15px 0 15px 10px; font-size:16px; letter-spacing:1px; border-bottom:2px solid #FFF; cursor:hand; cursor:pointer; }
#hideMenu ul li:hover{ background:#6CC5A7; -webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; }

#hideMenu div a::before { content: "";}
#hideMenu div{ font-size:18px; font-weight:normal; letter-spacing:1px; }
#hideMenu div a{ text-decoration:none; color:#000;}
#hideMenu div a:hover{ text-decoration:underline;}


.overlay{ position:absolute; display:none; width:100%; height:100%; z-index:9; top:0; left:0; background-color: rgba(0,0,0, 0.5); transition: 0.5s;}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> index <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#wrapper{ position:relative; width:100%; min-height:1000px; background:url(../../images/bg.jpg) repeat; }
#header{ width:100%; max-width:1150px; height:70px; margin:0 auto; position:relative; }
#header .nav{ position:absolute; bottom:15px; right:0; letter-spacing:1px; } 
#header .nav a{ font-size:14px; color:#000;}
#header .nav a:hover{ text-decoration:underline;}
#container{ position:relative; width:100%; max-width:1150px; overflow:hidden; margin:0 auto; }
#container .contain_left{ float:left; width:275px; box-sizing:border-box; }
#container .contain_left .logo{ margin-bottom:30px;}
#container .contain_left .frame{ position:relative; width:225px; margin:30px 5px 10px 5px; padding:0 10px; min-height:100px; border-left:1px solid #9E9E9E; color:#3c3f3f;}
#container .contain_left .frame .block{position:absolute; top:0; left:-2.5px;}
#container .contain_left .frame_title{ font-size:16px; letter-spacing:1px; letter-spacing:1px; font-weight:bold; margin-bottom:10px;}
#container .contain_left .frame_title span{ font-size:12px; font-weight:normal; letter-spacing:0;}
#container .contain_left .frame input { width:220px; height:30px; border:1px solid #dfdfdf; margin:10px 0; padding:0 0 0 5px; outline:0; color:#383634; letter-spacing:1px;}
#container .contain_left .frame_link{ text-align:center; color:#8b7357; letter-spacing:1px; margin:20px 0; }
#container .contain_left .frame_link a{ color:#8b7357; text-decoration:none; }
#container .contain_left .frame_link a:hover{ text-decoration:underline; }
#container .contain_left .frame ul{ list-style:none; margin:0; /*padding:15px;*/ }
#container .contain_left .frame ul li:before{ content:"";}
#container .contain_left .frame ul li{ letter-spacing:1px; font-size:15px; padding:10px 0;}
#container .contain_left .frame ul li a{ color:#00909a; font-size:15px; text-decoration:none;}
#container .contain_left .frame ul li .on{ color:#F00; text-decoration:none;}
#container .contain_left .frame ul li a:hover{ text-decoration:underline; }


#hideMenu  .frame{ position:relative; margin:30px 0px 10px 15px; padding:0 10px; min-height:100px; border-left:1px solid #9E9E9E; color:#3c3f3f;}
#hideMenu  .frame .block{position:absolute; top:0; left:-2.5px;}
#hideMenu  .frame_title{ font-size:16px; letter-spacing:1px; letter-spacing:1px; font-weight:bold; margin-bottom:10px;}
#hideMenu  .frame_title span{ font-size:12px; font-weight:normal; letter-spacing:0;}
#hideMenu  .frame input { width:220px; height:30px; border:1px solid #dfdfdf; margin:10px 0; padding:0 0 0 5px; outline:0; color:#383634; letter-spacing:1px;}
#hideMenu  .frame_link{ text-align:center; color:#8b7357; letter-spacing:1px; margin:20px 0; }
#hideMenu  .frame_link a{ color:#8b7357; text-decoration:none; }
#hideMenu  .frame_link a:hover{ text-decoration:underline; }
#hideMenu  .frame ul{ list-style:none; margin:0; padding:15px; }
#hideMenu  .frame ul li{ letter-spacing:1px; font-size:15px; padding:10px 0;}
#hideMenu  .frame ul li a{ color:#00909a; text-decoration:none; font-size:15px;}
#hideMenu  .frame ul li:hover a{ color:#fff; text-decoration:none;}
#hideMenu  .frame ul li .on{ color:#F00; text-decoration:none;}


#container .contain_right{ float:left; width:875px; box-sizing:border-box; }
#banner{ max-width:870px; width:100%; height:350px; }
#contain{ max-width:870px; width:100%; min-height:800px; border:1px solid #DFDFDF; border-top:0; background:#FFF; padding:15px 10px; box-sizing: border-box; }
#contain .subnav{ padding:20px 10px; }
#contain #search_area{width:100%; overflow:hidden;}
#contain #search_area .search_left{float:left; max-width:290px; padding-top:10px;}
#contain #search_area .search_right{float:left; padding-left:20px;}

#course_table{}
#course_table th{ height:36px; background:url(../../images/table_bg.jpg); color:#FFF; font-size:15px; letter-spacing:1px; font-weight:normal;}
#course_table td{ border:1px dotted #b2b2b2; height:60px; border-top:0; color:#575757; font-size:15px; padding:0 10px; letter-spacing:1px; box-sizing: border-box; }
#course_table tr:nth-child(even) { background-color: #fdf2e5;}
#course_table td span{ text-decoration:none; }
#course_table td div{padding: 5px 0px;width: 75px;border:1px solid #AAAAAA;background:#FFF;cursor:hand;cursor:pointer;}
#course_table td div:hover{-webkit-transition:.6s;-ms-transition:.6s;-moz-transition:.6s; color:#fff; background:#484A49; }
#course_table a{ color:#575757; }
#course_table a:hover{ text-decoration:underline; }

#footer{ width:100%; min-height:130px; background:#303231; margin-top:50px; }
#footer .footer_wrap{ max-width:1000px; margin:0 auto; padding:18px 0;}
.footer_block{ display:none; height:5px;}
#footer a{ color:#dedede;}
#footer a:hover{ text-decoration:underline; }

#footer_table{ width:100%; color:#dedede; font-size:15px; letter-spacing:1px; line-height:25px; display:flex; align-items:center; }
#footer_table div{ float:left; }


#copyright{ color:#898989; background:#3c3f3f; text-align:center; padding:10px 0; line-height:22px; letter-spacing:1px; font-size:13px;}
#copyright a{ color:#898989; text-decoration:none; }
#copyright a:hover{ text-decoration:underline; }


#sign_in {width:100%; background:#d9d9d9;margin:0; padding:17px 0 0 7px;}
#sign_in td{ padding-top:5px; padding-bottom:9px;}
#sign_in .title{ color:#696969; font-size:14px; }
#sign_in .title a{ color:#696969; text-decoration:none;}
#sign_in .title a:hover{ color:#2a4470;}
#sign_in .add{ color:#999999; font-size:12px;}
#sign_in .add a{ text-decoration:none; color:#999999;}
#sign_in .add a:hover{ text-decoration:underline;}
#logout{ background:#9c9c9c; color:#fff; width:100%;  height:34px; margin:0; cursor:pointer;}
#logout:hover{ background:#7b7b7b;}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Course <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.course_title{ padding:50px; font-size:24px; font-weight:bold; letter-spacing:1px;}
.course_title span{ font-size:12px; font-weight:normal; color:#929292; padding-left:50px;}
.course_stitle{display:inline-block;padding: 7px 0px 7px 15px; margin:15px 0; box-sizing: border-box;width: 100%;font-size:20px;font-weight:normal;letter-spacing:1px;background:#00909a;color:#FFF;}
.course_content{ padding: 0px 50px 10px 50px;overflow:hidden;}

#cinfo_table{ width:100%; overflow:hidden; }
#cinfo_table .cinfo_left{ width:50%; float:left; overflow:hidden; }
#cinfo_table .cinfo_right{ width:50%; float:left; overflow:hidden; }
#cinfo_table .cinfo_left2{ width:30%; }
#cinfo_table .cinfo_right2{ width:70%;}

.course_info_area{float:left; max-width:355px; padding:10px 0; margin-right:40px; font-size:15px;}
.course_info_left{float:left; max-width:80px;  font-weight:bold; color:#575757; padding-top:5px;}
.course_info_right{float:left; max-width:260px;  padding:0 10px; box-sizing: border-box; color:#575757; line-height:22px;}
.course_info_title{font-weight:bold; color:#575757; font-size:15px;}
.course_info_content{ padding:30px 0; line-height:25px; letter-spacing:1px; border-bottom:1px solid #CCC; margin-bottom:30px;}

.course_info_area2{width:100%; overflow:hidden; clear:both; padding:10px 0;}
.course_info_left2{font-size:15px;}
.course_info_right2{font-size:15px; width:80%; max-width:none; padding:0 0 0 30px;}

#detail { padding-top:32px;}
#apply {position:absolute; /*background:url(../../images/apply_bt.png) no-repeat;*/ width:133px; height:43px; margin-left:500px; margin-top:-50px; line-height:20px; padding-top:2px; cursor:pointer; color:#555;}
#apply i{ font-style:normal; display:inline-block;}

#detail th{background:#00909A; color:#FFF; font-size:15px; letter-spacing:1px; height:30px;}
#detail td{ padding:10px 0; font-size:15px; border-bottom:1px #ccc solid; padding-left:20px; color:#555555;}
#detail .back:hover{ cursor:pointer; text-decoration:underline;}
#detail .input{ border: #d9d9d9 1px solid; width:250px; height:25px; line-height:25px; color:#555555; padding-left:5px;}
#detail a{ color:#555555; text-decoration:none;}
#detail a:hover{ color:#969696; }
#detail .submit{ border:0; background:none; font-size:15px; letter-spacing:1px; color:#555; outline:none; cursor:pointer; font-family:"微軟正黑體";}
#detail .submit:hover{ color:#969696; text-decoration:underline;}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Course Camp Student<<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#stu_info_div { padding-top:32px;}

#stu_info_div th{background:#00909A; color:#FFF; font-size:15px; letter-spacing:1px; height:30px;}
#stu_info_div td{ padding:10px 0; font-size:15px; border-bottom:1px #ccc solid; padding-left:20px; color:#555555;}
#stu_info_div .back:hover{ cursor:pointer; text-decoration:underline;}
#stu_info_div .input{ border: #d9d9d9 1px solid; width:250px; height:25px; line-height:25px; color:#555555; padding-left:5px;}
#stu_info_div a{ color:#555555; text-decoration:none;}
#stu_info_div a:hover{ color:#969696; }
#stu_info_div .submit{ border:0; background:none; font-size:15px; letter-spacing:1px; color:#555; outline:none; cursor:pointer; font-family:"微軟正黑體";}
#stu_info_div .submit:hover{ color:#969696; text-decoration:underline;}

#rrss { padding-top:32px;}

#rrss th{background:#00909A; color:#FFF; font-size:15px; letter-spacing:1px; height:30px;}
#rrss td{ padding:10px 0; font-size:15px; border-bottom:1px #ccc solid; padding-left:20px; color:#555555;}
#rrss .back:hover{ cursor:pointer; text-decoration:underline;}
#rrss .input{ border: #d9d9d9 1px solid; width:250px; height:25px; line-height:25px; color:#555555; padding-left:5px;}
#rrss a{ color:#555555; text-decoration:none;}
#rrss a:hover{ color:#969696; }
#rrss .submit{ border:0; background:none; font-size:15px; letter-spacing:1px; color:#555; outline:none; cursor:pointer; font-family:"微軟正黑體";}
#rrss .submit:hover{ color:#969696; text-decoration:underline;}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Rwd <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

/*RWD*/
@media screen and (max-width: 1200px) {

	#container .contain_left{ display:none;}
	#container .contain_right{ width:100%;}
	#mobile_menu{ display:inline-block;}
	#contain{ max-width:none;}
	#banner{ max-width:none; height:auto; }
	
	#contain #search_area .search_left{ width:40%; }
	#contain #search_area .search_right{ width:60%; }
		
	.input1{ width:100%;}	
	.hide{ display:inline; }

}

@media screen and (max-width: 1023px) {

	#contain #search_area .search_left{ width:100%; float:none; }
	#contain #search_area .search_right{ width:100%; padding:0;}

}

@media screen and (min-width: 768px) {

    ::-webkit-input-placeholder { /* WebKit browsers */
        /*color: transparent;*/
    }
    :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
       /*color: transparent;*/
    }
    ::-moz-placeholder { /* Mozilla Firefox 19+ */
       /*color: transparent;*/
    }
    :-ms-input-placeholder { /* Internet Explorer 10+ */
      /* color: transparent;*/
    }

    textarea::-webkit-input-placeholder { /* WebKit browsers */
        /*color: transparent;*/
    }
    textarea:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
       /*color: transparent;*/
    }
    textarea::-moz-placeholder { /* Mozilla Firefox 19+ */
      /* color: transparent;*/
    }
    textarea:-ms-input-placeholder { /* Internet Explorer 10+ */
       /*color: transparent;*/
    }
	
}

@media screen and (max-width: 768px) {

	#contain{ min-height:inherit;}

	.course_table3{ display:none; }
	
	#footer_table{display:block; align-items:none;}
	#footer_table img{ margin-bottom:30px;}
	#footer_table div{ float:none; width:100%; text-align:center;}
	#footer_table .footer_line{ display:none; }
	
	#cinfo_table .cinfo_left{ float:none; width:100%; }
	#cinfo_table .cinfo_right{ float:none; width:100%; }
	.course_info_area{ max-width:none; margin-right:0;}	
	
	.course_info_right{ max-width:none; padding:0 20px 0px 13px;}
	
	.course_title{ padding:50px 10px;}
	.course_content{ padding:0px 20px 10px 20px;}
	
	.course_stitle{ width:100%;}
	
	.footer_address{ margin-top:10px;}	

}

@media screen and (max-width: 480px) {

	.course_table1{ display:none; }
	.course_table2{ display:none; }	
	
	#detail td{ padding-left:0;}
	#detail .input{ width:95%;}
	
	.footer_block{ display:block; height:5px; }	
	
	cinfo_table{ width:105%}
	.course_info_right2{ width:80%;}
	.course_info_right{ padding:0 10px 0 10px;}
	
	#cinfo_table .cinfo_left2{ width:100%; }
	#cinfo_table .cinfo_right2{ width:100%; }
	
}



@media screen and (max-width: 420px) {
	.course_info_right2{ width:75%;}
	
}

@media screen and (max-width: 350px) {
	.course_info_right2{ width:100%;}
	#stu_info_div .input{ width:85%;}
	.text{ color:#555; font-size:12px; font-family:"微軟正黑體"; width:85%; height:100px; padding:5px; margin:5px 0 ; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> CSS Animation <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

* { /*-webkit-transition: all 0.5s;*/ }

@-webkit-keyframes swing
{
	15%
	{
		-webkit-transform: translateX(5px);
		transform: translateX(5px);
	}
	
	30%
	{
		-webkit-transform: translateX(-5px);
		transform: translateX(-5px);
	}
	
	50%
	{
		-webkit-transform: translateX(3px);
		transform: translateX(3px);
	}
	
	65%
	{
		-webkit-transform: translateX(-3px);
		transform: translateX(-3px);
	}
	
	80%
	{
		-webkit-transform: translateX(2px);
		transform: translateX(2px);
	}
	
	100%
	{
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}
}

@keyframes swing
{
	15%
	{
		-webkit-transform: translateX(5px);
		transform: translateX(5px);
	}
	
	30%
	{
		-webkit-transform: translateX(-5px);
		transform: translateX(-5px);
	}
	
	50%
	{
		-webkit-transform: translateX(3px);
		transform: translateX(3px);
	}
	
	65%
	{
		-webkit-transform: translateX(-3px);
		transform: translateX(-3px);
	}
	
	80%
	{
		-webkit-transform: translateX(2px);
		transform: translateX(2px);
	}
	
	100%
	{
		-webkit-transform: translateX(0);
		transform: translateX(0);
	}
}

.swing:hover{
  		-webkit-animation: swing 1s ease;
        animation: swing 1s ease;
        -webkit-animation-iteration-count: 1;
        animation-iteration-count: 1;	
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Quick Links <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


ul, li { margin: 0; padding: 0; list-style: none; }
.abgne-fast-scroll { width: 213px; height: 200px; overflow: hidden; position: relative; }
.abgne-fast-scroll ul { position: absolute; }
.abgne-fast-scroll li { padding: 7px 0 7px 0px;  }
/*.abgne-news-scroll img { border:1px solid #666}*/

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Loadaction <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.Loadaction_Box { position: fixed; left: 0px; top:0px; background-image:url(/images/action_bg.png); z-index:100000000 }
.Loadaction { position: fixed; padding-top:5px; width: 220px; height: 45px; left: 42%; top: 42%; background-image:url(/images/action_bg.png); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; }
.Actionupload_Text { font-size:13px; color:#FFFFFF; height:20px; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> pagelink <<<--------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.cssa { font-family:Verdana; letter-spacing:1px; font-size:12px; padding-right:10px; padding-left:10px }
.cssb { font-family:Verdana; letter-spacing:1px; font-size:12px; padding-right:5px; padding-left:5px }
.cssc { padding-bottom:3px; letter-spacing:1px; font-size:12px; padding-left:10px; padding-right:10px; height:40px }
.cssd { font-family:Verdana; font-size:12px; letter-spacing:2px; height:10px; border:1px solid #FFFFFF }
a.pagelink_no:link { color: #003399; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; }
a.pagelink_no:visited { color: #003399; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink_no:active { color: #003399; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink_no:hover { color: #003399; text-decoration: underline; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink:link { color: #333333; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; }
a.pagelink:visited { color: #333333; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink:active { color: #333333; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink:hover { color: #333333; text-decoration: underline; font-family:Verdana; font-size:12px; letter-spacing:1px }
a.pagelink_ch:link { color: #cc3300; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }
a.pagelink_ch:visited { color: #cc3300; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }
a.pagelink_ch:active { color: #cc3300; text-decoration: none; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }
a.pagelink_ch:hover { color: #cc3300; text-decoration: underline; font-family:Verdana; font-size:12px; letter-spacing:1px; font-weight:bold }