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

body *{font-family: 'Noto Sans TC', sans-serif;}
#event_master *{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;}
#Master_title img {margin: 0 auto;width: 100%;
}


/*DIV END*/


:root{
	--bgcolor1:#EEE8E0;
	--bgcolor2:#FFFCE9;
	--join1:#de523f;
	--join2:#00BCD4;
}
.bg0{background: url(../../images/1212015_bg.png) center fixed no-repeat,linear-gradient(90deg,#cb311c 50%,#a0200e 90%);}
.bg1{background: url(../../images/1212015_bg.png) center fixed no-repeat,linear-gradient(90deg,#cb311c 50%,#a0200e 90%);}
.bg2{background: url(../../images/1212015_bg.png) center fixed no-repeat,linear-gradient(90deg,#f9dfbb 50%,#c7a77b 90%);}
.bg_padding{padding:1%;}
/*所有元素漸變0.5秒*/*{transition: all .5s;}
.top{position: relative;width: 1200px;margin: 0 auto;}
.top_hs::before{position: absolute;width: 100px;height: 3px;background-color: white;top: -15%;content: " "}
.top_hs{position: absolute;font-family: 'Noto Serif TC', serif; font-weight: 600;font-size: 3.5rem;left: 1.2%;bottom: 2%;text-align: left;color: white;line-height: 4.6rem;}
.top_hh{font-family: 'Noto Serif TC', serif; font-weight: 600;background: url(../../images/1212015_hh.png) center top no-repeat;display: block;background-position: -30px 5px;padding-left: 5px;height: 92px; }
.top_hs b{font-family: 'Noto Serif TC', serif; font-weight: 900;font-size: 3.5rem;color: #e6c18d;text-shadow:6px 3px 0px #7f190a;letter-spacing: -0.5rem;}

.top_hs2::before{position: absolute;width: 100px;height: 3px;background-color: white;top: -8%;content: " "}
.top_hs2{position: absolute;font-family: 'Noto Serif TC', serif; font-weight: 600;font-size: 3.0rem;left: 1.2%;bottom: 3.5%;text-align: left;color: white;line-height: 4.5rem;}
.top_hs2 b{font-family: 'Noto Serif TC', serif; font-weight: 900;font-size: 3.2rem;color: #e6c18d;text-shadow:6px 3px 0px #7f190a;letter-spacing: -0.0rem;}
.pre{text-align: center;margin: 0 auto 0.5rem;}
.pre img{width: 45% !important;}
.top_red{font-family: 'Noto Serif TC', serif; font-weight: 600;color: white;background: url(../../images/1312022_red.png) center top no-repeat;display: inline-block;background-position: -13px 0px;margin-bottom: 1.0rem;height: 110px;font-size: 3.2rem; }
.top_red b{font-family: 'Noto Serif TC', serif; font-weight: 900;font-size: 3.5rem;color: #e6c18d;text-shadow:6px 3px 0px #7f190a;letter-spacing: -0.5rem;padding: 0 0.8rem 0 0.3rem;}

.grade_group{font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;font-weight: 900;margin: 1rem 0;}
.grade_toplist,.grade_setlist{font-family: 'Noto Sans TC';font-weight: normal;padding: 1% 0 3%;}
.grade_toplist dt{font-size: 2.5rem;color: #8b1807;background: url(../../images/1212015_adw.png) center no-repeat;height: 175px;padding: 3.6rem;width: auto;}
.grade_toplist dd{font-size: 2.8rem;color: bisque;border-bottom: dashed 1px;padding: 0.3rem 0.2rem;}
.grade_title,.grade_all_title{font-size: 3.8rem;color: #a52210;font-family: 'Noto Serif TC', serif;font-weight:900;border-bottom: solid 4px;margin-bottom: 0.7rem;padding-bottom: 0.5rem;animation: myfirst 1.5s infinite alternate ease-in-out;margin-top: 3%;text-align: center;}
.grade_all_title span{font-size: 4.5rem;display: block;font-family: 'Noto Serif TC', serif;font-weight:900;line-height: 4.2rem;}

@keyframes myfirst{
    0%{opacity:1}
    15%{opacity:0}
    25%{opacity:1}
    100%{opacity:1}
}

.grade_other_title2{font-size: 3.8rem;border-bottom: 8px solid #d1ae7d;padding: 0.5rem 0;background: linear-gradient(to right, #113f74 0%, #0182ba 10%, #113f74 80%, #0182ba 90%, #113f74 100%);color: #fff;font-family: 'Noto Serif TC', serif; font-weight: 900;text-align: center;}
.grade_other_title2 strong{font-size: 4.2rem;color: #e6c18d;font-family: 'Noto Serif TC', serif; font-weight: 900;}
.grade_setlist2{font-size: 2.8rem;padding: 2% 4%;background: linear-gradient(90deg, #feeacc 2%, #fffcf7 20%, #fff2df 100%);color: #7d513c;margin-bottom: 2%;}
.grade_setlist2 strong{clip-path: polygon(100% 0, 95% 50%, 100% 100%, 0% 100%, 0% 0%, 0% 0%);background: linear-gradient(to right, #7f190a 10%, #c7331f 95%);padding: 0.1rem 1.5rem;color: #feeacc;margin-right: 1.0rem;font-size: 2rem;}
.grade_setlist2 li{margin: 0.5rem 1rem;}

.grade_other_title{font-size: 3.4rem;border-bottom: 3px solid #7f190a;padding: 0.5rem 0;background: linear-gradient(to right,#87643d 0%,#b99768 10%,#ffe6c3 80%,#b19064 90%,#623e31 100%);color: #c7331f;font-family: 'Noto Serif TC', serif; font-weight: 900;text-align: center;}
.grade_other_title strong{font-size: 3.8rem;color: #105795;font-family: 'Noto Serif TC', serif; font-weight: 900;}

.grade_other_title1{font-size: 3.5rem;border-bottom: 3px solid #ffe5c1;padding: 0.5rem 0;background: linear-gradient(to right,#7f190a 0%,#c32b17 10%,#ff6f59 60%,#cb311c 80%,#931504 100%);color: #ffffff;font-family: 'Noto Serif TC', serif; font-weight: 900;text-align: center;}
.grade_other_title1 img{display: inline-block;margin-right: 0.5rem;margin-top: -1rem;}
.grade_setlist{font-size: 2.5rem;padding-bottom: 3%;}
.grade_setlist strong{clip-path: polygon(100% 0, 95% 50%, 100% 100%, 0% 100%, 0% 0%, 0% 0%);background: linear-gradient(to right, #113f74 10%, #0182ba 95%);padding: 0.1rem 1.5rem;color: #feeacc;margin-right: 1.0rem;font-size: 2rem;}

.grade_setlist li{margin: 0.5rem 1rem;color: white;}
.grade_alllist{}
.grade_alllist li{margin: ;width: calc(100%/4);padding: 0.2rem;}
.all_color{color: #641105;font-size: 2rem;}
.all_color li{border-bottom: dashed 1px #cb311c;}
.crazy_color{color: #ffe6c3;font-size: 2.5rem;}
.crazy_color li{border-bottom: dashed 1px #ffe6c3;}
.page_note{font-size: 1.2rem;margin: 1rem 0;}

.congratulations{text-align: center;color: wheat;font-family: 'Noto Serif TC', serif; font-weight: 900;font-size: 2.5rem;padding: 1.5rem 0;border-bottom:wheat 1px ;width: max-content;margin: 0 auto;border-style:ridge; }

.happy_go{background: linear-gradient(to right, #87643d 0%, #b99768 10%, #ffe6c3 80%, #b19064 90%, #623e31 100%);position: fixed;right: 0;top:8rem;z-index: 999;padding: 1rem;}
.happy_go a{color: #cb311c;font-size: 1.8rem;font-family: 'Noto Serif TC', serif;font-weight: 900;}
.happy_go:hover{transform:translateX(-1rem);}
.autowarp{display: block;}
/*各大相容檢視*/
@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:70px;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){
.top{width: 100%;}
.grade_group{padding: 0 1rem;}	
.grade_title,.grade_all_title{font-size: 2.0rem;}

}

@media (min-width: 768px) and (max-width: 991px) { 
.top_hs {font-size: 2.2rem;bottom: 0%;line-height: 2.6rem;}
		.top_hh {background-size: contain;}
		.top_hs b {font-size: 3.0rem;}
		.top_hs::before {top: -7%;}
	
	.top_hs2::before{top: 0%;width: 30%;}
.top_hs2{font-size: 2.0rem;left: 1.2%;line-height: 2.4rem;width: 32%;top: 30%;}
.top_hs2 b{font-size: 2.0rem;text-shadow: 0px 2px 0px #7f190a;margin-right: 0.2rem;}
.pre{text-align: center;margin: 0 auto 0.2rem;}
.pre img{width: 63% !important;}
.top_red{background: url(../../images/1312022_red.png) right top no-repeat;margin-bottom: 0.2rem;height: 100px;font-size: 2.2rem;padding: 0.2rem 0.5rem;text-align: center;}
.top_red b{font-family: 'Noto Serif TC', serif; font-weight: 900;font-size: 2.5rem;color: #e6c18d;text-shadow:6px 3px 0px #7f190a;letter-spacing: -0.5rem;padding: 0 0.8rem 0 0.3rem;}
}	
	
 @media all and (min-width: 1px) and (max-width: 767px){
	.autowarp{display: inline;}
	.happy_go{bottom:0rem;top:unset;width: 100%;border-radius: 0rem;text-align: center;}
	.happy_go:hover{transform:translateX(0rem);
		}
		
		.happy_go a{font-size: 1.5rem;}
	
.congratulations{font-size: 1.1rem;
	width: 90%;
padding: 0.8rem 0.5rem;}
	
.grade_setlist2 strong,.grade_setlist2{font-size: 1.35rem;}
		.top_hs {font-size: 1.2rem;left: 1.2%;bottom: 0%;line-height: 1.6rem;}
		.top_hh {background-size: contain;height: auto;background-position: 0 5px;}
		.top_hs b {font-size: 1.5rem;text-shadow: 0px 2px 0px #7f190a;}
		.top_hs::before {top: -7%;width: 50%;}
	 
	 .top_hs2::before{top: 0%;width: 30%;}
	 .top_hs2,.top_hs2 b{font-size: 0.80rem;}
.top_hs2{left: 1.2%;line-height: 1.5rem;width: 32%;top: 30%;}
.top_hs2 b{text-shadow: 0px 2px 0px #7f190a;margin-right: 0.2rem;}
.pre{text-align: center;margin: 0 auto 0.2rem;}
.pre img{width: 63% !important;}
.top_red{background: url(../../images/1312022_red.png) right top no-repeat;margin-bottom: 0.2rem;height: 100px;font-size: 1.7rem;padding: 0.2rem 0.5rem 0.2rem 2.2rem;}
.top_red b{font-family: 'Noto Serif TC', serif; font-weight: 900;font-size: 1.5rem;color: #e6c18d;text-shadow:6px 3px 0px #7f190a;letter-spacing: -0.5rem;padding: 0 0.8rem 0 0.3rem;}
	 
	 .grade_other_title2 {font-size: 1.6rem;}
	 .grade_other_title2 strong {font-size: 2.2rem;}
	 
	.sm\:block {display: block;}
	 	.grade_other_title{font-size: 1.7rem;}

	 .grade_other_title strong {font-size: 1.8rem;}
	 .grade_setlist li {margin: 0.3rem;}
		.grade_toplist{width: calc(100%/1);}
		.grade_toplist dt{text-align: center;}	
	 .grade_alllist {font-size: 1.6rem;}
		.grade_alllist li{width: calc(100%/3);text-align: center;}
		.grade_setlist{font-size: 1.7rem;}
	 .grade_other_title1 {font-size: 1.85rem;}
	 .grade_other_title1 img {max-width: 50px;}
	 .grade_toplist dd {font-size: 1.7rem;}
	 .grade_all_title span {font-size: 3.0rem;}
}
/*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);}