@import url('https://fonts.googleapis.com/css?family=Lora');
@import url('/css/SeoJump.css');
/*-----------------------------------------------------------------------------
 [TABLE OF CONTENTS]
    +common
        =anchor
        =clear,clearfix
        =banner
    +header
        =cis
        =site-func
        =share-func
        =nav
    +content
        +content-main
        +content-sidebar
    +footer
        =footer-link
/*-----------------------------------------------------------------------------
 [TABLE OF CONTENTS]
    +common
        =anchor
        =clear,clearfix
        =banner
    +header
        =cis
        =site-func
        =share-func
        =nav
    +content
        +content-main
        +content-sidebar
    +footer
        =footer-link
        =company-info
-----------------------------------------------------------------------------*/

/* +common
*----------------------------------------------------------------------------*/
*{
	-webkit-text-size-adjust: none;
}
body {
	margin:0;
	border:0;
	width:100%;
	color: #323232;
	font-size: 15px;
	line-height:170%;
}
div, h1, h2, h3, h4, hr, p, form, label, input, textarea, img, span, strong {
	text-align: left;
	vertical-align: middle;
	margin: 0px;
	padding: 0px;
	word-wrap: normal;
	word-break: normal;
	border-width:0;
	font-family: "微軟正黑體", "蘋果儷中黑", "Lucida Grande", "Arial", "Arial Narrow";
	outline:none;
}
hr{
	noshade:noshade;
}
th{
	font-weight: normal;
}
ul {
	list-style: none;
	margin: 0;
	padding: 0;
    overflow:hidden;
}
li{
	list-style: none;
}
a ,
a:hover{
	text-decoration: none;
	cursor: pointer;
	outline:none;
	color:#323232;
}
img{
	max-width:100%;
}
br{
	font-family:Arial !important;	
}
.pageh1{
	position:fixed;
	z-index:-8989898;
	opacity:0;
	color:#fff;
}
.wrapper .slick-slider{
	margin: 0;
}
header #mobile-menu >ul::-webkit-scrollbar-thumb{
  background: #2aa4fd;
  border: none;
  border-radius: 0;
  opacity: .2;
}
header #mobile-menu >ul::-webkit-scrollbar-track{
  background: #026fbf;
  border: none;
  border-radius: 0;
}
.S-func,
.nav-funcB,
.nav-func,
.phoneWrap,
.sub2Option,
.sub3Option{display:none;}
.wrapper,
#structure-model{overflow:hidden;position:relative;}
#model-left{width: 370px;float:left;}
#model-right{width: calc(100% - 371px);float:left;border-left: 1px solid #f0f0f0;overflow: hidden;}
header{
    background-color: #ffffff;
    padding: 23px 0px 0px 0px;
}
header .mobile-main-nav{}

header #cis a{
	display: block;
    width: 347px;
    height: 103px;
}
header #mobile-menu{}
header #mobile-menu >ul >li{padding: 0 20px;}
header #mobile-menu >ul >li:last-child{border:0;}
header #mobile-menu .menu_head,
header #mobile-menu .menu_body .sub2Title,
header #mobile-menu .menu_body .sub3Title{position: relative;}
header #mobile-menu .menu_head p a,
header #mobile-menu .menu_body .subOption li .sub2Title p a,
header #mobile-menu .menu_body .subOption li .sub3Title p a{
    display: inline-block;
    vertical-align: middle;
    color: #026fbf;
    font-weight: bold;
    padding: 12px 0;
}
header #mobile-menu .current .menu_head p a,
header #mobile-menu .menu_head a:hover,
header #mobile-menu .menu_body .subOption li .sub2Title p a:hover, header #mobile-menu .menu_body .subOption li .sub3Title p a:hover,header #mobile-menu .menu_body .subOption li >div p a:hover{color: #242424;}
header #mobile-menu .menu_head b,
header #mobile-menu .menu_body .sub2Title.bo b,
header #mobile-menu .menu_body .sub3Title.bo b{
    position: absolute;
    right: 0;
    color: #026fbf;
    top: 13px;
    display: block;
    width: 25px;
    text-align:  center;
    line-height: 25px;
    cursor: pointer;
}
header #mobile-menu .menu_head.c0 p a,
header #mobile-menu .menu_body .sub2Title.bo p a,
header #mobile-menu .menu_body .sub3Title.bo p a{
    display: block;
}
header #mobile-menu .menu_body{}
header #mobile-menu .menu_body .subOption li{
    padding: 0 0 0 15px;
}
header #mobile-menu .menu_body .sub2Title, header #mobile-menu .menu_body .sub3Title{
    border: none;
}
header #mobile-menu .menu_body .subOption li .sub2Title p a, header #mobile-menu .menu_body .subOption li .sub3Title p a{
    padding: 7px;
}
header #mobile-menu .menu_body .sub2Title.bo b,
header #mobile-menu .menu_body .sub3Title.bo b{
    top: 7px;
    color: #a9acad;
}
header #mobile-menu .menu_body .subOption li >div{}
header #mobile-menu .menu_body .subOption li >div p a{
    vertical-align: middle;
    color: #026fbf;
    font-weight: bold;
    padding: 7px 0;
    display: block;
}
#top-nav{}
#top-nav .translate{
    margin-top: 20px;
}
#top-nav .translate form{
    margin-bottom: 20px;
}
#top-nav .translate form p{
    overflow: hidden;
    background: #fff;
    border-radius: 15px;
    padding: 5px 8px;
}
#top-nav .translate form p a{
    display: block;
    width: 25px;
    font-size: 20px;
    float: right;
    color: #026fbf;
}
#top-nav .translate form p input{
    float: left;
    width: calc(100% - 45px);
    font-size: 15px;
    height: 25px;
    padding: 0 5px;
}
#top-nav .translate >p{
    display: inline-block;
    font-size: 12px;
    width: calc((100% / 3) - 5px);
}
#top-nav .translate >p:hover a,
#top-nav .translate >p:hover{color: #026fbf;}
.modelwidth{ position:relative; margin:0 auto;}
footer .modelwidth{display: flex;justify-content: space-around; overflow:hidden; border-bottom: 1px solid #dadada;}
#footerSet .modelwidth{
	border: none;
}
footer{
	color: #0b0b0b;
	font-size: 13px;
}
footer #footerCompany{
	background: #f2f2f2;
	padding: 15px 0 10px;
	color: #858585;
}
footer #footerCompany .row{
    display: inline-block;
    width: calc(28% - 4px);
    vertical-align: top;
    padding-bottom: 4px;
}
footer #footerCompany .row:nth-child(2){
	padding-top: 22px;
	width: 590px;
}
footer #footerCompany .row h2{
	position: relative;
	font-size: 18px;
	margin-bottom: 20px;
	color: #000;
}
footer #footerCompany .row h2::before{
	content: "";
	position: absolute;
	bottom: 10px;
	right: 16px;
	border-bottom: 1px solid #dadada;
	width: 60%;
}
footer #footerCompany .row h2 span{
    display: inline-block;
    width: 10px;
    height: 18px;
    background:url(/images/02/footerContactDot.png) no-repeat;
	background-position: 50% 350%;
    margin-right: 10px;
    margin-left: 8px;
   
    vertical-align: baseline;
}
.footerLogo{
	padding-top: 38px;
}
footer #footerCompany nav{
	display: flex;
	justify-content: flex-end;
}
footer #footerCompany nav a{
	position: relative;
	padding: 0 8px;
	font-size: 14px;
	color: #c7b084;
}
footer #footerCompany nav a:not(:first-child)::before{
	content: "";
	position: absolute;
	border-left: 1px solid #c7b084;
	left: 0px;
	top: 50%;
	transform: translate(-50%,-50%);
	height: 16px;


}
footer #footerCompany .footerIcon{
	display: flex;
	justify-content: flex-end;
    height: 110px;
    align-items: flex-end;
}
footer #footerCompany .footerIcon a{
	padding: 14px 6px;
}
footer #footerSet{
    background: #f2f2f2;
    
}
footer #footerCompany .comlist,
footer #footerCompany .fcontact,
footer #footerCompany .footernav{
	/*max-width:80%;*/
}
footer #footerCompany ul.comlist{
	display: flex;
	padding-left: 5%;
	flex-wrap: wrap;
}
footer #footerCompany ul.comlist li{
	width: 50%;
	font-size: 14px;
}
footer #footerCompany #footer-qrcode,
footer #footerCompany #footer-FB,
footer #footerCompany #footer-map{
	width:100px;
	display:inline-block;
	margin:0 10px 10px 0; 
	max-width:40%;
}


footer #footerCompany .comlist li b{
	color: #565555;
	margin-right: 10px;
	vertical-align: middle;
}
footer #footerCompany .comlist li span{
	vertical-align: middle;	
}

footer #footerCompany .fcontact li{
	margin-bottom:5px;
}
footer #footerCompany .fcontact li a{
	display: block;
    background: #494949;
    text-align: center;
    color: #fff;
    padding: 13px 0;
	transition:all linear 0.3s;
}
footer #footerCompany .fcontact li:nth-child(even) a{
    background: #026fbf;
    color: #fff;
}
footer #footerCompany .fcontact li a:hover{
	opacity:0.8;
}
footer #footerCompany .footernav li{
    margin-bottom: 5px;
    float: left;
    width: 50%;
}
footer #footerCompany .footernav li a,
footer #footerCompany .comlist li span a{
	color: #565555;
}
footer #footerCompany .footernav li a:hover{
	color:#ebd618;
}
#footerSet .info{
	text-align: right;
	width: 100%;
}
#footerSet .info div,
#footerSet .info p{
	display:inline-block;
	vertical-align:top;
	color: #818181;
	font-size:12px;
}
#footerSet .info .SeoWebFooter{display:block;text-align: right}
#footerSet .info a{
	color: #818181;
}
#footerSet .community{
	float:right;
	text-align:right;
}
#footerSet .community li{
	display:inline-block;
	margin-left:5px;
}
#footerSet .community li a{
    display: block;
    color: #999;
    border: 1px solid #5f5f5f;
    width: 25px;
    height: 25px;
    text-align: center;
    left: 25px;
}
#footerSet .community li a:hover{
    color: #fff;
	background:#5f5f5f;
}
footer #footerCompany .comlist{
    overflow: visible;
}
footer #footerCompany .plus-information{overflow: visible;}
footer #footerCompany .plus-information a{
	position:relative;
	display: inline-block;
}
footer #footerCompany .plus-information img{
	position:absolute;
	max-width: 150px;
	bottom: 100%;
	left: 0;
	z-index: 8;
	max-height: 150px;
	display:none;
}
.web{
	background:#000;
	color: #4f4f4f;
	font-size:8pt;
	padding: 15px 0;
}
#gotop{
    display: block;
    background: url(/images/02/gotop.png) center no-repeat;
    color: #ffffff;
    position: fixed;
    right: 30px;
    bottom: 60px;
    width: 50px;
    height: 45px;

    
    
	z-index: 9;
}
#gocart{
    display: block;
    background-color: #bd2222;
    color: #ffffff;
    position: fixed;
    right: 10px;
    bottom: 60px;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 37px;
    font-size: 17px;
    border-radius: 50%;
    box-shadow: 0 0 2px #000;
    z-index: 9;
}
header::-webkit-scrollbar,
body::-webkit-scrollbar{width:7px;}
#model-left::-webkit-scrollbar{width:0;}
header::-webkit-scrollbar-track,
body::-webkit-scrollbar-track{background:#c5c5c5;}
header::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb{background:#026fbf;}
header::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover{background:#393935;}
@media screen and (min-width: 1440px) {
	.modelwidth{width:80%;margin: 0 auto}
}
@media screen and (min-width: 1280px) {
	footer #footerCompany .plus-information a:hover img{
		display:block;
	}
}
@media screen and (max-width: 1680px) {
	
	#model-left{width: 320px;}
	#model-right{width: calc(100% - 321px);}
	header{padding: 30px 40px 50px 40px;}
}
@media screen and (max-width: 1440px) {
	footer .modelwidth{width: 90%;}
	#model-left{width: 280px;}
	#model-right{width: calc(100% - 281px);}
}
@media screen and (min-width: 1180px) and (max-width: 1440px) {
	#top-nav .translate >p{display: block;width: 100%;text-align: center;}
}

@media screen and (max-width: 1366px) {
	.modelwidth {
		width: 880px;
	}	
	#model-left{width: 270px;}
	#model-right{width: calc(100% - 271px);}
footer #footerCompany nav {
    flex-wrap: wrap;
}
}
@media screen and (max-width: 1260px){

	footer #footerCompany nav{
		flex-wrap: wrap;
	}
	footer #footerCompany nav a{
		width: 30%;
		text-align: center;

	}
	footer #footerCompany nav a:not(:first-child)::before{
		border: none;
	}
}
@media screen and (min-width: 1181px) {
	header #mobile-menu{
		display:block !important;
		width: 100%;
	}
	#model-left{
		overflow-y: scroll;
		left: 0;
		top: 0;
	}
	#model-right{float:right;}
	header{
		max-height: calc(100vh - 80px);
		overflow: auto;
	}

}
@media screen and (max-width: 1180px) {
	#model-left{width: 100%;}
	#model-right{width: 100%; border-left:0;margin-top: 64px;}
	.modelwidth {
		width: 95%;
	}
	.nav-funcB ,
	.nav-func ,
	.S-func{
    display: block;
    position: fixed;
    top: 40px;
    transform: translate(10%,-50%);
    left: 2.5%;
    font-size: 28px;
    z-index: 99;
 }
	.nav-func{
		top: 19px;
		right: 2.5%;
		left: inherit;
		color: #026fbf;
	}
	.S-func{
    right: calc(2.5% + 35px);
    left: inherit;
    color: #026fbf;
	}
	header #mobile-menu{
    display: none;
    background-color: #f0f0f0;
    position: fixed;
    left: 0;
    top: 80px;
    width: 270px;
    z-index: 9;
    border-right: 1px solid #e3e3e3;
    border-top: 1px solid #e3e3e3;
    height: calc(100vh - 65px);
    /*height: 60vh;*/
    }
	#top-nav{
    display: none;
    position: fixed;
    right: 2%;
    width: 270px;
    top: 69px;
    }
    header #cis{
   	width: 100%;
    margin: 0;
    }
    header #cis a{
    	height: auto;
    	width: 100%;
    }
    header #cis h2{
    text-align: center;

}
    header #cis img{
    height: 60px;
}
    header{
    padding: 10px 2.5%;
    position: fixed;
    width: 95%;
    box-shadow: 0 0 5px rgba(80, 80, 80, 0.39);
    z-index: 89;
 }
	header #mobile-menu .menu_head p a, header #mobile-menu .menu_body .subOption li .sub2Title p a, header #mobile-menu .menu_body .subOption li .sub3Title p a{
    padding: 10px 20px;
	}
	header #mobile-menu .menu_head b, header #mobile-menu .menu_body .sub2Title.bo b, header #mobile-menu .menu_body .sub3Title.bo b{
		right: 20px;
		top: 9px;
	}
	header #mobile-menu .menu_body .subOption li >div p a{
		padding: 7px 20px;
	}
	header #mobile-menu >ul >li{
		border: none;
	}
	header #mobile-menu >ul{max-height: calc(100vh - 64px - 60px);overflow: auto;padding-bottom: 60px;}
	header #mobile-menu >ul::-webkit-scrollbar{
	  width: 4px;
	}
	#top-nav .translate{
    margin: 5px 0 0;
    text-align: center;
	}
	#top-nav .translate form{
    margin-bottom: 10px;
	}
	#top-nav .translate form p{
		border: 1px solid #c4c4c4;
	}
	#top-nav .translate >p{
		background: #f0f0f0;
		border-radius: 15px;
		text-align: center;
	}
	#fixsideStle .control{
		position: fixed;
		right: 0;
		width: 270px;
		z-index: 99;
		background: #fff;
		height: calc(100vh - 65px);
		top: 65px;
		display:none;
	}
	footer #footerCompany .row{
		width: calc(50% - 4px);
		margin-bottom: 40px;
	}
	footer #footerCompany .row:nth-child(2){
        width: 80%;
    }
	footer #footerCompany .row:last-child,
	footer #footerCompany .row:nth-child(3){
		margin-bottom: 0;
	}
}
@media screen and (max-width: 1065px){
	footer #footerCompany .row:last-child, footer #footerCompany .row:nth-child(3){
		width: 30%;
	}
	footer #footerCompany nav a{
		width: 55%;
	}
	footer #footerCompany .footerIcon{
		align-items: center;
	}
	footer .modelwidth{
		width: 85%;
	}
}
@media screen and (max-width: 980px){
	footer #footerCompany .row h2::before{
        width: 50%;
    }
    footer #footerCompany .row:nth-child(2){
        width: 70%;
    }
    footer #footerCompany ul.comlist li{
    	width: 100%;
    }
    footer #footerCompany nav a{
    	width: 100%;
    }
    footer #footerCompany .footerIcon{
    	justify-content: center;
    }
    #gotop{
    	right: 15px;
    }
}
@media screen and (max-width: 820px){
	footer .modelwidth{
		flex-wrap: wrap;
	}
	
    footer #footerCompany .row:nth-child(2){
        padding: 0 15%;
    }
	footer #footerCompany .row:last-child, footer #footerCompany .row:nth-child(3){
		width: 65%;
	}
	footer #footerCompany nav{
		flex-wrap: nowrap;
	}
	footer .modelwidth{
		width: 80%;
	}
}
@media screen and (max-width: 640px) {
	footer #footerCompany .row:last-child, footer #footerCompany .row:nth-child(3){
		width: 75%;
	}
	footer #footerCompany .comlist, footer #footerCompany .fcontact, footer #footerCompany .footernav{
		width: 100%;
		max-width: 100%;
	}
	footer #footerCompany .row h2::before{
		width: 40%;
	}
	footer #footerCompany{
		padding: 34px 0 60px;
	}
	footer #footerCompany .row:last-child,
	footer #footerCompany .footernav li,
	#footerSet .community,
	#footerSet .info,
	#footerSet .info .SeoWebFooter{
		text-align:center;
	}
	#footerSet .info,
	#footerSet .community{
		width:100%;
	}
	#footerSet .community{
		margin-top:20px;
	}
	.phoneWrap{
		display:block;
		position:fixed;
		bottom: 10px;
		left:10px;
		width: calc(100% - 60px);
		z-index: 88;
	}
	.phoneWrap li{
		display: inline-block;
		width: calc(50% - 4px);
	}
	.phoneWrap li a{
		
		position: absolute;
		bottom: 117px;
    	right: -57px; 
		padding: 0 15px;
		text-align: center;
		line-height: 40px;
		font-size: 10pt;
		border-radius: 25px;
	}
	.phoneWrap li a img{
		width: 60px;
	}
	.phoneWrap li:nth-child(2) a{
		background: rgb(39, 169, 33);
	}
	.web{
		padding-bottom:60px;
	}
	.nav-func{right: 20px;}
	.nav-funcB{left: 20px;}
footer #footerCompany .footerIcon a {
    padding: 14px 19px;
}
}
@media screen and (max-width: 560px){
	footer #footerCompany nav{
		flex-wrap: wrap;
		justify-content:center;
	}
	footer #footerCompany nav a{
		width: 40%;
	}

}
@media screen and (max-width: 480px) {
	header #mobile-menu{
		top: 70px;
	}
	header #cis img{
        height: 50px;
    }
	footer #footerCompany .row{
		width: 100%;
	}
	.footerLogo{
		padding-top: 0px;
	}
	.footerLogo a{
		display: block;
    	text-align: center;
	}
	footer #footerCompany .row h2{
		text-align: center;
	}
	footer #footerCompany .row h2::before{
		border: none;
	}
	footer #footerCompany ul.comlist{
		text-align: center;
		padding-left:0px;
	}
	header #cis{
		width: 100%;
	}
	header #cis a{
		width: auto;
		height: auto;
	}
	footer #footerCompany #footer-qrcode, footer #footerCompany #footer-FB, footer #footerCompany #footer-map{
	    width: 70px;	
	}
	.web{
		font-size:6pt;
	}
	footer #footerCompany{ padding: 50px 0;}
	footer #footerCompany .row h2 a{
		position: relative;
	}
	footer #footerCompany .row h2 span{
		position: absolute;
		left:-28px;
    	top: 1px;	
	}
}
@media screen and (max-width: 466px){
	footer #footerCompany nav a{
		width: 30%;
	}
	.phoneWrap li a img{
		
	}
}