@import url("../../../icon_new_6.2/css/all.min.css");
@import url("../../../File/css/ani.css");

/*設計專用樣式Start*/
:root{
  --text_purple: #6b2d8b;
  --text_red: #cc1420;
  --text_black: #3f3f56;
  --border_radius: 1rem;
}

/* Banner */
#Master_title{width:100%;margin:0 auto;}
#Master_title img{margin:auto;display:inline;}
#Master_title{text-align:center;}
#Master_title .banner_sub{font-size:1.1rem;letter-spacing:.15em;color:#666;margin-bottom:.4rem;}
#Master_title h1{font-family:'Noto Serif TC',serif;font-size:2.8rem;font-weight:900;color:#1a1a1a;line-height:1.4;}
#Master_title .banner_desc{font-size:1.4rem;color:#333;margin-top:.6rem;}

/* Section common：區塊距離收緊 */
article.ft_NOTO > section{margin:0;padding: 1.4rem 0 1rem;}
#event_master > header,
.gpa_block > header{text-align:center;margin-bottom:.5rem;}
#event_master > header h2,
.gpa_block > header h2 {
	font-family: math;font-size: clamp(1.5rem, 4vw, 2.7rem);font-weight: 700;color: var(--text_purple);
	line-height: 1.35;letter-spacing: -.04rem;align-items: center;justify-content: center;gap: .45rem;
}
.title_icon{width:36px;height:36px;display:inline-block;vertical-align:middle;flex:0 0 36px;}
.sec_lead{text-align:center;font-size:clamp(1.3rem,4vw,1.9rem);font-weight:bold;color:var(--text_black);margin:1.1rem auto 1.5rem;line-height:1.65;}
.sec_lead mark{color:var(--text_red);background: none;}
.sec_underline{text-decoration:underline;text-underline-offset:.6rem;text-decoration-thickness:from-font;text-decoration-style:double;}
#event_master p{line-height:1.75;}
.gpa_block{margin-bottom:1.1rem;display: inline-block;padding: 2.5rem 1rem 1rem;width: 98%;position: relative;z-index: 1;}
.gpa_block::before{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: #ffffff90;z-index: -1;filter: blur(3px);}
.gpa_block:last-child{margin-bottom:0;}
.text_list{margin:0 auto;padding:0 1rem;text-align:left;}
.text_list li{list-style:disc;margin:0 0 .55rem 1.2rem;font-size:clamp(1.1rem, 4vw, 1.3rem);line-height:1.75;color:#222;}
/* h2 span, h3 span{display:inline-block;text-align:center;font-size:clamp(1.4rem, 4vw, 2rem);color:#fff;background:var(--text_red);font-weight:700;padding: 0 1rem;
clip-path: polygon(85% 0%, 100% 50%, 85% 100%, 0% 100%, 15% 50%, 0% 0%);}
h3 span{font-size:clamp(1.2rem, 4vw, 1.5rem);margin-right: 0.5rem;background:#7a4297;} */
h2 span {color: var(--text_red);)}

/* 黃金三角：整體靠左 */
.triangle_list{max-width:52rem;margin:0 auto;text-align:left;padding:0 1rem;}
.triangle_item{margin:1.5rem auto;}
.triangle_item:not(:last-child){padding-bottom: 0.6rem;border-bottom: 1px solid #a6a6a6;}
.triangle_item:last-child{margin-bottom:0;}
.triangle_item h3{font-size:clamp(1.2rem, 4vw, 1.5rem);font-weight:700;margin-bottom:.35rem;color:var(--text_black);}
.triangle_item h3 .text_red{color:var(--text_red);display:inline;}
.text_list li strong mark, .triangle_item h3 mark{background: #fff78c;color: var(--text_purple);}
.triangle_item p{font-size:clamp(1.05rem, 4vw, 1.2rem);color:#222;}

/* 階梯式實力養成：對齊 PDF 矩陣 + 黑白設計感（細分隔、無粗框） */
.step_wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
.step_board{
  display:grid;grid-template-columns:6.5rem repeat(4,minmax(0,1fr));min-width:880px;
  width:100%;gap:1.3px;background-color: hsl(0deg 0% 100% / 20%); /* 細分隔線色 */border:1px solid #d7c7c7;
}
.step_corner{background:#ffffff20;min-height:160px;}
.step_head{display:flex;flex-direction:column;justify-content:flex-end;background:rgb(255 255 255 / 20%);min-height:160px;padding:0;}
.step_head_box{
  display:flex;flex-direction:column;align-items:center;justify-content:flex-end;text-align:center;background: linear-gradient(to bottom, #4f3eb730 0%, #4f3eb790 100%);
  color:var(--text_black);font-weight:700;padding:.5rem .35rem .35rem;width:100%;
}
/* 階梯高度：大一矮 → 大四高 */
.step_y1{min-height:68px;}
.step_y2 .step_goal{line-height: 2.5;}
.step_y2{min-height:98px;}
.step_y3{min-height:128px;}
.step_y3 .step_goal{line-height: 4;}
.step_y4{min-height:158px;}
.step_y4 .step_goal{line-height: 5.5;}
.step_goal{display:block;font-size:1.2rem;line-height:1.35;margin-bottom:.3rem;}
.step_year{display:block;width:100%;background:#885aa3;font-size:.95rem;padding:.2rem 0;letter-spacing:.04em;color:#fff;}
.step_label{display:flex;align-items:center;justify-content:center;text-align:center;font-weight:700;font-size:.98rem;color:#222;background:#e6d0d080;padding:.7rem .35rem;}
.step_cell{
  display:flex;align-items:center;justify-content:center;text-align:center;background: linear-gradient(to bottom, #fdfdfd90 0%, #e6d0d090 100%);
  padding:.7rem .55rem;font-size:1rem;line-height:1.55;color:#111;
}
.step_label.is_course{background:rgb(231 225 240 / 50%);}
.step_cell.is_course{background:rgb(246 193 218 / 50%);font-weight: bold;}
.step_cell ul{display:inline-block;text-align:left;margin:0;padding:0;}
.step_cell ul li{list-style:none;position:relative;padding-left:.95rem;margin-bottom:.2rem;}
.step_cell ul li:before{content: "";position:absolute;left:0;top:.55em;width:5px;height:5px;border-radius:50%;background:#333;}
.step_cell a{color: var(--text_purple);text-decoration:underline;text-underline-offset:.12em;}
.step_cell a:hover{opacity:.75;}
.step_span{grid-column:span 4;flex-wrap:wrap;justify-content:center;gap:.35rem 1rem;background:#fafafa60;font-weight:700;}
.step_span a{color: var(--text_red);white-space:nowrap;font-weight: normal;}

/* 圖2：四格並排置中（避免 gap+百分比換行） */
.service_area{clip-path: polygon(50% 0, 100% 9%, 100% 100%, 0 100%, 0 9%);}
.service_list{justify-content:center;align-items:flex-start;}
.service_item{width:23%;text-align:center;padding:.2rem;color:#111;text-decoration:none;}
.service_item:is(:nth-child(1),:nth-child(4)){margin: 1.5rem 1% 0;}
.service_item:is(:nth-child(2),:nth-child(3)){margin: 0 1% 1.5rem;}
.service_img{overflow:hidden;border-radius:var(--border_radius);margin: 1rem auto;}
.service_img img{width:100%;display:block;transition:transform .45s ease;}
.service_item:hover .service_img img{transform:scale(1.08) translate(0px,-3px);filter:brightness(1.08);}
.service_item h3{font-size:clamp(1.2rem, 4vw, 1.45rem);display:inline-block;background: #00000080;color: #fff;border-radius: var(--border_radius);padding: 0 1.2rem .2rem;line-height:1.35;}
.service_item h3::before{content: '► ';}
.service_item:hover, .media_group:hover{position: relative;transform: translate(0,-3px);}
.service_item:hover h3{transform: translate(0,6px);}

/* 圖1：名師雙欄並排（YT 短影音 9:16） */
.teacher_list{justify-content:center;align-items:stretch;max-width:980px;margin:0 auto;}
.teacher_item{width:48%;margin:0 1%;padding:.2rem;text-align:center;}
.teacher_video{width:100%;max-width:320px;aspect-ratio:9/16;margin:0 auto .55rem;overflow:hidden;background:#111;border-radius:var(--border_radius);position:relative;}
.teacher_video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.teacher_video span{font-size:1.15rem;color:#333;}
.teacher_caption{font-size:clamp(1.05rem, 4vw, 1.4rem);font-weight:700;color:#111;text-align: center;padding-top:.55rem;color: var(--text_red);}
.teacher_caption i{margin-right:.35rem;}
.teacher_caption strong{display: block;margin: auto;font-size: clamp(1.3rem, 4vw, 1.8rem);color: var(--text_purple);}

/* 學長姐推薦：整體靠左 */
.media_group{width: calc(100%/2 - .3rem);border-radius:var(--border_radius);background: linear-gradient(145deg, #ffffff 30%, transparent);align-items:flex-start;padding:1.2rem 1rem;margin: 0.5rem auto 0;}
.media_group:last-child{border-bottom:none;}
.media_photo{padding:.15rem .4rem 0 0;text-align:left;margin: 0 auto;}
.media_photo img{width:120px;height:120px;object-fit:cover;border-radius:50%;margin: auto;}
.media_des{padding:.05rem 0 0 .15rem;text-align:left;}
.media_name{margin-bottom:.3rem;font-size:clamp(1.2rem, 4vw, 1.35rem);font-weight:700;}
.media_name a{color:#0b57a8;}
.media_result{font-size:clamp(1rem, 4vw, 1.1rem);font-weight:700;color:#111;padding:.3rem .55rem;}
.media_result .badge{display:inline-block;background:var(--text_red);color:#fff;font-size:.88rem;padding:.08rem .4rem;margin-right:.4rem;font-weight:700;white-space:nowrap;}
.media_content{font-size:1.02rem;color:#222;line-height:1.75;}
.media_content a{color:#0b57a8;}

/* CTA 並排置中 */
.more_link{justify-content:center;margin-top:1.1rem;}
.more_link a {
	display: block;width: 42%;margin: 0 1.5%;text-align: center;padding: .9rem 1rem;background: var(--text_purple);color: #fff;
	font-size: 1.15rem;font-weight: 700;text-decoration: none;white-space: nowrap;border-radius: var(--border_radius);
}
.more_link a:hover{opacity:.85;}

@media (max-width: 1200px){
  #Master_title h1{font-size:2rem;}
  #Master_title .banner_desc{font-size:1.15rem;}
  .title_icon{width:30px;height:30px;flex-basis:30px;}
  .media_photo img{width:80px;height:80px;}
  .service_item{width:46%;margin:0 2% .8rem;}
  .teacher_item{width:48%;}
  .more_link a{width:46%;}
  .step_corner,.step_head{min-height:132px;}
  .step_y1{min-height:56px;}
  .step_y2{min-height:80px;}
  .step_y3{min-height:104px;}
  .step_y4{min-height:128px;}
  .step_goal{font-size:.95rem;}
}

/*設計專用樣式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", 微軟正黑體, Arial;}
a{text-decoration:underline;}
a:hover{text-decoration:none;}
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: rgba(99, 99, 99, 0.74) 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: linear-gradient(to right, #41a4d2, #ffe56e);}
.bgcolor1, .bgcolor5{background: linear-gradient(to bottom, #e2ddf1, #ffffff);position: relative;z-index: 1;}
.bgcolor1::before {
	content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url("../images/students_bg.png") no-repeat left top / cover;
	z-index: -1;filter: blur(1px);opacity: 0.06;background-attachment: fixed;
}
.bgcolor2,
.bgcolor3{position:relative;z-index:1;background: #ffffff;
background: radial-gradient(circle, rgba(255, 255, 255, 1) 62%, rgba(186, 163, 240, 1) 98%);}
.bgcolor2::after{
  content: "";position: absolute;bottom: 0;right: 0;width: 488px;height: 390px;
  background: url("../images/students_bg2.png") no-repeat center top / 100% auto;z-index: -1;
}
.bgcolor3::before{
  content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: -1;filter: blur(8px);
  background: linear-gradient(142deg, hsl(287.99deg 45.31% 50.38% / 40%) 60%, hsl(265deg 66% 39% / 60%) 90%);  
}
.bgcolor4{background: linear-gradient(-50deg, #f2bb3c, #ffffff);}
/*所有元素漸變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,#event_sec,#event_third,#event_fourth,#event_fifth,#event_sixth{margin:.8% auto;display:inline-block;width:1200px;padding:0;}
    #event_master{padding: .5rem 0;}  
    /* 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:"微軟正黑體";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: 1%;margin-bottom: 1%;}
    #askarea #formlist{width:80%;margin:2% auto;color:#FFF}
    #askarea SELECT,#askarea input{border-radius:var(--border-radius);background-color:#FFF;border:#FFF;padding:.5%;margin:auto 1% 1% auto}
    #askarea SELECT{width:19.7%}
    #askarea input{color:#A1A1A1}
    #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:#eb543f;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){
    /*隱藏的區塊*/
    #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;padding: 0.5rem 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%;}

    .service_item:is(:nth-child(1),:nth-child(4)),
    .service_item:is(:nth-child(2),:nth-child(3)){margin: 0 1% 1rem;}
    .service_area{clip-path:none;}
    /*body*/
    #Master_title{display:inline-block;}/*主圖位置ID*/
    @media all and (orientation : portrait){#Master_title{margin-top: 15%;}}
    @media screen and  (orientation:landscape) {#Master_title{margin-top: 10%;}}
    /*滿百100%區域*/
    .row100{width:100%;}
    /*資料集中寬外框*/
    #event_master,#event_sec,#event_third,#event_fourth,#event_fifth,#event_sixth{width:100%;padding:0%;margin:.5% auto;}
    #event_master{padding: .5rem 1.5rem;}
    /*div section標籤段落*/
    #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: var(--border-radius);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: 50%;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 (max-width: 1660px){.bgcolor2::after{display: none;}}

@media (max-width: 767px){
  #Master_title h1{font-size:1.55rem;}
  #Master_title .banner_sub{font-size:1rem;}
  #Master_title .banner_desc{font-size:1rem;}
  .gpa_block{padding: 1.5rem .3rem 0rem;}
  .gpa_block::before{clip-path:none;}
  .gpa_block li{word-break: break-all;}
  .step_board{min-width:760px;grid-template-columns:5.2rem repeat(4,minmax(140px,1fr));}
  .step_corner,.step_head{min-height:112px;}
  .step_y1{min-height:48px;}
  .step_y2{min-height:68px;}
  .step_y3{min-height:88px;}
  .step_y4{min-height:108px;}
  .step_label,.step_cell{font-size:.9rem;padding:.55rem .35rem;}
  .step_span a{white-space:normal;}
  .service_item,.teacher_item,.more_link a{width:100%;margin:0 0 .7rem;}
  .more_link a{white-space:normal;font-size:1.05rem;}
  .media_photo{text-align:center;width:100%;}
  .media_photo img{margin:0 auto .45rem;}
  .bgcolor1::before{background: url("../images/students_bg.png") no-repeat center center / cover;opacity: 0.05;}
  .bgcolor2::after{display: none;} 
  article.ft_NOTO > section{padding: 1rem 0;}  
  .media_group{width: 96%;}
  .triangle_item{margin: 1rem auto;}
}

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