/*Created by lk on 2020/06/05.*/

html, body{margin: 0; padding: 0; font-size: 12px; background: #fff; font-family: 'POPPINS-MEDIUM', arial}

html{scroll-behavior: smooth;font-size: 10px;}

ul{list-style: none}

ul, li ,ol{margin: 0; padding: 0}

h1,h2,h3,h4,h5,h6{margin: 0; font-weight: normal}

p{margin: 0;}

a{text-decoration: none; display: block; color: #333; outline: none}

img{border: 0; float: left}

div{box-sizing: border-box}

.clearfix:after{content: ""; display: block; height: 0; clear: both; visibility: hidden; font-size: 0}

ul:after {clear:both;content:'.';display:block;width: 0;height: 0;visibility:hidden;}

input::placeholder {
    color: #cccccc;
}
textarea::placeholder{
	color: #cccccc
}

.w1600{width: 83.6%; max-width: 1920px; margin: 0 auto; position: relative;}
.w1440{width: 75.5%; max-width: 1920px; margin: 0 auto; position: relative}
.left{float: left}
.right{float: right}

::-webkit-scrollbar
{
    width: 6px;
    background-color: rgba(255,255,255,.1);
}

::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background-color: rgba(0,0,0,.4);
}

@font-face {
    font-family: 'POPPINS-LIGHT';
    src: url('../font/Poppins-Light.ttf');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'POPPINS-REGULAR';
    src: url('../font/Poppins-Regular.ttf');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'POPPINS-MEDIUM';
    src: url('../font/Poppins-Medium.ttf');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'Poppins-SemiBold';
    src: url('../font/Poppins-SemiBold.ttf');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'CormorantSC-Bold';
    src: url('../font/CormorantSC-Bold-4.ttf');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'BlackMango-SemiBold';
    src: url('../font/BlackMango-SemiBold.ttf');
    font-weight: normal;
    font-style: normal;
}

/*----header----*/
.header{width: 100%; height: 160px; position: fixed; top: 0; left: 0; background: rgba(0,0,0,.0); z-index: 99; transition: all .4s; -webkit-transition: all .4s;
    /*display: flex;*/
    /*align-items: center;*/
    /*justify-content: space-between;*/
}
.header .logo{float: left; width: 120px; height: 82.5px; margin: 45px 0 0 50px; background: url("../image/logoi.png") no-repeat; background-size: cover; position: relative; z-index: 9; transition: all .4s; -webkit-transition: all .4s}

.nav{float: right; transition: all .4s; -webkit-transition: all .4s}
.nav .nav-bar{margin-top: 40px; margin-right: 100px; transition: all .4s; -webkit-transition: all .4s;}
.nav .nav-bar li{float: left; margin: 0 20px; position: relative}
.nav .nav-bar li a{font-size: 18px; color: #fff; line-height: 80px; font-weight: 100;}

.header .button{position: absolute; top: 0; right: 0; float: left; width: 60px; height: 60px; margin: 50px 20px 0 0; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; cursor: pointer; background: transparent; transition: all .4s; -webkit-transition: all .4s; z-index: 10; display: none}
.header button{outline: none}
.header .button span{width: 4px; height: 4px; position: absolute; display: block; background: #fff; border-radius: 50%; transition: all .5s; -webkit-transition: all .5s}

.header .button span:nth-child(1){top: 22px; left: 22px;}
.header .button span:nth-child(2){top: 22px; left: 32px;}
.header .button span:nth-child(3){top: 32px; left: 22px;}
.header .button span:nth-child(4){top: 32px; left: 32px;}
.header .button span:nth-child(5){width: 2px; height: 22px; top: 18px; left: 28px; transform: rotateZ(-45deg); border-radius: 0; opacity: 0;}
.header .button span:nth-child(6){width: 2px; height: 22px; top: 18px; left: 28px; transform: rotateZ(45deg); border-radius: 0; opacity: 0;}

.header .button:hover{transform: rotate(180deg);}
.header .button:hover:hover span:nth-child(1){transform: translate3d(5px, 5px, 0);}
.header .button:hover:hover span:nth-child(2){transform: translate3d(-5px, 5px, 0);}
.header .button:hover:hover span:nth-child(3){transform: translate3d(5px, -5px, 0);}
.header .button:hover:hover span:nth-child(4){transform: translate3d(-5px, -5px, 0);}

#button .span1{opacity: 0}
#button .span2{opacity: 0}
#button .span3{opacity: 0}
#button .span4{opacity: 0}
#button .span5{opacity: 1; background: #311303;}
#button .span6{opacity: 1; background: #311303;}

.button.onc{border: 1px solid rgba(21,53,27,.2);}

.header-lan{position: relative; float: right; line-height: 60px; margin: 50px 100px 0 0; position: relative; transition: all .4s; -webkit-transition: all .4s; z-index: 10;}
.header-lan:before{content: ""; display: block; width: 1px; height: 14px; background: rgba(255,255,255,.5); position: absolute; top: 0; left: 50%; margin-top: 22px;}
.header-lan a{display: inline-block; font-size: 18px; color: rgba(255,255,255,.6); margin: 0 14px; }
.header-lan a.on{color: #fff;}

.head-tel{float: right; margin: 64px 80px 0 0; line-height: 32px; padding-left: 40px; background: url(../image/icon01.png) no-repeat; transition: all .4s; -webkit-transition: all .4s;}
.head-tel span{display: block; font-size: 18px; color: #fff; font-family: 'Poppins-SemiBold'}

.booking{float: right; width: 170px; height: 50px; margin: 55px 50px 0 0; line-height: 50px; text-align: center; background: #579192; border-radius: 4px; transition: all .4s; -webkit-transition: all .4s;}
.booking span{font-size: 18px; color: #fff; font-family: 'POPPINS-MEDIUM'}

.mini{height: 100px; background: rgba(0,0,0,.9);}
.mini .logo{width: 116px; height: 80px; margin: 10px 0 0 50px; _background: url("../image/logo.png") no-repeat; background-size: cover;}
.mini .nav .nav-bar{margin-top: 10px; margin-right: 60px;}
.mini .header-lan{margin: 20px 60px 0 0;}
.mini .head-tel{margin: 34px 60px 0 0;}
.mini .booking{margin: 25px 50px 0 0;}



/*----footer----*/
.footer{position: relative; background: #311303; padding-top: 80px; padding-bottom: 80px; z-index: 9; overflow: hidden}
.footer .footer-con{width: 80%; margin: 0 auto; display: flex;}

.footer .footer-con .footer-left{width: 28%;}
.footer .footer-con .footer-left .footer-logo .img{float: none; display: block;}

.footer .footer-con .footer-right{width: 72%;}
.footer .footer-con .footer-right .footer-item h2{font-size: 20px; color: #827066; margin-bottom: 50px; font-family: 'POPPINS-MEDIUM';}
.footer .footer-con .footer-right .footer-item .item-left{width: 62%; font-size: 0;}
.footer .footer-con .footer-right .footer-item .item-left span{display: inline-block; width: 50%; font-size: 19px; color: #fff; line-height: 32px; margin-bottom: 16px; margin-right: 0;}
.footer .footer-con .footer-right .footer-item .item-right{width: 38%;}
.footer .footer-con .footer-right .footer-item .item-right a{font-size: 19px; color: #fff; line-height: 32px; margin-bottom: 16px; padding-left: 40px;}
.footer .footer-con .footer-right .footer-item .item-right a.x{background: url(../image/icon06.png) no-repeat;}
.footer .footer-con .footer-right .footer-item .item-right a.facebook{background: url(../image/icon07.png) no-repeat;}
.footer .footer-con .footer-right .footer-item .item-right a.ins{background: url(../image/icon08.png) no-repeat;}

.footer .footer-con .footer-right .footer-add{margin-top: 80px;}
.footer .footer-con .footer-right .footer-add span{display: inline-block; font-size: 18px; color: #fff; line-height: 36px; margin-right: 40px; padding-left: 36px; }
.footer .footer-con .footer-right .footer-add span.tel{background: url(../image/icon01.png) no-repeat;}
.footer .footer-con .footer-right .footer-add span.add{background: url(../image/icon09.png) no-repeat;}
.footer .footer-con .footer-right .footer-add span.mail{background: url(../image/icon10.png) no-repeat;}

.footer .footer-con .footer-end{margin-top: 30px; padding-top: 30px; color: rgba(255,255,255,.4); border-top: 1px solid rgba(255,255,255,.2); }
.footer .footer-con .footer-end span{display: inline-block; font-size: 14px; color: rgba(255,255,255,.5); margin-right: 4px;}


