@import url("../../../icon_new/css/all.min.css");
/*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;}
/*remember to highlight inserts somehow!*/
ins {text-decoration: none;}
del {text-decoration: line-through;}
/*所有元素漸變0.5秒*/
* {transition: all .5s;}
/*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;}
body {font-family: 'Noto Sans TC', sans-serif;font-weight: ;}
a {text-decoration: underline;}
a:hover {text-decoration: none;}
ul,li {margin: 0px;padding: 0px;list-style-type: none;}
.bg1 {background: url(../images/1201060_01.png) no-repeat top center #FFF;}
.bg2 {background-color: #dc3c3c;}
.bg3 {background-color: #edd4a7;}
.bg4 {background-color: #d6ac89;}
.bg5 {background-color: #f5eae4;}

.text-2xl {font-size: 1.5rem;}
.text-4xl {font-size: 2.25rem;}
.flex {display: flex;}
.flex-wrap {flex-wrap: wrap}
.justify-center {justify-content: center;}
h1 {font-size: 3rem;}
h2 {font-size: 2.5rem;}
h3 {font-size: 2.25rem;}
small {font-size: 0.95rem;}
/* bar */
.bar { width: 155px; height: auto; padding: 1rem; position: fixed; top: 36%; right: 0; z-index: 5; background-color: rgba(255,255,255,.45); border-radius: 30px 0 0 30px; font-size: 1.2rem; font-weight: bold; text-align: center; display: flex; flex-wrap: wrap; justify-content: center; }
.bar a{color: black;}
.bar a:hover{color: #ee3100;}
.bar ul{display: flex;flex-wrap: wrap;justify-content: space-around;}
.bar img { max-width: 100%; vertical-align: bottom; }

/*主圖*/
#Master_title{position: relative;width: 1200px;margin: 0 auto 1%;}
#Master_title img{margin: 3% auto 1%;}

.feature{display: flex;justify-content: center;align-items: center;}
.feature .photo img{display: block;margin: 1rem 0;width: 100%;}
.feature .txt{border: #000 solid 1px;font-size: 1.4rem;}
.feature .photo,.feature .txt{width: 20%;}

/*疑難雜症*/
.topic_list{text-align: center;}
.topic_list li{width: 25%;border-bottom: solid 3px #c62222;margin: 1% 0.8% 0 0;}
.topic_list li:first-of-type{width: 31%;}
.topic_list li:last-of-type{width: 38%;}
.solve{margin-top: 1rem;}
.solve a{}

/*三大錦囊妙計*/
.handbook {width: calc(100%/3 - 3%);border: 0px solid black;border-radius: 1.5rem;margin: 0% 3% 0 0;height: 130px;box-shadow: 0px 0px 0px #5c5c5c;position: relative;overflow: ;}
.handbook img {position: absolute;left: -4%;top: -45%;width: 160px;}

.handbook:nth-of-type(1) {background: #2f74aa;}
.handbook:nth-of-type(2) {background: #f06f22;}
.handbook:nth-of-type(3) {background: #85b435;}
.handbook dl {}
.handbook dt {font-size: 1.8rem;margin-left: 40%;font-weight: bold;color: white;margin-top: 4%;}
.handbook dd {background: linear-gradient(to right, #ffffff00 10%, rgb(225 225 225) 100%);font-size: 1.25rem;margin: 0 0% 0 36%;text-align: right;padding: 0.1rem 0.3rem;line-height: 1.5rem;}

.up{position:absolute;top:-30px;font-size: 2rem;margin-left: 1rem;padding: 0.2rem 1rem;color: #FFFFFF;}
.speech-bubble { position: relative; background: #f05e5e; border-radius: .4em; }
.speech-bubble:after { content: ''; content: ''; position: absolute; left: 0; top: 50%; width: 0; height: 0; border: 13px solid transparent; border-right-color: #f05e5e; border-left: 0; border-bottom: 0; margin-top: -6.5px; margin-left: -13px; }

.title{font-size: 3.2rem;font-weight: 900;font-family: "Microsoft YaHei";color: #c62222;}
.title.fcolor{color: #fff;}

/*錦囊妙計*/
.plan {display: flex;justify-content: center;}
.plan dt{margin-right: 0.5rem;}
/*法科名師*/
.each_title {font-size: 3.5rem;margin: 1rem auto;font-family: MStiffHeiHK;text-align: center;}
.teacher_flex,.price-flex,.list_flex{display: flex;flex-wrap: wrap;}
.teacher_flex,.price-flex,.price-flex+a,.list_flex,.billboard a{margin: 2% 0 0;}
.teacher-item {width: calc(100%/3 - 2%);text-align: center;margin:1%;background: linear-gradient(to bottom, #fff2de 5%,#ffffff 70%);border-radius:0px;}
.teacher-item dt{font-size: 2rem;font-weight: bold;background: linear-gradient(to top, #c7111c 3%,#e5333f 55%, #c0111b 108%);color: white;border-radius: 5px;margin: -8px -7px 7px;position: relative;}
.teacher-item dt:before,.teacher-item dt:after{content: "";position: absolute;width: 4px;height: 100%;background: linear-gradient(to bottom, #b9863b 0%,#edd29d 50%, #b6833e 100%);top: 0;}
.teacher-item dt:before{left:3%}
.teacher-item dt:after{right:3%}
.teacher-item dd{font-size:1.5rem;margin: 0 5%;border-bottom: dotted 2px #cc1722;padding-bottom: 1%;}
.teacher-item dd a{color: #cc1722;}
.teacher-item figure{margin: 0;}
.teacher-item ul{padding: 1% 5%;margin: 0;background: linear-gradient(to right, #d9bb90 10%,#fff1d5 100%);color: #cc1722;border-bottom: solid 5px;}

.teacher-item .indent{display: block;text-indent: 5em;}
.start-date{display: flex;justify-content: center;align-items: center;margin-bottom: 2rem;flex-wrap: wrap;}
.start-date div,.start-date a{margin: 0 2rem;font-size: 1.7rem;}
/* .start-date a{margin: 0 2rem;} */
/*各科講義*/
.qa img{width: 100%;height: auto;}
/*開課時間*/
.time table{width: 100%;border-collapse:collapse;background-color: white;}
.time table th,.time table td{border: #c62222 solid 1px;padding: 0.3rem 0.2rem;}
.time table th{background-color: #e12222;color: wheat;border-right: #f5deb3 solid 1px;}

/*優惠*/
.price-item {width: calc(100%/2 - 6px);margin: 0 3px;background: #f1f1f1;border-radius: 0.5em;text-align: center;}
.calligraphy{position: absolute;right: 0;left: 0;margin: auto;z-index: 5;bottom: 4%;filter: drop-shadow(-1px 13px 4px rgba(0, 0, 0, 0.2));text-align: center;}
.price-item p{margin: 0;padding: 2% 10% 0%;font-size: 1.8rem;}
.price-item h4 {font-size: 2rem;font-weight: bold;color: #ffffff;background: #fc4128;margin: 0 0px;border-radius: 0.5em 0.5em 0 0;padding: 1.5% 0;}
.price-tag {color: red;font-weight: bold;}
.billboard a{display: block;font-size: 1.7rem;text-align: center;}
.guide-btn{text-align: center;}
.guide-btn a,.solve a,.start-date a{font-size: 1.7rem;margin: 1rem;background: #e50303;color: #FFF;padding: 0.1em 1em;text-decoration: none;border-radius: 1em;border: 0 solid #b16900;display: inline-block;font-weight: 700;}

/* 亮眼佳績 */
.Vuetabs {margin-bottom: -2px;display: flex;justify-content: space-around;}
.Vuetabs a{width: 50%;font-size: 1.4rem;cursor: pointer;padding: .8rem;transition: background-color 0.2s;border: 1px solid #ccc; border-right: none;background-color: #f1f1f1;border-radius: 1em 1em 0 0;font-weight: 900;text-decoration: none;}
.Vuetabs a:last-child {border-right: 1px solid #ccc;}
.Vuetabs a:hover {background-color: #aaa; color: #fff;}
.Vuetabs a.active {background-color: #fff;color: #484848;cursor: default;border-bottom: 2px solid #fff;}
.topgrade{background:#FFF;border-radius:0 0 1em 1em;padding:2%;}
.topgrade .topgrade_wrap{display: flex;justify-content: center;flex-direction: column;align-items: center;margin: 0.5rem 0;}
.topgrade .f-red{color: red;font-weight: 900;}
.topgrade ul li{font-size:1.4rem;line-height:1.7em;text-align:left}
.topgrade .topgrade_wrap ul li:before{content:"\f559";font-family:"Font Awesome 5 Free";font-weight:900;font-size:2rem;margin-right:8px;color:#fc4128}
.topgrade ul li strong{font-size:1.8rem;color:#fc4128}
.topgrade_focus{font-size: 1.8rem;font-weight: 900;background-color: #fef23a;display: inline-block;width:90%;}
.more_board{margin:2% auto}
.more_board>ul{margin:0 auto 0 4%;flex-wrap: wrap;}
.more_board>ul>li{width:50%;text-align:left;font-size:1.15rem;line-height:1.8em;color:#000}
.more_board>ul>li>span{color:#fc4128;font-weight: bold;}
.more_board .board li{font-size: 1.3rem;color: #000;margin: .1rem auto;}
.more_board .board li:last-child{margin-block-end:.5rem;}
.rank {color: #fc4128;font-weight: bold;}
.billboard a{color:#FFF;margin-top:1.5rem;background-color:#000;padding:.3em 1em;text-decoration:none;border-radius:1em;border:0 solid #b16900;display:inline-block;font-weight:700;}
.list{text-align: justify;}
.list li{padding: .2rem 0;}
.list li::before {position: relative;content: '\f559';font-family: "Font Awesome 5 Free";font-weight: bold;margin-right: 0.5rem;font-size: 2rem;color: #fc4128;}
.list_flex{padding-left: 5rem;}
.list_flex li {font-size: 1.4rem;position: relative;width: calc(100%/2);text-align: left;line-height: 33px;padding: 4px 0;color: #000;}
/* .list_flex li::before {position: relative;content: '\f559';font-family: "Font Awesome 5 Free";font-weight: bold;margin-right: 0.5rem;font-size: 2rem;color: #fc4128;} */
.social_txt{text-align: center !important;}

@media (min-width: 1201px) {
    /*body*/
    #BodyHeader_event,#header-share {width:100%;}
    #BodyHeader_event a,#BodyHeader_event #header-share {font-size: 1.1em;}
    #BodyHeader_event #header-share {margin:0 auto;	background-color: #FFF;}	
    #BodyHeader_event #header-share img {margin-bottom: 5px;}
    #BodyHeader_event a {color: #333;}
    #BodyHeader_event a:hover {color: #666;/*position: relative;top: 2px;bottom: 2px;*/}
    #BodyContent {width:100%;padding:0;margin:0;	}
    #BodyContainer_event {width:100%;margin:0;}
    #BodyHeader_event_rwd,#topli {display:none;}
    /*event*/
    .row100 {width:100%;}/*滿百100%區域*/
    #event_master,#event_sec,#event_third,#event_fourth {margin:1% auto 2%;display:inline-block;width:1180px;padding:10px;font-size: 1.5rem;}/*資料集中1200px寬外框*/
	#event_fifth {margin:0% auto 2%;display:inline-block;width:1180px;padding:0 10px 10px;font-size: 1.5rem;}/*資料集中1200px寬外框*/
    #Master_title {display:block;}/*主圖位置ID*/
    /*footer*/
    #BodyFooter_rwd,#footer_inline ul,#footer_inline ul li,#footer_address,#footer_address ul,#footer_address ul li {width:100%;}
    #BodyFooter_rwd {float: left;background-color:#FFF;}
    #BodyFooter_rwd a:hover {text-decoration: none;}
    #BodyFooter_rwd #footer_line {width: 90%;height: auto;margin:1% 5%;display: block;float: left;text-align: center;border-top: thin solid #999;}
    #BodyFooter_rwd #footer_inline a {color: #000;font-size:1em;}
    #BodyFooter_rwd #footer_inline ul {float: left;padding:0;margin:3% auto 0% auto;}
    #BodyFooter_rwd #footer_inline ul li {display: inline;line-height: 2em;font-size: 1em;	clear: both;	margin-right: 0.5em;}
    #BodyFooter_rwd #footer_inline ul li img {height:auto;vertical-align: middle;}
    #BodyFooter_rwd #footer_address {margin: 0% auto auto auto;text-align: center;}
    #BodyFooter_rwd #footer_address a {color:#000;}
    #BodyFooter_rwd #footer_address ul {padding:0;margin-bottom: 1%;text-align: center;}
    #BodyFooter_rwd #footer_address ul li {margin-right:0;float:left;line-height: 2em;text-align: center;font-size: 1em;	list-style-type: none;	display:inline-block;}
    /*ask*/
    #askarea_out * {font-family:"微軟正黑體";font-size:1em}
    #askarea_out {background-color:#fb932c;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;margin-top:2%;}
    #askarea .asktitle {color:#FFF;font-size:1.4em}
    #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:#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:#542b05;padding:.5em}
    /*瀏覽器相容性通知*/
    #noie {color: #FFF;width: 100%;height:60px;text-align: center;border: 1px solid #006699;	background-color: #3399CC;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,.toparea {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;}
    /*portrait直式 landscape橫式*/
    #BodyHeader_event_rwd img {height: auto;margin:2.5% auto 0;}
    @media screen and (orientation:portrait) {#BodyHeader_event_rwd img {max-width: 50%;}}
    @media screen and (orientation:landscape) {#BodyHeader_event_rwd img {max-width: 25%;}}
    /*滿百100%區域*/
    .row100 {width:100%;}
    /*資料集中1200px寬外框*/
    #event_master,#event_sec,#event_third,#event_fourth,#event_fifth {margin:2% auto;display:inline-block;width:96%;padding:1%;}
    /*body*/
    #Master_title {display:block;}/*主圖位置ID*/
    @media all and (orientation : portrait) {#Master_title {margin-top: 15%;}}
    @media screen and  (orientation:landscape) {#Master_title {margin-top: 10%;}}
    /*event*/    
    .list_flex{padding-left: 2rem;}
    .list_flex li{font-size: 1rem;}
    /*footer*/
    #BodyFooter_rwd,#footer_line,#footer_inline ul,#footer_inline ul li,#footer_address,#footer_address ul,#footer_address ul li {width:100%;float: left;}
    #BodyFooter_rwd {background-color:#FFF;margin-top:5%;}
    #BodyFooter_rwd #footer_line {margin:5% auto 3%;display:block;height:auto;text-align:center;border-top:thin solid #999}
    #BodyFooter_rwd #footer_inline a {color: #000;line-height: 2em;}
    #BodyFooter_rwd #footer_inline ul {padding:0;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 {display:inline-block;margin-right:auto;line-height:2em;font-size:1em;clear:both}
    #BodyFooter_rwd #footer_address {margin: 0% auto auto auto;text-align: center;}
    #BodyFooter_rwd #footer_address a {	color: #000;line-height: 2em;}
    #BodyFooter_rwd #footer_address ul {padding:0;text-align:center;margin-bottom:1%;clear:both}
    #BodyFooter_rwd #footer_address ul li {display:block;line-height:2em;text-align:center;font-size:.8em}
    /*ask*/
    #askarea {background-color:#fb932c;width: 98%;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:5%;*/}
    #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:#542b05;-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:.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: 992px) and (max-width: 1199px) {
		#Master_title {width: 100%;} 
	#Master_title img {width: 100%;}


}

@media (min-width: 768px) and (max-width: 991px) {  
    
	#Master_title {width: 100%;} 
	#Master_title img {width: 100%;}
    .topgrade ul{margin:2% auto 1% 3%}
    .topgrade ul li{font-size:1.4rem}
    .topgrade_focus{font-size: 1.6rem;}
    .more_board>ul{margin:0 auto}
    .more_board>ul>li{font-size:1rem}

}

@media (max-width: 767px) {  
	#Master_title {width: 100%;} 
	#Master_title img {width: 100%;}
	/*三大錦囊妙計*/
    .handbook {width: calc(100%/1 - 1%);height: 90px;margin: 3% 2%;}
    .handbook img {left: 5%;top: -10%;width: 90px;}
	.handbook dt {font-size: 1.5rem;margin-left: 38%;margin-top: 3%;}
    .title {font-size: 1.7rem;text-align: center;}
	.teacher-item dt {font-size: 1.3rem;}
	.price-item h4 {font-size: 1.3rem;}
    .bar { width: 100%; height: auto; padding: 0; position: fixed; top: initial; bottom: 0; right: 0; left: 0; z-index: 5; background-color: rgba(255,255,255,.8); border-radius: 0; text-align: center; align-items: center; justify-content: space-around; }
    .bar2{justify-content: right;}
    .bar ul{width: 75%;}
    .bar img{display: none;}
    .topic_list ul li,.list_flex li,.list li{width: auto;text-align: left;font-size:1.125rem;line-height:30px;}
    .list_flex, .list{margin:0 4%;padding-left: 0rem;}
    .teacher-item,.price-item{width: calc(100%/1);margin: 0 13% 9px;}
    .price-item {margin: 0 3px 5px;}
	.price-item p {font-size: 1.3rem;}
    .feature{flex-wrap: wrap;}
    .feature .photo,.feature .txt{width: 100%;}
    .start-date div{font-size: 1.3rem;text-align: center;width: 100%;}
	.guide-btn a, .solve a,.start-date a {font-size: 1.3rem;margin: 0.5rem;}
	.billboard a {font-size: 1.2rem;display: flex;justify-content: center;}
	.billboard .grade {font-size: 1.4rem;}
    .topgrade{padding:4% 3%}
    .topgrade ul{margin:4% auto 0;padding:0 2%}
    .topgrade ul li{font-size:1rem;line-height:1.5em;margin:0 auto 2%}
    .topgrade ul li:before{font-size:1.5rem}
    .topgrade_focus{font-size: 1.2rem;width: 100%;}
    .more_board>ul{margin:0 auto}
    .more_board>ul>li{width:100%;font-size:.95rem}
    .more_board .board li{font-size: 1rem;}
    .topic_list li:first-of-type,.topic_list li:last-of-type{width: 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 {
}