@charset "UTF-8";

#loading{width:100%;height:100%;position:fixed;top:0;left:0;background:#000;z-index:20;font-size:18px;color:#cfd1cc;z-index:101}#loading .box{width:100%;height:1px;background:#414141;margin:0 auto;position:relative;top:50%;transform:translateY(-50%);left:0}#loading .box span{height:1px;background:#c4c4c4;position:relative;top:0;left:0;display:block}#loading .box p{font-size:16px;line-height:30px;color:silver;text-align:center}

a:link,a:partive,a:visited,a:hover { -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent;}
*{ -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-tap-highlight-color: transparent;scroll-behavior: smooth;outline: none;}
body {background: #fff;padding-top: 40px;}
.wrap{width: 100%;min-width: 1200px;  position: relative;overflow: hidden;z-index: 2;}

.btn-top{width: 152px;height:86px;background: url(images/btn-top.png) no-repeat 0 0;top:50%;margin-top: -90px;right:-160px;z-index: 999;transition: all .3s;}
.btn-jump-evt{width: 181px;height:86px;background: url(images/btn-evt.png) no-repeat 0 0;top:50%;right:-190px;z-index: 999;transition: all .3s}
.btn-top.active{right: 23px;}
.btn-jump-evt.active{right: 10px;}
.btn-top:hover,
.btn-jump-evt:hover{filter: brightness(1.2);}
.section{ position: relative; z-index: 3; width: 100%; margin: 0 auto; box-sizing: border-box;
background: url(images/head.jpg) no-repeat 50% 0;}
.section .logo { position: absolute; width: 236px; height: 86px; top: 10px; left: 50%; margin-left: -585px; text-indent: -999em; background: url(images/logo.png) no-repeat 0 0; z-index: 3;}

.section video {width: 1920px;height: 1202px;display: block;position: relative;top:0;  left: 50%;margin-left: -960px;}
.section .btn-home {width: 158px;height: 108px;background: url(images/btn-home.png) no-repeat 0 0;top:35px;left:50%;margin-left:410px;z-index:200}
.section .btn-home:hover {filter: brightness(1.2);}
.section .slogan {z-index:20;width:862px;height: 535px;top:473px;left:50%;margin-left:-837px;background: url(images/slogan.png) no-repeat 0 0;} 
.section .slogan .btn-play {width:117px;height:121px;background: url(images/btn-play.png) no-repeat 0 0;top: 233px;left: 657px;}
.section .slogan .btn-play:hover{filter: drop-shadow(0 0 5px #f32020)}            

.section .cover {width: 100%;height: 350px;background: url(images/cover.png) repeat-y 50% 0;top:968px;left:0;}
.section .navs {width: 1200px;height: 71px;top: 1100px;left: 50%;margin-left: -600px;z-index: 10;display: flex;justify-content: space-between;}
.section .navs a {width:311px;height: 71px;display: block;background:url(images/navs.png) no-repeat 0 0;}
.section .navs .btn-nav-1 {background-position: 0 0;}
.section .navs .btn-nav-2 {background-position: -311px 0;}
.section .navs .btn-nav-3 {background-position: -622px 0;}
.section .navs a:hover,
.section .navs a.on {background-position-y: -71px;}       

.section .con{display: none;}
.section .con.active{display: block;}
.section .con-1 {background: url(images/p1.jpg?v=55) no-repeat 50% 0;height:7476px;width:100%;}

.section .con-1 .feature {
    width: 1212px;
    height: 700px;
    left: 50%;
    top: 4120px;
    margin-left: -606px;
    z-index: 3;
}

.section .con-1 .feature .adPic {
    width: 1212px;
    height: 700px;
    position: relative;
    z-index: 1
}
.section .con-1 .feature .adPic li,
.section .con-1 .feature .adPic li img {
    width: 1212px;
    height: 700px;
    display: block;
}

.section .con-1 .feature .prevBtn,
.section .con-1 .feature .nextBtn {
    display: block;
    width: 55px;
    height: 85px;
    position: absolute;
    top: 307px;
    z-index: 2;
    text-indent: -999em
}
.section .con-1 .feature .prevBtn {
    background: url(images/arrow-left.png) no-repeat 0 0;
    left: -90px;
}

.section .con-1 .feature .nextBtn {
    background: url(images/arrow-right.png) no-repeat 0 0;
    right: -90px;
}

.section .con-1 .feature .prevBtn:hover,
.section .con-1 .feature .nextBtn:hover{
    filter: brightness(1.2);
}
.section .con-1 .btn-evt-1 {top:6215px;left:50%;margin-left:-211px;width: 422px;height:75px;background: url(images/p1-btn1.png?v=3) no-repeat 0 0;}
.section .con-1 .btn-evt-2 {top:7230px;left:50%;margin-left:-211px;width: 422px;height:75px;background: url(images/p1-btn2.png) no-repeat 0 0;}
.section .con-1 .btn-evt-3 {top:8400px;left:50%;margin-left:-211px;width: 422px;height:75px;background: url(images/p1-btn3.png) no-repeat 0 0;}
.section .con-1 .btn-evt-1:hover,
.section .con-1 .btn-evt-2:hover,
.section .con-1 .btn-evt-3:hover {filter:drop-shadow(2px 2px 5px #fff95e) brightness(1.1);}


.section .con-2 {background: url(images/p2.jpg?v=3) no-repeat 50% 0;height:5462px;width:100%}
.section .con-2 .btn-pop {width:370px;height:230px;top:5222px;left:50%;margin-left:-480px;}
.section .con-2 .feature {
    width: 980px;
    height: 260px;
    left: 50%;
    top: 6090px;
    margin-left: -495px;
    z-index: 3;
}

.section .con-2 .feature .adPic {
    width: 980px;
    height: 260px;
    position: relative;
    z-index: 1
}
.section .con-2 .feature .adPic li{display: none;}
.section .con-2 .feature .adPic li,
.section .con-2 .feature .adPic li img {
    width: 980px;
    height: 260px;
    display: block;
}

.section .con-2 .feature .prevBtn,
.section .con-2 .feature .nextBtn {
    display: block;
    width: 55px;
    height: 85px;
    position: absolute;
    top: 55px;
    z-index: 2;
    text-indent: -999em
}
.section .con-2 .feature .prevBtn {
    background: url(images/arrow-left.png) no-repeat 0 0;
    left: -63px;
}

.section .con-2 .feature .nextBtn {
    background: url(images/arrow-right.png) no-repeat 0 0;
    right: -72px;
}

.section .con-2 .feature .prevBtn:hover,
.section .con-2 .feature .nextBtn:hover{
    filter: brightness(1.2);
}

.section .con-3 {background: url(images/p3.jpg?v=3) no-repeat 50% 0;height: 6459px;width:100%;padding-top: 3555px;box-sizing: border-box;}


.section .con-3 .sub-navs {width:1140px;height: 135px;display: flex;justify-content: space-between;margin:0 auto;}
.section .con-3 .sub-navs a {width:372px;height:121px;background: url(images/p3-navs.png) no-repeat 0 0;}
.section .con-3 .sub-navs .item-2 {background-position: -372px 0;}
.section .con-3 .sub-navs .item-3 {background-position: -744px 0;}
.section .con-3 .sub-navs a.on,
.section .con-3 .sub-navs a:hover {background-position-y: -121px;}
.section .con-3 .table {display: none;position: relative;}
.section .con-3 .table.active {display: block;}
.section .con-3 .table-1 {width:100%;height: 1930px;background: url(images/p3-1.png?v=4) no-repeat 50% 0;position: relative;}
.section .con-3 .table-2 {width:100%;height:1803px;background: url(images/p3-2.png?v=4) no-repeat 50% -3px;position: relative;}
.section .con-3 .table-3 {width:100%;height:2179px;background: url(images/p3-3.png?v=5) no-repeat 50% 8px;position: relative;}
.section .con-3 .table .btn-back {width:372px;height:121px;background: url(images/p3-btn.png) no-repeat 0 0;position: absolute;bottom:-140px;left:50%;margin-left:-375px;}
.section .con-3 .table .btn-detail {width:372px;height:121px;background: url(images/p3-btn.png) no-repeat -372px 0;position: absolute;bottom:-140px;left:50%;margin-left:30px;}
.section .con-3 .table .btn-back:hover,
.section .con-3 .table .btn-detail:hover {background-position-y: -121px;}
.section .con-3 .table .tips {width:1133px;height:196px;background: url(images/p3-tips.png?v=3) no-repeat 0 0;position: absolute;bottom: -380px;left:50%;margin-left:-560px;}


.section .con-3 .table .btn-pop-1 {width: 265px;height: 145px;top: 104px;left:50%;margin-left: 297px;}
.section .con-3 .table .btn-pop-2 {width:270px;height: 150px;top: 685px;left:50%;margin-left: 178px;}
.section .con-3 .table .btn-pop-3 {width:270px;height: 150px;top: 1592px;left:50%;margin-left: 176px;}
.section .con-3 .table .btn-pop-4 {width: 268px;height: 150px;top: 1743px;left:50%;margin-left: -275px;}
.section .con-3 .table .btn-pop-5 {width: 268px;height: 150px;top: 1743px;left:50%;margin-left: 24px;}

.section .con-3 .table .btn-pop-6 {width: 260px;height: 150px;top: 100px;left:50%;margin-left: 18px;}
.section .con-3 .table .btn-pop-7 {width: 268px;height: 150px;top: 393px;left:50%;margin-left: -429px;}
.section .con-3 .table .btn-pop-8 {width: 265px;height:150px;top: 850px;left:50%;margin-left: -61px;}
.section .con-3 .table .btn-pop-9 {width: 265px;height:150px;top: 850px;left:50%;margin-left: 240px;}
.section .con-3 .table .btn-pop-19 {width: 270px;height: 150px;top: 266px;left:50%;margin-left: -280px;}
.section .con-3 .table .btn-pop-20 {width: 270px;height: 150px;top: 266px;left: 50%;margin-left: 26px;}
.section .con-3 .table .btn-pop-10 {width: 260px;height: 150px;top: 1142px;left:50%;margin-left: 183px;}
.section .con-3 .table .btn-pop-11 {width: 260px;height: 150px;top: 1305px;left:50%;margin-left: -426px;}
.section .con-3 .table .btn-pop-12 {width: 260px;height: 150px;top: 1305px;left:50%;margin-left: -119px;}
.section .con-3 .table .btn-pop-13 {width: 286px;height: 150px;top: 1305px;left:50%;margin-left: 180px;}
.section .con-3 .table .btn-pop-14 {width: 265px;height: 145px;top: 1613px;left:50%;margin-left: -282px;}
.section .con-3 .table .btn-pop-15 {width: 265px;height: 145px;top: 1613px;left:50%;margin-left: 27px;}

.section .con-3 .table .btn-pop-16 {width: 265px;height: 145px;top: 110px;left:50%;margin-left: -428px;}
.section .con-3 .table .btn-pop-17 {width: 265px;height: 145px;top: 110px;left:50%;margin-left: -123px;}
.section .con-3 .table .btn-pop-18 {width: 265px;height: 145px;top: 110px;left:50%;margin-left: 182px;}
.section .con-3 .table .btn-pop-21 {width: 265px;height: 145px;top: 575px;left:50%;margin-left: -427px;}
.section .con-3 .table .btn-pop-22 {width: 265px;height: 145px;top: 575px;left: 50%;margin-left: -123px;}
.section .con-3 .table .btn-pop-23 {width: 265px;height: 145px;top: 575px;left: 50%;margin-left: 182px;}
.section .con-3 .table .btn-pop-24 {width: 280px;height: 145px;top: 730px;left: 50%;margin-left: -427px;}
.section .con-3 .table .btn-pop-25 {width: 265px;height: 160px;top: 1032px;left: 50%;margin-left: -535px;}
.section .con-3 .table .btn-pop-26 {width: 265px;height: 160px;top: 1032px;left: 50%;margin-left: -259px;}
.section .con-3 .table .btn-pop-27 {width: 265px;height: 160px;top: 1032px;left: 50%;margin-left: 15px;}
.section .con-3 .table .btn-pop-28 {width: 265px;height: 160px;top: 1032px;left: 50%;margin-left: 291px;}




.pop-video {width:850px;height:480px;display: none}
.pop-video video {width:100%;height:100%;}
.pop-video .btn_close{width: 32px;height:32px;background: url('https://img1.tiancitycdn.com/project1/csol/event/2021/07/cs210721sale/images/close.png') no-repeat 0 0;right:-32px;top:0;position: absolute}

.pop2 {width:650px;height:210px;background: url(images/pop-p2.png) no-repeat 0 0;display: none;}
.pop2 .btn_close {width:50px;height:50px;top:0;right:11px;}

.pop3 {width:652px;height:430px;background: url(images/pop-p3.png) no-repeat 0 0;padding: 87px 60px 0 27px;box-sizing: border-box;display: none;}
.pop3 .btn_close {width:50px;height:50px;top:0;right:11px;}
.pop3 .con-box {width: 565px;height: 285px;}
.pop3 .title {color:#fff;font-size:15px;line-height: 30px;height: 30px;text-align: left;top: 20px;}
.pop3 .line-item {width: 565px;}
.pop3 .line-item p {float:left;color: #e3e3e3;font-size:15px;height:100%;display: flex;justify-content: center;line-height: 30px;align-items: center;text-align: center;}
.pop3 .line-item .name {width: 92px;writing-mode: vertical-rl;
    text-orientation: upright;}
.pop3 .line-item .use {width: 97px;writing-mode: vertical-rl;
    text-orientation: upright;}
.pop3 .line-item .detail{width: 365px;line-height:26px;overflow: auto;text-align: center;padding-right: 10px;padding-right: 10px;}

.pop3 .line-item.fixed,
.pop3 .line-item.fixed .detail {height: 285px;}

.pop3 .mutil-item {overflow: auto;}
.pop3 .mutil-item .line-item {display: flex;align-items: center;width:560px;border-bottom: 1px solid #321011;}
.pop3 .mutil-item .line-item p{line-height: 20px;padding:5px 0}
.pop3 .mutil-item .line-item .use,
.pop3 .mutil-item .line-item .name {writing-mode:lr}
.pop3 .mutil-item .line-item:last-child{border-bottom: 0px;}
.pop3 ::-webkit-scrollbar
{
    width: 5px;
    height: 5px;
}
 
.pop3  ::-webkit-scrollbar-track
{
    /*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);*/
    /*border-radius: 10px;*/
    background-color: #fff;
}
 
.pop3 ::-webkit-scrollbar-thumb
{
    border-radius: 3px;
    /*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);*/
    background-color: #d89956;
}

.TC_pop_masker {
    background: rgba(0, 0, 0, .8)!important;}