@charset "utf-8";
/* CSS Document */
*,*:before,*:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; outline: none;font-family:myFont !important; }
body{ margin:0px; padding:0px; font-size:12px;color:#898989;line-height:1;font-family:myFont !important; background: #000a1f; }
ul,li,dl,dd,dt,p,h1,h2,h3,h4,h5,h6,ol,form,input{ margin:0px; padding:0px;}
input,textarea { border: none; outline: none; background: none; }
ul{ list-style:none}
img{border:0px; padding:0px; display: block;}
a{ text-decoration:none; cursor: pointer;}

h2,h3,h4,h5,h6,b,strong { font-weight: normal; }
em,i { font-style: normal;}
/* 引用字体 */
@font-face {
    font-family: myFont;
    src: url("../font/PingFang Medium.ttf");
}

.clear{ zoom: 1; }
.clear:after { content: ''; display: block; clear: both; }
.fl { float:left}
.fr { float:right}
.hidden{display:none; background: url() no-repeat center;}

.cont{ width: 1376px; max-width: 94%; margin:0 auto; position: relative; }
.flex{ display: flex; }
.flex-center{ display: flex; align-items: center; justify-content: center; }
.flex-between{ display: flex; align-items: center; justify-content: space-between; }

@media screen and (max-width: 767.9px){
	.cont{ width: calc(100vw - 32px);  }
	.aboutpart .one{ width: calc(100vw - 32px) !important; height: calc(100vw - 32px) !important; padding-bottom: 0 !important; }
}


@keyframes sliderPagination {
    100% {transform: scaleX(1); opacity: 1;}
}

.bodybg{ background:#000a1f url(../img/pagebg.png) no-repeat left bottom / 100% auto; }

/*首页*/
.banner{width: 100%; overflow: hidden;position: relative;}
.banner video{ display: block; width: 100%; height: 100vh; object-fit:cover; }
.banner video.vd-mob{ display: none; }
.banner .item{ position: relative; }
.banner .uptxt{ position: absolute; left:0; top: 0; width: 100%; height: 100%; padding-top: 10%; text-align: center; }
.banner .uptxt .name{ font-size: 60px; color: #fff; line-height: 88px; letter-spacing:4px; }
.banner .uptxt .desc{ font-size: 26px; color: #fff; line-height: 38px; margin:24px 0 42px;letter-spacing: 25px; }
.banner .uptxt .desc.nospace{ letter-spacing: 0; margin-top: 14px; display: block; }
.banner .uptxt .deal{ font-size: 26px; color: #fff; line-height: 40px; display: flex; align-items: center; justify-content: center; }
.banner .uptxt .deal a{ margin:0 14px;width: 108px; height: 40px; background:url(../img/pic2.png) no-repeat center center / 100% 100% ; transition: all 0.4s; font-size: 16px; color: #fff; display: flex; align-items: center; justify-content: center; }
.banner .uptxt .deal a.foucus{ background-image: url(../img/pic3.png); color: #000; }
.banner .uptxt .deal a:hover{ background-image: url(../img/pic3.png); color: #000; }
.banner .swiper-container{width: 100% !important; overflow: hidden;}
.banner .swiper-pagination{ bottom: 20px !important; height: 2px !important; position: absolute; z-index: 3;}
.banner .swiper-pagination-bullet { opacity: 1; position: relative; width: 80px; border: none; height: 2px; border-radius: 0; margin: 0 12px; background:#535760; transition: background-color .3s ease; bottom: 30px;}
.banner .swiper-pagination-bullet-active{ background: #535760; }
.banner .swiper-pagination-bullet::before {  display: block; content: ""; position: absolute;  top: 0px;  left: 0; width: 100%; height: 2px; background:#fff; transform: scaleX(0); transform-origin: 0 0;}
.banner .swiper-pagination-bullet.swiper-pagination-bullet-active::before {animation: sliderPagination 6s linear forwards}
.banner .swiper-pagination-bullet:hover { background-color: #fff;}
.banner .bannerpic{ display: block; width: 100%; object-fit:cover; }
.banner .bannerpic img{ display: block; width: 100%; height: 100vh; object-fit:cover; }

.head{ z-index: 3; position: fixed; left: 0; top: 0; z-index: 999; width: 100%; font-size: 16px;  }
.head .hmid{ line-height: 56px; width: 100%; transition: all 0.4s; padding: 0 100px; position: relative; border-bottom: 1px solid transparent; }

.head .logoa{ display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 3; height: 36px; cursor: pointer; }
.head .logoa img{ height:36px; }
.head .navbar{ width: calc(100% - 108px); font-size: 16px; color: #fff; height: 56px; }
.head .navbar .navleft{ display: flex; align-items: center;}
.head .navbar .navright{ display: flex; align-items: center; justify-content: flex-end;}
.head .nava{ display: block; float: left; line-height: 56px; font-size: inherit; color: inherit; position: relative; cursor: pointer; margin-right: 46px; position: relative; height: 38px; line-height: 38px; width: 76px; text-align: center; }
.head .nava i{ position: relative; z-index: 3; }
/*.head .nava:after{content: ""; position: absolute; left: 50%; bottom: 9px; width:0%; height: 2px; background-color: #fff; border-radius: 3px; transform:translateX(-50%); z-index: 1; transition: all 0.5s;   }*/
.head .nava:before{content: ""; position: absolute; width: 100%; height: 100%;background:url(../img/pic75.png) no-repeat center center / cover ; left: 50%; transform: translate(-50%,0); width: 0; transition: all 0.4s linear; z-index: 1; }
.head .nava:hover{ font-weight: bold; }
.head .nava:hover:before{ width: 100%;}
/*.head .nava:hover:after{ width: 100%; }*/
.head .prebook{width: 108px; height: 36px; display: flex; align-items: center; justify-content: center; font-size: 16px; color: #fff; position: absolute; right: 100px; top: 50%;transform:translateY(-50%); top: 50%;  }
.head .prebook:before{width: 108px; height: 36px; background:url(../img/pic57.png) no-repeat center center / cover ;content: ""; position: absolute; left: 0; top: 0; z-index: 1; opacity: 1; }
.head .prebook span{ position: relative; z-index: 2; }
.head .prebook:hover::before{ opacity: 0.7; }
.head.fixed{ background-color: rgba(0,0,0,0.6); color: #333; backdrop-filter:saturate(180%) blur(20px); }
.head.fixed .hmid{ border-color:#333; }
.head.isdrop .hmid{ background-color:#000; }
.head.isfixed{ background-color: rgba(0,0,0,0.6); color: #333; backdrop-filter:saturate(180%) blur(20px);}
.head.isfixed .hmid{ border-color:#333; }

.footer{ background:url(../img/pic34.png) no-repeat center center / cover ; padding: 30px 0; position: relative; z-index: 2; }
.footer .toknow{ font-size: 16px; color: #979797; }
.footer .toknow .linka{ font-size: 16px; line-height: 24px; color: #979797; display: block; margin:0 17px; }
.footer .toknow .tels{ position: relative;  }
.footer .toknow .tels .drop::before{ content: ""; position: absolute; left: 50%; bottom: -11px; width: 15px; height: 15px; background-color: #fff; border-radius: 3px; transform:rotate(45deg) translateX(-11px); z-index: 0;   }
.footer .toknow .tels .drop{ background: #fff; border-radius: 5px; padding: 12px 16px; font-size: 12px; line-height: 18px; font-size: 14px; line-height: 22px; position: absolute; left: 50%; bottom:30px; width:160px; transform: translateX(-50%); opacity: 0; bottom: 15px; transition: all 0.5s; pointer-events:none; }
.footer .toknow .tels .drop a{ color: #37f; display: block; }
.footer .toknow .tels:hover .drop{ bottom: 30px; opacity: 1; pointer-events:all;  }
.footer .filings{ color:#979797; font-size: 14px; line-height: 20px; margin:15px 0;  }
.footer .filings a{ color:#979797; margin:0 10px; display: block;  }
.footer .filings span{ color:#979797; margin:0 10px; display: block;  }
.footer .social{}
.footer .item{ position: relative; margin:0 18px; }
.footer .item .pic{ position: relative; width: 30px; height: 30px; cursor: pointer; opacity: 0.6; transition: all 0.4s; }
.footer .item:hover .pic{ opacity: 1; }
.footer .item .drop::after{ content: ""; position: absolute; left: 50%; bottom: -11px; width: 15px; height: 15px; background-color: #fff; border-radius: 3px; transform:rotate(45deg) translateX(-11px); z-index: 1;   }
.footer .item .drop{ background: #fff; border-radius: 5px; padding: 12px 16px; padding: 8px 6px; font-size: 10px; line-height: 18px; position: absolute; left: 50%; bottom:35px; width:324px; transform: translateX(-50%); pointer-events:none; opacity: 0; bottom: 15px; transition: all 0.5s; }
.footer .item .drop.sm{ width: 136px; width: 112px; }
.footer .item .drop.sm .icons{ margin-right: 0; }
.footer .item .drop .icons{ float: left; width: 100px; margin-right: 6px; font-size: 12px; line-height: 16px;  color: #000; text-align: center; }
.footer .item .drop .icons img{ display: block; width: 100%; margin-bottom: 0px; }
.footer .item .drop .icons p{ position: relative; z-index: 3; }
.footer .item .drop .icons:nth-child(3){ margin-right: 0; }
.footer .item:hover .drop{ pointer-events:all; bottom:35px;opacity: 1; }
.footer.white{ background: #fff; }
.footer.white .filings,
.footer.white .filings a,
.footer.white .filings span,
.footer.white .toknow,
.footer.white .toknow .linka{ color: #4F4F4F; }
.footer.white .drop{ box-shadow: 0 0 6px #999; }

.aboutpart{ background: #000a1f; padding: 200px 0 100px; }
.aboutpart .logo{ height: 122px; }
.aboutpart .logo img{ height: 122px; margin:0 auto; display: block; }
.aboutpart .word{ width: 78%; margin:32px auto 64px; font-size: 20px; line-height: 1.9; color: #c6c6c6; text-align: center; }
.aboutpart .both{ display: flex; align-items: center; justify-content: space-between; width: 100%;}
.aboutpart .item{ width: calc(50% - 15px); position: relative; overflow: hidden; transition: all 0.4s; }
.aboutpart .item .up{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 90px 100px;text-align: center; }
.aboutpart .item .name{ font-size: 40px; height: 58px; margin-bottom: 20px; margin-bottom: 15px; position: relative; z-index: 4; transition: all 0.5s ease-in-out; position: relative;color: #fff; letter-spacing: 3px;   }
.aboutpart .item .desc{ font-size: 20px; color: #fff; line-height:30px;position: relative; z-index: 4; opacity: 1; transition: all 0.5s ease-in-out; }
.aboutpart .item .photo{ width: 100%; height: 0; padding-bottom:93.14%; overflow: hidden; position: relative; }
.aboutpart .item .photo img{ width: 100%; height: 100%; object-fit: cover; display: block;transform:scale(1); position: absolute; left: 0; top: 0; transition: all 0.5s ease-in-out; }

.aboutpart .item:hover .photo img{ transform: scale(1.1); }

.aboutpart .switch{ display: none; }

.twoline{ text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2;-webkit-box-orient: vertical;}
.tit{ line-height: 76px; font-size: 52px; color: #fff; letter-spacing: 5px; text-align: center; margin-bottom: 56px; font-weight: normal; }
.tit h6{ font-size: 24px; line-height: 36px; color: #C6C6C6; margin-top: 24px; }
.goodpart{ position: relative; padding: 100px 0;}
.goodswiper{ overflow: hidden; margin-bottom: 35px; }
.goodswiper .swiper-slide{ display: block; overflow: hidden; width: 68.3vw; transition: 300ms; width: calc(68.3vw + 32px); padding: 0 16px; }
.goodswiper .swiper-slide .imga{ display: block; width: 100%; height: 38.22vw; }
.goodswiper .swiper-slide .imga img{ display: block; width: 100%; height: 100%; object-fit: cover;  }
.goodpart .swiper-pagination-bullets.swiper-pagination-horizontal{ bottom: 100px !important; position: absolute !important; z-index: 3;}
.goodpart .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet { opacity: 1; position: relative; width:30px; border: none; height: 2px; border-radius: 0; margin: 0 7px; background:#535760; transition: background-color .3s ease;}
.goodpart .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet-active{ opacity: 1; }
.goodpart .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet::before {  display: block; content: ""; position: absolute;  top: 0px;  left: 0; width: 100%; height: 2px; background:#fff; transform: scaleX(0); transform-origin: 0 0;}
.goodpart .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet-active::before {animation: sliderPagination 3s linear forwards}
.goodpart .info{ display: none; background: #1A1823; padding: 20px 20px; padding: 40px 60px; }
.goodpart .info .name{ font-size: 30px; line-height: 35px; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);}
.goodpart .info p{ font-size: 20px; line-height: 28px; color: #fff;  height: 56px; margin-top: 6px; text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);}

.goodpart.white{ padding: 90px 0; background: #fff; }
.goodpart.white .swiper-slide{ width: calc(71.7vw + 32px);}
.goodpart.white .swiper-slide .imga{ width: 71.7vw; height: 37.5vw; /*background: #1A1823;*/ overflow: hidden; }
.goodpart.white .info{ display: block; width: 100%; background: transparent; display: block; position: absolute; left: 0; top: 0; width: 100%; }
.goodpart.white .goodswiper{ padding-bottom: 0 !important; }

.sumnums{ padding: 100px 0; }
.sumnums .shows{ position: relative; }
.sumnums .pic{ width: 100%;}
.sumnums .ups{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; text-align: center; z-index: 2; padding-top: 115px; }
.sumnums .ups p{ font-size: 48px; color: #fff; line-height: 70px; display: flex; align-items: flex-start; justify-content: center; letter-spacing:2px; }
.sumnums .ups p i{ line-height: 58px; font-size: 40px; }
.sumnums .ups p b{ line-height: 140px; font-size: 100px; }
.sumnums .ups .tip{ position: absolute; left: 0; bottom:104px; font-size: 48px; line-height: 70px; text-align: center; color: #fff; width: 100%; }


.support{ padding: 100px 0; }
.support .both{ overflow: hidden; }
.support .item{ width: calc(50% - 10px); text-align: center; position: relative; margin-right:20px; overflow: hidden; display: block; margin-bottom: 20px; float: left; }
.support .item .up{ padding:58px 20px; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.support .item .bg{ width:100%; height: 0; padding-bottom: 100%; position: relative; }
.support .item .bg img{ width: 100%; height: 100%; object-fit: cover; display: block; transition: all 0.5s ease-in-out; position: absolute; left: 0; top: 0; }
.support .item .name{ position: relative; z-index: 3; font-size: 36px; line-height: 52px; color: #fff;  }
.support .item .more{ position: relative; z-index: 3; font-size: 18px; line-height: 26px; color: #fff; margin-top: 10px;  }
.support .item .more span{ position: relative; padding-bottom: 4px; border-bottom: 2px solid #fff; }
.support .item:hover .bg img{ transform: scale(1.1); }
.support .item:nth-child(2n){ margin-right: 0; }


.attention{ width: 1114px; max-width: 90%; margin:0 auto; padding: 100px 0 10px; display: flex; align-items: flex-start; justify-content: space-between;flex-direction: row-reverse; }
.attention .mobile{ width: 48.6%; }
.attention .mobile img{ width: 100%; }
.attention .info{ padding-top: 96px; font-size: 20px; color: #C6C6C6; line-height: 30px; }
.attention .info p{margin-bottom: 12px; letter-spacing: 2px; color: #999; }
.attention .info h4{ font-size: 52px; letter-spacing: 5px; line-height: 76px; margin-bottom: 28px; color: #fff; }
.attention .code{ margin-top: 102px; overflow: hidden; font-size: 14px; line-height: 20px; }
.attention .code .lib{ width: 186px; float: left; margin-right: 50px; text-align: center; }
.attention .code .lib:nth-child(2){ margin-right: 0; }
.attention .code img{ width: 186px; height: 186px; border:18px solid #1C1D36; margin-bottom: 16px;  }
.attention .code-mob{ display: none; }

@media screen and (max-width: 1500px){
	.aboutpart .item .name{ height: 50px; margin-bottom: 15px; }

}

@media screen and (max-width: 1366px){
	.head{ font-size: 14px;  }
	.head .hmid{ line-height: 48px; padding: 0 32px;}

	.head .logoa{ height: 24px; }
	.head .logoa img{  height: 24px; }
	.head .navbar{ font-size:16px; display: block; position: fixed; left:0; top: 49px; bottom: 0;transition:transform 0.25s ease-in-out 0.25s; display: none; text-align: center; background: #000; width: 100%; z-index: 9; height: calc(100vh - 49px); }
	.head .navbar .navleft{ display: block; padding: 10px 0; border-bottom: 1px solid #333;}
	.head .navbar .navright{ display: block; padding: 10px 0;}
	.head .nava{ float: none; line-height:40px; margin-right: 0; width: 100%; }
	.head .nava:after{ display:none; }
	.head .nava:hover:after{ width: 0; }
	.head .nava:before{ display:none; }
	.head .nava:before:after{ width: 0; }
	.head .prebook{width: auto; height:48px; right: 32px; font-size:16px;  }
	.head .prebook:before{ display: none;}

	.head.isdrop .navbar{ display: block; }
	.head.isdrop .logoa{ display: none; }
	.head.isdrop .prebook{ display: none; }

	.head .menus{ position: absolute; left:-10px; margin-right: 0; display: block; width: 48px; height:48px; position: relative; top: 50%; }
	.head .menus .navbtn,
	.head .menus .navbtn::after,
	.head .menus .navbtn::before { width: 24px; }
	.head .menus .navbtn { position: absolute; top: 50%; right: 12px; display: inline-block; width: 24px; height: 2px; -webkit-transition: all .3s ease-out 0s; -moz-transition: all .3s ease-out 0s; -ms-transition: all .3s ease-out 0s; -o-transition: all .3s ease-out 0s; transition: all .3s ease-out 0s; background: #fff; border-radius: 2px;}
	.head .menus .navbtn::after,
	.head .menus .navbtn::before {position: absolute;right: 0px;display: inline-block;width: 24px;height: 2px;content: '';-webkit-transition: all .3s ease-out 0s;-moz-transition: all .3s ease-out 0s;-ms-transition: all .3s ease-out 0s;-o-transition: all .3s ease-out 0s;transition: all .3s ease-out 0s;background: #fff;border-radius: 2px;}
	.head .menus .navbtn::after { top: -8px; }
	.head .menus .navbtn::before { top: 8px; }
	.head .menus.on .navbtn { background: transparent; }
	.head .menus.on .navbtn::after {top: 0;-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);-o-transform: rotate(45deg); transform: rotate(45deg);}
	.head .menus.on .navbtn::before {top: 0;-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-ms-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);}

	.footer{}
	.footer .toknow{ font-size: 12px; }
	.footer .toknow .linka{ font-size: 14px; line-height: 24px;  margin:0 12px; }
	.footer .filings{ font-size: 12px; line-height: 24px; margin:8px 0; flex-wrap: wrap;  }
	
	.aboutpart .item .name{ font-size: 36px; margin-bottom: 8px; }

}
@media screen and (max-width: 1080px){
	.aboutpart .both{ display: none; }
	.aboutpart .switch{ display: block; }
	.aboutpart .tab{ display: flex; align-items: center; justify-content: center; font-size: 20px; line-height: 1.5; margin-bottom: 24px; }
	.aboutpart .tab span{ border-bottom: 2px solid transparent; margin:0 30px; text-align: center; padding-bottom: 5px; cursor: pointer; }
	.aboutpart .tab span.on{ border-color: #fff; color: #fff; }
	.aboutpart .boxs{ width: 830px; margin:0 auto; }
	.aboutpart .one{ width: 100%;/*width: 400px;*/ margin:0 auto; display: block; height: 0; padding-bottom: 100%; /*padding-bottom: 0; height: 400px;*/ position: relative; display: none; }
	.aboutpart .one img{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; }
	.aboutpart .one.on{ display: block; }
	.aboutpart .one span{ position: absolute; left: 50%; transform: translateX(-50%); bottom: 30px; font-size: 14px; line-height: 1.5; color: #fff;border-bottom: 2px solid #fff; padding-bottom: 3px; }

	.attention .mobile{ width:45%; }
	.attention .info{ padding-top:40px; font-size: 18px;  }
	.attention .info h4{ font-size: 45px; margin-bottom: 25px;}
	.attention .info p{ margin-bottom: 4px; }
	.attention .code{ display: none; }
	.attention .code-mob{ margin-top: 50px; display: flex; align-items: center; }
	.attention .code-mob .link{ border-bottom: 1px solid #fff; font-size: 14px; color: #fff; line-height: 24px; position: relative; }
	.attention .code-mob .link .drop{ position: absolute; left: 50%; bottom: -130px; width:120px; transform: translateX(-50%); bottom: -150px; opacity: 0; transition: all 0.4s;}
	.attention .code-mob .link .drop img{ width: 100%; }
	.attention .code-mob .link .drop::after{ content: ""; position: absolute; left: 50%; top: 4px; width: 15px; height: 15px; background-color: #fff; border-radius: 3px; transform:rotate(45deg) translateX(-11px); z-index: 1; }
	.attention .code-mob .link.on .drop{ bottom: -130px; opacity: 1;  }

	.goodpart .info{ display: block; padding: 20px;}
	.goodpart .info p{ width: 88%; }
	.goodpart.white .info{ position: static; background: #1A1823; padding: 20px; }
	.goodpart.white .swiper-slide .imga{ height: 500px; }
	.goodpart .swiper-pagination-bullets.swiper-pagination-horizontal{ bottom: 60px !important; }

	
	.banner .uptxt{ padding-top: 15vh;}
	.banner .uptxt .name{ font-size: 40px; line-height: 2; letter-spacing:4px; }
	.banner .uptxt .desc{ font-size: 26px; line-height: 1.8; margin:0px 0 30px;letter-spacing: 10px; }
	.banner .uptxt .deal a{ font-size: 16px; }
	
	.banner .photo{ height: 70vh; }
	.banner .photo img{ height: 70vh; object-fit:cover; }
	
	.banner .bannerpic{ height: 70vh; }
	.banner .bannerpic img{ width: 100%; height: 70vh; object-fit:cover; }

	.banner .swiper-pagination-bullet{ width: 60px; }

	.support .item .up{ padding: 35px 0; }
	.support .item .name{ font-size: 30px; line-height: 44px; }
}

@media screen and (max-width: 892px){
	.banner video{ height: 100vh; object-fit:cover; }
	.banner video.vd{ display: none; }
	.banner video.vd-mob{ display: block; }

	.banner .swiper-pagination-bullet{ width: 40px; }


	.head .hmid{ padding: 0 20px;}
	.head .prebook{ right: 20px; }
	.aboutpart{ padding: 64px 0 44px; }
	.aboutpart .logo{ height: 35px; }
	.aboutpart .logo img{ height: 35px; margin:0 auto; display: block; }
	.aboutpart .word{ width: 100%; margin:16px auto 26px; font-size: 12px; line-height: 1.9; color: #939393; text-align: center; }
	.aboutpart .tab{ font-size: 14px; line-height: 1.6; margin-bottom: 20px; }
	.aboutpart .tab span{ margin:0 30px;}
	.aboutpart .boxs{ width: 100%; margin:0 auto; }
	.aboutpart .one span{ bottom: 17px; font-size: 12px; }
	.aboutpart .one{ width:70vw; height:70vw; width: 94vw; height: 94vw; }

	.tit{ line-height: 40px; font-size: 28px; margin-bottom: 20px; font-weight: normal; }
	.tit h6{ font-size: 12px; line-height:9 18px; margin-top: 10px; }

	.goodpart{ padding: 44px 0 !important;}
	.goodswiper{ overflow: hidden; margin-bottom: 26px; }
	.goodswiper .swiper-slide{ width: 80vw; width: 90vw;  width: calc(90vw + 10px); padding: 0 5px; }
	.goodswiper .swiper-slide .imga{ width: 80vw; height:44.8vw; width: 90vw; height: 50.4vw; }

	.goodpart.white .swiper-slide{ width: 80vw; width: 90vw; width: calc(90vw + 10px); }
	.goodpart.white .swiper-slide .imga{ width: 80vw; height:41.8vw; width: 90vw; height: 47vw; }

	.goodpart .swiper-pagination-bullets.swiper-pagination-horizontal{ bottom: 44px !important;}

	.goodpart .info{ padding: 18px 20px; }
	.goodpart .info .name{ font-size: 18px; line-height: 26px; }
	.goodpart .info p{ font-size: 12px; line-height: 24px; height: 48px; margin-top: 4px; }

	.sumnums{ padding: 0; margin:30px 0; height: 50vh; }
	.sumnums .pic{ width: 100%; height: 50vh; object-fit: cover; }
	.sumnums .ups{ padding-top: 30px; }
	.sumnums .ups p{ font-size: 24px; line-height: 40px; letter-spacing:2px; }
	.sumnums .ups p i{ line-height: 50px; font-size: 20px; }
	.sumnums .ups p b{ line-height: 80px; font-size: 40px; }
	.sumnums .ups .tip{ bottom:50px; font-size: 24px; line-height: 40px; }

	.support{ padding: 30px 0; }
	.support .both{ display: block; }

	.support .item .up{ padding:30px 20px;}
	.support .item .name{ font-size: 17px; line-height: 26px; color: #fff;  }
	.support .item .more{ font-size: 12px; line-height: 14px; color: #fff; margin-top: 10px;  }
	.support .item{ width: calc(50% - 6px); margin-right: 12px; margin-bottom: 12px; }


	.attention{ padding: 30px 0; display: block; }
	.attention .mobile{ width:60%; margin:0 auto; }
	.attention .info{ padding: 0; width: 100%; margin-bottom: 50px; line-height: 18px; text-align: center; }
	.attention .info{ padding-top:0px; font-size: 12px;  }
	.attention .info h4{ font-size: 28px; margin-bottom: 10px;}
	.attention .code-mob{ justify-content: center; margin-top: 20px; }

	.footer .item{ margin:0 8px; }
	.footer .item .drop{ ; padding: 6px 4px; font-size: 10px; line-height: 18px; position: absolute; left: 50%; bottom:35px; width:256px; transform: translateX(-50%); pointer-events:none; opacity: 0; bottom: 15px; transition: all 0.5s; }
	.footer .item .drop.sm{ width: 136px; width: 88px; }
	.footer .item .drop .icons{ float: left; width: 80px; margin-right: 4px; font-size: 12px; font-size: 10px; line-height: 16px; color: #000; text-align: center; }
	.footer .toknow .tels .drop{ width: 120px; padding: 12px 10px; }
	.footer .toknow .tels .drop{ font-size: 10px; line-height: 18px; }
}

@media screen and (max-width: 640px){
		.support .item{ width: 100%; text-align: center;  margin:0 0px 12px 0; display: block; }
}

.banner .photo{ display: block; width: 100%; }
.banner .photo img{ display: block; width: 100%; }


.pdpart .swiper-slide{text-align:center;font-size:18px;background:transparent;display:flex;justify-content:center;align-items:center; display: block;}
.pdpart .swiper-slide img{display:block;width:100%;height:100%;object-fit:cover}
.pdpart .swiper{width:100%;height:300px;margin-left:auto;margin-right:auto}
.pdpart .swiper-slide{background-size:cover;background-position:center}
.pdpart .mySwipera2{height:80%;width:100%}
.pdpart .mySwipera{height:20%;box-sizing:border-box;padding:10px 0 0 0;}
.pdpart .mySwipera .swiper-slide{width:25%;height:100%;opacity:0.4; cursor: pointer;}
.pdpart .mySwipera .swiper-slide-thumb-active{opacity:1}
.pdpart .mySwipera p{ height: 50px; line-height: 50px; display: flex; align-items: center;  }
.pdpart .mySwipera p span{ border-bottom:2px solid #fff; font-size: 20px; color: #ccc;  }



.pdpart{ margin-top: 130px; }
.pdpart h3{ font-size: 68px; color: #fff; line-height: 1.45; margin-bottom: 50px; }
.pdpart .both{ overflow: hidden; padding:20px 16px; background: #131524; position: relative; }
.pdpart .show{ width:60%; float: left; }
.pdpart .info{ width:32%; height:calc(100%); float: right; padding-top: 50px; } 
.pdpart .info .name{ font-size: 52px;line-height: 76px; color: #fff; }
.pdpart .info .desc{ font-size: 32px;line-height: 46px; color: #fff; margin-top: 13px; }
.pdpart .info .bot{ position: absolute; left: 68%; bottom: 70px; font-size: 24px; color: #fff; line-height: 36px; }
.pdpart .info .bot .deal{ font-size: 16px; color: #fff; line-height: 40px; display: flex; align-items: center; justify-content: center; margin-top: 36px; }
.pdpart .info .bot .deal a{ margin-right:28px;width: 108px; height: 40px; background:url(../img/pic2.png) no-repeat center center / 100% 100% ; transition: all 0.4s; font-size: 16px; color: #fff; display: flex; align-items: center; justify-content: center; }
.pdpart .info .bot .deal a.foucus{ background-image: url(../img/pic3.png); color: #000; }
.pdpart .info .bot .deal a:hover{ background-image: url(../img/pic3.png); color: #000; }

.infopart{ padding: 130px 0 110px 0; font-size: 14px; line-height: 24px; color: #c6c6c6; }
.infopart li{ margin-bottom: 8px; }
.infopart ol{ margin-top: 60px; padding-left: 15px; }
.infopart .both{ overflow: hidden; }
.infopart .pica{ width: calc(50% - 10px); margin-right: 20px; float: left; overflow: hidden;  }
.infopart .pica a{ display: block; width: 100%; height: 0; padding-bottom: 78.6%; position: relative; overflow: hidden; }
.infopart .pica:nth-child(2n){ margin-right: 0; }
.infopart .pica img{ width: 100%; transition:0.5s all ease-in-out; height: 100%; object-fit: cover; position: absolute; left: 0; top: 0; }
.infopart .pica span{ padding: 54px 30px; position: absolute; left: 0; top: 0; width: 100%; z-index: 2; font-size: 18px; line-height: 44px; text-align: center; color: #fff;  }
.infopart .pica span i{ font-size: 32px; display: block; }
.infopart .pica:hover img{ transform:scale(1.1); }


@media screen and (max-width: 1080px){
	.pdpart h3{ font-size: 44px; margin-bottom: 30px; }
	.pdpart .show{ width:60%; float: left; }
	.pdpart .info{ padding-top: 30px; } 
	.pdpart .info .name{ font-size: 36px;line-height: 60px;  }
	.pdpart .info .desc{ font-size: 20px;line-height: 36px; margin-top: 13px; }
	.pdpart .info .bot{ position: absolute; left: 68%; bottom: 70px; font-size: 18px; color: #fff; line-height: 36px; }
	.pdpart .info .bot .deal{ font-size: 14px;line-height: 40px; margin-top: 25px; }
	.pdpart .info .bot .deal a{ margin-right:28px; font-size: 14px; color: #fff; display: flex; align-items: center; justify-content: center; }


	.infopart{ font-size: 13px; line-height: 21px; }
	.infopart li{ margin-bottom: 8px; }
	.infopart ol{ margin-top: 60px; padding-left: 15px; }
	.infopart .both{ overflow: hidden; }
	.infopart .pica span{ padding: 54px 30px; font-size: 16px; line-height: 40px;}
	.infopart .pica span i{ font-size: 26px; }

}
@media screen and (max-width: 892px){
	.pdpart{ margin-top: 60px; }
	.pdpart h3{ font-size:32px; margin-bottom: 30px; font-size: 28px; margin-bottom: 20px; }
	.pdpart .both{ padding:10px 20px;  }
	.pdpart .show{ width:100%; float: left; }
	.pdpart .info{ width:100%; float: right; padding:30px 0px; } 
	.pdpart .info .name{ font-size: 32px;line-height: 44px; color: #fff; font-size: 24px; }
	.pdpart .info .desc{ font-size: 14px;line-height: 30px; color: #fff; margin-top: 5px; }
	.pdpart .info .bot{ position: static;  font-size: 16px; line-height: 36px; }
	.pdpart .info .bot .price{ font-size: 14px; line-height: 30px; }
	.pdpart .info .bot .deal{ font-size: 14px;justify-content: flex-start; line-height: 40px; margin-top: 20px; }
	.pdpart .mySwipera p{ }

	.infopart{ padding: 80px 0 60px 0; font-size: 12px; line-height: 20px; }
	.infopart li{ margin-bottom: 8px; }
	.infopart ol{ margin-top: 30px; padding-left: 15px; }
	.infopart .both{ overflow: hidden; }
	.infopart .pica{ width: 100%; /*max-width: 410px;*/ position: relative; margin:0 auto 20px auto !important; float: none; display: block; }
	.infopart .pica img{ width: 100%; transition:0.5s all ease-in-out; }
	.infopart .pica span{ padding:30px 30px; font-size: 14px; line-height: 40px;  }
	.infopart .pica span i{font-size: 20px; }


	.pdpart .mySwipera p span{ font-size: 16px; }
	.pdpart .mySwipera p{ height: 40px; line-height: 40px; }
	.pdpart .info{ padding: 25px 0; }
}


.listpart{ padding-top: 100px; }
.listpart .item{ margin-bottom: 90px; overflow: hidden; }
.listpart .pica{ display: block; width: 477px; height:278px;  width: 25vw; height:14.58vw; overflow: hidden; float: left; background:linear-gradient(-45deg, transparent 35px, #000 0) bottom right,
}
.listpart .pica img{ display: block; width:100%; height:100%; object-fit: cover; transition:0.5s all ease-in-out; }
.listpart .infoa{ display: block; float: right; width: calc(100% - 477px - 47px); padding-top: 25px;}
.listpart .title{ font-size: 24px; line-height: 36px; color: #fff; }
.listpart .desc{ font-size: 16px; line-height: 24px; color: #c6c6c6; margin:16px 0 20px; }
.listpart .day{ font-size: 16px; line-height: 24px; color: #fff;}
.listpart .item:hover .pica img{ transform: scale(1.1); }
.listpart .item:hover .title{ color: #5b77f9; text-decoration: underline; }

@media screen and (max-width: 1366px){
	.listpart .pica{ width:35vw; height:20.4vw;}
	.listpart .infoa{ width: calc(100% - 35vw - 4vw); padding-top: 0px; }
	.listpart .title{ font-size: 20px; line-height: 30px; color: #fff; }
	.listpart .desc{ font-size: 14px; line-height: 20px; color: #c6c6c6; margin:12px 0 16px; }
}
@media screen and (max-width: 1080px){
	.listpart .title{ font-size: 18px; line-height: 26px; color: #fff; }
	.listpart .desc{ margin:8px 0 12px; }
	.listpart .day{ font-size: 14px; line-height: 20px; }
}
@media screen and (max-width: 892px){
	.listpart{ padding-top: 60px; }
	.listpart .pica{ width:94vw; width: 100%; height:54.8vw; float: none;}
	.listpart .infoa{ width: 100%; padding-top: 20px; }
	.listpart .title{ font-size: 18px; line-height: 24px; color: #fff; }
	.listpart .desc{ font-size: 14px; line-height: 20px; color: #c6c6c6; } 
	.listpart .day{ font-size: 14px; line-height: 20px; color: #fff;}
	.listpart .item{ margin-bottom: 40px; }
}

.bookpart{ display: block; position: relative; }
.bookpart .box{ }
.bookpart .bgs{ width: 100%; position: relative; height: 1300px; }
.bookpart .pic{ display: none; width: 100%; height: 100%; object-fit: cover; position: absolute; left: 0; top: 0; }
.bookpart .pic.on{ display: block; }
.bookpart .ups{ position: absolute; left: 0; top: 0; padding: 176px 120px 0px 120px; z-index: 2; overflow: hidden; width: 100%; }
.bookpart .info{ float: left; font-size: 24px; line-height: 36px; color: #fff; }
.bookpart .info .name{ font-size: 48px; line-height: 70px; color: #fff; margin-bottom: 16px; }
.bookpart .forms{background: rgba(255, 255, 255, 0.6); backdrop-filter: blur(48.3px); position: absolute; right: 120px; top: 176px; padding: 62px; z-index:2; width: 582px; width: 30vw; min-width: 500px; }
.bookpart .forms h3{ font-size: 40px; text-align: center; color: #000819; line-height: 58px; margin-bottom: 40px; }
.bookpart .forms select{ display: block; background: transparent; height: 50px; line-height: 50px; border:none; box-shadow: none; font-size: 16px; color: #000819; width: 100%; cursor: pointer; }
.bookpart .forms input{ display: block; background: transparent; height: 50px; line-height: 50px; border:none; box-shadow: none; font-size: 16px; color: #000819; width: 100%; cursor: pointer; }
.bookpart .forms .line{ background: #fff; padding: 0 10px; height: 50px; margin-bottom: 30px; }
.bookpart .know{ display: flex; align-items: center; font-size: 16px; line-height: 24px; color: #000819; margin-top: 110px; }
.bookpart .know a{ color:#000819;  }
.bookpart .know .isknow{ width: 24px; height: 24px; margin-right: 0px; background: url(../img/pic40.png) no-repeat left center / 16px auto; cursor: pointer; }
.bookpart .know .isknow.on{ background-image: url(../img/pic62.png); }
.bookpart .sub{ margin-top: 50px; height: 58px; display: flex; align-items: center; justify-content: center; background: url(../img/pic73.png) no-repeat left center / 100% 100%; font-size: 20px; color: #fff; position: relative; overflow: hidden; width: 242px; margin-left: auto; margin-right: auto;  }
.bookpart .sub button{ position: absolute; left: -10%; top: -10%; width: 120%; height: 120%; z-index: 3; cursor: pointer; opacity: 0;  }
.bookpart .bot{ font-size: 14px; line-height: 20px; color: #4C4C4C; text-align: center; margin-top: 32px; width: 242px; margin-left: auto; margin-right: auto;  }

@media screen and (max-width: 1700px){
	.bookpart{ height: 1118px; }
}
@media screen and (max-width: 1366px){
	.bookpart .forms{ padding: 60px 50px; }
	.bookpart .ups{ padding: 176px 100px 0 100px; }
	.bookpart .forms{ right: 100px; }
}
@media screen and (max-width: 1080px){
	.bookpart{ display: block; position: relative; height: auto; background: #121212; }
	.bookpart .bgs{ height: auto; position: static;  }
	.bookpart .pic{ width: 100%; height: auto; position: static; }
	.bookpart .ups{ z-index: 2; width: 100%; margin:0 auto; padding: 100px 30px 0px 30px; position: absolute; left:0; top: 0; }
	.bookpart .info{ position: static; font-size: 16px; line-height: 30px; margin-bottom: 30px;}
	.bookpart .info .name{ font-size: 24px; line-height:40px; color: #fff; margin-bottom: 0px; }
	.bookpart .forms{ padding: 32px 24px; position: static; width: 688px; margin:0 auto; background: transparent; backdrop-filter:none; overflow: hidden; }
	.bookpart .forms h3{ font-size: 36px; line-height: 40px; margin-bottom: 25px; color: #fff; }
	.bookpart .forms select{ display: block; height: 38px; line-height: 38px; font-size: 14px; color: #aaa; }
	.bookpart .forms input{ display: block; height: 38px; line-height: 38px; font-size: 14px; color: #aaa;}
	.bookpart .forms .line{ background: #1E1E1E; border:1px solid #292929; padding: 0 10px; height: 40px; margin-bottom: 24px; width: calc(50% - 12px); margin-right: 24px; float: left; }
	.bookpart .forms .line:nth-child(2n){ margin-right: 0; }
	.bookpart .know{ width: 100%; display: flex; align-items: center; font-size: 14px; line-height: 20px; color: #fff; margin-top: 40px; }
	.bookpart .know a{ color: #fff; }
	.bookpart .sub{ width: 100%; margin-top: 30px; height: 44px; font-size: 16px; color: #fff; background-image: url(../img/pic63.png); }
	.bookpart .bot{ width: 100%; font-size: 12px; line-height: 20px; margin-top: 20px; color: #666; }
	.bookpart .know .isknow{ background-image: url(../img/pic68.png);  }
	.bookpart .know .isknow.on{ background-image: url(../img/pic69.png);  }
}
@media screen and (max-width: 892px){
	.bookpart{ display: block; position: relative; height: auto; background: #121212; }
	
	.bookpart .pic{ width: 100%; height: auto; }
	.bookpart .ups{ z-index: 2; width: 100%; margin:0 auto; padding: 80px 30px 0px 30px; position: absolute; left:0; top: 0; }
	.bookpart .info{ position: static; font-size: 16px; line-height: 30px; margin-bottom: 30px;}
	.bookpart .info .name{ font-size: 24px; line-height:40px; color: #fff; margin-bottom: 0px; }
	.bookpart .forms{ float: none; width: 100%; padding: 32px 24px; max-width: 575px; min-width: 100px; }
	.bookpart .forms h3{ font-size: 32px; line-height: 40px; margin-bottom: 25px;  }
	.bookpart .forms select{ display: block; height: 38px; line-height: 38px; font-size: 14px; color: #aaa; }
	.bookpart .forms input{ display: block; height: 38px; line-height: 38px; font-size: 14px; color: #aaa; }

	.bookpart .forms .line{  padding: 0 10px; height: 40px; margin-bottom: 24px; width: 100%; margin-right: 0px; float: none; }
	.bookpart .forms .line:nth-child(2n){ margin-right: 0; }
	.bookpart .know{ margin-top: 40px; }
	.bookpart .know a{ color: #fff; }
	.bookpart .sub{ margin-top: 30px; height: 44px; font-size: 16px; color: #fff; }
	.bookpart .bot{ font-size: 12px; line-height: 20px; margin-top: 20px; color: #666; }
}

.config{ padding: 170px 0 120px; }
.pzSwiper{ padding-bottom: 70px; position: relative;} 
.swiper-pagination-custom{ bottom: 0; }
.pzSwiper .swiper-slide{ height: 37.5vw }
.pzSwiper .swiper-slide img{display: block; width: 100%; height: 100%; object-fit: cover; }
.pzSwiper .bar{ display: flex; align-items: center; justify-content: center; padding-right: 244px; font-size: 24px; color: #463F3F; line-height: 40px; height: 40px; width: 474px; margin:0 auto; }
.pzSwiper .bar .now{ color: #fff; }
.pzSwiper .bar .num{ width: 30px; text-align: center; }
.pzSwiper .bar .progressbar{ width: 154px; height: 3px; background-color: #888; margin:0 8px; position: relative;}
.pzSwiper .bar .progressbar .process{ position: absolute; left: 0; top: 0; width:100%; height: 3px; background: #fff; transform: scaleX(0); transform-origin: 0 0; }
.pzSwiper .bar .progressbar .process.on{ animation: sliderPagination 3.5s linear forwards; }
.pzSwiper .swiper-button-prev{ top:auto; left:auto; width: 46px; height: 40px; background: url(../img/pic64.png) no-repeat center center / 100% 100%; position: absolute; right:calc(50% - 237px + 78px); bottom: 0; z-index: 10;  }
.pzSwiper .swiper-button-prev:before,
.pzSwiper .swiper-button-prev:after,
.pzSwiper .swiper-button-next:before,
.pzSwiper .swiper-button-next:after{ display: none; }
.pzSwiper .swiper-button-prev:hover{ background-image: url(../img/pic66.png); }
.pzSwiper .swiper-button-next{ top:auto; left:auto; width: 46px; height: 40px; background: url(../img/pic65.png) no-repeat center center / 100% 100%; position: absolute; right:calc(50% - 237px);bottom: 0; z-index: 10; }
.pzSwiper .swiper-button-next:hover{ background-image: url(../img/pic67.png); }

.showvd{ background: url(../img/pic43.png) no-repeat center center / cover; padding: 71px 0 100px; text-align: center; height: 975px; position: relative; }
.showvd .title{ font-size: 32px; line-height: 46px; color: #fff; }
.showvd h3{ font-size: 60px; line-height: 88px; color: #fff; margin:25px 0 28px;}
.showvd p{ font-size: 20px; line-height: 1.5; color: #fff; margin-bottom: 16px; }
.showvd .more{ width: 140px; height: 48px; background: url(../img/pic44.png) no-repeat center center / 100% 100%; font-size: 20px; color: #000819; display: flex; align-items: center; justify-content: center;  position: absolute; left: 50%; bottom: 100px;  margin-left: -70px; }

.parameter{ padding: 30px 0 30px; background: #fff; }
.parameter .list{ overflow: hidden; }
.parameter .item{ width: calc(50% - 60px); float: left; margin-right: 120px; padding:32px 0; display: flex; align-items: center; justify-content: space-between; font-size: 16px;color: #000819; line-height: 70px;  }
.parameter .item:nth-child(2n){ margin-right: 0; }
.parameter .item p{ display: flex; align-items: center;}
.parameter .item p span{ font-size:48px;  }
.parameter .item p i{ font-size:16px; padding-left: 4px; }

.openx{ padding: 45px 0; background: #fff; text-align: center;  }
.openx .title{ color: #000819; font-size: 48px; line-height: 70px; margin-bottom: 60px; }
.openx .show{  position: relative;transition: all 1s ease; overflow: hidden; will-change: width, height; -webkit-clip-path: polygon(20% 0%, 80% 0%, 80% 100%, 20% 100%); clip-path: polygon(20% 0%, 80% 0%, 80% 100%, 20% 100%);width: 100%; height:720px; margin-left: auto; margin-right: auto; }
.openx.on .show{ -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
.openx .show .pic{ height:720px; object-fit: cover;transform: translateX(-50%) scale(1.2); transform-origin: 50% 20%; transition: all 1s ease; width: 100%; left: 50%; position: relative;}
.openx .show .pic img{ display: block; width: 100%; height: 100%; object-fit: cover; }
.openx.on .show .pic{ transform:translate(-50%, 0) scale(1); }
.openx .show .txt{ position: absolute; left: 0; bottom: 0; width: 100%; height: auto; padding: 70px; text-align: center; font-size: 16px;color: #000819; line-height: 24px; margin-top: 12px; }


.designs{ background: #fff; padding: 125px 0; }
.designs .both{ background:#F5F6F7; position: relative; overflow: hidden;  }
.designs .pic{width: 100%;float: left; height: 650px;transition: all 1s ease-in-out;  }
.designs .pic img{ width: 100%; height: 100%; object-fit: cover;transition: all 1s ease-in-out;}
.designs .txt{ width: 390px; padding:45px; height: 650px; display: flex; align-items:  flex-start; justify-content: center; flex-direction:column; font-size:16px; color: #797C80; line-height: 28px; float: right;  }
.designs .txt h3{ font-size: 32px; line-height: 46px; color: #000819; margin-bottom: 16px; }
.designs.on .pic{ left: 0; top: 0; width: calc(100% - 390px); position: absolute;   }

.comes{ padding: 118px 0 85px; background: #fff; color:#797C80;  }
.comes .tits{ font-size: 16px; color: #797C80; line-height:28px; margin-bottom: 30px; }
.comes .tits h3{ font-size: 36px; color: #000819; line-height:46px; margin-bottom: 16px; }
.comes .both{ overflow: hidden; }
.comes .left{ width: 64.5%; overflow: hidden; float: left; }
.comes .right{ width: 32.5%; overflow: hidden; float: right; }
.comes .pic img{ display: block; width: 100%; height: 100%; object-fit: cover; transition: 0.5s all ease-in-out; transform:scale(1); transform-origin: 50% 20%; }
.comes .left .pic{ height:542px;  }
.comes .right .pic{ height:450px;  }
.comes .pic:hover img{ transform:scale(1.1); }



.popplay{ position: fixed; left: 0; top: 0; z-index: 999; width: 100%; height: 100%; background: rgba(0,0,0,0.8); display: none; }
.popplay .bg{ position: absolute; left: 0; top: 0;width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index: 2;  }
.popplay.on { display: flex; align-items: center; justify-content: center; animation: modal-player-fadein 0.3s forwards; }
.popplay video { position: relative; z-index: 3; width: auto !important; max-width: 92%; max-height: 90vh; outline: 0; box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5); }
.popplay .close{ position: absolute; right:1.25vw; top:1.25vw; z-index: 2; cursor: pointer; width: 2vw; height: 2vw; background: url(../img/close.png) no-repeat center center / 100% 100% ; z-index: 3; }

@media screen and (max-width: 1080px){
	.showvd{ height: 70vh; padding: 70px 0 80px; }
	.showvd .title{ font-size: 24px; line-height: 40px; color: #fff; }
	.showvd h3{ font-size: 36px; line-height: 60px; color: #fff; margin:15px 0 20px;}
	.showvd p{ font-size: 18px; line-height: 1.5; color: #fff; margin-bottom: 5px; }
	.showvd .more{ width: 140px; height: 48px; background: url(../img/pic44.png) no-repeat center center / 100% 100%; font-size: 18px; color: #000819; display: flex; align-items: center; justify-content: center;  position: absolute; left: 50%; bottom: 80px; margin-left: -70px; }
	

	.pzSwiper .swiper-slide{display: block; width: 100%; height: 41.8vw; object-fit: cover; }
	.pzSwiper .bar{ padding-right: 164px; font-size: 24px; line-height: 40px; height: 40px; height: 30px; line-height: 30px; width: 340px; margin:0 auto; padding-right: 134px; width: 310px; }
	.pzSwiper .swiper-button-next{ right: calc(50% - 170px); width: 35px; height: 30px; }
	.pzSwiper .swiper-button-prev{ right: calc(50% - 170px + 78px); width: 35px; height: 30px; right: calc(50% - 170px + 60px); }
	.pzSwiper .bar .num{ width: 30px; text-align: center; }
	.pzSwiper .bar .progressbar{ width: 100px; height: 3px;  margin:0 8px;}

	
	.parameter .list{ overflow: hidden; }
	.parameter .item{ width: calc(50% - 20px);  margin-right: 40px; font-size: 14px;color: #000819; line-height: 60px; padding: 15px 0;  }
	.parameter .item:nth-child(2n){ margin-right: 0; }
	.parameter .item p{ display: flex; align-items: center;}
	.parameter .item p span{ font-size:38px;  }
	.parameter .item p i{ font-size:14px; padding-left: 4px; }

	
	.openx .title{ font-size: 28px; line-height: 40px; margin-bottom: 30px; }
	.openx .show{ height:70vh; }
	.openx .show .pic{ height:70vh;}
	.openx .show .pic img{ display: block; width: 100%; height: 100%; object-fit: cover; }
	.openx.on .show .pic{ transform:translate(-50%, 0) scale(1); }
	.openx .show .txt{ padding: 40px; font-size: 16px; line-height: 24px; margin-top: 12px; width: 100%; }

	.designs.on .pic{ left: 0; top: 0; width: calc(100% - 300px); position: absolute;   }

	
	.designs .pic{ float: none; height: 50vh;transition: all 1s ease-in-out; position: static; width: 100%; }
	.designs .pic img{ width: 100%; height: 100%; object-fit: cover;transition: all 1s ease-in-out;}
	.designs .txt{ width: 300px; padding:25px 30px; height:50vh; font-size:14px; color: #797C80; line-height: 24px;  }
	.designs .txt h3{ font-size: 24px; line-height: 40px; margin-bottom: 8px; }


	
	.comes .tits{ font-size: 14px; line-height:24px; margin-bottom: 20px; }
	.comes .tits h3{ font-size: 24px; line-height:40px; margin-bottom: 8px; }
	
	.goodpart.white{ padding: 60px 0; }
	.popplay .close{ width: 32px; height: 32px; top: 4vw; right: 4vw; }

}
@media screen and (max-width: 892px){
	.showvd{ padding: 50px 0 70px; height: 50vh; }
	.showvd .title{ font-size: 18px; line-height: 30px; color: #fff; }
	.showvd h3{ font-size: 24px; line-height: 40px; color: #fff; margin:8px 0 10px;}
	.showvd p{ font-size: 14px; line-height: 1.5; color: #fff; margin-bottom: 5px; width: 90%; margin:0 auto; }

	.showvd .more{ bottom: 70px; font-size: 16px; }
	.config{ padding: 80px 0 60px; }
	.pzSwiper{ padding-bottom: 60px;}
	.parameter{ padding: 20px 0 20px; }
	.parameter .item{ width: calc(50% - 15px);  margin-right: 30px; font-size: 13px;color: #000819; line-height: 60px;  padding:5px 0; }

	.parameter .item p span{ font-size:28px;  }
	.parameter .item p i{ font-size:13px; padding-left: 4px; }

	.openx{ padding: 30px 0;  }
	.openx .show{ height: 50vh; }
	.openx .show .pic{ height:50vh;}
	.openx .show .pic img{ display: block; width: 100%; height: 100%; object-fit: cover; }


	.designs{  padding: 60px 0; }
	.designs .pic{ width: 100% !important; float: none; height: 50vh;transition: all 1s ease-in-out; position: static; }
	.designs .pic img{ width: 100%; height: 100%; object-fit: cover;transition: all 1s ease-in-out;}
	.designs .txt{ width: 100%; padding:30px 30px; height:auto; font-size:14px; color: #797C80; line-height: 24px; position: static;  }
	.designs .txt h3{ font-size: 24px; line-height: 30px; margin-bottom: 6px; }
	.designs.on .pic{ position: static;}

	.comes{ padding: 30px 0 40px; }
	.comes .both{ overflow: hidden; }
	.comes .left{ width: 100%; overflow: hidden; float: none; margin-bottom: 20px; }
	.comes .right{ width: 100%; overflow: hidden; float: none; display: none; }

	
}

@keyframes modal-player-fadein {
  0% { opacity: 0; }
  100% { opacity: 1; }
}


.clip80{clip-path: polygon( 
	115px 0%, 
	100% 0%,        
  100% calc(100% - 115px),
  calc(100% - 115px) 100%,
  0% 100%,      
  0% 155px);
}
.clip26{clip-path: polygon( 
	13vw 0%, 
	100% 0%,        
  100% calc(100% - 13vw),
  calc(100% - 13vw) 100%,
  0% 100%,      
  0% 13vw);
}
.clip10{clip-path: polygon( 
	10vw 0%, 
	100% 0%,        
  100% calc(100% - 10vw),
  calc(100% - 10vw) 100%,
  0% 100%,      
  0% 10vw);
}
@media screen and (max-width: 1080px){
	.clip10{clip-path: none;}

	.clip80{clip-path: polygon( 
			80px 0%, 
			100% 0%,        
      100% calc(100% - 80px),
      calc(100% - 80px) 100%,
      0% 100%,      
      0% 80px);
	}
}


.goodswiper .swiper-slide{ transition: clip-path 0.5s ease-in-out; }
.goodswiper .swiper-slide-next{
	clip-path: polygon( 
			0% 0%, 
			100% 0, 
      0 100%);
}
.goodswiper .swiper-slide-prev{
	clip-path: polygon( 
		100% 0,
    100% 100%,0 100%);
  );
}
.goodswiper .swiper-slide-active{ clip-path:none; opacity: 1; }
/*.goodpart.white .goodswiper .swiper-slide-active{ 
	clip-path: polygon( 
			0% 0%, 
			100% 0%, 
			100% calc(100% - 15vw),        
      calc(100% - 15vw) 100%,
      0 100%); 
}*/
	

@media screen and (max-width: 1080px){
	.goodswiper .swiper-slide{
		clip-path: polygon( 
			100px 0%, 
			100% 0%,        
      100% calc(100% - 100px),
      calc(100% - 100px) 100%, 
      0% 100%,       
      0% 100px     );
	}
}

.policy{ background: #121212; padding:212px 80px 120px 80px;  color: #999; font-size: 14px; font-weight: 400; line-height: 160%; }
.policy .cont{ display: flex; align-items: flex-start; justify-content: center; min-width: 1120px; }
.policy .title{ color: #fff; font-size: 32px; font-weight: 700; line-height: 125%; margin-bottom: 24px; max-width: 1200px; margin-left: auto; margin-right: auto;  }
.policy .title.center{text-align: center;}
.policy h3{ color: #fff; font-size: 20px; font-weight: 700; line-height: 125%; margin-bottom: 24px; }
.policy h4{ color: #fff; font-size: 14px; font-weight: 700; line-height: 125%; margin-bottom: 12px; }
.policy .one{ margin-bottom: 64px;max-width: 1200px; margin-left: auto; margin-right: auto; }
.policy .one img{ display: block; max-width: 100%; margin:30px auto; }
.policy .side{ /*width: 300px; float: left;*/ position: relative; position: sticky;
    margin-right: 100px;
    padding-left: 25px;
    top: 156px;
    width:300px; }
.policy .side::before{ content: ""; position: absolute; left: 0; top: 0; width: 1px; bottom: 0; background: rgba(196, 196, 196, .4); z-index: 1; }
.policy .side .moveline{ position: absolute; left: 0; top: 0; width: 1px; height: 18px; background: #fff; z-index: 2;transition:top .3s ease-in-out,height .3s ease-in-out; }

.policy .side a{ font-size: 14px; color: #666; line-height: 18px; margin-bottom: 24px; position: relative; z-index: 2; transition: color .3s ease-in-out; display: block; overflow: hidden; text-overflow: ellipsis;white-space: nowrap; }
.policy .side a:nth-last-child(2){ margin-bottom: 0; }
.policy .side a:hover{ color: #fff; }
.policy .side a.on{ color: #fff; }
.policy .mains{ width: calc(100% - 400px); float: right; }


.head.nofixed{ position: relative; background-color: rgba(0,0,0,1); color: #333; backdrop-filter:saturate(180%) blur(20px); }
.head.nofixed .hmid{ border-color: #000 !important;}
.policybar{ background: rgba(0,0,0,0.6); font-size: 14px; font-weight: 500; line-height: 125%; color: #fff; width: 100%; border-bottom: 1px solid #333; }
.policybar.on{ background-color: rgba(0,0,0,0.6); color: #333; backdrop-filter:saturate(180%) blur(20px); position: fixed; left: 0; top: 0; z-index: 999;  }
.policybar .mid{ padding: 0 100px; }
.policybar h4{ font-size: 18px; width: 76px; text-align: center; color: #fff; }
.policybar a{ line-height: 54px; margin-left: 40px; color: #fff;}



@media screen and (max-width: 1366px){
	.policy .cont{ min-width: 100px; width: 100%; max-width: 100%; }
	.policybar .mid{ padding: 0 32px;}
	.policybar h4{ width: auto; }

	.policy .mains{ width: calc(100% - 350px);}
}
@media screen and (max-width: 1080px){
	.policy .cont{ min-width: 100px; width: 100%; max-width: 94vw; }
	.policy{ padding: 180px 0 100px 0; }
	.policy .side{ display: none; }
	.policy .mains{ width: 100%; }
	.policybar a{ margin-left: 30px; }
}
@media screen and (max-width: 892px){
	.policybar .mid{ padding: 0 20px;}
	.policybar a{ margin-left: 20px; }
	.policy{ padding: 120px 0 60px 0; }
}
@media screen and (max-width: 767.9px){
	.policy .cont{ min-width: 100px; width: calc(100vw - 32px); max-width: 1000px; }
	.policy{ padding: 100px 0 40px 0; }
	.policy .title{ font-size: 24px; margin-bottom: 20px; }
	.policy h3{ font-size: 16px; margin-bottom: 20px; }
	.policy h4{ font-size: 14px; }
	.policy .one{ margin-bottom: 48px; }
	.policy .one img{ margin:16px auto; }
	.policybar a{ margin-left: 15px; }
	.policybar{ font-size: 13px; }
	.policybar h4{ width: auto; font-size: 16px; }
}