﻿/*Event 重設*/
#EventContainer section h1::before{content:initial;}
/*Event 預設*/
#event_master, #event_sec, #event_third, #event_fifth, #event_sixth{padding:1rem;}
#EventContainer .bgcolor0{/*background:url(../images/0911042_02.png) repeat-y fixed center top;background-size:100%;*/background: linear-gradient(to right, #cfcfcf 20%, #f5f5f5 50%, #cfcfcf 80%);}
#EventContainer .bgcolor1{background:linear-gradient(to right, #b6161e 20%, #a4091a 80%);}
/*定位*/
.fixed{position:fixed;}
/*內外距*/
.my-2{margin-top:0.5rem;margin-bottom:0.5rem;}.p-2{padding:0.5rem;}
/*字級*/
.text-base{font-size:1rem}.text-xl{font-size:1.25rem}
.text-2xl{font-size:1.5rem}.text-3xl{font-size:1.875rem}
/*字顏色*/
.text-yellow-300{color:#feffbc}.text-white{color:#fff}
/*DIY--設計可增加用樣式Start*/
#Master_title img{margin:auto;}
.ADLink{left:0;bottom:3.5rem;border-radius:0 10px 10px 0;background:linear-gradient(to right, #c1843f, #b26c1a);padding:0.5rem;border: 1px solid #ffffa3cc;}
.ADLink dd{font-size:1.125rem;padding:0.125rem 0.25rem;}
.ADLink dd,.ADLink dd a{color:#feffbc;text-decoration:none;}
.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;}
.grade_title{background: linear-gradient(to right, #f2e19b 10%, #fffcef 30%, #fffada 60%, #f2e19b 90%);color:#00a1ac;border-radius: 10px;transform: skewX(-10deg);margin:2% 5% 0;text-align:center;font-weight:bold;padding:0.5% 0;box-shadow:5px 5px 6px rgba(0,0,0,.4);font-family:"Microsoft YaHei";letter-spacing:2px;font-size:2.8rem;}
.grade_title img{vertical-align:middle;transform:skewX(10deg);width:42px;margin-right:1%;display:inline-block;}
.grade_title b{color:#b80a1e;}
.grade_title h1{font-size:1.875rem;text-align:center;}
.bg-orange-spec{background-color:#F9B234;}
.classShow dt{display:inline-block;}
.classShow dd{max-width:80%;}
.classShow dd img{width:100%;border-radius:10px;border:5px #3d6eb4 solid;}
.classShow .far{color:#7EB64F;}
.photo_intro{text-align:center;}
.photo_intro img, .paper img, .grade_content1 img{margin:auto;}
/*主圖*/
.banner{text-align:center;color:white;position: relative;filter: drop-shadow(0px 0px 10px #000000ee);}
.banner img{margin:auto;}
.banner mark{display:block;}
.banner ul{position: absolute;bottom: 4%;left: 22%;}
.banner ul li{margin: 0 -.5rem;}
a.target-fix{top: -11rem;}
/*應屆考取超犀利*/
.grade_list{padding:1% 5%;font-size:1.5rem;}
.grade_list li{border-bottom:dotted 1px #ffffa3;width:calc(100%/2);font-size: 1.85rem;color: white;}
.grade_list li strong{/*display:block;*/color: #ffffa3;padding: 0 0.5rem 0 0;}
.grade_list li:last-of-type{border:0;margin: auto auto auto 0;}
/*升學、就業連續考取*/
.successive li{width:100%;}
/*每一次上榜都是證明*/
.proof li{width:calc(100%/3);}
/*行政學院風雲人物賞*/
.heroic-box{padding:5rem 0 0}
.media-wrap .heroic{width:75%;}
.media-wrap .heroic figure{width:300px;height:300px;border-radius:75% 40% 35% 85% / 70% 70% 45% 50%;background:linear-gradient(to left, #00adda 0%, #da252b 100%);display:flex;align-items:flex-end;justify-content:center;}
.media-wrap .heroic img{height:380px;border-radius:0 0 85px 145px;}
.media-wrap .heroic:nth-of-type(2){margin: auto 0 auto auto;text-align: right;}
.media-wrap .heroic:nth-of-type(2) dl{margin:2rem auto auto;}
.media-wrap .heroic dl{width:calc(100% - 300px);padding:0 2rem 1rem;margin: auto auto 0;}
.heroic dl dt{color:#b80a1e;}
.heroic dl dt strong{font-size:2.4rem;border-left:initial;padding-left:initial;display:block;}
.heroic dl dd{text-wrap:pretty;}
.media-wrap .heroic:nth-of-type(2) dt{margin-right:0rem;line-height:1.3em;}
.media-item{width:calc(100%/4);justify-content:center;margin:0 auto auto;padding:2rem 1rem;}
.heroic{margin:0;padding:0;}
.media-item figure{width:120px;}
.media-item figure img{border-radius:50%;}
.media-item dl{color:#00a1ac;font-size:1.05em;padding:1% 0%;border-bottom:dotted 1px;}
.media-item dl a{color:#00a1ac;}
.media-item dl dd{padding:0 0 0.5rem;}
.media-item dd .name{font-size:1.3em;}
.media-item dt{font-weight:bold;font-size:1.3em;margin-bottom:0.5em;}
.media-item dt strong{font-size:1.15rem;color:#b80a1e;margin: .25rem 0 0;border-left:solid 3px;padding-left:0.5em;display:block;line-height:1.35em;}
.exp-btn{border:1px solid #00a1ac;padding:0 10px 3px;font-size:0.8em;border-radius:1em;text-decoration:none;font-weight:bold;margin-left:3px;}
.media-item dl dd strong{background:linear-gradient(to bottom, #ffffff00 45%, #fffbdf 45%, #fff0ac 100%);}
.text-align_justify{text-align: justify;}
/*緞帶標題*/
.ribbon{left:0;right:0;margin:0 auto;width:80%;position:absolute;text-align:center;font-size:18px!important;background:linear-gradient(to bottom,#216caf 10%,#0b406f 90%);box-shadow:rgba(000,000,000,0.3) 0 0 0}
.ribbon:before,.ribbon:after{content:'';position:absolute;display:block;bottom:-1em;border:1.5em solid #1c63a2;z-index:-1}
.ribbon:before{left:-2em;border-right-width:1.5em;border-left-color:transparent;-webkit-box-shadow:rgba(000,000,000,0.4) 0 0 0;-moz-box-shadow:rgba(000,000,000,0.4) 0 0 0;box-shadow:rgba(000,000,000,0.4) 0 0 0}
.ribbon:after{right:-2em;border-left-width:1.5em;border-right-color:transparent;-webkit-box-shadow:rgba(000,000,000,0.4) -0 0 0;-moz-box-shadow:rgba(000,000,000,0.4) -0 0 0;box-shadow:rgba(000,000,000,0.4) -0 0 0}
.ribbon .ribbon-content:before,.ribbon .ribbon-content:after{border-color:#0e3350 transparent transparent;position:absolute;display:block;border-style:solid;bottom:-1em;content:''}
.ribbon .ribbon-content:before{left:0;border-width:1em 0 0 1em}
.ribbon .ribbon-content:after{right:0;border-width:1em 1em 0 0}
.ribbon-stitches-top{margin-top:2px;border-top:0 dashed rgba(0,0,0,0.2);-moz-box-shadow:0 0 2px rgba(0,0,0,0.5);-webkit-box-shadow:0 0 2px rgba(0,0,0,0.5);box-shadow:0 0 2px rgba(255,255,255,0.5)}
.ribbon-stitches-bottom{margin-bottom:2px;border-top:0 dashed rgba(0,0,0,0.2);-moz-box-shadow:0 0 2px rgba(0,0,0,0.3);-webkit-box-shadow:0 0 2px rgba(0,0,0,0.3);box-shadow:0 0 2px rgba(255,255,255,0.3)}
.ribbon a{color:white;}
/*變換區*/
.billboard_tab_out{position:relative;z-index:0;}
.image_title{text-align:center;font-size:1.3em;margin:1% 0;}
.image_title,.image_title a{color:#FFF;text-decoration:underline;background-color:#b80a1e;padding:0.3em;margin:0;border-radius:0 0 0.8em 0.8em;}
.active{display:block;animation-name:ani;animation-duration:0.5s;}
@keyframes ani{from{opacity:0;}to{opacity:10;}}

/*上榜四大關鍵*/
[id*="tab"]{display:none;}
[id*="content"]{display:none;padding:1rem;width:100%;animation:leftToRight 0.5s ease-in-out;color:#00a1ac;text-align:center;overflow:hidden;}
#key_points{overflow:hidden;}
#key_points input:checked + label{color:#00a1ac;text-decoration:none;}
#tab1:checked ~ #content1,#tab2:checked ~ #content2{display:block;}
#key_points label{cursor:pointer;font-size:1.5rem;width:calc(100%/3);color:#b80a1e;font-weight:900;font-family:MStiffHeiHK;padding:2rem 0;text-align:center;text-decoration:underline;border-bottom:dotted 2px #f12d33;}
#lab a:hover{top:initial;}
#key_points label.elink{padding: 0;}
.elink a{padding:2rem 0;display: block;}
/*備考資源*/
.month_arrowTitle{text-align:center;background:linear-gradient(to right,#11c1bc 30%,#00a1ac 100%);border-radius:.5em;padding:0.75rem 0;position:relative;font-family:MStiffHeiHK;}
.month_arrowTitle strong{color:#fffb6b;}
.service-item{width:calc(100%/3 - 1rem);display:flex;margin:1rem auto 0;}
.service-item:nth-of-type(n+7):nth-of-type(-n+10){margin:1.5rem auto;}
.service-item dl{font-size:1.0rem;width:100%;background-color:#eafeffcc;border-radius:0.5em;}
.service-item dt{font-size:1.25rem;font-weight:bold;text-align:center;background-color:#00a1ac;padding:0.5rem;border-radius:0.5em 0.5em 0 0;color:white;margin:auto auto 0.5rem;}
.service-item dt a{color:white;}
.service-item dd{padding:0 2rem 0 3rem;color:#00a1ac;text-indent:-1rem;}
.service-item dd::before{content:'•';padding:0 0.5rem 0 0;font-size:1.25rem;}
.service-item .mobile{padding:0 2rem 0.35rem 3rem;}
.service-item figure{text-align:center;padding:0.5rem;}
.service-item figure img{margin:auto;}
.number{background-color:#00a1ac;color:#fff;width:15px;height:15px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:0.8em;}
.learn-type{text-align:center;margin:1rem auto auto;}
.learn-type a{background-color:#002e75;color:#fff;padding:1rem;display:inline-block;margin:1rem;border-radius:2rem;text-decoration:none;}
.learn-type a:hover{background-color:#7F2E53;}


@media screen and (min-width:1201px){
	#event_master, #event_sec, #event_third, #event_fourth, #event_fifth, #event_sixth{width:1200px;margin:auto;}
	.ADLink dd{position:relative;}
	.ADLink dd a::before{content:'☑ ';}
	.ADLink dd a{}
	.photo_intro{width:80%;margin:auto;}
	#alt_txt a{width:875px;display:block;margin:auto;}
	.heroic dl dd{padding:0;}

}
@media screen and (max-width:1200px){
	.bgcolor0{background-size:cover;}
	.classShow dd{width:100%;}  
	.grade_subtitle{font-size:1.1rem;}
	.media-item{width:calc(100%/2);padding:1rem 0;}
	.ADLink{border-radius:0;margin:0;bottom:0%;right:0;left:0;box-shadow:0px 0px 3px rgb(238, 253, 170);z-index:7;width:100%;text-align:center;box-sizing:border-box;}
	.ADLink dd{margin:auto;display:inline-block;}
	.ADLink dd a{text-decoration:underline;font-size:0.9rem;}	
	.grade_A, .grade_B, .grade_C{justify-content:center;}
	.grade_A li, .grade_C li{width:calc(100% - 0.5rem);}
	.grade_B li, .grade_D li{width:calc(100%/2 - 0.5rem);}
	#Footer .footer-wrap{padding:1.5rem 0.5rem 5rem;}
	.ribbon:before, .ribbon:after{bottom:0.25rem;}
	.ribbon .ribbon-content:before, .ribbon .ribbon-content:after{bottom:auto;top:-1rem;}
	.ribbon .ribbon-content:before{transform:rotate(90deg);}
	.ribbon .ribbon-content:after{transform:rotate(-90deg);}
	/*行政學院風雲人物賞*/
	.heroic-box{display:flex;flex-wrap:wrap;align-items:flex-start;padding:2rem 0 0;}
	.media-wrap .heroic{width:calc(100%/2);}
	.media-wrap .heroic dl{width:100%;margin:auto;}
	.heroic dl dt, .media-wrap .heroic:nth-of-type(2) dt{margin:auto;text-align:center;}
	.media-wrap .heroic:nth-of-type(2){text-align:left;}
	.media-wrap .heroic figure{width:160px;height:160px;}
	.media-wrap .heroic img{height:200px;max-width:initial;border-radius:0 0 40px 80px;}
	.media-wrap .heroic:nth-of-type(2){position:initial;}
	.media-wrap .heroic:nth-of-type(2) dl{order:2;margin: auto;}
	.heroic:nth-of-type(2) figure{order:1;}
	.service-item dd, .service-item .mobile{padding:0 1rem 0 1.5rem;}
}
@media screen and (max-width:1999px){.banner ul {width: 36%;}}
@media screen and (max-width:1180px){
	.proof li{width:calc(100% / 2)}	
}
@media screen and (max-width:1024px){.banner ul {width: 55%;bottom: 2%;left: 6%;}.grade_list li strong{display:block;}}
@media screen and (max-width:767px){ 
	.sm\:block{display:block;}
	#key_points label{font-size:1.1rem;line-height:1.3em;padding:0.5rem 0;}	
	.elink a{padding:0.5rem 0;}
	[id*="content"]{padding:1rem 0;}
	.photo_intro, .service-item figure, .media-item dl{width:100%;}
	#back-top{bottom:10% !important;}
	.ADLink{padding:0.25rem;}
	.ADLink dd,.ADLink dd a{line-height:1;}
	.service-item{width:100%;}
	.media-item figure{margin:auto;}
	.grade_A, .grade_B, .grade_C, .grade_D{font-size:1.25rem;}
	.grade_A li{font-size:1.25rem;}
	.grade_B li, .grade_D li{width:calc(100% - 0.5rem);}	
	.grade_C{padding:1%;}
	.grade_C li strong{display:block;}
	.media-item, .media-wrap .heroic{width:100%;}
	.grade_title{font-size:1.5rem;}
	.heroic:nth-of-type(2){padding-top:2rem;}
	.heroic dl dt strong {font-size: 1.9rem;}
	.banner ul {width: 55%;left: 6%;}
	.banner ul li{margin: 0 -.2rem;}
}
@media (max-width:767px) and (orientation: portrait){
	.grade_list li{width: 100%;font-size:1.5rem;}
	.proof li{width:100%;}
}
.proof li strong{display:initial;padding: 0 0.5rem 0 0;}