@import url('/css/fontawesome-all.css');
@import url('/css/font-awesome.min.css');
@import url('/css/fontawesome.min.css');
@import url('/css/SeoJump.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@100;300;400;500;700;900&family=Noto+Sans+TC:wght@100;300;400;500;700;900&family=Noto+Sans:wght@400;700&family=Noto+Serif+SC:wght@200;300;400;500;600&family=Noto+Serif+TC:wght@200;300;400;500;600&family=Noto+Serif:wght@400;700&family=Frank+Ruhl+Libre:wght@300;400;500;700;900&family=Quicksand:wght@300;400;500;600;700&display=swap');

* { margin: 0; padding: 0; }
*:focus { outline: none; }

body { margin: 0; }
body ::selection { background: var(--primary); text-shadow: none; color: var(--white); }
body::-webkit-scrollbar { width: 5px; }
body::-webkit-scrollbar-track { background: rgba(var(--gray-rgb), .4); }
body::-webkit-scrollbar-thumb { background: var(--primary); }

header, footer, div, nav, article, h2, h3, h4, h5, h6, hr, p, form, label, input, textarea, ul, li, img, svg, span, font, strong, b, a, i { text-align: left; vertical-align: middle; word-wrap: break-word; word-break: break-word; line-height: 170%; border-width: 0; font-family: var(--font-family), sans-serif; font-size: 16px; color:  var(--info); }

ul , ol { list-style: none; }

fieldset { border: 0; }

input , button , select , textarea { padding: 5px 15px; width: calc(100% - 32px); border: 0; border-radius: 0; background: rgba(var(--gray-rgb), .2); box-shadow: none; outline: none; font-size: 16px; color: var(--black); -webkit-appearance: none; -moz-appearance: none; appearance: none; }
select { padding: 10px 15px; width: 100%; }
input#Checknum { margin-right: 15px; width: 70px; max-width: calc(100% - 97px); }

/* img */
img { max-width: 100%; }
.img_cover { object-fit: cover; }
.img_contain { object-fit: contain; }

a , a:link , a:visited , a:hover { text-decoration: none; white-space: pre-wrap; }

/* general class set */
.txt_clamp{overflow:hidden;height:27px;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}
.d_inblock.txt_clamp{display:-webkit-inline-box}
.atag_item{width:100%;height:100%;top:0;left:0}
.bg_box:before{content:"";position:absolute;width:100%;height:100%;background:#ffffff;background:linear-gradient(to bottom,#ffffff,#ffffff00,#ffffff);background:linear-gradient(to bottom,#ffffff,#ffffff00,#ffffff)}
.nowrap_box{font-size:0}
.txt_num{font-family:'Quicksand',sans-serif}
.svg_clip{width:0;height:0}

/* btn */
.btn , .btn_outline { padding: 2px 10px; }
.more_btn {padding: 10px 55px 10px 10px;border-radius: 40px;background: none;border: 1px solid #d8d8d8;color: var(--black);}
.more_btn b{background: var(--primary);width: 45px;height: 45px;display: inline-flex;justify-content: center;align-items: center;border-radius: 50px;margin-right: 35px;}
.more_btn b svg{width: 15px;height: 15px;fill: var(--white);}
.more_btn:hover{background: var(--primary);color: var(--white);border: 1px solid var(--primary);}
.more_btn:hover b{margin-right: 20px;margin-left: 15px;}


/* badge  */
.badge { padding: 2px 10px; box-shadow: none; }
.badge_lighten { padding: 0 4px; min-width: 22px; border-radius: 3px; font-weight: 400; text-align: center; font-size: 12px; vertical-align: text-bottom; }

/* photo,bgBox */
a.photo , .bgBox { overflow: hidden; background: no-repeat 50% / cover; display: block; }

/* fancybox */
[class^="fancybox-"] , [class^="fancybox-"] * , .slick-track , .fa , .fas , .fa:before , .fas:before , .fa:after , .fas:after , .trans_none_box { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; }
.fancybox-infobar__body span { font-size: inherit; color: currentcolor; vertical-align: initial; }

/* webBox */
.webBox { overflow: hidden; position: relative; width: 100%; }
.webBox .pageh1 { position: absolute; top: 0; z-index: 1; }
.webBox .wrapper { position: relative; background: #fff; z-index: 2; }
.webBox .slick-slider { margin-bottom: 0; }

/* workframe */
.workframe { margin: 0 auto; width: 90%; }

/* header */
header{padding:0 2.5%;width:95%;z-index:1000;top:0;display:flex;justify-content:space-between;align-items:center}
header #menubtn{width:30px;z-index:1000}
header #menubtn a{margin:auto 0 auto auto;width:25px;height:20px}
header #menubtn a span{position:absolute;width:100%;height:2px;display:block;top:0;right:0;background:var(--white)}
header #menubtn[data-type="1"] a span{transition:transform .4s cubic-bezier(.215,.61,.355,1),opacity .4s cubic-bezier(.215,.61,.355,1),-webkit-transform .4s cubic-bezier(.215,.61,.355,1)}
header #menubtn[data-type="1"] a span:nth-child(2){top:calc(50% - .5px)}
header #menubtn[data-type="1"] a span:nth-child(3){top:calc(100% - 1px)}
header #menubtn[data-type="2"] a span{transition:.4s cubic-bezier(.645,.045,.355,1)}
header #menubtn[data-type="2"] a span:nth-child(1),header #menubtn[data-type="2"] a span:nth-child(3){top:50%}
header #menubtn[data-type="2"] a span:nth-child(2){opacity:0}
header #webmenu nav >ul >li >p a{padding:10px 15px;font-size:18px;color:var(--white);font-weight:300;letter-spacing:2px}
header #webmenu nav ul li b{position:absolute;padding:0 5px 0 15px;width:23px;height:41px;display:inline-block;text-align:center;line-height:41px;top:calc((100% - 41px) / 2);right:0}
header #webmenu nav >ul >li .subOption li >div a{padding:7px 10px;display:block}
header #header_bar >a{padding:0 5px;line-height:100%}
header #header_bar svg{width:25px;height:25px}
header.scroll{background:#1c2b74}

/* hSearch */
#hSearch { width: 100%; height: 0; top: 64px; z-index: 998; }
#hSearch[data-type="2"] { height: 142px; }
#hSearch >div { margin: 50px auto; width: 700px; }
#hSearch >div input { margin-right: 15px; width: calc(100% - 89px); background: none; border-bottom: 1px rgba(var(--black-rgb), .3) solid; }
#hSearch >div a { border-radius: 50%; }
#hSearch >div a svg { margin: 10px; width: 22px; height: 22px; }

/* menubg */
#menubg { width: 100vw; height: 100vh; top: 0; left: 0; }
#menubg[data-type="1"] { background: rgba(var(--black-rgb), 0); z-index: -998; }
#menubg[data-type="2"] { background: rgba(var(--black-rgb), .5); z-index: 998; }

/* footer */
footer{background-color:#1c2b74;padding:40px 0}
footer *{font-weight:500;font-size:13px;font-family:'Poppins',sans-serif;color:#c3ecff}
.footerInfoBox{margin-right:100px}
footer #f_left{display:flex;padding:20px 10px;border-bottom:1px solid rgb(255 255 255 / 15%);justify-content:space-between;align-items:center}
footer #f_left .tit{padding-bottom:0px;margin-bottom:20px;width:100%}
footer #f_left .tit b{position:relative;margin-right:10px;display:inline-block;color:#fff;font-family:'Poppins',sans-serif;text-transform:uppercase;font-size:16px;font-weight:600}
footer #f_left .tit font{font-size:15px;color:#d4d4d4}
footer #f_right .tit{text-align:end;padding-bottom:10px;margin-bottom:20px}
footer #f_right .tit b{font-weight:400;color:#fff;font-family:'Poppins',sans-serif;text-transform:uppercase}
footer #f_right ul li{position:relative}
footer #f_right ul li:after{margin:0px 10px;display:inline-block;font-weight:100;background-color:#c8c8c870;width:1px;height:12px;content:""}
footer #f_right ul li:last-child:after{display:none}
footer #f_nav a{margin:5px 10px}
footer #f_contact{display:flex;align-items:flex-start;flex-wrap:wrap;flex-direction:column;margin-right:40px}
footer #f_contact p{margin:0;display:flex;padding:15px 0;flex-direction:column;width:100%}
footer #f_contact p font{line-height:140%;font-weight:500;font-size:14px}
footer #f_contact p font.txt_primary_5{margin-right:10px;color:var(--white)}
footer #f_contact p font.txt_primary_5 svg{width:15px;height:15px;fill:#fff}
footer #f_other{padding:0 0 30px 0;border-width:1px 0}
footer #f_nav{padding:30px 0;border-bottom:1px solid rgb(255 255 255 / 15%);display:flex;align-items:center;justify-content:space-between}
footer #f_nav a{font-weight:600;font-size:15px;color:#ffffff}
footer #f_nav span{width:1px;height:15px;background:rgb(255 255 255 / 60%);display:block}
footer #copyright p,footer #copyright p a{color:rgb(255 255 255 / 40%)}
footer #copyright p a{margin-left:10px}
footer #copyright{display:flex;justify-content:flex-start}
footer .workframe{width:70%;display:flex;justify-content:space-between;align-items:center}
footer #f_community a{background:#081559;display:flex;align-items:center;justify-content:center;color:var(--white);font-size:15px;font-weight:400;height:90px;width:90px;flex-direction:column}
footer #f_community svg{fill:var(--white);width:26px;height:26px;aspect-ratio:1/1;object-fit:contain;margin-bottom:5px}

/* webSeo */
#webSeo {padding: 5px 0;white-space: nowrap;box-sizing: border-box;}
#webSeo .seo { padding-left: 100%; font-weight: 100; font-size: 13px; opacity: .3; }

/* footer_btn */
#footer_btn { right: 15px; bottom: 15px; z-index: 2000; }
#footer_btn a { margin-top: 10px; line-height: 40px; }
#footer_btn a svg { margin: auto; width: 60%; height: 60%; }
#footer_btn a.line { background: #12b508; }
#footer_btn a.gotop { background: var(--primary); border: 1px rgba(var(--white-rgb), .2) solid; }
#footer_btn a.gotop:before { margin: 18px auto 0; width: 30%; height: 30%; border: var(--white) solid; border-width: 3px 0 0 3px; display: block; content: ""; }

@media screen and (min-width:1441px){
	.workframe{width:var(--width-xxl)}
header #cis{width:14%}
}
@media screen and (max-width:1460px){
	header #cis{width:16.66666667%}
.parallax_bg{min-height:480px}
}
@media screen and (min-width:1281px){
	header #webmenu nav ul li b{display:none}
header #webmenu nav ul li{position:relative;margin-left:50px;margin-bottom:20px}
header #webmenu nav ul li .bo{position:relative;background:var(--white);z-index:1}
header #webmenu nav >ul >li >p a{padding:30px 0 10px}
header #webmenu nav >ul >li >p a:after{content:'';position:absolute;bottom:0;left:0;width:0;height:1.5px;background:#55aff7}
header #webmenu nav >ul >li:hover >p a:after{width:50%}
header #webmenu nav >ul >li >p a:before{content:'';position:absolute;bottom:0;right:0;width:0;height:1.5px;background:var(--white)}
header #webmenu nav >ul >li:hover >p a:before{width:50%}
header #webmenu li .menu_body,header #webmenu li .subOption ul{position:absolute;width:170px;right:calc(50% - 85px);z-index:-1;opacity:0}
header #webmenu li .menu_body ul{background:var(--white);box-shadow:0 0 10px rgba(var(--black-rgb),.3)}
header #webmenu li .subOption li{overflow:hidden}
header #webmenu li .subOption li >div a{padding:6px 15px;border-bottom:1px rgba(var(--black-rgb),.1) solid;line-height:150%;font-weight:300}
header #webmenu li .subOption li:last-child >div a{border-color:none}
header #webmenu li .subOption li >div a:hover{color:var(--primary)}
header #webmenu li .subOption .sub2Option,header #webmenu li .subOption .sub3Option{top:0;right:-170px}
header #webmenu nav >ul >li:hover,header #webmenu li .subOption li:hover{overflow:visible}
header #webmenu nav >ul >li:hover .menu_body,header #webmenu li .subOption li:hover >ul{z-index:2;opacity:1}
header #webmenu li:last-child .subOption .sub2Option,header #webmenu li:last-child .subOption .sub3Option{right:auto;left:-170px}
header #header_bar{display:none}
#hSearch{top:90px}
footer #extra ul li:hover img{display:block}
}
@media screen and (max-width:1280px){
	header{padding-top:10px;padding-bottom:10px}
header #cis{width:35%}
header #webmenu{padding:15px 0;width:350px;height:100vh;background:#071557;box-shadow:0 10px 10px rgba(var(--black-rgb),.5);top:0;right:calc(-1 * var(--width-xs));z-index:999}
header #webmenu nav{overflow-y:scroll;margin-top:45px;height:calc(100% - 65px)}
header #webmenu nav::-webkit-scrollbar{width:0}
header #webmenu nav >ul{padding-bottom:10vh}
header #webmenu nav >ul >li >p a{border-bottom:1px rgb(255 255 255 / 25%) solid}
header #webmenu li .menu_body,header #webmenu li .menu_body .subOption li ul{position:relative;display:none;-webkit-transition:none;-moz-transition:none;-ms-transition:none;-o-transition:none;transition:none}
header #webmenu li .menu_body ul{margin-bottom:10px;margin-left:1.3em}
header #webmenu li .menu_body .subOption .bo{position:relative}
header #webmenu li .menu_body .subOption a{padding:5px 45px 5px 0;color:var(--primary)}
header #webmenu li .menu_body .sub2Option a{padding:0 45px 0 0;font-weight:300;color:var(--triadic1)}
header #webmenu li .menu_body .sub3Option a{padding-right:5px;color:var(--triadic2)}
footer #flogo{width:100%;display:flex;justify-content:center;margin-bottom:30px}

@media screen and (max-width:1140px){
	footer .workframe{display:flex;flex-direction:column;align-items:center;width:90%;align-content:space-between}
	.footerInfoBox{margin:0}
}
@media screen and (min-width:1025px){
	footer *{vertical-align:top}
}
@media screen and (min-width:641px){
	.webBox #footer_btn a span{display:none}
}
@media screen and (max-width:1024px){
	footer #f_other{margin-top:10px}
}
@media screen and (max-width:980px){
	.parallax_bg{min-height:400px}
	footer #f_info{width:100%}
	footer #f_other{width:100%;margin-top:24px}
	footer #f_other #footermeu a{width:33.3%}
}
@media screen and (max-width:768px){
	footer #extra,footer #f_info{margin-top:10px}
	#hSearch >div{width:90%}
	footer #f_info p{width:100%}
}
@media screen and (max-width:640px){
	.parallax_bg{min-height:80vw;background-attachment:initial}
	#webSeo{margin-top:30px}
	#footer_btn{width:calc(100% - 0px);bottom:0;right:0;display:flex}
	#footer_btn a svg{width:30px;padding:0}
	#footer_btn a span{width:60%;display:flex;align-items:center;color:white}
	footer #f_nav{display:flex;flex-wrap:wrap;justify-content:flex-start;border-bottom:0px solid rgb(255 255 255 / 15%);padding-bottom:0}
	footer #f_nav a{width:calc((100% / 2) - 20px);border-bottom:1px solid rgb(255 255 255 / 15%);margin:0;padding:10px}
	footer #f_nav span{display:none}
	footer #f_left{display:flex;flex-direction:column;align-items:flex-start}
	footer #f_community a{display:none}
	footer #f_contact{margin:0}
}
@media screen and (max-width:550px){
	header #webmenu{width:100%}
	footer #copyright p,#copyright p a{font-size:12px}
}
@media screen and (max-width:350px){
	header #header_bar svg{width:20px;height:20px}
	header #menubtn{width:25px}
	header #menubtn a{width:20px;height:15px}
}