﻿@import url("./icon/css/all.min.css?03");
/* ----------首頁---------- */
:root {
	--black:#000;   
	--night_black:#353b48;   
	--gold:#e1b12c;
	--yellow:#fbc531;	
	--gray:#d7dcd7;	
	--blueberry:#7f8fa6;
	--hint_gray:#dcdde1;	
	--lynx_white:#f5f6fa;
	--white:#FFFFFF;
	--peach: #f05f5f;
	--red:#c40109;
	--flower_red:#e84118;	
	--purple:#8c7ae6;
	--winkle_purple:#9c88ff;
	--indigo:#004161;
	--tiffany:#71c5b5;
	--grass:#ebf6f2;
	--mazarine_blue:#273c75;	
	--naval_blue:#40739e;	
	--sea_blue:#487eb0;
	--pylon_blue:#0097e6;
	--blue:#00a8ff;
}
.bgcolor0 {background-image: url(../Image/1012008_3.jpg),linear-gradient(rgb(71 195 191), rgb(154 205 195));background-repeat: no-repeat;background-position: center;}
.bgcolor1 {background: var(--white);}
.bgcolor2 {background: var(--lynx_white);}
.bgcolor3 {background: var(--tiffany);}
.bgcolor4 {background: var(--peach);}
.bgcolor5 {background: #fdf9ed;/*height: 175px*/} /*#f5f7e8*/
.bgcolor6 {background: var(--lynx_white);}
.bgcolor7 {background: #ffdd61;}
.bgcolor8 {background: #ebeeff;}
.bgcolor9 {background: #ffd3d2;}/*#68cad5  #f5f6fa*/
.bgcolor10 {background: #d9b95c;border-top: 10px #ffedb9 solid;border-bottom: 10px #ffedb9 solid;}
.bgcolor11 {background: #f8f9f3;}
.bgcolor12 {background: #00afc2}
.bgcolor13 {background: #fdf1f3;}
.bgcolor14 {background: #edf7f6;}

h1 {font-size: 2.5rem;color:#37567c;font-family: "Microsoft YaHei","Microsoft Yi Baiti","Arial Unicode MS";letter-spacing: 2px;}
h2 {font-size: 2rem;}
#Master_title, #channel_master, #channel_sec, #channel_third, #channel_fourth, #channel_fifth, #channel_sixth, #channel_seventh, #channel_eighth, #Ask{padding: 1rem;}
button.flash:hover {animation: push 0.5s linear;}
p {line-height: 1.8rem;}
.target-fix {position: relative;top: -10rem;display: block;visibility: hidden;}
.disc-type li {list-style-type: disc;margin-left: 2rem;}
.drop-down-menu {width: 100%;}
.nav-toggle:before {font-weight: bold;}

/* Header */
#Header {position: fixed;top: 0;left: 0;width: 100%;z-index: 9;background: #ffdc5cf5;box-shadow: 0px -14px 16px 8px #000000}
#Header nav {width: 55%;margin: auto;}
.brand {font-size: 2rem;width: 40%;}
.brand a {color:#1d6386;text-decoration: none;}
.brand img {object-fit: contain;}
.menu-mobile {display: none;margin: 1rem 1rem auto auto;text-align: right;color: #111;text-decoration: none;font-size: 0.875rem;}
.menu-dropdown-icon::before {content: "\f067";font-family: "Font Awesome 5 Free";font-weight: bold;display: none;cursor: pointer;float: right;padding: 0.5rem 2rem;background: #fff;color: #333;}
.menu-container{}
.menu {}
.menu > ul {margin: auto;width: 100%;list-style: none;position: relative;}
.menu > ul::before, .menu > ul::after {content: '';}
.menu > ul > li {text-align: center;margin: auto;}
.menu > ul > li > a {text-decoration: none;padding: 0.5rem 0;display: block;font-size: 1.25rem;color: #111}
.menu > ul li > ul {display: none;width: 100%;background: #ededed/*#fffef3*/;/* padding: 20px 10px 20px 10px; */position: absolute;z-index: 9;left: 0;margin-left: 1%;border-top: 6px #3c95be solid;}
.menu > ul li > ul::before, .menu > ul li > ul::after {content: '';display: table;}
.menu > ul li > ul::after {clear: both;}
.menu > ul li > ul > li a {text-align: left;display: block;border-bottom: 1px #ffc107 solid;text-decoration: none;padding: 2px;}
.menu > ul li > ul.normal-sub {width: 300px;left: auto;padding:10px 10px 15px 20px;margin: auto;}
.menu > ul li:nth-of-type(2) > ul.normal-sub, .menu > ul li:nth-of-type(3) > ul.normal-sub, .menu > ul li:nth-of-type(5) > ul.normal-sub {overflow-y: scroll;max-height: 500px;}
.menu > ul li:last-of-type > ul.normal-sub {right: 0;}
.normal-sub li {width: 100%;}	
.menu-sort {color: #3c95be;text-align: left;font-weight: bold;}
#BodyContentMainNavigator {width: 1200px;margin: auto;padding-top: 8.4rem;}

/*buttonlink*/
.option a {text-align: center;display: inline-block;margin: 1rem auto;padding: 10px 1.8% 10px 2%;text-decoration: blink;border: solid 4px #f1ebdd;transition: all 0.2s linear;font-weight: bold;
border-radius: 3em;font-size: 1.5em;}
.option a:hover {border: solid 4px #f5f5f5;color: #fff;background-color: #00BCD4;opacity: initial;}

/* 我想問 */
#Home #channel_fourth {padding: 1rem 3%;margin: 0 auto;}
#Home #channel_fourth h1 {font-size: 2.3rem;margin: 1.3% 0 0.7%;}
#formlist .chosen, #formlist .information {width:calc(100%/2 - 2rem);}
#formlist li{ line-height:1.9rem}
.ask-title {font-size: 1.5rem;line-height: 3rem;}
.chosen-list {margin: 1rem auto;}
.chosen-list p {color: #fa7600;font-weight: bold;}
#blog .chosen-list p {color: #fa7600;font-weight: bold;font-size: 1.4rem;line-height: 0rem;margin-top: 6%;}
.information li {margin: 0.125rem auto;}
#formlist input, #formlist select {padding: 0.25rem 0.5rem;margin: 0.25rem;font-size: 1.05rem;border-radius: 4px;border: 1px #ccc solid}
#formlist .input_bg {width: 100px;height: 36px; background-color: #2c99ce;color: #fff;float: right;border: none}
#formlist .reset_bg {width: 100px;height: 36px;background-color: #a8a8a8;color: #fff;float: right;border: none}

/* 單元文章 */
#Master_title h1 {font-size: 3rem;line-height: 3.8rem;text-shadow: 0 0 10px #fdf9ed, 0 0 10px #fdf9ed, 0 0 10px #fdf9ed, 0 0 10px #fdf9ed, 0 0 10px #fdf9ed;letter-spacing: 6px;padding: 4.5rem 5rem 6.5rem;}
#blog p, #blog ol, #blog dl, #blog table {margin: 1rem auto;line-height: 2rem; font-size: 1.2em;}
#blog ol li {list-style-type: decimal;margin-left: 1rem;}
#blog p a{ /*color:#5f3ab7;*/color:#ef3f3f; text-decoration:underline;}
#blog h2 {margin: auto;font-size: 1.8em;text-align: center;min-height: initial;}
#blog h3 {margin: 0 auto; font-size: 1.5em;}
#blog #Master_title {background-position: right;background-repeat: no-repeat;background-size: auto 285px;z-index: 2;width: 100%;height: 235px;}
.highlight {background-color: #f3dd16;}
.required-system {font-size: 1.5rem;display: block;text-align: center}
.required-subject {margin: 0.25rem auto 2rem;}
.required-subject dl {width: calc(100%/2 - 1rem);background: #fbfaf3;border-radius: 1rem;margin: 0 0.5rem 0.5rem 0;padding: 2% 1.5%;border: 1px #7f8cde dotted;/* border-bottom: 1px #000 dotted; */}
.required-subject dt {font-size: 1.25rem;font-weight: bold;text-align: center;}
.required-subject dd {padding: 0.5rem 1rem;line-height: 1.8rem;}
.paragraph-title {font-size: 1.5rem;font-weight: bold;margin-top: 1rem;margin-bottom: 0.4rem;display: block;}
.blog-pic-man {display: inline-block;margin-right: 1rem;width: 100px;height: 100px;overflow: hidden;border-radius: 50px;/*border: 1px solid #bbc0df;*/}
.blog-pic-man img {width: 100%;object-fit: cover;transform: scale(1.05);}
.blog-table {width: 100%;}
.blog-table th, .blog-table td {border-collapse: collapse;padding: 0.5rem;}
.blog-table td {border: 1px solid var(--hint_gray);}
.blog-table th {background: var(--hint_gray);border: 1px solid var(--white);}
.paragraph-pic img {width: 100%;height: auto;}
.blog-table ul li {list-style-type: disc;margin-left: 2rem;}
.sort-title {display: inline-block;font-weight: bold;border-left: 28px #00bcd4 solid;line-height: 1.8rem; padding-left: 10px;margin-top: 4%;}
.extend-item dt {background: #00bcd4;color: var(--white);display: inline-block;padding: 0.1% 0.7%;}
.extend-item dd::before {position: relative;content: '\f14a';margin-right: 0.5rem;font-family: "Font Awesome 5 Free";font-weight: bold;color: #00bcd4;font-size: 1.6rem;padding: 0.2rem 0 0 0;vertical-align: middle;}
.embed-container {position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; }
.embed-container iframe, .embed-container object, .embed-container embed{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.read-more {color: #f44336;padding: 0px 10px;background-color: #ffeff1;border-radius: 50px;border: 1px #3a4581 solid;text-decoration: none;font-size: 0.9rem;line-height: 1.5rem;transition: all 0.3s linear;display: inline-block;}
a.read-more {color: #f44336 !important}
a.read-more:hover{/**transform: scale(1.1);*/animation: push 0.5s linear;}
.guide-btn {margin: 2rem auto auto;text-align: center;}
.guide-btn a {display: inline-block;padding: 0.25rem 1rem 0;color: var(--white);font-weight: bold;text-decoration: none;font-size: 1.6rem;line-height: 2.4rem;border-radius: 7px;}
.guide-btn a:hover{animation: push 0.5s linear;}
.next {position: fixed;width: 100%;background-color: #ffdc5c;bottom: 0;left: 0;}
#blog .next dl {width: 1200px;margin: auto;padding: 0.5rem 0;margin: auto;display: flex;flex-wrap: wrap;justify-content: center;}
#blog .next dt {color: #929292;margin-right: 0.5rem;}
#blog .next dd a {font-weight: bold;color: #3c95be;}

@media screen and (min-width: 1201px) {	
	/* 首頁 */
	#Header header {padding: 1rem 0;}
	#Header header, #Master_title, #channel_master, #channel_sec, #channel_third, #channel_fourth, #channel_fifth, #channel_sixth, #channel_seventh, #channel_eighth, #Ask{width: 1200px;margin: auto;}
	#channel_master, #channel_third, #channel_fourth, #channel_fifth, #channel_sixth, #channel_seventh, #channel_eighth, #Ask {padding: 3rem 5rem 2rem;}
	#channel_sec{padding: 1.6rem 5rem 2rem;}
	#Header h1{margin-bottom: 0;}
	.menu > ul > li > a::after {content: '\f0dd';font-family: "Font Awesome 5 Free";font-weight: bold;margin-left: 0.25rem;bottom: 3px;position: relative;}
	#Home #Master_title {position: relative;}
	.top_note {padding: 94px 0 0 140px;position: absolute;width: 371px;height: 337px;top: -0.2rem;left: -11rem;text-align: center;}
	/* 單元文章 */
	.video-wrap {width: 50%;margin: 1rem auto 1rem 0;}
}

@media screen and (max-width: 1200px) {
	.container, .banner, .banner section, #BodyContentMain {max-width: initial;}	
	#Header nav, .knowledge-item, .menu > ul li > ul.normal-sub, .irt-pic, #blog .next dl {width: 100%;}
	.brand {width: 45%;padding: 0 1rem;z-index: 9;margin: 0.5rem;}
	.brand img {height: 55px;}
	#Header {height: 6rem;}
	#Header nav {background: none;top: 6rem;}
	.menu-scroll {position: fixed;overflow-y: scroll;height: 100%;padding-bottom: 5rem;}
	#Home {padding-top: 4rem;}
	.menu-mobile, .menu .show-on-mobile, .menu-dropdown-icon::before  {display: block;}
	.menu > ul {display: none;}
	.menu > ul > li {width: 100%;float: none;display: block;background: #fefefe;}
	.menu > ul > li > ul {position: relative;}
	.menu > ul > li > a {color: #000;}	
	.menu > ul > li > a {display: block;border-bottom: 1px #ffc107 solid;text-decoration: none;padding: 8px 2px 2px;text-align: center;}	
	.menu-dropdown-icon::before {background: #fefefe;color: #333;}	
	.ability li {width:calc(100%/5 - 0.25rem);margin: 2rem auto;display: flex;justify-content: center;}
	.ability li span {padding: 0.5rem 0;width: 100px;}
	.course a {font-size: 1.5rem;padding: 1rem;}
	.table-wrap {overflow-x: scroll;}
	.blog-table {width: 100%;}
	.float-text {right: 0;top: auto;bottom: 0;width: 100%;display: flex;flex-wrap: wrap;border-radius: 16px 16px 0 0;justify-content: center;padding: 0.25rem 0 0;}
	.float-text a {margin: auto 0.5rem;text-decoration: underline;border-bottom: none;}
	.bulletin {bottom: 15%;top: auto;}
	#Home #Master_title {background: #dee2f700 url(../Image/1012008_3.jpg) no-repeat center;}
	#Home #Master_title h1 {text-align: right;display: block;position: inherit;left: inherit;font-family: "Microsoft YaHei","Microsoft Yi Baiti","Arial Unicode MS";padding-right: 0;}
	.match-pic img, .match-pic-r img {width: 200px;height: 200px;}	
}

@media screen and (min-width:992px) and (max-width:1199px) {
	#Master_title .sm\:block {display: inline-block;}
	#Home #Master_title h1 {padding-right: inherit;}
}

@media screen and (min-width:768px) and (max-width:991px) {
	.course {height: 150px;}
	#Master_title .sm\:block {display: inline-block;}
}

@media screen and (max-width: 767px) and (orientation: portrait) {	
	h1 {font-size: 2rem;}
	#Header {height: 4rem;}
	#Header nav {top: 4rem;}
	.brand {width: 70%;z-index: 9;margin: 0.25rem 0.5rem;}   
	.bgcolor0 {background-image: none;background-repeat: no-repeat;background-position: center;background: linear-gradient(rgb(71 195 191), rgb(154 205 195));}
	#Home #Master_title {background: rgb(225 231 219) url(../Image/1012008_3_mb.jpg) no-repeat;background-size: 100%;}
	#Home #Master_title { padding: 1px 0rem 0.9rem; margin-top: 0 !important;}
	.ability {margin: 11rem auto 0;}
	#Master_title h1 {padding: 1rem;}
	#Home #channel_master h1 {font-size: 1.8rem;margin-top: 6%;}
	.top_note {text-align: center;margin-top: 0.7rem;}
	.topic-title {font-size: 1.2rem;}
	.topic label {font-size: 1rem;padding: 0.3rem;}
	.topic li {width: 100%;}
	#Home #Master_title h1 {font-size: 2.5em;line-height: 3.7rem;}		
	/* 我想問 */
	.ask-wrap{width: 100%;}
	#Home #channel_fourth h1 {text-align: center;font-size: 1.7rem;margin: 1.3% 0 0.7% 6%;}
	.ask-title {font-size: 1.1rem;line-height: 1.5rem;padding: 1rem 0 0;display: block;}
	#formlist .chosen, .course {width: 100%;}
	#formlist .information {width: calc(100%/1 - 2rem);}
	#blog .next dl {padding: 0.25rem 0;}
	/* 小廣告 btn */
	.bulletin i {margin: -15px -3px 0 0;}
}
/* 相容檢視 */
@media screen and (-webkit-min-device-pixel-ratio:0) { /*Webkit*/
    #noie {display: none;}
}
@-moz-document url-prefix(){/*Firefox*/
    #noie {display: none;}
}
@media \0screen\,screen\9 {/*IE 6 7 8*/    
    .browser {text-align: center;background: red;font-weight: bold;color: white;}
    .browser a {color: white;display: block;}
}
@media screen\0 {/*IE 8 9 10 11*/    
    .browser {text-align: center;background-color: rgba(0,0,0,.9);font-weight: bold;position: fixed;top:0;left: 0;width: 100%;height: 100%;z-index: 8;}
    .renew {background-color: #f6f6f6;display: inline-block;top: 45%;position: relative;border-radius: 5px;overflow: hidden;}
    .renew span {padding: 1rem;display: block;}
    .browser a {color: #039be6;display: block;border-top: 1px solid #989898;padding: 1rem;background-color: #EDEDED;}
}
@media print {
}