@import url("../../../icon_new_6.2/css/all.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@900&display=swap');
/*DIY*/

body {font-family: 'Noto Sans TC', sans-serif;color: var(--black);}
#event_master *{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;}
#Master_title img { max-width: 100%;height: auto; }
.bg0 { background: var(--deep_red); }
.bg1 { background: var(--linear2); }
:root{
	--black: #242424;
	--join1:#de523f;
	--join2:#00BCD4;
	--light_orange: #fdd900;
	--pink: #db3164;
	--pink2: #c11169;
	--deep_red: #aa0047;
	--golden: #a18d2f;
	--linear1: linear-gradient(to bottom, #910D36 68%, #aa0047 94%);
	--linear2: linear-gradient(to right, white 0%, #f0e8a2 64%, #fff36a 82%, var(--golden) 100%);
	--border-radius1: 6px;
	--ff1: "Noto Serif TC", serif;
	--text1: 2.8rem;
	--text2_b: 2.5rem;
	--text2: 2.2rem;
	--text3: 1.8rem;
	--text4: 1.6rem;
	--text5: 1.5rem;
	--text6: 1.3rem;
	--text7: 1.2rem;
	--text8: 1.1rem;
}
a { text-decoration: underline; }

/* main */
.banner { width: 100%;justify-content: center;align-items: center;background: var(--linear1);}
.title_container { justify-content: space-around;align-items: normal;margin: auto;width: 1200px;font-size: var(--text2_b); }
.title_content {
	width: calc(100%/2.05 - 6px);justify-content: center;
	text-align: center;padding: 1.2rem;margin: 1rem auto;
	background: var(--linear2);position: relative;z-index: 0;
	border-radius: var(--border-radius1);overflow: hidden;
	box-shadow: rgba(255,255,255,.3) 5px 3px 0px -10px;
}
.title_content::before {
	position: absolute;content: '';
	width: 124%;height: 150%;left: 0;bottom: 0;
    border-radius: 50%;border: 1px solid rgb(255 255 255 / 80%);
    transform: translate(-16%, 5%);z-index: -1;
}
.title_content dt { width: 100%;font-size: var(--text2);font-family: var(--ff1);font-weight: 900;line-height: 1.7; }
.title_content dd:nth-child(1) { color: var(--pink2); }
.title_content dd:nth-child(3) { font-size: var(--text4); }
.title_content dd:nth-child(3) span { background: var(--pink2);color: white;padding: 0 .3rem;margin-right: 0.8rem; }
/* main end */

.teacher_title { font-size: var(--text3);margin: 3rem auto 1rem; }
.teacher_title a { color: var(--join1); }
.teacher_title dt { font-size: var(--text2_b);color: var(--pink2);font-weight: 900;padding-bottom: 0.3rem;margin-bottom: 0.3em;border-bottom: 2px dotted var(--golden); }
.teacher_title dd { font-size: var(--text4);text-align: center; }
.photolist figcaption { font-size: var(--text5);color: var(--pink);width: 100%;text-align: center; }
.photolist figcaption span{ display: block;font-size: var(--text7);color: var(--black); }
.photolist figure { width: calc(100%/4 - 6px); background: linear-gradient(to top, white 30%, transparent 100%);padding: 0 1.2rem .5rem;border-radius: 0 0 10px 10px;justify-content: center;margin-bottom: 1rem;}
.photolist figure:hover { background: linear-gradient(to top, white 80%, transparent 100%);}
.photolist figure:hover img { transform: scale(1.05);transform-origin: bottom; }
.photolist figure:hover figcaption { transform: translateY(2px); }
.photolist figure img { filter: drop-shadow(0px 0px 6px white); }
.bonus-cont{width:1200px;border: inset 4px var(--join1);background: white;border-radius: var(--border-radius1);padding-bottom: 1rem; }
.bonus-plus,.bonus-cont{margin: .5rem auto 2rem;}
.class-title{
	width:100%;background: var(--linear1);text-align:center;color: white;
	font-family:"Microsoft YaHei";font-size: var(--text4);position: relative;
	padding:.2rem 0;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
}
.class-title span { font-size: var(--text2);color: var(--light_orange);margin-right: 1rem;font-weight:700;}
.class-subtitle{margin: 1rem 2.5rem 0;}
.class_indent{margin-left: 1.3rem;display: inline-block; }
/* .bonus-cont:nth-of-type(4) .class-title { clip-path: polygon(0% 0%, 80% 0, 100% 50%, 80% 100%, 0% 100%); } */
.bonus-cont > ul{ width:100%;padding:0rem 2.5rem;background-color:#fff;font-size: var(--text7);line-height: 1.4; }
.bonus-cont ul li{margin: 0 auto .2rem;text-align:left;}
.bonus-cont ul li:nth-child(odd){width: 50%;}
.bonus-cont ul li:last-of-type{width: 100%;}
.bonus-cont ul li:nth-child(even){width: 50%;}
.bonus-cont ul li::before { content: '▸';color: var(--join1); font-size: var(--text4); }
.bonus-cont small { padding-left: 1.5rem;display: block; }
.bonus-cont .small { padding-left: .5rem;display: inline; }
.bonus-cont_br { display: block;margin-left: 1.5rem; }
:is(.class-name, .class-name a){color: var(--join1);}
.price{color:var(--pink);font-size:var(--text5);margin:.125rem}
:is(.teacher_title dt, .limit-date > span:nth-child(1)) {font-weight:700;font-size:var(--text1);text-align:center;font-family: var(--ff1);}
:is(.teacher_title, .limit-date) span{margin-right:.5rem}
:is(.teacher_title, .limit-date) span>span{color:var(--pink2)}
.class-subtitle{
	color: white;background: var(--pink2);border-radius: var(--border-radius1);
	font-size: 1.5rem;padding: .2rem 1rem;text-align: left;width: fit-content;
}
.class-subtitle2 { margin-top: 1.5rem; }
.limit-date{font-size: var(--text6);margin-top: 2rem;text-align: center; }
.limit-date~div{text-align: center; }
.limit-date_title { font-size: var(--text4);font-family: var(--ff1);font-weight: bold;color: var(--pink);display: inline-block; }
.limit-date ul{margin: 0.5rem auto 1rem; }
.limit-date li{width: calc(100%/3.3); }
.limit-date li:before{content: '☑';color: var(--pink2); }
.limit-date a{color:var(--pink2); }
.limit-date_container{background: linear-gradient(to top, white 30%, transparent 100%);border-radius: 0 0 10px 10px;padding: 1rem 2rem;text-align: center;margin: auto;}
.limit_buy dt{background: var(--join1);color: white;width: max-content;padding: 0.25rem;}
.limit_buy{
	line-height: 1.9rem;font-size: var(--text7);padding: 0.3rem 1rem;border-radius: var(--border-radius1);
	background: #f1f0e7;margin: 1rem auto 0;justify-content: center;align-items: center;width: 80%;text-align: center;
}
.price_list,.price_list th,.price_list td{border:1px solid var(--join1);border-collapse: collapse;}
.price_list { background: white;border: 4px solid var(--join1);font-size: var(--text6);line-height: 1.6;}
.price_list th { background: var(--join1);color: white; }
.price_list span { color: var(--pink); }
.price_list_os { color: var(--deep_red);display: block; }
/*DIV END*/

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

@media (width >= 992px) and (width < 1200px){
	:root {
		--text1: 2.7rem;--text2_b: 2.4rem;--text2: 2rem;--text3: 1.6rem;
		--text4: 1.4rem;--text5: 1.3rem;--text6: 1.2rem;--text7: 1.1rem;--text8: 1rem;
	}	
	.title_content { margin: 2rem auto; }
	.class-title span { align-self: center;margin-left: 1rem;width: initial; }
	.bonus-cont small { padding-left: 1rem; }
}

@media (width >= 768px) and (width < 991px){
	:root {
		--text1: 2.6rem;--text2_b: 2.2rem;--text2: 1.9rem;--text3: 1.5rem;
		--text4: 1.3rem;--text5: 1.2rem;--text6: 1.15rem;--text7: 1.1rem;--text8: 1rem;
	}
	.photolist figure { width: calc(100%/3 - 6px); }
	.title_content { margin: 2rem auto; }
	.class_indent{ margin: auto; }
	.class-title span { align-self: center;margin-left: 1rem;width: initial; }
	.bonus-cont ul :is(li:nth-child(odd), li:nth-child(even)) { width: 100%; }
	.bonus-cont small { display: inline;padding-left: 0.5rem; }
}

@media (width < 767px) {
	:root {
		--text1: 2.2rem;--text2_b: 1.8rem;--text2: 1.6rem;--text3: 1.3rem;
		--text4: 1.2rem;--text5: 1.15rem;--text6: 1.15rem;--text7: 1.1rem;--text8: 1rem;
	}
	.teacher_title { margin: 3rem 1rem 1rem; }
	.title_content { width: calc(96% - 16px); }
	.class_indent{ margin: auto; }
	.photolist figure { margin-bottom: 1rem;width: calc(48% - 10px);padding: 0 .5rem .5rem; }	
	.bonus-cont_br { margin-left: 0rem;display: inline; }
	.bonus-cont ul :is(li:nth-child(odd), li:nth-child(even)) { width: 100%; }
	.bonus-cont small { padding-left: 0; }
	.limit-date_title{ font-size: var(--text2); }
	.limit-date li{ width: 100%; }
}

/*各大相容檢視*/
@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 all and (min-width: 1px) and (max-width: 1200px){
	.class-title, .bonus-cont > ul,.bonus-cont {width: 100%;}
	.title_container { width:94%; }
	.class-title, .bonus-cont:nth-of-type(4) .class-title { clip-path: none; }
	.bonus-cont ul li br { display: none; }	
	.bonus-cont_br { display: inline;margin-left: 0; }	

	/*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);}
}