.w1800 {
width: 18rem;
margin: 0 auto;
position: relative;
font-size: 0; }
@media (max-width: 1880px) {
.w1800 {
width: 94%; } }
@media (max-width: 800px) {
.w1800 {
width: 94%; } }
.w1600 {
width: 16rem;
margin: 0 auto;
position: relative;
font-size: 0; }
@media (max-width: 1680px) {
.w1600 {
width: 90%; } }
@media (max-width: 800px) {
.w1600 {
width: 94%; } }
:root {
--themes: #e2392e; }
header {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 50;
transition: all ease 0.5s;
border-bottom: solid 1px rgba(255, 255, 255, 0.1); }
header .hop {
width: 100%;
display: flex;
justify-content: space-between;
transition: all ease 0.5s;
min-height: 0.9rem;
align-items: center; }
header .rav {
width: auto;
display: inline-block;
vertical-align: middle;
padding-left: 0.4rem;
font-size: 0;
display: flex;
align-items: center; }
header .rav .search {
display: inline-block;
vertical-align: middle;
width: auto;
text-align: center;
cursor: pointer;
position: relative;
width: 19px;
height: 40px; }
header .rav .search .sc {
display: inline-block;
vertical-align: middle;
width: 100%;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 3; }
header .rav .search .sc img {
width: 100%;
display: block; }
header .rav .sechom {
position: absolute;
z-index: 3;
right: 0;
width: 4rem;
background-color: #fff;
box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.09);
padding: 0.1rem;
top: 100%;
display: none; }
header .rav .sechom form {
width: 100%;
display: block;
font-size: 0; }
header .rav .sechom .input {
display: inline-block;
vertical-align: middle;
width: calc(100% - 2.4em - 0.2rem);
margin-right: 0.2rem; }
header .rav .sechom .input .int {
width: 100%;
display: block;
background-color: #fff;
line-height: 2.4;
height: 2.4em;
color: #111;
padding: 0 0.1rem;
border: none;
background-color: #fff; }
header .rav .sechom .stn {
display: inline-block;
vertical-align: middle;
width: 2.2em;
height: 2.2em;
border-radius: 50%;
background-color: var(--themes);
position: relative; }
header .rav .sechom .stn img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 15px;
height: 15px;
display: block;
cursor: pointer;
z-index: 1;
filter: grayscale(1000%) brightness(2000%); }
header .rav .sechom .stn input {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: block;
border-radius: 50%;
cursor: pointer;
z-index: 3;
opacity: 0; }
header .rav .languages {
width: auto;
display: inline-block;
vertical-align: middle;
font-size: 0;
margin: 0 0.1rem;
text-align: left;
z-index: 3;
margin-left: 0.4rem; }
header .rav .languages .lauges {
width: 100%;
display: inline-block;
vertical-align: middle;
position: relative; }
header .rav .languages .lauges .lashow {
width: 100%;
position: relative;
cursor: pointer;
font-size: 0;
line-height: 40px;
white-space: nowrap;
height: 40px;
padding-right: 16px; }
header .rav .languages .lauges .lashow .ac {
display: inline-block;
vertical-align: middle;
width: 0.39rem;
margin-right: 0.1rem; }
header .rav .languages .lauges .lashow .ac img {
width: 100%;
display: block; }
header .rav .languages .lauges .lashow .am {
color: #fff;
display: inline-block;
vertical-align: middle;
width: auto;
min-width: 40px; }
header .rav .languages .lauges .lashow:after {
content: ' ';
position: absolute;
right: 0rem;
top: calc(50%);
transform: translateY(-50%);
background-image: url("../images/i2.png");
width: 9px;
height: 6px;
background-size: 100%; }
header .rav .languages .lauges .language {
position: absolute;
z-index: 20;
top: 100%;
width: 100%;
display: none;
width: 60px;
width: 1rem;
left: 50%;
transform: translateX(-50%); }
header .rav .languages .lauges .language .latem {
width: 100%; }
header .rav .languages .lauges .language .latem a {
width: 100%;
display: block;
color: #333;
padding: 0 0.1rem;
line-height: 3;
text-align: center;
position: relative;
background: #efefef;
overflow: hidden; }
header .rav .languages .lauges .language .latem a span {
display: inline-block;
vertical-align: middle;
position: relative;
z-index: 2; }
header .rav .languages .lauges .language .latem a:after {
content: "";
position: absolute;
width: 140%;
height: 100%;
left: -10%;
top: 0;
z-index: -1;
transform: translate(-105%, 0) skew(-20deg);
background: var(--themes);
z-index: 1;
animation: outHover 0.5s ease 1 forwards; }
header .rav .languages .lauges .language .latem a:hover {
color: #fff; }
header .rav .languages .lauges .language .latem a:hover span {
color: #fff; }
header .rav .languages .lauges .language .latem a:hover:after {
animation-name: onHover; }
@keyframes onHover {
from {
transform: translate(-110%, 0) skew(-20deg); }
to {
transform: translate(0, 0) skew(-20deg); } }
@keyframes outHover {
from {
transform: translate(0, 0) skew(-20deg); }
to {
transform: translate(110%, 0) skew(-20deg); } }
header .rav .rd {
display: inline-block;
vertical-align: middle;
width: 0.51rem;
margin-left: 0.3rem;
cursor: pointer; }
header .rav .rd img {
width: 100%;
display: block; }
header .rav .menu {
display: inline-block;
vertical-align: middle;
width: 20px;
height: 20px;
cursor: pointer;
position: relative;
display: none; }
header .rav .menu img {
width: 100%;
display: block; }
header .rav .menu .clk {
width: 100%;
height: 100%;
text-align: center;
color: #333;
font-size: 20px;
line-height: 24px;
text-align: center;
position: absolute;
z-index: 3;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
display: none; }
header .logo {
display: inline-block;
vertical-align: middle;
width: auto;
font-size: 0;
white-space: nowrap; }
header .logo .log {
width: 1.41rem;
display: inline-block;
vertical-align: middle; }
header .logo .log a, header .logo .log img {
width: 100%;
display: block; }
header nav {
width: 100%;
display: block;
text-align: center; }
header nav .natem {
width: auto;
display: inline-block;
vertical-align: middle;
position: relative;
text-align: center;
font-size: 0; }
header nav .natem .nas {
width: auto;
display: inline-block;
position: relative;
margin: 0 0.2rem; }
header nav .natem .nas a {
display: inline-block;
line-height: 0.9rem;
color: #fff;
position: relative;
padding: 0 0.15rem;
transition: all ease 0.5s; }
header nav .natem .nas:before {
content: ' ';
position: absolute;
display: inline-block;
vertical-align: middle;
width: 0.12rem;
height: 0.07rem;
background-image: url("../images/xx1.png");
background-size: 100% 100%;
bottom: 0.2rem;
left: 50%;
transform: translateX(-50%);
opacity: 0;
transition: all ease 0.5s; }
header nav .natem .nas:after {
content: ' ';
position: absolute;
left: 50%;
bottom: 0rem;
transform: translateX(-50%);
opacity: 0;
background-color: #fff;
transition: all ease 0.5s;
width: 0;
height: 0.02rem; }
header nav .natem .navuls {
width: 2.2rem;
width: 2rem;
position: absolute;
z-index: 101;
left: calc(50%);
top: 100%;
transform: translateX(-50%);
display: none; }
header nav .natem .navuls ul {
width: 100%; }
header nav .natem .navuls ul li {
width: 100%;
position: relative; }
header nav .natem .navuls ul li .njm {
width: 100%;
font-size: 0;
border-top: solid 1px rgba(255, 255, 255, 0.15);
background-color: #2d2d2d; }
header nav .natem .navuls ul li .ns {
width: 100%;
display: inline-block;
vertical-align: middle;
line-height: 3;
color: #fff;
text-align: left;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
padding: 0 0.1rem;
position: relative;
text-align: center; }
header nav .natem .navuls ul li .theul {
width: 100%;
background-color: #fff;
display: none; }
header nav .natem .navuls ul li .theul li {
width: 100%;
font-size: 0; }
header nav .natem .navuls ul li .theul li .xn {
display: inline-block;
vertical-align: middle;
color: #333;
line-height: 2.5;
padding: 0 0.2rem; }
header nav .natem .navuls ul li .theul li .xn:hover {
color: #333; }
header nav .natem .navuls ul li:hover .ns {
background-color: #ddd;
color: #000; }
header nav .natem .navuls ul li.has-the:after {
content: "+";
display: inline-block;
width: 36px;
height: 36px;
line-height: 36px;
text-align: center;
position: absolute;
background: none;
right: 0;
left: auto;
transform: translateX(0);
top: 0.05rem;
font-size: 20px;
color: #333;
border: none;
display: none; }
header nav .natem .navuls ul li.has-the.show:after {
content: "-"; }
header nav .natem .longul {
width: 100%;
position: fixed;
z-index: 101;
left: calc(50%);
top: 0.9rem;
left: 0;
border-top: solid 1px rgba(255, 255, 255, 0.15);
padding: 0.4rem 0;
background-color: var(--themes);
display: none; }
header nav .natem .longul .longlist {
width: 100%;
font-size: 0;
display: flex;
flex-wrap: wrap;
text-align: left; }
header nav .natem .longul .longlist .logem {
display: inline-block;
vertical-align: middle;
width: calc(290 / 1320 * 100%);
margin-right: calc(52 / 1320 * 100%);
margin-bottom: 0.4rem;
transition: all ease 0.5s;
top: 0;
position: relative; }
header nav .natem .longul .longlist .logem a {
width: 100%;
display: block;
font-size: 0; }
header nav .natem .longul .longlist .logem .imgs {
display: inline-block;
vertical-align: middle;
width: calc(1rem);
margin-right: 0.2rem;
position: relative;
overflow: hidden; }
header nav .natem .longul .longlist .logem .imgs .img {
width: 100%;
padding-top: 100%;
transition: all ease 0.5s; }
header nav .natem .longul .longlist .logem .rom {
display: inline-block;
vertical-align: middle;
width: calc(100% - 1.2rem); }
header nav .natem .longul .longlist .logem .rom .rx {
width: 100%;
color: #fff;
line-height: 1.5; }
header nav .natem .longul .longlist .logem:nth-child(4n) {
margin-right: 0; }
header nav .natem .longul .longlist .logem:hover {
top: -0.1rem; }
header nav .natem.has-nav .nas .xs {
display: inline-block; }
header nav .natem.on .nas:before {
opacity: 1; }
header nav .natem:hover .nas:before {
opacity: 1; }
header.white {
background-color: #2d2d2d; }
@media (max-width: 800px) {
header {
background-color: #2d2d2d; }
header .hop {
align-items: center;
padding: 0.1rem 0;
height: calc(40px + 0.2rem); }
header .blace {
position: fixed;
z-index: -1;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 450;
display: none;
background-color: rgba(0, 0, 0, 0.5); }
header nav {
width: 100%;
width: 5rem;
position: fixed;
right: -100%;
top: 0;
left: auto;
height: 100vh;
background-color: #fff;
margin-right: 0;
overflow: auto;
z-index: 500;
transition: all ease 1.2s;
padding-left: 0.1rem;
padding: 0.1rem;
display: block;
text-align: left;
opacity: 0;
border-top: solid 1px #e5e5e5; }
header nav .natem {
display: inline-block;
vertical-align: middle;
position: relative;
width: auto;
width: 100%;
padding: 0.1rem 0;
opacity: 0;
transform: translate(-10px, -30px);
transition: all .8s ease; }
header nav .natem .nas {
width: auto;
display: inline-block;
text-align: left;
width: 100%;
margin: 0; }
header nav .natem .nas a {
width: auto;
display: inline-block;
vertical-align: middle;
line-height: 2.5;
color: #333;
font-weight: bold;
font-family: 'Alibaba-PuHuiTi-Bold';
padding: 0 0.3rem;
position: relative; }
header nav .natem .nas .ik {
display: none !important; }
header nav .natem .nas a:hover {
color: var(--themes);
background-color: transparent; }
header nav .natem .navuls {
width: 100%;
position: relative;
z-index: 101;
left: 0%;
top: 0%;
transform: translateX(0%);
background: #fff;
box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.09);
display: none;
text-align: left; }
header nav .natem .navuls ul {
width: 100%;
padding: 0.1rem 0.2rem; }
header nav .natem .navuls ul li {
width: 100%;
display: block;
position: relative;
margin-bottom: 0; }
header nav .natem .navuls ul li .njm {
background-color: #fff;
border-top: none; }
header nav .natem .navuls ul li .ns {
width: auto;
display: inline-block;
vertical-align: middle;
line-height: 3;
color: #333;
text-align: left !important;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
padding: 0 0.2rem;
background: #fff;
position: relative; }
header nav .natem .navuls ul li .ns:hover {
color: var(--themes); }
header nav .natem .navuls ul li + li {
border-top: solid 1px #eee; }
header nav .natem .navuls ul li:hover .ns {
background-color: transparent;
color: var(--themes); }
header nav .natem .navuls ul li.has-the:after {
display: block; }
header nav .natem:before {
display: none !important; }
header nav .natem.on .nas:after {
display: none; }
header nav .natem.has-nav .nas .xs {
display: none; }
header nav .natem.has-nav:after {
content: "+";
display: inline-block;
width: 36px;
height: 36px;
line-height: 36px;
text-align: center;
position: absolute;
background: none;
right: 0;
left: auto;
transform: translateX(0);
top: 0.05rem;
font-size: 20px;
color: #333;
border: none; }
header nav .natem.has-nav.show:after {
content: "-"; }
header nav .natem.animate {
opacity: 1;
transform: translate(0, 0); }
header .logo .log {
width: 90px; }
header .logo .log img:first-child {
display: none; }
header .logo .log img:last-child {
display: block; }
header .rav .menu {
width: 30px;
height: 30px;
display: inline-block;
margin-left: 0.15rem; }
header .rav .menu img {
width: 100%;
display: block;
filter: grayscale(1000%) brightness(2000%); }
header .rav .menu .clk {
line-height: 30px; }
header .rav .searcom {
width: 80px;
background-color: #f8f8f8; }
header .rav .searcom .input input {
color: #333; }
header .rav .searcom .input input::-webkit-input-placeholder,
header .rav .searcom .input textarea::-webkit-input-placeholder {
color: rgba(0, 0, 0, 0.5); }
header .rav .searcom .input input:-moz-placeholder,
header .rav .searcom .input textarea:-moz-placeholder {
color: rgba(0, 0, 0, 0.5); }
header .rav .searcom .input input::-moz-placeholder,
header .rav .searcom .input textarea::-moz-placeholder {
color: rgba(0, 0, 0, 0.5); }
header .rav .searcom .input input:-ms-input-placeholder,
header .rav .searcom .input textarea:-ms-input-placeholder {
color: rgba(0, 0, 0, 0.5); }
header .rav .search {
width: 20px;
display: inline-block;
margin-right: 5px; }
header .rav .search .sc {
width: 15px;
height: 15px; }
header .rav .search .sc img:first-child {
display: none; }
header .rav .search .sc img:last-child {
display: block; }
header .rav .sechom {
width: 100vw;
position: fixed;
left: 0;
top: calc(40px + 0.2rem);
padding: 0.15rem; }
header .hot {
border-bottom: solid 1px rgba(0, 0, 0, 0.08); }
header .hot .hom .hkr .tc img:first-child {
display: none; }
header .hot .hom .hkr .tc img:last-child {
display: block; }
header .hot .hom .hkr .tm {
color: #222; }
header.menu-state .rav .menu img {
opacity: 0; }
header.menu-state nav {
opacity: 1;
right: 0; }
header.menu-state .blace {
opacity: 1; } }
.banner {
width: 100%;
position: relative; }
.banner .swiper-slide {
width: 100%;
position: relative; }
.banner .swiper-slide .imgs.pcm {
width: 100%;
position: relative;
overflow: hidden;
display: block; }
.banner .swiper-slide .imgs.pcm .img {
width: 100%;
padding-top: 44.27%; }
.banner .swiper-slide .imgs.phm {
width: 100%;
position: relative;
overflow: hidden;
display: none; }
.banner .swiper-slide .imgs.phm .img {
width: 100%;
padding-top: 44.27%; }
.banner .swiper-slide .box {
position: absolute;
z-index: 4;
top: 50%;
transform: translateY(-50%);
left: calc(160 / 1920 * 100%);
width: 6rem;
max-width: 80%; }
.banner .swiper-slide .box .bit {
width: 100%;
color: #fff;
line-height: 1.3;
text-align: left;
opacity: 0;
transform: translate3d(0, 25%, 0);
transition: opacity 1s ease-out 0.2s,transform 1s ease-out 0.2s,box-shadow .3s; }
.banner .swiper-slide .box .bit p {
color: #fff;
line-height: 1.3;
position: relative;
z-index: 2; }
.banner .swiper-slide .box .eim {
width: 100%;
color: #fff;
line-height: 1.3;
text-align: left;
margin-top: 0.14rem;
opacity: 0;
transform: translate3d(0, 25%, 0);
transition: opacity 1s ease-out 0.2s,transform 1s ease-out 0.2s,box-shadow .3s; }
.banner .swiper-slide .box .eim p {
color: #fff;
line-height: 1.3;
position: relative;
z-index: 2; }
.banner .swiper-slide .box .more {
width: 100%;
margin-top: 0.4rem;
font-size: 0;
opacity: 0;
transform: translate3d(0, 25%, 0);
transition: opacity 1s ease-out 0.2s,transform 1s ease-out 0.2s,box-shadow .3s; }
.banner .swiper-slide .box .more a {
display: inline-block;
vertical-align: middle;
border: solid 1px rgba(255, 255, 255, 0.5);
color: #fff;
line-height: 2.8;
width: auto;
padding: 0 0.6rem;
position: relative;
top: 0;
transition: all ease 0.5s; }
.banner .swiper-slide .box .more a:hover {
background-color: #fff;
color: var(--themes); }
.banner .swiper-slide .box .vob {
width: 100%;
font-size: 0;
margin-top: 0.5rem;
opacity: 0;
transform: translate3d(0, 25%, 0);
transition: opacity 1s ease-out 0.2s,transform 1s ease-out 0.2s,box-shadow .3s; }
.banner .swiper-slide .box .vob a {
display: inline-block;
vertical-align: middle;
width: auto;
background-color: #fff;
padding: 0 0.45rem;
color: #000;
cursor: pointer;
line-height: 3; }
.banner .swiper-slide .box .vob a:hover {
background-color: var(--themes);
color: #fff; }
.banner .swiper-slide .videoc {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: block;
z-index: 4;
background-color: rgba(0, 0, 0, 0.3);
opacity: 1;
transition: all ease 0.5s;
z-index: 5; }
.banner .swiper-slide .videoc .vom {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 3; }
.banner .swiper-slide-active .box .bit, .banner .swiper-slide-active .box .more, .banner .swiper-slide-active .box .eim, .banner .swiper-slide-active .box .vob {
opacity: 1;
transform: translate3d(0, 0, 0); }
.banner .swiper-pagination {
bottom: 0.3rem; }
.banner .swiper-pagination-bullet {
opacity: 1;
display: inline-block;
vertical-align: middle;
background-color: #fff;
margin: 0 5px;
width: 0.5rem;
height: 3px;
border-radius: 0;
background-color: rgba(255, 255, 255, 0.4);
opacity: 1; }
.banner .swiper-pagination-bullet-active {
background-color: #fff; }
.banner .btn {
position: absolute;
bottom: 0;
width: 0.17rem;
cursor: pointer;
z-index: 2;
top: 50%;
height: 0.3rem;
font-size: 0;
display: inline-block;
vertical-align: middle;
transform: translateY(-50%);
opacity: 0.5;
transition: all ease 0.5s; }
.banner .btn img {
width: 100%;
display: block; }
.banner .btn:hover {
opacity: 1; }
.banner .bl {
left: 0.4rem; }
.banner .br {
right: 0.4rem; }
@media (max-width: 800px) {
.banner .swiper-slide .box {
left: 5%; }
.banner .swiper-slide .box .bit {
font-size: 16px; }
.banner .swiper-slide .box .eim {
font-size: 12px; }
.banner .swiper-slide .box .more a {
font-size: 12px; }
.banner .bl {
left: 0.05rem; }
.banner .br {
right: 0.05rem; } }
.rightnav {
position: fixed;
right: 0.15rem;
bottom: 10%;
transform: translateY(-50%);
z-index: 10; }
.rightnav .ritm {
display: block;
width: 0.6rem;
height: 0.6rem;
border-radius: 50%;
background-color: var(--themes);
position: relative;
box-shadow: 0px 0px 20px 0px rgba(226, 57, 46, 0.2);
transition: all ease 0.5s; }
.rightnav .ritm a, .rightnav .ritm img {
width: 100%;
display: block; }
.rightnav .ritm + .ritm {
margin-top: 0.15rem; }
.rightnav .ritm:hover {
transform: scale(1.1); }
footer {
width: 100%;
border-bottom: solid 0.08rem var(--themes);
background-color: #2d2d2d; }
footer .ftop {
width: 100%;
padding: 0.8rem 0 1.6rem; }
footer .fbot {
width: 100%; }
footer .fop {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between; }
footer .fop .fol {
display: inline-block;
vertical-align: top;
width: calc(320 / 1600 * 100%); }
footer .fop .fol .fogo {
width: 100%;
font-size: 0; }
footer .fop .fol .fogo a {
display: inline-block;
vertical-align: middle;
width: 1.41rem; }
footer .fop .fol .fogo a img {
width: 100%;
display: block; }
footer .fop .fol .vuls {
width: 100%;
margin-top: 0.36rem; }
footer .fop .fol .vuls .vli {
width: 100%;
font-size: 0; }
footer .fop .fol .vuls .vli .vc {
display: inline-block;
vertical-align: top;
width: 17px;
margin-right: 0.14rem;
margin-top: calc(0.8em - 10px); }
footer .fop .fol .vuls .vli .vc img {
width: 100%;
display: block; }
footer .fop .fol .vuls .vli .cm {
display: inline-block;
vertical-align: top;
width: calc(100% - 17px - 0.14rem);
color: #999;
line-height: 1.6; }
footer .fop .fol .share {
width: 100%;
font-size: 0;
margin-top: 0.34rem; }
footer .fop .fol .share .am {
display: inline-block;
vertical-align: middle;
width: 0.5rem;
height: 0.5rem;
border-radius: 50%;
background-color: rgba(255, 255, 255, 0.9);
margin-right: 0.2rem;
position: relative;
transition: all ease 0.5s; }
footer .fop .fol .share .am a, footer .fop .fol .share .am img {
width: 100%;
display: block; }
footer .fop .fol .share .am .codm {
position: absolute;
left: 50%;
transform: translateX(-50%);
top: calc(100% + 0.1rem);
box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.09);
width: 1.2rem;
background-color: #fff;
padding: 0.06rem;
border-radius: 0.05rem;
display: none;
z-index: 2; }
footer .fop .fol .share .am .codm:after {
content: ' ';
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 100%;
width: 0;
height: 0;
border: solid 0.05rem;
border-color: transparent transparent #fff transparent; }
footer .fop .fol .share .am:hover {
background-color: var(--themes); }
footer .fop .fol .share .am:hover a img {
filter: grayscale(1000%) brightness(2000%); }
footer .fop .fol .share .am:hover .codm {
display: block; }
footer .fop .for {
display: inline-block;
vertical-align: top;
width: calc(960 / 1600 * 100%); }
footer .fop .for .flist {
display: inline-block;
vertical-align: top;
width: calc(240 / 960 * 100%);
text-align: left;
padding-right: 0.15rem; }
footer .fop .for .flist .fit {
width: 100%;
font-size: 0;
margin-bottom: 0.2rem; }
footer .fop .for .flist .fit a {
display: inline-block;
vertical-align: middle;
color: #fff;
line-height: 1.4;
font-weight: bold;
transition: all ease 0.5s; }
footer .fop .for .flist .fit a:hover {
color: var(--themes); }
footer .fop .for .flist .lx {
display: block;
width: 0.2rem;
background-color: var(--themes);
height: 2px;
margin: 0.2rem 0 0.25rem; }
footer .fop .for .flist .ful {
width: 100%; }
footer .fop .for .flist .ful a {
width: 100%;
display: inline-block;
vertical-align: top;
color: rgba(255, 255, 255, 0.6);
transition: all ease 0.5s;
line-height: 2;
line-height: 1.5;
padding: 0.05rem 0; }
footer .fop .for .flist .ful a:hover {
color: #fff; }
footer .fop .for .flist .ful div {
width: 100%;
display: inline-block;
vertical-align: middle;
color: rgba(255, 255, 255, 0.6);
line-height: 2;
transition: all ease 0.5s; }
footer .fob {
width: 100%;
border-top: solid 1px rgba(255, 255, 255, 0.5);
padding: 0.4rem 0;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center; }
footer .fob .fm {
display: inline-block;
vertical-align: middle;
width: auto;
color: white;
line-height: 1.5; }
footer .fob .fm a {
display: inline-block;
vertical-align: middle;
color: white;
line-height: 1.5; }
footer .fob .fm a:hover {
color: var(--themes); }
@media (max-width: 800px) {
footer .ftop {
padding: 0.2rem 0 0; }
footer .fop .fol {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
padding-bottom: 20px; }
footer .fop .fol .fogo {
order: 1;
display: inline-block;
vertical-align: middle;
width: auto; }
footer .fop .fol .fogo a {
width: 90px; }
footer .fop .fol .share {
order: 2;
display: inline-block;
vertical-align: middle;
width: auto; }
footer .fop .fol .share .am {
width: 0.8rem;
height: 0.8rem; }
footer .fop .fol .vuls {
order: 3;
width: 100%; }
footer .fop .for {
width: 100%;
display: none; }
footer .fop .for .flist {
width: 100%;
border-bottom: solid 1px rgba(255, 255, 255, 0.5);
position: relative; }
footer .fop .for .flist .fit {
width: 100%;
margin-bottom: 0;
padding: 0.25rem 0;
margin-left: 0; }
footer .fop .for .flist .fit a {
font-size: 14px; }
footer .fop .for .flist .lx {
display: none; }
footer .fop .for .flist .ful {
width: 100%;
font-size: 0;
padding-bottom: 0.15rem;
display: none;
height: auto; }
footer .fop .for .flist .ful a {
line-height: 2; }
footer .fop .for .flist:last-child {
border: none; }
footer .fop .for .flist:first-child {
border-top: none;
border-top: solid 1px rgba(255, 255, 255, 0.5); }
footer .fop .for .flist.has-ful:after {
content: " ";
display: inline-block;
width: 12px;
height: 7px;
background-image: url("../images/xx1.png");
background-position: center;
background-size: 100% 100%;
text-align: center;
position: absolute;
right: 0.2rem;
left: auto;
transform: translateX(0) rotate(0deg);
top: 0.4rem;
color: #333;
border: none;
transition: all ease 0.5s; }
footer .fop .for .flist.has-ful.show:after {
content: " ";
transform: translateX(0) rotate(180deg); } }
.modular {
width: 100%; }
.modular .mitop {
width: 100%;
text-align: center;
margin-bottom: 0.6rem; }
.modular .mitop .mit {
width: 100%;
color: #000;
line-height: 1.3; }
.modular .mitop .mim {
width: 100%;
color: #666;
line-height: 1.75;
margin-top: 0.1rem;
max-width: 12rem;
margin: 0.1rem auto 0;
display: block; }
.modular .mitop .mim p {
color: #666;
line-height: 1.75; }
.modular .mitop .lx {
display: block;
margin: 0.25rem auto 0;
width: 0.3rem;
height: 3px;
background-color: var(--themes); }
.modular .mitop .vob {
width: 100%;
font-size: 0;
margin-top: 0.4rem;
text-align: center; }
.modular .mitop .vob a {
display: inline-block;
vertical-align: middle;
background-color: transparent;
border: solid 1px var(--themes);
color: var(--themes);
width: auto;
padding: 0 0.5rem;
line-height: 2.8; }
.modular .mitop .vob a:hover {
background-color: var(--themes);
color: #fff; }
.modular .mitop.lefts {
text-align: left; }
.modular .mitop.lefts .lx {
margin: 0.25rem 0 0; }
.modular .mitop.lefts .mim {
margin: 0.1rem 0 0; }
.modular.white .mitop .mit, .modular.white .mitop .mim {
color: #fff; }
.modular.white .mitop .mit p, .modular.white .mitop .mim p {
color: #fff; }
.modular.white .mitop .lx {
background-color: #fff; }
.Servics {
width: 100%;
padding: 1rem 0 0.5rem; }
.Servics .servper {
width: 100%; }
.Servics .servper .swiper-slide {
width: 100%;
padding: 0.4rem 0; }
.Servics .servper .swiper-slide .sic {
display: block;
margin: 0 auto 0.2rem;
width: 1rem;
height: 1rem; }
.Servics .servper .swiper-slide .sic img {
width: 100%;
display: block; }
.Servics .servper .swiper-slide .xim {
width: 100%;
text-align: center;
color: #000;
line-height: 1.5;
height: 4.5em; }
.Servics .servper .swiper-slide .xim p {
color: #000;
line-height: 1.5; }
.Servics .servper .swiper-slide .lx {
display: block;
margin: 0.2rem auto 0;
width: 0.2rem;
height: 3px;
background-color: var(--themes); }
.Servics .servper .swiper-slide .sox {
width: 100%;
position: relative;
transition: all ease 0.5s;
top: 0; }
.Servics .servper .swiper-slide:hover .sox {
top: -0.1rem; }
.Servics .more {
width: 100%;
font-size: 0;
margin-top: 0.5rem;
text-align: center; }
.Servics .more a {
display: inline-block;
vertical-align: middle;
border: solid 1px rgba(0, 0, 0, 0.1);
line-height: 3;
width: auto;
padding: 0 0.5rem;
cursor: pointer; }
.Servics .more a:hover {
border: solid 1px var(--themes);
background-color: var(--themes);
color: #fff; }
.datecens {
width: 100%;
padding: 0.5rem 0 0; }
.datecens .datems {
width: 100%;
position: relative;
overflow: hidden; }
.datecens .datems .pemd {
width: 100%;
position: relative;
z-index: 3; }
.datecens .datems .hei {
width: 100%;
padding-top: 44.27%; }
.datecens .datems .items {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 3; }
.datecens .datems .items .item {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: -1;
opacity: 0;
transition: all ease 0.5s; }
.datecens .datems .items .item .imgs {
width: 100%;
height: 100%;
display: block; }
.datecens .datems .items .item .imgs .img {
width: 100%;
height: 100%;
display: block; }
.datecens .datems .items .item.on {
z-index: 5;
opacity: 1; }
.datecens .datems .botnav {
position: absolute;
bottom: 0;
width: 100%;
z-index: 5;
border-top: solid 1px rgba(255, 255, 255, 0.1); }
.datecens .datems .botnav .swiper-slide {
width: 100%;
height: auto; }
.datecens .datems .botnav .swiper-slide .soc {
width: 100%;
height: 100%;
display: flex;
justify-content: space-between;
align-items: center;
min-height: 1rem;
cursor: pointer;
padding: 0.1rem 0.45rem;
transition: all ease 0.5s; }
.datecens .datems .botnav .swiper-slide .soc .sm {
display: inline-block;
vertical-align: middle;
flex: 1;
padding-right: 0.3rem;
color: #fff;
line-height: 1.5; }
.datecens .datems .botnav .swiper-slide .soc .sc {
display: inline-block;
vertical-align: middle;
width: 0.36rem;
height: 0.36rem; }
.datecens .datems .botnav .swiper-slide .soc .sc img {
width: 100%;
display: block; }
.datecens .datems .botnav .swiper-slide + .swiper-slide {
border-left: solid 1px rgba(255, 255, 255, 0.1); }
.datecens .datems .botnav .swiper-slide.on .soc, .datecens .datems .botnav .swiper-slide:hover .soc {
background-color: var(--themes); }
.datecens .datems .rightom {
position: absolute;
z-index: 4;
width: calc(4.4rem);
right: calc((100% - 16rem) / 2);
height: 100%;
top: 0; }
.datecens .datems .rightom .ritem {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: -1;
opacity: 0;
transition: all ease 0.5s; }
.datecens .datems .rightom .ritem.on {
z-index: 5;
opacity: 1; }
.datecens .datems .rightom .coms {
width: 100%;
height: 100%;
display: flex;
flex-wrap: wrap;
padding: 1rem 0.4rem 0.4rem;
align-content: flex-start; }
.datecens .datems .rightom .coms .cit {
width: 100%;
color: var(--themes);
line-height: 1.2; }
.datecens .datems .rightom .coms .lx {
width: 0.2rem;
height: 2px;
background-color: var(--themes);
margin: 0.25rem 0 0.4rem; }
.datecens .datems .rightom .coms .xul {
width: 100%;
max-height: 4.4rem;
overflow: auto; }
.datecens .datems .rightom .coms .xul .li {
width: 100%;
font-size: 0; }
.datecens .datems .rightom .coms .xul .li .i {
display: inline-block;
vertical-align: top;
width: 5px;
height: 5px;
border-radius: 50%;
margin-right: 0.12rem;
margin-top: calc(0.8em - 2.5px);
background-color: var(--themes); }
.datecens .datems .rightom .coms .xul .li .pem {
display: inline-block;
vertical-align: top;
width: calc(100% - 5px - 0.12rem); }
.datecens .datems .rightom .coms .xul .li .te {
width: 100%;
color: #000;
line-height: 1.6;
font-weight: bold; }
.datecens .datems .rightom .coms .xul .li .km {
width: 100%;
color: #666;
line-height: 1.5;
margin-top: 0.06rem; }
.datecens .datems .rightom .coms .xul .li + .li {
margin-top: 0.14rem; }
.datecens .datems .rightom .coms .xul::-webkit-scrollbar {
width: 4px;
height: 4px;
scrollbar-arrow-color: rgba(0, 0, 0, 0.1); }
.datecens .datems .rightom .coms .xul::-webkit-scrollbar-thumb {
border-radius: 10px;
-webkit-box-shadow: inset 0 0 10px rgba(226, 57, 46, 0.3);
background: rgba(226, 57, 46, 0.3);
scrollbar-arrow-color: rgba(0, 0, 0, 0.1); }
.datecens .datems .rightom .coms .xul::-webkit-scrollbar-track {
border-radius: 10px;
-webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1);
background: rgba(0, 0, 0, 0.1); }
@media (max-width: 800px) {
.datecens .datems .botnav {
position: relative;
background-color: black;
border-top: none; }
.datecens .datems .rightom {
width: 100%;
right: 0;
height: auto;
position: relative;
background-color: #fff; }
.datecens .datems .rightom .ritem {
position: relative;
width: 100%;
height: auto;
display: none; }
.datecens .datems .rightom .ritem.on {
display: block; }
.datecens .datems .rightom .coms {
height: auto;
padding: 20px; } }
.scloud {
width: 100%;
padding: 1rem 0; }
.scloud .sclouom {
width: 100%;
font-size: 0;
display: flex;
flex-wrap: wrap; }
.scloud .sclouom .sclom {
display: inline-block;
vertical-align: middle;
width: calc(235 / 1600 * 100%);
margin-right: calc(29 / 1600 * 100%);
transition: all ease 0.5s;
position: relative;
overflow: hidden;
cursor: pointer; }
.scloud .sclouom .sclom .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.scloud .sclouom .sclom .imgs .img {
width: 100%;
padding-top: 6.25rem;
transition: all ease 0.5s; }
.scloud .sclouom .sclom .som {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: flex;
flex-wrap: wrap;
align-content: flex-end;
padding: 0.4rem 0.3rem; }
.scloud .sclouom .sclom .som .emc {
width: 100%;
color: #fff;
line-height: 1.5;
margin-top: 0.1rem; }
.scloud .sclouom .sclom .som .emc p {
color: #fff;
line-height: 1.5; }
.scloud .sclouom .sclom .som .se {
width: 100%;
color: #fff;
line-height: 1.5; }
.scloud .sclouom .sclom .term {
position: absolute;
left: 0;
top: 0%;
width: 100%;
height: 100%;
display: flex;
flex-wrap: wrap;
align-content: space-between;
padding: 0.4rem 0.3rem;
z-index: 3;
opacity: 0;
transition: all ease 0.5s; }
.scloud .sclouom .sclom .term .pop, .scloud .sclouom .sclom .term .pob {
width: 100%;
font-size: 0; }
.scloud .sclouom .sclom .term .pt {
width: 100%;
color: var(--themes);
font-weight: bold;
line-height: 1.5;
margin-bottom: 0.15rem; }
.scloud .sclouom .sclom .term .xim {
width: 100%;
color: #555;
line-height: 1.5; }
.scloud .sclouom .sclom .term .lx {
display: block;
width: 0.2rem;
height: 2px;
background-color: var(--themes);
margin: 0.2rem 0 0.3rem; }
.scloud .sclouom .sclom .term .xul {
width: 100%; }
.scloud .sclouom .sclom .term .xul .li {
width: 100%;
font-size: 0; }
.scloud .sclouom .sclom .term .xul .li .i {
display: inline-block;
vertical-align: top;
width: 5px;
height: 5px;
border-radius: 50%;
margin-right: 0.12rem;
margin-top: calc(0.8em - 2.5px);
background-color: var(--themes); }
.scloud .sclouom .sclom .term .xul .li .em {
display: inline-block;
vertical-align: top;
width: calc(100% - 5px - 0.12rem);
color: #000;
font-weight: bold;
line-height: 1.6; }
.scloud .sclouom .sclom .term .xul .li + .li {
margin-top: 0.14rem; }
.scloud .sclouom .sclom .term .pob a {
display: inline-block;
vertical-align: middle;
width: auto;
padding: 0 0.5rem;
color: #000;
line-height: 3;
cursor: pointer;
margin-right: 0.12rem;
background-color: #fff; }
.scloud .sclouom .sclom .term .pob a:hover {
color: #fff;
background-color: var(--themes); }
.scloud .sclouom .sclom.on {
width: calc(805 / 1600 * 100%); }
.scloud .sclouom .sclom.on .term {
opacity: 1; }
.scloud .sclouom .sclom.on .som {
opacity: 0; }
.scloud .sclouom .sclom:nth-child(4n) {
margin-right: 0; }
@media (max-width: 800px) {
.scloud .sclouom .sclom {
width: 100% !important;
margin-right: 0; }
.scloud .sclouom .sclom .term {
width: calc(100% + 1px);
opacity: 1;
left: -1px; }
.scloud .sclouom .sclom .som {
opacity: 0; }
.scloud .sclouom .sclom + .sclom {
margin-top: 10px; } }
.Theserver {
width: 100%;
position: relative; }
.Theserver .imgslisd {
width: 100%;
position: absolute;
z-index: 1;
height: 100%;
left: 0;
top: 0; }
.Theserver .imgslisd .imtem {
width: 100%;
position: absolute;
left: 0;
top: 0;
height: 100%;
transition: all ease 0.5s;
opacity: 0;
z-index: -10; }
.Theserver .imgslisd .imtem .imgs {
width: 100%;
height: 100%;
display: block; }
.Theserver .imgslisd .imtem .imgs .img {
width: 100%;
height: 100%;
display: block; }
.Theserver .imgslisd .imtem.on {
opacity: 1;
z-index: 1; }
.Theserver .Thecom {
width: 100%;
position: relative;
z-index: 3;
padding: 1rem 0 0.8rem; }
.Theserver .mesan {
width: 100%;
height: 5rem;
position: relative; }
.Theserver .mesan .mitm {
width: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 2;
width: 5rem;
opacity: 0;
z-index: -1; }
.Theserver .mesan .mitm .mit {
width: 100%;
color: #fff;
line-height: 1.4;
margin-bottom: 0.15rem;
opacity: 0;
transform: translate3d(0, 25%, 0);
transition: opacity 1s ease-out 0.2s,transform 1s ease-out 0.2s,box-shadow .3s; }
.Theserver .mesan .mitm .minp {
width: 100%;
color: #fff;
line-height: 1.4;
overflow: auto;
max-height: 2rem;
opacity: 0;
transform: translate3d(0, 25%, 0);
transition: opacity 1s ease-out 0.2s,transform 1s ease-out 0.2s,box-shadow .3s; }
.Theserver .mesan .mitm .minp p {
color: #fff;
line-height: 1.4; }
.Theserver .mesan .mitm .minp::-webkit-scrollbar {
width: 4px;
height: 4px;
scrollbar-arrow-color: rgba(0, 0, 0, 0.1); }
.Theserver .mesan .mitm .minp::-webkit-scrollbar-thumb {
border-radius: 10px;
-webkit-box-shadow: inset 0 0 10px rgba(226, 57, 46, 0.3);
background: rgba(226, 57, 46, 0.3);
scrollbar-arrow-color: rgba(0, 0, 0, 0.1); }
.Theserver .mesan .mitm .minp::-webkit-scrollbar-track {
border-radius: 10px;
-webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1);
background: rgba(0, 0, 0, 0.1); }
.Theserver .mesan .mitm .more {
width: 100%;
font-size: 0;
margin-top: 0.45rem;
opacity: 0;
transform: translate3d(0, 25%, 0);
transition: opacity 1s ease-out 0.2s,transform 1s ease-out 0.2s,box-shadow .3s; }
.Theserver .mesan .mitm .more a {
display: inline-block;
vertical-align: middle;
background-color: #fff;
color: #333;
line-height: 3;
padding: 0 0.4rem;
width: auto; }
.Theserver .mesan .mitm .more a:hover {
background-color: var(--themes);
color: #fff; }
.Theserver .mesan .mitm.on {
opacity: 1;
z-index: 4; }
.Theserver .mesan .mitm.on .mit, .Theserver .mesan .mitm.on .minp, .Theserver .mesan .mitm.on .more {
opacity: 1;
transform: translate3d(0, 0, 0); }
.Theserver .numpers {
width: 100%; }
.Theserver .numpers .swiper-slide {
width: 100%; }
.Theserver .numpers .swiper-slide .som {
width: 100%;
height: 2.4rem;
border: solid 1px rgba(255, 255, 255, 0.1);
background-color: rgba(0, 0, 0, 0.5);
padding: 0.35rem 0.3rem;
display: flex;
flex-wrap: wrap;
align-content: space-between;
cursor: pointer; }
.Theserver .numpers .swiper-slide .som .sop {
width: 100%;
font-size: 0;
display: flex;
justify-content: space-between;
align-items: center; }
.Theserver .numpers .swiper-slide .som .sop .sc {
display: inline-block;
vertical-align: middle;
width: 0.34rem;
height: 0.34rem; }
.Theserver .numpers .swiper-slide .som .sop .sc img {
width: 100%;
display: block; }
.Theserver .numpers .swiper-slide .som .sop .xm {
display: inline-block;
vertical-align: middle;
width: auto;
color: #fff; }
.Theserver .numpers .swiper-slide .som .sop .xm span {
color: #fff; }
.Theserver .numpers .swiper-slide .som .sub {
width: 100%;
display: block; }
.Theserver .numpers .swiper-slide .som .sub .sit {
width: 100%;
font-size: 0.18rem;
color: #fff;
line-height: 1.4;
transition: all ease 0.5s; }
.Theserver .numpers .swiper-slide .som .sub .set {
width: 100%;
color: #fff;
line-height: 1.5;
height: 0em;
transition: all ease 0.5s;
margin-top: 0rem; }
.Theserver .numpers .swiper-slide.on .som {
background-color: var(--themes); }
.Theserver .numpers .swiper-slide.on .som .sub .sit {
font-size: 0.22rem; }
.Theserver .numpers .swiper-slide.on .som .sub .set {
height: 3em;
margin-top: 0.12rem; }
.terminal {
width: 100%;
padding: 1rem 0; }
.terminal .termlist {
width: 100%;
font-size: 0;
display: flex;
flex-flow: wrap; }
.terminal .termlist .tecom {
display: inline-block;
vertical-align: top;
width: calc(513 / 1600 * 100%);
margin-right: calc(29 / 1600 * 100%);
position: relative;
overflow: hidden; }
.terminal .termlist .tecom .imgs {
width: 100%;
position: relative;
overflow: hidden;
display: block; }
.terminal .termlist .tecom .imgs .img {
width: 100%;
padding-top: 124.75%;
transition: all ease 0.5s; }
.terminal .termlist .tecom .eom {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: flex;
flex-wrap: wrap;
align-content: space-between;
padding: 0.4rem 0.3rem;
z-index: 2;
transition: all ease 0.5s; }
.terminal .termlist .tecom .eom .eop, .terminal .termlist .tecom .eom .eob {
width: 100%;
font-size: 0; }
.terminal .termlist .tecom .eom .ec {
display: block;
width: 0.38rem;
height: 0.38rem;
width: 38px;
height: 38px; }
.terminal .termlist .tecom .eom .ec img {
width: 100%;
display: block; }
.terminal .termlist .tecom .eom .eb {
width: 100%;
color: #fff;
line-height: 1.5; }
.terminal .termlist .tecom .pod {
position: absolute;
left: 0;
top: 100%;
width: 100%;
height: 100%;
display: flex;
flex-wrap: wrap;
align-content: space-between;
padding: 0.4rem 0.3rem;
z-index: 3;
opacity: 0;
background-color: rgba(0, 37, 82, 0.7);
transition: all ease 0.5s; }
.terminal .termlist .tecom .pod .pop, .terminal .termlist .tecom .pod .pob {
width: 100%;
font-size: 0; }
.terminal .termlist .tecom .pod .pt {
width: 100%;
color: #fff;
font-weight: bold;
line-height: 1.5;
margin-bottom: 0.15rem; }
.terminal .termlist .tecom .pod .xim {
width: 100%;
color: #fff;
line-height: 1.5; }
.terminal .termlist .tecom .pod .lx {
display: block;
width: 0.2rem;
height: 2px;
background-color: #fff;
margin: 0.2rem 0 0.3rem; }
.terminal .termlist .tecom .pod .xul {
width: 100%; }
.terminal .termlist .tecom .pod .xul .li {
width: 100%;
font-size: 0; }
.terminal .termlist .tecom .pod .xul .li .i {
display: inline-block;
vertical-align: top;
width: 5px;
height: 5px;
border-radius: 50%;
margin-right: 0.12rem;
margin-top: calc(0.8em - 2.5px);
background-color: #fff; }
.terminal .termlist .tecom .pod .xul .li .em {
display: inline-block;
vertical-align: top;
width: calc(100% - 5px - 0.12rem);
color: #fff;
line-height: 1.6; }
.terminal .termlist .tecom .pod .xul .li + .li {
margin-top: 0.14rem; }
.terminal .termlist .tecom .pod .pob a {
display: inline-block;
vertical-align: middle;
width: auto;
padding: 0 0.5rem;
color: #000;
line-height: 3;
cursor: pointer;
margin-right: 0.12rem;
background-color: #fff; }
.terminal .termlist .tecom .pod .pob a:hover {
color: #fff;
background-color: var(--themes); }
.terminal .termlist .tecom .rc {
position: absolute;
right: 0.4rem;
bottom: 0.4rem;
z-index: 5;
width: 12px;
transition: all ease 0.5s; }
.terminal .termlist .tecom .rc img {
width: 100%;
display: block; }
.terminal .termlist .tecom:nth-child(3n) {
margin-right: 0; }
.terminal .termlist .tecom:hover .pod {
top: 0;
opacity: 1; }
.terminal .termlist .tecom:hover .eom {
opacity: 0; }
.terminal .termlist .tecom:hover .rc {
transform: rotate(180deg); }
.news {
width: 100%;
padding: 1rem 0;
background-color: #f8f8f8; }
.news .newom {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between; }
.news .newom .nwl {
display: inline-block;
vertical-align: middle;
position: relative;
width: calc(785 / 1600 * 100%); }
.news .newom .nwl a {
width: 100%;
display: block; }
.news .newom .nwl .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.news .newom .nwl .imgs .img {
width: 100%;
padding-top: 62.42%;
transition: all ease 0.5s; }
.news .newom .nwl .pox {
position: absolute;
left: 0.3rem;
background-color: #fff;
padding: 0.4rem 0.3rem;
z-index: 2;
width: 2.6rem;
top: 50%;
transform: translateY(-50%);
max-height: 90%; }
.news .newom .nwl .pox .ots {
width: 100%;
color: #111;
line-height: 1.5;
height: 3em; }
.news .newom .nwl .pox .lx {
display: block;
width: 0.2rem;
height: 3px;
background-color: var(--themes);
margin-top: 0.25rem; }
.news .newom .nwl .pox .time {
width: 100%;
color: #666;
line-height: 1.5;
margin-top: 0.6rem; }
.news .newom .nwl .pox .btn {
width: 0.4rem;
height: 0.4rem;
display: block;
margin-top: 0.3rem;
background-color: var(--themes); }
.news .newom .nwl .pox .btn img {
width: 100%;
display: block; }
.news .newom .nwl .pox .btn img:first-child {
display: block; }
.news .newom .nwl .pox .btn img:last-child {
display: none; }
.news .newom .nwl:hover .imgs .img {
transform: scale(1.1); }
.news .newom .nwl:hover .pox {
background-color: var(--themes); }
.news .newom .nwl:hover .pox .ots, .news .newom .nwl:hover .pox .time {
color: #fff; }
.news .newom .nwl:hover .pox .lx, .news .newom .nwl:hover .pox .btn {
background-color: #fff; }
.news .newom .nwl:hover .pox .btn img:first-child {
display: none; }
.news .newom .nwl:hover .pox .btn img:last-child {
display: block; }
.news .newom .nwr {
display: inline-block;
vertical-align: middle;
width: calc(785 / 1600 * 100%);
display: flex;
flex-wrap: wrap;
align-content: space-between; }
.news .newom .nwr .nwrm {
width: 100%; }
.news .newom .nwr .nwrm a {
width: 100%;
display: flex;
flex-wrap: wrap;
font-size: 0;
background-color: #fff; }
.news .newom .nwr .nwrm .imgs {
display: inline-block;
vertical-align: middle;
width: 2.3rem;
position: relative;
overflow: hidden; }
.news .newom .nwr .nwrm .imgs .img {
width: 100%;
padding-top: 62.60%;
transition: all ease 0.5s; }
.news .newom .nwr .nwrm .pom {
display: flex;
align-items: center;
width: calc(100% - 2.3rem); }
.news .newom .nwr .nwrm .pom .time {
display: inline-block;
vertical-align: middle;
width: 1.2rem;
text-align: center;
padding: 0.1rem 0;
border-right: solid 1px rgba(0, 0, 0, 0.1); }
.news .newom .nwr .nwrm .pom .time .aum {
width: 100%;
color: #111;
font-weight: bold;
line-height: 1; }
.news .newom .nwr .nwrm .pom .time .xm {
width: 100%;
color: #666;
line-height: 1.5;
margin-top: 0.05rem; }
.news .newom .nwr .nwrm .pom .pim {
width: calc(100% - 1.2rem);
padding: 0 0.3rem;
color: #111;
line-height: 1.5;
max-height: 3em; }
.news .newom .nwr .nwrm:hover .imgs .img {
transform: scale(1.1); }
.news .newom .nwr .nwrm:hover .pom .pim {
color: var(--themes); }
.news .more {
width: 100%;
font-size: 0;
margin-top: 0.5rem;
text-align: center; }
.news .more a {
display: inline-block;
vertical-align: middle;
border: solid 1px rgba(0, 0, 0, 0.1);
line-height: 3;
width: auto;
padding: 0 0.5rem;
cursor: pointer; }
.news .more a:hover {
border: solid 1px var(--themes);
background-color: var(--themes);
color: #fff; }
.partner {
width: 100%;
padding: 1rem 0;
overflow: hidden; }
.partner .partom {
width: 100%;
position: relative; }
.partner .partom .hei {
width: 100%;
padding-top: 5.3rem; }
.partner .partom .mix {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 3;
display: block;
width: 4.2rem; }
.partner .partom .mix .comp {
width: 100%;
font-size: 0;
text-align: center; }
.partner .partom .mix .comp .cum {
display: inline-block;
vertical-align: middle;
width: auto;
color: #fff; }
.partner .partom .mix .comp .cum span {
display: inline-block;
vertical-align: top;
color: #fff;
font-weight: bold;
font-size: 0.8rem; }
.partner .partom .mix .comp .xp {
display: inline-block;
vertical-align: middle;
width: auto;
color: #fff;
line-height: 1.5;
text-align: left;
margin-left: 0.2rem; }
.partner .partom .mix .more {
width: 100%;
font-size: 0;
text-align: center;
margin-top: 0.5rem; }
.partner .partom .mix .more a {
display: inline-block;
vertical-align: middle;
border: solid 1px #fff;
line-height: 3;
width: auto;
padding: 0 0.4rem;
color: #fff;
transition: all ease 0.5s; }
.partner .partom .mix .more a:hover {
background-color: var(--themes);
border: solid 1px var(--themes); }
.partner .partom .iconlis {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 2; }
.partner .partom .iconlis .icon {
position: absolute;
z-index: 2;
transition: all ease 0.5s; }
.partner .partom .iconlis .ic {
width: 0.9rem;
height: 0.9rem;
border-radius: 50%;
display: block;
background-color: #fff; }
.partner .partom .iconlis .ic .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.partner .partom .iconlis .ic .imgs .img {
width: 100%;
padding-top: 100%;
transition: all ease 0.5s; }
.partner .partom .iconlis .icon:hover {
transform: scale(1.1); }
.partner .partom .iconlis .icon:nth-child(1) {
left: calc(25 / 1600 * 100%);
top: calc(77 / 530 * 100%); }
.partner .partom .iconlis .icon:nth-child(1) .ic {
width: 1.3rem;
height: 1.3rem; }
.partner .partom .iconlis .icon:nth-child(2) {
left: calc(133 / 1600 * 100%);
top: calc(317 / 530 * 100%); }
.partner .partom .iconlis .icon:nth-child(2) .ic {
width: 0.85rem;
height: 0.85rem; }
.partner .partom .iconlis .icon:nth-child(3) {
left: calc(342 / 1600 * 100%);
top: calc(199 / 530 * 100%); }
.partner .partom .iconlis .icon:nth-child(3) .ic {
width: 0.96rem;
height: 0.96rem; }
.partner .partom .iconlis .icon:nth-child(4) {
left: calc(410 / 1600 * 100%);
top: calc(0 / 530 * 100%); }
.partner .partom .iconlis .icon:nth-child(4) .ic {
width: 1.1rem;
height: 1.1rem; }
.partner .partom .iconlis .icon:nth-child(5) {
left: calc(447 / 1600 * 100%);
top: calc(375 / 530 * 100%); }
.partner .partom .iconlis .icon:nth-child(5) .ic {
width: 0.96rem;
height: 0.96rem; }
.partner .partom .iconlis .icon:nth-child(6) {
left: calc(702 / 1600 * 100%);
top: calc(434 / 530 * 100%); }
.partner .partom .iconlis .icon:nth-child(7) {
left: calc(823 / 1600 * 100%);
top: calc(42 / 530 * 100%); }
.partner .partom .iconlis .icon:nth-child(8) {
left: calc(970 / 1600 * 100%);
top: calc(342 / 530 * 100%); }
.partner .partom .iconlis .icon:nth-child(8) .ic {
width: 1.1rem;
height: 1.1rem; }
.partner .partom .iconlis .icon:nth-child(9) {
left: calc(1131 / 1600 * 100%);
top: calc(107 / 530 * 100%); }
.partner .partom .iconlis .icon:nth-child(9) .ic {
width: 1rem;
height: 1rem; }
.partner .partom .iconlis .icon:nth-child(10) {
left: calc(1228 / 1600 * 100%);
top: calc(328 / 530 * 100%); }
.partner .partom .iconlis .icon:nth-child(11) {
left: calc(1371 / 1600 * 100%);
top: calc(0 / 530 * 100%); }
.partner .partom .iconlis .icon:nth-child(11) .ic {
width: 1.2rem;
height: 1.2rem; }
.partner .partom .iconlis .icon:nth-child(12) {
left: calc(1487 / 1600 * 100%);
top: calc(287 / 530 * 100%); }
@media (max-width: 800px) {
.partner .partom .hei {
padding-top: 7rem; }
.partner .partom .iconlis .icon:nth-child(3) {
left: calc(80 / 1600 * 100%);
top: calc(199 / 530 * 100%); }
.partner .partom .iconlis .icon:nth-child(12) {
left: calc(1387 / 1600 * 100%);
top: calc(187 / 530 * 100%); }
.partner .partom .iconlis .icon:nth-child(10) {
left: calc(1328 / 1600 * 100%);
top: calc(288 / 530 * 100%); } }
.parteom {
width: 100%;
padding: 1rem 0; }
.parteom .patop {
width: 100%;
margin-bottom: 1rem;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-end; }
.parteom .patop .pal {
display: inline-block;
vertical-align: middle;
width: auto; }
.parteom .patop .pal .mitop {
margin-bottom: 0; }
.parteom .patop .par {
display: inline-block;
vertical-align: middle;
width: 9.8rem; }
.parteom .patop .par .pinp {
width: 100%;
color: #fff;
line-height: 1.6; }
.parteom .patop .par .pinp p {
color: #fff;
line-height: 1.6; }
.parteom .partom {
width: 100%;
position: relative; }
.parteom .partom .hei {
width: 100%;
padding-top: 5.3rem; }
.parteom .partom .mix {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 3;
display: block;
width: 4.2rem; }
.parteom .partom .mix .comp {
width: 100%;
font-size: 0;
text-align: center; }
.parteom .partom .mix .comp .cum {
display: inline-block;
vertical-align: middle;
width: auto;
color: #fff; }
.parteom .partom .mix .comp .cum span {
display: inline-block;
vertical-align: top;
color: #fff;
font-weight: bold;
font-size: 0.8rem; }
.parteom .partom .mix .comp .xp {
display: inline-block;
vertical-align: middle;
width: auto;
color: #fff;
line-height: 1.5;
text-align: left;
margin-left: 0.2rem; }
.parteom .partom .mix .more {
width: 100%;
font-size: 0;
text-align: center;
margin-top: 0.5rem; }
.parteom .partom .mix .more a {
display: inline-block;
vertical-align: middle;
border: solid 1px #fff;
line-height: 3;
width: auto;
padding: 0 0.4rem;
color: #fff;
transition: all ease 0.5s; }
.parteom .partom .mix .more a:hover {
background-color: var(--themes);
border: solid 1px var(--themes); }
.parteom .partom .iconlis {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 2; }
.parteom .partom .iconlis .icon {
position: absolute;
z-index: 2;
transition: all ease 0.5s; }
.parteom .partom .iconlis .ic {
width: 0.9rem;
height: 0.9rem;
border-radius: 50%;
display: block;
background-color: #fff; }
.parteom .partom .iconlis .ic .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.parteom .partom .iconlis .ic .imgs .img {
width: 100%;
padding-top: 100%;
transition: all ease 0.5s; }
.parteom .partom .iconlis .icon:hover {
transform: scale(1.1); }
.parteom .partom .iconlis .icon:nth-child(1) {
left: calc(25 / 1600 * 100%);
top: calc(77 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(1) .ic {
width: 1.3rem;
height: 1.3rem; }
.parteom .partom .iconlis .icon:nth-child(2) {
left: calc(133 / 1600 * 100%);
top: calc(317 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(2) .ic {
width: 0.85rem;
height: 0.85rem; }
.parteom .partom .iconlis .icon:nth-child(3) {
left: calc(350 / 1600 * 100%);
top: calc(241 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(3) .ic {
width: 0.96rem;
height: 0.96rem; }
.parteom .partom .iconlis .icon:nth-child(4) {
left: calc(410 / 1600 * 100%);
top: calc(0 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(4) .ic {
width: 1.1rem;
height: 1.1rem; }
.parteom .partom .iconlis .icon:nth-child(5) {
left: calc(447 / 1600 * 100%);
top: calc(375 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(5) .ic {
width: 0.96rem;
height: 0.96rem; }
.parteom .partom .iconlis .icon:nth-child(6) {
left: calc(702 / 1600 * 100%);
top: calc(434 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(7) {
left: calc(823 / 1600 * 100%);
top: calc(42 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(8) {
left: calc(970 / 1600 * 100%);
top: calc(342 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(8) .ic {
width: 1.1rem;
height: 1.1rem; }
.parteom .partom .iconlis .icon:nth-child(9) {
left: calc(1061 / 1600 * 100%);
top: calc(107 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(9) .ic {
width: 1rem;
height: 1rem; }
.parteom .partom .iconlis .icon:nth-child(10) {
left: calc(1228 / 1600 * 100%);
top: calc(328 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(11) {
left: calc(1371 / 1600 * 100%);
top: calc(0 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(11) .ic {
width: 1.2rem;
height: 1.2rem; }
.parteom .partom .iconlis .icon:nth-child(12) {
left: calc(1487 / 1600 * 100%);
top: calc(287 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(13) {
left: calc(250 / 1600 * 100%);
top: calc(116 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(13) .ic {
width: 0.81rem;
height: 0.81rem; }
.parteom .partom .iconlis .icon:nth-child(14) {
left: calc(1396 / 1600 * 100%);
top: calc(430 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(14) .ic {
width: 1rem;
height: 1rem; }
.parteom .partom .iconlis .icon:nth-child(15) {
left: calc(1285 / 1600 * 100%);
top: calc(173 / 530 * 100%); }
.parteom .partom .iconlis .oc {
position: absolute;
z-index: 2;
transition: all ease 0.5s; }
.parteom .partom .iconlis .oc {
width: 0.3rem;
height: 0.3rem;
border-radius: 50%;
display: block;
background-color: #fff;
opacity: 0.4; }
.parteom .partom .iconlis .oc .om {
width: 100%;
position: relative;
overflow: hidden;
padding-top: 100%;
transition: all ease 0.5s; }
.parteom .partom .iconlis .oc:nth-child(16) {
left: calc(300 / 1600 * 100%);
top: calc(430 / 530 * 100%); }
.parteom .partom .iconlis .oc:nth-child(17) {
left: calc(660 / 1600 * 100%);
top: calc(84 / 530 * 100%); }
.parteom .partom .iconlis .oc:nth-child(18) {
left: calc(1435 / 1600 * 100%);
top: calc(226 / 530 * 100%); }
@media (max-width: 800px) {
.parteom .partom .hei {
padding-top: 7rem; }
.parteom .partom .iconlis .icon:nth-child(3) {
left: calc(80 / 1600 * 100%);
top: calc(199 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(12) {
left: calc(1387 / 1600 * 100%);
top: calc(240 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(10) {
left: calc(1328 / 1600 * 100%);
top: calc(325 / 530 * 100%); }
.parteom .partom .iconlis .icon:nth-child(13) {
left: calc(350 / 1600 * 100%);
top: calc(116 / 530 * 100%); } }
.nanner {
width: 100%;
overflow: hidden;
position: relative; }
.nanner .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.nanner .imgs .img {
width: 100%;
padding-top: 31.25%; }
.nanner .nox {
position: absolute;
left: calc((100% - 16rem) / 2);
top: 50%;
transform: translateY(-50%); }
.nanner .nox .nit {
width: 100%;
color: #fff;
line-height: 1.5;
position: relative; }
.nanner .nox .nit span {
display: inline-block;
vertical-align: middle;
width: 0.74rem;
position: absolute;
left: -0.45rem;
top: 50%;
display: none;
transform: translate(-50%, -50%);
z-index: -1; }
@media (max-width: 1680px) {
.nanner .nox {
left: 5%; } }
@media (max-width: 800px) {
.nanner .nox {
left: 3%; } }
.crumbs {
width: 100%;
background-color: transparent;
position: relative;
background-color: #fff;
box-shadow: 0px 0px 16px 0px rgba(204, 204, 204, 0.28);
border-bottom: solid 1px #d9d9d9; }
.crumbs .column {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-items: center;
font-size: 0;
position: relative; }
.crumbs .column .colum {
width: auto;
font-size: 0;
display: inline-block;
vertical-align: middle;
z-index: 2;
position: relative; }
.crumbs .column .colum .home {
display: inline-block;
vertical-align: middle;
width: 20px;
height: 20px;
margin-right: .1rem;
position: relative;
top: -0.02rem; }
.crumbs .column .colum .home img {
width: 100%;
display: block; }
.crumbs .column .colum .sm {
display: inline-block;
vertical-align: middle;
color: #666;
line-height: 3; }
.crumbs .column .colum a {
display: inline-block;
vertical-align: middle;
width: auto;
color: #333;
line-height: 3;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis; }
.crumbs .column .colum a span {
display: inline-block;
color: #333;
line-height: 3;
position: relative;
margin: 0 .08rem; }
.crumbs .column .colum a span img {
width: 100%;
display: block; }
.crumbs .column .colum a:hover {
color: var(--themes); }
.crumbs .column .colum a:last-child span {
display: none; }
.crumbs .column .cul {
display: inline-block;
vertical-align: middle;
flex: 1;
z-index: 2;
position: relative; }
.crumbs .column .cul .swiper-slide {
display: inline-block;
vertical-align: middle;
width: auto;
margin-right: 0.6rem;
position: relative; }
.crumbs .column .cul .swiper-slide a {
display: inline-block;
vertical-align: middle;
color: #999;
line-height: 1rem;
width: auto;
transition: all ease 0.5s; }
.crumbs .column .cul .swiper-slide a span {
display: inline-block;
vertical-align: middle;
width: 0.1rem;
margin-right: 0.1rem;
opacity: 0;
transition: all ease 0.5s; }
.crumbs .column .cul .swiper-slide a span img {
width: 100%;
display: block; }
.crumbs .column .cul .swiper-slide:after {
content: ' '; }
.crumbs .column .cul .swiper-slide.on a {
color: #333; }
.crumbs .column .cul .swiper-slide.on a span {
opacity: 1; }
.crumbs .column .cul .swiper-slide.on:after {
opacity: 1;
background-color: var(--themes); }
.crumbs .column .cul .swiper-slide:hover a {
color: #333; }
.crumbs .column .cul .swiper-slide:hover:after {
opacity: 1;
background-color: var(--themes); }
.crumbs .column .cul .swiper-scrollbar {
background-color: rgba(0, 0, 0, 0.1);
left: 0;
right: 0;
width: 100%;
bottom: 0;
display: none; }
.crumbs .column .cul .swiper-scrollbar-drag {
background-color: var(--themes); }
.crumbs .column .cul.pbs .swiper-container {
padding-bottom: 0.15rem; }
.crumbs .column .cul.pbs .swiper-scrollbar {
display: block; }
.crumbs .column.xl {
justify-content: space-between;
font-size: 0;
align-items: center; }
.crumbs.no:after {
display: none; }
@media (max-width: 800px) {
.crumbs .w1600 {
width: 100%; }
.crumbs .column .colum {
padding: 0 0.2rem;
border-bottom: solid 1px #eee; }
.crumbs .column .cul {
padding: 0 0.2rem; }
.crumbs .column .cul .swiper-wrapper {
justify-content: flex-start; } }
.informations {
width: 100%;
padding: 1rem 0; }
.informations .infoms {
width: 100%;
display: flex;
flex-wrap: wrap; }
.informations .infoms .foml {
display: inline-block;
vertical-align: middle;
width: calc(678 / 1600 * 100%);
margin-right: calc(60 / 1600 * 100%);
position: relative; }
.informations .infoms .foml .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.informations .infoms .foml .imgs .img {
width: 100%;
padding-top: 88.49%;
transition: all ease 0.5s; }
.informations .infoms .fomr {
display: inline-block;
vertical-align: middle;
width: calc(790 / 1600 * 100%); }
.informations .infoms .fomr .fit {
width: 100%;
color: #000;
font-weight: bold;
line-height: 1.3;
margin-bottom: 0.3rem; }
.informations .infoms .fomr .finp {
width: 100%;
color: #666;
line-height: 1.75; }
.informations .infoms .fomr .finp p {
color: #666;
line-height: 1.75; }
.informations .infoms .fomr .dates {
width: 100%;
font-size: 0;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin-top: 0.6rem; }
.informations .infoms .fomr .dates .daum {
display: inline-block;
vertical-align: middle;
width: auto; }
.informations .infoms .fomr .dates .daum .xum {
width: 100%;
color: var(--themes); }
.informations .infoms .fomr .dates .daum .xum span {
font-weight: bold; }
.informations .infoms .fomr .dates .daum .xum span.bt {
vertical-align: top; }
.informations .infoms .fomr .dates .daum .pm {
width: 100%;
color: #666;
line-height: 1.5; }
.facilities {
width: 100%;
overflow: hidden;
background-color: #f3f3f3; }
.facilities .faciom {
width: 100%;
display: flex;
flex-wrap: wrap;
flex-direction: row-reverse;
align-items: center; }
.facilities .faciom .fal {
display: inline-block;
vertical-align: middle;
width: calc(1150 / 1920 * 100%);
position: relative; }
.facilities .faciom .fal .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.facilities .faciom .fal .imgs .img {
width: 100%;
padding-top: 59.13%;
transition: all ease 0.5s; }
.facilities .faciom .far {
display: inline-block;
vertical-align: middle;
width: calc(770 / 1920 * 100%);
padding-left: calc(160 / 1920 * 100%);
padding-right: 1rem;
padding-top: 0.5rem;
padding-bottom: 0.5rem; }
.facilities .faciom .far .iconlis {
width: 100%;
font-size: 0; }
.facilities .faciom .far .iconlis .ictom {
width: 100%; }
.facilities .faciom .far .iconlis .ictom .ic {
display: inline-block;
vertical-align: middle;
width: 0.44rem;
height: 0.44rem;
margin-right: 0.15rem; }
.facilities .faciom .far .iconlis .ictom .ic img {
width: 100%;
display: block; }
.facilities .faciom .far .iconlis .ictom .km {
display: inline-block;
vertical-align: middle;
width: calc(100% - 0.15rem - 0.44rem);
color: #666;
line-height: 1.5; }
.facilities .faciom .far .iconlis .ictom + .ictom {
margin-top: 0.3rem; }
.Globals {
width: 100%;
padding: 1rem 0; }
.Globals .globalis {
width: 100%;
font-size: 0; }
.Globals .globalis .gloem {
display: inline-block;
vertical-align: top;
width: calc(510 / 1600 * 100%);
margin-right: calc(34 / 1600 * 100%);
cursor: pointer;
position: relative; }
.Globals .globalis .gloem .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.Globals .globalis .gloem .imgs .img {
width: 100%;
padding-top: 120.39%;
transition: all ease 0.5s; }
.Globals .globalis .gloem .gom {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: flex;
flex-wrap: wrap;
align-content: center;
text-align: center; }
.Globals .globalis .gloem .gom .gtn {
display: block;
margin: 0 auto 0.6rem;
width: 1.12rem;
height: 1.12rem;
position: relative; }
.Globals .globalis .gloem .gom .gtn img {
width: 100%;
display: block; }
.Globals .globalis .gloem .gom .gtn .gg {
width: 100%;
height: 100%;
display: block; }
.Globals .globalis .gloem .gom .gtn .gc {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 1.12rem;
height: 1.12rem; }
.Globals .globalis .gloem .gom .git {
width: 100%;
color: #fff;
line-height: 1.5; }
.Globals .globalis .gloem .gom .lx {
height: 0.3rem;
width: 1px;
margin: 0.3rem auto;
background-color: #fff; }
.Globals .globalis .gloem .gom .sim {
width: 100%;
color: #fff;
line-height: 1.6; }
.Globals .globalis .gloem .gom .sim p {
color: #fff;
line-height: 1.6; }
.Globals .globalis .gloem:hover .imgs .img {
transform: scale(1.1); }
.Globals .globalis .gloem:nth-child(3n) {
margin-right: 0; }
.honors {
width: 100%;
padding: 1rem 0 2.8rem;
position: relative; }
.honors .bg1 {
position: absolute;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
opacity: 1; }
.honors .bg2 {
position: absolute;
z-index: -1;
left: 0;
top: 0;
width: 100%;
height: 100%;
opacity: 0; }
.honors .w1600 {
position: relative;
z-index: 3; }
.honors .hinp {
width: 100%;
color: #333;
line-height: 1.6; }
.honors .hinp p {
color: #333;
line-height: 1.6; }
.honors .hins {
width: 100%;
margin-top: 0.5rem;
max-width: 4.2rem; }
.honors .hins .hil {
width: 100%;
font-size: 0;
padding: 0.1rem 0; }
.honors .hins .hil .i {
display: inline-block;
vertical-align: top;
width: 0.08rem;
height: 0.08rem;
width: 8px;
height: 8px;
border-radius: 50%;
background-color: var(--themes);
margin-right: 0.12rem;
margin-top: calc(0.8em - 4px); }
.honors .hins .hil .hm {
display: inline-block;
vertical-align: top;
width: calc(100% - 8px - 0.12rem);
color: #333;
line-height: 1.6; }
@media (max-width: 800px) {
.honors .bg1 {
opacity: 0;
z-index: -1; }
.honors .bg2 {
opacity: 1;
z-index: 1; } }
.services {
width: 100%;
padding: 1rem 0; }
.services .sinp {
width: 100%;
color: #666;
line-height: 1.6; }
.services .sinp p {
color: #666;
line-height: 1.6; }
.services .serpers {
width: 100%;
margin-top: 0.6rem; }
.services .serpers .swiper-slide {
width: 100%;
height: 5rem; }
.services .serpers .swiper-slide a {
width: 100%;
display: block;
position: relative; }
.services .serpers .swiper-slide .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.services .serpers .swiper-slide .imgs .img {
width: 100%;
padding-top: 4.4rem;
transition: all ease 0.5s; }
.services .serpers .swiper-slide .pox {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: flex;
flex-wrap: wrap;
align-items: flex-end;
padding: 0.3rem 0.5rem;
transition: all ease 0.5s; }
.services .serpers .swiper-slide .pox .bg1 {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
opacity: 1;
transition: all ease 0.5s; }
.services .serpers .swiper-slide .pox .bg2 {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
opacity: 0;
transition: all ease 0.5s; }
.services .serpers .swiper-slide .pox .sim {
width: 100%;
position: relative;
z-index: 3;
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
height: auto;
align-items: center; }
.services .serpers .swiper-slide .pox .sim .sm {
display: inline-block;
vertical-align: middle;
color: #fff;
line-height: 1.5;
width: auto;
height: 1.5em; }
.services .serpers .swiper-slide .pox .sim .rtn {
display: inline-block;
vertical-align: middle;
background-color: #fff;
width: 0;
overflow: hidden;
line-height: 2.6;
color: #000;
height: 2.6em; }
.services .serpers .swiper-slide .pox .sim .rtn span {
display: inline-block;
vertical-align: middle;
width: 12px;
margin-left: 0.1rem; }
.services .serpers .swiper-slide .pox .sim .rtn span img {
width: 100%;
display: block; }
.services .serpers .swiper-slide:hover .imgs .img, .services .serpers .swiper-slide.on .imgs .img {
padding-top: 5rem; }
.services .serpers .swiper-slide:hover .pox .bg1, .services .serpers .swiper-slide.on .pox .bg1 {
opacity: 0; }
.services .serpers .swiper-slide:hover .pox .bg2, .services .serpers .swiper-slide.on .pox .bg2 {
opacity: 1; }
.services .serpers .swiper-slide:hover .pox .sim, .services .serpers .swiper-slide.on .pox .sim {
justify-content: space-between; }
.services .serpers .swiper-slide:hover .pox .sim .rtn, .services .serpers .swiper-slide.on .pox .sim .rtn {
width: auto;
padding: 0 0.25rem 0 0.4rem; }
.sercomd {
width: 100%; }
.sercomd .serom {
width: 100%;
display: none;
padding: 1rem 0 0; }
.sercomd .serom.on {
display: block; }
.sercomd .serop {
width: 100%;
font-size: 0;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin-bottom: 0.65rem; }
.sercomd .serop .sel {
display: inline-block;
vertical-align: middle;
width: auto;
max-width: 8rem; }
.sercomd .serop .sel .mit {
width: 100%;
color: #000;
line-height: 1.3; }
.sercomd .serop .sel .mim {
width: 100%;
color: #666;
line-height: 1.75;
margin-top: 0.1rem;
max-width: 10rem;
margin: 0.1rem auto 0;
display: block; }
.sercomd .serop .sel .mim p {
color: #666;
line-height: 1.75; }
.sercomd .serop .ser {
display: inline-block;
vertical-align: middle;
width: auto; }
.sercomd .serop .ser a {
display: inline-block;
vertical-align: middle;
width: auto;
padding: 0 0.4rem;
line-height: 2.8;
color: #000;
background-color: #fff; }
.sercomd .serop .ser a span {
display: inline-block;
vertical-align: middle;
width: 16px;
transform: rotate(180deg);
margin-left: 0.1rem;
position: relative;
top: -0.015rem; }
.sercomd .serop .ser a span img {
width: 100%;
display: block; }
.sercomd .serop .ser a:hover {
background-color: var(--themes);
color: #fff; }
.sercomd .serop .ser a:hover span img {
filter: grayscale(1000%) brightness(2000%); }
.sercomd .tecoms {
width: calc(1760 / 1920 * 100%);
width: calc(100% - (100vw - 16rem) / 2);
display: block;
background-color: #fff;
margin-left: calc(160 / 1920 * 100%);
font-size: 0;
padding: 0.8rem calc(160 / 1920 * 100%) 0.8rem 0.9rem;
padding: 0.8rem calc((100vw - 16rem) / 2) 0.8rem 0.9rem; }
.sercomd .tecoms .trvom {
display: inline-block;
vertical-align: top;
width: 100%;
/* width: calc(665 / 1410 * 100%); */
/* margin-right: calc(79 / 1410 * 100%); */
}
.sercomd .tecoms .trvom a {
width: 100%;
display: block; }
.sercomd .tecoms .trvom .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.sercomd .tecoms .trvom .imgs .img {
width: 100%;
padding-top: 53.40%;
transition: all ease 0.5s; }
.sercomd .tecoms .trvom .lom {
width: 100%;
padding: 0.2rem 0.25rem; }
.sercomd .tecoms .trvom .lom .lt {
width: 100%;
color: #333;
line-height: 1.5; }
.sercomd .tecoms .trvom .lom .sm {
width: 100%;
color: #666;
line-height: 1.6; }
.sercomd .tecoms .trvom:nth-child(2n) {
margin-right: 0; }
.sercomd .tecoms .trvom:hover .imgs .img {
transform: scale(1.1); }
.sercomd .tecoms .btn {
position: absolute;
z-index: 3;
width: 0.4rem;
height: 0.4rem;
border-radius: 50%;
display: block;
top: 50%;
transform: translateY(-50%);
cursor: pointer;
background-color: #fff;
border: solid 1px #eee; }
.sercomd .tecoms .btn img:first-child {
display: block; }
.sercomd .tecoms .btn img:last-child {
display: none; }
.sercomd .tecoms .btn:hover {
background-color: var(--themes);
border: solid 1px var(--themes); }
.sercomd .tecoms .btn:hover img:first-child {
display: none; }
.sercomd .tecoms .btn:hover img:last-child {
display: block; }
.sercomd .tecoms .bl {
left: 0.3rem; }
.sercomd .tecoms .br {
right: 0.5rem; }
.sercomd .betom {
width: 100%;
font-size: 0;
display: flex;
flex-wrap: wrap; }
.sercomd .betom .bel {
display: inline-block;
vertical-align: middle;
width: calc((100vw - 16rem) / 2);
background-color: #fff; }
.sercomd .betom .ber {
display: inline-block;
vertical-align: middle;
width: calc(100% - (100vw - 16rem) / 2);
padding: 0.5rem calc((100vw - 16rem) / 2) 0.5rem 0.9rem; }
.sercomd .betom .ber .imgs {
display: inline-block;
vertical-align: middle;
width: calc(3.46rem);
margin-right: 0.4rem;
position: relative;
overflow: hidden;
background-color: #fff; }
.sercomd .betom .ber .imgs .img {
width: 100%;
padding-top: 35.26%;
transition: all ease 0.5s; }
.sercomd .betom .ber .rom {
display: inline-block;
vertical-align: middle;
width: calc(100% - 3.46rem - 0.4rem); }
.sercomd .betom .ber .rom .rt {
width: 100%;
color: #333;
line-height: 1.4; }
.sercomd .betom .ber .rom .rip {
width: 100%;
color: #666;
line-height: 1.5;
margin-top: 0.14rem; }
@media (max-width: 1680px) {
.sercomd .tecoms {
width: 95%;
padding: 0.8rem calc((100vw - 90%) / 2) 0.8rem 0.9rem;
margin-left: 5%; }
.sercomd .betom .bel {
width: 5%; }
.sercomd .betom .ber {
width: 95%;
padding: 0.5rem calc((100vw - 90%) / 2) 0.5rem 0.9rem; } }
@media (max-width: 800px) {
.sercomd .tecoms {
padding-left: 5%;
padding-top: 0.3rem;
padding-bottom: 0.3rem;
padding-right: 5%;
width: 100%;
margin-left: 0; }
.sercomd .tecoms .trvom {
width: 100%;
margin-right: 0; }
/* .sercomd .tecoms .trvom + .trvom {
margin-top: 0.3rem; } */
.sercomd .betom {
width: 100%; }
.sercomd .betom .bel {
display: none; }
.sercomd .betom .ber {
width: 100%;
padding-left: 5%; }
.sercomd .betom .ber .imgs {
width: 100%;
margin-right: 0; }
.sercomd .betom .ber .rom {
width: 100%;
margin-top: 0.3rem; } }
.works {
width: 100%;
padding: 1rem 0;
position: relative; }
.works .w1600 {
position: relative;
z-index: 2; }
.works .wmgs {
width: 100%;
position: relative; }
.works .wmgs .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.works .wmgs .imgs .img {
width: 100%;
padding-top: 44.25%; }
.works .wmgs .vic {
position: absolute;
right: 0;
bottom: 0;
background-color: var(--themes);
padding: 0.4rem 0.3rem;
width: 4.5rem;
z-index: 2; }
.works .wmgs .vic .vinp {
width: 100%;
color: #fff;
line-height: 1.5;
font-size: 0.16rem; }
.works .wmgs .vic .vinp p {
color: #fff;
line-height: 1.5; }
.works:after {
content: ' ';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: calc(1rem + 0.8rem + 4.5em);
font-size: 0.16rem;
background-color: #f3f3f3; }
.matrix {
width: 100%;
padding: 1rem 0; }
.matrix .marop {
width: 100%;
font-size: 0; }
.matrix .marop .matm {
display: inline-block;
vertical-align: top;
width: calc(780 / 1600 * 100%);
margin-right: calc(39 / 1600 * 100%);
position: relative;
margin-bottom: 0.4rem; }
.matrix .marop .matm a {
width: 100%;
display: block;
cursor: auto; }
.matrix .marop .matm .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.matrix .marop .matm .imgs .img {
width: 100%;
padding-top: 64.10%;
transition: all ease 0.5s; }
.matrix .marop .matm .mox {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
padding: 0.3rem 0.5rem;
display: flex;
flex-wrap: wrap;
align-items: flex-end; }
.matrix .marop .matm .mox .ic {
position: absolute;
width: 0.6rem;
height: 0.6rem;
right: 0.5rem;
top: 0.5rem;
z-index: 2; }
.matrix .marop .matm .mox .ic img {
width: 100%;
display: block; }
.matrix .marop .matm .mox .mod {
width: 100%; }
.matrix .marop .matm .mox .mod .mit {
width: 100%;
color: #fff;
line-height: 1.5;
margin-bottom: 0.12rem; }
.matrix .marop .matm .mox .mod .mp {
width: 100%;
color: #fff;
line-height: 1.5; }
.matrix .marop .matm:nth-child(2n) {
margin-right: 0; }
.matrix .marop .matm:hover .imgs .img {
transform: scale(1.1); }
.matrix .marob {
width: 100%; }
.matrix .marob a {
width: 100%;
display: block;
cursor: auto; }
.matrix .marob .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.matrix .marob .imgs .img {
width: 100%;
padding-top: 31.25%;
transition: all ease 0.5s; }
.matrix .marob .mox {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
padding: 0.3rem 0.5rem;
display: flex;
flex-wrap: wrap;
align-items: flex-end; }
.matrix .marob .mox .ic {
position: absolute;
width: 0.6rem;
height: 0.6rem;
right: 0.5rem;
top: 0.5rem;
z-index: 2; }
.matrix .marob .mox .ic img {
width: 100%;
display: block; }
.matrix .marob .mox .mod {
width: 100%; }
.matrix .marob .mox .mod .mit {
width: 100%;
color: #fff;
line-height: 1.5;
margin-bottom: 0.12rem; }
.matrix .marob .mox .mod .mp {
width: 100%;
color: #fff;
line-height: 1.5; }
.matrix .marob:hover .imgs .img {
transform: scale(1.1); }
@media (max-width: 800px) {
.matrix .marob .imgs .img {
padding-top: 75%; }
.matrix .marop .matm .imgs .img {
padding-top: 75%; } }
.clouds {
width: 100%;
padding: 1.1rem 0; }
.clouds .clounav {
width: 100%;
border-top: solid 1px #c1d4db;
border-bottom: solid 1px #c1d4db; }
.clouds .clounav .swiper-slide {
width: 100%;
position: relative;
display: inline-block;
vertical-align: middle;
width: 25%;
position: relative; }
.clouds .clounav .swiper-slide a {
width: 100%;
display: block;
line-height: 0.8rem;
color: #666;
text-align: center; }
.clouds .clounav .swiper-slide span {
position: absolute;
bottom: 0;
width: 100%;
height: 3px;
left: 0;
z-index: 2;
opacity: 0;
transition: all ease 0.5s;
font-size: 0; }
.clouds .clounav .swiper-slide span img {
width: 100%;
display: block; }
.clouds .clounav .swiper-slide.on span, .clouds .clounav .swiper-slide:hover span {
opacity: 1; }
.clouds .conts {
width: 100%;
margin-top: 0.65rem; }
.clouds .conts .coium {
width: 100%;
display: none; }
.clouds .conts .coium.on {
display: block; }
.clouds .conts .steam {
width: 100%;
font-size: 0;
display: flex;
flex-wrap: wrap; }
.clouds .conts .steam .stel {
display: inline-block;
vertical-align: middle;
width: calc(860 / 1600 * 100%); }
.clouds .conts .steam .stel .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.clouds .conts .steam .stel .imgs .img {
width: 100%;
padding-top: 65.11%;
transition: all ease 0.5s; }
.clouds .conts .steam .ster {
display: inline-block;
vertical-align: middle;
width: calc(740 / 1600 * 100%);
padding: 0.4rem 0.9rem;
display: flex;
flex-wrap: wrap;
align-content: center; }
.clouds .conts .steam .ster .sit {
width: 100%;
color: var(--themes);
line-height: 1.4;
margin-bottom: 0.22rem; }
.clouds .conts .steam .ster .sinp {
width: 100%;
color: #666;
line-height: 1.5;
margin-bottom: 0.3rem; }
.clouds .conts .steam .ster .sinp p {
color: #666;
line-height: 1.5; }
.clouds .conts .steam .ster .xuls {
width: 100%; }
.clouds .conts .steam .ster .xuls .xli {
width: 100%;
font-size: 0;
padding: 0.06rem 0; }
.clouds .conts .steam .ster .xuls .xli .ic {
display: inline-block;
vertical-align: middle;
width: 12px;
margin-right: 0.15rem;
margin-top: calc(0.8em - 6px); }
.clouds .conts .steam .ster .xuls .xli .ic img {
width: 100%;
display: block; }
.clouds .conts .steam .ster .xuls .xli .cm {
display: inline-block;
vertical-align: top;
width: calc(100% - 12px - 0.15rem);
color: #666;
line-height: 1.6; }
@media (max-width: 800px) {
.clouds .clounav .swiper-slide {
width: 50%; } }
.newsom {
width: 100%;
padding: 1rem 0; }
.newsom .nteom {
width: 100%;
font-size: 0;
border: solid 1px #f2f2f2; }
.newsom .nteom a {
width: 100%;
display: flex;
flex-wrap: wrap; }
.newsom .nteom .ntl {
display: inline-block;
vertical-align: middle;
width: calc(755 / 1600 * 100%); }
.newsom .nteom .ntl .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.newsom .nteom .ntl .imgs .img {
width: 100%;
padding-top: 60%;
transition: all ease 0.5s; }
.newsom .nteom .ntr {
display: inline-block;
vertical-align: middle;
width: calc(845 / 1600 * 100%);
padding: 0.3rem 0.7rem;
display: flex;
flex-wrap: wrap;
align-content: center;
border-bottom: solid 2px var(--themes); }
.newsom .nteom .ntr .nit {
width: 100%;
color: var(--themes);
line-height: 1.3;
margin-bottom: 0.22rem; }
.newsom .nteom .ntr .ninp {
width: 100%;
color: #666;
line-height: 1.6;
margin-bottom: 0.22rem; }
.newsom .nteom .ntr .ninp p {
color: #666;
line-height: 1.6; }
.newsom .nteom .ntr .more {
width: 100%;
font-size: 0;
text-align: right; }
.newsom .nteom .ntr .more .mtn {
display: inline-block;
vertical-align: middle;
width: auto;
color: var(--themes); }
.newsom .nteom .ntr .more .mtn span {
display: inline-block;
vertical-align: middle;
width: 11px;
margin-left: 0.1rem;
position: relative;
top: -0.02rem;
transition: all ease 0.5s; }
.newsom .nteom .ntr .more .mtn span img {
width: 100%;
display: block; }
.newsom .nteom:hover .imgs .img {
transform: scale(1.1); }
.newsom .nteom:hover .more .mtn span {
transform: rotate(45deg); }
.newsom .newlist {
width: 100%;
margin-top: 0.8rem; }
.newsom .newlist .nelm {
width: 100%; }
.newsom .newlist .nelm a {
width: 100%;
display: flex;
align-items: center;
font-size: 0;
padding: 0.4rem 0.4rem;
background-color: #f6f9fc;
transition: all 0.3s; }
.newsom .newlist .nelm .time {
display: inline-block;
vertical-align: middle;
width: auto;
color: #666;
line-height: 1.5; }
.newsom .newlist .nelm .time span {
display: inline-block;
vertical-align: middle;
width: 16px;
position: relative;
top: -0.02rem;
margin-right: 0.1rem; }
.newsom .newlist .nelm .time span img {
width: 100%;
display: block; }
.newsom .newlist .nelm .xums {
display: inline-block;
vertical-align: middle;
width: auto;
padding: 0 0.4rem;
text-align: center; }
.newsom .newlist .nelm .xums .xm {
width: 100%;
color: var(--themes);
font-weight: bold;
line-height: 1.2; }
.newsom .newlist .nelm .xums .day {
width: 100%;
color: #4b4b4b;
line-height: 1.5; }
.newsom .newlist .nelm .eom {
display: inline-block;
vertical-align: middle;
text-align: left;
flex: 1;
padding: 0 0.3rem; }
.newsom .newlist .nelm .em {
width: 100%;
color: #666;
line-height: 1.5; }
.newsom .newlist .nelm .ep {
width: 100%;
color: #666;
line-height: 1.5;
margin-top: 0.05rem; }
.newsom .newlist .nelm .tm {
display: inline-block;
vertical-align: middle;
flex: 1;
padding: 0 0.2rem;
color: #666;
line-height: 1.5;
max-height: 3em; }
.newsom .newlist .nelm .mtn {
display: inline-block;
vertical-align: middle;
width: auto;
color: var(--themes); }
.newsom .newlist .nelm .mtn span {
display: inline-block;
vertical-align: middle;
width: 11px;
margin-left: 0.1rem;
position: relative;
top: -0.02rem;
transition: all ease 0.5s; }
.newsom .newlist .nelm .mtn span img {
width: 100%;
display: block; }
.newsom .newlist .nelm:hover a {
background-color: #fff;
box-shadow: 0px 0px 0.43rem 0px rgba(22, 90, 242, 0.09);
transition: all 0.4s cubic-bezier(0.19, 1, 0.22, 1); }
.newsom .newlist .nelm:hover .eom .em {
color: var(--themes); }
.newsom .newlist .nelm:hover .mtn span {
transform: rotate(45deg); }
.newsom .newlist .nelm + .nelm {
margin-top: 0.3rem; }
.newsom .newlist.nos {
margin-top: 0; }
.pages {
width: 100%;
padding: 0.22rem 0 0.25rem;
font-size: 0;
text-align: center;
margin-top: 0.2rem; }
.pages .page {
display: inline-block;
vertical-align: middle;
width: 0.5rem;
height: 0.5rem;
line-height: 0.5rem;
text-align: center;
color: #666;
border-radius: 50%;
background-color: transparent;
border: solid 1px rgba(0, 0, 0, 0.1);
margin: 0 0.05rem 0.05rem; }
.pages .page.ltn {
background-image: url("../images/b1.png");
background-position: center;
background-size: 100% 100%;
background-repeat: no-repeat; }
.pages .page.rtn {
background-image: url("../images/b2.png");
background-position: center;
background-size: 100% 100%;
background-repeat: no-repeat; }
.pages .page.on {
background-color: var(--themes);
color: #fff;
border: solid 1px var(--themes); }
.pages .page.ltn:hover {
background-image: url("../images/b3.png");
background-position: center;
background-size: 100% 100%;
background-repeat: no-repeat; }
.pages .page.on.ltn {
background-image: url("../images/b3.png");
background-position: center;
background-size: 100% 100%;
background-repeat: no-repeat; }
.pages .page.on.rtn {
background-image: url("../images/b4.png");
background-position: center;
background-size: 100% 100%;
background-repeat: no-repeat; }
.pages .page.rtn:hover {
background-image: url("../images/b4.png");
background-position: center;
background-size: 100% 100%;
background-repeat: no-repeat; }
.pages .page.auto {
width: auto;
padding: 0 0.24rem; }
.pages .page:hover {
background-color: var(--themes);
color: #fff; }
@media (max-width: 900px) {
.pages .page {
width: 0.8rem;
height: 0.8rem;
line-height: 0.8rem;
font-size: 16px;
margin: 0 0.1rem 0.1rem; } }
.netails {
width: 100%;
padding: 1rem 0; }
.netails .netail {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
position: relative;
align-items: flex-start; }
.netails .netail .nel {
display: inline-block;
vertical-align: top;
width: calc(1060 / 1680 * 100%); }
.netails .netail .nel .nit {
width: 100%;
text-align: center;
color: #333;
line-height: 1.2;
margin-bottom: 0.3rem; }
.netails .netail .nel .xim {
width: 100%;
text-align: center;
color: #333;
line-height: 1.2;
margin-bottom: 0.24rem; }
.netails .netail .nel .ninp {
width: 100%;
border-top: solid 1px rgba(0, 0, 0, 0.1);
padding: 0.4rem 0 0;
margin-top: 0.4rem;
color: #666;
line-height: 1.7; }
.netails .netail .nel .ninp p {
color: #666;
line-height: 1.7; }
.netails .netail .nel .ninp img {
max-width: 100%; }
.netails .netail .nel .not {
width: 100%;
display: flex;
flex-wrap: wrap;
align-items: center;
margin-top: 0.6rem; }
.netails .netail .nel .not .nol {
display: inline-block;
vertical-align: middle;
flex: 1;
padding-right: 0.6rem; }
.netails .netail .nel .not .nol .ams {
width: 100%;
font-size: 0;
display: flex;
padding: 0.05rem 0; }
.netails .netail .nel .not .nol .ams .xm {
display: inline-block;
vertical-align: middle;
width: auto;
color: #222;
line-height: 1.5; }
.netails .netail .nel .not .nol .ams .xmp {
display: inline-block;
vertical-align: middle;
flex: 1;
color: #666;
line-height: 1.5; }
.netails .netail .nel .not .nol .ams:hover .xmp {
color: var(--themes); }
.netails .netail .nel .not .nor {
display: inline-block;
vertical-align: middle; }
.netails .netail .nel .not .nor .tns {
display: inline-block;
vertical-align: middle;
width: auto;
padding: 0 0.4rem;
line-height: 3;
border-radius: 1.5em;
border: solid 1px var(--themes);
color: var(--themes); }
.netails .netail .nel .not .nor .tns span {
display: inline-block;
vertical-align: middle;
width: 11px;
position: relative;
top: -0.02rem;
margin-left: 0.1rem; }
.netails .netail .nel .not .nor .tns span img {
width: 100%;
display: block; }
.netails .netail .nel .not .nor .tns:hover {
background-color: var(--themes);
color: #fff; }
.netails .netail .nel .not .nor .tns:hover span img {
filter: grayscale(1000%) brightness(2000%); }
.netails .netail .ner {
width: calc(510 / 1680 * 100%);
display: inline-block;
vertical-align: top;
position: sticky;
top: 1rem; }
.netails .netail .ner .nix {
width: 100%;
color: #333;
line-height: 1.4;
margin-bottom: 0.5rem; }
.netails .netail .ner .nerlist {
width: 100%; }
.netails .netail .ner .nerlist .nelm {
width: 100%; }
.netails .netail .ner .nerlist .nelm a {
width: 100%;
display: flex;
flex-wrap: wrap;
align-items: center;
font-size: 0;
border-bottom: solid 1px #f2f2f2;
padding: 0.2rem 0; }
.netails .netail .ner .nerlist .nelm .time {
display: inline-block;
vertical-align: middle;
width: 100%;
color: #666;
line-height: 1.5; }
.netails .netail .ner .nerlist .nelm .time span {
display: inline-block;
vertical-align: middle;
width: 16px;
position: relative;
top: -0.02rem;
margin-right: 0.1rem; }
.netails .netail .ner .nerlist .nelm .time span img {
width: 100%;
display: block; }
.netails .netail .ner .nerlist .nelm .tm {
display: inline-block;
vertical-align: middle;
color: #666;
width: 100%;
line-height: 1.2;
margin: 0.15rem 0; }
.netails .netail .ner .nerlist .nelm .mtn {
display: inline-block;
vertical-align: middle;
width: 100%;
color: var(--themes);
text-align: right; }
.netails .netail .ner .nerlist .nelm .mtn span {
display: inline-block;
vertical-align: middle;
width: 11px;
margin-left: 0.1rem;
position: relative;
top: -0.02rem;
transition: all ease 0.5s; }
.netails .netail .ner .nerlist .nelm .mtn span img {
width: 100%;
display: block; }
.netails .netail .ner .nerlist .nelm:hover .tm {
color: var(--themes); }
.netails .netail .ner .nerlist .nelm:hover .mtn span {
transform: rotate(45deg); }
.netails .netail .ner .nerlist .nelm + .nelm {
margin-top: 0.2rem; }
@media (max-width: 800px) {
.netails .netail .ner {
position: relative;
top: 0; } }
.datacens {
width: 100%;
padding: 1rem 0; }
.datacens .datem {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between; }
.datacens .datem .del {
display: inline-block;
vertical-align: middle;
width: calc(530 / 1600 * 100%); }
.datacens .datem .del .minp {
width: 100%;
color: #fff;
line-height: 1.6; }
.datacens .datem .del .minp p {
color: #fff;
line-height: 1.6; }
.datacens .datem .der {
display: inline-block;
vertical-align: middle;
width: calc(800 / 1600 * 100%); }
.datacens .datem .der .rit {
width: 100%;
color: #fff;
line-height: 1.4;
margin-bottom: 0.2rem; }
.datacens .datem .der .derlist {
width: 100%; }
.datacens .datem .der .derlist .derm {
width: 100%;
border-bottom: solid 1px rgba(255, 255, 255, 0.5); }
.datacens .datem .der .derlist .derm .dip {
width: 100%;
font-size: 0;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0.25rem 0;
cursor: pointer; }
.datacens .datem .der .derlist .derm .dip .dm {
display: inline-block;
vertical-align: middle;
color: #fff;
width: auto;
line-height: 1.5; }
.datacens .datem .der .derlist .derm .dip .rc {
display: inline-block;
vertical-align: middle;
width: 14px;
transition: all ease 0.5s; }
.datacens .datem .der .derlist .derm .dip .rc img {
width: 100%;
display: block; }
.datacens .datem .der .derlist .derm .conp {
width: 100%;
padding: 0.1rem 0 0.4rem;
display: none; }
.datacens .datem .der .derlist .derm .cinp {
width: 100%;
color: #fff;
line-height: 1.5; }
.datacens .datem .der .derlist .derm .cinp p {
color: #fff;
line-height: 1.5; }
.datacens .datem .der .derlist .derm.show .dip .rc {
transform: rotate(180deg); }
.distribution {
width: 100%;
padding: 1rem 0 0; }
.distribution .distm {
width: 100%;
position: relative; }
.distribution .distm .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.distribution .distm .imgs .img {
width: 100%;
padding-top: 43.75%; }
.distribution .distm .stremlis {
position: absolute;
bottom: 0.8rem;
left: 0;
z-index: 2;
display: flex;
flex-wrap: wrap;
font-size: 0;
width: 100%; }
.distribution .distm .stremlis .steam {
display: inline-block;
vertical-align: top;
width: calc(520 / 1600 * 100%);
margin-right: calc(19 / 1600 * 100%);
background-color: rgba(255, 255, 255, 0.8);
padding: 0.2rem; }
.distribution .distm .stremlis .steam .sums {
width: 100%;
text-align: center;
color: var(--themes); }
.distribution .distm .stremlis .steam .sums span {
display: inline-block;
color: var(--themes);
font-weight: bold; }
.distribution .distm .stremlis .steam .xm {
width: 100%;
text-align: center;
color: #333;
line-height: 1.5;
margin-top: 0.1rem; }
.distribution .distm .stremlis .steam:nth-child(3n) {
margin-right: 0; }
@media (max-width: 800px) {
.distribution .distm .stremlis {
position: relative;
bottom: 0;
margin-top: 0.8rem; }
.distribution .distm .stremlis .steam .xm {
font-size: 14px; } }
.terms {
width: 100%;
padding: 1rem 0; }
.terms .trem {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
flex-direction: row-reverse; }
.terms .trem .trl {
display: inline-block;
vertical-align: middle;
width: calc(535 / 1600 * 100%); }
.terms .trem .trl .imgs {
width: 100%;
position: relative;
overflow: hidden; }
.terms .trem .trl .imgs .img {
width: 100%;
padding-top: 90.09%; }
.terms .trem .trr {
display: inline-block;
vertical-align: middle;
width: calc(800 / 1600 * 100%);
padding-top: 0.5rem; }
.terms .trem .trr .tinp {
width: 100%;
color: #666;
line-height: 1.6; }
.terms .trem .trr .tinp p {
color: #666;
line-height: 1.6; }
.servide {
width: 100%;
padding: 1rem 0; }
.servide .seinp {
width: 100%;
color: #fff;
line-height: 1.6;
max-width: 8rem; }
.servide .seinp p {
color: #fff;
line-height: 1.6; }
.servide .vetom {
width: 100%;
display: flex;
font-size: 0;
flex-wrap: wrap;
justify-content: flex-end;
margin-top: 0.8rem; }
.servide .videper {
display: flex;
flex-wrap: wrap;
width: calc(1275 / 1600 * 100%);
width: 12.75rem;
max-width: 100%; }
.servide .videper .swiper-slide {
width: 100%;
width: calc(400 / 1240 * 100%);
margin-right: calc(19 / 1240 * 100%);
display: flex;
flex-wrap: wrap;
align-items: flex-end;
height: 3.2rem; }
.servide .videper .swiper-slide .vomd {
width: 100%;
height: 1.5rem;
transition: all ease 0.5s;
position: relative;
background-color: rgba(255, 255, 255, 0.5);
display: flex;
flex-wrap: wrap;
align-content: center;
padding: 0.2rem 0.4rem;
cursor: pointer; }
.servide .videper .swiper-slide .vomd .bg1 {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
opacity: 0;
transition: all ease 0.5s; }
.servide .videper .swiper-slide .vomd .bg2 {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
opacity: 0;
transition: all ease 0.5s; }
.servide .videper .swiper-slide .vomd .xum {
position: absolute;
z-index: 2;
right: 0.2rem;
top: 0.2rem;
color: #fff;
line-height: 1.5; }
.servide .videper .swiper-slide .vomd .vit {
width: 100%;
position: relative;
z-index: 2;
text-align: center;
color: #fff;
line-height: 1.5; }
.servide .videper .swiper-slide .vomd .vim {
width: 100%;
position: relative;
z-index: 2;
height: 0;
overflow: hidden;
color: #fff;
line-height: 1.5; }
.servide .videper .swiper-slide.on .vomd {
height: 3.2rem;
align-content: flex-end; }
.servide .videper .swiper-slide.on .vomd .bg1, .servide .videper .swiper-slide.on .vomd .bg2 {
opacity: 1; }
.servide .videper .swiper-slide.on .vomd .xum {
color: #fff; }
.servide .videper .swiper-slide.on .vomd .vit {
color: #fff;
text-align: left; }
.servide .videper .swiper-slide.on .vomd .vim {
width: 100%;
height: auto;
max-height: 4.5em;
color: #fff; }
.servide .videper .swiper-slide:nth-child(3n) {
margin-right: 0; }
@media (max-width: 800px) {
.servide .videper .swiper-slide {
height: 5.2rem !important; }
.servide .videper .swiper-slide .vomd {
height: 5.2rem !important;
align-content: flex-end; }
.servide .videper .swiper-slide .vomd .bg1, .servide .videper .swiper-slide .vomd .bg2 {
opacity: 1; }
.servide .videper .swiper-slide .vomd .xum {
color: #fff; }
.servide .videper .swiper-slide .vomd .vit {
color: #fff;
text-align: left; }
.servide .videper .swiper-slide .vomd .vim {
width: 100%;
height: auto;
max-height: 4.5em;
color: #fff; } }
/*# sourceMappingURL=css.css.map */