@import url("../../../icon_new_6.2/css/all.css");
/*DIY*/

body *{font-family: 'Noto Sans TC', sans-serif;font-weight: ;}
#event_master *{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;}

/*舊稿複製*/
#Master_title{background: var(--green-blue);}
.banner{
	display: flex;justify-content: center;align-items: center;width: 1080px;height: 459px;
	background:var(--green-blue);margin: auto;flex-wrap: wrap;position: relative;z-index: 0;
}
.banner div{position: absolute;}
.banner div:nth-of-type(1){z-index: 2;left: 4.5rem;bottom: 3.5rem;animation: move 1s linear forwards infinite alternate;}
@keyframes move{
	0%{left: 4.5rem;}100%{left: 5.5rem;}
}
.banner div:nth-of-type(2){top: 0;left: 0;right: 0;z-index: 1;margin-bottom: -0.5rem;}
.yt_player_title,.price_caption div{font-size:2.3rem;color:var(--bgcolor1);text-align:center;background:black;display:inline-block;border-radius:8px;padding:0 3rem;font-weight:300;width:80%}
.yt_player_title img{display:inline;margin-top:-.5rem}
.yt_group:nth-of-type(1){border-right:dashed 1px #42220E}
.yt_group{width:calc(100%/2);padding:1rem;display:flex;flex-wrap:wrap;justify-content:center;gap:.3rem;margin:.8rem auto 1.5rem;font-size: 1.3rem;color: var(--deep_green);}
.yt_group dt{color:#42220E;font-size:1.8rem;font-weight:700;text-align:center;width:100%}
.yt_group dt > span{color:#d70101;font-size:1.3rem}
.price_caption{text-align:center;font-size:2.5rem;font-weight:700;font-family:"Microsoft YaHei";padding:10px 0}
.yt_group iframe{width: 30rem;height: 20rem;}
.price_caption h2{font-size:1.8rem;font-weight:400;line-height:2}
.more_link{margin:0 5px 3%;text-align:center}
.group{padding:.5rem}
.cube{background: var(--orange);padding: 0 .3rem;border-radius:6px;margin-left: .3rem;}
.offer_list dd span:is(.cube){color: white;}
.price_list dt > a,.more_link > a{color:var(--red1)}
.date_time{text-align:center;color:#fff;display:inline-block;border-radius:6px 6px 0 0;background-color:var(--deep_green);padding:0.2rem 3rem;width:100%}
.teacher_item{padding:10px;background:linear-gradient(to bottom,#fff69 10%,#eedad8cf 60%,#fff 90%);border-radius:10%;width:200px;height:200px}
figure{text-align:center}
.teacher{justify-content:center;gap:2rem;margin-bottom: 3rem;}
.teacher_item img{display:inline-block}
.teacher_item figcaption{background:var(--light_green);color:#fff;padding:2px 8px;text-align:center;border-radius:.5rem;display: grid;}
.teacher_item figcaption small{font-size: 0.8em;}
.tea_out{font-size: 1.2rem;margin-bottom: 1rem;}
.tea_out:not(:nth-of-type(n+1):nth-of-type(-n+3)){margin-bottom: 0;}
/*舊稿END*/
.offer_title{font-size: 2.3rem;font-weight: 900;margin: 1rem 0;}
.offer_title::before{content: '▶▶ ';font-size: 1.8rem;}
.offer_title span{color: var(--light_green);}
.offer_list{text-align: left;padding: 1rem .3rem;border:1px solid var(--line);}
.offer_list dt{background-color: var(--deep_green);border-radius: .5rem;width: max-content;padding: 0.2rem 1rem;font-size: 1.8rem;margin-top: 1rem;}
.offer_list dt:hover,.buy a:hover{transform: scale(1.1);}
.offer_list dt,.offer_list dt a{color: white;}
.offer_list dd{font-size: 1.4rem;line-height: 2.5rem;}
.offer_list dd span{color: var(--red1);}
.offer_inside{margin-left: 8.8rem;}
.offer_inside2{margin-left: 5.6rem;}
.group_list{padding: 0.5rem;}
.buy{font-size: 1.7rem;margin:2rem auto;text-align: center; }
.buy a{display: inline-block;padding: .2rem 2rem;border-radius:.5rem;background: var(--orange);color:white;}
.AD{width: 12rem;padding: 1rem;text-align: left;background-color: var(--deep_green);color:var(--bgcolor1);transition:all .3s linear;}
.AD:hover{width: 12.5rem;}
.AD dt{font-size: 1.5rem;}
.AD dd{font-size: 1.1rem;}
/*DIY END*/


:root{
	--bgcolor1:#F4E13B;
	--bgcolor2:#FFFCE9;
	--join1:#de523f;
	--join2:#00BCD4;
    --red1: #ED1B23;
    --coffee: #e6ae61;
    --orange: #ff7b15;
    --coffee2: #ca8b33;
    --orange2: #F3E0A8;
	--green-blue:#24ACB3;
	--deep_green:#005A5A;
	--light_green:#24ACB3;
	--line:#9E9E9F;
}
.bg1{background-color: var(--bgcolor1);padding-top: 1.3rem;margin-top: -.6rem;}
.bg2{background-color: var(--bgcolor2);}
.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: #eb543f;}
#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;width: 88px;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:767px){
	.banner{width: 100%;height: auto; background: var(--bgcolor1);display: grid;grid-template-columns: repeat(1, 1fr);grid-template-rows: 5rem 5rem 8rem;}
	@media screen and (max-width:500px){.banner{grid-template-rows: 5rem 5rem 6rem;}}
	@media screen and (max-width:390px){.banner{grid-template-rows: 4rem 4rem 4rem;}}
	.banner div:nth-of-type(1){grid-area: 3/1/4/3;left: 0;bottom: 0;padding: 0 1rem;}
	.offer_list dt{font-size: 1.4rem;}
	.bg1{padding-top:3rem;}
}
@media (min-width:768px) and (max-width:1199px){
	.banner{width: 100%;height:42vh;background: var(--bgcolor1);}
}


@media all and (min-width: 1px) and (max-width: 1200px){
	.yt_player_title,.price_caption div{font-size:1.7rem}
	.yt_group:nth-of-type(1){border-right:none}
	.yt_group,.yt_group dt,.yt_group dd{width:100%;text-align:center}
	.yt_group iframe{width:100%;height:20rem}
	.AD{width: 100%;text-align: center;column-gap: 1rem;align-items: center;}
	/*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);}
}