* {outline: 1px solid #f00--;}
body {min-width: 1900px;}

header {background:rgba(0,0,0,0.9);color:#fff;padding:30px 50px;position: fixed;top:0;left:0;width:100%;z-index:8;min-width: 1900px}
header:after {content:"";display:block;clear:both;}
header h1 {float:left;width:20%;}
header nav {float:left;width:60%;text-align:center;}
header nav a {padding:0 30px;line-height:40px;}
header i {float:right;font-size:30px;}

.section {color:#333}

.main {background:url(../img/main.png) no-repeat center center/cover;color:#fff;text-align:center;position: relative;}
.main .main-slogan {opacity:0;padding-top:200px;}
.main.on .main-slogan {opacity:1;padding-top:0;transition: 1s;}
.main h2 {font-size:70px;font-weight:700;line-height:1.5;}
.main span {font-size:60px;font-weight:100;}
.main p {font-size:14px;font-weight:300;}


.scroll {width:30px;height:50px;border:2px solid #fff;position:absolute;bottom:80px;left:50%;transform:translateX(-50%);border-radius:10px;}
.scroll span {display:block;width:3px;height:5px;background:#fff;position:absolute;top:10px;left:50%;transform:translateX(-50%);animation:wheel 0.5s infinite;}
.scroll:before {content:"";display:block;width:1px;height:50px;background:#fff;position:absolute;top:-60px;left:50%;transform:translateX(-50%);}
.scroll:after {content:"";display:block;width:1px;height:50px;background:#fff;position:absolute;top:60px;left:50%;transform:translateX(-50%);}

@keyframes wheel {
    0% {top:10px;}
    100% {top:20px;}
}



.slider {text-align:center;}
.slider h2 {font-size:38px;font-weight:700;text-align:center;margin:20px 0;}
.slider>p {font-size:16px;font-weight:300;text-align:center;color:#999;}

.slider-wrap {margin:0 auto;width:1500px;height:460px;background:#f2f2f2;}
.slider-num {border-top:1px solid #f2f2f2;width:1500px;margin:50px auto 0 auto;}
.slider-num:after {content:"";display:block;clear:both;}
.slider-num li {float:left;width:25%;text-align:center;line-height:60px;}
.slider-num li.on {background: #f2f2f2;}

.slider-wrap>div {overflow: hidden;}
.slider-wrap img {width:100%;transition: 0.5s;}
.slider-wrap figure {position: relative;cursor: pointer;}
.slider-wrap .item-text {position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;z-index: 555;}
.slider-wrap .item-text h3 {font-size:30px;margin-bottom: 15px;}
.slider-wrap .item-text p {font-weight: 100;line-height: 1.3;}
.slider-wrap .left {float:left;width:750px;height:460px;}
.slider-wrap .right {float:left;width:750px;height:230px;}
.slider-wrap .bottom {float:left;width:750px;height:230px;}



.slider-wrap figure:after {content:"";display:block;width:100%;height:100%;position:absolute;top:0;left:0;background:rgba(0,0,0,0);transition:0.5s;}
.slider-wrap figure:hover:after {background:rgba(0,0,0,0.6)}

.slider-wrap figure:hover img {transform:scale(1.3)}

.info01 {background:#f4f1ec url(../img/main_ourbg_icn.png) no-repeat right bottom;}
.info01 .info-wrap {width:1500px;margin:0 auto;}
.info01 .info-wrap:after {content:"";display:block;clear:both;}
.info01 figure {float:left;width:50%;opacity: 0;transform:translateY(100px);}
.info01 .info-text {float:left;width:50%;padding:100px;opacity: 0;transform:translateY(100px);}
.info01.on figure {float:left;width:50%;opacity: 1;transform:translateY(0);transition: 1s;}
.info01.on .info-text {float:left;width:50%;padding:100px;transform:translateY(0);opacity: 1;transition: 1s 1s;}
.info01 .info-text h3 {font-size:20px;font-weight:300;letter-spacing:-0.05em;margin-bottom:50px;}
.info01 .info-text span {display: block;font-size:50px;font-weight:500;margin-bottom:50px;}
.info01 .info-text p {font-size:18px;font-weight:100;line-height:1.6;letter-spacing:-0.05em;margin-bottom:50px;}
.info01 .info-text a {display: block;width:150px;background:#333;color:#fff;font-size:12px;text-align: center;line-height:40px;letter-spacing:0.2em;}


.info01 img {width:100%;}



.info02 {background:#f4f1ec url(../img/main_pebg.png) no-repeat center center/cover;}
.info02 .info-wrap {width:1500px;margin:0 auto;}
.info02 .info-wrap:after {content:"";display:block;clear:both;}
.info02 figure {float:left;width:50%;opacity: 0;transform:translateY(100px);}
.info02 .info-text {float:left;width:50%;padding:100px;opacity: 0;transform:translateY(100px);}
.info02.on figure {float:left;width:50%;opacity: 1;transform:translateY(0);transition: 1s;}
.info02.on .info-text {float:left;width:50%;padding:100px;transform:translateY(0);opacity: 1;transition: 1s 1s;}
.info02 .info-text h3 {font-size:20px;font-weight:300;letter-spacing:-0.05em;margin-bottom:50px;}
.info02 .info-text span {display: block;font-size:50px;font-weight:500;margin-bottom:50px;}
.info02 .info-text p {font-size:18px;font-weight:100;line-height:1.6;letter-spacing:-0.05em;margin-bottom:50px;}
.info02 .info-text a {display: block;width:150px;background:#333;color:#fff;font-size:12px;text-align: center;line-height:40px;letter-spacing:0.2em;}


.info02 img {width:100%;}




.info03 {background:#e5e6e1;}
.info03 .info-wrap {width:1500px;margin: 0 auto;}
.info03 .info-wrap {content:"";display:block;clear: both;}
.info03 h2 {float: left;width:20%;font-size:50px;font-weight:500;position: relative;}
.info03 h2 span {display: block;font-size:50px;font-weight:500;margin:10px 0 10px 0;}
.info03 h2 i {position:absolute;top:0;right:30px;}
.info03 figure {float: left;width:20%;height:300px;overflow: hidden;position: relative;}

.info03 figure img {width:100%;transition:1s;}
.info03 figure:hover img {transform:scale(1.3);}
.info03 figure a:after {content:"\ebe9";font-family: xeicon!important;display:block;width:300px;height:300px;background:rgba(0,0,0,0);position:absolute;top:300px;left:0;transition:0.5s;color:transparent;font-size:40px;text-align: center;line-height:300px;}
.info03 figure:hover a:after {background: rgba(0,0,0,0.7);color:#fff;top:0;}


.footer {text-align:center;}
.footer .customer {line-height:80px;border-bottom:1px solid #f2f2f2;}
.footer .customer a {padding:0 30px;}
.footer .custome span {vertical-align: middle;padding:0 10px;}
.footer .prm {padding:20px 0;font-size:0;}
.footer .prm a {padding:0 30px;font-size:16px;position: relative;}
.footer .prm a:after {content:"";display: block;width: 1px;height: 14px;background:#ddd;position: absolute;top:50%;right:0;transform: translateY(-50%);}
.footer .prm a:last-child:after {display:none;}
.footer address {padding-bottom:50px;font-size: 14px;font-weight: 300;color:#999;}
.footer address ul {padding-bottom:10px;font-size: 0;}
.footer address li {display:inline-block;padding:0 15px;font-size: 14px;position: relative;}
.footer address li:after {content:"";display: block;width: 1px;height: 12px;background:#ddd;position: absolute;top:50%;right:0;transform: translateY(-50%);}
.footer .prm li:last-child:after {display:none;}


.menu-right {position:fixed;top:50%;transform:translateY(-50%);right:50px;width:30px;background:rgba(0,0,0,0.7);border-radius:15px;padding:30px 10px;text-align: center;}
.menu-right li {display:inline-block;width:12px;height:12px;border: 1px solid #fff;border-radius:50%;margin:10px 0;}
.menu-right li a {text-indent:-9999px;display:block;width:100%;height:100%;position: relative;}
.menu-right li a:after {content:"";display:block;width: 5px;height: 5px;background:#333;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%;}
.menu-right li.on a:after {background:#fff;}



.popup {opacity:0;position:fixed;top:0;left:0;width:100%;height:100vh;background:rgba(0,0,0,0.9);color:#fff;z-index:-1;}
.popup.on {opacity: 1;transition:1s;z-index:9;}
.popup .container {width:1500px;margin:100px auto 0 auto;text-align:center;transition:1s 1s;opacity: 0;}
.popup.on .container {margin:250px auto 0 auto;opacity: 1;transition:1s;animation:rubberBand 1s 1s;}
.popup .container:after {content:"";display:block;clear: both;}
.popup .container dl {float:left;width:16.666666%;}
.popup .container dl dt {font-size:40px;font-weight:700;margin-bottom:50px;}
.popup .container dl dt:hover {text-decoration:underline;}
.popup .container dl dd {font-size:22px;font-weight:300;margin-bottom:10px;}
.popup .pop-top {position: absolute;top:0;left:0;width:100%;padding:30px 50px;}
.popup .pop-top i {float:right;font-size:30px;}