/*pad*/

img {
    max-width: 100%;
}

.gh {
    height: 24px;
    width: 24px;
    position: absolute;
    transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -webkit-transition: all 0.5s cubic-bmezier(0.7, 0, 0.3, 1) 0s;
    -ms-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    cursor: pointer;
    z-index: 9999;
    display: none;
}

.selected .gh {
    transform: rotate(90deg);
}

.gh a {
    background-color: #000;
    display: block;
    margin: 0 auto;
    height: 2px;
    margin-top: -1px;
    position: relative;
    top: 50%;
    transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    width: 100%;
    border-radius: 2px;
}

.gh a:after {
    width: 100%;
}

.gh a:before {
    width: 100%;
}

.gh a:after,
.gh a:before {
    background-color: #000;
    content: "";
    display: block;
    height: 2px;
    left: 0;
    position: absolute;
    transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
}

.gh a:after {
    top: 7px;
}

.gh a:before {
    top: -7px;
}

.selected .gh a:after,
.selected .gh a:before {
    top: 0;background: #000;
}

.selected .gh a:before {
    transform: translateY(0px) rotate(-45deg);
    -webkit-transform: translateY(0px) rotate(-45deg);
    -ms-transform: translateY(0px) rotate(-45deg);
    width: 100%;
}

.selected .gh a:after {
    transform: translateY(0px) rotate(45deg);
    -webkit-transform: translateY(0px) rotate(45deg);
    -ms-transform: translateY(0px) rotate(45deg);
    width: 100%;
}

.selected .gh a {
    /* background-color: transparent !important; */
	background: #000;
}


@media only screen and (max-width:1480px) {
	html{
		font-size: 14.8px;
	}
}
@media only screen and (max-width:1280px) {
	html{
		font-size: 13px;
	}
	
}
@media only screen and (max-width:1180px) {
	html{
		font-size: 14px;
	}
	
}
@media only screen and (max-width:1040px) {
	h2{
		font-size: 20px !important;
	}
	h3{
		font-size: 18px !important;
	}
	h4{
		font-size: 16px !important;
	}
	p,
	h5,
	h6{
		font-size: 14px !important;
	}
	.wrap{
		width: auto;
		padding: 0 15px;
	}
	.header{
		height: 50px;padding: 0 15px;
	}
	.header .naver li{
		margin-left: 0;margin-bottom: 4px;
	}
	.header .naver li a{
		font-size: 16px;line-height: 36px;
	}
	.layout{
		padding-top: 50px;
	}
	.header .logo{
		max-width: 120px;
	}
	.header .wrap{
		display: block;
	}
	.header .naver ul{
		position: absolute;
		left: 0;right: 0;
		top:100%;z-index: 11;
		background: #fff;display: none;
	}
	.header .naver ul{
		padding: 0 15px;
	}
	.gh{
		display: block;
		right: 20px;top: 12px;
	}
	.banner{
		height: 40vw;
	}
	.abosinf{
		padding: 30px 0;
	}
	.abosinf .del{
		margin-top: 20px;
	}
	.footer .tps{
		padding: 30px 0;display: block;
	}
	.footer .tps .rts h3{
		margin-top: 20px;
		text-align: left;
	}
	.footer .tps .rts dd{
		margin:0 10px 0 0
	}

	.footer .copyright{
		padding: 10px 0;font-size: 12px;
	}
	.abosinf h6.on{
		font-size: 16px !important;
	}
	.about{
		padding: 30px 0;
	}
	.about .del{
		margin-top: 20px;
	}
	p{
		line-height: 1.8 !important;
	}
	.about .bds ul{
		display: block;
	}
	
	.about .bds li{
		margin-right: 0;margin-bottom: 20px;width: auto;height: 50vw;
	}
	.about .bds li h4{
		font-size: 14px !important;
	}
	.brand{
		padding: 30px 0;
	}
	.brand .bds li{
		padding: 20px 0;display: block;
	}
	.brand .bds li .pic{
		width: auto;height: auto;
	}
	.brand .bds li .text{
		width: auto;margin-top: 20px;
	}
	.brand .bds li:nth-child(2n){
		display: block;
	}
	.career .flax{
		display: block;
	}
	.career .flax .rts{
		width: auto;padding: 30px 0;
	}
	.career .flax .rts li h4{
		font-size: 15px !important;
	}
	.career .flax .rts li h4 span{
		max-width: 90%;display: inline-block;
	}
	.career .flax .lts{
		position: static;width: auto;margin-left: 0;padding: 20px;margin: 20px 0;
	}
	.career .flax .lts .del{
		margin-bottom: 30px;
	}
	.career .flax .lts h6 br{
		display: none !important;
	}
	.contact{
		padding: 30px 0 0;
	}
	.contact .hds .flax{
		display: block;margin-top: 20px;
	}
	.contact .hds .lts,
	.contact .hds .form{
		width: auto;padding: 20px;
	}
	.contact .hds .form dl{
		display: block;
	}
	.contact .hds .form dd{
		width: 100%;margin-bottom: 12px;
	}
	.contact .hds .form li{
		margin-bottom: 12px;
	}
	.contact .hds .form .lsele{
		height: 48px;font-size: 14px;
	}
	.contact .hds .form .t1{
		height: 48px;font-size: 14px;
	}
	.contact .hds .form li h6{
		font-size: 16px !important;
	}
	.contact .hds .form .dl1{
		display: block;
	}
	.contact .hds .form .dl1 dd{
		margin-right: 0;
	}
	.contact .hds .form .dl1 dd label{
		font-size: 15px;
	}
	.contact .hds .form .t2{
		height: 120px;
	}
	.contact .hds .form .cheok label{
		font-size: 14px;
	}
	.contact .hds .form .sub{
		margin: 20px auto 0;
	}
	.contact .hds .lts{
		border-radius: initial;
	}
	.contact .hds .lts dl{
		margin: 30px 0;
	}
	.contact .hds{
		margin-bottom: 60px;
	}
	.contact .bds{
		display: block;
	}
	.contact .bds .rts{
		width: auto;padding: 20px;
	}
	.contact .bds ul{
		margin-left: 0;
	}
	.contact .bds .text dd{
		font-size: 13px;line-height: 1.6;
	}
	.contact .bds .map{
		width: auto;height: 60vw;
	}
	.news{
		padding: 30px 0;
	}
	.uitnews ul{
		display: block;
	}
	.uitnews li{
		width: auto;margin-bottom: 20px;margin-right: 0;
	}
	.uitnews li h3{
		height: auto;
	}
	.pages dd a{
		font-size: 12px;
	}
	.newdel .hds h1{
		font-size: 24px;line-height: 1.4;
	}
	.newdel .hds h6 span{
		font-size: 14px;
	}
	.outlets{
		padding: 30px 0;
	}
	.uitnews li .pic{
		height: auto;
	}
	.outlets .bds ul{
		display: block;
	}
	.outlets .bds li{
		width: auto;margin-right: 0;margin-bottom: 20px;height: auto;
	}
	.outlets .bds li::before{
		    background: url(../images/qms29.png) no-repeat center bottom;
	}
	.outlets .bds li img {
		filter:grayscale(0);
	}
	.outletdel .hds{
		padding: 30px 0;
	}
	.outletdel .hds .wrap{
		display: block;
	}
	.outletdel .hds .pic{
		width: auto;height: auto;
	}
	.outletdel .hds .text{
		width: auto;margin-top: 20px;
	}
	.outletdel .bds ul{
		display: block;
	}
	.outletdel .bds li{
		width: auto;margin-right: 0;margin-bottom: 20px;
	}
	.outletdel .bds li .pic{
		height: auto;
	}
	
	.hbanner{
		height: 60vw;
	}
	.hpage1{
		padding: 30px 0;
	}
	.hpage1 .wrap{
		display: block;
	}
	.hpage1 .text{
		width: auto;
	}
	.hpage1 .pic{
		width: auto;margin-right: 0;margin-top: 20px;
	}
	.hpage1 .text .del{
		margin: 20px 0;
	}
	.hpage2{
		height: 40rem; background-repeat: initial !important; 
  background-position: initial !important; 
  background-attachment: initial !important;
	}
	.hpage3::before{
		display: none;
	}
	.hpage3{
		padding: 30px 0;
	}
	.hpage3 .txt{
		width: auto;
	}
	.hpage3 .img{
		width: auto;margin-top: 20px;
	}
	.hpage3 .wrap{
		display: block;
	}
	.hpage3 .txt h3{
		font-size: 20px !important;
	}
	.hpage4{
		padding: 20px 0;
	}
	.hpage4 li{
		height: auto;margin-right: 0;width: auto;width: calc((100% - 10px)/2);
	}
	.hpage2 .txt{
		margin: 0 15px;top: 5%;
	}
	.header .naver li .nli{
		position: static;width: auto;box-shadow: initial;
	}
	.header .naver li .nli dd a{
		font-size: 15px;line-height: 1.6;text-align: left;
	}
	.header .naver li .nli dd::before{
		display: none;
	}
	.header .naver li .nli dd{
		margin-bottom: 10px;
	}
	.header .naver li .nli dl{
		margin: 0 15px;
	}
	.header .naver h3{
		position: relative;
	}
	.header .naver h3 i{
		position: absolute;
		right: 0;
		top: 50%;z-index: 1;background: url(../images/qms15.png) no-repeat center;
		width: 20px;height: 20px;
	}
	.header .naver h3 i.on{
		transform:rotate(180deg);
		-ms-transform:rotate(180deg);  /* IE 9 */
		-moz-transform:rotate(180deg);     /* Firefox */
		-webkit-transform:rotate(180deg); /* Safari 和 Chrome */
		-o-transform:rotate(180deg);
	}
	.header .laug{
	    margin-right:50px;z-index: 12;
	}
	
	
	
}