﻿@charset "utf-8";
/*2022switer CSS Document */
* { margin:0; padding:0;}

@media only screen and (max-width: 992px) { 	
/*@media only screen and (max-width: 959px) { */	
.mobile{display:block;}
.desktop{display:none;}	
	
}
/*@media (min-width: 960px) {*/
@media (min-width: 993px) {
.mobile{display:none;}
.desktop{display:block;}
}



/*#nav_container{width:1200px;height:100% !important;margin:0 auto;padding:0 !important;}*/

#nav_container{width:100%;background:rgba(0,255,0,0); display:flex;flex-wrap: wrap;justify-content: flex-start;align-content: space-between;align-items: stretch;height: auto;}


/*@media only screen and (max-width: 1199px) {
	
#nav_container{width:100%;height:100% !important;margin:0 auto;padding:0;}	

	
}*/


/*************************************************/



#BackTop{width:100%;height:auto;display:none;padding:0.5em 0em;background:rgba(49,30,62,1.00); position:fixed;top:0px;z-index: 9999999;box-shadow: 0 0 8px 3px rgba(0,0,0,0.4)}


/**/
.fl{float:right;}
.fr{float:left;}



/*#navToggle{display:none}
.m_nav{display:none}

@media only screen and (max-width: 992px) {*/

.header .left .href_block{display:none;}
	
	
.m_nav .href_block{width:100%;display:flex;flex-wrap: wrap;justify-content: center;align-content: center;align-items:center;height: auto;padding:0;}
.m_nav .href_block .btu01 a{display: inline-block;font:1em "微軟正黑體";font-weight: 700; border-radius: 10px;padding:0.5em 1.3em;margin:0 0.5em;background: #1a43ab;color:#ffffff;} 
.m_nav .href_block .btu01 a:hover{background: #000000;color:#ffffff;} 
.m_nav .href_block .btu02 a{display: inline-block;font:1em "微軟正黑體";font-weight: 700;border-radius: 10px;padding:0.5em 1.3em;margin:0 0.5em;background: #1a98ab;color:#ffffff;} 
.m_nav .href_block .btu02 a:hover{background: #000000;color:#ffffff;} 	
	
.m_nav{display:block}
.m_nav{position:fixed;top:0;width:100%;height:100%;background:#ffffff;z-index:1000;opacity:1;overflow-y:auto;transition:all ease .5s;left:0;transform:translateX(-100%);}
.m_nav.open{transform:translateX(0);padding:0 0em}
/*.m_nav{position: relative;width:100%;height:0px;top:86px; background:rgba(0,255,255,1);opacity:1;z-index:10000}
.m_nav.open{idth:100%;height:100%;top:86px;background:rgba(0,0,255,1);}*/
.m_nav .top{height:60px;padding:20px;box-sizing:border-box}

/*add*/
.m_nav_block{display:none;position:fixed;top:0;left:0;width:0;height:0;width:100%;height: 100%;background: rgba(0,0,0,0.3);z-index:0}
.m_nav_block .closecover{position:absolute;width:100vw !important;height:100vh !important;background:#0b0d19;filter:alpha(opacity=0);opacity:0;left:0;top:0;z-index:1000}
/*add*/
.m_nav .top .closed{width:30px;height:30px;vertical-align:middle;float:right;cursor:pointer}
.m_nav .dropdown span{color:#ff0000;}

	
	
.m_nav .m_naber_t_lang{width:100%;text-align: center; padding:0.8em 0.1em;margin-bottom: 0.2em;}
.m_nav .m_naber_t_lang .btu_lang a{display: inline-block;font:12pt "微軟正黑體";font-weight: 700; border-radius: 30px;padding:0.3em 1.8em;margin:0 0.2em;background: linear-gradient(-90deg, #cd080a 35%, #b20406 60%);color:#ffffff;} 
.m_nav .m_naber_t_lang .btu_lang a:hover{background: #000000;color:#ffffff;} 
	
.m_nav .m_naber_t_lang .btu01_lang a{display: inline-block;font:12pt "微軟正黑體";font-weight: 700; border-radius: 8px;padding:0.5em 5.5em;margin:1.5em 0.2em 0;background:#ffffff;color:#545454;border:1px solid #545454;} 
.m_nav .m_naber_t_lang .btu01_lang a:hover{background: #545454;color:#ffffff;} 
	
	
.m_nav .ul{color:#000000;}
.m_nav .ul li{padding:0 0px;transform:translateY(0);-webkit-transform:translateY(100%);transform:translateY(100%);-webkit-transition:all .6s cubic-bezier(.77,0,.175,1) 0;transition:all .6s cubic-bezier(.77,0,.175,1) 0;opacity:0}
.m_nav.open .ul li{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}

.m_nav .ul li a{display:block;text-decoration:none;font:1em "微軟正黑體";font-weight: 600;color:#82689d;background:url(../images/arrow_mobile.png)no-repeat left 0.82em;width:100%;padding:0.7em 0em 0.7em 1.5em;}
.m_nav .ul li a:hover{color:#000000;}
.m_nav .ul li .dropdown_menu{display:none}
.m_nav .ul li.dropdown.active .dropdown_menu{display:block}
.m_nav .ul li .dropdown_menu a{display:block;font:1em "微軟正黑體";font-weight: 600;color:rgba(0,0,0,0.8);;background:#ffffff;padding:0em 1.2em 0.5em 2.2em;box-sizing:border-box;}
.m_nav .ul li .dropdown_menu a:last-child{border:none}
	
/*for switer_droupmenu*/

.m_nav .ul li .eng{font:0.8125em "微軟正黑體";font-weight: 600;color:#a592b8;}
.m_nav .ul .dropdown .dropdown_block{width:calc(100% - 2em);margin:0.5em 1em;border-radius:5px ; background:rgba(180,161,196,0.5);display: flex;flex-wrap: wrap;justify-content: flex-start;align-content: space-between;align-items: strgba(0,0,0,1.00)etch;height: :auto;}
.m_nav .ul .dropdown .dropdown_block .list{width:calc(100%/3);text-align: center;}
.m_nav .ul .dropdown .dropdown_block .list img{width:100%;max-width: 100%;height: auto;}

/**/
/*	}


@media screen and (max-width:992px) {*/

	
.header{width:100%;position:fixed;top:0;left:0;z-index:999;height:auto;padding:0;background:rgba(255,255,255,1);box-shadow:3px 3px 3px rgba(0,0,0,0.2);}
.header .left{width:calc(100% - 70px);margin-left:5px; padding:0;height:70px;}
.header .left .img1{display:none;}	
.header .left .img2{display:inline-block;}
.header .left .img2 img{width:100%;max-width:100%;height:auto;background:rgba(2,2,2,0);}	

.header #navToggle{height:auto;padding:9px 15px; margin-right:-15px;display:inline-block;float:left;}
.header #navToggle span{position:relative;width:30px;height:3px;margin:30px 0 10px 0}
.header #navToggle span:before,.header #navToggle span:after{content:'';position:relative;width:100%;height:3px;left:0}
.header #navToggle span,.header #navToggle span:before,.header #navToggle span:after{-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;transition:.3s;display:block;background:#000000}
.header #navToggle span:before{top:8px}
.header #navToggle span:after{bottom:10px}
.header #navToggle.open span:before{top:10px;-webkit-transform:translateY(-11px) rotate(-45deg);-moz-transform:translateY(-11px) rotate(-45deg);-ms-transform:translateY(-11px) rotate(-45deg);-o-transform:translateY(-11px) rotate(-45deg);transform:translateY(-11px) rotate(-45deg)}
.header #navToggle.open span:after{bottom:12px;-webkit-transform:translateY(10px) rotate(45deg);-moz-transform:translateY(10px) rotate(45deg);-ms-transform:translateY(10px) rotate(45deg);-o-transform:translateY(10px) rotate(45deg);transform:translateY(10px) rotate(45deg)}
.header #navToggle.open span{background:0 0}
.header #navToggle.open span:before,.header #navToggle.open span:after{background:#ffffff}
.header .nav{display:none}
.banner img{height:600px;object-fit:cover}

/*}*/
@media screen and (max-width:420px) {
.header .left .img2 img{width:100%;max-width: 100%;height:auto;}	
}





