@import url('https://fonts.googleapis.com/css2?family=Poetsen+One&display=swap');

body,html{font-family:'Open Sans',sans-serif;text-rendering:optimizeLegibility!important;-webkit-font-smoothing:antialiased!important;color:#656c6d;width:100%!important;height:100%!important}
body{ background: url("../img/bg.png") repeat; overflow-x: hidden;}
h1{font-weight:700}
h1 strong{font-weight:900}
h2{line-height:20px;margin:0;color:#121d1f;font-weight:400;margin-bottom:30px;font-size:34px}
h3,h4{color:#121d1f;font-size:20px;font-weight:600}
h5{text-transform:uppercase;font-weight:700;line-height:20px}
p.intro{font-size:16px;margin:12px 0 0;line-height:24px;font-family:'Open Sans',sans-serif}
a{color:#333}
a:hover,a:focus{text-decoration:none;color:#7bc3d1}
ul,ol{list-style:none}
.clearfix:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}
.clearfix{display:inline-block}
* html .clearfix{height:1%}
.clearfix{display:block}
ul,ol{padding:0;webkit-padding:0;moz-padding:0}
hr{height:4px;width:70px;text-align:center;position:relative;background:#fe3b39;margin:0 auto;margin-bottom:30px;border:0}


/* 共用 */



.btnn, .btnn2, .btnn3, .btnn4, .btnn5{display:block;min-width:200px;border-radius:4px;font-size:2.4rem;text-transform:uppercase;font-weight:700;text-align:center;text-decoration:none;overflow:hidden;transition:.5s;padding:10px 20px;margin: 10px 15px;}

.btnn{background:#d9534f;border:2px solid #d9534f;color:#fff;}
.btnn:hover, .btnn:focus{color:#d9534f; background:#fff;}
.btnn:hover i.fa{ color:#d9534f;}
.btnn2{background:#fb7600;border:2px solid #fb7600;color:#fff;}
.btnn2:hover, .btnn2:focus{color:#fb7600; background:#fff;}
.btnn2:hover i.fa{ color:#d9534f;}
.btnn3{background:#8e5ccb;border:2px solid #8e5ccb;color:#fff;}
.btnn3:hover, .btnn3:focus{color:#8e5ccb; background:#fff;}
.btnn3:hover i.fa{ color:#8e5ccb;}
.btnn4{background:#fff;border:2px solid #a353c8;color:#a353c8;}
.btnn4:hover, .btnn4:focus{color:#fff; background:#a353c8;}
.btnn4 i.fa{ color:#a353c8;}
.btnn4:hover i.fa{ color:#fff;}
.btnn5{background:#41b2ab;border:2px solid #41b2ab;color:#fff;}
.btnn5:hover, .btnn2:focus{color:#41b2ab; background:#fff;}
.btnn5:hover i.fa{ color:#41b2ab;}



.section-title img{width: 100%; max-width: 841px; margin: 0 auto;}


.hidden-lg{ display: none;}
.hidden-sm{ display: block;}
@media  (max-width: 992px) {	
	.hidden-lg{ display: block;}
	.hidden-sm{ display: none;}
}


/* nav Section */
#nav{z-index:9999;position:fixed;width:100%;top:50px}
.navbar-custom{margin-bottom:0;background-color:#b12725;border-radius:0;padding:10px 0;}
.navbar-custom .navbar-brand{font-weight:600}
.navbar-custom .navbar-brand:focus{outline:0}
.navbar-custom .navbar-brand img{ height: 40px; position: relative; top: -10px;}
.navbar-custom .navbar-brand .navbar-toggle:focus,.navbar-custom .navbar-brand .navbar-toggle:active{outline:0}
.navbar-custom a{color:#fff; font-size: 18px; line-height: 160%;}
.navbar-custom .nav li a{text-transform:uppercase;letter-spacing:1px;-webkit-transition:background .3s ease-in-out;-moz-transition:background .3s ease-in-out;transition:background .3s ease-in-out}
.navbar-custom .nav li a:hover{outline:0;color:#f6fe00;background-color:transparent}
.navbar-custom .nav li a:focus,.navbar-custom .nav li a:active{outline:0;background-color:transparent;color:#f6fe00}
.navbar-custom .nav li.active{outline:0}
.navbar-custom .nav li.active a{background-color:rgba(255,255,255,.8)}
.navbar-custom .nav li.active a:hover{color:#fff}

@media (max-width: 1200px) {
    .navbar-header{float:none}
	.navbar-toggle{display:block; font-size: 30px; margin: 0; padding: 0;}
	.navbar-collapse{border-top:1px solid transparent;box-shadow:inset 0 1px 0 rgba(255,255,255,0.1)}
	.navbar-collapse.collapse{display:none!important}
	.navbar-nav>li{float:left;}
	.navbar-nav>li>a{padding-top:10px;padding-bottom:10px}
	.navbar-text{float:none;margin:15px 0}
	.navbar-collapse.collapse.in{display:block!important}
	.collapsing{overflow:hidden!important}
	
}

@media(max-width:768px) {
	.navbar-custom{padding:0px 0;}
	.navbar-custom .navbar-brand img{ height: 30px; position: relative; top: -3px;}
	.navbar-custom .navbar-toggle{ font-size:25px;color:#fff; padding: 10px 15px 5px 0; margin: 0; line-height: 30px;}
}

/* KV Section */
#kv{ padding-top: 110px;}
#kv .container-fluid{ margin: 0; padding: 0; text-align: center;}
.kvbg{ background: url("../img/kv-bg.png") center bottom no-repeat; background-size: cover;}
@media  (max-width: 992px) {	
	#kv{ padding-top: 100px;}
}



#junier, #howtoread, #double, #knowledge, #course108 .container{ padding: 120px 0 0 0;}


/* junier Section */
#junier { position: relative; top: -100px; margin-bottom: -100px; padding-bottom: 80px;}
#junier img{ margin: 0 auto;}

/* howtoread Section */
#howtoread { background: url("../img/bg-howtoread.png") center top no-repeat; background-size: cover;}
#howtoread-main { background: url("../img/bg-howtoread2.png") center bottom no-repeat; background-size: cover; padding-bottom: 120px;}
#howtoread-main img{ margin: 0 auto;}


/* junier Section */
#double { padding-bottom: 120px;}
.doubleB, .doubleC{ margin: 30px auto;}
.A-price{ background-color: #eee5c3; border-radius: 20px; padding: 20px; text-align: center; margin: 30px 0 20px 0;}
.A-price img, #double img{ margin: 0 auto;}
.B-price{ background-color: #d9f6f4; border-radius: 20px; padding: 20px; text-align: center; margin: 30px 0 20px 0;}
.C-price{ background-color: #efe8f8; border-radius: 20px; padding: 20px; text-align: center; margin: 30px 0 20px 0;}
#double .notice-text{ display: block; width: 90%; margin: 0 auto;}
#double .notice-text h4{ margin-top: 35px; border-bottom: 2px solid #8e5ccb; display: table; text-align: center; padding-bottom: 6px;}
#double ul .notice-ul{list-style-position: inside;}
#double li{ text-align: left; line-height: 150%; font-size: 16px;text-indent: 0em; list-style:square; margin-left: 20px; padding-bottom: 10px;}
#double li::marker{ font-size: 25px; color:#8e5ccb;}



/* howtoread Section */
#knowledge { background: url("../img/bg-knowledge.png") center top no-repeat; background-size: cover;}
#knowledge-main { background: url("../img/bg-knowledge2.png") center bottom no-repeat; background-size: cover; padding-bottom: 120px;}
.knowledge-block{ margin: 50px auto 0 auto;}
#knowledge-main img{ margin: 0 auto;}

.video-container{position:relative;padding-bottom:56.25%; padding-top:0px;height:0;overflow:hidden; text-align: center; width: 90%; margin: 0 auto;}
.video-container iframe,.video-container object,.video-container embed{position:absolute;top:0;left:0;width:100%;height:100%;}

/* junier Section */
#course108 { }

/* notice Section */
#notice{ margin: 70px auto;}
.notice-text{ display: block; width: 80%; margin: 0 auto;}
ul .notice-ul{list-style-position: inside;}
#notice li{ text-align: left; line-height: 180%; font-size: 16px;text-indent: 0em; list-style:disc;}
#notice li::marker{ font-size: 25px; color:#fe3b39;}



/* Footer Section*/
#footer{background:#121d1f;color:#A6A6A6;padding:30px 0 25px}
#footer p{font-size:13px; line-height: 140%;}
#footer a{color:#a0a5a5}
#footer a:hover{color:#fe3b39}


/* Media Queries */
@media(max-width:768px) {
.junier-book img{ width:80%; margin: 0 auto;}
	.knowledge-block{ margin: 10px auto 0 auto;}
	#double { padding-bottom: 60px;}
	#knowledge-main { padding-bottom: 60px;}
}

@media(min-width:992px) {

}

@media(min-width:1200px) {

}