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

/*設計專用樣式Start*/
:root {
    --red: #d94a35;
    --red2: #E9282B;
    --orange: #FF760C;
    --brown: #A06019;
    --black: #363636;
    --textB: 2.9rem;
    --linear1: linear-gradient(to right, #ffdc9b 0%, #f9f0d5 30%, white 40%, #ffdc9b 70%, white 85%, #f9f0d5  100%);
}
@media (min-width: 1024px) {
    .lg\:w-1\/3 {
        width: 32%;
    }
}

.banner img { border-radius: 0 0 5rem 5rem; }
.pc_show{display:block}
.mb_show{display: none}
.wrap_all{word-break: keep-all;overflow-wrap: break-word;-webkit-hyphens: auto;-moz-hyphens: auto;hyphens: auto;-webkit-text-size-adjust: 100%;}

.hitlist_title{font-size:3rem;margin: -50px 0 2rem;font-weight: 900;color: #ed412f;font-family: "Microsoft YaHei", Microsoft JhengHei, Arial;text-align: center;}
.hit_info {border-bottom: 6px #dbb869 dotted;height: 120px;margin-bottom: 3%;}
.hit_info dd {font-size: 1.2rem;color: #915d25}
.hit_info dd:last-of-type {color: #000}
.hitList img{ border-radius:50%;/*border: 5px solid #d8ba68*/}
.t_gold {font-size: 1.2rem;font-weight: bold;color: #ee3c32;margin-left: -7px;margin-right: 0px}
.media { background: var(--linear1);width: 1400px;margin: 0 auto 4%;padding: 0 1.2rem .5rem;border-radius: 1.3rem;border: 3px #dbb869 inset; }
.media_group:nth-of-type(n+1):nth-of-type(-n+4) { margin: 3.5rem 0 1rem; }
.media_group{
    text-align: left;margin: 0 auto;padding: 0.2rem .2rem .6rem;align-content: flex-start;overflow: hidden;
}
.media_photo { display: flex;flex-wrap: wrap;justify-content: center;align-items: center; }
.media_photo img{ clip-path: polygon(50% 0, 100% 20%, 100% 80%, 50% 100%, 0 80%, 0 20%);border: 3px solid #dbb869;width: 220px; }
.lg\:w-8\/12 {/* width: 66.666667%; */width: 100%;}

/*偵測過長標題超過寬度，遇標點符號自動換行，標題類請勿再用<br>或block*/
/* .service,.grade_list,.media{word-wrap:break-word;  } */
/*.media_title,.service_title,.grade_title{
    word-break:keep-all;
    overflow-wrap: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
    -webkit-text-size-adjust: 100%; 
}*/
.media_title,.service_title{
    font-size:var(--textB);font-weight: 900;color: var(--red2);font-family: "Microsoft YaHei", Microsoft JhengHei, Arial;padding: 0.3rem 2.2rem;justify-content: center;align-items: center;
    background: linear-gradient(to right, #CFA049 0%, #D9AE5A 5%, #F6E3A9 30%, white 40%, #EFD685 50% , #D9AE5A 65%, white 75%, #CFA049 88%);
    border: inset 3px #A06019;font-family: "Noto Serif TC", serif;font-weight: 800;vertical-align: baseline;width: 1200px;border-radius: 2.2rem 2.2rem .8rem .8rem;
}
.media_title{margin: -1rem auto;position: relative;width: fit-content;z-index: 1; }
small { font-size: 0.8em !important; }
.service_title{margin: 0rem 0 0rem;}
.grade_title{
    font-size: 2.5rem;border-radius: 1.3rem 1.3rem 0 0;background: linear-gradient(to right,#991a09 0%,#cb311c 50%,#e37364 70%,#cb311c 80%,#971706 100%);
    color: white;padding: 0.1rem;margin: 2rem 0 0rem;font-weight: 900;font-family: "CHei3HK","microsoft yahei";justify-content: center;align-items: center;
}
.grade_title i {color: #b4a260;}
.group_title {font-size: 1.4rem;color: #a247b1;font-weight: bold;font-family: "Microsoft JhengHei", Arial, Verdana;}
:is(.media_title, .grade_title, .service_title) img { display: inline;margin-block-start: -1rem; }
.media_right{position: absolute;right:1rem;top:-1rem;background-color: #a247b1;color: white;width: max-content;padding: 0.5rem;margin-left: 1rem;border-radius: 20px 0;font-size: 1.2rem;}
.media_content {margin: 0.5rem 0;font-family: "Microsoft JhengHei", Arial, Verdana;font-size: 1.02rem;line-height: 1.7rem;text-align: justify;}
.media_content a {color: #196f98;font-weight: bold;font-size: 1.2rem;}
.media .listen {margin-bottom: 2%;}
.media .listen i {font-size: 1.8rem;vertical-align: baseline;margin-right: 5px;color: #03a9f4}
.media .listen a {font-size: 1.6rem;color: #a247b1;}
.media_info{width: 100%}
.media_name span{text-align: center;}
.media_name{ padding-bottom: 5px;font-size: 1.4rem;color: var(--black); }
.media_name > span:nth-child(1) { display: block;text-align: center;color: var(--black);margin-block-end: .8rem;border-bottom: 1px dashed var(--black);padding-bottom: .8rem; }
.media_name i {color: #F44336;padding: 0 1px 0 3px;font-size: 1.3rem;}
.media_name .hit {color: var(--red);}
.media_subtitle,.media_subtitle2 {color: #196f98;line-height: 2.1rem;padding-bottom: 10px;border-bottom: 6px #d09844 solid;}
.media_subtitle {font-size: 1.65rem;margin-left: 35%;}
.media_subtitle2 {font-size: 1.7rem;margin-left: 17%;}
.media_more { font-size: 1.3rem;background: linear-gradient(to right,#991a09 0%,#cb311c 50%,#e37364 70%,#cb311c 80%,#971706 100%);display: inline-block;padding: .35rem 2rem;border-radius: .6rem;color: white;margin: 1rem auto; }
.media_more a { text-decoration: none; }
/*.media_subtitle2{ width:120%}*/

.listcontent li{width: calc(100%/3);font-size: 1.6rem;line-height: 2.5rem;color: #722e58}
.gradelink li{font-size: 1.3rem;margin: 1rem 0;}
.gradelink li a {font-size: 1.8rem;color: #d9354d;}
.hit{color: var(--red);}
.hit2{color: #8e32af;}
.winnericon {padding: 0px 7px;color: #FFF;background-color: #d74035;font-size: 1.25rem;border-radius: .3rem;}
.media_content .moremore {padding: 0px 7px;color: #607D8B;background-color: #fdfeff;font-size: 1rem;border-radius: 25px;border: 1px #d09844 solid;text-decoration: none;}
.media_content .moremore a{text-decoration: none }
.media_content .moremore a:hover{background-color: #333; color:#fff;text-decoration: none}

.top_list dd{width: calc(124%/3);font-size: 1.2rem;padding: 0.2rem 1rem;text-align: left;text-indent: -1.35rem;padding-left: 1.35rem;}

.styleA {border-radius: 0 0 1.8em 0.8em;padding-bottom: 2%;}
:is(.styleA, .styleB, .styleC){ background: var(--linear1); }
.styleA dd:nth-child(-n+12) {padding: 0.5rem 0 0.5rem 4rem;text-align: left;color: #4c2a18;width: calc(100%/2);}
.styleA dd:nth-child(n+13) {text-align: left;padding: 0.5rem 0 0.5rem 4rem;width: calc(100%/2);color: #4c2a18;}
.styleB,.styleC {border-radius: 0 0 1.8em 1.8em;padding-bottom: 2%;}
.styleC dd {padding: 0.2rem 0rem 0.2rem 0.5rem;word-break: keep-all;overflow-wrap: break-word;-webkit-hyphens: auto;-moz-hyphens: auto;hyphens: auto;-webkit-text-size-adjust: 100%;}
.styleC{ margin-bottom:4%;}
.styleC dd:before {/* font-family: "Font Awesome 5 Free"; */content: " ";display: inline-block;/* background: url(../images/0811038_icon_bg.png) center; */text-align: center;font-size: 1.5em;    padding: 2% 2%;margin: 0 0 2%;color: #fff;}
.styleC dd i {font-size: 1.6rem;color: #F44336;vertical-align: text-bottom;padding-right: 2px;}
.styleD {border-radius: 0 0 1.8em 1.8em;background-color: #fffffa;padding-bottom: 2%;}

.page_link a {color: #fff;font-size: 1.5rem;padding: 0.5rem 1rem;background-color: #F44336;border-radius: 50px;text-decoration: none;width: 228px;text-align: center;background: linear-gradient(to right,#991a09 0%,#cb311c 50%,#e37364 70%,#cb311c 80%,#971706 100%);margin: 4% 0 1%;}
.page_link a:hover{ position:relative; top:2px; left:2px;background-color: #d09844;border: 0px #fff solid;color: #fff;}
.service_content { padding: 1rem 2rem; }
.service_list {width: calc(100%/4.4);position: relative;background: #f54c97;padding: 1rem;border-radius: 2rem;row-gap: 0.6rem;height: 100%;align-content: baseline;}
.service_list::after {content: "";position: absolute;width: 0;height: 0;border-style: solid;border-width: 20px 0px 20px 20px;border-color: transparent transparent transparent #d93b81;top: 35%;bottom: 0;right: -18px;z-index: 2;}
.service_list:last-of-type:after {content: none;}
.service_list :is(dt,dd) { width: 100%; }
.service_list > dt {color: #fff;text-align: center;font-size: 2.3em;font-weight: bold;font-family: "Microsoft YaHei", Microsoft JhengHei, Arial;}
.service_list > dd {padding: 0 7%;}
.service_list li {background: linear-gradient(to right,#a14093 5%,#0095a8 100%);padding: 2% 3%;border-radius: 1rem;margin: 0 -3% 2%;letter-spacing: 1px;color: #FFF;}
.grade_list{ background-color: #ffbbcf8c;border-radius: 35px}
.bannerlist {margin: 1% 0% 2%;padding-top: 1%;border-top: 1px #fff solid;text-align: center}
.bannerlist img{padding-bottom: 1.7%}
.service_item{padding-top: 3%;}
.Community dd {color: #fff !important;}
.teacher_name{padding-bottom: 2%; color:#2d2d2d;text-align: center;font-family: "Microsoft JhengHei", Arial, Verdana;}


/*設計專用樣式END*/





/*css reset 歸0*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,caption,tfoot,thead{margin:0;padding:0;border:0;outline:0;font-size:100%;line-height:1.5em;}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
/*remember to define focus styles!*/
:focus{outline:0;}
*{box-sizing: border-box;}
ins{text-decoration:none;}
del{text-decoration:line-through;}
body{font-family:"Microsoft YaHei", Microsoft JhengHei, Arial;}
a{text-decoration:underline;font-family: "Microsoft JhengHei", Arial, Verdana;}
a:hover{text-decoration:none;position: relative;top: 2px;left: 2px;}
ul,li,dd,ol{margin:0;padding:0;list-style-type:none;}


/*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;}
/*arrow icon (span tag)*/
#back-top span {width:50px;height:50px;display: block;margin-bottom: 7px;background: rgb(237 62 47 / 84%) url(../images/up-arrow.png) no-repeat center center;/*rounded corners*/border-radius:50%;/*background color transition*/transition: 1s;}
#back-top a:hover span {background-color: #777;}

/*共用*/
.bgcolor0{background-color: #FCFCFC;}
.bgcolor1{background-color: #ffd8d8;background: #e4e9ef url(../images/1104043_bg.jpg) repeat center;}
.bgcolor2{background-color: #F3F3F3;}
.bgcolor3{background-color: #EEEEEE;}
.bgcolor4{background-color: #E4E4E4;}
.bgcolor5{background-color: #DFDFDF;}
/*所有元素漸變0.5秒*/*{transition: all .5s;}

.ft_NOTO{font-family: 'Noto Sans TC', sans-serif;}
.ft_NOTOSer{font-family: 'Noto Serif TC', serif;}
.ft_Meiro{font-family: Meiryo, "Meiryo UI", Arial, sans-serif;}

#askarea_out input, #askarea_out select {color: rgb(82, 80, 80);padding: 0 0.4rem;}
#askarea input[type="submit"],#askarea input[type="reset"]{color: white;}
#askarea_out img{width: 25%;display: inline-block;margin: 0.5rem 0;}
@media (min-width: 1201px){
    #BodyContent{width:100%;padding:0;margin:0;}
    #BodyContainer_event{width:100%;margin:0;}
    #BodyHeader_event_rwd,#topli{display:none;}

    /*資料集中1200px寬外框*/
    #event_master{margin:-3% auto 2%;display:inline-block;width:1200px;padding:0;} 
	#event_sec, #event_third, #event_fourth, #event_fifth, #event_sixth { margin: 2% auto;display: inline-block;width: 1200px;padding: 0; }
	#Master_title{margin:0% auto;/*display:inline-block;*/width:100%;padding:0;}    
    /*標題大小*/
    /* h1{ font-size: 3em; }
    h2{ font-size: 2.5em; }
    h3{ font-size: 2.2em; }
    #event_sixth nav a{ font-size: 1.3em; } */
    /* bodyHeader */
    #BodyHeader_event,#header-share{width:100%;float:left}
    #BodyHeader_event #header-share{line-height:2;font-size:17px;margin-bottom:0;margin-top:0;background-color:#FFF}
    #BodyHeader_event #header-share img{margin-bottom:5px;max-width: 12%;display: inline-block;}
    #BodyHeader_event a{color:#333;font-size:17px}
    #BodyHeader_event a:hover{text-decoration:none;color:#666;position:relative;top:2px;bottom:2px}
    /* Footer */
    #BodyFooter_rwd,#footer_line,#footer_address ul li,#footer_inline ul{display:inline-block;}
    #BodyFooter_rwd{width:100%;margin-top:2%;}
    #footer_address,#footer_address #adinfo_out,#footer_address #adinfo{margin:0 auto;width:100%;}
    #footer_inline ul,#footer_address ul{width:100%;margin:0% auto;}
    #footer_inline a,#footer_address a{color:#000}
    #footer_inline ul li{display:inline;margin:auto 0.5%;width:13%;}
    #footer_address ul li{width:100%;line-height:1.9em;font-size:1em;}
    #adinfo_out #adinfo{width:50%;display:inline;margin:auto 1%;}
    #footer_inline ul li img{width:10%;height:auto;vertical-align:middle;display: inline-block;}
    #footer_line{width:90%;border-top:thin solid #999;margin:2% 5%}
    /*ask*/
    #askarea_out *{font-family:"Microsoft JhengHei";font-size:1em}
    #askarea_out{background-color:#2896D0;width:100%;display:inline-block;text-align:left}
    #askarea{width:1200px;margin:0 auto}
    #askarea img{width:8%;height:auto}
    #askarea p{margin-top:1%;margin-bottom:1%;font-size:1.1em}
    #askarea .asktitle,#askarea .asktitle p{text-align:center}
    #askarea .asktitle{color:#FFF;font-size:1.55em;margin-top: 4%;margin-bottom: 3%;}
    #askarea #formlist{width:80%;margin:2% auto;color:#FFF}
    #askarea SELECT,#askarea input{border-radius:7px;background-color:#FFF;border:#FFF;padding:.5%;margin:auto 1% 1% auto}
    #askarea SELECT{width:19.7%}
    #askarea input{color:#585858}
    #askarea input[name="sContent"]{width:50%}
    #askarea input[type="text"]{width:40%;/*height:20px*/}
    #askarea input[type="radio"]{margin-left:3%}
    #askarea input[type="submit"],#askarea input[type="reset"]{width:11%;height:45px;color:#FFF;background-color: #07689b;border: 2px #fff solid;padding:.5em}
    #noie{color:#FFF;width:100%;height:60px;text-align:center;border:1px solid #069;background-color:#39C;_z-index:9999;z-index:9999;position:fixed;_top:expression(documentElement.scrollTop+"px");/*讓選單覆蓋內容不會隨著捲軸滑動而消失專用*/left:0;top:0}
    #noie a{color: #FC0;}
    .hottxt{ color: #ffd942; font-size: 13px;}
}

@media (max-width: 1200px){
    .media_group{padding: 0.5rem;/*margin: 0;*/ }
    .media_right{position: static;width: 96%;text-align: center;margin: 1rem 0;}
    .listcontent li{width: calc(100%/1);text-align: center;}
    /*隱藏的區塊*/
    #BodyHeader_event,.hottxt,#noie{display:none;}
    /*會撐開的版面控制*/
    #BodyContent {width: 100%;padding:0;}
    #BodyContainer_event{width: 100%;}
    /*header*/
    #BodyHeader_event_rwd {	text-align: center;width:100%;height: auto;	margin:0 auto;background-color:#FFF;position:fixed;top:0;float:left;z-index:9;}
    #BodyHeader_event_rwd img,#BodyFooter_rwd #footer_inline ul li img{display: inline-block;}
    @media screen and  (orientation:portrait) {#BodyHeader_event_rwd img {max-width: 50%;margin-top:2.5%;}}
    @media screen and  (orientation:landscape) {#BodyHeader_event_rwd img {max-width: 25%;margin-top:2.5%;}}
    /*選單*/
    #mbSearch {margin: 5% 0 0 0;border-bottom: 1px solid #7D7D7D;width: 100%;}
    #mbSearch input {border: none;outline: 0;font-size: 2em;padding-left: 6%;}
    /*body*/
    #Master_title{display:block;width:100%;padding:0%;}/*主圖位置ID*/
    @media all and (orientation : portrait){#Master_title{margin-top: 10%;}}
    @media screen and  (orientation:landscape) {#Master_title{margin-top: 10%;}}
    .media_title { width: 100%; }
    /*滿百100%區域*/
    .row100{width:100%;}
    /*資料集中寬外框*/
    #event_master,#event_sec,#event_third,#event_fourth,#event_fifth,#event_sixth{width:100%;padding:0%;}
    /*div section標籤段落*/
    /* section p,div p{font-size:1.3em;line-height:1.9em;text-align:left;} */
    /* nav p{line-height:1.8rem;} */
    /*標題大小*/
    /* h1{font-size: 2.2em;}
    h2{font-size: 2.0em;}
    h3{font-size: 1.6em;} */
    #event_sixth nav a{ font-size: 1.2em;}
    /*footer*/
    #BodyFooter_rwd{float: left;width:100%;background-color:#FFF;margin-top:5%;}
    #BodyFooter_rwd #footer_line {width: 100%;margin-bottom: 3%;margin-top: 5%;display: block;float: left;height: auto;text-align: center;border-top-width: thin;border-top-style: solid;border-top-color: #999;}
    #BodyFooter_rwd #footer_inline a {color: #000;line-height: 2em;}
    #BodyFooter_rwd #footer_inline ul{float: left;padding:0;width:100%;margin-bottom: 1%;text-align:center;}
    #BodyFooter_rwd #footer_inline ul li img{max-width:40%;height:auto;margin-bottom: 2%;}
    #BodyFooter_rwd #footer_inline ul li{float: left;display: inline-block;	margin-right: auto;	line-height: 2em;font-size: 1em;clear: both;width: 100%;}
    #BodyFooter_rwd #footer_address{margin-top: 0%;	float: left;width: 100%;margin-right: auto;text-align: center;margin-left: auto;}
    #BodyFooter_rwd #footer_address a {color: #000;line-height: 2em;}
    #BodyFooter_rwd #footer_address ul{float: left;padding:0;text-align: center;margin-bottom: 1%;width: 100%;clear: both;}
    #BodyFooter_rwd #footer_address ul li{float: left;display: block;width: 100%;line-height: 2em;text-align: center;font-size: .8em;}
    /*ask*/
    #askarea{background-color:#2896D0;width: 100%;height: auto;float: left;padding:4% 1% 2% 1%;}
    #askarea .asktitle,#askarea .asktitle p{text-align: center;}
    #askarea .asktitle{font-size: 1.0em;color: #FFF;margin-bottom: 2%;line-height: 2em;}
    #askarea p {margin:0% auto auto 5%;	width: 90%;}
    #formlist{width: 99%;float: left;margin:2% auto auto 0%;padding-right:1%;font-size: 0.8em;color: #FFF;}
    input[name="sContent"]{width:50%;}
    input[type="text"]{	width:99%;}
    SELECT,input{border-radius: 7px;font-size: 1.0em;margin:auto 1% 3% auto;background-color: #FFF;height:30px;}
    SELECT{width:100%;border: #FFF;	padding: 0.5%;}
    input{border: #FFF;padding: 1%;color: #C6C6C6;}
    input[type="submit"],input[type="reset"]{color:#FFF;background-color:#eb543f;-webkit-appearance:none;/*ios系統專用，默認的系統樣式*/font-size:1em;margin-top:5%;padding:2%;height:auto}
    input[type="radio"]{width:1em;height:1em;margin-left: 3%;}
    /*TOP按鈕*/
    #topli,#topli a{color: #fff;text-decoration: none;}
    #topli{width:50px;height:50px;text-align:center;border-radius: 9999em;background-color:#000;opacity:0.4;position:fixed;line-height:50px;font-size: 15px;}
    @media screen and  (orientation:portrait) {#topli{right:1%;bottom:8%;}}
    @media screen and  (orientation:landscape){#topli{right:1%;bottom:15.8%;}}
}

@media (min-width: 1201px) and (max-width: 1400px) {
    .media { width: 100%; }
}

@media (min-width: 992px) and (max-width: 1199px) {
    :root { --textB: 2.2rem; }
}

@media (min-width: 768px) and (max-width: 991px) { 
    :root { --textB: 2.2rem; }  
}

@media (min-width: 768px) {
    .md\:w-1\/2 { width: 48%; }
}

@media (max-width: 767px) { 
    :root { --textB: 1.8rem; }
    .pc_show{display: none}
    .mb_show{display:block}
    .br_mb{display:block}
    #event_master {padding: 0 0 2rem;}
    .top_list dd {width: calc(90%/1);font-size: 0.9rem;padding: 0.2rem 0rem;text-indent: 0;margin: auto;font-size: 1.2rem;}
    .styleA dd:nth-child(-n+12) {padding: .2rem 1.2rem;width: 100%;font-size: 1.25rem;}
    .styleA dd:nth-child(n+13) {padding: .2rem 1.2rem;text-align: left;color: #4c2a18;width: 100%;font-size: 1.25rem;}
    #Master_title {display: inline-block;width: 100%;padding: 0;margin-top: 2rem;}
    .media{ width:96%;margin: 1.5rem auto;padding: 1rem  .3rem;}
    .media_title ,.grade_title, .service_title {width: 100%; font-size: 1.5rem;line-height: 2.2rem;margin: auto; padding: 1rem .3rem;font-weight: 900;text-align: center;border: inset 2px #A06019;}    
    :is(.media_title, .grade_title, .service_title) img { margin-top: -3rem; }
    .media_name,.media_name2 {font-size: 1.4rem;margin-left: 0;margin-top: .5rem;font-weight: bold;}
    .media_name > span:nth-child(1) { font-size: 1.4rem;margin-block-end: 0.3rem;font-weight: bold; }
    @media screen and ( max-width: 500px ) { .media_group, .media_group:nth-of-type(n+1):nth-of-type(-n+3) {width: 92%!important;} }
    .media_group, .media_group:nth-of-type(n+1):nth-of-type(-n+4) { width: 48%; padding: 1rem;margin: 0 0 1rem;}
    .media_photo {width: 100%;position: initial;}
    .media_subtitle,.media_subtitle2 {font-size: 1.3rem;line-height: 1.8rem;margin-left: 0;margin-top: 12%;}
    .media_group img, .media_group2 img {margin-top: -20px;}
    .media_group2 {width: 100%;margin: 0;}
    .media_content {line-height: 1.8rem;font-size: 1.1rem;}
    .teacher_name {margin-top: 9%;}

    .listcontent li {width: calc(96%/2);text-align: center;font-size: 0.95rem;line-height: 1.2rem;margin-bottom: 3%;}
    .gradelink li a {font-size: 1.2rem;line-height: 1.5rem;border-left: 4px #e98492 solid;padding: 0% 12% 0%;display: block;width: 90%;text-align: center;}
    .grade_list {border-radius: 0;width: 100%;}

    .hitlist_title {font-size: 1.8rem;margin: 1rem 0 1rem 1.2rem;text-align: center;}
    .hitList figure {width: 45%;text-align: center;}
    .hitList img {width: 80%;margin: 0 auto;}
    .hit_info dd {font-size: 0.9rem;}
    .hit_info {height: auto;}
    .t_gold {font-size: 0.9rem;}
    .service {margin: 0.8% auto 1.3%;padding-bottom: 2%;width: 100%;text-align: center;}
    .service_list {width: 92%;margin: 2rem auto;height: initial;}
    .service_list::after {bottom: -20px;left:0;right: 0;margin: auto; top: auto;border-width: 20px 20px 0px 20px;border-color: #f54c97 transparent transparent transparent;}  
    .service_list > dd {height: auto;}
    .service_list > dt {height: auto;color: #fff;text-align: center;background-color: #f54c97;font-size: 2em;
    line-height: 2.4rem;}
    .Community dt {1.1rem !important;}
    .Community dd {color: #FFED00;font-size: 0.9rem;}
    input[type="submit"], input[type="reset"] {background-color: #07689b;border: 2px #fff solid;padding: 0.5em 1em !important;}
    .bannerlist img {padding-bottom: 0.7%;padding-top: 4%;}
    .bannerlist {margin: 2rem auto;border-top: 0px #fff solid;}
    .page_link a {font-size: 1.15rem;width: 44%;margin: 1% 0 1%;}	
}


@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 {
}





/* ----------- iPad ----------- */
/*ipad_直式*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
    #event_master {width: 94%;margin: 0 auto}
    .bgcolor1 {padding-bottom: 2%;}
    .media_title, .grade_title, .service_title {margin: 0rem 0 0rem;text-align: center;}
    .media {width: auto;}
    .styleA,.styleB,.styleC {margin-bottom: 3%;}
    .styleA dd:nth-child(-n+12) {font-size: 1rem;padding: 0.5rem 2rem 0.5rem 2rem;}
    .styleA dd:nth-child(n+13), .styleB dd, .styleC dd {font-size: 1rem;padding: 0.5rem 0rem 0.5rem 2rem;}
    .media_photo {margin: 0 auto;position: initial;}
    .media_group { width: 48%; }
    .media_group:nth-of-type(n+1):nth-of-type(-n+3) { margin: auto; }
    .media_info {width: 100%;}
    .media_subtitle {margin-left: 0;font-size: 1.4rem;line-height: 2rem;}
    .media_subtitle2 {margin-left: 0;}
    .media_name {margin-left: 0;}
    .media_name2 {margin-left: 0;margin-top: 0;}
    .lg\:w-8\/12 {width:90%; margin:0 auto;}
    .FB_LINE_event {text-align: center;}
    .winnericon {font-size: 1rem;}
    .Community {font-size: 0.9rem;}
    .service_list {width: calc(100%/4.5);}
    .service_list li {text-align: center;}
    .service_list > dt {font-size: 1.8em;line-height: 2.8rem;}
    .service_list > dd {margin: 0 1% 20%;font-size: 0.93rem;text-align: center;}
    .page_link a {font-size: 1.07rem;width: 158px;}    
}

/*ipad_橫式*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
    #event_master {width: 94%;margin: 0 auto}
    .bgcolor1 {padding-bottom: 2%;}
    .media_title, .grade_title, .service_title {margin: 0rem 0 0rem;text-align: center;}
    .media {width: auto;}
    .styleA,.styleB,.styleC {margin-bottom: 3%;}
    .styleB,.styleC {padding: 0 0 2.5%;}
    .styleA dd:nth-child(-n+12) {font-size: 1rem;padding: 0.5rem 2rem 0.5rem 2rem;}
    .styleA dd:nth-child(n+13) {font-size: 1rem;padding: 0.5rem 0rem 0.5rem 2rem;}
    .styleB dd:nth-child(n+0), .styleC dd:nth-child(n+0),.styleC dd:nth-child(-n+6) {font-size: 1rem;padding: 0.5rem 0 0.5rem 3rem;}
    .media_photo {width: 33%;}
    /* .media_group img {margin-top: -12px;width: 100%;position: absolute;}
    .media_group2 img { margin-top: -28px;width: 140px;position: absolute;} */
    .media_info {width: 100%;}
    .media_group { width: 48%; }
    .service_list {width: calc(100%/4.5);}
    .service_list li {text-align: center;}
    .lg\:w-8\/12 {width:90%; margin:0 auto;}
    .winnericon {font-size: 1rem;}
    .FB_LINE_event {text-align: center;}
    .Community {font-size: 0.9rem;}
}



/* ----------- iPad Pro ----------- */
/* Portrait and Landscape */
@media only screen 
    and (min-width: 1024px) 
    and (max-height: 1366px) 
    and (-webkit-min-device-pixel-ratio: 1.5) {        
}

/* 直Portrait */
@media only screen 
    and (min-width: 1024px) 
    and (max-height: 1366px) 
    and (orientation: portrait) 
    and (-webkit-min-device-pixel-ratio: 1.5) {
    #event_master {width: 94%;margin: 0 auto}
    .bgcolor1 {padding-bottom: 2%;}
    .media {width: auto;}
    .styleA dd:nth-child(-n+12) {font-size: 1.15rem;padding: 0.5rem 0 0.5rem 4rem;}
    .styleB dd:nth-child(n+0), .styleC dd:nth-child(n+0),.styleC dd:nth-child(-n+6),.styleA dd:nth-child(n+13) {font-size: 1.1rem;}
    .media_group img {margin-top: -12px;}
    .media_group2 img { margin-top: -28px;width: 160px;}
    .media_info {width: 100%;}
    .service_list li {text-align: center;}
    .lg\:w-8\/12 {width:90%; margin:0 auto;}
    .FB_LINE_event {text-align: center;}
    .Community {font-size: 0.9rem;}
}

/* 橫Landscape */
@media only screen 
    and (min-width: 1024px) 
    and (max-height: 1366px) 
    and (orientation: landscape) 
    and (-webkit-min-device-pixel-ratio: 1.5) {
        /*.media_group img {margin-top: -28px;width: 160px;}*/
        /*.media_group2 img {margin-top: -28px;width: 160px;}*/
        
}