@charset "UTF-8";

header{
	position: -webkit-sticky;
	position: sticky;
	top: 0px;
	height: 80px;
	z-index: 999;
}

header > div{
	width: 100vw;
	border-bottom: 5px solid #ecb250;
	background-color: #faf9f2;
}
.headerContent{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	height: 100%;
}
_:-ms-lang(x)::-ms-backdrop, header > div {
  width: calc(100vw - 18px);
}

.headerRightWrap{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	align-item: center;
	-ms-flex-preferred-size: 75%;
	    flex-basis: 75%;
    padding-right: 20px;
}

.headerLeft{
	padding: 0 20px;
	-ms-flex-preferred-size: 260px;
	    flex-basis: 260px;
}

.headerLeft a{
	display: block;
	width: 260px;
}
.headerLeft a img{
	width: 100%;
}

.telIcon{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	width: 450px;
	height: 100%;
}

.headerLink{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
/* 	justify-content: space-between; */
	-webkit-box-pack: end;
	    -ms-flex-pack: end;
	        justify-content: flex-end;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-ms-flex-preferred-size: 80%;
	    flex-basis: 80%;
}

.headerLink li{
	padding: 0 30px ;
	text-align: center;
}

.headerRight{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;

}
header a.contactBtn {
   	width: 200px;
   	height: 50px;
   	font-size: 14px;
   	margin-right: 0;
   }

.telArea {
    margin-right: 20px;
    -ms-flex-preferred-size: 230px;
        flex-basis: 230px;
        width: 230px;
}
.humb{
	display: none;
}
a.turnTop{
	display: block;
    padding: 8px 16px;
    border-radius: 20px;
    background-color: #ecb250;
    color: #FFF;
}
.spShow{
	display: none;
}

@media screen and (max-width: 1590px){
	.headerLink li a{
		font-size: 14px;
	}
	.headerLink li {
	    padding: 0 15px;
	}
}
@media screen and (max-width: 1370px){
	.headerLeft{
		-ms-flex-preferred-size: 240px;
		    flex-basis: 240px;
	    padding: 0 10px;
	}
	header a.contactBtn {
    	width: 160px;
    	height: 40px;
    	font-size: 12px;
    	margin-right: 0;
    }

	.headerLeft a{
		width: 130px;
	}
	.telArea {
	    -ms-flex-preferred-size: 180px;
	        flex-basis: 180px;
			width: 180px;
	}

}


@media screen and (max-width: 1270px){
	.headerLeft{
		-ms-flex-preferred-size: 140px;
		    flex-basis: 140px;
	}
	.headerLink li {
	    padding: 0 5px;
	}

	.headerRightWrap{
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		align-item: center;
		-ms-flex-preferred-size: calc(100% - 140px);
		    flex-basis: calc(100% - 140px);
	}

}

@media screen and (max-width: 974px){
	header{
		position: fixed;
		height: 60px;
	}
	header a.contactBtn {
    	width: 160px;
    	height: 40px;
    	font-size: 12px;
    	margin-right: 0;
    }
    .headerLeft {
	    margin: 0 auto;
	    -ms-flex-preferred-size: 50%;
	        flex-basis: 50%;
	}


	.humb{
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
		height: 100%;
		margin-right: 20px;
	}
	.humbBer{
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
		width:  35px;
		height: 35px;
		margin-right: 10px;
	}
	.humbBer > span{
		width: 35px;
		height: 3px;
		position: relative;
		background-color: #333;
		border-radius: 3px;
		opacity: 1;
		-webkit-transition: background-color .2s;
		-o-transition: background-color .2s;
		transition: background-color .2s;
	}
	.humbBer > span:before, .humbBer > span:after{
		content: "";
		display: block;
		width: 35px;
		height: 3px;
		position: absolute;
		background-color: #333;
		margin-right: 10px;
		border-radius: 3px;
		left: 0;
	}
	.humbBer > span:before{
		top: -10px;
		-webkit-transform: rotate(0);
		    -ms-transform: rotate(0);
		        transform: rotate(0);
	 	-webkit-transition: .2s;
	 	-o-transition: .2s;
	 	transition: .2s;
	}
	 .humbBer > span:after{
	 	top: 10px;
	 	-webkit-transform: rotate(0);
	 	    -ms-transform: rotate(0);
	 	        transform: rotate(0);
	 	-webkit-transition: .2s;
	 	-o-transition: .2s;
	 	transition: .2s;
	}

	#humbChk:checked ~ .humb .humbBer > span{
		background-color: rgba(255,255,255,0);
	 	-webkit-transition: background-color .2s;
	 	-o-transition: background-color .2s;
	 	transition: background-color .2s;
	}

	#humbChk:checked ~ .humb .humbBer > span:before{
		top: 0;
		-webkit-transform: rotate(-225deg);
		    -ms-transform: rotate(-225deg);
		        transform: rotate(-225deg);
	 	-webkit-transition: .2s;
	 	-o-transition: .2s;
	 	transition: .2s;
	}

	#humbChk:checked ~ .humb .humbBer > span:after{
		top: 0;
		-webkit-transform: rotate(225deg);
		    -ms-transform: rotate(225deg);
		        transform: rotate(225deg);
	 	-webkit-transition: .2s;
	 	-o-transition: .2s;
	 	transition: .2s;
	}

	.headerContRight{
	}

	.headeMenu{
		position: fixed;
		width: 100vw;
		height: auto;
		top: 60px;
		left: 0;
		z-index: 9999;
	}
	.headerRightWrap{
		display: none;
	}
	.headerContMenuLink{
		display: block;
		width:  100%;
	}
	.headerContMenuLinkIn, a.headerContMenuContact{
		display: block;
		width: 100%;
/* 		height: 50px; */
	}
	.headerContMenu{
		display: block;
		background-color:#FFF;
		-webkit-transform: translateX( 100vw);
		    -ms-transform: translateX( 100vw);
		        transform: translateX( 100vw);
		-webkit-transition:-webkit-transform .2s;
		transition:-webkit-transform .2s;
		-o-transition:transform .2s;
		transition:transform .2s;
		transition:transform .2s, -webkit-transform .2s;
	}
	.bottomLayer{
		display: block;
		position: fixed;
		top: 60px;
		left: 0;
		width: 100vw;
		height: calc( 100vh - 80px );
		background-color: rgba(0,0,0,0.2);
		-webkit-transform: translateX(100vw);
		    -ms-transform: translateX(100vw);
		        transform: translateX(100vw);
		z-index: 9996
	}
	#humbChk:checked ~ .headerContMenu, #humbChk:checked ~ .bottomLayer{
		-webkit-transform: translateX(0);
		    -ms-transform: translateX(0);
		        transform: translateX(0);
		-webkit-transition:-webkit-transform .2s;
		transition:-webkit-transform .2s;
		-o-transition:transform .2s;
		transition:transform .2s;
		transition:transform .2s, -webkit-transform .2s;
		z-index:9999;
	}
	.headeMenuIn{
		padding: 10px 30px;
		border-bottom: 1px solid #ecb250
	}
	.headerLeft{
		-ms-flex-preferred-size: 200px;
		    flex-basis: 200px;
	}

}