@font-face{
	font-family: FontAwesome;
	src: url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/FontAwesome.otf);

}

@charset "UTF-8";
	html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	vertical-align:baseline;
	font:inherit
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
	display:block
}
body {
	line-height:1
}
ol,ul {
	list-style:none
}
blockquote,q {
	quotes:none
}
blockquote:before,blockquote:after,q:before,q:after {
	content:'';
	content:none
}
table {
	border-collapse:collapse;
	border-spacing:0
}
* {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
	-o-box-sizing:border-box
}

#noie6 {
	    background: #FFDFDF; /*背景色*/
	    border: 1px solid #FF2F2F; /*邊線*/
	    clear: both; /*清除繼承上方的浮動*/
	    color: #555; /*字體顏色*/
	    display: block; /*顯示方式*/
	    font-size: 15px; /*字體大小*/
	    height: 40px; /*高度*/
	    letter-spacing: 1px; /*字體間距*/
	    padding: 5px; /*內邊距*/
	    position: relative; /*相對定位*/
	    text-align: center; /*文字置中*/
	    top: 10px; /*距離上方10px*/
	    width: 100%; /*寬度*/
	    z-index:99;
	}

html {
	-webkit-text-size-adjust:100%;
	overflow-x:hidden;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale
}

html{-webkit-text-size-adjust:none;
     /*font-family: Meiryo, "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", sans-serif;*/
	 font-family: Arial, Helvetica,"微軟正黑體", "Microsoft JhengHsans", sans-serif;
}

h1, .h2, h3, h4, ul.tag>li{
	font-family: Arial, Helvetica,"source-han-sans-traditional","微軟正黑體", "Microsoft JhengHsans",
	 sans-serif;
}

body{
	font-size:17px;
}

p{
	font-size: 17px;
	color: #666;
	line-height: 1.5;
	text-align: justify;
}

a{
	text-decoration: none;
}

::selection {
	background-color:#112368;
	color:#fff;
	text-shadow:none
}
::-moz-selection {
	background-color:#112368;
	color:#fff;
	text-shadow:none
}

.ANT {
	-webkit-transition:all .4s;
	-moz-transition:all .4s;
	-ms-transition:all .4s;
	-o-transition:all .4s;
	transition:all .4s
}
.clear {
	clear:both
}

.clearfix::after{
	content:"";
	display:block;
	clear:both;
}

/* ----------電腦版型--------------------------- */
.TOP{
    width:100%;
	height:auto;
	background-image:url(../images/top_img_1920.jpg);
	background-position: center top;
	background-repeat: no-repeat;
	background-color: #2282d8;
	height: 500px;
	overflow: hidden;
	position: relative;
}

.TOP .wrapper{
	margin:0 auto;
	width:100%;
	max-width:850px;
	width: 100%;
	height: 100%;
}

.pulse{ 
	-ms-animation: pulse 2s 1s infinite;
	-moz-animation: pulse 2s 1s infinite;
	-webkit-animation: pulse 2s 1s infinite;
	animation: pulse 2s 1s infinite;
	animation-delay: 2s;
	}


.subImg{
	display: block;
	margin: 0 auto;
	margin-top: 145px;
	margin-left: -50%;
	margin-bottom: 15px;
}

.subImg img{
	max-width: 410px;
	min-width: 230px;
	width: 70vw;
}

.tagImg{
	display: block;
	margin: 0 auto;
	margin-left: -50%;
	margin-bottom: 110px;
}

.tagImg img{
	max-width: 407px;
	min-width: 230px;
	height: 81px;
	width: 70vw;
}

h1{
	font-size: 38px;
	color: #fff;
	margin-right: 5px;
	display: inline-block;
}

.CTA1{
	display: inline-block;
	vertical-align: text-bottom;
	/*float: left;*/
	/*display : table;*/
	width: 130px;
	height: 45px;
	border-radius: 50px;
	background-color: rgba(255, 198, 27, 0.9);
	margin: 0 auto;
	z-index: 9999;
	cursor: pointer;
	margin-top: 5px;
	z-index: 9999999;
}

.CTA1 p{
	font-size: 19px;
	line-height: 45px;
	text-align: center;
	color: #333;
}

.CTA1:hover{
	width: 135px;
	background-color: rgba(29, 32, 162, 0.9);
}

.CTA1:hover p{
	color: #ffc61b;
}

.pulse{ 
	animation: pulse 2s infinite;
	animation-delay: 3s;
	}

/*------------- FORM_BLOCK -------------*/

#FORM_BLOCK{
	width:100%;
	height:auto;
	position:relative;
	overflow:hidden;
	background-color:#fcfbf6;
	background-image: url(../images/bg1.png);
	}
	
#FORM_BLOCK .WRAPPER{
	margin:0 auto;
	position:relative;
	width:100%;
	max-width:850px;
	padding-top:50px;
}
	
h3{
	color:#1971db;
	text-align:center;
	font-size:25px;
	font-weight:500;
	letter-spacing:1px;
	}	
	
.h3{ 
	color:#f20031;
	font-size:28px;
	font-weight: 400;
	text-align:center;
	margin-bottom:15px;
	margin-top: 10px;
}

.h3 span{
	font-weight: 600;
}

.GIFT{
	display:block;
	float:left;
	width:50%;
	margin:0 auto;
	margin-top: 20px;
}
	
.GIFT img{
	display:block;
	margin:0 auto;
	width: 100%;
	max-width: 390px;
	width: 70vw;
	height: auto;
	margin-bottom: 10px;}


	
/*------------表單內容------------*/	

#FORM {
	float:left;
	width:50%;
	margin:0 auto;
	z-index:99999;
	margin-bottom: 60px;
}
	
#FORM #NAME{
	width:49%;
	height:auto;
	float:left;
	margin-right:2%;
	}
	
#FORM #PHONE{
	width:49%;
	height:auto;
	float:left;
}
	
#FORM #EMAIL{
	width:100%;
	height:auto;
	float:left;
}	

#FORM #Dept{
     margin:0px 0px 20px 0px;
     width:100%;
     height:40px;
	 
 }
#FORM #CITY{
     float:left;
     width:49%;
     height:auto;
     margin-right:2%;
 }

#ddl_city_no{
     width:100%;
     font-size:16px;
     text-align:center; 
 }

#FORM #SCHOOL{
     float:left;
     width:49%;
 }

 #ddl_area_no{
     width:100%;
     font-size:16px;
     text-align:center;   
 }        	
	
#READ{
	clear: both;
	font-size:15px;
	width:100%;
	display:block;
	margin-bottom:10px;}
	
#READ .searchtext2{
	min-width:20px;
	min-height:20px;
    border:solid 1px gray;
	vertical-align: text-bottom;
	}

#READ span{
	color:#666666;
	line-height:20px;
	text-indent:5px;
	line-height:1.3;
	}
	

#FORM #BUT {
	float:left;
	width:100%;
	height:auto;}

.A{
	font-family:Arial, Helvetica,"微軟正黑體", sans-serif,Microsoft JhengHei;
	color:#666666;
	background-color: rgba(255,255,255,0.2);
	background-color: #fff;
	border: none;
	width:100%;
	height:35px;
	line-height:35px;
	margin-top:8px;
	font-size:18px;
	border: 1px solid #2384db;
	text-align:left;
	padding-left:10px;
	overflow:hidden;
	}

/*select option {
	background-color: #3888d8;
}*/
	
.B{
	clear:both;
	width:100%;
	height:50px;
	display:block;
	margin:0 auto;
    *zoom: 1;
    font-size: 26px;
	line-height: 45px;
    text-align: center;
    color: #000;
	text-decoration:none;
    background-color: #ffc61b;
    /*text-shadow: 0px 2px 0px #ffcc00;*/
    border-bottom: 10px solid #ffa61b;
    cursor: pointer;
	border-radius:3px;
}

.B:hover{
	color: #1d2088;
}



/*------------- CONTENT1 -------------*/
.CONTENT1, .CONTENT2{
	padding-top:70px;
	padding-bottom:60px;
}

.CONTENT1{
    width:100%;
	height:auto;
	position:relative;
	overflow:hidden;
	background-color: #ffc61b;
}

.CONTENT1 .row{
	margin: 0 auto;
	max-width: 1000px;
	width: 100%;
}

.textBOX{
	height: 180px;
	background-color: #2384db;
	padding-top: 8%;
}

.textBOX p{
	font-size: 21px;
	color: #fff;
	text-align: center;
	text-decoration: none;
}

.textBOX img{
	display: block;
	margin: 0 auto;
	max-width: 100px;
	width: 15vw;
}

	
	
/*------------- CONTENT2 -------------*/	
.CONTENT2{
    width:100%;
	height:auto;
	position:relative;
	overflow:hidden;
	background-color: #2282d8;
}

.h2{
	text-align: center;
	color: #fff;
	font-weight: 500;
	font-size: 32px;
	line-height: 1.3;
	margin-bottom: 10px;
}

.line{
	margin:  0 auto;
	width: 140px;
	height: 5px;
	background-color: #ffc61b;
	margin-bottom: 45px;
}

/*---- accordion -------------*/
.panel-default {
    border-color: #67A7DF;
}

.panel-group .panel {
    margin-bottom: 0;
    border-radius: 5px;
}

.panel-group .panel+.panel {
    margin-top: 7px;
}

.panel-default>.panel-heading{ 
	background-color: #294359;  
	color: #fff; 
	border-color: #1B65A6;
}

p.panel-body{
	padding-top: 0;
}

.panel-heading {
    padding: 12px 15px;
    border-bottom: none;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

h2.panel-title a{ 
	color: #fff; 
	font-size: 18px; 
	text-decoration: none;
	line-height: 1.5;

}

h2.panel-title a span{ 
	float: right;
}

h2.panel-title a:hover{
	 color: #1AC4F0; 
}

.panel-default>.panel-heading:hover{ 
	/*background-color: #333; */
}

h2.panel-title a::before{
	content: "\f02b";
	font-family: fontAwesome;
	color: #1AC4F0;
	float: left;
	margin-right: 5px;
 }



/*---- accordion end ---------*/
.BOXS {
	width: 100%;
	overflow: hidden;
	padding: 0px 5% 30px 5%;
	position:relative;
	z-index:11;
	background-color: #fff;
}

/*.clearfix::after{
	content:"";
	display:block;
	clear:both;
}*/

h4{
	color: #3260b4;
	font-size: 28px;
	font-weight: 500;
	line-height: 1.3;
}

p.grayBig{
	color: #3260b4;
	border-bottom: 1px solid #3260b4;
	font-size: 21px;
	font-weight: 600;
	text-indent: 10px;
	margin-bottom: 15px;
}

p.grayBig::before{
	content: "";
    width: 6px;
    height: 23px;
    background-color: #3260b4;
    display: inline-block;
    position: relative;
    left: -10px;
    top: 5px;
}

ul.gray, p.gray{
	color: #666;
	line-height: 1.8;
	font-size: 16px;
	margin-bottom: 30px;
	text-align: justify;
}

ul.gray{
	margin-left: 25px;
	text-align: left;
}

ul.gray2{
	margin-bottom: 60px;
}

ul.gray li{
	font-size: 16px;
	line-height: 1.5;
	margin-bottom: 10px;
}

ul.gray li::before {
    content: "\f02b";
    font-family: "FontAwesome";
    float: left;
    margin-left: -25px;
}

.info{
	width:100%;
	height:auto;
	padding-top: 10px;
	padding-bottom: 30px;
}

.W1{
	display:block;
	width:100%;
	height:40px;
	margin-bottom:15px;
	margin: 0 auto;
	}

.W2-1{
	background-color: #dae5f9;
}

.W2-2{
	background-color: #e6f2fc;
}	

.W1 ul li{
	width:85%;
	float:right;
	line-height: 1.5;
	color: #666;
	margin-top:5px;
	padding-left:10px;
	font-size:16px;
	/*text-shadow: 1px 2px 0 rgba(0,0,0,0.2);*/
}

.W1 ul li:nth-child(even){
	margin-top: 8px;
}

.W1 ul li.sub{
	width:15%;
	float:left;
	padding-left:0;
	background-color:#3260b4;
	color:#fff;
	text-align:center;
	padding-top: 3px;
	padding-bottom: 3px;
}


.CTA{
	margin: 0 auto;
	width: 250px;
}

.C{
	font-size: 19px;
}	






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

}

/* --平板版型-------------------------------------*/
@media screen and (max-width:1200px) {
.W2{ height:60px;}
}



	
/* --平板版型1-------------------------------------*/
@media screen and (max-width:1023px) {
#FORM_BLOCK{ padding-bottom: 50px;}
.GIFT{ float:none; width:90%;}
#FORM { float:none; width:80%;}
.W1 ul li{ width:80%;}
.W1 ul li.sub{ width:20%;}
.subImg, .tagImg{ margin-left: -40%; }
h1{ font-size: 38px; }
}




@media screen and (max-width:990px) {
.W3{ height:60px;}
}



/* --平板版型2-------------------------------------*/
@media screen and (max-width:767px) {
.TOP{
	display:block;
	position:relative;
	background:url(../images/top_img_768.jpg) no-repeat;
	width:100%;
	height:0;
	padding-bottom: 104.1666666666667%;
	background-size:100% auto;
	min-height: 330px;
}
.subImg, .tagImg{ margin-left: 0; }
.subImg{ margin-top: 15%; }
.tagImg{ margin-bottom: 10px; }
h1{ display: block; text-align: center; margin-bottom: 15px;}
.CTA1{ display: block; }
h4{ margin-top: 30px;}
.W1{ height:auto; margin-bottom:25px;}
.W1 ul li, .W1 ul li.sub{width:100%; float:none; text-align: center;}
.W1 ul li.sub{ margin-bottom: 10px; }
.textBOX{ text-align: center; height: auto; padding-top: 0; padding: 3%; margin-bottom: 15px;}
.textBOX img, .textBOX p{ display: inline-block; vertical-align: middle;}
.textBOX img{ max-width: 70px; margin-right: 10px;}
}	

/* --手機版型1-------------------------------------*/
@media screen and (max-width:639px) {
h1{ font-size: 28px; }
.subImg{ margin-bottom: 0;}
.tagImg{ margin-bottom: 0; }
h2, .h2{ font-size: 28px;}
.h3{ font-size: 25px; }
.courseTitle{ font-size: 20px; }
#MAIN ul#tabMenu li { width: 48%; margin: 1%;}
#MAIN ul#tabMenu li:nth-child(1), #MAIN ul#tabMenu li:nth-child(4){ width: 48%; margin: 1%;}
#MAIN ul#tabMenu li a span { margin-bottom: 0; display: inline-block;  }
#MAIN ul#tabMenu li a{ font-size: 15px; line-height: 1.3; display: inline-block;}
h2.panel-title a span, h2.panel-title a::before{ display: none; }
h2.panel-title a{ font-size: 16px; }

}

/* --手機版型2-------------------------------------*/
@media screen and (max-width:479px) {
.TOP, #FORM_BLOCK, .CONTENT1, .CONTENT2, .CONTENT3{ min-width:320px;}
.subImg{ margin-bottom: -5px;}
.tagImg{ margin-bottom: -5px; }
h1{ font-size: 20px; margin-bottom: 35%;}
h4{ font-size: 25px;}
h2 span{ display: block; }
.info{ padding-bottom: 20px; }
.W1 ul li{ text-align: left; }
h3{ font-size: 20px; }
.h3{ font-size: 23px; }
#FORM { width:90%;}
#FORM #GIFTS, #FORM #NAME, #FORM #PHONE, #FORM #EMAIL{ width:100%; margin-right:0;}
.row_box{padding: 50px 15px 10px 15px; }
h2.panel-title a{ font-size: 17px; }

}

/* --手機版型3-------------------------------------*/
@media screen and (max-width:385px) {

}

/* --電腦版型w320以下-------------------------------------*/
@media screen and (max-width:359px) {
h1{ font-size: 18px; }

}