@charset "utf-8";
/*此版修改者(Dee)2016-01-25編修版本 */
body { 
font-family: "Microsoft YaHei" ! important;
background-color:#FFF;
}
/* 這是設定所有放大縮小的物件是使用移動方式變化 */
.move{-webkit-transition: all 0.6s;
	-moz-transition: all 0.6s;
	-ms-transition: all 0.6s;
	-o-transition: all 0.6s;
	transition: all 0.6s;}
.NO{ display:none;}
/*表頭表尾 請勿砍*/
.header, .footer{
    line-height: 0px; width:100%;
}
.BRR{height:1px;}
.header{
    z-index: 99;
    position: relative;
}
/*主外框-------------*/
#wapper {
	width: 100%; overflow:hidden;
}
#wapper .form-control{  margin:0 auto;margin-bottom:10px; width:92%;}
/*BANNER區塊--------------*/
.banner{ position:relative; overflow:hidden;}
img.banner001, img.banner002, img.banner003, img.banner004,img.banner005,img.banner006,img.subtitle,img.experience,img.banner007,img.banner008,img.banner009,img.subtitle_960{position:absolute;}
img.banner001{-webkit-animation-delay:0.3s;  animation-delay:0.3s;}
img.banner002{-webkit-animation-delay:0.5s; animation-delay:0.5s;}
img.banner003{-webkit-animation-delay:0.7s; animation-delay:0.7s;}
img.banner004{-webkit-animation-delay:0.7s;animation-delay: 0.8s;}
img.banner005{-webkit-animation-delay:0.9s; animation-delay:0.9s;}
img.banner006{-webkit-animation-delay:0.3s; animation-delay:0.3s;}
img.subtitle{-webkit-animation-delay:0.9s; animation-delay:0.9s;}
img.banner007{-webkit-animation-delay:0.9s;animation-delay: 1s;}
img.banner008{-webkit-animation-delay:0.9s;animation-delay: 1s;}
img.banner009{-webkit-animation-delay:0.9s;animation-delay: 1s;}
img.subtitle{-webkit-animation-delay:0.9s; animation-delay:0.9s;}
img.experience{-webkit-animation-delay:0.9s; animation-delay:0.9s;}
img.yellow{ margin-top:6px; margin-left:8px;}
img.subtitle_960{-webkit-animation-delay:0.9s; animation-delay:0.9s;}

.width1280{ max-width:1280px; min-width:280px; height:auto; margin:0 auto;}/*寬1280 居中的框架*/
.topICON{ text-align:center; padding-top:20px; padding-bottom:20px;}
.myButton {
	-moz-border-radius:28px;
	-webkit-border-radius:28px;
	border-radius:28px;
	display:inline-block;
	cursor:pointer;
	color:#5a2d1d;
	font-size:20px;
	padding:9px 33px;
	text-decoration: none;
	border:3px #5a2d1d solid;
	font-weight: bold;
}
.myButton:hover {
	background-color:#5a2d1d;text-decoration: none; color:#FFF;
}
.myButton:active {
	position:relative;
	top:1px;
}
/*填寫資料區塊--------(此區盡量別改)-------------------------填寫資料區塊------*/
.fill {
	background-image: url(../images/bg.png);
	max-width: 1980px;
	max-height: 447px;
	width: 100%;
	height:auto;
	text-align: center;
	margin: 0 auto;

}
.fill h2{ color:#0f1f41; font-style:normal; line-height:1em; font-weight:bold; text-align:center; z-index:5;}
.fill h2 .important{ font-style:italic; color:#ff1965; text-shadow: 0.08em 0em #ffffff}
.fill .confirm_A{ color:#5e5e5e;}/*我已詳細閱讀並接受*/
.fill .go_button{ margin-bottom: 20px;cursor:pointer; max-width:307px; width:100%; height:auto; margin-top: 0;}	
img.yellow{
	max-width: 534px;
	height: auto;
	width: 45vw;
	top: auto;
	left: 40%;
}
.fill .note{
	color: #FFF; font-size: 0.5em; letter-spacing:-.005em; font-weight: normal; display: inline-block;

}

/*分享按鈕*/
.share_icon {
}
.share_icon ul.share-buttons {
	list-style: none;
	padding: 0;
}
.share_icon ul.share-buttons li {
	display: inline;
	padding-left: 5px;
	padding-right: 5px;
}

/*分享按鈕-結束----------------------------填寫資料區塊-結束----------------------*/

/*段落標題--通用*/
.title{text-align:center;position:relative;padding-bottom: 12px;padding-top: 16px;}
.title h2{color:#000;font-weight:bold;line-height: 1.5em;text-align: center;}
.title .big{ font-size:48px}

/*img--通用*/
img.pic01{
	max-width: 385px;
	min-width: 280px;
	height: auto;
	width: 22vw;
	display: block;
	margin: auto;
	margin-top: 20px;
	margin-bottom: 20px;
	}
img.pic02{
	max-width: 385px;
	min-width: 280px;
	height: auto;
	width: 25vw;
	display: block;
	margin: 20 auto;
}

img.pic03{
	max-width: 75%;
	min-width: 30%;
	height: auto;
	width: 75vw;
	display: block;
	margin: auto;
}


/*--------------------------以下內容開始---------------------------------------*/


/*狀元奇機高效學習三步驟  內文*/
.Answer{
	background-image: url(../images/bg_02.png);
	background-repeat: repeat;
	background-size: auto;
	padding-top: 0px;
	padding-bottom: 25px;
	padding-left: 0px;
	padding-right: 0px;
	background-position: center;
}
.Answer h1{font-size:32px;font-weight:normal;color:#ffffff;line-height: 1.5em;text-align: center; letter-spacing:0.15em; padding-top: 5%; padding-bottom: 3%; }
.Answer h1 .bold{font-weight:bold;}
.Answer h1 .important{font-weight:bold; color:#ffa200; text-shadow: 0.08em 0em #000000;}
.Answer .method{ display: inline-block;}
.Answer h2{
	font-size: 28px;
	font-weight: bold;
	color: #014558;
	line-height: 2em;
	letter-spacing: 0.055em;
}
.Answer h3{font-size:18px;font-weight:bold;color:#84a7dc;line-height: 1.3em;}
.Answer h4{font-size:30px;font-weight:bold;color:#63d3bf;line-height: 1.2em;}
.Answer p{font-size:18px;color:#535353;line-height: 1.5em;padding-top: 23px;}
.Answer .CON_TXT{
	max-width: 100%;
	height: auto;
	padding-left: 5%;
	text-align: left;
	background-color: #FFF;
	padding-top: 1%;
	padding-bottom: 1%;
	margin: auto;
	line-height: 0;
	margin-top: 8.5%;
	
}  
#bgshadow{ position:absolute; z-index:7; max-width:1920px; width:100vw; height:auto; left:0%;}

/*他們都靠狀元奇機*/
.Why{
	background-image: url(../images/bg_second.png);
	background-repeat: repeat;
	background-position: center;
	text-align: center;
	overflow: auto;
}
.Why .row{
	background-image:url(../images/hao%20bg.png);
	background-repeat: no-repeat; 
	padding-top: 100px;
	padding-bottom: 50px;
	background-size: 1280px 626px;}
	
	#kuo{
	background-image: url(../images/kuo%20bg.png);
	background-repeat: no-repeat; 
	padding-bottom: 50px;
	background-size: 1280px 604px;}
	
.title h2{font-size:32px;/* font-style:italic; */font-weight:bold;text-align:center;color:#59493f;line-height: 1.5em;padding-bottom:10px;}
.Why .title .important{color:#0068b7;}
.Why .content h1{
	font-size: 26px;
	font-weight: bold;
	text-align: center;
	color: #f89811;
	padding-bottom: -8px;
	letter-spacing: 0.035em;
	padding-top: 20px;
}
.Why .content h1 .important{ font-weight:bolder; color:#000;letter-spacing:0.045em;}
.Why .content h2{font-size:24px;font-weight:bold;text-align:center;color:#f9a52f;padding: 0px 10px; text-decoration:underline; letter-spacing:0.045em;}
.Why .content h3{ font-size:23px;font-weight:bold;text-align:center;color:#0068b7;}
.Why .content p{
	font-size: 20px;
	text-align: justify;
	text-align-last:left;
	color: #2f2f2f;
	line-height: 1.95em;
	padding-top: 40px;
	padding-right: 80px;
	padding-bottom: 40px;
	padding-left: 80px;
}
#basketball {position:absolute; z-index:7;max-width: 270px;height:auto;width: 32vw; top: 0%;left: 58%; }
#talent {position:absolute; z-index:7;max-width: 270px;height:auto;width: 32vw; top: 0%;right: 62%; }
#clip{ margin-top:50px; margin-left:15%; width: 70%; height: auto; }


/*	↓↓↓↓	螢幕尺寸大於768時頁面顯示效果↓↓↓↓	 */ 
@media (min-width: 960px) {
.BRR{height:1px; display: none;}


.fill h2{font-size: 28px; letter-spacing: 0.15em;}
/*banner*/
img.big_banner{max-width:1920px;height:auto; width:100%}
img.min_banner{ display:none;}
img.banner001{
	max-width: 598px;
	height: auto;
	width: 35vw;
	z-index: 1;
	top: 11%;
	left: 33%;
}
img.banner002{max-width: 873px;height:auto;width: 44vw;z-index: 1;left: 27.5%;top: 30%;}
img.banner003{max-width: 335px;height:auto;width: 17vw;z-index: 5;top: 73%;left: 41%;}
img.banner004{max-width: 324px;height:auto;width: 17vw;z-index: 5;top: 65%;left: 60%;}
img.banner005{max-width: 315px;height:auto;width: 17vw;z-index: 5;top: 85%;left: 55%;}
img.banner006{
	max-width: 268px;
	height: auto;
	width: 13vw;
	z-index: 5;
	top: 2%;
	left: 52%;
}
img.subtitle{max-width: 929px;height:auto;width: 42vw;z-index: 5;top: 51%;left: 29%;}
img.experience{max-width: 326px;height:auto;width: 20vw;z-index: 5;top: 62%;left: 23%;}
img.banner007{max-width: 489px;height:auto;width: 25vw;z-index: 5;top: 24%;left: 43%;}
img.banner008{display:none;}
img.banner009{display:none;}
img.subtitle_960{display: none;}


/*段落標題--通用*/
.title {background-image:url(../images/bar.jpg);background-repeat: no-repeat;background-position:center;text-align:center;overflow:auto;}
.title h2{font-size: 38px;color:#FFF;} 


/*other*/
.fill h2 .small{ padding-left:25px;}
.Why{padding-top:10px; padding-bottom:20px;}
img.picbig{ display:block;}
img.picmini{ display:none;}

#honor_960{ display: none;}
}


/* ↓↓↓↓ pad 豎屏時, 頁面顯示尺寸 300 < x <960 時,顯示效果 ↓↓↓↓  */
@media (min-width: 300px) and (max-width:960px) {
.BRR{height:1px; display:block;}
.fill h2{font-size: 30px;}
.fill {
	background-image: url(../images/bg_960.png);
	max-width: 960px;
	max-height: 626px;
	text-align: center;
	margin: 0 auto;

}	
/*BANNER背景標題-------------------------------------*/
img.big_banner{ display:none;}
img.min_banner{max-width:960px;height:auto;width: 100%;}
img.banner001{display:none;}
img.banner002{display: none;}
img.banner003{max-width: 300px;height:auto;width: 56vw;z-index: 5;right: 2%;top: 70%; transform:rotate(-3deg);}
img.banner004{max-width: 300px;height:auto;width: 56vw;z-index: 5;bottom: 12%;left: 58%;}
img.banner005{max-width: 300px;height:auto;width: 56vw;z-index: 5;top: 90%;left: 55%;}
img.banner006{display:none;}
img.banner007{display:none;}
img.banner008{
	max-width: 676px;
	height: auto;
	width: 68vw;
	z-index: 5;
	top: 5%;
	left: 27%;
}
img.banner009{max-width: 785px;height:auto;width: 77vw;z-index: 5;top: 27%;left: 16%;}
img.subtitle{display: none;}
img.experience{max-width: 373px;height:auto;width: 40vw;z-index: 5;top: 70%;left: 5%;}
img.subtitle_960{max-width: 605px;height:auto;width: 68vw;z-index: 5;top: 47%;left: 12%;}
#honor{ display: none;}
#honor_960{ width: 100%; height:auto;}

img.picbig{ display:none;}
img.picmini{display:block;}
.Why .row{
	background-image:url(../images/hao%20bg_960.png);
	background-repeat: no-repeat; 
	padding-top: 100px;
	padding-bottom: 50px;
	background-size: cover;}
	
	#kuo{
	background-image: url(../images/kuo%20bg_960.png);
	background-repeat: no-repeat; 
	padding-bottom: 50px;
	background-size: cover;}
	
#clip{ margin-top:15px; margin-left:20%; width: 60%; height: auto; }



/*段落標題--通用*/
.Answer .CON_TXT{
	max-width: 100%;
	height: auto;
	margin: auto;
	padding-left: 5%;
	text-align: center;
	background-color: #FFF;
	
}    
.title { background-color:#f9c7c9;background-position:center;text-align:center;overflow:auto;}
.title h2{ color:#FFF; font-size:28px;}
.title .big{ font-size:20px}
.Answer h2{font-size:26px;font-weight:bold;color:#014558;line-height: 1em; text-align:center; letter-spacing:0.05em;}
.Answer h4{font-size:25px;font-weight:bold;color:#63d3bf;line-height: 1.2em;}
.Why .content p{
	font-size: 20px;
	text-align: justify;
	text-align-last:left;
	color: #2f2f2f;
	line-height: 1.95em;
	padding-top: 40px;
	padding-right: 10%;
	padding-bottom: 40px;
	padding-left: 10%;

/*other*/
.fill h2 .small{ padding-left:0px;}


/*手機板的FOOTER------別刪除*/
.FOOTER_frame{ height:430px;}
}

/*↓↓↓↓ 	螢幕尺寸【大於】481時頁面顯示效果	↓↓↓↓ */
@media (min-width: 481px) {

}





/*========================================================*/
/*↓↓↓↓ *螢幕尺寸【大於於】768時頁面顯示效果	↓↓↓↓ */
@media (max-width: 768px) {
}




/*↓↓↓↓ 	螢幕尺寸【小於】480時頁面顯示效果	↓↓↓↓ */
@media (max-width: 480px) {
.BRR{height:1px; display: none;}

img.banner003{max-width: 200px;height:auto;width: 40vw;z-index: 5;right: 1%;top: 72%; transform:rotate(-5deg);}
img.banner004{max-width: 200px;height:auto;width: 40vw;z-index: 5;bottom: 10%;right: 3%;}
img.banner005{max-width: 200px;height:auto;width: 40vw;z-index: 5;top: 90%;right: 3%;}
.fill h2{font-size: 20px; letter-spacing: 0.055em;}
img.yellow{
	width: 75vw;
	top: auto;
	left: 40%;
}
#honor{ display: none;}
#honor_960{ width:100%; height: auto;}
.Answer h1{font-size:23px;font-weight:normal;color:#ffffff;line-height: 1.5em;text-align: center; letter-spacing:0.15em; }

.Answer h2{
	font-size: 20px;
	font-weight: bold;
	color: #014558;
	line-height: 2em;
	letter-spacing: 0.055em;
}
.Answer ul{font-size:18px; text-align:left; line-height:1.5em;}

.Why .content p{
	font-size: 16px;
	padding-top: 20px;
	padding-right: 50px;
	padding-bottom: 40px;
	padding-left: 50px;
	text-align: justify;
	text-align-last:left;
}
.Why .content h1{
	font-size: 20px;
	padding-top: 0px;
	}
.Why .content h2{font-size:20px; padding-top: 0px;}
.Why .row{
	background-image:url(../images/hao%20bg_480.png);
	background-repeat: no-repeat; 
	background-size: cover;}
	
	#kuo{
	background-image: url(../images/kuo%20bg_480.png);
	background-repeat: no-repeat; 
	background-size: cover;}
#clip{ display: none;}



.fill .go_button{ margin-bottom: 20px;cursor:pointer; max-width:307px; width:75vw; height:auto; margin-top: -5%;}	
}





/*↓↓↓↓ 螢幕尺寸【大於】1024時頁面顯示效果	↓↓↓↓ */
@media (min-width:1024px) {
}

/*	↓↓↓↓ 螢幕尺寸【小於】1024時頁面顯示效果	↓↓↓↓ */
@media (max-width: 1023px) {

}
@media only screen and (max-width: 1280px) {

}