html {
    -webkit-font-smoothing: antialiased;
    height: 100%;
}

blockquote,
body,
code,
dd,
div,
dl,
dt,
fieldset,
form,
h1,
h2,
h3,
h4,
h5,
h6,
input,
legend,
li,
ol,
p,
pre,
td,
textarea,
th,
ul {
    margin: 0;
    padding: 0;
}

header,
hgroup,
nav,
menu,
main,
section,
article,
summary,
details,
aside,
figure,
figcaption,
footer {
    display: block;
    margin: 0;
    padding: 0;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

table,
th,
td {
    border: 1px solid black;
}

fieldset,
img {
    border: 0;
}

address,
caption,
cite,
code,
dfn,
em,
var {
    font-style: normal;
    font-weight: 400;
}

dl,
ol,
ul {
    list-style-type: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: 100%;
}

a {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
    -webkit-tap-highlight-color: rgba(255, 0, 0, 0);
    outline: 0;
    outline: none;
}

sup {
    vertical-align: text-top;
}

sub {
    vertical-align: text-bottom;
}

textarea {
    resize: none;
    outline: none;
    font-family: Arial, Microsoft YaHei;
}

img {
    vertical-align: middle;
    max-width: 100%;
    height: auto;
}

button,
input {
    -webkit-tap-highlight-color: rgba(255, 0, 0, 0);
    outline: 0;
    -webkit-appearance: none;
}

button {
    -webkit-appearance: none;
}

.clear {
    clear: both;
}

.red {
    color: #ed0016;
}

body * {
    box-sizing: border-box;
    font-family: Arial, Microsoft YaHei;
}

.w1200 {
    width: 12rem;
    margin: 0 auto;
    position: relative;
    font-size: 0;
}

.w1640 {
    width: 16.4rem;
    margin: 0 auto;
    position: relative;
    font-size: 0;
}

header {
    width: 100%;
    background: #008cd6;
}

header .logo {
    display: inline-block;
    vertical-align: middle;
    width: 3.15rem;
    height: 0.53rem;
}

header .logo img,
header .logo a {
    width: 100%;
    height: 100%;
    display: block;
}

header .headr {
    width: calc(2rem + 0.44rem + 0.4rem);
    display: inline-block;
    vertical-align: middle;
    font-size: 0;
}

header .headr .phone {
    width: 2rem;
    display: inline-block;
    vertical-align: middle;
    font-size: 0;
}

header .headr .phone .icon {
    display: inline-block;
    vertical-align: middle;
    width: 0.3rem;
    height: 0.3rem;
}

header .headr .phone .icon img {
    width: 100%;
    height: 100%;
    display: block;
}

header .headr .phone .pon {
    margin-left: 0.15rem;
    width: 1.5rem;
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.2rem);
    line-height: 1.5;
}

header .headr .ss {
    height: 0.8rem;
    display: inline-block;
    vertical-align: middle;
    margin-left: 0.4rem;
}

header .headr .ss .icon {
    width: 0.44rem;
    height: 0.44rem;
    display: block;
    cursor: pointer;
    margin-top: 0.18rem;
    background: #109de7;
    border-radius: 50%;
}

header .headr .ss .icon img {
    width: 100%;
    height: 100%;
    display: block;
}

header .headr .ss .icon-search {
    position: absolute;
    width: 1.8rem;
    top: 100%;
    z-index: 30;
    right: 0;
    background: rgba(0, 140, 214, 0.8);
    padding: 0.05rem 0.05rem;
    display: none;
    transform: translateX(50%);
}

header .headr .ss .icon-search input {
    width: 100%;
    display: inline-block;
    vertical-align: middle;
    background: #fff;
    border: none;
    color: #333;
    padding: 0 0.1rem;
    line-height: 2;
    height: 2em;
    font-size: calc(12px - 0.12rem + 0.14rem);
}

header .headr .ss .icon-ss {
    display: none;
}

header nav {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 3.15rem - 2.84rem - 0.1rem);
    margin: 0 0.05rem;
    font-size: 0;
    text-align: right;
}

header nav .navem {
    width: auto;
    display: inline-block;
    vertical-align: middle;
    position: relative;
}

header nav .navem .nav-a {
    display: inline-block;
    vertical-align: middle;
    padding: 0 0.2rem;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 0.8rem;
}

header nav .navem .sub-menu {
    width: 7.2rem;
    position: absolute;
    z-index: 10;
    top: 100%;
    left: 0;
    transform: translateX(-50%);
    background: #fff;
    padding: 0.3rem;
    font-size: 0;
    text-align: left;
    display: none;
}

header nav .navem .sub-menu .img {
    width: 2.4rem;
    display: inline-block;
    vertical-align: top;
}

header nav .navem .sub-menu .img img,
header nav .navem .sub-menu .img a {
    width: 100%;
    height: 100%;
    display: block;
}

header nav .navem .sub-menu .sub-ul {
    width: 3.9rem;
    display: inline-block;
    vertical-align: top;
    margin-left: 0.3rem;
    font-size: 0;
}

header nav .navem .sub-menu .sub-ul .sli {
    display: inline-block;
    vertical-align: top;
    width: 1.3rem;
    margin-bottom: 0.08rem;
}

header nav .navem .sub-menu .sub-ul .sli a {
    width: 100%;
    display: block;
    color: #333;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 2;
}

header nav .navem .sub-menu .sub-ul .sli:hover a {
    color: #008cd6;
}

header nav .navem.on .nav-a {
    background: #fff;
    color: #008cd6;
}

header .menu {
    display: inline-block;
    vertical-align: middle;
    width: 0.54rem;
    height: 0.52rem;
    cursor: pointer;
    margin-left: 0.1rem;
    display: none;
}

header .menu img {
    width: 100%;
    height: 100%;
    display: block;
}

header .black {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 40;
    cursor: pointer;
}

@media (max-width: 1050px) {
    header nav .navem .nav-a {
        padding: 0 0.1rem;
    }
}

@media (max-width: 830px) {
    header {
        position: fixed;
        z-index: 30;
        top: 0;
        left: 0;
        padding: 0.3rem 0;
    }

    header .logo {
        width: 4.6rem;
        height: 0.77rem;
    }

    header nav {
        width: 5rem;
        position: fixed;
        right: 0;
        top: 0;
        height: 100vh;
        background-color: #fff;
        margin-right: 0;
        padding-top: 10px;
        padding-bottom: 10px;
        overflow: auto;
        z-index: 1000;
        transform: translate(100%, 0);
        transition: transform .3s;
    }

    header nav .navem {
        width: 100%;
        text-align: left;
    }

    header nav .navem .nav-a {
        color: #333;
        padding: 0 0.2rem;
    }

    header nav .navem .sub-menu {
        position: relative;
        width: 100%;
        transform: translateX(0);
        padding: 0;
    }

    header nav .navem .sub-menu .img {
        display: none;
    }

    header nav .navem .sub-menu .sub-ul {
        width: 100%;
        margin-left: 0;
    }

    header nav .navem .sub-menu .sub-ul .sli {
        width: 100%;
    }

    header nav .navem .sub-menu .sub-ul .sli a {
        padding-left: 0.4rem;
        line-height: 2.5;
    }

    header nav .navem.has-nav:after {
        content: "+";
        display: inline-block;
        width: 40px;
        height: 40px;
        line-height: 40px;
        text-align: center;
        position: absolute;
        background: none;
        right: 0;
        transform: translateX(0);
        top: 0;
        font-size: 20px;
        color: #666;
    }

    header nav .navem.has-nav.show:after {
        content: "-";
    }

    header .headr {
        width: calc(100% - 3.15rem - 0.64rem);
        width: calc(100% - 4.6rem - 0.64rem);
        text-align: right;
    }

    header .headr .phone {
        width: 3rem;
    }

    header .headr .phone .pon {
        width: 2.1rem;
    }

    header .headr .phone {
        display: none;
    }

    header .headr .ss {
        margin: 0 0.3rem;
        height: auto;
    }

    header .headr .ss .icon {
        margin-top: 0;
        width: 0.7rem;
        height: 0.7rem;
    }

    header .headr .ss .icon-ss {
        position: fixed;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        display: block;
        background: rgba(0, 0, 0, 0.5);
        z-index: 40;
        display: none;
    }

    header .headr .ss .icon-ss .input {
        position: absolute;
        top: 2rem;
        left: 50%;
        transform: translateX(-50%);
        width: 4rem;
        font-size: 0;
    }

    header .headr .ss .icon-ss .input input[type=text] {
        display: inline-block;
        vertical-align: middle;
        width: 2.6rem;
        background: #fff;
        border: none;
        color: #333;
        padding: 0 0.1rem;
        line-height: 2.5;
        height: 2.5em;
        font-size: calc(12px - 0.12rem + 0.14rem);
    }

    header .headr .ss .icon-ss .input .submit {
        display: inline-block;
        vertical-align: middle;
        width: 1.4rem;
        line-height: 2.5;
        height: 2.5em;
        font-size: calc(12px - 0.12rem + 0.14rem);
        background: #01a3e9;
        color: #fff;
        text-align: center;
        border: none;
    }

    header .menu {
        display: inline-block;
    }

    header.menu-state nav {
        transform: translate(0, 0);
    }

    header.menu-state .black {
        display: block;
    }
}

@media (max-width: 768px) {
    .w1640 {
        width: 94%;
    }
}

@media (max-width: 400px) {
    header .headr .phone {
        display: none;
    }
}

.new-pro {
    width: 100%;
    padding: 0.8rem 0;
    background-position: center;
    background-size: cover;
}

.new-pro .npl {
    width: calc(100% - 10.3rem - 0.2rem);
    margin-right: 0.2rem;
    display: inline-block;
    vertical-align: middle;
}

.new-pro .npl .nptop {
    width: 100%;
}

.new-pro .npl .nptop .en {
    font-weight: bold;
    color: #008cd6;
    font-size: calc(12px - 0.12rem + 0.4rem);
    line-height: 1.3;
}

.new-pro .npl .nptop .cn {
    color: #008cd6;
    font-size: calc(12px - 0.12rem + 0.3rem);
    line-height: 1.3;
}

.new-pro .npl .nplswiper {
    width: 100%;
    margin: 0.2rem 0 0.4rem;
    position: relative;
    height: 4.2rem;
    overflow: auto;
}

.new-pro .npl .nplswiper .swiper-slide {
    position: relative;
    z-index: 5;
    padding-left: 0.7rem;
    color: #666;
    font-size: calc(12px - 0.12rem + 0.18rem);
    line-height: 3;
    height: 3em;
    cursor: pointer;
}

.new-pro .npl .nplswiper .swiper-slide span {
    font-size: calc(12px - 0.12rem + 0.18rem);
    line-height: 3;
    position: absolute;
    z-index: 10;
    top: 1.5em;
    transform: translateY(-50%);
    left: 9px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #d2d2d2;
}

.new-pro .npl .nplswiper .swiper-slide i {
    position: absolute;
    width: 0.6rem;
    height: 2px;
    background: #008cd6;
    top: 1.5em;
    left: 6px;
    transform: translateY(-50%);
    display: none;
}

.new-pro .npl .nplswiper .swiper-slide.on {
    color: #008cd6;
}

.new-pro .npl .nplswiper .swiper-slide.on span {
    left: 2px;
    width: 22px;
    height: 22px;
    background: url("../images/point.png") 100% no-repeat;
}

.new-pro .npl .nplswiper .swiper-slide.on i {
    display: block;
}

.new-pro .npl .nplswiper .line {
    position: absolute;
    top: 0;
    left: 12px;
    z-index: 1;
    width: 1px;
    height: 100%;
    background: #d2d2d2;
}

.new-pro .npl .more {
    width: 100%;
    font-size: 0;
    margin-top: 0.2rem;
}

.new-pro .npl .more a {
    display: inline-block;
    vertical-align: middle;
    background: #008cd6;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 2.5;
    height: 2.5em;
    padding: 0 0.3rem;
    transition: all ease 0.3s;
    position: relative;
    top: 0;
}

.new-pro .npl .more a:hover {
    top: -0.1rem;
}

.new-pro .npr {
    width: 10.3rem;
    display: inline-block;
    vertical-align: middle;
}

.new-pro .npr .nprem {
    width: 100%;
    display: none;
    position: relative;
}

.new-pro .npr .nprem .nprswiper {
    width: 100%;
}

.new-pro .npr .nprem .nprswiper .swiper-slide {
    width: 100%;
    height: 6.7rem;
}

.new-pro .npr .nprem .nprswiper .swiper-slide img,
.new-pro .npr .nprem .nprswiper .swiper-slide a {
    width: 100%;
    height: 5.8rem;
    display: block;
}

.new-pro .npr .nprem .nprswiper .swiper-pagination {
    width: 2rem;
    left: auto;
    right: 0;
    bottom: 0.45rem;
    transform: translateY(50%);
}

.new-pro .npr .nprem .nprswiper .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    opacity: 1;
    margin: 0 10px;
    border-radius: 50%;
    background: #008cd6;
}

.new-pro .npr .nprem .nprswiper .swiper-pagination-bullet-active {
    position: relative;
    transform: translateY(25%);
    width: 26px;
    height: 26px;
    background: url("../images/xmx.png") 100% no-repeat;
}

.new-pro .npr .nprem .nptxn {
    position: absolute;
    z-index: 10;
    bottom: 0;
    left: 0.5rem;
    background-color: #ffffff;
    box-shadow: 0px 0px 27px 0px rgba(0, 77, 118, 0.58);
    width: 7.8rem;
    padding: 0.5rem 0.5rem;
}

.new-pro .npr .nprem .nptxn .np1 {
    width: 100%;
    color: #333;
    font-size: calc(12px - 0.12rem + 0.3rem);
    line-height: 1.6;
}

.new-pro .npr .nprem .nptxn .np1 span {
    display: inline-block;
    color: #008cd6;
    font-size: calc(12px - 0.12rem + 0.2rem);
    margin-left: 0.1rem;
}

.new-pro .npr .nprem .nptxn .np2 {
    color: #666;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.6;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.new-pro .npr .nprem.on {
    display: block;
}

@media (max-width: 900px) {
    .new-pro .npl {
        width: 100%;
        margin-right: 0;
    }

    .new-pro .npl .nplswiper {
        height: auto;
    }

    .new-pro .npl .nplswiper .swiper-slide {
        padding-left: 0.8rem;
    }

    .new-pro .npr {
        width: 100%;
        margin-top: 0.3rem;
    }

    .new-pro .npr .nprem .nprswiper .swiper-slide {
        height: auto;
    }

    .new-pro .npr .nprem .nprswiper .swiper-slide img,
    .new-pro .npr .nprem .nprswiper .swiper-slide a {
        height: auto;
    }

    .new-pro .npr .nprem .nprswiper .swiper-pagination {
        width: 100%;
    }

    .new-pro .npr .nprem .nptxn {
        width: 100%;
        position: relative;
        left: 0;
    }
}

.service {
    width: 100%;
    padding: 0.8rem 0;
    background-position: center;
    background-size: cover;
}

.service .stop {
    width: 100%;
    text-align: center;
}

.service .stop .en {
    color: #008cd6;
    line-height: 1.5;
    font-weight: bold;
    font-size: calc(12px - 0.12rem + 0.4rem);
}

.service .stop .cn {
    color: #008cd6;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.3rem);
}

.service .areasiwper {
    width: 100%;
    margin: 0.4rem 0;
}

.service .areasiwper .swiper-wrapper {
    justify-content: center;
}

.service .areasiwper .swiper-slide {
    display: inline-block;
    vertical-align: middle;
    width: auto;
    color: #888;
    line-height: 2.5;
    font-size: calc(12px - 0.12rem + 0.16rem);
    height: 2.5em;
    padding: 0 0.2rem;
    margin: 0 0.2rem;
    cursor: pointer;
}

.service .areasiwper .swiper-slide.on {
    background: #008cd6;
    color: #fff;
}

.service .areasiwper .swiper-slide:hover {
    background: #008cd6;
    color: #fff;
}

.service .servs {
    width: 100%;
}

.service .servs .servem {
    width: 100%;
    display: none;
}

.service .servs .servem .sewiper {
    width: 100%;
    position: relative;
}

.service .servs .servem .sewiper .swiper-slide {
    width: 11rem;
    font-size: 0;
    background: #fff;
    margin: 0 0.8rem;
}

.service .servs .servem .sewiper .swiper-slide a {
    width: 100%;
    height: 100%;
    display: block;
}

.service .servs .servem .sewiper .swiper-slide .img {
    width: 6rem;
    height: 4.5rem;
    display: inline-block;
    vertical-align: middle;
    overflow: hidden;
}

.service .servs .servem .sewiper .swiper-slide .img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.service .servs .servem .sewiper .swiper-slide .son {
    width: 4.99rem;
    height: 4.5rem;
    display: inline-block;
    vertical-align: middle;
    padding: 0.5rem;
}

.service .servs .servem .sewiper .swiper-slide .son .sit {
    width: 100%;
    color: #000;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.24rem);
}

.service .servs .servem .sewiper .swiper-slide .son .sit span {
    display: inline-block;
    vertical-align: middle;
    width: 0.3rem;
    height: 0.3rem;
}

.service .servs .servem .sewiper .swiper-slide .son .sit span img {
    width: 100%;
    height: 100%;
    display: block;
}

.service .servs .servem .sewiper .swiper-slide .son .sox {
    width: 100%;
    height: 2rem;
    margin: 0.25rem 0;
    color: #999;
    line-height: 1.8;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.service .servs .servem .sewiper .swiper-slide .son .sox p {
    color: #999;
    line-height: 1.8;
    margin-bottom: 0.15rem;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.service .servs .servem .sewiper .swiper-slide .son .more {
    width: 100%;
    font-size: 0;
}

.service .servs .servem .sewiper .swiper-slide .son .more span {
    display: inline-block;
    vertical-align: middle;
    width: auto;
    color: #fff;
    line-height: 2.5;
    height: 2.5em;
    padding: 0 0.4rem;
    text-align: center;
    background: #008cd6;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.service .servs .servem .sewiper .swiper-slide:hover .img img {
    transform: scale(1.1);
}

.service .servs .servem .sewiper .stn {
    position: absolute;
    z-index: 10;
    top: 50%;
    transform: translateY(-50%);
    width: 0.64rem;
    height: 0.64rem;
    cursor: pointer;
}

.service .servs .servem .sewiper .stn img {
    width: 100%;
    height: 100%;
    display: block;
}

.service .servs .servem .sewiper .stn img:first-child {
    display: block;
}

.service .servs .servem .sewiper .stn img:last-child {
    display: none;
}

.service .servs .servem .sewiper .stn:hover img:first-child {
    display: none;
}

.service .servs .servem .sewiper .stn:hover img:last-child {
    display: block;
}

.service .servs .servem .sewiper .sl {
    left: 1rem;
}

.service .servs .servem .sewiper .sr {
    right: 1rem;
}

.service .servs .servem.on {
    display: block;
}

@media (max-width: 550px) {
    .service {
        padding: 0.4rem 0;
    }

    .service .areasiwper .swiper-wrapper {
        justify-content: flex-start;
    }

    .service .servs .servem .sewiper .swiper-slide {
        width: 94%;
        margin: 0 3%;
    }

    .service .servs .servem .sewiper .swiper-slide .img {
        width: 100%;
        height: auto;
    }

    .service .servs .servem .sewiper .swiper-slide .son {
        width: 100%;
        height: auto;
    }

    .service .servs .servem .sewiper .sl {
        left: 0rem;
    }

    .service .servs .servem .sewiper .sr {
        right: 0rem;
    }
}

.casesw {
    width: 100%;
    padding: 0.8rem 0;
    background-position: center;
    background-size: cover;
}

.casesw .caseshlis {
    width: 100%;
    font-size: 0;
}

.casesw .caseshlis .casem {
    width: 5.2rem;
    height: 3.5rem;
    display: inline-block;
    vertical-align: top;
    margin-right: calc((100% - 3 * 5.2rem) / 2);
    margin-bottom: 0.4rem;
    position: relative;
}

.casesw .caseshlis .casem a {
    width: 100%;
    height: 100%;
    display: block;
}

.casesw .caseshlis .casem .img {
    width: 100%;
    height: 100%;
    display: block;
}

.casesw .caseshlis .casem .img img {
    width: 100%;
    height: 100%;
    display: block;
}

.casesw .caseshlis .casem .bk {
    position: absolute;
    z-index: 5;
    bottom: 0;
    left: 0;
    width: 100%;
    background: rgba(0, 0, 0, 0.5);
    transition: all ease 0.3s;
    font-size: calc(12px - 0.12rem + 0.18rem);
    line-height: 3;
    height: 3em;
    overflow: hidden;
    text-align: center;
}

.casesw .caseshlis .casem .bk .tip {
    width: 100%;
    padding-left: 0.4rem;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.18rem);
    line-height: 3;
    text-align: left;
}

.casesw .caseshlis .casem .bk .tx {
    width: 100%;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.5;
    padding: 0 0.4rem;
    transition: all ease 0.3s;
    opacity: 0;
    margin: 0.2rem 0;
}

.casesw .caseshlis .casem .bk .tx .tx3 {
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.5;
}

.casesw .caseshlis .casem .bk .detali {
    width: 100%;
    font-size: 0;
    transition: all ease 0.3s;
    opacity: 0;
}

.casesw .caseshlis .casem .bk .detali span {
    display: inline-block;
    vertical-align: middle;
    background: #fff;
    padding: 0 0.35rem;
    color: #008cd6;
    text-align: center;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 2.5;
    height: 2.5em;
}

.casesw .caseshlis .casem.show .shx {
    position: absolute;
    z-index: 3;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    padding: 0.45rem;
}

.casesw .caseshlis .casem.show .en {
    width: 100%;
    color: #fff;
    font-weight: bold;
    font-size: calc(12px - 0.12rem + 0.4rem);
    line-height: 1.3;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.casesw .caseshlis .casem.show .cn {
    width: 100%;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.3rem);
    line-height: 1.3;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.casesw .caseshlis .casem.show .line {
    display: block;
    width: 0.6rem;
    height: 4px;
    background: #fff;
    margin: 0.3rem 0 0.45rem;
}

.casesw .caseshlis .casem.show .more {
    width: 100%;
    font-size: 0;
}

.casesw .caseshlis .casem.show .more a {
    width: auto;
    display: inline-block;
    vertical-align: middle;
    color: #008cd6;
    background: #fff;
    padding: 0 0.3rem;
    text-align: center;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 2.5;
    height: 2.5em;
    position: relative;
    top: 0;
    transition: all ease 0.3s;
}

.casesw .caseshlis .casem.show .more a:hover {
    top: -0.1rem;
}

.casesw .caseshlis .casem:nth-child(3n) {
    margin-right: 0;
}

.casesw .caseshlis .casem:hover .bk {
    height: 100%;
    padding: 0.3rem 0 0rem;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.casesw .caseshlis .casem:hover .bk .tip {
    padding-left: 0;
    text-align: center;
    line-height: 2;
}

.casesw .caseshlis .casem:hover .bk .tx {
    opacity: 1;
}

.casesw .caseshlis .casem:hover .bk .detali {
    opacity: 1;
}

@media (max-width: 768px) {
    .casesw {
        padding: 0.4rem 0 0;
    }

    .casesw .caseshlis .casem {
        width: 48%;
        height: auto;
        margin-right: 4%;
    }

    .casesw .caseshlis .casem .bk {
        line-height: 2;
        height: 2em;
    }

    .casesw .caseshlis .casem .bk .tip {
        line-height: 2;
        height: 2em;
        font-size: 14px;
    }

    .casesw .caseshlis .casem.show .shx {
        padding: 0.2rem;
        display: flex;
        align-content: center;
        flex-wrap: wrap;
    }

    .casesw .caseshlis .casem.show .en {
        font-size: 24px;
    }

    .casesw .caseshlis .casem.show .cn {
        font-size: 14px;
    }

    .casesw .caseshlis .casem.show .line {
        margin: 0.1rem 0 0.2rem;
    }

    .casesw .caseshlis .casem.show .more a {
        font-size: 12px;
        line-height: 2;
        height: 2em;
    }

    .casesw .caseshlis .casem:nth-child(3n) {
        margin-right: 4%;
    }

    .casesw .caseshlis .casem:nth-child(2n) {
        margin-right: 0;
    }
}

.new-cen {
    width: 100%;
    padding: 0.8rem 0;
    background-position: center;
    background-size: cover;
}

.new-cen .nectop {
    width: 100%;
    font-size: 0;
}

.new-cen .nectop .ntl {
    width: calc(100% - 3rem);
    display: inline-block;
    vertical-align: middle;
}

.new-cen .nectop .ntl .en {
    font-weight: bold;
    color: #008cd6;
    font-size: calc(12px - 0.12rem + 0.4rem);
    line-height: 1.3;
}

.new-cen .nectop .ntl .cn {
    color: #008cd6;
    font-size: calc(12px - 0.12rem + 0.3rem);
    line-height: 1.3;
}

.new-cen .nectop .ntr {
    width: 3rem;
    display: inline-block;
    vertical-align: middle;
}

.new-cen .nectop .ntr .more {
    width: 100%;
    text-align: center;
}

.new-cen .nectop .ntr .more a {
    display: inline-block;
    vertical-align: middle;
    color: #ffffff;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 2.5;
    padding: 0 0.3rem;
    background: #008cd6;
    position: relative;
    top: 0;
    transition: all ease 0.3s;
}

.new-cen .nectop .ntr .more a:hover {
    top: -0.1rem;
}

.new-cen .necon {
    width: 100%;
    font-size: 0;
    margin-top: 0.4rem;
}

.new-cen .necon .nelswiper {
    width: 7.9rem;
    height: 5.8rem;
    display: inline-block;
    vertical-align: middle;
}

.new-cen .necon .nelswiper .swiper-slide {
    width: 100%;
}

.new-cen .necon .nelswiper .swiper-slide .img {
    width: 100%;
    height: 3.3rem;
    overflow: hidden;
}

.new-cen .necon .nelswiper .swiper-slide .img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.new-cen .necon .nelswiper .swiper-slide .nen {
    width: 100%;
    background: #008cd6;
    height: calc(5.8rem - 3.3rem);
    padding: 0.15rem 0.4rem;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.new-cen .necon .nelswiper .swiper-slide .nen .nit {
    width: 100%;
    font-size: calc(12px - 0.12rem + 0.2rem);
    line-height: 1.3;
    color: #fff;
}

.new-cen .necon .nelswiper .swiper-slide .nen .nx {
    width: 100%;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.5;
    color: #fff;
}

.new-cen .necon .nelswiper .swiper-slide .nen .nx .nx3 {
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.5;
    color: #fff;
}

.new-cen .necon .nelswiper .swiper-slide .nen .ntime {
    width: 100%;
    font-size: 0;
}

.new-cen .necon .nelswiper .swiper-slide .nen .ntime .time {
    width: 50%;
    display: inline-block;
    vertical-align: middle;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.5;
    color: #fff;
}

.new-cen .necon .nelswiper .swiper-slide .nen .ntime .time span {
    width: 0.2rem;
    height: 0.2rem;
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.1rem;
}

.new-cen .necon .nelswiper .swiper-slide .nen .ntime .time span img {
    width: 100%;
    height: 100%;
    display: block;
}

.new-cen .necon .nelswiper .swiper-slide .nen .ntime .more {
    width: 50%;
    display: inline-block;
    vertical-align: middle;
    text-align: right;
}

.new-cen .necon .nelswiper .swiper-slide .nen .ntime .more span {
    display: inline-block;
    vertical-align: middle;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.5;
    color: #fff;
}

.new-cen .necon .nelswiper .swiper-slide:hover .img img {
    transform: scale(1.1);
}

.new-cen .necon .nerswiper {
    width: calc(100% - 7.9rem - 0.3rem);
    display: inline-block;
    vertical-align: middle;
    margin-left: 0.3rem;
    padding: 0.3rem 0.45rem;
    background: #fff;
    height: 5.8rem;
}

.new-cen .necon .nerswiper .swiper-container {
    height: 100%;
}

.new-cen .necon .nerswiper .swiper-slide {
    width: 100%;
    padding: 0.15rem 0;
    font-size: 0;
    border-bottom: solid 1px #e5e5e5;
}

.new-cen .necon .nerswiper .swiper-slide a {
    width: 100%;
    height: 100%;
    display: block;
}

.new-cen .necon .nerswiper .swiper-slide .lon {
    width: calc(100% - 2rem - 0.3rem);
    display: inline-block;
    vertical-align: middle;
}

.new-cen .necon .nerswiper .swiper-slide .lon .lit {
    width: 100%;
    color: #000;
    font-size: calc(12px - 0.12rem + 0.2rem);
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.new-cen .necon .nerswiper .swiper-slide .lon .lx {
    width: 100%;
    color: #888;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.5;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0.15rem 0;
}

.new-cen .necon .nerswiper .swiper-slide .lon .ntime {
    width: 100%;
    font-size: 0;
}

.new-cen .necon .nerswiper .swiper-slide .lon .ntime .time {
    width: 50%;
    display: inline-block;
    vertical-align: middle;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.5;
    color: #888;
}

.new-cen .necon .nerswiper .swiper-slide .lon .ntime .time span {
    width: 0.2rem;
    height: 0.2rem;
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.1rem;
}

.new-cen .necon .nerswiper .swiper-slide .lon .ntime .time span img {
    width: 100%;
    height: 100%;
    display: block;
}

.new-cen .necon .nerswiper .swiper-slide .lon .ntime .time span img:first-child {
    display: block;
}

.new-cen .necon .nerswiper .swiper-slide .lon .ntime .time span img:last-child {
    display: none;
}

.new-cen .necon .nerswiper .swiper-slide .lon .ntime .more {
    width: 50%;
    display: inline-block;
    vertical-align: middle;
    text-align: right;
}

.new-cen .necon .nerswiper .swiper-slide .lon .ntime .more span {
    display: inline-block;
    vertical-align: middle;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.5;
    color: #888;
}

.new-cen .necon .nerswiper .swiper-slide .img {
    width: 2rem;
    margin-left: 0.3rem;
    display: inline-block;
    vertical-align: middle;
    overflow: hidden;
}

.new-cen .necon .nerswiper .swiper-slide .img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.new-cen .necon .nerswiper .swiper-slide:hover .img img {
    transform: scale(1.1);
}

.new-cen .necon .nerswiper .swiper-slide:hover .lon .lit,
.new-cen .necon .nerswiper .swiper-slide:hover .lon .lx {
    color: #008cd6;
}

.new-cen .necon .nerswiper .swiper-slide:hover .lon .ntime .time {
    color: #008cd6;
}

.new-cen .necon .nerswiper .swiper-slide:hover .lon .ntime .time span img:first-child {
    display: none;
}

.new-cen .necon .nerswiper .swiper-slide:hover .lon .ntime .time span img:last-child {
    display: block;
}

.new-cen .necon .nerswiper .swiper-slide:hover .lon .ntime .more span {
    color: #008cd6;
}

@media (max-width: 768px) {
    .new-cen {
        padding: 0.4rem 0;
    }

    .new-cen .necon .nelswiper {
        width: 100%;
        height: auto;
        margin-bottom: 0.4rem;
    }

    .new-cen .necon .nelswiper .swiper-slide .img {
        height: auto;
    }

    .new-cen .necon .nelswiper .swiper-slide .nen {
        height: auto;
        padding: 0.3rem 0.2rem;
    }

    .new-cen .necon .nelswiper .swiper-slide .nen .nx {
        margin: 0.3rem 0;
    }

    .new-cen .necon .nerswiper {
        width: 100%;
        height: 7rem;
        margin-left: 0;
    }
}

.company {
    width: 100%;
    padding: 0.8rem 0;
    background-position: center;
    background-size: cover;
}

.company .cml {
    width: calc(100% - 8.28rem - 0.8rem);
    display: inline-block;
    vertical-align: middle;
}

.company .cml .cltop {
    width: 100%;
}

.company .cml .cltop .cn {
    width: 100%;
    color: #008cd6;
    font-size: calc(12px - 0.12rem + 0.3rem);
    line-height: 1.3;
}

.company .cml .cltop .cn span {
    display: inline-block;
    vertical-align: middle;
    color: #008cd6;
    font-weight: bold;
    font-size: calc(12px - 0.12rem + 0.4rem);
    line-height: 1.3;
    margin-left: 0.15rem;
}

.company .cml .cltop .cams {
    width: 100%;
    font-size: 0;
    margin: 0.3rem 0;
}

.company .cml .cltop .cams .cas {
    display: inline-block;
    vertical-align: middle;
    background: #008cd6;
    border-radius: 10px;
    font-size: 0;
    box-shadow: 0px 3px 13px 0px rgba(158, 158, 158, 0.23);
    border-radius: 29px;
    padding: 0.1rem 0.4rem;
}

.company .cml .cltop .cams a {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.18rem);
    line-height: 2;
    margin-right: 0.3rem;
}

.company .cml .cltop .cams a span {
    width: 0.24rem;
    height: 0.24rem;
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.1rem;
}

.company .cml .cltop .cams a span img {
    width: 100%;
    height: 100%;
    display: block;
}

.company .cml .cleon {
    width: 100%;
    color: #666;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 2;
    height: 2.6rem;
    overflow: hidden;
}

.company .cml .cleon p {
    color: #666;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 2;
    margin-bottom: 0.2rem;
}

.company .cml .clbot {
    width: 100%;
    font-size: 0;
    margin-top: 0.3rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
    flex-wrap: wrap;
}

.company .cml .clbot .more {
    display: inline-block;
    vertical-align: middle;
}

.company .cml .clbot .more a {
    display: inline-block;
    vertical-align: middle;
    background: #008cd6;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 2.2;
    padding: 0 0.3rem;
    position: relative;
    top: 0;
    transition: all ease 0.3s;
}

.company .cml .clbot .more a:hover {
    top: -0.1rem;
}

.company .cml .clbot .tesm {
    display: inline-block;
    vertical-align: middle;
    margin-left: 0.2rem;
}

.company .cml .clbot .tesm .t1 {
    color: #008cd6;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.5;
}

.company .cml .clbot .tesm .t1 span {
    display: inline-block;
    color: #008cd6;
    font-weight: bold;
    margin-right: 0.05rem;
    font-size: calc(12px - 0.12rem + 0.3rem);
}

.company .cml .clbot .tesm .t2 {
    color: #666;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.5;
}

.company .cmr {
    width: 8.27rem;
    display: inline-block;
    vertical-align: middle;
    margin-left: 0.8rem;
}

@media (max-width: 768px) {
    .company .cml {
        width: 100%;
    }

    .company .cmr {
        width: 100%;
        margin-left: 0;
        margin-bottom: 0.3rem;
    }

    .company .cmr:last-child {
        display: none;
    }
}

.pro-dis {
    width: 100%;
    padding: 0.8rem 0;
    background-position: center;
    background-size: cover;
}

.pro-dis .nectop {
    width: 100%;
    font-size: 0;
}

.pro-dis .nectop .ntl {
    width: calc(100% - 3rem);
    display: inline-block;
    vertical-align: middle;
}

.pro-dis .nectop .ntl .en {
    font-weight: bold;
    color: #008cd6;
    font-size: calc(12px - 0.12rem + 0.4rem);
    line-height: 1.3;
}

.pro-dis .nectop .ntl .cn {
    color: #008cd6;
    font-size: calc(12px - 0.12rem + 0.3rem);
    line-height: 1.3;
}

.pro-dis .nectop .ntr {
    width: 3rem;
    display: inline-block;
    vertical-align: middle;
}

.pro-dis .nectop .ntr .more {
    width: 100%;
    text-align: center;
}

.pro-dis .nectop .ntr .more a {
    display: inline-block;
    vertical-align: middle;
    color: #ffffff;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 2.5;
    padding: 0 0.3rem;
    background: #008cd6;
    position: relative;
    top: 0;
    transition: all ease 0.3s;
}

.pro-dis .nectop .ntr .more a:hover {
    top: -0.1rem;
}

.pro-dis .proswiper {
    width: 100%;
    margin-top: 0.6rem;
}

.pro-dis .proswiper .swiper-slide a {
    width: 100%;
    height: 100%;
    display: block;
}

.pro-dis .proswiper .swiper-slide .img {
    width: 100%;
    overflow: hidden;
}

.pro-dis .proswiper .swiper-slide .img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.pro-dis .proswiper .swiper-slide .pon {
    width: 100%;
    background: #fff;
    font-size: 0;
    padding: 0.5rem 0.3rem;
}

.pro-dis .proswiper .swiper-slide .pon .pol {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 0.8rem);
}

.pro-dis .proswiper .swiper-slide .pon .pol .cn {
    width: 100%;
    color: #000;
    font-size: calc(12px - 0.12rem + 0.2rem);
    line-height: 1.3;
    margin-bottom: 0.05rem;
}

.pro-dis .proswiper .swiper-slide .pon .pol .cn span {
    width: 0.2rem;
    height: 1px;
    background: #008cd6;
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.05rem;
}

.pro-dis .proswiper .swiper-slide .pon .pol .en {
    width: 100%;
    color: #989898;
    font-size: calc(12px - 0.12rem + 0.14rem);
    line-height: 1.7;
}

.pro-dis .proswiper .swiper-slide .pon .por {
    width: 0.8rem;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    color: #008cd6;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.3;
}

.pro-dis .proswiper .swiper-slide:hover .img img {
    transform: scale(1.1);
}

.pro-dis .proswiper .swiper-slide:hover .pon {
    background: #008cd6;
}

.pro-dis .proswiper .swiper-slide:hover .pon .pol .cn {
    color: #fff;
}

.pro-dis .proswiper .swiper-slide:hover .pon .pol .cn span {
    background: #fff;
}

.pro-dis .proswiper .swiper-slide:hover .pon .pol .en {
    color: #fff;
}

.pro-dis .proswiper .swiper-slide:hover .pon .por {
    color: #fff;
}

.banner {
    width: 100%;
}

.banner .img {
    width: 100%;
}

.banner img {
    width: 100%;
    height: 100%;
    display: block;
}

.banner a {
    width: 100%;
    height: 100%;
    display: block;
}

.banner .img img {
    width: 100%;
    height: 100%;
    display: block;
}

.nbanner {
    width: 100%;
}

.nbanner .img {
    width: 100%;
}

.nbanner .img img {
    width: 100%;
    height: 100%;
    display: block;
}

@media (max-width: 830px) {
    .nbanner {
        padding-top: 1.37rem;
    }

    .banner {
        padding-top: 1.37rem;
    }
}

.tabnav {
    width: 100%;
    background-color: #ffffff;
    box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.07);
}

.tabnav .mnav {
    width: 8rem;
    display: inline-block;
    vertical-align: middle;
}

.tabnav .mnav .swiper-slide {
    width: 1.6rem;
    cursor: pointer;
}

.tabnav .mnav .swiper-slide a {
    width: 100%;
    height: 100%;
    display: block;
    text-align: center;
    line-height: 0.6rem;
    color: #333;
    font-size: calc(12px - 0.12rem + 0.18rem);
    position: relative;
}

.tabnav .mnav .swiper-slide.on a {
    color: #fff;
    background: #008cd6;
}

.tabnav .tnav {
    width: calc(100% - 8rem);
    display: inline-block;
    vertical-align: middle;
    text-align: right;
}

.tabnav .tnav .home {
    display: inline-block;
    vertical-align: middle;
    width: 0.2rem;
    height: 0.2rem;
    margin-right: 0.1rem;
}

.tabnav .tnav .home img {
    width: 100%;
    height: 100%;
    display: block;
}

.tabnav .tnav .tnem {
    display: inline-block;
    vertical-align: middle;
}

.tabnav .tnav .tnem a {
    display: block;
    color: #555555;
    font-size: calc(12px - 0.12rem + 0.14rem);
    line-height: 0.6rem;
}

.tabnav .tnav .tnem a span {
    color: #555555;
    font-size: calc(12px - 0.12rem + 0.14rem);
    line-height: 0.6rem;
    margin: 0 0.1rem;
}

.tabnav .tnav .tnem:last-child a span {
    display: none;
}

@media (max-width: 1000px) {
    .tabnav .mnav {
        width: 100%;
    }

    .tabnav .mnav .swiper-slide {
        width: 2rem;
    }

    .tabnav .tnav {
        width: 100%;
        text-align: left;
    }
}

@media (max-width: 768px) {
    .w1200 {
        width: 94%;
    }
}

.Modular {
    width: 100%;
    padding: 0.5rem 0;
}

.Modular .motop {
    width: 100%;
}

.Modular .motop .cn {
    width: 100%;
    text-align: center;
    line-height: 1.5;
    color: #333;
    font-size: calc(12px - 0.12rem + 0.3rem);
}

.Modular .motop .line {
    width: 100%;
    font-size: 0;
    text-align: center;
    margin: 0.15rem 0;
}

.Modular .motop .line span {
    display: inline-block;
    vertical-align: middle;
    width: 0.35rem;
    height: 2px;
    background: #008cd6;
}

.Modular .motop .en {
    text-align: center;
    line-height: 1.5;
    color: #999;
    font-size: calc(12px - 0.12rem + 0.18rem);
}

.industry {
    width: 100%;
    background-position: center;
    background-size: cover;
}

.industry .indus {
    width: 100%;
    font-size: 0;
    margin-top: 0.5rem;
}

.industry .indus .indem {
    display: inline-block;
    vertical-align: top;
    width: 5.8rem;
    margin-right: calc(100% - 5.8rem * 2);
    margin-bottom: 0.35rem;
}

.industry .indus .indem a {
    width: 100%;
    height: 100%;
    display: block;
}

.industry .indus .indem .img {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.industry .indus .indem .img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.industry .indus .indem .img .more {
    position: absolute;
    top: 0;
    width: 0.7rem;
    left: -0.7rem;
    height: 100%;
    background: #008cd6;
    transition: all ease 0.3s;
}

.industry .indus .indem .img .more span {
    position: absolute;
    bottom: 0;
    width: 0.3rem;
    height: 0.3rem;
    left: 50%;
    transform: translateX(-50%);
}

.industry .indus .indem .time {
    width: 100%;
    line-height: 1.7;
    color: #999;
    font-size: calc(12px - 0.12rem + 0.14rem);
    margin: 0.05rem 0;
}

.industry .indus .indem .it {
    width: 100%;
    line-height: 1.7;
    color: #333;
    font-size: calc(12px - 0.12rem + 0.18rem);
    margin: 0.1rem 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.industry .indus .indem .ix {
    line-height: 1.7;
    color: #888;
    font-size: calc(12px - 0.12rem + 0.14rem);
    height: 3.4em;
}

.industry .indus .indem .ix .ix2 {
    line-height: 1.7;
    color: #888;
    font-size: calc(12px - 0.12rem + 0.14rem);
}

.industry .indus .indem:hover .img img {
    transform: scale(1.1);
}

.industry .indus .indem:hover .img .more {
    left: 0;
}

.industry .indus .indem:hover .time,
.industry .indus .indem:hover .it {
    color: #008cd6;
}

.industry .indus .indem:hover .ix {
    color: #008cd6;
}

.industry .indus .indem:hover .ix .ix2 {
    color: #008cd6;
}

.industry .indus .indem:nth-child(2n) {
    margin-right: 0;
}

@media (max-width: 768px) {
    .industry .indus .indem {
        width: 48%;
        margin-right: 4%;
    }
}

.industry-detail {
    width: 100%;
    padding: 0.5rem 0;
    background-position: center;
    background-size: cover;
}

.industry-detail .it {
    width: 100%;
    text-align: center;
    line-height: 1.5;
    color: #333;
    font-size: calc(12px - 0.12rem + 0.26rem);
    margin-bottom: 0.15rem;
}

.industry-detail .itime {
    width: 100%;
    text-align: center;
    line-height: 1.5;
    color: #999;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.industry-detail .line {
    width: 100%;
    height: 0px;
    border-bottom: dashed 1px #e5e5e5;
    margin: 0.45rem 0;
}

.industry-detail .idcon {
    width: 100%;
    line-height: 1.8;
    color: #555;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.industry-detail .idcon p {
    line-height: 1.8;
    color: #555;
    font-size: calc(12px - 0.12rem + 0.16rem);
    margin-bottom: 0.2rem;
}

.industry-detail .idbot {
    width: 100%;
    font-size: 0;
}

.industry-detail .idbot .idl {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 3rem);
    padding-right: 0.2rem;
}

.industry-detail .idbot .idl .idem {
    width: 100%;
    font-size: 0;
}

.industry-detail .idbot .idl .idem span {
    display: inline-block;
    vertical-align: middle;
    line-height: 1.6;
    color: #333;
    margin-right: 0.15rem;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.industry-detail .idbot .idl .idem a {
    display: inline-block;
    vertical-align: middle;
    line-height: 1.6;
    color: #333;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.industry-detail .idbot .idl .idem:hover span,
.industry-detail .idbot .idl .idem:hover a {
    color: #008cd6;
}

.industry-detail .idbot .idr {
    width: 3rem;
    display: inline-block;
    vertical-align: middle;
    font-size: 0;
    text-align: right;
}

.industry-detail .idbot .idr span {
    display: inline-block;
    vertical-align: middle;
    line-height: 1.8;
    color: #333;
    margin-right: 0.1rem;
    font-size: calc(12px - 0.12rem + 0.14rem);
}

.industry-detail .idbot .idr a {
    display: inline-block;
    vertical-align: middle;
    width: 0.32rem;
    height: 0.32rem;
    margin: 0 0.05rem;
}

.industry-detail .idbot .idr a img {
    width: 100%;
    height: 100%;
    display: block;
}

.industry-detail .back {
    width: 100%;
    font-size: 0;
    margin-top: 0.2rem;
}

.industry-detail .back a {
    display: inline-block;
    vertical-align: middle;
    width: auto;
    padding: 0 0.3rem;
    color: #fff;
    background: #008cd6;
    line-height: 2.5;
    height: 2.5em;
    font-size: calc(12px - 0.12rem + 0.16rem);
    position: relative;
    top: 0;
    transition: all ease 0.3s;
}

.industry-detail .back a:hover {
    top: -0.1rem;
}

.company-news {
    width: 100%;
    background-position: center;
    background-size: cover;
}

.company-news .companys {
    width: 100%;
    margin-top: 0.5rem;
}

.company-news .companys .compem {
    width: 100%;
    margin-bottom: 0.3rem;
}

.company-news .companys .compem a {
    width: 100%;
    height: 100%;
    display: block;
    font-size: 0;
    background: #f0f0f0;
}

.company-news .companys .compem .img {
    width: 5.8rem;
    display: inline-block;
    vertical-align: middle;
    overflow: hidden;
}

.company-news .companys .compem .img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.company-news .companys .compem .comen {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 5.8rem);
    padding: 0.1rem 0.4rem;
}

.company-news .companys .compem .comen .cit {
    width: 100%;
    line-height: 1.5;
    color: #333;
    font-size: calc(12px - 0.12rem + 0.2rem);
    margin-bottom: 0.1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.company-news .companys .compem .comen .ctime {
    line-height: 1.7;
    color: #999;
    font-size: calc(12px - 0.12rem + 0.14rem);
}

.company-news .companys .compem .comen .cx {
    line-height: 1.7;
    color: #888;
    font-size: calc(12px - 0.12rem + 0.14rem);
    height: 5.1em;
    margin: 0.25rem 0 0.35rem;
}

.company-news .companys .compem .comen .cx .cx3 {
    line-height: 1.7;
    color: #888;
    font-size: calc(12px - 0.12rem + 0.14rem);
}

.company-news .companys .compem .comen .more {
    width: 100%;
    font-size: 0;
}

.company-news .companys .compem .comen .more span {
    display: inline-block;
    vertical-align: middle;
    width: auto;
    padding: 0 0.3rem;
    background: #008cd6;
    color: #fff;
    line-height: 2.5;
    height: 2.5em;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.company-news .companys .compem:hover .img img {
    transform: scale(1.1);
}

.company-news .companys .compem:hover a {
    background: #008cd6;
}

.company-news .companys .compem:hover .comen .cit,
.company-news .companys .compem:hover .comen .ctime {
    color: #fff;
}

.company-news .companys .compem:hover .comen .cx .cx3 {
    color: #fff;
}

.company-news .companys .compem:hover .comen .more span {
    background: #fff;
    color: #008cd6;
}

.company-news .companys .complis {
    width: 100%;
    font-size: 0;
}

.company-news .companys .complis .comems {
    display: inline-block;
    vertical-align: top;
    width: 3.68rem;
    margin-bottom: 0.4rem;
    margin-right: calc((100% - 3.68rem * 3) / 2);
}

.company-news .companys .complis .comems .img {
    width: 100%;
    overflow: hidden;
}

.company-news .companys .complis .comems .img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.company-news .companys .complis .comems .cox {
    width: 100%;
    padding: 0.2rem 0.25rem 0.1rem;
    background: #f0f0f0;
}

.company-news .companys .complis .comems .cox .cix {
    line-height: 1.5;
    color: #333;
    font-size: calc(12px - 0.12rem + 0.2rem);
    height: 3em;
}

.company-news .companys .complis .comems .cox .cix .cix2 {
    line-height: 1.5;
    color: #333;
    font-size: calc(12px - 0.12rem + 0.2rem);
}

.company-news .companys .complis .comems .cox .cie {
    line-height: 1.7;
    color: #888;
    font-size: calc(12px - 0.12rem + 0.14rem);
    height: 5.1em;
    margin: 0.2rem 0;
}

.company-news .companys .complis .comems .cox .cie .cie3 {
    line-height: 1.7;
    color: #888;
    font-size: calc(12px - 0.12rem + 0.14rem);
}

.company-news .companys .complis .comems .cox .ctiem {
    line-height: 1.7;
    color: #999;
    font-size: calc(12px - 0.12rem + 0.14rem);
}

.company-news .companys .complis .comems:hover .img img {
    transform: scale(1.1);
}

.company-news .companys .complis .comems:hover .cox {
    background: #008cd6;
}

.company-news .companys .complis .comems:hover .cox .cix .cix2 {
    color: #fff;
}

.company-news .companys .complis .comems:hover .cox .cie .cie3 {
    color: #fff;
}

.company-news .companys .complis .comems:hover .cox .ctiem {
    color: #fff;
}

.company-news .companys .complis .comems:nth-child(3n) {
    margin-right: 0;
}

@media (max-width: 768px) {
    .company-news .companys .compem .img {
        width: 100%;
    }

    .company-news .companys .compem .comen {
        width: 100%;
        padding: 0.3rem 0.3rem;
    }

    .company-news .companys .complis {
        width: 100%;
    }

    .company-news .companys .complis .comems {
        width: 48%;
        margin-right: 4%;
    }

    .company-news .companys .complis .comems:nth-child(3n) {
        margin-right: 4%;
    }

    .company-news .companys .complis .comems:nth-child(2n) {
        margin-right: 0;
    }
}

.constructions {
    width: 100%;
    background-position: center;
    background-size: cover;
}

.constructions .construction {
    width: 100%;
    margin-top: 0.5rem;
}

.constructions .construction .constrlis {
    width: 100%;
}

.constructions .construction .constrlis .consem {
    width: 100%;
    background: #efefef;
    margin-bottom: 0.5rem;
}

.constructions .construction .constrlis .consem a {
    width: 100%;
    height: 100%;
    display: block;
    font-size: 0;
}

.constructions .construction .constrlis .consem .img {
    width: 6rem;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    overflow: hidden;
}

.constructions .construction .constrlis .consem .img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.constructions .construction .constrlis .consem .img .icon {
    position: absolute;
    width: 0;
    height: 0;
    right: 0;
    top: 0.2rem;
    border: solid 0.24rem;
    border-color: transparent #efefef transparent transparent;
}

.constructions .construction .constrlis .consem .cod {
    width: calc(100% - 6rem);
    display: inline-block;
    vertical-align: middle;
    padding: 0rem 0.4rem;
}

.constructions .construction .constrlis .consem .cod .cdtop {
    width: 100%;
    font-size: 0;
}

.constructions .construction .constrlis .consem .cod .cdtop .num {
    width: 0.8rem;
    display: inline-block;
    vertical-align: middle;
    color: #008cd6;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.5rem);
}

.constructions .construction .constrlis .consem .cod .cdtop .nron {
    width: calc(100% - 0.8rem);
    display: inline-block;
    vertical-align: middle;
}

.constructions .construction .constrlis .consem .cod .cdtop .nron .n1 {
    color: #333;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.18rem);
}

.constructions .construction .constrlis .consem .cod .cdtop .nron .n2 {
    color: #333;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.24rem);
}

.constructions .construction .constrlis .consem .cod .codn {
    width: 100%;
    color: #555;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.16rem);
    margin-top: 0.2rem;
}

.constructions .construction .constrlis .consem .cod .codn p {
    color: #555;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.16rem);
    margin-bottom: 0.1rem;
}

.constructions .construction .constrlis .consem:hover {
    background: #008cd6;
}

.constructions .construction .constrlis .consem:hover .cod .cdtop .num {
    color: #fff;
}

.constructions .construction .constrlis .consem:hover .cod .cdtop .nron .n1,
.constructions .construction .constrlis .consem:hover .cod .cdtop .nron .n2 {
    color: #fff;
}

.constructions .construction .constrlis .consem:hover .cod .codn {
    color: #fff;
}

.constructions .construction .constrlis .consem:hover .cod .codn p {
    color: #fff;
}

.constructions .construction .constrlis .consem:hover .img img {
    transform: scale(1.1);
}

.constructions .construction .constrlis .consem:hover .img .icon {
    border-color: transparent #008cd6 transparent transparent;
}

.constructions .construction .constrlis .consem:nth-child(2n) .img .icon {
    right: auto;
    left: 0;
    border-color: transparent transparent transparent #efefef;
}

.constructions .construction .constrlis .consem:nth-child(2n) .img:first-child {
    display: none;
}

.constructions .construction .constrlis .consem:nth-child(2n):hover .img .icon {
    border-color: transparent transparent transparent #008cd6;
}

@media (max-width: 768px) {
    .constructions .construction .constrlis .consem .img {
        width: 100%;
    }

    .constructions .construction .constrlis .consem .cod {
        width: 100%;
        padding: 0.3rem;
    }

    .constructions .construction .constrlis .consem:nth-child(2n) .img:first-child {
        display: block;
    }
}

.contactus {
    width: 100%;
    background-position: center;
    background-size: cover;
}

.contactus .contact {
    width: 100%;
    font-size: 0;
    background: #008cd6;
}

.contactus .contact .col {
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 8.5rem);
    padding: 0.3rem 0.3rem;
}

.contactus .contact .col .iconlis {
    width: 100%;
}

.contactus .contact .col .iconlis .iconm {
    width: 100%;
    font-size: 0;
    margin-bottom: 0.2rem;
}

.contactus .contact .col .iconlis .iconm .icon {
    width: 0.36rem;
    height: 0.36rem;
    display: inline-block;
    vertical-align: top;
}

.contactus .contact .col .iconlis .iconm .icon img {
    width: 100%;
    height: 100%;
    display: block;
}

.contactus .contact .col .iconlis .iconm .ict {
    width: calc(100% - 0.51rem);
    margin-left: 0.15rem;
    display: inline-block;
    vertical-align: top;
}

.contactus .contact .col .iconlis .iconm .ict .ct1 {
    color: #80c6eb;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.14rem);
}

.contactus .contact .col .iconlis .iconm .ict .ct2 {
    color: #fff;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.14rem);
}

.contactus .contact .col .sharx {
    width: 100%;
    font-size: 0;
}

.contactus .contact .col .sharx .code {
    display: inline-block;
    vertical-align: middle;
    width: 1.2rem;
    height: 1.2rem;
}

.contactus .contact .col .sharx .code img {
    width: 100%;
    height: 100%;
    display: block;
}

.contactus .contact .col .sharx a {
    display: inline-block;
    vertical-align: middle;
    width: 0.3rem;
    height: 0.3rem;
    margin: 0 0.1rem;
}

.contactus .contact .col .sharx a img {
    width: 100%;
    height: 100%;
    display: block;
}

.contactus .contact .cor {
    display: inline-block;
    vertical-align: top;
    width: 8.5rem;
}

.contactus .contact .cor img {
    width: 100%;
    height: 100%;
    display: block;
}

@media (max-width: 768px) {
    .contactus .contact .col {
        width: 100%;
    }

    .contactus .contact .cor {
        width: 100%;
    }

    .contactus .contact .cor:last-child {
        display: none;
    }
}

.Plans {
    width: 100%;
    background-position: center;
    background-size: cover;
}

.Plans .plan {
    width: 100%;
    margin-top: 0.5rem;
}

.Plans .plan .pltopiper {
    width: 100%;
    position: relative;
    margin-bottom: 0.3rem;
    overflow: hidden;
}

.Plans .plan .pltopiper .swiper-slide {
    width: 100%;
}

.Plans .plan .pltopiper .swiper-slide img {
    width: 100%;
    display: block;
}

.Plans .plan .pltopiper .plt {
    position: absolute;
    z-index: 10;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 0.2rem 0.3rem;
    background: rgba(0, 140, 214, 0.9);
    bottom: -100%;
    transition: all ease 0.8s;
}

.Plans .plan .pltopiper .plt .pt {
    color: #fff;
    line-height: 1.7;
    font-size: calc(12px - 0.12rem + 0.18rem);
}

.Plans .plan .pltopiper .plt .px {
    color: #fff;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.Plans .plan .pltopiper:hover .plt {
    bottom: 0;
}

.Plans .plan .plbotiper {
    width: 100%;
    position: relative;
}

.Plans .plan .plbotiper .swiper-container {
    width: calc(100% - 0.64rem * 2 - 0.6rem);
    margin: 0 auto;
}

.Plans .plan .plbotiper .swiper-slide img {
    border: solid 1px transparent;
}

.Plans .plan .plbotiper .swiper-slide.on img {
    border: solid 1px #008cd6;
}

.Plans .plan .plbotiper .plen {
    position: absolute;
    z-index: 5;
    top: 50%;
    transform: translateY(-50%);
    width: 0.64rem;
    height: 0.64rem;
    cursor: pointer;
}

.Plans .plan .plbotiper .plen img {
    width: 100%;
    height: 100%;
    display: block;
}

.Plans .plan .plbotiper .plen img:first-child {
    display: block;
}

.Plans .plan .plbotiper .plen img:last-child {
    display: none;
}

.Plans .plan .plbotiper .plen:hover img:first-child {
    display: none;
}

.Plans .plan .plbotiper .plen:hover img:last-child {
    display: block;
}

.Plans .plan .plbotiper .pl {
    left: 0;
}

.Plans .plan .plbotiper .pr {
    right: 0;
}

@media (max-width: 768px) {
    .Plans .plan .pltopiper .plt {
        position: relative;
        bottom: 0;
    }
}

.PlanMs {
    width: 100%;
    background-position: center;
    background-size: cover;
}

.PlanMs .planM {
    width: 100%;
    margin-top: 0.5rem;
}

.PlanMs .planM .pleam {
    width: 5.85rem;
    height: 3.2rem;
    display: inline-block;
    vertical-align: top;
    margin-right: calc((100% - 2 * 5.85rem));
    margin-bottom: 0.3rem;
    position: relative;
}

.PlanMs .planM .pleam a {
    width: 100%;
    height: 100%;
    display: block;
}

.PlanMs .planM .pleam .img {
    width: 100%;
    height: 100%;
    display: block;
}

.PlanMs .planM .pleam .img img {
    width: 100%;
    height: 100%;
    display: block;
}

.PlanMs .planM .pleam .bk {
    position: absolute;
    z-index: 5;
    bottom: 0;
    left: 0;
    width: 100%;
    background: rgba(0, 140, 214, 0.9);
    transition: all ease 0.3s;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 3;
    height: 3em;
    overflow: hidden;
    text-align: center;
}

.PlanMs .planM .pleam .bk .tip {
    width: 100%;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 3;
}

.PlanMs .planM .pleam .bk .tx {
    width: 100%;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.5;
    padding: 0 0.4rem;
    transition: all ease 0.3s;
    opacity: 0;
    margin: 0.2rem 0;
}

.PlanMs .planM .pleam .bk .tx .tx3 {
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.5;
}

.PlanMs .planM .pleam .bk .detali {
    width: 100%;
    font-size: 0;
    transition: all ease 0.3s;
    opacity: 0;
}

.PlanMs .planM .pleam .bk .detali span {
    display: inline-block;
    vertical-align: middle;
    background: #fff;
    padding: 0 0.35rem;
    color: #008cd6;
    text-align: center;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 2.5;
    height: 2.5em;
}

.PlanMs .planM .pleam:hover .bk {
    height: 100%;
    display: flex;
    align-content: center;
    flex-wrap: wrap;
}

.PlanMs .planM .pleam:hover .bk .tip {
    padding-left: 0;
    text-align: center;
    line-height: 2;
}

.PlanMs .planM .pleam:hover .bk .tx {
    opacity: 1;
}

.PlanMs .planM .pleam:hover .bk .detali {
    opacity: 1;
}

.PlanMs .planM .pleam:nth-child(2n) {
    margin-right: 0;
}

@media (max-width: 768px) {
    .PlanMs .planM .pleam {
        width: 48%;
        height: 3.6rem;
        margin-right: 4%;
    }
}

.Ranges {
    width: 100%;
    background-position: center;
    background-size: cover;
}

.Ranges .range {
    width: 100%;
}

.Ranges .range .rangem {
    width: 100%;
    background: #ececec;
    margin-bottom: 0.4rem;
}

.Ranges .range .rangem a {
    width: 100%;
    height: 100%;
    display: block;
    font-size: 0;
}

.Ranges .range .rangem .img {
    width: 5.4rem;
    display: inline-block;
    vertical-align: middle;
    overflow: hidden;
}

.Ranges .range .rangem .img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.Ranges .range .rangem .ron {
    display: inline-block;
    vertical-align: middle;
    padding: 0 0.5rem;
    width: calc(100% - 5.4rem);
}

.Ranges .range .rangem .ron .rit {
    width: 100%;
    color: #000;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.24rem);
    margin-bottom: 0.2rem;
}

.Ranges .range .rangem .ron .rit span {
    width: 0.32rem;
    height: 0.32rem;
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.1rem;
}

.Ranges .range .rangem .ron .rit span img {
    width: 100%;
    height: 100%;
    display: block;
}

.Ranges .range .rangem .ron .rit span img:first-child {
    display: block;
}

.Ranges .range .rangem .ron .rit span img:last-child {
    display: none;
}

.Ranges .range .rangem .ron .rx {
    width: 100%;
    max-height: 1.6rem;
    line-height: 2;
    font-size: calc(12px - 0.12rem + 0.16rem);
    color: #333;
}

.Ranges .range .rangem .ron .rx p {
    line-height: 2;
    font-size: calc(12px - 0.12rem + 0.16rem);
    color: #333;
    margin-bottom: 0.1rem;
}

.Ranges .range .rangem:hover {
    background: #008cd6;
}

.Ranges .range .rangem:hover .ron .rit {
    color: #fff;
}

.Ranges .range .rangem:hover .ron .rit span img:first-child {
    display: none;
}

.Ranges .range .rangem:hover .ron .rit span img:last-child {
    display: block;
}

.Ranges .range .rangem:hover .ron .rx {
    color: #fff;
}

.Ranges .range .rangem:hover .ron .rx p {
    color: #fff;
}

.Ranges .range .rangem:hover .img img {
    transform: scale(1.1);
}

.Ranges .range .rangem:nth-child(2n) .img:first-child {
    display: none;
}

@media (max-width: 600px) {
    .Ranges .range .rangem .img {
        width: 100%;
    }

    .Ranges .range .rangem .ron {
        width: 100%;
        padding: 0.3rem;
    }

    .Ranges .range .rangem .ron .rx {
        max-height: 100%;
    }

    .Ranges .range .rangem:nth-child(2n) .img:first-child {
        display: block;
    }
}

.product-show {
    width: 100%;
    background-position: center;
    background-size: cover;
    padding: 0.5rem 0;
}

.product-show .prl {
    display: inline-block;
    vertical-align: top;
    width: 2.4rem;
}

.product-show .prl .pltop {
    width: 100%;
    background: #008cd6;
    padding: 0.25rem 0.2rem;
}

.product-show .prl .pltop .pt {
    width: 100%;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.26rem);
    font-weight: bold;
    line-height: 1.5;
}

.product-show .prl .pltop .line {
    width: 0.3rem;
    height: 3px;
    background: #fff;
    margin: 0.15rem 0;
}

.product-show .prl .pltop .pc {
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.14rem);
    line-height: 2.5;
}

.product-show .prl .prllis {
    width: 100%;
}

.product-show .prl .prllis .prem {
    width: 100%;
}

.product-show .prl .prllis .prem .clatip {
    width: 100%;
    padding: 0 0.25rem;
    color: #777;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 3;
    background: #eeeeee;
    position: relative;
    cursor: pointer;
}

.product-show .prl .prllis .prem .clatip a {
    color: #777;
}

.product-show .prl .prllis .prem .clatip span {
    position: absolute;
    right: 0.15rem;
    top: 50%;
    transform: translateY(-50%);
    width: 0.06rem;
    height: 0.11rem;
}

.product-show .prl .prllis .prem .clatip span img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
    transform: rotate(0deg);
}

.product-show .prl .prllis .prem .clatip span img:first-child {
    display: block;
}

.product-show .prl .prllis .prem .clatip span img:last-child {
    display: none;
}

.product-show .prl .prllis .prem .claslis {
    width: 100%;
    display: none;
}

.product-show .prl .prllis .prem .claslis .cli {
    width: 100%;
    display: block;
    background: #f7f7f7;
    padding: 0 0.25rem;
    color: #444;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 3;
    cursor: pointer;
}

.product-show .prl .prllis .prem .claslis .cli:hover {
    color: #008cd6;
}

.product-show .prl .prllis .prem.show .clatip {
    background: #008cd6;
    color: #fff;
}

.product-show .prl .prllis .prem.show .clatip span img {
    transform: rotate(90deg);
}

.product-show .prl .prllis .prem.show .clatip span img:first-child {
    display: none;
}

.product-show .prl .prllis .prem.show .clatip span img:last-child {
    display: block;
}

.product-show .prl .prllis .prem:hover .clatip {
    background: #008cd6;
    color: #fff;
}

.product-show .prl .prllis .prem:hover .clatip span img:first-child {
    display: none;
}

.product-show .prl .prllis .prem:hover .clatip span img:last-child {
    display: block;
}

.product-show .prr {
    display: inline-block;
    vertical-align: top;
    width: 9.2rem;
    margin-left: 0.4rem;
}

.product-show .prr .prtop {
    width: 100%;
    background: #008cd6;
    color: #fff;
    line-height: 2.5;
    height: 2.5em;
    padding: 0 0.2rem;
    font-size: calc(12px - 0.12rem + 0.18rem);
}

.product-show .prr .prrlis {
    width: 100%;
    margin-top: 0.3rem;
    font-size: 0;
}

.product-show .prr .prrlis .prrem {
    display: inline-block;
    vertical-align: top;
    width: 2.85rem;
    margin-bottom: 0.3rem;
    margin-right: calc((100% - 2.85rem * 3) / 2);
}

.product-show .prr .prrlis .prrem a {
    width: 100%;
    height: 100%;
    display: block;
}

.product-show .prr .prrlis .prrem .img {
    width: 100%;
    overflow: hidden;
}

.product-show .prr .prrlis .prrem .img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.product-show .prr .prrlis .prrem .txt {
    text-align: center;
    width: 100%;
    color: #666666;
    line-height: 2.5;
    height: 2.5em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.product-show .prr .prrlis .prrem:hover .img img {
    transform: scale(1.1);
}

.product-show .prr .prrlis .prrem:hover .txt {
    background: #008cd6;
    color: #fff;
}

.product-show .prr .prrlis .prrem:nth-child(3n) {
    margin-right: 0;
}

@media (max-width: 768px) {
    .product-show .prl {
        width: 100%;
        margin-bottom: 0.3rem;
    }

    .product-show .prr {
        width: 100%;
        margin-left: 0;
    }

    .product-show .prr .prrlis .prrem {
        width: 32%;
        margin-right: 2%;
    }
}

.product-details {
    width: 100%;
    background-position: center;
    background-size: cover;
    padding: 0.5rem 0;
}

.product-details .productx {
    width: 100%;
    font-size: 0;
}

.product-details .productx .pxl {
    display: inline-block;
    vertical-align: top;
    width: 6.6rem;
}

.product-details .productx .pxl .pxtopiper {
    width: 100%;
}

.product-details .productx .pxl .pxtopiper .swiper-slide {
    width: 100%;
}

.product-details .productx .pxl .pxtopiper .swiper-slide img {
    width: 100%;
    height: 100%;
    display: block;
}

.product-details .productx .pxl .pxbotiper {
    width: 100%;
    position: relative;
    margin-top: 0.15rem;
}

.product-details .productx .pxl .pxbotiper .swiper-container {
    width: calc(100% - 0.5rem);
    margin: 0 auto;
}

.product-details .productx .pxl .pxbotiper .swiper-slide img {
    width: 100%;
    display: block;
    border: solid 1px transparent;
}

.product-details .productx .pxl .pxbotiper .swiper-slide.on img {
    border: solid 1px #008cd6;
}

.product-details .productx .pxl .pxbotiper .xtn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    width: 0.22rem;
    height: 0.22rem;
    cursor: pointer;
}

.product-details .productx .pxl .pxbotiper .xtn img {
    width: 100%;
    height: 100%;
    display: block;
}

.product-details .productx .pxl .pxbotiper .xtn img:first-child {
    display: block;
}

.product-details .productx .pxl .pxbotiper .xtn img:last-child {
    display: none;
}

.product-details .productx .pxl .pxbotiper .xtn:hover img:first-child {
    display: none;
}

.product-details .productx .pxl .pxbotiper .xtn:hover img:last-child {
    display: block;
}

.product-details .productx .pxl .pxbotiper .xl {
    left: 0;
}

.product-details .productx .pxl .pxbotiper .xr {
    right: 0;
}

.product-details .productx .pxr {
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 6.6rem);
    padding-left: 0.5rem;
}

.product-details .productx .pxr .pxt {
    width: 100%;
    color: #008cd6;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.3rem);
    font-weight: bold;
}

.product-details .productx .pxr .pxt span {
    display: inline-block;
    vertical-align: middle;
    margin-left: 0.1rem;
    color: #008cd6;
    font-size: calc(12px - 0.12rem + 0.14rem);
}

.product-details .productx .pxr .ix {
    width: 100%;
    margin: 0.15rem 0 0.25rem;
    color: #555;
    line-height: 1.7;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.product-details .productx .pxr .tixlis {
    width: 100%;
    margin-bottom: 0.3rem;
}

.product-details .productx .pxr .tixlis .tli {
    width: 100%;
    font-size: 0;
}

.product-details .productx .pxr .tixlis .tli .name {
    display: inline-block;
    vertical-align: top;
    color: #333;
    line-height: 2;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.product-details .productx .pxr .tixlis .tli .nconx {
    display: inline-block;
    vertical-align: top;
    color: #666;
    line-height: 2;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.product-details .productx .pxr .rox {
    width: 100%;
    font-size: 0;
}

.product-details .productx .pxr .rox .rtn {
    display: inline-block;
    vertical-align: middle;
    width: auto;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 2.2;
    background: #008cd6;
    padding: 0 0.25rem;
    position: relative;
    top: 0;
    transition: all ease 0.3s;
}

.product-details .productx .pxr .rox .rtn:hover {
    top: -0.1rem;
}

.product-details .productx .pxr .rox .share {
    display: inline-block;
    vertical-align: middle;
    font-size: 0;
    width: auto;
    margin-left: 0.25rem;
}

.product-details .productx .pxr .rox .share span {
    display: inline-block;
    vertical-align: middle;
    color: #666;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.7;
}

.product-details .productx .pxr .rox .share a {
    display: inline-block;
    vertical-align: middle;
    width: 0.2rem;
    height: 0.2rem;
    margin: 0 0.05rem;
}

.product-details .productx .pxr .rox .share a img {
    width: 100%;
    height: 100%;
    display: block;
}

.product-details .pro-detail {
    width: 100%;
    margin-top: 0.5rem;
}

.product-details .pro-detail .ptop {
    width: 100%;
    text-align: center;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 2.2;
    background: #008cd6;
    margin-bottom: 0.3rem;
}

.product-details .pro-detail .prdon {
    width: 100%;
    padding: 0.3rem 0;
}

.product-details .pro-detail .prdon .pontop {
    width: 100%;
    position: relative;
    color: #008cd6;
    font-size: calc(12px - 0.12rem + 0.18rem);
    line-height: 2;
    padding-left: 0.2rem;
    margin-bottom: 0.2rem;
}

.product-details .pro-detail .prdon .pontop span {
    position: absolute;
    font-size: calc(12px - 0.12rem + 0.18rem);
    line-height: 2;
    top: 1em;
    transform: translateY(-50%);
    left: 0;
    width: 4px;
    height: 0.2rem;
    background: #008cd6;
}

.product-details .pro-detail .prdon .pon-pon {
    width: 100%;
    color: #555;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 2.2;
}

.product-details .pro-detail .prdon .pon-pon p {
    color: #555;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 2.2;
    margin-bottom: 0.2rem;
}

.Relevant {
    width: 100%;
    padding: 0.4rem 0;
    background: #ededed;
}

.Relevant .retop {
    width: 100%;
    position: relative;
    color: #008cd6;
    font-size: calc(12px - 0.12rem + 0.24rem);
    line-height: 1.5;
    font-weight: bold;
    padding-left: 0.2rem;
    margin-bottom: 0.2rem;
}

.Relevant .retop span {
    position: absolute;
    font-size: calc(12px - 0.12rem + 0.18rem);
    line-height: 2;
    top: 1em;
    transform: translateY(-50%);
    left: 0;
    width: 4px;
    height: 0.3rem;
    background: #008cd6;
}

.Relevant .reswiper {
    width: 100%;
}

.Relevant .reswiper .cy {
    width: 3.8rem;
    display: inline-block;
    vertical-align: top;
    margin-right: calc((100% - 3.8rem * 3) / 2);
    margin-bottom: 0.3rem;
}

.Relevant .reswiper .cy .img {
    width: 100%;
    overflow: hidden;
}

.Relevant .reswiper .cy .img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.Relevant .reswiper .cy .txt {
    text-align: center;
    width: 100%;
    height: 2.5em;
    color: #666666;
    line-height: 2.5;
    font-size: calc(12px - 0.12rem + 0.16rem);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.Relevant .reswiper .cy:hover .img img {
    transform: scale(1.1);
}

.Relevant .reswiper .cy:hover .txt {
    background: #008cd6;
    color: #fff;
}

.Relevant .reswiper .cy:nth-child(3n) {
    margin-right: 0;
}

@media (max-width: 768px) {
    .product-details {
        width: 100%;
    }

    .product-details .productx .pxl {
        width: 100%;
    }

    .product-details .productx .pxr {
        width: 100%;
        padding: 0.3rem;
    }

    .Relevant .reswiper .cy {
        width: 32%;
        margin-right: 2%;
    }
}

.case-sharings {
    width: 100%;
    background-position: center;
    background-size: cover;
    padding: 0.5rem 0;
}

.case-sharings .case-sharing {
    width: 100%;
    margin-top: 0.5rem;
}

.case-sharings .case-sharing .caselis {
    width: 100%;
    font-size: 0;
}

.case-sharings .case-sharing .caselis .castem {
    display: inline-block;
    vertical-align: top;
    width: 3.8rem;
    margin-bottom: 0.3rem;
    margin-right: calc((100% - 3.8rem * 3) / 2);
}

.case-sharings .case-sharing .caselis .castem .img {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.case-sharings .case-sharing .caselis .castem .img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.case-sharings .case-sharing .caselis .castem .img .more {
    position: absolute;
    z-index: 5;
    width: 100%;
    height: 100%;
    left: 0;
    bottom: -100%;
    transition: all ease 0.3s;
    background: rgba(0, 140, 214, 0.8);
}

.case-sharings .case-sharing .caselis .castem .img .more .mon {
    height: calc(100% - 0.3rem);
    margin: 0.15rem;
    border: solid 1px #8dc2bc;
    display: flex;
    justify-content: center;
    align-items: center;
}

.case-sharings .case-sharing .caselis .castem .img .more .mon .tx {
    display: inline-block;
    vertical-align: middle;
    width: auto;
    padding: 0 0.3rem;
    background: #fff;
    color: #008cd6;
    line-height: 2.5;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.case-sharings .case-sharing .caselis .castem .ctx {
    width: 100%;
    text-align: center;
    color: #333;
    line-height: 2.5;
    font-size: calc(12px - 0.12rem + 0.16rem);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.case-sharings .case-sharing .caselis .castem:hover .img .more {
    bottom: 0;
}

.case-sharings .case-sharing .caselis .castem:hover .ctx {
    color: #008cd6;
}

.case-sharings .case-sharing .caselis .castem:nth-child(3n) {
    margin-right: 0;
}

@media (max-width: 768px) {
    .case-sharings .case-sharing .caselis .castem {
        width: 32%;
        margin-right: 2%;
    }
}

@media (max-width: 450px) {
    .case-sharings .case-sharing .caselis .castem {
        width: 48%;
        margin-right: 4%;
    }

    .case-sharings .case-sharing .caselis .castem:nth-child(3n) {
        margin-right: 4%;
    }

    .case-sharings .case-sharing .caselis .castem:nth-child(2n) {
        margin-right: 0;
    }
}

.case-details {
    width: 100%;
    padding: 0.5rem 0;
    background-position: center;
    background-size: cover;
}

.case-details .cdetop {
    width: 100%;
    font-size: 0;
}

.case-details .cdetop .cdel {
    width: calc(100% - 3rem);
    display: inline-block;
    vertical-align: middle;
    position: relative;
    color: #333;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.24rem);
    padding-left: 0.25rem;
}

.case-details .cdetop .cdel span {
    position: absolute;
    z-index: 3;
    left: 0;
    width: 4px;
    background: #1978ce;
    top: 50%;
    height: 0.3rem;
    transform: translateY(-50%);
}

.case-details .cdetop .cder {
    display: inline-block;
    vertical-align: middle;
    width: 3rem;
    font-size: 0;
    text-align: center;
}

.case-details .cdetop .cder a {
    display: inline-block;
    vertical-align: middle;
    width: auto;
    padding: 0 0.25rem;
    background: #008cd6;
    color: #fff;
    line-height: 2.5;
    font-size: calc(12px - 0.12rem + 0.16rem);
    position: relative;
    top: 0;
    transition: all ease 0.3s;
}

.case-details .cdetop .cder a span {
    display: inline-block;
    vertical-align: middle;
    width: 0.2rem;
    height: 0.2rem;
    margin-left: 0.1rem;
}

.case-details .cdetop .cder a span img {
    width: 100%;
    height: 100%;
    display: block;
}

.case-details .cdetop .cder a:hover {
    top: -0.1rem;
}

.case-details .cdeon {
    width: 100%;
    margin: 0.3rem 0;
    color: #666;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.case-details .cdeon p {
    color: #666;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.16rem);
    margin-bottom: 0.2rem;
}

.Morelist {
    width: 100%;
    padding: 0.4rem 0;
    background: #ededed;
}

.Morelist .retop {
    width: 100%;
    position: relative;
    color: #008cd6;
    font-size: calc(12px - 0.12rem + 0.24rem);
    line-height: 1.5;
    font-weight: bold;
    padding-left: 0.2rem;
    margin-bottom: 0.3rem;
}

.Morelist .retop span {
    position: absolute;
    font-size: calc(12px - 0.12rem + 0.18rem);
    line-height: 2;
    top: 1em;
    transform: translateY(-50%);
    left: 0;
    width: 4px;
    height: 0.3rem;
    background: #008cd6;
}

.Morelist .morelis {
    width: 100%;
    font-size: 0;
}

.Morelist .morelis .morem {
    width: 2.77rem;
    display: inline-block;
    vertical-align: top;
    margin-right: calc((100% - 2.77rem * 4) / 3);
    margin-bottom: 0.2rem;
}

.Morelist .morelis .morem a {
    width: 100%;
    height: 100%;
    display: block;
}

.Morelist .morelis .morem .img {
    width: 100%;
    overflow: hidden;
}

.Morelist .morelis .morem .img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.Morelist .morelis .morem .txt {
    text-align: center;
    color: #333;
    line-height: 2;
    font-size: calc(12px - 0.12rem + 0.14rem);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.Morelist .morelis .morem:hover .img img {
    transform: scale(1.1);
}

.Morelist .morelis .morem:hover .txt {
    color: #008cd6;
}

.Morelist .morelis .morem:nth-child(4n) {
    margin-right: 0;
}

@media (max-width: 768px) {
    .Morelist .morelis .morem {
        width: 48%;
        margin-right: 4%;
    }

    .Morelist .morelis .morem:nth-child(2n) {
        margin-right: 0;
    }
}

.engineerings {
    width: 100%;
    padding: 0.5rem 0;
    background-position: center;
    background-size: cover;
}

.engineerings .engineering {
    width: 100%;
    margin-top: 0.5rem;
}

.engineerings .engineering .engins {
    width: 100%;
    position: relative;
}

.engineerings .engineering .engins .botswiper {
    width: calc((830 / 1200) * 100%);
    display: inline-block;
    vertical-align: middle;
}

.engineerings .engineering .engins .botswiper .swiper-slide {
    width: 100%;
    overflow: hidden;
}

.engineerings .engineering .engins .botswiper .swiper-slide img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.engineerings .engineering .engins .botswiper .swiper-slide a {
    width: 100%;
    height: 100%;
    display: block;
}

.engineerings .engineering .engins .botswiper .swiper-slide:hover img {
    transform: scale(1.1);
}

.engineerings .engineering .engins .topswiper {
    position: absolute;
    z-index: 10;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: calc((477 / 1200) * 100%);
}

.engineerings .engineering .engins .topswiper .swiper-slide {
    width: 100%;
    background-color: #ffffff;
    padding: 0.32rem;
}

.engineerings .engineering .engins .topswiper .swiper-slide a {
    width: 100%;
    height: 100%;
    display: block;
}

.engineerings .engineering .engins .topswiper .swiper-slide .tic {
    width: 100%;
    color: #333;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.18rem);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.engineerings .engineering .engins .topswiper .swiper-slide .tix {
    width: 100%;
    color: #666;
    line-height: 1.7;
    font-size: calc(12px - 0.12rem + 0.14rem);
    max-height: 5.1em;
    margin: 0.3rem 0;
}

.engineerings .engineering .engins .topswiper .swiper-slide .tix .tix3 {
    color: #666;
    line-height: 1.7;
    font-size: calc(12px - 0.12rem + 0.14rem);
}

.engineerings .engineering .engins .topswiper .swiper-slide .more {
    width: 100%;
    font-size: 0;
}

.engineerings .engineering .engins .topswiper .swiper-slide .more .btn {
    display: inline-block;
    vertical-align: middle;
    width: 50%;
    font-size: 0;
}

.engineerings .engineering .engins .topswiper .swiper-slide .more .btn a {
    display: inline-block;
    vertical-align: middle;
    width: auto;
    background: #008cd6;
    color: #fff;
    line-height: 2;
    height: 2em;
    padding: 0 0.2rem;
    font-size: calc(12px - 0.12rem + 0.16rem);
    position: relative;
    top: 0;
    transition: all ease 0.3s;
}

.engineerings .engineering .engins .topswiper .swiper-slide .more .btn a:hover {
    top: -0.1rem;
}

.engineerings .engineering .engins .topswiper .swiper-slide .more .clon {
    display: inline-block;
    vertical-align: middle;
    width: 50%;
    text-align: right;
}

.engineerings .engineering .engins .topswiper .swiper-slide .more .clon .ctn {
    display: inline-block;
    vertical-align: middle;
    width: 0.22rem;
    height: 0.22rem;
    cursor: pointer;
    margin: 0 0.1rem;
}

.engineerings .engineering .engins .topswiper .swiper-slide .more .clon .ctn img {
    width: 100%;
    height: 100%;
    display: block;
}

.engineerings .engineering .engins .topswiper .swiper-slide .more .clon .ctn img:first-child {
    display: block;
}

.engineerings .engineering .engins .topswiper .swiper-slide .more .clon .ctn img:last-child {
    display: none;
}

.engineerings .engineering .engins .topswiper .swiper-slide .more .clon .ctn:hover img:first-child {
    display: none;
}

.engineerings .engineering .engins .topswiper .swiper-slide .more .clon .ctn:hover img:last-child {
    display: block;
}

.engineerings .engineering .enginslis {
    width: 100%;
    font-size: 0;
    margin-top: 0.5rem;
}

.engineerings .engineering .enginslis .engiem {
    width: 3.8rem;
    display: inline-block;
    vertical-align: top;
    margin-bottom: 0.36rem;
    margin-right: calc((100% - 3.8rem * 3) / 2);
}

.engineerings .engineering .enginslis .engiem a {
    width: 100%;
    height: 100%;
    display: block;
}

.engineerings .engineering .enginslis .engiem .img {
    width: 100%;
    overflow: hidden;
}

.engineerings .engineering .enginslis .engiem .img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.engineerings .engineering .enginslis .engiem .ent {
    margin-top: 0.1rem;
    text-align: center;
    color: #555;
    line-height: 2.2;
    font-size: calc(12px - 0.12rem + 0.16rem);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.engineerings .engineering .enginslis .engiem:hover .img img {
    transform: scale(1.1);
}

.engineerings .engineering .enginslis .engiem:hover .ent {
    color: #008cd6;
}

.engineerings .engineering .enginslis .engiem:nth-child(3n) {
    margin-right: 0;
}

@media (max-width: 768px) {
    .engineerings .engineering .engins .botswiper {
        width: 100%;
    }

    .engineerings .engineering .engins .topswiper {
        width: 100%;
        position: relative;
        top: 0;
        transform: translateY(0);
    }

    .engineerings .engineering .enginslis .engiem {
        width: 48%;
        margin-right: 4%;
    }

    .engineerings .engineering .enginslis .engiem:nth-child(3n) {
        margin-right: 4%;
    }

    .engineerings .engineering .enginslis .engiem:nth-child(2n) {
        margin-right: 0;
    }
}

.brief {
    width: 100%;
    background: #fbfbfb;
    padding: 0.5rem 0;
}

.brief .bit {
    width: 100%;
    color: #008cd6;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.24rem);
    margin-bottom: 0.1rem;
}

.brief .befon {
    width: 100%;
    font-size: 0;
}

.brief .befon .ben {
    width: calc(100% - 2px - 0.68rem - 3.72rem);
    display: inline-block;
    vertical-align: middle;
    max-height: 3.5rem;
    color: #666;
    line-height: 2;
    font-size: calc(12px - 0.12rem + 0.14rem);
}

.brief .befon .ben p {
    color: #666;
    line-height: 2;
    font-size: calc(12px - 0.12rem + 0.14rem);
    margin-bottom: 0.1rem;
}

.brief .befon .line {
    display: inline-block;
    vertical-align: middle;
    width: 1px;
    background: #dddddd;
    height: 3.5rem;
    margin: 0 0.34rem 0;
}

.brief .befon .bicolis {
    display: inline-block;
    vertical-align: middle;
    width: 3.72rem;
}

.brief .befon .bicolis .bion {
    width: 100%;
    font-size: 0;
    padding: 0.3rem 0;
}

.brief .befon .bicolis .bion .icon {
    display: inline-block;
    vertical-align: middle;
    width: 0.93rem;
    height: 0.93rem;
}

.brief .befon .bicolis .bion .icon img {
    width: 100%;
    height: 100%;
    display: block;
}

.brief .befon .bicolis .bion .icor {
    width: calc(100% - 0.93rem - 0.45rem);
    display: inline-block;
    vertical-align: middle;
    margin-left: 0.44rem;
}

.brief .befon .bicolis .bion .icor .i1 {
    color: #008cd6;
    font-weight: bold;
    font-size: calc(12px - 0.12rem + 0.18rem);
}

.brief .befon .bicolis .bion .icor .i1 span {
    color: #008cd6;
    font-weight: bold;
    font-size: calc(12px - 0.12rem + 0.36rem);
    display: inline-block;
    margin-right: 0.08rem;
}

.brief .befon .bicolis .bion .icor .i2 {
    color: #666;
    line-height: 2.2;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.brief .befon .bicolis .bion+.bion {
    border-top: solid 1px #ddd;
}

@media (max-width: 768px) {
    .brief .befon {
        width: 100%;
    }

    .brief .befon .ben {
        width: 100%;
    }

    .brief .befon .line {
        display: none;
    }

    .brief .befon .bicolis {
        width: 100%;
        font-size: 0;
    }

    .brief .befon .bicolis .bion {
        width: 50%;
        display: inline-block;
        vertical-align: middle;
    }

    .brief .befon .bicolis .bion+.bion {
        border-top: none;
    }
}

.experts {
    width: 100%;
    background-position: center;
    background-size: cover;
    padding: 0.5rem 0;
}

.experts .expertiper {
    width: 100%;
    margin-top: 0.5rem;
    position: relative;
}

.experts .expertiper .swiper-slide a {
    width: 100%;
    height: 100%;
    display: block;
}

.experts .expertiper .swiper-slide .img {
    width: 100%;
    position: relative;
}

.experts .expertiper .swiper-slide .img img {
    width: 100%;
    height: 100%;
    display: block;
}

.experts .expertiper .swiper-slide .img .eon {
    position: absolute;
    z-index: 5;
    width: 100%;
    left: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    transition: all ease 0.3s;
    font-size: calc(12px - 0.12rem + 0.18rem);
    line-height: 3;
    height: 3em;
    overflow: hidden;
}

.experts .expertiper .swiper-slide .img .eon .txt {
    width: 100%;
    font-size: calc(12px - 0.12rem + 0.18rem);
    line-height: 3;
    color: #fff;
    text-align: center;
}

.experts .expertiper .swiper-slide .img .eon .ext {
    font-size: calc(12px - 0.12rem + 0.14rem);
    line-height: 2;
    color: #fff;
    max-height: 6em;
}

.experts .expertiper .swiper-slide .img .eon .ext .ext3 {
    font-size: calc(12px - 0.12rem + 0.14rem);
    line-height: 2;
    color: #fff;
}

.experts .expertiper .swiper-slide:hover .img .eon {
    height: 100%;
    padding: 0rem 0.2rem 0rem;
    background: rgba(0, 140, 214, 0.8);
    display: flex;
    align-content: center;
    flex-wrap: wrap;
}

.experts .expertiper .etn {
    position: absolute;
    z-index: 5;
    cursor: pointer;
    width: 0.64rem;
    height: 0.64rem;
    top: 50%;
    transform: translateY(-50%);
}

.experts .expertiper .etn img {
    width: 100%;
    height: 100%;
    display: block;
}

.experts .expertiper .etn img:first-child {
    display: block;
}

.experts .expertiper .etn img:last-child {
    display: none;
}

.experts .expertiper .etn:hover img:first-child {
    display: none;
}

.experts .expertiper .etn:hover img:last-child {
    display: block;
}

.experts .expertiper .el {
    left: -0.84rem;
}

.experts .expertiper .er {
    right: -0.84rem;
}

@media (max-width: 768px) {
    .experts .expertiper .el {
        left: -0.2rem;
    }

    .experts .expertiper .er {
        right: -0.2rem;
    }
}

.Environmentals {
    width: 100%;
    background-position: center;
    background-size: cover;
    padding: 0.5rem 0;
}

.Environmentals .Environmental {
    width: 100%;
    font-size: 0;
    margin-top: 0.4rem;
}

.Environmentals .Environmental .enl {
    display: inline-block;
    vertical-align: middle;
    width: 7.5rem;
    width: calc((750 / 1200) * 100%);
    height: 3.2rem;
}

.Environmentals .Environmental .enl img {
    width: 100%;
    height: 100%;
    display: block;
}

.Environmentals .Environmental .enr {
    margin-left: 0.3rem;
    display: inline-block;
    vertical-align: middle;
    width: 4.2rem;
    width: calc((420 / 1200) * 100%);
    height: 3.2rem;
}

.Environmentals .Environmental .enr img {
    width: 100%;
    height: 100%;
    display: block;
}

@media (max-width: 640px) {
    .Environmentals .Environmental .enl {
        width: 100%;
        height: auto;
        margin-bottom: 0.3rem;
    }

    .Environmentals .Environmental .enr {
        width: 100%;
        height: auto;
        margin-left: 0;
    }
}

.cultures {
    width: 100%;
    background-position: center;
    background-size: cover;
    padding: 0.5rem 0;
    background-color: #fff;
}

.cultures .motop .cn,
.cultures .motop .en {
    color: #fff;
}

.cultures .motop .line span {
    background: #fff;
}

.cultures .culture {
    width: 100%;
    font-size: 0;
    margin-top: 0.5rem;
    background: #fff;
}

.cultures .culture .cnl {
    width: 4.8rem;
    display: inline-block;
    vertical-align: top;
}

.cultures .culture .cnl img {
    width: 100%;
    height: 100%;
    display: block;
}

.cultures .culture .cnr {
    width: calc(100% - 4.8rem);
    display: inline-block;
    vertical-align: top;
    padding: 0.4rem 0.26rem 0;
}

.cultures .culture .cnr .cnrtopiper {
    width: 100%;
    position: relative;
}

.cultures .culture .cnr .cnrtopiper .swiper-container {
    width: calc(100% - 0.64rem);
    margin: 0 auto;
}

.cultures .culture .cnr .cnrtopiper .swiper-slide {
    width: auto;
    cursor: pointer;
    padding: 0 0.3rem;
    color: #fff;
    line-height: 2.2;
    height: 2.2em;
    text-align: center;
    background: #008cd6;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.cultures .culture .cnr .cnrtopiper .ctn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 0.22rem;
    height: 0.22rem;
}

.cultures .culture .cnr .cnrtopiper .ctn img {
    width: 100%;
    height: 100%;
    display: block;
}

.cultures .culture .cnr .cnrtopiper .ctn img:first-child {
    display: block;
}

.cultures .culture .cnr .cnrtopiper .ctn img:last-child {
    display: none;
}

.cultures .culture .cnr .cnrtopiper .ctn:hover img:first-child {
    display: none;
}

.cultures .culture .cnr .cnrtopiper .ctn:hover img:last-child {
    display: block;
}

.cultures .culture .cnr .cnrtopiper .cl {
    left: 0;
}

.cultures .culture .cnr .cnrtopiper .cr {
    right: 0;
}

.cultures .culture .cnr .cnron {
    width: 100%;
    margin-top: 0.25rem;
}

.cultures .culture .cnr .cnron .cnrem {
    width: 100%;
    display: none;
    padding: 0 0.3rem;
}

.cultures .culture .cnr .cnron .cnrem .ti {
    width: 100%;
    text-align: center;
    color: #008cd6;
    line-height: 1.5;
    font-weight: bold;
    font-size: calc(12px - 0.12rem + 0.24rem);
    margin-bottom: 0.15rem;
}

.cultures .culture .cnr .cnron .cnrem .cton {
    width: 100%;
    color: #666;
    line-height: 1.7;
    font-size: calc(12px - 0.12rem + 0.16rem);
    height: 2rem;
}

.cultures .culture .cnr .cnron .cnrem .cton p {
    color: #666;
    line-height: 1.7;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.cultures .culture .cnr .cnron .cnrem.on {
    display: block;
}

@media (max-width: 768px) {
    .cultures {
        background-color: #008cd6;
        background-image: none !important;
    }

    .cultures .culture .cnl {
        width: 100%;
    }

    .cultures .culture .cnr {
        width: 100%;
        padding: 0.3rem;
    }

    .cultures .culture .cnr .cnron .cnrem .cton {
        height: 3rem;
    }
}

.Honors {
    width: 100%;
    margin-top: 0.2rem;
}

.Honors .Honor {
    width: 100%;
}

.Honors .Honor .swiper-container {
    width: 100%;
    padding: 0.3rem;
}

.Honors .Honor .swiper-slide {
    cursor: pointer;
}

.Honors .Honor .swiper-slide .img {
    width: 100%;
}

.Honors .Honor .swiper-slide .img img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all ease 0.3s;
}

.Honors .Honor .swiper-slide .txt {
    margin-top: 0.2rem;
    color: #555;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.5;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    opacity: 0;
    transition: all ease 0.3s;
}

.Honors .Honor .swiper-slide:hover .img img {
    transform: scale(1.08);
}

.Honors .Honor .swiper-slide:hover .txt {
    opacity: 1;
}

.Honors .Honor .htn {
    position: absolute;
    z-index: 5;
    cursor: pointer;
    width: 0.64rem;
    height: 0.64rem;
    top: 50%;
    transform: translateY(-50%);
}

.Honors .Honor .htn img {
    width: 100%;
    height: 100%;
    display: block;
}

.Honors .Honor .htn img:first-child {
    display: block;
}

.Honors .Honor .htn img:last-child {
    display: none;
}

.Honors .Honor .htn:hover img:first-child {
    display: none;
}

.Honors .Honor .htn:hover img:last-child {
    display: block;
}

.Honors .Honor .hl {
    left: -0.84rem;
}

.Honors .Honor .hr {
    right: -0.84rem;
}

@media (max-width: 768px) {
    .Honors .Honor .hl {
        left: -0.2rem;
    }

    .Honors .Honor .hr {
        right: -0.2rem;
    }
}

.rightNav {
    position: fixed;
    z-index: 50;
    right: 0.4rem;
    bottom: 2rem;
    display: none;
}

.rightNav .lnam {
    width: 0.65rem;
    height: 0.65rem;
    background: #cbcbcb;
    cursor: pointer;
}

.rightNav .lnam a,
.rightNav .lnam img {
    width: 100%;
    height: 100%;
    display: block;
}

.rightNav .lnam+.lnam {
    margin-top: 0.1rem;
}

.rightNav.show {
    display: block;
}

@media (max-width: 830px) {
    .rightNav {
        display: none;
    }

    .rightNav .lnam {
        width: 1.1rem;
        height: 1.1rem;
    }

    .rightNav.show {
        display: none;
    }
}

.tabbar {
    width: 100%;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 20;
    display: flex;
    justify-content: space-around;
    background: #008cd6;
    padding: 0.15rem 0;
    display: none;
}

.tabbar a {
    flex: 1;
}

.tabbar a .img {
    width: 0.4rem;
    height: 0.4rem;
    margin: 0 auto;
    border-radius: 50%;
}

.tabbar a .img img {
    width: 100%;
    height: 100%;
    display: block;
}

.tabbar a .name {
    width: 100%;
    margin-top: 0.1rem;
    text-align: center;
    line-height: 1.5;
    font-size: calc(12px - 0.12rem + 0.16rem);
    color: #fff;
}

.tabbar a.big .img {
    width: 0.7rem;
}

.tabbar a.big .img img {
    width: 0.7rem;
    height: 0.7rem;
    position: relative;
    top: -0.3rem;
    border-radius: 50%;
    box-shadow: 0px 0px 13px 0px rgba(154, 154, 154, 0.54);
}

.tabbar.show {
    display: flex;
}

.pages {
    width: 100%;
    padding: 0.2rem 0 0.2rem;
    font-size: 0;
    text-align: center;
}

.pages .page {
    display: inline-block;
    vertical-align: middle;
    width: 0.5rem;
    margin: 0 0.05rem 0.1rem;
}

.pages .page a {
    width: 100%;
    height: 100%;
    display: block;
    text-align: center;
    line-height: 2.5;
    font-size: calc(12px - 0.12rem + 0.14rem);
    color: #333;
    background: #fff;
    border: solid 1px #dddddd;
}

.pages .page.long {
    width: auto;
}

.pages .page.long a {
    padding: 0 0.15rem;
}

.pages .page.on a {
    background: #008cd6;
    color: #fff;
    border: solid 1px #008cd6;
}

.pages .page:hover a {
    background: #008cd6;
    color: #fff;
    border: solid 1px #008cd6;
}

footer {
    width: 100%;
}

footer .ftop {
    width: 100%;
    background: #424242;
    padding: 0.6rem 0;
}

footer .ftop .flist {
    display: inline-block;
    vertical-align: top;
    width: 1.8rem;
    padding-right: 0.2rem;
}

footer .ftop .flist .ftopx {
    width: 100%;
    margin-bottom: 0.35rem;
}

footer .ftop .flist .ftopx .en {
    color: #6a6a6a;
    font-size: calc(12px - 0.12rem + 0.14rem);
    line-height: 1.7;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

footer .ftop .flist .ftopx .cn {
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.7;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

footer .ftop .flist .ful {
    width: 100%;
}

footer .ftop .flist .ful .fli {
    width: 100%;
}

footer .ftop .flist .ful .fli a {
    width: 100%;
    display: inline-block;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.14rem);
    line-height: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

footer .ftop .flist .ful .fli a:hover {
    color: #008cd6;
}

footer .ftop .flist.long {
    width: calc(100% - 1.3rem - 1.8rem * 5);
}

footer .ftop .flist.long .ful .fli {
    width: 100%;
    display: inline-block;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.14rem);
    line-height: 2;
}

footer .ftop .code {
    width: 1.3rem;
    display: inline-block;
    vertical-align: top;
}

footer .ftop .code .img {
    width: 1.26rem;
    height: 1.26rem;
    margin: 0 auto 0.1rem;
}

footer .ftop .code .img img {
    width: 100%;
    height: 100%;
    display: block;
}

footer .ftop .code .txt {
    width: 100%;
    text-align: center;
    color: #fff;
    font-size: calc(12px - 0.12rem + 0.16rem);
    line-height: 1.7;
}

footer .fbot {
    width: 100%;
    background: #3e3e3e;
}

footer .fbot .row {
    width: 100%;
    padding: 0.2rem 0;
    font-size: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

footer .fbot .row .tame {
    display: inline-block;
    vertical-align: middle;
    color: #a5a5a5;
    font-size: calc(12px - 0.12rem + 0.14rem);
    line-height: 1.7;
}

footer .fbot .row .build {
    display: inline-block;
    vertical-align: middle;
    color: #a5a5a5;
    font-size: calc(12px - 0.12rem + 0.14rem);
    line-height: 1.7;
}

footer .fbot .row .build a {
    color: #a5a5a5;
}

@media (max-width: 768px) {
    footer {
        display: none;
    }

    footer .ftop {
        text-align: center;
        padding: 0.3rem 0;
    }

    footer .ftop .flist {
        width: 30%;
        display: inline-block;
        vertical-align: top;
        margin-bottom: 0.25rem;
        display: none;
    }

    footer .ftop .flist .ftopx {
        margin-bottom: 0rem;
        width: auto;
        display: inline-block;
    }

    footer .ftop .flist .ful {
        display: none;
    }

    footer .ftop .flist .ful .fli {
        display: inline-block;
        vertical-align: top;
        width: auto;
        margin-right: 0.2rem;
    }

    footer .ftop .flist .ful .fli a {
        width: auto;
    }

    footer .ftop .flist.long {
        width: calc(100% - 2rem);
        text-align: left;
        display: inline-block;
    }

    footer .ftop .flist.long .ful {
        display: inline-block;
    }

    footer .ftop .code {
        width: 2rem;
        padding-top: 1rem;
    }

    footer .fbot .row .tame {
        margin-bottom: 0.2rem;
    }

    body {
        /* padding-bottom: 0.8rem; */
    }
}

.w1400 {
    width: 14rem;
    margin: 0 auto;
}

.blue {
    color: #145eba;
}

.searcox {
    width: 100%;
}

.searcox .tip {
    width: 100%;
    line-height: 0.8rem;
    font-size: calc(12px - 0.12rem + 0.16rem);
}

.searcox .tip .tipx {
    display: inline-block;
    vertical-align: middle;
    font-size: 0;
}

.searcox .tip .tipx .tips {
    display: inline-block;
    vertical-align: middle;
    font-size: calc(12px - 0.12rem + 0.16rem);
    color: #666;
    margin: 0 0.15rem;
}

.searcox .tip .tipx .tips span {
    display: inline-block;
    vertical-align: middle;
    color: #145eba;
    margin: 0 0.07rem;
}

.searcox .tip .tipx .close {
    display: inline-block;
    vertical-align: middle;
    margin-left: 0.25rem;
}

.searcox .tip .tipx .close a {
    width: 100%;
    height: 100%;
    display: block;
    width: 23px;
    height: 23px;
    border-radius: 50%;
    border: 1px solid #ccc;
    background-image: url("../images/close3.png");
    background-repeat: no-repeat;
    background-position: center center;
    cursor: pointer;
}

.searcox .serlist {
    width: 100%;
    background: #fff;
}

.searcox .serlist .sertem {
    width: 100%;
    padding: 0.4rem 0 0.3rem;
}

.searcox .serlist .sertem .tix {
    width: 100%;
    font-size: calc(12px - 0.12rem + 0.24rem);
    color: #000;
    margin-bottom: 0.22rem;
    border-left: 2px solid #145eba;
    padding-left: 0.1rem;
}

.searcox .serlist .sertem .ul-list {
    width: 100%;
    font-size: 0;
}

.searcox .serlist .sertem .ul-list .li {
    width: 50%;
    border-right: 1px dashed #dfdfdf;
    display: inline-block;
    vertical-align: top;
    padding-right: 13%;
}

.searcox .serlist .sertem .ul-list .li a {
    display: block;
    width: 100%;
    padding-left: 20px;
    font-size: 18px;
    color: #333;
    line-height: 38px;
    overflow: hidden;
    position: relative;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.searcox .serlist .sertem .ul-list .li a:after {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #145eba;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -4px;
}

.searcox .serlist .sertem .ul-list .li:nth-child(even) {
    border-right: none;
    padding-left: 13%;
    padding-right: 0;
}

.searcox .serlist .sertem:nth-child(odd) {
    background-color: #f5f5f5;
}

@media (max-width: 1200px) {
    .w1400 {
        width: 94%;
    }
}

@media (max-width: 830px) {
    .searcox {
        padding-top: 1.37rem;
    }
}

@media (max-width: 768px) {
    .searcox .tip {
        line-height: 1.1rem;
    }

    .searcox .serlist .sertem .tix {
        padding-left: 0.2rem;
    }

    .searcox .serlist .sertem .ul-list .li {
        width: 100%;
        padding: 0;
        border-right: none;
    }

    .searcox .serlist .sertem .ul-list .li a {
        font-size: 12px;
    }

    .searcox .serlist .sertem .ul-list .li:nth-child(even) {
        border-right: none;
        padding-left: 0%;
        padding-right: 0;
    }
}

@media (min-width: 1700px) {
    html {
        font-size: 100px;
    }
}

@media (max-width: 1700px) and (min-width: 768px) {
    html {
        font-size: calc(100vw /1700 * 100);
    }
}

@media (max-width: 768px) {
    html {
        font-size: calc(768px /1700 * 100);
    }
}

body {
    font-size: 14px;
}

/* 动画特效 */
.teaser {
    opacity: 0;
    transform: translate3d(0, 25%, 0);
    transition: opacity 1s ease-out 0.2s, transform 1s ease-out 0.2s, box-shadow .3s;
}

.teaser.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.lefter {
    opacity: 0;
    transform: translate3d(-35%, 35%, 0);
    transition: opacity 1s ease-out 0.2s, transform 1s ease-out 0.2s;
}

.lefter.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.righter {
    opacity: 0;
    transform: translate3d(35%, 35%, 0);
    transition: opacity 1s ease-out 0.2s, transform 1s ease-out 0.2s;
}

.righter.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.downer {
    opacity: 0;
    transform: translate3d(0, -35%, 0);
    transition: opacity 1s ease-out 0.2s, transform 1s ease-out 0.2s;
}

.downer.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.lter {
    opacity: 0;
    transform: translate3d(-35%, 0, 0);
    transition: opacity 1s ease-out 0.2s, transform 1s ease-out 0.2s;
}

.lter.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.rter {
    opacity: 0;
    transform: translate3d(35%, 0, 0);
    transition: opacity 1s ease-out 0.2s, transform 1s ease-out 0.2s;
}

.rter.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.delay2 {
    transition-delay: 0.2s;
}

.delay4 {
    transition-delay: 0.4s;
}

.delay6 {
    transition-delay: 0.6s;
}

.delay8 {
    transition-delay: 0.8s;
}

.delay10 {
    transition-delay: 1s;
}

.mCSB_scrollTools .mCSB_draggerRail {
    background-color: rgba(255, 255, 255, 0.75);
}

.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
    background-color: #dcdcdc;
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    background-color: #dcdcdc;
}


.curmbs {
    float: right;
    font-weight: normal;
    font-size: 14px;
    color: #999;
    line-height: 25px;
    background: url(../images/hom1.png) no-repeat 0 center;
    padding-left: 20px;
}

.curmbs a {
    color: #999;
}

.curmbs em {
    font-style: normal;
    padding: 0 5px;
}

/*麦 站 网分页样式*/
.page {
    padding: 20px 0;
    width: 100%;
    text-align: center;
    clear: both;
    font-size: 14px
}

.page a,
.page span {
    color: #666;
    padding: 0 15px;
    margin: 0 3px;
    display: inline-block;
    vertical-align: middle;
    line-height: 34px;
    background: #f9f9f9;
    border: 1px solid #f2f2f2;
}

.page a:hover {
    display: inline-block;
    color: #fff;
    background: #008cd6;
    border-color: #008cd6;
    box-shadow: 0 0 14px rgba(0, 0, 0, .2);
}

.page span {
    display: inline-block;
    color: #666;
}

.page a.page-num-current {
    display: inline-block;
    color: #fff;
    background: #008cd6;
    border-color: #008cd6;
    box-shadow: 0 0 14px rgba(0, 0, 0, .2);
}
