body { background-image:url(../images/layout/bg_main.jpg); font-family:Arial, Helvetica, sans-serif;}
#wrapper { background-color:#fff; max-width:990px; margin:0 auto; box-shadow: 0 0 5px rgba(0,0,0,0.3); overflow: hidden; }

/*===============////////////top////////////===============*/
.top { background-image:url(../images/layout/header_bg.jpg); width:100%; height:134px; margin:0 auto; position:relative; z-index:1000; }
.logo { display:block; position:absolute; top:0; left:16px; z-index:12; }
.logobg{ width:263px; height:134px; background-image:url(../images/layout/logo_bg.png); background-position:center right; background-repeat:no-repeat; position:absolute; top:0; left:0; z-index:1; }


/*-----語言/聯絡資訊/宏大首頁-----*/
.functionTop{ display:flex; flex-direction: column; align-items: flex-end; position:relative; z-index:11; }
.lanBox { overflow:hidden; margin-top:30px; margin-right: 35px; padding-top:10px; width:525px;}
.lanBox p { float:left; color:#ffffff; font-size:13px; line-height: 17px; }
.lanBox p a { color:#ffffff;}

.iconPhone { margin-bottom:-1px; margin-right:6px;}
.iconLogo { margin-top:-3px;}

/*-------主選單-------*/
.menuBox { padding: 0 25px 0 25px; font-size:14px; color:#ffffff; margin-top:15px; background-image:url(../images/layout/menu_bg.png); background-repeat:no-repeat; background-position:left center; }
.menu a { color:#ffffff; margin:0 20px; padding:7px 0;}
.menu a:hover { color:#233237;}
.menu .menulist{ padding:0; line-height:31px; display:inline-block; }

.menuBtn{ display:none; position:absolute; top:0; bottom:0; right:30px; margin:auto; width:30px; height:30px; cursor:pointer; }
.menuBtn span{ display:block; background-color:#fff; margin:5px 0; width:100%; height:3px; }

/*刪除*/
.menuBox a { color:#ffffff; margin:0 20px; padding:7px 0;}
.menuBox a:hover { color:#233237;}

.menu { list-style:none;}
.menu > li { float:left; position:relative;}
.menu li ul { position:absolute; top:24px; left: 50%; margin-left: -61px; background-color:#B31419; width:112px; font-size:13px; padding:5px 0; visibility:hidden; top:22px\9;z-index: 999; }
.menu li ul li { text-align:center; padding:6px 0; list-style:none;}
.menu li ul li a { margin:0;}



/*===============////////////content////////////===============*/
#content { width:100%; margin:0 auto; padding-bottom:10px; clear:both; }

/*===============////////////footer////////////===============*/
#footer { width:100%; margin:0 auto; color:#ffffff; font-size:12px; background-color:#006171; padding:18px; line-height:1.5; clear:both; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
#footer a { color:#ffffff;}
#footer a:hover { text-decoration:underline;} 


/*----------------------^^^^^^^^^^^^^^^^^^^^^^^^^^^麵包屑^^^^^^^^^^^^^^^^^^^^^^^^^^^-----------------------*/
.myWay { height:26px; color:#006B7A; padding:0 18px; line-height:26px; margin-bottom:2px;}
.myWay a { color:#006B7A; font-size:12px;}
.myWay a:hover { text-decoration:underline;}
.homeIcon img { margin-right:5px; margin-bottom:-1px;}

/*================================●●●●●●●●●●●●Hover●●●●●●●●●●●●================================*/
@media screen and (min-width: 991px){
/*-------主選單-------*/
/*觸發*/
.menu li:hover > ul { visibility:visible;}


}

/*================================●●●●●●●●●●●●平板●●●●●●●●●●●●================================*/
@media screen and (min-width: 768px) and (max-width:990px) {
/**header**/
.functionTop{ display:block; position:absolute; top:134px; right:0; background-color: rgba(179,20,27,1); width: 220px; visibility:hidden; transform:translateX(300px); transition: transform 0.5s; }
.functionTop.open{  animation:opens 0.5s forwards; }
.functionTop.close{ animation:closes 0.5s forwards; }

@keyframes opens{
	from{ transform:translateX(300px); visibility:hidden; }
	to{ transform:translateX(0px); visibility:inherit; }
}

@keyframes closes{
	from{ transform:translateX(0px); visibility:inherit; }
	to{ transform:translateX(300px); visibility:hidden; }
}

.menuBox{ background:none; margin-top:0; padding:0 10px 10px 10px; width: 100%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
.menu > li{ float:none; font-size:0; text-align:center; border-bottom:1px solid #d46368; }
.menu > li:last-child{ border-bottom:none; }
.menu > li a{ font-size:14px; margin:0; }
.menu > li > ul{ position:static; visibility:inherit; margin:auto; width:auto; }
.menu > li > ul > li{ background-color: #90191e; margin-bottom:5px; padding: 0; }
.menu > li > ul > li > a{ font-size:13px; display: block; }
.menu .sLevel{ display: none; }

.menu .menulist{ display: block; position: relative; }
.menu .menulist.arrow::before{ content: ""; display: block; position: absolute; width:5px; height: 5px; transform: rotate(45deg); border-right: 2px solid #fff; border-bottom: 2px solid #fff; right: 5px; top: 10px; }


.lanBox{ display:flex; flex-wrap:wrap; width:100%; padding:10px; margin:0; box-sizing:border-box; }
.lanBox p{ float:none; width:100%; box-sizing:border-box; padding:5px 0; margin-top:5px; }
.lanBox p:first-child{ border-right:1px solid #fff; }
.lanBox p:nth-child(-n+2){ width:50%; text-align:center; margin:0; }
.lanBox .pcNone{ display:none; }


.menuBtn{ display:block; }

}

/*================================●●●●●●●●●●●●手機●●●●●●●●●●●●================================*/
@media screen and (max-width: 767px) {
/**header**/
.logo{ width:70px; }
.logo img{ width:100%; height:auto; }
.logobg{ height:70px; width:170px; }

.top{ height:70px; position:fixed; top:0; left:0; width:100%; }

.functionTop{ display:block; position:absolute; top:70px; right:0; background-color: rgba(179,20,27,1); width: 100%; height:calc(100vh - 70px); overflow:auto; visibility: hidden; }
.functionTop.open{  animation:opens 0.8s forwards; }
.functionTop.close{ animation:closes 0.8s forwards; }

@keyframes opens{
	from{ visibility: hidden; height:0%; }
	to{ visibility:inherit; height: calc(100vh - 70px); }
}

@keyframes closes{
	from{ visibility: inherit; height: calc(100vh - 70px); }
	to{ visibility: hidden; height:0%; }
}


.menuBox{ background:none; margin-top:0; padding:0 10px 10px 10px; }
.menu > li{ float:none; font-size:0; text-align:center; border-bottom:1px solid #d46368; }
.menu > li:last-child{ border-bottom:none; }
.menu > li a{ font-size:16px; margin:0; }
.menu > li > ul{ position:static; visibility:inherit; margin:auto; width:auto; }
.menu > li > ul > li{ background-color: #90191e; margin-bottom:5px; padding: 0; }
.menu .sLevel{ display: none; }

.menu .menulist{ display: block; }
.menu > li > ul > li > a{ display: block; font-size: 14px; }

.menu .menulist{ display: block; position: relative; line-height: 46px; }
.menu .menulist.arrow::before{ content: ""; display: block; position: absolute; width:5px; height: 5px; transform: rotate(45deg); border-right: 2px solid #fff; border-bottom: 2px solid #fff; right: 5px; top: 17px; }


.lanBox{ display:flex; flex-wrap:wrap; width:100%; padding:10px; margin:0; box-sizing:border-box; }
.lanBox p{ float:none; width:100%; box-sizing:border-box; padding:5px 0; margin-top:5px; }
.lanBox p:first-child{ border-right:1px solid #fff; }
.lanBox p:nth-child(-n+2){ width:50%; text-align:center; margin:0; }
.lanBox .pcNone{ display:none; }

.menuBtn{ display:block; width:20px; height:20px; right: 20px }
.menuBtn span{ height:2px; }

/**/
#wrapper{ margin-top: 70px; }


/*----------------------^^^^^^^^^^^^^^^^^^^^^^^^^^^麵包屑^^^^^^^^^^^^^^^^^^^^^^^^^^^-----------------------*/
.myWay{ height: auto; }
.myWay a{ font-size: 14px; }

/*===============////////////footer////////////===============*/
#footer{ font-size: 14px; }
#footer .inlineblock{ display:inline-block; vertical-align:middle; font-size:inherit; color:inherit; }


}