@import url("../../../icon_new_6.6/css/all.min.css");
/*DIY*/
:root{
	--bgcolor1:#EEE8E0;
	--bgcolor2:#FFFCE9;
	--join1:#a7302d;
	--join2:#09678d;
	--join3:#dfbd4a;
	--join4:#ffefbb;
	--white:#fff;
}
body *{font-family: 'Microsoft JhengHei' ,'Noto Sans TC', sans-serif;/*font-weight: ;*/}
#event_master,#event_sec,#event_third *{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
small{font-size: smaller;}

#event_master{margin: 0 auto;color: #111;text-align: center;}
#Master_title,#event_master a{c;}
#headerTabs > section.bg1:nth-of-type(odd){background: #eacab0;}
#headerTabs > section.bg1:nth-of-type(even){background: #e9dddb;}

/*設計專用樣式Start*/
/*主圖*/
#Master_title{width:1200px;margin: 0 auto;position: relative;}
#Master_title .top_h{position: absolute;left: 2%;top: 18%;}
#Master_title .top_step{position: absolute;top: 93%;z-index: 1;display: flex;left: 4%;}
#Master_title .top_step li:nth-child(1){left: 2%;animation: myfirst 3.8s infinite alternate 
ease-in-out;margin-right: -5rem;}
#Master_title .top_step li:nth-child(2){left: 8%;animation: myfirst 3.8s infinite alternate 
ease-in-out;margin-right: -5rem;}
#Master_title .top_step li:nth-child(3){left: 31%;animation: myfirst 3.8s infinite alternate 
ease-in-out;}
#Master_title .phone{display: none;}
.high {padding-top: 7rem;}
.bg0{background: url(../images/1510069_01.jpg) no-repeat center bottom;}
.bg1{background-color: #eacab0;}
.bg2{background-color: #e9dddb;}
.bg3{background-color: #bd2f08;}

.hero{display: flex;align-items: center;gap: 2rem;max-width: 1200px;margin: 0 auto;padding: 2rem 1rem 2.5rem;text-align: left;}
.hero_copy{flex: 1;}
.hero h1,.hero h2,.block_title,.stage_label,.teacher_subject,.teacher_name,.flow_step strong,.flow_step em,.quote footer,.price_box h3,.price_main{font-weight: bold;}
.hero h1{margin: 0 0 .4rem;font-size: 2.6rem;line-height: 1.35;}
.hero h2{margin: 0 0 1rem;font-size: 1.6rem;line-height: 1.45;}
.hero_points{display: flex;gap: .6rem;margin: 0;padding: 0;list-style: none;}
.hero_points li{flex: 1;padding: .75rem .4rem;text-align: center;font-size: 1.15rem;line-height: 1.7;}
.hero_points li span{display: block;}
.hero_points li:nth-child(1){background: #f6e4d8;}
.hero_points li:nth-child(2){background: #e5f0df;}
.hero_points li:nth-child(3){background: #e3eef6;}
.hero_logo{display: block;width: 220px;height: auto;margin: 0 0 .8rem;}
.hero_visual{flex: 0 0 42%;min-height: 220px;background: #f6f6f6;display: flex;align-items: center;justify-content: center;color: #c45c5c;font-size: 1.05rem;}

.block_title{margin: 2.5rem auto .4rem;font-size: 3.2rem;line-height: 1.4;font-family: 'Noto Serif TC', serif;font-weight: 700;position: relative;color: #443d2d;}
.block_title::before {content: "";position: absolute;bottom: -5px;left: 0%;width: 100%;height: 5px;transform: rotate(0deg);background: linear-gradient(90deg, #a38079 5%, #faf4ec 30%, #d1b5b0 60%,#faf4ec 80%, #a38079 100%);border-radius: 2px;}
.block_title span{font-family: 'Noto Serif TC', serif;}

.block_title strong{color: #bd2f08;font-family: 'Noto Serif TC', serif;font-weight: 900;}

.block_lead{margin: .4rem auto 1rem;font-size: 1.4rem;background: linear-gradient(to right, #ffffff00 0%, #cfb4ae 20%, #ffffff 60%, #cfb4ae 80%, #ffffff00 100%);padding: 0.5rem;color: #8f0d0d;font-weight: bold;}
.stage_note{margin: .4rem auto 1rem;font-size: 1.0rem;text-align: right;}
.stage_note strong{color: #bd2f08;border-bottom: dotted 1px;margin: 0 0.3rem;}

.block_card{background: #fff;padding: 1rem 2.0rem;border-radius: 0 0 1.0rem;}

.pain_list,.quote_list{display: grid;gap: 1rem;margin: 0 0 1rem;padding: 0;list-style: none;text-align: left;}
.pain_list{grid-template-columns: 1fr 1fr;}
.pain_list h3{margin: 0 0 .35rem;font-size: 1.6rem;font-weight: bold;color: #436a91;border-left: solid 7px;padding-left: 1rem;}
.pain_list p,.flow_step p{margin: 0;font-size: 1.05rem;line-height: 1.7;}
.quote p{margin: 0;font-size: 1.3rem;line-height: 1.7;}
.quote p strong{color: #436a91;}
.flow_step p a{text-decoration: underline;font-weight: bold;}
.stage{margin: 0 0 1.25rem;padding: 1rem;text-align: left;border-radius: 2.0rem 0 0 2.0rem;}
.stage_1{background: #fff;border-left: solid 15px #bd2f08;}
.stage_2{background: #f3eee6;border-left: solid 15px #24609c;}
.stage_label{display: inline-block;margin: 0 0 1rem;font-size: 1.5rem;}
.stage_label .f1{color: #bd2f08;font-size: 2.0rem;}
.stage_label .f2{color: #24609c;font-size: 2.0rem;}

.flow{display: flex;flex-wrap: wrap;align-items: stretch;gap: .6rem;margin: 0;padding: 0;list-style: none;}
.flow_step{flex: 1 1 200px;}
.stage_1 .flow_step{background: #f7f4ef;}
.flow_step strong,.flow_step em{display: block;font-style: normal;}
.flow_step strong{margin: 0 0 .15rem;font-size: 1.45rem;color: #bd2f08;}
.flow_step strong.f_b{color: #24609c;}

.flow_step em{margin: 0 0 .45rem;background: linear-gradient(to right, #bd2f08 65%, #ffffff00 100%);color: white;padding: 0.2rem 0.5rem;}
.flow_step em.bg_b{background: linear-gradient(to right, #24609c 65%, #ffffff00 100%);}

.flow_arrow{align-self: center;font-size: 1.8rem;font-weight: bold;color: #a7857e;}

.teacher_slider{position: relative;margin: 0 1.6rem 1rem;text-align: left;}
.VueCarousel-slide{padding: 0 .45rem;}
.teacher_card{height: 100%;text-align: center;}
.teacher_subject{margin: 0;font-size: 1.3rem;color: #dd3e13;border-bottom: dotted 1px;}
.teacher_photo,.photo_slot{width: 140px;height: 160px;margin: .6rem auto;background: #f3f3f3;display: flex;align-items: center;justify-content: center;overflow: hidden;border-radius: 1rem;}
.teacher_photo img{width: 100%;height: 100%;object-fit: cover;object-position: top;display: block;}
.teacher_name{margin: 0 0 .35rem;font-size: 1.1rem;color: #24609c;}
.teacher_cv{margin: 0 0 .5rem;padding: 1.0rem;text-align: left;font-size: 1.0rem;line-height: 1.65;border-left: solid 8px #e8d5d1;background-color: #f8f5f2;border-radius: 1.0rem 1.0rem;}
.teacher_cv li a{text-decoration: underline;}

.teacher_date{margin: 0;font-size: 1.05rem;color: #bd2f08;font-weight: bold;white-space: nowrap;}
.bw_btn{display: inline-block;margin-top: .55rem;padding: .25rem .9rem .25rem 3rem;background: #bd2f08;color: #FFF;text-decoration: none;position: relative;white-space: nowrap;}
.teacher_date .bw_btn{margin: 0 0 0 .4rem;padding: .15rem .55rem .15rem 2.2rem;vertical-align: middle;}
.teacher_date .bw_btn::before{left: .35rem;padding-right: .3rem;}
.bw_btn::before {content: "\f025";position: absolute;top: 0.1rem;left: 0.5rem;font-size: 1.2rem;color: #eacab0;font-weight: bold;font-family: "Font Awesome 5 Free";border-right: solid 1px;padding-right: 0.5rem;}
button.VueCarousel-navigation-button{top: 50%;padding: 0;border: none;background: transparent;color: #333;box-shadow: none;outline: none;cursor: pointer;transform: translateY(-50%);}
button.VueCarousel-navigation-button.VueCarousel-navigation-prev{left: 0;}
button.VueCarousel-navigation-button.VueCarousel-navigation-next{left: auto;right: 0;}
.VueCarousel-inner{transition: transform .5s ease !important;}

.quote{margin: 0;}
.quote figure{margin: 0 1.5rem 1rem 0;float: left;border-right: solid 5px #efe3e1;padding: 1.0rem 1.0rem 1.0rem 0;}

.quote p{margin: 0 0 .4rem;}
.quote footer{font-size: 1.2rem;color: #bb885f;}
.price_wrap{display: flex;align-items: center;justify-content: center;gap: 1.5rem;flex-wrap: wrap;margin: 1.5rem auto;}
.price_box{max-width: 720px;margin: 0;text-align: center;color: white;font-size: 1.8rem;}
.buy_line{display: inline-flex;align-items: center;gap: .45rem;padding: .75rem 1.45rem;background: #06C755;color: #fff;font-size: 1.35rem;font-weight: bold;text-decoration: none;border-radius: 50rem;white-space: nowrap;box-shadow: 0 4px 0 #049a43;}
.buy_line i{font-size: 1.55rem;line-height: 1;}
.buy_line:hover{background: #05b34c;color: #fff;}
.price_box h3{margin: 0 0 .5rem;font-size: 2.8rem;color: #ffe3d4;}
.price_box p{}
.price_box p .class{font-size: 3.0rem;font-weight: bold;}
.price_box p .sale{font-size: 2.25rem;color: #fff0d0;font-weight: bold;}
.price_note{font-size: 1.0rem;margin: 2.0rem 0 0rem;}
.price_main{font-size: 2.0rem;background: linear-gradient(to right, #ffffff00 0%, #cfb4ae 20%, #ffffff 60%, #cfb4ae 80%, #ffffff00 100%);color: #24609c;margin: 1.2rem 0 0.3rem;}

.faq_list{margin: 1rem 0 2rem;}
.faq_item{margin: 0 0 1rem;text-align: left;}
.faq_item dt{margin: 0 0 .45rem;font-size: 1.35rem;font-weight: bold;color: #24609c;}
.faq_item dd,.faq_item p{margin: 0;font-size: 1.05rem;line-height: 1.75;}
.faq_item p + p{margin-top: .45rem;}
.faq_item a{color: #bd2f08;font-weight: bold;text-decoration: underline;}
.faq_more{margin: .9rem 0 0;padding: .85rem 1.15rem;background: #fff6ee;border: 2px solid #bd2f08;border-radius: 1rem;box-shadow: 5px 5px 0 #eacab0;}
.faq_more p{font-size: 1.15rem;font-weight: bold;color: #443d2d;}
.faq_more a{display: inline-block;margin-left: .35rem;padding: .05rem .15rem;color: #24609c;font-size: 1.25rem;background: #fff;}

.bg_padding{padding:1%;}
/*所有元素漸變0.5秒*/*{transition: all .5s;}



/*各大相容檢視*/
@media screen and (-webkit-min-device-pixel-ratio:0) { /*Webkit*/
}
@-moz-document url-prefix(){/*Firefox*/
}

@media \0screen\,screen\9 {/*IE 6 7 8*/
}

@media screen\0 {/*IE 8 9 10 11*/
}

@media print {
}

/*Back to top button */
#back-top{position:fixed;bottom:30px;margin-left:-150px;right:1%;z-index:99}#back-top a{width:50px;height:50px;border-radius:50%;display:block;text-align:center;font:11px/100% Arial,Helvetica,sans-serif;text-transform:uppercase;text-decoration:none;color:#bbb;transition:1s}#back-top a:hover{color:#000}#back-top span{width:50px;height:50px;display:block;margin-bottom:7px;background:rgba(99,99,99,0.74) url(../images/up-arrow.png) no-repeat center center;border-radius:50%;transition:1s}#back-top a:hover span{background-color:#777}

/*ask*/
#askarea SELECT {color: black;background-color: white;}
#askarea_out{background-color:#a7302d;}
#askarea{width: 1200px;margin: 0 auto;padding: 1rem 5rem;text-align: left;}
#askarea .asktitle {color: white;text-align: center;font-size: 2rem;margin: 17px;}
#formlist SELECT,#formlist input{border-radius: 0.3rem;background-color: #FFF;border: #FFF;padding: 0.25rem;}
#askarea SELECT{background-color: #FFF;border: #FFF;padding: 0.5%;margin:auto 1% 1% auto;}
#formlist label{display: block;margin: 1rem 0;color: white;font-size: 1.2rem;}
#formlist img{display: inline-block;}
#formlist input{color: #585858;}
#askarea input[type="submit"],#askarea input[type="reset"]{padding: 0.5em;margin-top: 2%;border: 2px #fff solid;color: #ffffff !important;}
#askarea input[type="submit"]{background-color: #094d6d;}
#askarea input[type="reset"]{background-color: #8d9297}
label > select {margin: 0 1rem;}
#formlist{justify-content: space-around;}
#askarea textarea[name="sContent"]{width:98%;height:300px;font-size: 1.15em;border: 7px #ffcac3 solid;padding: 10px}
#askarea input[type="text"]{width:32%;}
#askcontent{color:white;line-height: 2.5rem;}

@media (max-width: 1024px) {
	.hero{flex-direction: column;align-items: stretch;}
	.hero_visual{width: 100%;}
	.hero h1{font-size: 2rem;}
	.hero h2,.block_title{font-size: 1.7rem;margin: 1.5rem auto .4rem;}
	.hero_points{flex-direction: column;}
	.pain_list{grid-template-columns: 1fr;}
	.flow_arrow{flex: 1 1 100%;text-align: center;}
}

@media all and (min-width: 1px) and (max-width: 1200px){
    /*ask*/
    #askarea{width: 100%;padding: 0.8rem;}
    #askarea .asktitle{font-size: 1.1rem;}
    #askarea .asktitle > p{line-height: 2.2rem;}
    #formlist{margin: 0 auto;}
    #askarea input[type="text"],#askarea select{width:100%;}
    #askarea input[type="checkbox"]{width: initial;}
    #formlist label{font-size: 1.0rem;}
    #formlist input[name="sContent"],#formlist label,#formlist SELECT,#formlist input{margin: 0.25rem 0;}
    #formlist input[type="submit"],#formlist input[type="reset"]{width: calc(100%/4.5);}
	.bg0 {background-size: cover;}

}
@media (min-width: 992px) and (max-width: 1199px) {
}
@media (max-width: 767px) {
	.bg0 {background-size: cover;}
	#Master_title .top_step {left: 1%;}
	#Master_title .top_step li:nth-child(1) {margin-right: -3rem;}
	#Master_title .top_step li:nth-child(2) {margin-right: -3rem;}
	.high {padding-top: 1rem;}
	.block_title span,.price_box h3 span{display: block;}
	.price_box h3 {font-size: 2.0rem;}

}
	
}