.container {
    width: 1200px;
    margin:0 auto;
}
@media(min-width:1848px) {

    /*1200 + 304*2 + 20*2 = 1544*/
    .header-nav-wrap { width: 100%; }
    .header-nav .logo { left: 80px; }
    .header-nav-wrap-inner { width: 1200px; position: absolute; left: 50%; margin-left: -600px; top: 0; height: 100%; padding-left: 80px; }
    .header-nav-ul > li > a { padding: 0 26px; }
}

.header { position: fixed; top: 0; left: 0; z-index: 22; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) }
.transp-header {/* background-color: transparent; */box-shadow: none; background:#4471e8; }
.transp-header #logo_pic{display:none;}
.transp-header #logo1_pic{display:block;}
.transp-header .header-nav-ul > li > a { color: #fff; }
.transp-header .header-nav-ul > li.active > a, .transp-header  .header-nav-ul > li > a:hover { color: #fff; }
.transp-header .header-nav-ul > li > a:after { background-color: #fff; }
.transp-header .header-nav-ul > li > a:hover:after { display: block;background-color: #fff; }
.transp-header .header-extra-ul > li > a, .transp-header  .header-extra-ul > li.active > a, .transp-header  .header-extra-ul > li > a:hover { color: #fff; }
#banner { width: 100%; height: 100vh; min-height: 500px; }
#banner .swiper-slide { text-align: center; font-size: 18px; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
#banner .swiper-button-next, #banner .swiper-button-prev { background: none; color: #fff; font-size: 44px; opacity: 0.4; transition: 0.3s all; }
#banner .swiper-button-prev { left: 30px; }
#banner .swiper-button-next { right: 30px; }
#banner .swiper-button-next:hover, #banner .swiper-button-prev:hover { opacity: 1; }
#banner .swiper-pagination-bullet { position: relative; width: 10px; height: 10px; border-radius: 10px; opacity: 0.6; background-color: #fff; }
#banner .swiper-pagination-bullet.swiper-pagination-bullet-active { opacity: 1; }
.section-title2 { position: relative; padding: 0 20px; }
.section-title2 > div { position: relative; z-index: 2; }
.section-title2:before { content: ''; display: block; position: absolute; bottom: -5%; left: 0; z-index: 1; width: 100%; background: #5387ea; height: 30%; }
.z1 > .container { position: relative; }
.z1 .section-title2 { position: absolute; top: 0; right: 0; }
.z1 .grid li:not(:last-child), .z2 .grid li:not(:last-child) { border-right: 1px dashed #d2d2d2; }
.z2 { }
.z2 > .container { position: relative; }
.z2 .p-bg { position: absolute; left: -174px; bottom: -254px; z-index: -1; }
.z2 .grid li{
    padding: 10px;
}
.z2 .grid li > a{
    padding: 10px 0 20px 0;
    background: transparent;
    border-radius: 0px 40px 40px 40px;
}
.z2 .grid li > a:hover{
    background: #3376f6;
}
.z2 .grid li > a:hover .text-222{
    color: #fff !important;
}
.z2 .grid li > a:hover .text-888{
    color: rgba(255,255,255, 0.6) !important;
}
.z3 .overlay-hover:not(:hover) .overlay-panel:not(.overlay-background-fixed) {
    opacity: 0.7;
}
.z4 .list > li > a{
    position: relative;
}
.z4 .list > li > a:before{
    content: '';
    display: block;
    width: 110%;
    height: 30px;
    background: rgba(51, 118, 246, 1);
    position: absolute;
    bottom: -10px;
    left: -20px;
    z-index: -1;
    -webkit-transition: all .3s;
       -moz-transition: all .3s;
        -ms-transition: all .3s;
         -o-transition: all .3s;
            transition: all .3s;
    opacity: 0;
    -webkit-transform: translate(0, 30px);
       -moz-transform: translate(0, 30px);
        -ms-transform: translate(0, 30px);
         -o-transform: translate(0, 30px);
            transform: translate(0, 30px);
}
.z4 .list > li > a:hover:before{
    opacity: 1;
    -webkit-transform: translate(0, 0);
       -moz-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
         -o-transform: translate(0, 0);
            transform: translate(0, 0);
}
.z4 .list > li > a:hover .border-bottom{
    border-color: #222 !important;
}
.z5 .section-body { }
.z5 .section-body .grid > li { height: 400px; -webkit-transition: all .25s; -moz-transition: all .25s; -ms-transition: all .25s; -o-transition: all .25s; transition: all .25s; }
.z5 .section-body .grid > li>figure { height: 100% }
.z5 .section-body .grid > li:hover { -webkit-transform: translate(0, -20px); -moz-transform: translate(0, -20px); -ms-transform: translate(0, -20px); -o-transform: translate(0, -20px); transform: translate(0, -20px); }

.z5 .section-body .grid > li:hover .overlay-background { background: rgba(51, 118, 246, 0.8); }
.z7 { background: #3971dc url(../images/z7-bg.jpg) 40px bottom no-repeat; }
.z7 input, .z7 textarea { width: 100%; border: 0; background-color: rgba(0, 0, 0, 0.1); color: #fff; padding: 10px 20px; font-size: 14px; }
.z7-1 .grid li { height: 48px; }
.z7-1 li input { height: 48px; }
.z7-2 { position: relative; }
.z7-2 textarea { max-width: 100%; min-width: 100%; min-height: 96px; padding-bottom: 50px; }
.z7-2 button { position: absolute; bottom: 14px; right: 14px; width: 78px; height: 30px; border-radius: 0; font-size: 14px; padding: 0; text-align: center; line-height: 30px; }
.z7 ::-webkit-input-placeholder {
color: #fff; }
.z7 :-moz-placeholder {
color: #fff; }
.z7 ::-moz-placeholder {
color: #fff; }
.z7 :-ms-input-placeholder {
color: #fff; }
.touch-slip{
    width: 100%;
    height: 300px;
    position: relative;
}

.touch-slip > ul{
    position: relative;
    width: 100%;
    height: 100%;
}
.touch-slip > ul > li{
    display: block;
    float: left;
    position: relative;
    width: 140px;
    height: 100%;
    background: #f3f3f3;
    background-position: center center;
    background-size: cover; 
}
.touch-slip > ul > li:not(:last-child){
    margin-right: 5px;
}
.touch-slip > ul > li.active{
    width: 330px;
}

.left-465 {
    position: relative;
    float: left;
    padding: 0;
    width: 465px;
}
.left-720 {
    position: relative;
    float: left;
    margin: 0 0 0 15px;
    padding: 0;
    width: 720px;
}
.side-img-box{ position:relative; width:465px; height:349px; background:#fff; overflow:hidden; }
    .side-img-box em{ position:absolute; display:none; margin:-30px auto auto -30px; top:50%; left:50%; width:60px; height:60px; font-style:normal; filter:alpha(Opacity=60); -moz-opacity:0.6;opacity:0.6; }
    .side-img-box em i{ color:#fff; font-size:60px; line-height:60px; }
    .side-img-box a:hover em{ display:block; }
    .side-img-box .abs-bg{ position:absolute; left:0; bottom:0; width:100%; height:50px; background:#000; filter:alpha(Opacity=30); -moz-opacity:0.3;opacity:0.3; background:linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0)); }
    .side-img-box .info{ position:absolute; left:0; bottom:0; right:0; width:100%; height:50px; line-height:20px; text-align:left; }
    .side-img-box .info h3{ padding:5px 15px 0; color:#fff; font-size:14px; font-weight:normal; }
    .side-img-box .info p{ padding:0 15px; color:#eee; font-size:12px; }
    .side-img-box img{ min-width:100%; min-height:100%; _width:100%; _height:100%; }

    .img-list{ margin:-15px 0 0 -15px; *display:inline-block; }
    .img-list:after{ content:"."; display:block; height:0; clear:both; visibility:hidden; }
    .img-list .nodata{ color:#999; line-height:80px; text-align:center; }
    .img-list li{ position:relative; float:left; margin:15px 0 0 15px; width:230px; height:auto; background:#fff; overflow:auto; _display:inline; }
    .img-list li .img-box{ display:block; position:relative; width:230px; height:173px; overflow:hidden; }
    .img-list li .img-box .abs-txt{ position:absolute; top:8px; left:0; display:inline-block; padding:0 6px; color:#fff; font-size:12px; line-height:24px; background:#c81623; text-align:center; border-radius:0 3px 3px 0; }
    .img-list li .img-box img{ width:100%; height:100%;}
    .img-list li .info{ display:block; text-align:left; margin:15px; }
    .img-list li .info h3{ display:block; line-height:20px; height:40px; font-size:12px; font-weight:normal; overflow:hidden; }
    .img-list li .info p{ display:block; line-height:28px; color:#999; font-size:12px; }
    .img-list li .info p.price{ padding-top:10px; line-height:18px; }
    .img-list li .info p.price b{ margin-right:2px; color:#f40; font-size:16px; }
    .img-list li .info p strong{ float:right; font-weight:normal; }
    .img-list li .info p span.price{ color:#fb2104; font-size:14px; font-weight:600; }
    .img-list li em{ position:absolute; display:none; margin:-30px auto auto -30px; top:50%; left:50%; width:60px; height:60px; font-style:normal; filter:alpha(Opacity=60); -moz-opacity:0.6;opacity:0.6; }
    .img-list li em i{ color:#fff; font-size:60px; line-height:60px; }
    .img-list li a:hover em{ display:block; }
    .img-list li .abs-bg{ position:absolute; left:0; bottom:0; width:100%; height:50px; background:#000; opacity:0.3; filter:alpha(opacity=30); -moz-opacity:0.3; background:linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0)); }
    .img-list li .remark{ position:absolute; left:0; bottom:0; right:0; width:100%; height:50px; line-height:20px; text-align:left; overflow:hidden; }
    .img-list li .remark h3{ padding:5px 15px 0; color:#fff; font-size:12px; font-weight:normal; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
    .img-list li .remark p{ padding:0 15px; color:#eee; font-size:12px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }

    
.cscetit1 {
    font-size: 58px;
    font-weight: bold;
    text-transform: uppercase;
}
.cscetit2 {
    font-size: 30px;
    font-weight: bold;
    text-transform: uppercase;
}

.banner_2{ display:none;}
.banner_1{ display:block;}
@media (max-width:800px) {
	.banner_1{ display:none;}
	.banner_2{ display:block;}
	.banner_2 img{ width:100%;}
}