@import url("../../../icon_new_6.6/css/all.min.css");
/*DIY*/
:root{
	--bgcolor1:#EEE8E0;
	--bgcolor2:#FFFCE9;
	--join1:#de523f;
	--join2:#00BCD4;
	--darblue:#0c668f;
	--join1: #a7302d;
	--join4: #ffefbb;
}
.st-content img{width: 70%;}
.bg_padding{padding:1%;}

.bg0{background-color: #f7f2ef;}
.bg1{/*background: url(../images/1307061_bg.png) no-repeat center ;*/background-color: #f2e6e1;}
.bg2{background-color: #b99992;}
.bg3{background-color: #be2f08;}

/*所有元素漸變0.5秒*/*{transition: all .5s;}


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 img {width: fit-content;height: auto;max-width: 100%;}
.group_title{font-size: 3.2rem;margin: auto auto 3rem;padding-top: 1%;color: #a15d38;font-family: 'Noto Serif TC', serif;font-weight: 600;border-bottom: solid 0px;width: max-content;position: relative;line-height: 4.0rem;}
.group_title a{font-family: 'Noto Serif TC', serif;font-weight: 600;text-decoration: underline;}

.group_title::after{content: "▼";position: absolute;left: 49%;;bottom: -2.15rem;color: #d83509;font-size: 2.0rem;transform: scale(1.5, 1);line-height: 1.5rem;}
.group_title.fcolor1{color: #f9c1a2;}
.group_title.fcolor2{color: #d83509;}
.feature dt{font-size: 1.3rem;}
.feature{width: calc(100%/3);padding: 0.8rem 1.0rem;background-color: white;font-size: 1.2rem;color: #9b5731;}
.feature dd{text-align: left;margin-bottom: 0.5rem;border-bottom: dotted 1px;}
.Vuetabs a{cursor: pointer;background-color: #dac7c0;font-size: 1.8rem;color: #413a36;width: inherit;border-bottom: solid 5px #816058;margin-bottom: 0.3rem;padding: 0.5rem 0.3rem;margin-right: 1px;}
.Vuetabs div:hover a,.Vuetabs div.active a{background-color:#d83509;color: snow;}
.Vuetabs i{margin-left: 0.5rem;}
.Vuetabs .active .fa-caret-down{transform: rotate(-90deg);}
.Vuetabs a i.rotated {transform: rotate(-90deg);}/*搭配vue綁定程式專用*/
.fade-enter-active, .fade-leave-active {transition: opacity .5s;}
.fade-enter, .fade-leave-to{opacity: 0;transition: opacity 0s;}
.new_feature{text-align: left;width:calc(100%/2 - 1.0rem);margin:0.0rem 0 1.5rem;}
.new_feature dt{font-size: 2.0rem;display: flex;align-items: center;color: #7b256e;border-bottom: solid 5px #a14092;height: 85px;}
.new_feature dt img{margin-right: 1.5rem;width: 85px;}
.new_feature dd{background: linear-gradient(to right, #ffffff 60%, #ffffff42 100%);padding: 0.4rem 2rem;font-size: 1.1rem;color: #663d28;border-bottom: dashed 1px #b99992;}
.new_feature dd a{text-decoration: underline;}
.date_list,.date_list th,.date_list td{border: 1px solid #dac7c0;border-collapse: collapse;padding: 0.3rem;font-size: 1.2rem;}
.date_list th{background: rgb(222 202 196);border-bottom: 4px solid #b99992;font-size: 1.3rem;color: #d83509;}
.date_list {background: linear-gradient(to right, #f2dcd5 10%, #ffffff78 100%);}
.date_list td:last-child,.date_list th:last-child{display: ;}
.date_list td a::before {cursor: pointer;margin-right: 0.3rem;color: #f05f57;font-size: 1.5rem;font-family: "Font Awesome 5 Free";left: 2rem;font-weight: bold;content: '\f025';}
/* .dateB tr:nth-last-child(-n+5){background: rgb(218 160 139);} */
.read_more{margin: 1rem 0;}

.outlink{background: #d83509;width: max-content;padding: 0.25rem 2.5rem;border-radius: 2.9rem;margin: 1rem auto;font-size: 2.0rem;}
.outlink{color: white;margin-bottom: 4%;}
.offer dt{background: #9b807a;color: white;width: max-content;border-radius: 1.5rem;padding: 0 1rem;}
.offer dt.class{color: #d83509;background:none;padding: 0;font-size: 2.8rem;}

.offer span,.offer_list span{color: #d83509;}
.offer,.offer_list{text-align: left;border-left: solid 12px #9b807a;border-radius: 2.0rem;border-right: solid 12px #9b807a;padding: 1.0rem 2.5rem;font-size: 1.7rem;}
.offer{font-size: 1.8rem;margin-bottom: 0.5rem;}
.offer dd strong{border-right: solid 5px #d83509;padding-right: 0.8rem;margin-right: 0.8rem;line-height: 4.2rem;}
.offer_list{margin:1rem 0;}
.offer_list a,.offer_note a{text-decoration: underline;}
.offer_note{text-align: left;border-radius: 1.5rem;padding: 1.0rem 2.5rem;font-size: 1.3rem;background-color: #f3ddd6;margin-bottom: 3%;}
.offer_note span{background: #d83509;color: #f7f2ef;margin: 0 0.25rem;padding: 0 0.5rem;}
.learning{color: #f7f2ef;padding: 0rem 2.5rem 0.5rem;font-size: 2.0rem;margin: 0 auto 3%;width: max-content;border-bottom: dotted;}
.learning_des dt{font-size: 1.3rem;color: var(--darblue);font-weight: 900;}
.learning_des dd{font-size: 1.1rem;}
.learning_des dd:nth-child(3),.desnote{background:var(--darblue); color:white;}
.fa-arrow-right-long{font-size: 1.5rem;}

.learning_des{position: relative;clip-path: polygon(95% 0, 100% 50%, 95% 100%, 0% 100%, 0% 50%, 0% 0%);background-color: bisque;}
/* .learning_des i{position: absolute;} */
.learn-A .up{top:-2rem;left:12rem;transform: rotate(-30deg); position: absolute;}
.learn-A .bottom{top:6rem;left:12rem;transform: rotate(30deg); position: absolute;}
.learn-B i{top:2rem;left:25rem;transform: rotate(30deg); position: absolute;}
.learn-C i{top:-2rem;left:25rem;transform: rotate(-30deg); position: absolute;}
.grade_title{color: #ffffff;padding: 0rem 2.5rem 0.5rem;font-size: 2.0rem;margin: 0 auto 3%;width: max-content;border-bottom: dotted;}

.chart{margin: 0 auto;padding-bottom: 3%;}

.recommend{width: calc(100%/1);padding: 1.8rem 3rem;background-color: white;font-size: 1.2rem;color: #9b5731;}
.recommend dd{text-align: left;text-indent: -1rem;line-height: 2.2rem;border-bottom: solid 1px #d5cdc4;margin-bottom: 0.8rem;}
.recommend span{color: rgb(114, 3, 3);display: block;margin: 1.0rem 1.0rem 0.5rem 1.0rem;}
.recA strong{color: #be2f08;margin-right: 0.3rem;}
.recB strong{/*color: #0882a0;*/}

.Vuetabs2 a{cursor: pointer;background-color: #dac7c0;font-size: 1.8rem;color: #413a36;width: 100%;border-bottom: solid 5px #816058;margin-bottom: 0.3rem;padding: 0.5rem 0.3rem;margin-right: 1px;}
.Vuetabs2 a:hover,.Vuetabs2 a.active {background-color:#ec7352;color: snow;}

.lerning{border-bottom:3px #c53008 solid;width:calc(100% / 5 - 2%);height:130px;background-color: #f8f2ef;padding:0 0 .8rem;margin:1rem auto 2rem;filter:drop-shadow(0 2px 5px #0000003a);text-align:center}
.lerning dt{font-size:1.2rem;color:#f4ebe7;background:#c53008;line-height:2rem;text-align:center;padding:.6rem 0 1.2rem;clip-path:polygon(0 0,100% 0,100% 80%,50% 100%,0 80%)}
.lerning dt a{text-decoration: underline;}
.lerning dd{padding: 0.5rem;}
.arrow{width:2.5%}
.arrow dt img{width:90%;display:inline-block}

/*DIV END*/






/*各大相容檢視*/
@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){

.lerning {width: 95%;}
 .arrow{width:6%;transform:rotate(90deg);display:block;margin:.5rem}
	@media (max-width: 1024px) {
		.feature{width: calc(100%/1);}
		.learn_bg i{display: none;}
		
	  }
@media (max-width: 767px) { 
	.new_feature dt img {margin-right: 1.0rem;width: 55px;}
	.new_feature dt {font-size: 1.5rem;height: 58px;padding-left: 1.5rem;}
	.new_feature dd {padding: 0.3rem 1rem;}
	.group_title {font-size: 2.0rem;margin: auto auto 2rem;line-height: 2.5rem;width: 90%;text-align: center;}
	.group_title::after {bottom: -2.0rem;transform: scale(1.0, 0.5);}
	.Vuetabs a {font-size: 1.0rem;}
	.date_list, .date_list th, .date_list td {padding: 0.2rem;font-size: 1.0rem;}
	.outlink {font-size: 1.3rem;}
	.offer {font-size: 1.4rem;line-height: 1.8rem;}
	.offer, .offer_list {padding: 1.0rem 1.5rem;font-size: 1.2rem;}
	.offer dd strong {line-height: 2.2rem;}
	.offer_note {font-size: 1.0rem;}
	.learning,.grade_title {padding: 0rem 0.5rem 0.2rem;font-size: 1.3rem;margin: 0 auto 3%;width: auto;}
	.Vuetabs2 a {text-align: center;font-size: 1.3rem;}
	.recommend {padding: 1.0rem 1rem;}
	.new_feature{width: calc(100%/1);}	
 	.lerning{margin:.5rem auto;height:auto;display:block}
	.offer dt.class {font-size: 2.0rem;margin-bottom: 1.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);}
	}