@charset "utf-8";
/*@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@200&display=swap');*/
/* CSS Document */

html {overflow-y: auto; overflow-x:hidden !important;}

#bodywrap { background: #FFFFFF; }

.mini { position: fixed;display: none;width: 100%;height: 53px;background-color: #3366ff;z-index: 99999; }
.mini_lang { display: inline-block;height: 38px;width: 38px;margin: 6px 8% 0 0;font-family: "Microsoft JhengHei", "Yu Gothic", SimHei;font-size: 18px;font-weight: bold;text-align:center;line-height: 37px;line-height: 43px\9\0;
	color: #FFFFFF;background-color: #F00;border-radius: 100%; }
.mini_lang a { text-decoration: none;color: #FFFFFF;font-family: "Microsoft JhengHei", "Yu Gothic", SimHei;font-size: 18px; }
.mini_nav60 { position: relative;float: left;width: 70%;height: 53px;background-color: #3366ff; }
.mini_nav40 { position: relative;float: left;width: 30%;height: 53px;background-color: #050a90; } /* #050a90 */

#header { background-image: url("../images/hd-background.jpg");background-repeat: no-repeat;background-size: cover; } /* background-color: #f0f0f0; */
#hdImg { display: block;margin-left: auto;margin-right: auto;width: 100%;max-width: 1200px; }

.pagetitle { position: relative;float:left;width: 15%;margin: 20px 42.5% 50px 42.5%;padding: 15px 0px 10px 0px;font-size:38px;font-weight: bold;border-radius: 5px;color: #F89D0C;letter-spacing: 3px;text-align: center;background: linear-gradient(135deg, #608FEB, #60EBB0, #608FEB);text-shadow: 1px 1px 1px #D41808;-webkit-text-stroke-width: 0.2px;-webkit-text-stroke-color: #D41808; }
.pagetitle_en { color: #0820d5;letter-spacing: 1px;text-shadow: 1px 1px 1px #9dbae5;-webkit-text-stroke-width: 0.2px;-webkit-text-stroke-color: #9dbae5; }

#nav { width: 100%;height: 60px;background-color: #2565E6; }
#leftnav { position: relative;float: left;width: 68%;height: 48px;margin-left: 5%;font-family: "Microsoft JhengHei", "Yu Gothic", SimHei; }
#leftnav li { width: 15%;height:50px;min-width: 150px;margin: 3px 0 0 0px; }
#leftnav a {text-decoration: none;color: #FFFFFF; }
#leftnav a:hover {text-decoration: none;color: #FF9900;}

#rightnav {	position: relative;float: right;width: 20%; /*8.7006%;*/height: 60px;background: #173E8F;clip-path: polygon(0% 100%, 50px 0%, 100%  0%,100% 100%); }
#rightnav div { margin-right: 3%;text-align: right; }
#rightnav a { text-decoration: none;color: #FFFFFF;/*	background: #4874E6;*/ }
#rightnav a:hover {	text-decoration: none;color: #FF9900; }

.lang { display: inline-block;height: 48px;width: 48px;margin: 6px 5% 0 0;font-family: "Microsoft JhengHei", "Yu Gothic", SimHei;font-size: 20px;font-weight: 500;text-align:center;line-height: 46px;line-height: 52px\9\0;
	color: #FFFFFF;background-color: #F00;border-radius: 100%;}
#lang_change { background-color: #999999;border-radius: 100%; }

.menu_li { display: inline-block;height: 38px;text-align: center;line-height: 45px;line-height: 46px\9\0;color: #333;transform: skew(-40deg);background: #77aaff; /*4874E6*/ }
.menu_li div { transform: skew(40deg);font-size: 24px;font-weight: 500;color: #DF0000;text-shadow: 1px 1px #ebebeb; }
.menu_li a { font-size: 24px;font-weight: bold;color: #FFFFFF;text-shadow: 1px 1px #C40000; }
.menu_li a:hover { font-size: 24px;font-weight: bold;text-shadow: 1px 1px #FFFFFF; }

/*@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .menu_li { line-height: 44px;}#rightnav div { line-height: 41px;} } */

.linespace { position: relative;float:left;width: 100%;height: 50px; }
.plus { height: 150px; }
.bottomspace { margin-bottom: 35px; }

#content_wrap { position: relative;float:left;width:80%;height:auto;margin: 0 10% 0 10%;font-family: "Microsoft JhengHei", "Yu Gothic", SimHei; }
#content_wrap_en1 {	height: 1100px; }

.textbox { position: relative;float: left;width: 100%;height: auto; }
.textbox_50 { position: relative;float: left;width: 50%;height: auto;word-wrap: break-word; }
.textbox_60 { position: relative;float: left;width: 60%; }
.textbox_40 { position: relative;float: left;width: 40%; }
.textbox_8 { position: relative;float: left;width: 8%; }

.title_icon { position: relative;float: left;display: inline-block;vertical-align: top;width: 8%;min-width: 20px;max-width: 46px;height: 38px;margin: 0 2% 0 5%;padding: 0 5px;border-radius: 3px;background: linear-gradient(to left, #8e65ba, #4166c7);box-shadow: 0 1px 4px rgba(0,0,0,0.3);font-size: 2.25rem;}
.title_icon_s {	position: relative;float: left;display: inline-block;width: 12px;height: 32px;margin: 3px 1% 0 2.2%;padding: 0 5px;border-radius: 3px;background: linear-gradient(to left, #8e65ba, #4166c7);box-shadow: 0 1px 4px rgba(0,0,0,0.3); }
.title_space { position: relative;float: left;display: inline-block;vertical-align: top;width: 8%;min-width: 20px;max-width: 46px;height: 38px;margin: 0 2% 0 5%;padding: 0 5px;border-radius: 3px; }
.title_text { position: relative;float: left;width: 80%;display: inline-block;line-height: 38px;color: #005b96;font-size: 32px;font-weight: bold; }

.info_text { position: relative;float: left;width: 80%;color: #474747;font-size: 22px;font-weight: bold;line-height: 38px; } /* font-family: 'cwTeXYen', STXihei, "华文细黑", sans-serif !important; */

.container { margin: 0 auto;width: 80%;max-width: 600px; }
#slides { border: 0px solid #FFFFFF;margin-top: 20px; }
#slides img { border: 0px;border-radius:3%;object-fit: cover;max-width: 100%;max-height: 100%; }

#content_bottom { position: relative;float: left;display: inline-block;width: 100%;margin-top: 40px;margin-bottom: 40px; }
#content_bottom_en { position: relative;float: left;display: inline-block;width: 100%;margin-top: 40px;margin-bottom: 40px; }
.bottom_shift { width: 3%;margin: 0 6px 25px 2.2%; }

#info_text_en1 { position: relative;float: left;width: 100%;color: #000066;font-family: 'cwTeXYen', STXihei, "华文细黑", sans-serif !important;font-size: 16px;font-weight: bold;line-height: 20px;margin-left: 20px;margin-top: 5px; }

#info_table { position: relative;float: left;width: 60%;margin: 3% 20% 3% 20%; }
#info_table td { width: 50%;vertical-align: middle;font-size: 20px;font-family: 'cwTeXYen', 'Microsoft Yahei', 'Ariel', sans-serif;	 }

.info_table_td_title { width: 50%;height: 40px;border: 1px solid #1A53FF; /*#1A53FF #00CCFF */color: #FFFFFF;text-align: center;line-height: 40px;background: #3366ff; }
.info_table_td_odd { width: 50%;height: 40px;border: 1px solid #696969; /*#00CCFF */color: #474747;text-align: center;line-height: 40px;background: #FFFFFF; }
.info_table_td_even { width: 50%;height: 40px;border: 1px solid #696969; /*#00CCFF */color: #000000;text-align: center;line-height: 40px;background: #b2d8d8; }

#bottom_menu { position: relative;float: left;display: inline;width: 100%;height: auto;min-height:250px;font-family: "Microsoft JhengHei", "Yu Gothic", SimHei;color: #ffffff;background: linear-gradient(135deg, #2560B8, #608FEB); /*#2560B8*/ }
/* background-color: #2565E6;*/
.bottom_text { position: relative;float: left;display: inline-block;width: 100%;font-family: "Microsoft JhengHei", "Yu Gothic", SimHei;font-size: 26px;text-align: center;color: #ffffff; }
.bottom_textin_50 { position: relative;float: left;min-width:33.3%;font-size: 20px;vertical-align: middle;margin-top: 10px; }
.bottom_textin_100 { position: relative;float: left;min-width: 100%;font-size: 20px;vertical-align: middle;margin-top: 10px; }
.foot_img {	width:28px;min-width:28px;max-width:28px;min-width: 20px;margin-right: 20px;vertical-align: middle; /*margin-top: 10px;*/ }
.foot_contact { text-decoration: none;color: #FFFFFF; }
.copy_right { position: relative;float: left;display: inline;width: 100%;height:40px;font-size: 16px;text-align: center;margin: 80px 0 5px 0; }

.bottom_copy{ position: relative;top: 0px;font-family: 'Ariel', sans-serif;width: 100%;font-size: 14px; }

.rtnprogressbar { position: relative;font-size: 32px;text-align: center;width: 50%;margin: 0 25% 0 25%; }
.rtnprogress { position: relative;width: 100%!important;margin: 0 25% 0 25%;font-size: 32px;text-align: center; }

#back-to-top { position: fixed;bottom: 40px;right: 40px;z-index: 9999;width: 40px;height: 40px;cursor: pointer;border: 0;transition: opacity 0.2s ease-out;opacity: 0; }
#back-to-top:hover { opacity: 1; }
#back-to-top.show { opacity: 1; }

#navcontainer { position: relative;width: 100%;z-index: 1;min-width: 950px;margin-top: 1px; }
.navbar-fixed-top{ position: fixed;top: 0px;left: auto;z-index: 11; }

#menu { position: relative;float: left;border-radius: 8px;height: 56px;box-shadow: inset 0 1px 1px rgba(8, 24, 196, 1), inset 0 -1px 0 rgba(0,0,0,.15), 0 1px 3px rgba(0,0,0,.15);background: #77aaff; }
#menu, #menu ul { list-style: none; }
#menu > li { float: left;position: relative;border-right: 1px solid rgba(106, 180, 161,0.6);box-shadow: 2px 0 0 rgba(25, 43, 245, 0.6);perspective: 500px; }
#menu > li:last-child { border-right: 0px; box-shadow: 0;box-shadow: 0 0 0 0; }
#menu span, #menu a { display: block;position: relative;text-align: center;padding: 13px 10% 13px 10%;text-decoration: none;color: #FFFFFF;text-shadow: 1px 1px #C40000;line-height: 1;font-weight: 600;font-size: 24px;letter-spacing: -.05em;background: transparent;transition: all .25s ease-in-out;cursor: pointer; }
#menu > li:hover > span, #menu > li:hover > a { background: linear-gradient(135deg, #608FEB, #60EBB0, #608FEB);color: #F7A62D; /*rgba(0,223,252,1);*/text-shadow: 1px 1px #FF0000;margin-left: 2px; }
#menu li ul { position: absolute;left: 0;width: 130%;padding: 0;opacity: 0;visibility: hidden;border-bottom-left-radius: 14px;border-bottom-right-radius: 14px;background: transparent;overflow: hidden;transform-origin: 50% 0%; }
#menu li:hover ul { padding: 15px 0;background: #333;opacity: 1;visibility: visible;box-shadow: 1px 1px 7px rgba(0,0,0,.5);animation-name: swingdown;animation-duration: 1s;animation-timing-function: ease; }
#menu li li a { position: relative;float: left;width: 100%;padding-left: 20%;font-weight: 500;color: #ddd;text-shadow: none;text-align: left;border-top: dotted 1px transparent;border-bottom: dotted 1px transparent;transition: all .25s linear; }
#menu li li a:hover { color: rgba(0,223,252,1); /*rgba(0,223,252,1);*/border-top: dotted 1px #608FEB;border-bottom: dotted 1px #608FEB;background: rgba(159,159,159,0.7); /* rgba(0,223,252,.02); */ }
.menu_en li li a { font-size: 16px!important; }

@keyframes swingdown {
   0% { opacity: .99999;transform: rotateX(90deg); }
   30% { transform: rotateX(-20deg) rotateY(5deg);animation-timing-function: ease-in-out; }
   65% { transform: rotateX(20deg) rotateY(-3deg);animation-timing-function: ease-in-out; }
   100% { transform: rotateX(0);animation-timing-function: ease-in-out; }
}

.burger-wrapper { cursor: pointer; }
#burgernav { position: fixed;width: 100%;height: 100vh;top: 52px;left: 0;background: #608FEB;transform: translateX(-50rem);transition: 0.5s;z-index: 999;transition-timing-function: cubic-bezier(10,2,3,1); } /* transition-timing-function: cubic-bezier(10,2,3,1); */
#burgermenu { display: none; }
#burgermenu:checked ~ #burgernav { transform: translateX(0rem); }

#burger { position: absolute;cursor: pointer;width: 2rem;height: 2rem;left: 1rem;top: 0.7rem;display: flex;justify-content: space-between;flex-direction: column; }
#burger > div { height: 2px;background-color: #FFFFFF;transition: 0.5s;z-index: 999; }

#burgermenu:checked ~ #burger > div { background-color: #fff; }
#burgermenu:checked ~ #burger > div:nth-child(1) { transform: translateY(15px) rotate(45deg); }
#burgermenu:checked ~ #burger > div:nth-child(2) { opacity: 0; }
#burgermenu:checked ~ #burger > div:nth-child(3) { transform: translateY(-15px) rotate(-45deg); }

.burgerli { position: relative;float: left;width: 100%;margin-left: 5%; }
.burgerli li { font-size: 32px;font-weight: 800;color: #FFFFFF;text-shadow: 1px 1px #C40000;text-align: left;text-decoration: none;padding: 15px 0px 15px 3%; }
.burgerli li a { text-decoration: none;color: #FFFFFF;text-shadow: 1px 1px #C40000; }
.burgerli li li a { font-size: 26px;font-weight: 500;text-decoration: none;color: #FFFFFF;text-shadow: 1px 1px #C40000;padding: 15px 3% 15px 3%; }
.burgerli_en li { font-size: 28px; }
.burgerli_en li a { font-size: 28px; }
.burgerli_en li li a { font-size: 26px; }

@media screen and (max-width: 1200px) {
   #leftnav { margin-left: 0% }
   .pagetitle { width: 40%;margin: 0 30% 50px 30%; }
   .bottom_textin_50 { width: 100%; }
   .textbox_50 { width: 100%; }
   .textbox_60 { width: 100%; }
   .textbox_40 { width: 100%; }  
}

@media screen and (max-width: 992px) { /*991.98px*/
   .bottomspace { margin-bottom: 10px; }   
   .textbox_60 { position: relative;float: left;width: 100%;margin-right: 0%; }
   .textbox_40 { position: relative;float: left;width: 100%; }
   .container { margin-top: 70px;margin-bottom: 50px; }
   .title_space { width: 0%;min-width: 0px;max-width: 0px;height: 0px;margin: 0 0% 0 0%;padding: 0 0px; }
   .info_text { position: relative;float: left;width: 90%;margin: 20px 5% 0px 5%; }
   #info_table { position: relative;float: left;width: 70%;margin: 6% 15% 3% 15%; }
   #info_table td {width: 50%;height: 45px;font-size: 22px;font-family: 'cwTeXYen', 'Microsoft Yahei', 'Ariel', sans-serif;	 }
}

@media screen and (max-width: 768px) { /* 767.98px */
   #hdImg { margin-top: 55px;position: relative;float: left; }
   .mini { display: block;text-align: right; }
   #nav { display: none;width: 0%; }
}

@media screen and (max-width: 576px) { /* 575.98 */
   #leftnav li { min-width: 100px;width: 32.5%; }	
   .menu_li { transform: skew(0deg); }
   .menu_li div { transform: skew(0deg);font-size: 20px; }
   .menu_li a { font-size: 20px; }
   .menu_li a:hover { font-size: 20px; }

   .burgerli_en li { font-size: 22px; }
   .burgerli_en li a { font-size: 22px; }
   .burgerli_en li li a { font-size: 20px; }

   .pagetitle { width: 50%;margin: 0 25% 50px 25%;font-size:32px; }

   #info_table { position: relative;float: left;width: 90%;margin: 6% 5% 3% 5%; }
   #info_table td {width: 50%;height: 45px;font-size: 20px;font-family: 'cwTeXYen', 'Microsoft Yahei', 'Ariel', sans-serif;	 }
    
   .container { width: 80%; }
   .info_text { position: relative;float: left;width: 90%;color: #474747;font-size: 22px;font-weight: bold;line-height: 38px;margin: 20px 0 0px 5%; }
   .bottom_text { font-size: 1em; }
   .bottom_textin_50 { font-size: 1em; }
   .bottom_textin_100 { font-size: 0.8em; }
   .copy_right { font-size: 0.9em; }

   .rtnprogressbar { width: 80%;margin: 0 10% 0 10%; }
   .rtnprogress { font-size: 22px; }
}

@media screen and (max-width: 360px) {
   .mini_nav60 { width: 65%; }
   .mini_nav40 { width: 35%;overflow: scroll; }
   #leftnav { overflow: scroll; }
   #leftnav li { min-width: 80px;width: 32%; }
   .menu_li { transform: skew(0deg);overflow: hidden; }
   .menu_li div { transform: skew(0deg);font-size: 16px; }
   .menu_li a { font-size: 16px; }
   .menu_li a:hover { font-size: 16px; }

   .burgerli_en li { font-size: 18px; }
   .burgerli_en li a { font-size: 18px; }
   .burgerli_en li li a { font-size: 16px; }

   .title_icon_s { height: 26px; }
   .info_text { font-size: 22px;line-height: 30px; }
   #info_table td { font-size: 16px;line-height: 26px; }
}

@media screen and (max-width: 320px) {
   .mini_nav60 { width: 55%; }
   .mini_nav40 { width: 45%; }
   #leftnav li { min-width: 80px;width: 20%; }
   .pagetitle { width: 60%;margin: 0 20% 50px 20%;font-size:30px; }   
   .title_icon { width: 6%;min-width: 10px;height: 28px; }
   .title_icon_s { height: 20px; }
   .title_text { width: 70%;font-size: 22px;line-height: 24px; } 
   .info_text { font-size: 18px;line-height: 26px; }
   .plus { height: 100px; }
   .bottom_text { font-size: 0.8em; }   
   .foot_img { width:20px;min-width:20px;max-width:20px;min-width: 20px; }
}