@import "iconfont.css";

a {
    cursor: pointer
}

.cimgbox {
    padding-bottom: 100%;
    overflow: hidden;
    position: relative
}

.cimgbox .img,
.cimgbox .bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%
}

.cimgbox .bg {
    background-repeat: no-repeat;
    background-position: center
}

.cimgbox.cover .img {
    object-fit: cover
}

.cimgbox.cover .bg {
    background-size: cover
}

.cimgbox:not(.cover) .img {
    object-fit: contain
}

.cimgbox:not(.cover) .bg {
    background-size: contain
}

.cimgbox.scale .img,
.cimgbox.scale .bg {
    transition: all 6s cubic-bezier(.04, .79, 1, 1)
}

.cimgbox.scale:hover .img,
.cimgbox.scale:hover .bg {
    transform: scale(1.2)
}

.lb {
    border-bottom: 1px solid #eeeeee
}

.bggray {
    background: #fafafb
}

.c {
    color: #1d24aa
}

.bgc {
    background-color: #1d24aa
}

.wrap {
    margin-left: auto;
    margin-right: auto
}

@media (min-width:1900px) {
    .wrap {
        width: 63vw
    }
}

@media (max-width:1899px) {
    .wrap {
        width: 88vw
    }
}

.layui-layer-dialog .layui-layer-content {
    word-break: break-word !important
}

.tc {
    text-align: center
}

.bgf {
    background: #fff
}

.bggray {
    background: #fafafb
}

.block {
    display: block
}

.row {
    display: flex;
    flex-wrap: wrap
}

.row>li>.inner {
    height: 100%
}

.c {
    color: #1d24aa
}

.iconfont {
    font-size: inherit
}

.medium {
    font-family: medium
}

.bold {
    font-family: bold
}

@media (min-width:1280px) {
    .fs16 {
        font-size: 16px
    }
}

@media (max-width:1200px) and (min-widht:1279px) {
    .fs16 {
        font-size: 15px
    }
}

.fs24 {
    font-size: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px)
}

.fs40 {
    font-size: clamp(calc(24 * 1px), calc(40 / 1200 * 100vw), 40px)
}

.tit1 {
    font-size: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px);
    text-align: center;
    font-family: medium;
    margin-bottom: clamp(calc(50 / 2 * 1px), calc(50 / 1200 * 100vw), 50px)
}

.cItem:not(.on) {
    display: none
}

b {
    font-weight: bold !important
}

.vmore {
    border: 1px solid #fff;
    color: #fff;
    line-height: clamp(calc(34 * 1px), calc(38 / 1200 * 100vw), 38px);
    text-align: center;
    border-radius: 2em;
    padding: 0 26px;
    text-transform: uppercase
}

.vmore:hover {
    background: #fff;
    color: #1d24aa
}

.vmore.outline {
    border: 1px solid #fff;
    background-color: transparent
}

.vmore.outline:hover {
    background: #fff;
    color: #1d24aa
}

.rpnext {
    width: clamp(calc(30 * 1px), calc(48 / 1200 * 100vw), 48px);
    height: clamp(calc(30 * 1px), calc(48 / 1200 * 100vw), 48px);
    border-radius: 50%;
    background-color: #e1e1e1;
    margin-top: 0;
    transform: translateY(-50%);
    color: #fff
}

.rpnext::after {
    font-size: clamp(calc(12 * 1px), calc(16 / 1200 * 100vw), 16px)
}

.rpnext:hover {
    background-color: #1d24aa;
    color: #fff
}

.rpnext.f {
    background-color: rgba(255, 255, 255, 0.1)
}

.rpnext.f:hover {
    background-color: #1d24aa;
    color: #fff
}

.swiper-pnext-wrap {
    position: relative;
    margin-left: auto;
    margin-right: auto
}

@media (min-width:1900px) {
    .swiper-pnext-wrap {
        width: 63vw
    }
}

@media (max-width:1899px) {
    .swiper-pnext-wrap {
        width: 88vw
    }
}

@media (min-width:1900px) {
    .swiper-pnext-wrap {
        width: 63vw
    }
}

@media (max-width:1899px) {
    .swiper-pnext-wrap {
        width: 88vw
    }
}

.swiper-pnext-wrap .swiper-button-prev {
    left: -4vw
}

.swiper-pnext-wrap .swiper-button-next {
    right: -4vw
}

.swiper-pnext-wrap+.swiper-pagination {
    width: 100%;
    position: relative;
    padding-top: clamp(calc(36 * 1px), calc(50 / 1200 * 100vw), 50px)
}

.swiper-pnext-wrap+.swiper-pagination .swiper-pagination-bullet {
    margin: 0 5px
}

header {
    position: fixed;
    z-index: 555;
    left: 0;
    top: 0;
    right: 0;
    z-index: 999
}

header:not(.home),
header.fixed {
    background: #fff;
    border-bottom: 1px solid #eeeeee
}

main {
    margin-top: 81px
}

@media (max-width:1199px) {
    main {
        margin-top: 66px !important
    }
}

header.home+main {
    margin-top: 0
}

header.home .head-content .logo {
    color: #fff
}

header.home .head-content .logo .black {
    display: none
}

header.home .head-content .logo .white {
    display: block
}

header.home .head_tit em {
    color: #fff !important
}

header.home .head-nav-item em::after {
    background: #fff !important
}

header.home .head-tool-item .icon.search {
    background-image: url('../images/ic_search_f.png')
}

header.home .head-tool-item .icon.order {
    background-image: url('../images/ic_order_f.png')
}

.head-content {
    height: 80px;
    position: relative;
    display: flex;
    align-items: center;
    padding-left: clamp(calc(60 / 2 * 1px), calc(60 / 1920 * 100vw), 60px);
    padding-right: clamp(calc(60 / 2 * 1px), calc(60 / 1920 * 100vw), 60px)
}

.head-content .logo {
    height: 35px;
    flex: 1;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    margin-left: 50px;
}

.head-content .logo .black {
    display: block
}

.head-content .logo .white {
    display: none
}

.head-content .logo .tit {
    padding-left: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px);
    margin-left: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px);
    font-size: clamp(calc(17 * 1px), calc(18 / 1200 * 100vw), 18px);
    font-family: medium;
    line-height: 40px;
    white-space: nowrap;
    border-left: 1px solid rgba(0, 0, 0, 0.1)
}

@media (max-width:1360px) {
    .head-content .logo .tit {
        display: none
    }
}

.head-content .head-nav {
    display: flex;
    align-items: center;
    margin-right: 100px;
}

.head-content .head-nav .head-nav-item+.head-nav-item {
    margin-left: clamp(calc(60 / 2 * 1px), calc(60 / 1920 * 100vw), 60px)
}

.head-content .head-nav .head-nav-item:hover .head_tit em,
.head-content .head-nav .head-nav-item.on .head_tit em,
.head-content .head-nav .head-nav-item.open .head_tit em {
    color: #1d24aa
}

.head-content .head-nav .head-nav-item:hover .head_tit em::after,
.head-content .head-nav .head-nav-item.on .head_tit em::after,
.head-content .head-nav .head-nav-item.open .head_tit em::after {
    width: 100%
}

.head-content .head-nav .head_tit {
    height: 80px;
    font-size: 18px;
    font-family: medium
}

.head-content .head-nav .head_tit em {
    position: relative;
    display: inline-block;
    line-height: 80px
}

.head-content .head-nav .head_tit em::after {
    content: '';
    height: 2px;
    background-color: #1d24aa;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    bottom: 0;
    width: 0;
    transition: all .3s cubic-bezier(.04, .79, 1, 1) !important;
    border-radius: 2px;
    overflow: hidden
}

.head-content .head-tool {
    display: flex;
    align-items: center;
    padding-left: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px)
}

.head-content .head-tool-item {
    margin-left: clamp(calc(32 / 2 * 1px), calc(32 / 1920 * 100vw), 32px)
}

.head-content .head-tool-item .icon {
    width: clamp(calc(24 / 2 * 1px), calc(24 / 1200 * 100vw), 24px);
    height: clamp(calc(24 / 2 * 1px), calc(24 / 1200 * 100vw), 24px);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    display: block;
    cursor: pointer
}

.head-content .head-tool-item .icon.search {
    background-image: url('../images/ic_search.png')
}

.head-content .head-tool-item .icon.order {
    background-image: url('../images/ic_order.png')
}

.head-content .head-tool .mail i {
    padding-right: 6px
}

.head-content .head-tool .mail a:hover {
    color: #1d24aa
}

.head-pc-search {
    background: #fafafb;
    padding: 20px 0;
    position: fixed;
    left: 0;
    top: 80px;
    right: 0;
    z-index: 99;
    display: none
}

.head-pc-search form {
    display: flex
}

.head-pc-search form input {
    flex: 1;
    border-right: 0;
    height: 48px;
    font-size: 16px;
    padding: 0 16px;
    border-radius: 3px 0 0 3px
}

.head-pc-search form .submit {
    background-color: #1d24aa;
    border-radius: 0 3px 3px 0;
    color: #fff;
    width: clamp(calc(68 / 2 * 1px), calc(68 / 1200 * 100vw), 68px);
    height: clamp(calc(48 / 2 * 1px), calc(48 / 1200 * 100vw), 48px);
    line-height: clamp(calc(48 / 2 * 1px), calc(48 / 1200 * 100vw), 48px);
    text-align: center;
    font-size: 24px;
    cursor: pointer
}

.head-drop {
    z-index: 555
}

.head-drop .head-dropinfo {
    transition: all .3s cubic-bezier(.04, .79, 1, 1) !important;
    height: 0;
    overflow: hidden;
    top: 81px
}

.head-drop.self {
    position: relative
}

.head-drop.self .head-dropinfo {
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    z-index: 555
}

.head-drop.self .inner {
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
    white-space: nowrap;
    z-index: 55;
    min-width: 180px;
    font-size: 16px;
    background: #fff;
    position: relative;
    padding: 20px 0;
    text-align: center
}

.head-drop.self .inner a {
    display: block;
    padding: 0 20px;
    line-height: 40px;
    margin-bottom: 6px;
    white-space: nowrap;
    font-size: 16px
}

.head-drop.self .inner a:hover {
    color: #1d24aa
}

.head-drop.self .inner a:hover {
    color: #fff;
    background-color: #1d24aa
}

.head-drop.full .head-dropinfo {
    width: 100vw;
    position: fixed;
    left: 0;
    right: 0;
    z-index: 555;
    background: #fff
}

.head-dropinfo.product {
    font-size: 16px;
    line-height: 1.2;
    overflow: hidden
}

.head-dropinfo.product::after {
    content: '';
    display: block;
    position: absolute;
    height: 100vh;
    left: 0;
    top: 0;
    background: #fafafb;
    z-index: -1;
    width: 8vw
}

@media (min-width:1364px) {
    .head-dropinfo.product::after {
        width: calc(50vw - 600px)
    }
}

.head-dropinfo.product .inner {
    position: relative;
    padding: 34px 0 35px;
    /* height: 460px; */
}

.head-dropinfo.product .inner::before {
    content: '';
    display: block;
    position: absolute;
    width: clamp(calc(240 / 2 * 1px), calc(240 / 1200 * 100vw), 240px);
    left: 0;
    top: -200px;
    bottom: -200px;
    background: #fafafb;
    z-index: -1
}

.head-dropinfo.product .item {
    margin-bottom: 10px
}

.head-dropinfo.product .item.on .title {
    background: #fff
}

.head-dropinfo.product .item.on .title::before {
    height: 100%
}

.head-dropinfo.product .item.on .item-list {
    display: block
}

.head-dropinfo.product .item .title {
    width: clamp(calc(240 / 2 * 1px), calc(240 / 1200 * 100vw), 240px);
    line-height: 40px;
    padding-left: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px);
    display: block;
    position: relative
}

.head-dropinfo.product .item .title::before {
    content: '';
    width: 2px;
    height: 0;
    background-color: #1d24aa;
    position: absolute;
    top: 0;
    left: 0
}

.head-dropinfo.product .item-list {
    position: absolute;
    left: clamp(calc(240 / 2 * 1px), calc(240 / 1200 * 100vw), 240px);
    margin-left: clamp(calc(36 / 2 * 1px), calc(36 / 1200 * 100vw), 36px);
    padding: 34px 0 50px;
    top: 0;
    right: 0;
    background: #fff;
    display: none
}

.head-dropinfo.product .list {
    margin-left: calc(-1 * clamp(calc(35 / 2 * 1px), calc(35 / 1200 * 100vw), 35px)) !important;
    margin-right: calc(-1 * clamp(calc(35 / 2 * 1px), calc(35 / 1200 * 100vw), 35px)) !important
}

.head-dropinfo.product .list.stretch {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch
}

.head-dropinfo.product .list.stretch::before {
    display: none
}

.head-dropinfo.product .list.stretch li>.inner,
.head-dropinfo.product .list.stretch li>a {
    height: 100%
}

.head-dropinfo.product .list>* {
    padding-left: clamp(calc(35 / 2 * 1px), calc(35 / 1200 * 100vw), 35px) !important;
    padding-right: clamp(calc(35 / 2 * 1px), calc(35 / 1200 * 100vw), 35px) !important;
    margin-bottom: calc(clamp(calc(35 / 2 * 1px), calc(35 / 1200 * 100vw), 35px) * 2)
}

.head-dropinfo.product .list .cell {
    margin-bottom: 30px;
    text-align: left
}

.head-dropinfo.product .list .cell .imgbox {
    width: clamp(calc(54 / 2 * 1px), calc(54 / 1200 * 100vw), 54px);
    height: clamp(calc(54 / 2 * 1px), calc(54 / 1200 * 100vw), 54px);
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center
}

.head-dropinfo.product .list .cell .tit {
    /* font-family: bold; */
    margin: 12px 0
}

.head-dropinfo.product .list .cell .desc {
    font-size: 12px;
    color: #666;
    line-height: 20px;
    max-height: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical
}

.head-dropinfo.industries {
    line-height: 1.2;
    overflow: hidden
}

.head-dropinfo.industries .inner {
    position: relative;
    padding: 64px 0 50px;
    height: 360px;
    display: flex;
    align-items: flex-start
}

.head-dropinfo.industries .lbox {
    width: 286px;
    margin-right: 10%
}

.head-dropinfo.industries .lbox .title {
    font-size: 16px;
    font-family: bold;
    display: inline-block
}

.head-dropinfo.industries .lbox .title:hover {
    color: #1d24aa
}

.head-dropinfo.industries .lbox .desc {
    color: #666;
    line-height: 24px;
    margin: 16px 0 30px;
    font-size: 14px
}

.head-dropinfo.industries .lbox .more {
    text-transform: uppercase;
    color: #1d24aa
}

.head-dropinfo.industries .rbox {
    flex: 1;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap
}

.head-dropinfo.industries .rbox .item {
    width: 25%;
    text-align: center;
    font-size: 16px;
    margin-bottom: 50px
}

.head-dropinfo.industries .rbox .item .icon {
    width: clamp(calc(42 / 2 * 1px), calc(42 / 1200 * 100vw), 42px);
    height: clamp(calc(42 / 2 * 1px), calc(42 / 1200 * 100vw), 42px);
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    margin-bottom: clamp(calc(16 / 2 * 1px), calc(16 / 1200 * 100vw), 16px)
}

.head-dropinfo.industries .rbox .item .icon .ic {
    width: 100%;
    height: 100%;
    display: block;
    background-size: contain
}

.head-dropinfo.industries .rbox .item .icon .color {
    display: none
}

.head-dropinfo.industries .rbox .item:hover .tit {
    color: #1d24aa
}

.head-dropinfo.industries .rbox .item:hover .icon .ic.black {
    display: none
}

.head-dropinfo.industries .rbox .item:hover .icon .ic.color {
    display: block
}

.head-search {
    width: 726px;
    padding: 40px 40px 50px;
    background: #fff
}

.head-search form {
    display: block;
    position: relative;
    padding-right: 50px;
    border-bottom: 2px solid #333
}

.head-search form input {
    height: 64px;
    line-height: 64px;
    border: 0;
    padding: 0 !important;
    padding-left: 24px;
    font-size: 20px;
    border-radius: 0
}

.head-search form input:focus {
    border-color: #827771 !important
}

.head-search form .submit {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    font-size: 26px;
    width: 40px;
    height: 64px;
    cursor: pointer
}

.head-search form .submit i {
    font-size: 26px
}

.head-search form .submit:hover i {
    color: #1d24aa
}

.mobile-btn {
    float: right;
    position: relative;
    width: 28px;
    height: 65px
}

.mobile-btn.cf span {
    background: #fff
}

.mobile-btn span {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: 1px;
    margin-left: -14px;
    width: 28px;
    height: 2px;
    background-color: #000;
    -webkit-transition-duration: .5s;
    transition-duration: .5s
}

.mobile-btn span:first-child {
    transform: translateY(-8px)
}

.mobile-btn span:last-child {
    transform: translateY(8px)
}

.mobile-btn.on span:first-child {
    transform: rotate(135deg)
}

.mobile-btn.on span:nth-child(2) {
    transform: scale(0)
}

.mobile-btn.on span:last-child {
    transform: rotate(-135deg)
}

.header-mobile {
    background: #fff
}

.header-mobile .content {
    padding-left: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px);
    padding-right: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px);
    height: 65px;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: space-between;
    justify-content: space-between
}

.header-mobile .content .logo {
    height: 28px
}

.header-mobile .content .tool {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center
}

.header-mobile .content .order {
    display: block;
    margin-right: 12px
}

.header-mobile .content .order .icon {
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    display: block;
    cursor: pointer
}

.header-mobile .content .order .icon.order {
    background-image: url('../images/ic_order.png')
}

.menu_search {
    background: #fff;
    display: flex
}

.menu_search input {
    border-color: #fff;
    height: 50px;
    font-size: 15px;
    display: block;
    padding: 0 14px;
    flex: 1
}

.menu_search input:focus {
    border-color: #fff !important
}

.menu_search .submit {
    right: 0;
    top: 0;
    color: #fff;
    width: 70px;
    height: 50px;
    text-align: center;
    background: url(../images/search-ico-white.png) no-repeat center #1d24aa;
    border-radius: 0 2px 2px 0
}

.menu_search .submit i {
    font-size: 18px
}

.menu_search .submit:hover {
    color: #fff
}

.menu_lang {
    padding: 30px 0 0
}

.menu_lang .litem {
    border-radius: 2em;
    width: clamp(calc(30 * 1px), calc(36 / 1200 * 100vw), 36px);
    height: clamp(calc(30 * 1px), calc(36 / 1200 * 100vw), 36px);
    text-align: center;
    background: #fff;
    display: inline-block;
    margin-right: 10px
}

.menu_lang .active {
    background-color: #1d24aa;
    color: #fff
}

.m-menus {
    width: 100%;
    position: fixed;
    top: 65px;
    left: 0;
    height: 0;
    opacity: 0;
    transition: opacity .5s;
    background: #f7f7f7;
    overflow: hidden;
    line-height: 32px;
    font-size: 15px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    z-index: -999
}

@media (min-width:1200px) {
    .m-menus {
        display: none
    }
}

.m-menus.active {
    opacity: 1;
    height: 100%;
    z-index: 999
}

.m-menus .inner {
    overflow-x: hidden;
    overflow-y: auto;
    height: calc((100vh - 65px));
    padding: 10px 6vw 60px
}

.m-menus .menus {
    padding-bottom: 40px
}

.m-menus .menus .item {
    cursor: pointer;
    transition: .3s;
    position: relative;
    text-align: center;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    text-align: left
}

.m-menus .menus .item a {
    display: block;
    color: #333
}

.m-menus .menus .item .tag {
    background: url('../images/right.png') no-repeat center center;
    background-size: 20px
}

.m-menus .menus .item .jia {
    background: url('../images/jia.png') no-repeat center center;
    background-size: 12px
}

.m-menus .menus .item .tag,
.m-menus .menus .item .jia {
    display: block;
    transition: all .3s cubic-bezier(.04, .79, 1, 1) !important;
    width: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px);
    height: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px)
}

.m-menus .menus .item .arr {
    margin-left: 20px
}

.m-menus .menus .tit {
    display: flex;
    align-items: center
}

.m-menus .menus .tit a {
    flex: 1;
    display: flex;
    align-items: center
}

.m-menus .menus .tit-1 {
    line-height: 52px;
    font-size: 17px
}

.m-menus .menus .tit-2 {
    line-height: 34px;
    font-size: 16px
}

.m-menus .menus .tit-2 a .tag {
    opacity: .5;
    margin-right: 16px;
    background-size: 18px
}

.m-menus .menus .xs-menu-2 {
    margin-left: 26px;
    border-top: 1px solid #1d24aa;
    margin-top: 6px;
    line-height: 30px;
    padding-bottom: 16px !important
}

.m-menus .menus .active>.tit-2 a,
.m-menus .menus .open>.tit-2 a {
    color: #1d24aa
}

.m-menus .menus .active>.tit-2 .jia,
.m-menus .menus .open>.tit-2 .jia {
    background-image: url('../images/jian.png')
}

.m-menus .menus .active>.tit-1 a,
.m-menus .menus .open>.tit-1 a {
    color: #1d24aa
}

.m-menus .menus .active>.tit-1 .arr,
.m-menus .menus .open>.tit-1 .arr {
    transform: rotate(90deg)
}

.m-menus .menus .active .xs-menu,
.m-menus .menus .open .xs-menu {
    padding: 8px 0 40px
}

.m-menus .xs-menu-1 {
    border-top: 1px solid #1d24aa
}

.m-menus .xs-menu {
    display: none;
    text-align: left
}

.m-menus .xs-menu dd {
    line-height: 36px;
    font-size: 14px
}

.m-menus .xs-menu.sort {
    overflow: hidden
}

.m-menus .xs-menu.sort dd {
    min-width: 50%;
    padding-left: 20px;
    float: left
}

.mobile-btn {
    float: right;
    position: relative;
    width: 28px;
    height: 65px;
    z-index: 999;
}

.mobile-btn span {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: 1px;
    margin-left: -14px;
    width: 28px;
    height: 2px;
    background-color: #1d24aa;
    -webkit-transition-duration: .5s;
    transition-duration: .5s
}

.mobile-btn span:first-child {
    transform: translateY(-8px)
}

.mobile-btn span:last-child {
    transform: translateY(8px)
}

.mobile-btn.on span:first-child {
    transform: rotate(135deg)
}

.mobile-btn.on span:nth-child(2) {
    transform: scale(0)
}

.mobile-btn.on span:last-child {
    transform: rotate(-135deg)
}

.ban-box {
    padding: 20px;
    background: #fafafb;
    text-align: center
}

@media (max-width:480px) {
    .ban-box img {
        width: 40%
    }
}

footer {
    background-color: #000;
    color: #fff;
    padding-top: clamp(calc(100 / 2 * 1px), calc(100 / 1920 * 100vw), 100px)
}

.ft-content {
    padding-bottom: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px);
    color: #959595
}

@media (min-width:1200px) {
    .ft-content {
        display: flex;
        justify-content: space-between
    }
}

.ft-content .navbox.isloadingpage {
    justify-content: center;
    text-align: center
}

.ft-content .navbox.isloadingpage .share {
    justify-content: center
}

@media (min-width:1200px) {
    .ft-content .navbox {
        flex: 1;
        display: flex
    }

    .ft-content .navbox li:not(.contact) {
        flex: 1
    }

    .ft-content .navbox li.contact {
        width: 33%;
        order: -1;
        padding-right: 10%
    }
}

.ft-content .navbox .tit {
    font-size: 16px;
    color: #fff;
    font-family: bold
}

@media (min-width:1200px) {
    .ft-content .navbox .tit {
        padding-bottom: 10px;
        margin-bottom: 14px;
        position: relative
    }
}

.ft-content .navbox .tit a {
    display: block;
    color: #fff
}

@media (min-width:1199px) {
    .ft-content .navbox .tit a .iconfont {
        display: none
    }
}

.ft-content .navbox .info {
    line-height: 2.14285714
}

.ft-content .navbox .info a {
    display: block;
    color: #959595
}

.ft-content .navbox .info a:hover {
    color: #fff
}

@media (max-width:1199px) {
    .ft-content .navbox li {
        border-bottom: 1px solid rgba(255, 255, 255, 0.2)
    }

    .ft-content .navbox li .tit a {
        padding: 16px 0;
        position: relative;
        color: #fff
    }

    .ft-content .navbox li .tit a .iconfont {
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%)
    }

    .ft-content .navbox li:not(.contact) .info {
        display: none
    }

    .ft-content .navbox li.contact {
        border-bottom: 0
    }
}

@media (max-width:1199px) {
    .ft-content .contact {
        padding-top: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px);
        padding-bottom: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px)
    }
}

.ft-content .contact .logo {
    height: 35px;
    margin-bottom: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px)
}

.ft-content .contact .info {
    line-height: 24px
}

.ft-content .contact .info p {
    margin-bottom: 14px
}

.ft-content .contact .info a {
    color: #959595;
    display: inline-block
}

.ft-content .contact .share {
    display: flex;
    margin-top: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px)
}

.ft-content .contact .share .sitem {
    margin-right: 14px
}

.ft-content .contact .share .icon {
    width: 40px;
    height: 40px;
    background-color: #1d24aa;
    border-radius: 50%;
    display: block
}

.ft-content .contact .share .icon .ic {
    width: 100%;
    height: 100%;
    display: block
}

.ft-content .contact .share .icon .ic-in {
    background: url('../images/ic_in.png') no-repeat center center
}

.ft-content .contact .share .icon .ic-in2 {
    background: url('../images/ic_in2.png') no-repeat center center
}

.ft-content .contact .share .icon:hover {
    background: #999
}

.ft-bottom {
    padding-top: 20px;
    padding-bottom: 20px;
    line-height: 1.6;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    color: #959595;
    font-size: 12px
}

@media (min-width:1200px) {
    .ft-bottom {
        display: flex;
        align-items: center
    }

    .ft-bottom .copyright {
        flex: 1;
        margin-right: 5%
    }
}

.ft-bottom a {
    color: #959595
}

.ft-bottom a:hover {
    color: #fff
}

@media (max-width:1199px) {
    .ft-bottom .rbox {
        margin-top: 12px
    }
}

.ft-bottom .rbox .skill {
    padding-right: 10px
}

.ft-bottom .cnurl {
    border: 4px solid #1d24aa;
    border-radius: 1.5em;
    font-size: 14px;
    color: #fff;
    display: inline-block;
    padding: 4px 32px
}

.ft-bottom .cnurl:hover {
    background-color: #1d24aa;
    color: #fff
}

.index_banner {
    position: relative;
    overflow: hidden;
    max-height: 100vh;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 100vh
}

@media (max-width:992px) {
    .index_banner {
        height: clamp(calc(320 * 1px), calc(800 / 1200 * 100vw), 800px)
    }
}

.index_banner .pnext {
    padding: 20px;
    color: #fff
}

.index_banner .pnext::after {
    font-size: 22px
}

.index_banner video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 555
}

.index_banner .swiper-pagination {
    bottom: clamp(calc(50 / 2 * 1px), calc(50 / 1200 * 100vw), 50px)
}

.index_banner .swiper-pagination .swiper-pagination-bullet {
    width: clamp(calc(30 * 1px), calc(40 / 1200 * 100vw), 40px);
    height: 4px;
    height: 3px;
    border-radius: 0;
    background: #fff;
    opacity: .2;
    margin-left: clamp(calc(5 / 2 * 1px), calc(5 / 1200 * 100vw), 5px);
    margin-right: clamp(calc(5 / 2 * 1px), calc(5 / 1200 * 100vw), 5px)
}

.index_banner .swiper-pagination .swiper-pagination-bullet-active {
    opacity: 1
}

.index_banner li {
    position: relative
}

.index_banner li .link {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    z-index: 999;
    top: 0
}

.index_banner li .bg {
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center
}

.index_banner li .content {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: 5;
    color: #fff;
    width: 80vw
}

.index_banner li .content .inner {
    padding-bottom: clamp(calc(80 / 2 * 1px), calc(80 / 1200 * 100vw), 80px);
    line-height: 1.41666667
}

@media (min-width:768px) {
    .index_banner li .content .inner {
        width: 50%
    }
}

.index_banner li .tit {
    font-size: clamp(calc(48 / 2 * 1px), calc(48 / 1920 * 100vw), 48px);
    font-family: medium
}

.index_banner li .desc {
    margin-top: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px);
    font-size: clamp(calc(16 * 1px), calc(24 / 1200 * 100vw), 24px)
}

.banner_img {
    position: relative;
    overflow: hidden
}

.banner_img .bg {
    position: absolute;
    width: 100%;
    height: 100%;
    transition: all .3s cubic-bezier(.04, .79, 1, 1) !important;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    transform: scale(1.05);
    display: none
}

.banner_img .inner {
    height: clamp(calc(200 * 1px), calc(300 / 1200 * 100vw), 300px);
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: center;
    justify-content: center;
    color: #fff;
    display: none
}

.banner_img .inner .tit {
    font-size: clamp(calc(24 * 1px), calc(40 / 1200 * 100vw), 40px);
    font-family: medium
}

.banner_img .inner .desc {
    margin-top: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px);
    font-size: 16px;
    line-height: 1.5
}

.banner_img.animated .bg {
    transform: scale(1)
}

.crumbs {
    line-height: 40px;
    min-height: 40px
}

.crumbs a {
    color: #666
}

.crumbs a:hover {
    color: #1d24aa
}

.crumbs .icon-right {
    font-size: 80%
}

@media (min-width:640px) {
    .crumbs .icon-right {
        padding: 0 1px
    }
}

@media (max-width:480px) {
    .crumbs {
        font-size: 12px
    }
}

.crumbs {
    background-color: #1d24aa;
    color: #fff
}

.crumbs a {
    color: #fff
}

.crumbs a:hover {
    color: #fff;
    opacity: .8
}

.col_body {
    padding-top: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px);
    padding-bottom: clamp(calc(160 / 2 * 1px), calc(160 / 1200 * 100vw), 160px)
}

@media (min-width:1200px) {
    .col_body {
        display: flex;
        position: relative
    }

    .col_body .col_sub {
        width: clamp(calc(282 / 2 * 1px), calc(282 / 1200 * 100vw), 282px);
        margin-right: 24px
    }

    .col_body .col_main {
        flex: 1;
        overflow: hidden
    }
}

.menu_top {
    color: #fff;
    line-height: 50px;
    background-color: #1d24aa;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-bottom: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px);
    padding: 0 4%
}

@media (min-width:1200px) {
    .menu_top {
        display: none
    }
}

.menu_top h2 {
    font-size: 17px;
    font-weight: bold;
    line-height: 1.6
}

.menu_top h2 span {
    font-size: 15px;
    display: inline-block;
    font-weight: normal
}

.menu_top .arr {
    font-size: 24px
}

.menu_top.open .arr::before {
    content: "\ed1e"
}

@media (min-width:1200px) {
    .sub_menu {
        border-top: 2px solid #eeeeee;
        position: sticky;
        top: 120px
    }

    .sub_menu li {
        border-bottom: 2px solid #eeeeee
    }

    .sub_menu .ihd {
        position: relative;
        cursor: pointer;
        line-height: 48px;
        font-size: 18px;
        font-family: medium;
        padding: 0 46px 0 14px
    }

    .sub_menu .ihd a {
        display: block
    }

    .sub_menu .ihd .iconfont {
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        padding: 10px
    }

    .sub_menu .ihd:hover {
        color: #1d24aa
    }

    .sub_menu li.current .ihd a {
        color: #1d24aa
    }

    .sub_menu .open i::before {
        content: "\ed1e"
    }

    .sub_menu .open:not(.current) .ihd {
        color: #1d24aa
    }

    .sub_menu .ibd {
        border-top: 2px solid #eeeeee;
        display: none;
        padding: 20px 14px
    }

    .sub_menu .ibd p {
        margin-bottom: 16px
    }

    .sub_menu .ibd a {
        line-height: 1.5;
        color: #666
    }

    .sub_menu .ibd a:hover {
        color: #1d24aa
    }

    .sub_menu .ibd .active {
        color: #1d24aa;
        font-family: bold
    }
}

@media (max-width:1199px) {
    .sub_menu {
        display: none;
        margin-bottom: 40px
    }

    .sub_menu .menu_list {
        display: none;
        background: #fff;
        padding: 6px 0
    }

    .sub_menu li {
        border-bottom: 1px solid #f8f8f8
    }

    .sub_menu .ihd {
        background: #fff;
        line-height: 42px;
        padding-left: 4%;
        position: relative;
        font-size: 16px;
        cursor: pointer;
        font-weight: normal
    }

    .sub_menu .ihd .iconfont {
        padding: 0 4%;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        font-size: 120%
    }

    .sub_menu .ihd:hover {
        color: #1d24aa
    }

    .sub_menu .open .ihd {
        color: #1d24aa;
        font-family: bold
    }

    .sub_menu .open .ihd .iconfont::before {
        content: "\ed1e"
    }

    .sub_menu .open .ibd {
        background: #fafafb
    }

    .sub_menu .ibd {
        padding: 16px 4%;
        display: none
    }

    .sub_menu .ibd p {
        margin-bottom: 10px
    }

    .sub_menu .ibd a {
        line-height: 1.5;
        display: block
    }

    .sub_menu .ibd .active,
    .sub_menu .ibd a:hover {
        color: #1d24aa
    }
}

.channel-product-item {
    margin-bottom: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px)
}

.channel-product-item:not(:first-child) {
    border-top: 1px solid #f7f7f7;
    padding-top: 20px
}

.channel-product-item .hd {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-bottom: 20px
}

.channel-product-item .hd .title {
    line-height: 48px;
    font-size: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px);
    font-family: bold
}

.channel-product-item .hd .more {
    line-height: 28px;
    border-radius: 2em;
    padding: 0 10px 0 16px;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    border: 1px solid #1d24aa;
    color: #1d24aa
}

.channel-product-item .hd .more i {
    font-size: 120%
}

.channel-product-item .hd .more:hover {
    background-color: #1d24aa;
    color: #fff;
    background: #000
}

.channel-product-item .product-list li {
    margin-bottom: clamp(calc(50 / 2 * 1px), calc(50 / 1200 * 100vw), 50px)
}

.product-list {
    margin-left: calc(-1 * clamp(calc(10 * 1px), calc(12 / 1200 * 100vw), 12px)) !important;
    margin-right: calc(-1 * clamp(calc(10 * 1px), calc(12 / 1200 * 100vw), 12px)) !important
}

.product-list.stretch {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch
}

.product-list.stretch::before {
    display: none
}

.product-list.stretch li>.inner,
.product-list.stretch li>a {
    height: 100%
}

.product-list>* {
    padding-left: clamp(calc(10 * 1px), calc(12 / 1200 * 100vw), 12px) !important;
    padding-right: clamp(calc(10 * 1px), calc(12 / 1200 * 100vw), 12px) !important;
    margin-bottom: calc(clamp(calc(10 * 1px), calc(12 / 1200 * 100vw), 12px) * 2)
}

@media (max-width:639px) {
    .product-list li {
        width: 100%;
        margin-bottom: 24px
    }
}

.product_item {
    border: 1px solid #eeeeee;
    overflow: hidden;
    border-radius: 8px;
    transition: all .3s cubic-bezier(.04, .79, 1, 1) !important;
    display: block;
    position: relative
}

.product_item:not(.loading):hover {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1)
}

.product_item:not(.loading):hover .more {
    opacity: 1
}

.product_item .cimgbox {
    padding-bottom: 61.70212766%
}

.product_item .info {
    padding: 18px 18px 50px;
    position: relative
}

.product_item .info .tit {
    font-size: 16px;
    font-family: bold;
    margin-bottom: 10px
}

.product_item .info .desc {
    color: #666;
    line-height: 24px;
    max-height: 96px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical
}

.product_item .more {
    background-color: #1d24aa;
    color: #fff;
    line-height: 40px;
    text-align: center;
    text-transform: uppercase;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    transition: all .3s cubic-bezier(.04, .79, 1, 1) !important
}

@media (min-width:992px) {
    .product_item .more {
        opacity: 0
    }
}

.product_item.loading>* {
    transition: all .3s cubic-bezier(.04, .79, 1, 1) !important
}

.product_item.loading .cimgbox .img {
    visibility: hidden;
    background: #fafafb
}

.product_item.loading .info .tit,
.product_item.loading .info .desc {
    color: transparent;
    background: #fafafb;
    border-radius: 2px
}

.caseitem {
    overflow: hidden;
    border-radius: 8px;
    transition: all .3s cubic-bezier(.04, .79, 1, 1) !important;
    display: block;
    position: relative
}

.caseitem .cimgbox {
    padding-bottom: 61.70212766%
}

.caseitem .info {
    padding: 18px 18px 22px;
    position: relative;
    border: 1px solid #eeeeee;
    border-top: 0
}

.caseitem .info .tit {
    font-size: 16px;
    font-family: bold;
    margin-bottom: 10px
}

.caseitem .info .desc {
    color: #666;
    line-height: 24px;
    max-height: 72px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical
}

.caseitem:hover .info {
    border-color: #1d24aa;
    background-color: #1d24aa
}

.caseitem:hover .info * {
    color: #fff
}

.product-main-top {
    background: #fafafb;
    padding-top: clamp(calc(70 / 2 * 1px), calc(70 / 1200 * 100vw), 70px);
    padding-bottom: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px)
}

.product-main-top .row {
    margin-left: calc(-1 * clamp(calc(35 / 2 * 1px), calc(35 / 1200 * 100vw), 35px)) !important;
    margin-right: calc(-1 * clamp(calc(35 / 2 * 1px), calc(35 / 1200 * 100vw), 35px)) !important
}

.product-main-top .row.stretch {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch
}

.product-main-top .row.stretch::before {
    display: none
}

.product-main-top .row.stretch li>.inner,
.product-main-top .row.stretch li>a {
    height: 100%
}

.product-main-top .row>* {
    padding-left: clamp(calc(35 / 2 * 1px), calc(35 / 1200 * 100vw), 35px) !important;
    padding-right: clamp(calc(35 / 2 * 1px), calc(35 / 1200 * 100vw), 35px) !important;
    margin-bottom: calc(clamp(calc(35 / 2 * 1px), calc(35 / 1200 * 100vw), 35px) * 2)
}

.product-main-top li .tit,
.product-main-top li .txt {
    padding-left: clamp(calc(66 / 2 * 1px), calc(66 / 1200 * 100vw), 66px)
}

.product-main-top li .tit {
    font-size: 18px;
    font-family: bold;
    line-height: 24px;
    margin-bottom: 14px;
    position: relative
}

.product-main-top li .tit::before {
    content: '';
    display: block;
    width: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px);
    height: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px);
    background-image: url('../images/ocheck.png');
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    left: 0;
    left: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px)
}

@media (max-width:640px) {
    .product-main-top li .tit::before {
        left: 0
    }
}

.product-main-top li .txt {
    line-height: 24px;
    color: #666
}

.product-filter {
    border: 1px solid #eeeeee;
    overflow: hidden;
    margin-bottom: clamp(calc(30 * 1px), calc(40 / 1200 * 100vw), 40px)
}

@media (min-width:768px) {
    .product-filter {
        border-radius: 8px
    }

    .product-filter form {
        display: block !important
    }
}

.product-filter .hd {
    background: #fafafb;
    padding-left: clamp(calc(24 / 2 * 1px), calc(24 / 1200 * 100vw), 24px);
    padding-right: clamp(calc(24 / 2 * 1px), calc(24 / 1200 * 100vw), 24px);
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    user-select: none
}

.product-filter .hd .title {
    line-height: clamp(calc(50 * 1px), calc(60 / 1200 * 100vw), 60px);
    font-size: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px);
    font-family: bold
}

.product-filter .hd .arr {
    font-size: 24px
}

@media (min-width:768px) {
    .product-filter .hd .arr {
        display: none
    }
}

.product-filter .hd.open .arr::before {
    content: "\ed1e"
}

@media (max-width:767px) {
    .product-filter .bd .tit {
        padding: 6px 0 12px
    }
}

.product-filter li {
    border-top: 1px solid #eeeeee
}

@media (min-width:768px) {
    .product-filter li {
        display: flex
    }

    .product-filter li .tit {
        width: 160px;
        border-right: 1px solid #eeeeee;
        background: #fafafb
    }

    .product-filter li .info {
        flex: 1
    }

    .product-filter li .tit,
    .product-filter li .info {
        padding: 16px 0 2px;
        padding-left: clamp(calc(24 / 2 * 1px), calc(24 / 1200 * 100vw), 24px)
    }
}

@media (max-width:767px) {
    .product-filter li {
        padding: 10px;
        padding-left: clamp(calc(24 / 2 * 1px), calc(24 / 1200 * 100vw), 24px);
        padding-right: clamp(calc(24 / 2 * 1px), calc(24 / 1200 * 100vw), 24px)
    }
}

.product-filter li .tit {
    font-family: bold
}

.product-filter li .info {
    line-height: 2;
    display: flex;
    flex-wrap: wrap
}

.product-filter li .info .iitem {
    margin-right: clamp(calc(10 / 2 * 1px), calc(10 / 1200 * 100vw), 10px);
    margin-bottom: 10px
}

.product-filter li .info .layui-form-checkbox i {
    border-color: #1d24aa
}

.product-filter li .info .layui-form-checked[lay-skin=primary] i::before {
    display: none
}

.product-filter:has(+ .product-tip-box) {
    margin-bottom: 10px
}

.product-top {
    margin-top: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px);
    margin-bottom: clamp(calc(100 / 2 * 1px), calc(100 / 1200 * 100vw), 100px)
}

@media (min-width:992px) {
    .product-top {
        display: flex
    }

    .product-top .lbox {
        width: 50%
    }

    .product-top .info {
        flex: 1;
        padding-left: clamp(calc(80 / 2 * 1px), calc(80 / 1920 * 100vw), 80px)
    }
}

.product-top .lbox {
    text-align: center;
    padding-left: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px);
    padding-right: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px)
}

.product-top .lbox .cimgbox {
    padding-bottom: 61.70212766%
}

.product-top .info .title {
    font-size: clamp(calc(24 * 1px), calc(40 / 1200 * 100vw), 30px);
    font-family: bold;
    color: #1d24aa;
    margin-bottom: clamp(calc(10 * 1px), calc(16 / 1200 * 100vw), 16px)
}

.product-top .info .no {
    font-size: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px);
    padding-bottom: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px);
    position: relative;
    margin-bottom: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px)
}

.product-top .info .no::after {
    content: '';
    display: block;
    position: absolute;
    width: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px);
    height: clamp(calc(4 / 2 * 1px), calc(4 / 1200 * 100vw), 4px);
    background-color: #1d24aa;
    left: 0;
    bottom: 0
}

.product-top .info .txt {
    font-size: clamp(calc(15 * 1px), calc(16 / 1200 * 100vw), 16px);
    line-height: 1.75;
    margin-bottom: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px)
}

.product-top .info .btns {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center
}

.product-top .info .btns .rbtn {
    margin-right: 12px
}

.rbtn {
    border-radius: 2em;
    border: 1px solid #1d24aa;
    text-align: center;
    line-height: clamp(calc(36 * 1px), calc(40 / 1200 * 100vw), 40px);
    padding: 0 34px;
    display: inline-block;
    color: #1d24aa
}

.rbtn.bg {
    background-color: #1d24aa;
    color: #fff
}

.rbtn:hover {
    background-color: #1d24aa;
    color: #fff
}

.vmore {
    border-radius: 2em;
    border: 1px solid #1d24aa;
    text-align: center;
    background-color: #1d24aa;
    color: #fff;
    line-height: clamp(calc(36 * 1px), calc(40 / 1200 * 100vw), 40px);
    padding: 0 30px;
    display: inline-block
}

.vmore:hover {
    background: #000;
    color: #fff
}

.product-nav {
    background: #fafafb;
    font-family: bold
}

.product-nav .wrap {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center
}

.product-nav a {
    line-height: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px);
    color: #666
}

.product-nav a:hover {
    color: #1d24aa
}

.product-nav a+a {
    margin-left: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px)
}

.product-nav a.on {
    position: relative
}

.product-nav a.on::after {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #1d24aa;
    left: 0;
    bottom: 0
}

.article {
    line-height: 1.76;
    color: #777;
    overflow-x: auto
}

@media (min-width:1280px) {
    .article {
        font-size: 16px
    }
}

@media (max-width:1200px) and (min-widht:1279px) {
    .article {
        font-size: 15px
    }
}

.article video {
    width: 100%;
    object-fit: contain;
    border-radius: .16rem;
    margin-bottom: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px)
}

.article h3,
.article .h3 {
    font-size: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px);
    line-height: 1.4;
    margin-bottom: clamp(calc(16 / 2 * 1px), calc(16 / 1200 * 100vw), 16px);
    font-family: bold;
    color: #000;
    padding-top: clamp(calc(16 / 2 * 1px), calc(16 / 1200 * 100vw), 16px)
}

.article ul {
    list-style-position: outside;
    padding-left: 1.5em
}

.article ul li {
    margin-bottom: 10px;
    list-style-type: disc
}

.article .table-wrap {
    overflow-x: auto
}

.probox {
    padding-bottom: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px);
    overflow: hidden
}

.probox .hd {
    font-size: clamp(calc(20 * 1px), calc(24 / 1200 * 100vw), 24px);
    font-family: bold;
    border-bottom: 1px solid #eeeeee;
    margin-bottom: clamp(calc(34 / 2 * 1px), calc(34 / 1200 * 100vw), 34px);
    line-height: clamp(calc(66 / 2 * 1px), calc(66 / 1200 * 100vw), 66px)
}

.probox .introduce {
    padding-top: clamp(calc(50 / 2 * 1px), calc(50 / 1200 * 100vw), 50px)
}

.probox .article {
    color: #666
}

.probox .article table {
    width: 100%;
    min-width: 992px;
    table-layout: fixed
}

.probox .article table tr:nth-child(2n+1) {
    background-color: #f3f4fb
}

.probox .article table td {
    padding: 10px 15px
}

.probox .article table td:nth-child(2n+1) {
    width: 12%;
    font-weight: bold
}

@media (min-width:992px) {
    .probox .article table td:nth-child(2n+1) {
        padding-left: 22px
    }
}

.probox .article table td:nth-child(2n) {
    width: 20%
}

.probox .article table td:nth-child(3) {
    border-left: 3px solid #fff
}

@media (max-width:767px) {
    .probox .features-list {
        margin-left: auto;
        margin-right: auto
    }

    .probox .features-list li {
        margin-bottom: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px)
    }
}

@media (max-width:767px) and (min-width:1900px) {
    .probox .features-list {
        width: 63vw
    }
}

@media (max-width:767px) and (max-width:1899px) {
    .probox .features-list {
        width: 88vw
    }
}

@media (max-width:767px) and (min-width:1900px) {
    .probox .features-list {
        width: 63vw
    }
}

@media (max-width:767px) and (max-width:1899px) {
    .probox .features-list {
        width: 88vw
    }
}

@media (max-width:767px) and (min-width:640px) {
    .probox .features-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between
    }

    .probox .features-list li {
        width: 46%
    }
}

@media (min-width:768px) {
    .probox .features-list li .inner {
        margin-left: auto;
        margin-right: auto;
        padding-top: clamp(calc(70 / 2 * 1px), calc(70 / 1200 * 100vw), 70px);
        padding-bottom: clamp(calc(70 / 2 * 1px), calc(70 / 1200 * 100vw), 70px);
        display: flex;
        align-items: center;
        justify-content: space-between
    }

    .probox .features-list li .inner .imgbox,
    .probox .features-list li .inner .info {
        width: 45.8%
    }

    .probox .features-list li:nth-child(2n) {
        background: #fafafb;
        position: relative
    }

    .probox .features-list li:nth-child(2n) .info {
        order: -1
    }

    .probox .features-list li:nth-child(2n) {
        background: #fafafb;
        position: relative
    }

    .probox .features-list li:nth-child(2n)::before {
        content: '';
        display: block;
        position: absolute;
        width: 200vw;
        height: 100%;
        left: -50vw;
        top: 0;
        background: #fafafb;
        z-index: -1
    }
}

@media (min-width:768px) and (min-width:1900px) {
    .probox .features-list li .inner {
        width: 63vw
    }
}

@media (min-width:768px) and (max-width:1899px) {
    .probox .features-list li .inner {
        width: 88vw
    }
}

@media (min-width:768px) and (min-width:1900px) {
    .probox .features-list li .inner {
        width: 63vw
    }
}

@media (min-width:768px) and (max-width:1899px) {
    .probox .features-list li .inner {
        width: 88vw
    }
}

.probox .features-list li .imgbox {
    border-radius: 8px
}

@media (max-width:767px) {
    .probox .features-list li .imgbox {
        margin-bottom: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px)
    }
}

.probox .features-list li .imgbox .cimgbox {
    padding-bottom: 61.81818182%
}

.probox .features-list li .info .tit {
    font-size: clamp(calc(20 * 1px), calc(30 / 1200 * 100vw), 30px);
    font-family: bold;
    line-height: 1.2;
    margin-bottom: clamp(calc(15 / 2 * 1px), calc(15 / 1200 * 100vw), 15px)
}

.probox .features-list li .info .txt {
    line-height: 1.7;
    color: #666
}

.probox .download {
    margin-left: calc(-1 * clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px)) !important;
    margin-right: calc(-1 * clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px)) !important
}

.probox .download.stretch {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch
}

.probox .download.stretch::before {
    display: none
}

.probox .download.stretch li>.inner,
.probox .download.stretch li>a {
    height: 100%
}

.probox .download>* {
    padding-left: clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px) !important;
    padding-right: clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px) !important;
    margin-bottom: calc(clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px) * 2)
}

.probox .download a {
    background: #fafafb;
    border-radius: clamp(calc(8 / 2 * 1px), calc(8 / 1200 * 100vw), 8px);
    display: block;
    padding: clamp(calc(32 / 2 * 1px), calc(32 / 1200 * 100vw), 32px);
    line-height: 1.7;
    display: flex
}

.probox .download a .icon {
    width: clamp(calc(31 / 2 * 1px), calc(31 / 1200 * 100vw), 31px);
    height: clamp(calc(38 / 2 * 1px), calc(38 / 1200 * 100vw), 38px);
    background-image: url('../images/pdf.png');
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: clamp(calc(24 / 2 * 1px), calc(24 / 1200 * 100vw), 24px)
}

.probox .download a span {
    display: flex;
    align-items: center;
    flex: 1
}

.probox .download a:hover {
    background-color: #1d24aa;
    color: #fff
}

.probox .download a:hover .icon {
    background-image: url('../images/pdf_f.png')
}

.related-application {
    padding-top: clamp(calc(80 / 2 * 1px), calc(80 / 1200 * 100vw), 80px);
    padding-bottom: clamp(calc(110 / 2 * 1px), calc(110 / 1200 * 100vw), 110px)
}

.related-application .hd {
    text-align: center;
    font-size: clamp(calc(20 * 1px), calc(30 / 1200 * 100vw), 30px);
    font-family: bold;
    margin-bottom: clamp(calc(42 / 2 * 1px), calc(42 / 1200 * 100vw), 42px)
}

.related-application .swiper-button-next,
.related-application .swiper-button-prev {
    margin-top: -30px
}

.industries-imgs {
    margin-bottom: clamp(calc(70 / 2 * 1px), calc(70 / 1200 * 100vw), 70px)
}

.industries-list {
    margin-left: calc(-1 * clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px)) !important;
    margin-right: calc(-1 * clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px)) !important
}

.industries-list.stretch {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch
}

.industries-list.stretch::before {
    display: none
}

.industries-list.stretch li>.inner,
.industries-list.stretch li>a {
    height: 100%
}

.industries-list>* {
    padding-left: clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px) !important;
    padding-right: clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px) !important;
    margin-bottom: calc(clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px) * 2)
}

@media (max-width:600px) {
    .industries-list li {
        width: 100%
    }
}

.industries_item {
    border: 1px solid #eeeeee;
    border-radius: clamp(calc(8 / 2 * 1px), calc(8 / 1200 * 100vw), 8px);
    overflow: hidden;
    background: #fff;
    display: block;
    position: relative
}

.industries_item:hover .info {
    background-color: #1d24aa;
    color: #fff
}

.industries_item:hover .cimgbox .img {
    transition: all .6s cubic-bezier(.04, .79, 1, 1) !important;
    transform: scale(1.05)
}

.industries_item .cimgbox {
    padding-bottom: 62.14285714%
}

.industries_item .info {
    padding: 20px 24px
}

.industries_item .info .tit {
    font-size: 16px;
    line-height: 1.5;
    font-family: bold
}

.appitem {
    border: 1px solid #eeeeee;
    border-radius: clamp(calc(8 / 2 * 1px), calc(8 / 1200 * 100vw), 8px);
    overflow: hidden;
    background: #fff;
    display: block;
    position: relative
}

.appitem:hover .coverbox {
    transform: translateY(0)
}

.appitem .cimgbox {
    padding-bottom: 62.5%
}

.appitem .info {
    padding: 22px 24px
}

.appitem .info .tit {
    font-size: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px);
    font-family: bold;
    margin-bottom: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px)
}

.appitem .info .desc {
    color: #666;
    line-height: 1.7;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    height: 3.4em;
    overflow: hidden
}

.appitem .coverbox {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    transition: all .3s cubic-bezier(.04, .79, 1, 1) !important;
    transform: translateY(101%);
    color: #fff;
    padding: 36px 24px;
    background-color: rgba(29, 36, 170, 0.9)
}

.appitem .coverbox .tit {
    font-size: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px);
    font-family: bold;
    margin-bottom: 20px
}

.appitem .coverbox .desc {
    line-height: 1.7;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    height: 10.2em;
    overflow: hidden
}

.appitem .coverbox .vmore {
    position: absolute;
    left: 24px;
    bottom: 30px
}

.newsitem {
    border: 1px solid #eeeeee;
    border-radius: clamp(calc(8 / 2 * 1px), calc(8 / 1200 * 100vw), 8px);
    overflow: hidden;
    background: #fff;
    display: block;
    position: relative
}

.newsitem:hover .coverbox {
    transform: translateY(0)
}

.newsitem .cimgbox {
    padding-bottom: 62.5%
}

.newsitem .time {
    font-size: 14px;
    margin-bottom: 12px
}

.newsitem .tit {
    font-size: 16px;
    font-family: bold;
    line-height: 1.6;
    height: 3.4em;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom: clamp(calc(46 / 2 * 1px), calc(46 / 1200 * 100vw), 46px)
}

.newsitem .desc {
    line-height: 1.7;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    height: 6.8em
}

.newsitem .info {
    padding: 22px 24px
}

.newsitem .info .time {
    color: #666
}

.newsitem .info .type {
    color: #1d24aa
}

.newsitem .coverbox {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    transition: all .3s cubic-bezier(.04, .79, 1, 1) !important;
    transform: translateY(101%);
    color: #fff;
    padding: 40px 24px;
    background-color: rgba(29, 36, 170, 0.9)
}

.newsitem .coverbox .vmore {
    position: absolute;
    left: 24px;
    bottom: 30px
}

.tag-list {
    margin-bottom: clamp(calc(46 / 2 * 1px), calc(46 / 1200 * 100vw), 46px)
}

.tag-list li {
    padding: .4rem 0;
    border-bottom: 1px solid #eeeeee
}

@media (min-width:640px) {
    .tagitem {
        display: flex
    }

    .tagitem .imgbox {
        width: 232px;
        margin-right: clamp(calc(38 / 2 * 1px), calc(38 / 1200 * 100vw), 38px)
    }

    .tagitem .info {
        flex: 1;
        overflow: hidden
    }
}

.tagitem:hover .tit {
    color: #1d24aa
}

.tagitem .imgbox {
    border-radius: .16rem
}

@media (max-width:639px) {
    .tagitem .imgbox {
        margin-bottom: 20px
    }
}

.tagitem .cimgbox {
    padding-bottom: 62.5%
}

.tagitem .tit {
    font-size: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px);
    line-height: 1.6;
    height: 3.4em;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom: clamp(calc(46 / 2 * 1px), calc(46 / 1200 * 100vw), 46px)
}

.tagitem .more {
    color: #1d24aa
}

.industries-box .hd {
    text-align: center;
    padding-top: clamp(calc(80 / 2 * 1px), calc(80 / 1200 * 100vw), 80px);
    padding-bottom: clamp(calc(90 / 2 * 1px), calc(90 / 1200 * 100vw), 90px)
}

.industries-box .hd .title {
    font-size: clamp(calc(22 * 1px), calc(36 / 1200 * 100vw), 36px);
    margin-bottom: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px);
    font-family: bold;
    padding-bottom: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px);
    position: relative
}

.industries-box .hd .title::after {
    content: '';
    display: block;
    width: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px);
    height: clamp(calc(4 / 2 * 1px), calc(4 / 1200 * 100vw), 4px);
    background-color: #1d24aa;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    bottom: 0
}

.industries-box .hd .desc {
    color: #666;
    line-height: 1.7;
    max-width: 760px;
    margin: 0 auto
}

.industries-box .bd {
    padding-top: clamp(calc(80 / 2 * 1px), calc(80 / 1200 * 100vw), 80px);
    padding-bottom: clamp(calc(80 / 2 * 1px), calc(80 / 1200 * 100vw), 80px)
}

.industries-list {
    margin-left: calc(-1 * clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px)) !important;
    margin-right: calc(-1 * clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px)) !important
}

.industries-list.stretch {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch
}

.industries-list.stretch::before {
    display: none
}

.industries-list.stretch li>.inner,
.industries-list.stretch li>a {
    height: 100%
}

.industries-list>* {
    padding-left: clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px) !important;
    padding-right: clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px) !important;
    margin-bottom: calc(clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px) * 2)
}

.industries-top .title {
    font-size: clamp(calc(20 * 1px), calc(36 / 1200 * 100vw), 36px);
    font-family: bold;
    color: #1d24aa;
    line-height: 1.4;
    margin-bottom: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px)
}

.industries-top .content {
    background: #fafafb;
    border-radius: clamp(calc(8 / 2 * 1px), calc(8 / 1200 * 100vw), 8px);
    margin-bottom: clamp(calc(34 / 2 * 1px), calc(34 / 1200 * 100vw), 34px);
    overflow: hidden
}

@media (min-width:992px) {
    .industries-top .content {
        display: flex
    }

    .industries-top .content .lbox {
        width: 45%
    }

    .industries-top .content .rbox {
        flex: 1
    }
}

.industries-top .content .cimgbox {
    padding-bottom: 70%
}

.industries-top .content .rbox {
    padding: 24px
}

.industries-top .content .rbox .article {
    margin-bottom: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px)
}

.industries-top .content .rbox .rbtn {
    padding-left: clamp(calc(26 * 1px), calc(30 / 1200 * 100vw), 30px);
    padding-right: clamp(calc(26 * 1px), calc(30 / 1200 * 100vw), 30px);
    display: inline-block;
    line-height: clamp(calc(36 * 1px), calc(40 / 1200 * 100vw), 40px)
}

.industries-top .tags {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    margin-top: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px);
    color: #999;
    padding-left: 26px;
    background: url('../images/link.png') no-repeat 'left' 'top';
    background: url(../images/link.png) no-repeat 0 3px;
    background-size: 14px;
    line-height: 20px
}

.industries-top .tags a {
    color: #999;
    margin: 0 2px
}

.industries-top .tags a:hover {
    color: #1d24aa
}

.industriesbox {
    margin-top: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px);
    margin-bottom: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px);
    border-top: 1px solid #eeeeee
}

.industriesbox .title {
    font-size: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px);
    font-family: bold;
    padding-top: clamp(calc(32 / 2 * 1px), calc(32 / 1200 * 100vw), 32px);
    padding-bottom: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px)
}

.swiper-solutions {
    padding-bottom: clamp(calc(40 * 1px), calc(60 / 1200 * 100vw), 60px)
}

.pagtion {
    text-align: center
}

.index-product {
    padding-bottom: clamp(calc(90 / 2 * 1px), calc(90 / 1200 * 100vw), 90px);
    padding-top: .7rem;
    background: url(../images/bg1.jpg) no-repeat center #000;
    background-size: cover;
    color: #fff
}

.index-product .swiper-pagination {
    text-align: center;
    width: 100%
}

.index-product .swiper-pagination-bullet {
    background: #fff;
    opacity: .3;
    text-align: center;
    margin: 0 5px;
    width: clamp(calc(8 * 1px), calc(12 / 1200 * 100vw), 12px);
    height: clamp(calc(8 * 1px), calc(12 / 1200 * 100vw), 12px)
}

.index-product .swiper-pagination-bullet-active {
    opacity: 1
}

.index-product .inner {
    display: block;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: .16rem;
    padding: 20px
}

.index-product .inner .cimgbox {
    border-radius: .12rem;
    padding-bottom: 78.51239669%
}

.index-product .inner .tit {
    text-align: center;
    font-size: 16px;
    padding-top: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px);
    padding-bottom: clamp(calc(14 / 2 * 1px), calc(14 / 1200 * 100vw), 14px);
    font-family: bold;
    color: #fff;
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.index-hot-product {
    padding-top: clamp(calc(46 * 1px), calc(78 / 1200 * 100vw), 78px);
    padding-bottom: clamp(calc(46 * 1px), calc(78 / 1200 * 100vw), 78px)
}

.index-news {
    padding-top: clamp(calc(90 / 2 * 1px), calc(90 / 1200 * 100vw), 90px);
    padding-bottom: clamp(calc(120 / 2 * 1px), calc(120 / 1200 * 100vw), 120px)
}

.index-pratner {
    padding-top: clamp(calc(110 / 2 * 1px), calc(110 / 1200 * 100vw), 110px);
    padding-bottom: clamp(calc(110 / 2 * 1px), calc(110 / 1200 * 100vw), 110px);
    background: url(../images/bg2.jpg) no-repeat center #000;
    background-size: cover;
    color: #fff;
    text-align: center
}

.index-pratner .tit1 {
    margin-bottom: clamp(calc(50 / 2 * 1px), calc(50 / 1200 * 100vw), 50px)
}

@media (min-width:1900px) {
    .index-pratner .swiper-partner {
        width: 60vw
    }
}

@media (max-width:1899px) {
    .index-pratner .swiper-partner {
        width: 80vw
    }
}

.index-pratner .swiper-partner li {
    padding-left: clamp(calc(15 / 2 * 1px), calc(15 / 1200 * 100vw), 15px);
    padding-right: clamp(calc(15 / 2 * 1px), calc(15 / 1200 * 100vw), 15px);
    width: 130px
}

@media (max-width:992px) {
    .index-pratner .swiper-partner li {
        width: 20%
    }
}

@media (max-width:600px) {
    .index-pratner .swiper-partner li {
        width: 25%
    }
}

@media (max-width:480px) {
    .index-pratner .swiper-partner li {
        width: 33.33333333%
    }
}

.index-pratner .swiper-partner .inner {
    border-radius: .16rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding-bottom: 100%;
    position: relative
}

.index-pratner .swiper-partner .inner .img {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: 5;
    max-width: 80%
}

.index-industries {
    padding-top: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px);
    padding-bottom: clamp(calc(100 / 2 * 1px), calc(100 / 1200 * 100vw), 100px)
}

.index-industries .wrap {
    position: relative
}

.index-industries .nav-list {
    display: flex;
    /* justify-content: space-between; */
    justify-content: space-evenly;
    text-align: center;
    align-items: center;
    margin-bottom: clamp(calc(26 * 1px), calc(40 / 1200 * 100vw), 40px);
    font-size: 16px;
    border-bottom: 1px solid #eeeeee;
}

.index-industries .nav-list li {
    /* flex: 1; */
    flex: 0.1;
    cursor: pointer;
    overflow: hidden;
    background: #fafafb;
    position: relative;
    z-index: 5;
    padding-top: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px)
}

.index-industries .nav-list li .icon {
    width: clamp(calc(42 / 2 * 1px), calc(42 / 1200 * 100vw), 42px);
    height: clamp(calc(42 / 2 * 1px), calc(42 / 1200 * 100vw), 42px);
    display: block;
    margin: 0 auto;
    margin-bottom: clamp(calc(16 / 2 * 1px), calc(16 / 1200 * 100vw), 16px)
}

.index-industries .nav-list li .icon .ic {
    width: 100%;
    height: 100%;
    display: block;
    background-size: contain
}

.index-industries .nav-list li .icon .color {
    display: none
}

.index-industries .nav-list li .name {
    padding-bottom: clamp(calc(18 / 2 * 1px), calc(18 / 1200 * 100vw), 18px);
    position: relative;
    display: inline-block
}

.index-industries .nav-list li .name::after {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background-color: #1d24aa;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    bottom: 0;
    transition: all .3s cubic-bezier(.04, .79, 1, 1) !important
}

.index-industries .nav-list li:hover .name,
.index-industries .nav-list li.on .name {
    color: #1d24aa
}

.index-industries .nav-list li:hover .icon .ic.black,
.index-industries .nav-list li.on .icon .ic.black {
    display: none
}

.index-industries .nav-list li:hover .icon .ic.color,
.index-industries .nav-list li.on .icon .ic.color {
    display: block
}

.index-industries .nav-list li.on {
    z-index: 1;
    overflow: visible
}

.index-industries .nav-list li.on .name::after {
    width: 100%
}

@media (max-width:1199px) {
    .index-industries .swiper_info {
        margin-bottom: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px)
    }
}

.index-industries .swiper_info .inner {
    display: block;
    background: #fff;
    border-radius: .16rem
}

@media (min-width:768px) {
    .index-industries .swiper_info .inner {
        display: flex
    }

    .index-industries .swiper_info .inner .imgbox,
    .index-industries .swiper_info .inner .content {
        width: 50%;
        overflow: hidden
    }

    .index-industries .swiper_info .inner .cimgbox {
        min-height: 100%
    }
}

.index-industries .swiper_info .inner .imgbox {
    border-radius: .16rem;
    overflow: hidden
}

.index-industries .swiper_info .inner .cimgbox {
    padding-bottom: 61.66666667%
}

.index-industries .swiper_info .inner .content {
    padding: .5rem
}

.index-industries .swiper_info .inner .content .tit {
    font-size: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px);
    font-family: medium;
    margin-bottom: clamp(calc(16 / 2 * 1px), calc(16 / 1200 * 100vw), 16px)
}

.index-industries .swiper_info .inner .content .desc {
    color: #666;
    line-height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    height: 120px;
    margin-bottom: clamp(calc(46 / 2 * 1px), calc(46 / 1200 * 100vw), 46px)
}

.index-inkedin {
    padding-top: clamp(calc(100 / 2 * 1px), calc(100 / 1200 * 100vw), 100px);
    padding-bottom: clamp(calc(100 / 2 * 1px), calc(100 / 1200 * 100vw), 100px)
}

.index-inkedin .vmore {
    margin: 0 auto;
    display: block;
    width: fit-content
}

.index-inkedin .row {
    margin-left: calc(-1 * clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px)) !important;
    margin-right: calc(-1 * clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px)) !important
}

.index-inkedin .row.stretch {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch
}

.index-inkedin .row.stretch::before {
    display: none
}

.index-inkedin .row.stretch li>.inner,
.index-inkedin .row.stretch li>a {
    height: 100%
}

.index-inkedin .row>* {
    padding-left: clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px) !important;
    padding-right: clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px) !important;
    margin-bottom: calc(clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px) * 2)
}

@media (max-width:639px) {
    .index-inkedin .row li {
        width: 100%
    }
}

.index-inkedin .item {
    display: block;
    border-radius: .16rem;
    background: #fafafb;
    margin-bottom: clamp(calc(24 / 2 * 1px), calc(24 / 1200 * 100vw), 24px);
    border: 1px solid #eeeeee
}

.index-inkedin .item .top {
    padding: 12px 10px;
    display: flex;
    align-items: center
}

.index-inkedin .item .top .logo {
    border-radius: 50%;
    width: 40px;
    height: 40px
}

.index-inkedin .item .top .info {
    margin: 0 10px;
    flex: 1;
    overflow: hidden
}

.index-inkedin .item .top .info .tit,
.index-inkedin .item .top .info .time {
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.index-inkedin .item .top .info .tit {
    font-family: bold;
    text-transform: uppercase;
    margin-bottom: 6px
}

.index-inkedin .item .top .info .time {
    font-size: 12px
}

.index-inkedin .item .top .icon-in {
    width: 18px;
    height: 18px;
    display: block;
    background-image: url('../images/in.png');
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat
}

.index-inkedin .item .desc {
    padding: 14px 14px 20px;
    color: #666
}

.index-inkedin .item .desc .txt {
    line-height: 24px;
    height: 96px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical
}

.index-inkedin .item .cimgbox {
    padding-bottom: 56.73758865%
}

@media (min-width:992px) {
    .index-inkedin .item:nth-child(1) .cimgbox {
        padding-bottom: 97.87234043%
    }
}

.index-inkedin .item:hover {
    background-color: #1d24aa;
    box-shadow: 0 .1rem .1rem 0 rgba(0, 0, 0, 0.08), inset 0 -3px 0 0 rgba(29, 36, 170, 0.004)
}

.index-inkedin .item:hover * {
    color: #fff
}

@media (min-width:992px) {
    .index-inkedin li:nth-child(2) .item:nth-child(2) .cimgbox {
        padding-bottom: 97.87234043%
    }

    .index-inkedin li:nth-child(2) .item:nth-child(1) .cimgbox {
        padding-bottom: 56.73758865%
    }
}

@media (max-width:1199px) {

    .index-inkedin li:nth-child(3),
    .index-inkedin li:nth-child(4) {
        display: none
    }
}

@media (max-width:639px) {
    .index-inkedin li:nth-child(2) {
        display: none
    }
}

.base-box {
    padding-top: clamp(calc(80 / 2 * 1px), calc(80 / 1200 * 100vw), 80px);
    padding-bottom: clamp(calc(150 / 2 * 1px), calc(150 / 1200 * 100vw), 150px)
}

.row.row3 {
    margin-left: calc(-1 * clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px)) !important;
    margin-right: calc(-1 * clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px)) !important
}

.row.row3.stretch {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch
}

.row.row3.stretch::before {
    display: none
}

.row.row3.stretch li>.inner,
.row.row3.stretch li>a {
    height: 100%
}

.row.row3>* {
    padding-left: clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px) !important;
    padding-right: clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px) !important;
    margin-bottom: calc(clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px) * 2)
}

@media (max-width:600px) {
    .row.row3 li {
        width: 100%
    }
}

.news-rec {
    padding-top: clamp(calc(84 / 2 * 1px), calc(84 / 1200 * 100vw), 84px);
    padding-bottom: clamp(calc(62 / 2 * 1px), calc(62 / 1200 * 100vw), 62px)
}

.news-rec .swiper-container .inner {
    display: block;
    background: #fff;
    border-radius: .16rem
}

.news-rec .swiper-container .inner:hover .tit {
    color: #1d24aa
}

@media (min-width:768px) {
    .news-rec .swiper-container .inner {
        display: flex
    }

    .news-rec .swiper-container .inner .imgbox,
    .news-rec .swiper-container .inner .content {
        width: 50%;
        overflow: hidden
    }
}

.news-rec .swiper-container .inner .cimgbox {
    border-radius: .16rem;
    padding-bottom: 61.66666667%
}

.news-rec .swiper-container .inner .content {
    padding: 0 .5rem
}

@media (max-width:767px) {
    .news-rec .swiper-container .inner .content {
        margin-top: 20px
    }
}

.news-rec .swiper-container .inner .content .time {
    font-size: 14px
}

.news-rec .swiper-container .inner .content .tit {
    font-size: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px);
    font-family: bold;
    line-height: 1.16666667;
    margin-top: clamp(calc(16 / 2 * 1px), calc(16 / 1200 * 100vw), 16px);
    margin-bottom: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px)
}

.news-rec .swiper-container .inner .content .desc {
    line-height: 1.75;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    height: 5.25em;
    margin-bottom: clamp(calc(50 / 2 * 1px), calc(50 / 1200 * 100vw), 50px)
}

@media (min-width:1280px) {
    .news-rec .swiper-container .inner .content .desc {
        font-size: 16px
    }
}

@media (max-width:1200px) and (min-widht:1279px) {
    .news-rec .swiper-container .inner .content .desc {
        font-size: 15px
    }
}

.news-rec .swiper-container .inner .content .rbtn {
    text-transform: uppercase
}

.col-page {
    padding-top: clamp(calc(76 / 2 * 1px), calc(76 / 1200 * 100vw), 76px)
}

@media (min-width:992px) {
    .col-page {
        display: flex;
        justify-content: space-between
    }

    .col-page .col-main {
        flex: 1;
        margin-right: clamp(calc(56 / 2 * 1px), calc(56 / 1200 * 100vw), 56px)
    }

    .col-page .col-sub {
        width: clamp(calc(280 * 1px), calc(330 / 1200 * 100vw), 330px)
    }

    .col-page .col-sub.software {
        width: clamp(calc(400 * 1px), calc(480 / 1200 * 100vw), 480px)
    }
}

.col-page .col-main,
.col-page .col-sub {
    margin-bottom: clamp(calc(140 / 2 * 1px), calc(140 / 1200 * 100vw), 140px)
}

@media (max-width:640px) {

    .col-page .col-main,
    .col-page .col-sub {
        margin-bottom: clamp(calc(80 / 2 * 1px), calc(80 / 1200 * 100vw), 80px)
    }
}

.article-main .hd {
    margin-bottom: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px);
    border-bottom: 1px solid #eeeeee;
    padding-bottom: 16px
}

.article-main .hd .title {
    font-size: clamp(calc(22 * 1px), calc(30 / 1200 * 100vw), 30px);
    line-height: 1.33333333;
    font-family: bold
}

.article-main .hd .data {
    padding: 20px 0 0;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    color: #666
}

.article-main .hd .data .share {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center
}

.article-main .hd .data .share i {
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    display: block;
    margin-left: clamp(calc(10 * 1px), calc(12 / 1200 * 100vw), 12px);
    font-size: 20px;
    color: #8e91d4
}

.article-main .hd .data .share .ic-in {
    background-image: url('../images/arc_in.png')
}

.article-main .hd .data .share .ic-in2 {
    background-image: url('../images/arc_in2.png')
}

.article-main .bd {
    padding-bottom: 30px
}

.article-main .bd .article p {
    margin-bottom: .5em
}

.article-main .bd .article img {
    border-radius: .16rem;
    margin-bottom: .5em
}

.article-main .bd .tags {
    padding-bottom: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px);
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    margin-top: clamp(calc(70 / 2 * 1px), calc(70 / 1200 * 100vw), 70px);
    color: #999;
    padding-left: 26px;
    background: url('../images/link.png') no-repeat 'left' 'top';
    background: url(../images/link.png) no-repeat 0 3px;
    background-size: 14px;
    line-height: 20px;
    border-bottom: 1px solid #eeeeee
}

.article-main .bd .tags a {
    color: #999;
    margin: 0 2px
}

.article-main .bd .tags a:hover {
    color: #1d24aa
}

.article-main .return {
    text-align: center
}

.col-solution-box {
    padding-bottom: 30px
}

.col-solution-box h2 {
    font-size: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px);
    color: #666;
    margin-bottom: clamp(calc(24 / 2 * 1px), calc(24 / 1200 * 100vw), 24px)
}

@media (max-width:991px) and (min-width:600px) {
    .col-solution-box .list {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between
    }

    .col-solution-box .list li {
        width: 48%
    }
}

.col-solution-box .list li {
    margin-bottom: 20px
}

.col-solution-box .list a {
    display: flex
}

.col-solution-box .list a:hover .tit {
    color: #1d24aa
}

.col-solution-box .list a .imgbox {
    border-radius: .1rem;
    width: 36.80981595%;
    overflow: hidden;
    position: relative
}

.col-solution-box .list a .imgbox .cimgbox {
    padding-bottom: 61.66666667%
}

.col-solution-box .list a .tit {
    font-family: bold;
    margin-left: 14px;
    flex: 1;
    line-height: 20px;
    max-height: 60px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical
}

.vduration {
    font-size: 12px;
    color: #fff;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 3px;
    line-height: 20px;
    padding: 0 5px;
    right: 7px;
    bottom: 7px;
    z-index: 55
}

.videoitem {
    border: 1px solid #eeeeee;
    border-radius: clamp(calc(8 / 2 * 1px), calc(8 / 1200 * 100vw), 8px);
    overflow: hidden;
    background: #fff;
    display: block;
    position: relative
}

.videoitem:hover .tit {
    color: #1d24aa
}

.videoitem:hover .coverbox {
    transform: translateY(0)
}

.videoitem:hover .cimgbox::after {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    background: url("../images/play.png") no-repeat center rgba(0, 0, 0, 0.5);
    left: 0;
    top: 0;
    z-index: 55
}

.videoitem .cimgbox {
    padding-bottom: 62.5%
}

.videoitem .vduration {
    right: 20px;
    bottom: 20px
}

.videoitem .time {
    font-size: 14px;
    margin-bottom: 12px
}

.videoitem .tit {
    font-size: 16px;
    font-family: bold;
    line-height: 1.6;
    height: 3.4em;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom: clamp(calc(16 * 1px), calc(20 / 1200 * 100vw), 20px)
}

.videoitem .info {
    padding: 22px 24px
}

.videoitem .tags {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    color: #999;
    padding-left: 24px;
    background: url('../images/link.png') no-repeat 'left' 'top';
    background: url(../images/link.png) no-repeat 0 3px;
    background-size: 14px;
    line-height: 20px
}

.videoitem .tags a {
    color: #999;
    margin: 0 2px
}

.videoitem .tags a:hover {
    color: #1d24aa
}

.video-box {
    padding-bottom: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px)
}

.video-box .title {
    font-size: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px);
    font-family: bold;
    margin-bottom: clamp(calc(24 / 2 * 1px), calc(24 / 1200 * 100vw), 24px)
}

.video-search {
    padding-top: clamp(calc(82 / 2 * 1px), calc(82 / 1200 * 100vw), 82px);
    padding-bottom: clamp(calc(58 / 2 * 1px), calc(58 / 1200 * 100vw), 58px)
}

.video-search form {
    max-width: 642px;
    margin: 0 auto;
    display: flex;
    align-items: stretch;
    border-bottom: 3px solid #1d24aa
}

.video-search form input {
    flex: 1;
    height: 50px;
    padding-left: 12px;
    font-size: 16px
}

.video-search form button {
    width: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px);
    color: #1d24aa;
    height: 50px;
    text-align: center;
    font-size: 20px
}

.software-main {
    padding-bottom: clamp(calc(150 / 2 * 1px), calc(150 / 1200 * 100vw), 150px)
}

.software-main .hd {
    padding-top: clamp(calc(76 / 2 * 1px), calc(76 / 1200 * 100vw), 76px);
    padding-bottom: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px);
    border-bottom: 1px solid #eeeeee;
    margin-bottom: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px);
    text-align: center
}

@media (min-width:768px) {
    .software-main .hd {
        display: -webkit-flex;
        display: flex;
        -webkit-align-items: center;
        align-items: center;
        -webkit-justify-content: space-between;
        justify-content: space-between
    }
}

.software-main .hd .title {
    font-size: clamp(calc(22 * 1px), calc(30 / 1200 * 100vw), 30px);
    font-family: bold
}

.software-main .hd .nav {
    display: flex
}

@media (max-width:767px) {
    .software-main .hd .nav {
        padding-top: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px);
        padding-bottom: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px);
        justify-content: center
    }
}

.software-main .hd .nav a {
    line-height: 30px;
    border: 1px solid #1d24aa;
    border-radius: 2em;
    padding: 0 10px;
    display: block;
    color: #1d24aa
}

.software-main .hd .nav a.on {
    background-color: #1d24aa;
    color: #fff
}

.software-main .hd .nav a+a {
    margin-left: 10px
}

.software-main .bd li {
    margin-bottom: 20px
}

.software-main .bd a {
    display: block;
    background-color: #fafafb;
    padding: 16px 22px 22px;
    border-radius: .16rem
}

.software-main .bd a:hover {
    background-color: #1d24aa
}

.software-main .bd a:hover .tit {
    background-image: url('../images/software2.png')
}

.software-main .bd a:hover .tit.pdf {
    background-image: url('../images/pdf2.png')
}

.software-main .bd a:hover * {
    color: #fff
}

.software-main .bd a:hover .down.last {
    color: #fff
}

.software-main .bd .titlebox {
    line-height: 28px;
    display: block
}

@media (min-width:640px) {
    .software-main .bd .titlebox {
        display: flex
    }

    .software-main .bd .titlebox .tit {
        flex: 1;
        margin-right: 5%
    }
}

.software-main .bd .titlebox .tit {
    padding-left: 36px;
    background: url('../images/software.png') no-repeat 0 2px;
    font-size: 16px;
    font-family: bold;
    display: block
}

.software-main .bd .titlebox .tit.pdf {
    background-image: url('../images/pdf.png');
    background-size: 21px
}

.software-main .bd .titlebox .down {
    color: #1d24aa;
    display: block
}

@media (max-width:639px) {
    .software-main .bd .titlebox .down {
        padding-left: 36px;
        margin-top: 10px
    }
}

.software-main .bd .desc {
    margin-top: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px);
    padding-left: 36px
}

.software-main .bd .down.last {
    color: #1d24aa;
    display: block;
    padding-left: 36px;
    margin-top: 20px
}

.col-software .inner {
    border-radius: .16rem;
    box-shadow: 0 .1rem .1rem 0 rgba(0, 0, 0, 0.08);
    overflow: hidden;
    border: 1px solid #eeeeee
}

.col-software .hd {
    background-color: #1d24aa;
    background-image: url('../images/bg3.png');
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    font-size: 16px;
    color: #fff;
    font-family: bold;
    line-height: 1.6;
    padding: clamp(calc(20 * 1px), calc(26 / 1200 * 100vw), 26px)
}

.col-software form {
    padding-left: clamp(calc(20 * 1px), calc(26 / 1200 * 100vw), 26px);
    padding-right: clamp(calc(20 * 1px), calc(26 / 1200 * 100vw), 26px);
    padding-top: 30px;
    padding-bottom: 40px
}

.col-software form ul {
    border-bottom: 1px solid #eeeeee;
    padding-bottom: clamp(calc(22 / 2 * 1px), calc(22 / 1200 * 100vw), 22px);
    margin-bottom: clamp(calc(20 * 1px), calc(30 / 1200 * 100vw), 30px)
}

.col-software form .cell {
    margin-bottom: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px)
}

.col-software form .cell .inputbox {
    margin-bottom: 10px
}

.col-software form .cell .layui-input {
    height: 48px;
    border: 0;
    background-color: #fafafb;
    padding-left: 18px
}

.col-software form .cell .tip,
.col-software form .cell .title {
    font-size: 12px;
    color: #999
}

.col-software form .cell .title {
    padding-top: 10px;
    font-size: 14px;
    margin-bottom: 16px
}

.col-software .vmore {
    width: 220px;
    line-height: 48px;
    font-family: bold;
    display: block;
    margin: 0 auto;
    cursor: pointer;
    user-select: none
}

.col-software .layui-form-selected dl {
    top: 49px;
    border: 0
}

.col-software .layui-form-selected dl dd {
    padding-left: 18px
}

.col-software .layui-form-radio {
    display: flex
}

.col-software .layui-form-radio i {
    color: #1d24aa
}

.col-software .layui-form-radio div {
    line-height: 22px;
    padding: 4px 0
}

.search-box {
    padding-bottom: clamp(calc(150 / 2 * 1px), calc(150 / 1200 * 100vw), 150px)
}

.search-box .hd .title {
    font-family: bold;
    font-size: clamp(calc(23 * 1px), calc(40 / 1200 * 100vw), 40px);
    line-height: 1.5;
    margin-top: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px);
    margin-bottom: clamp(calc(50 / 2 * 1px), calc(50 / 1200 * 100vw), 50px)
}

.search-box .hd .title em {
    color: #1d24aa
}

.search-box .hd nav {
    border-bottom: 1px solid #eeeeee;
    font-size: 16px;
    border-bottom-width: 2px;
    margin-bottom: 40px;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center
}

.search-box .hd nav .item+.item {
    margin-left: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px)
}

.search-box .hd nav .item {
    padding-bottom: clamp(calc(14 * 1px), calc(18 / 1200 * 100vw), 18px);
    display: inline-block;
    position: relative;
    color: #999
}

.search-box .hd nav .item:hover {
    color: #1d24aa
}

.search-box .hd nav .item.on {
    color: #000
}

.search-box .hd nav .item.on::after {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #1d24aa;
    left: 0;
    bottom: -2px
}

@media (max-width:600px) {
    .search-box .hd nav .item b {
        display: block;
        margin-top: 2px
    }
}

.col-loadingpage {
    max-width: 1920px
}

@media (max-width:991px) {
    .col-loadingpage .col-right {
        max-width: 600px;
        margin: 0 auto
    }

    .col-loadingpage .col-left {
        margin-left: auto;
        margin-right: auto
    }
}

@media (max-width:991px) and (min-width:1900px) {
    .col-loadingpage .col-left {
        width: 63vw
    }
}

@media (max-width:991px) and (max-width:1899px) {
    .col-loadingpage .col-left {
        width: 88vw
    }
}

@media (max-width:991px) and (min-width:1900px) {
    .col-loadingpage .col-left {
        width: 63vw
    }
}

@media (max-width:991px) and (max-width:1899px) {
    .col-loadingpage .col-left {
        width: 88vw
    }
}

@media (min-width:992px) {
    .col-loadingpage {
        display: flex;
        align-items: stretch
    }

    .col-loadingpage .col-left,
    .col-loadingpage .col-right {
        min-height: calc((100vh - 80px));
        width: 50vw
    }

    .col-loadingpage .col-right {
        position: relative
    }

    .col-loadingpage .col-right .img {
        width: 100%;
        height: 100%;
        position: absolute;
        object-fit: contain
    }

    .col-loadingpage .col-left {
        order: -1
    }

    .col-loadingpage .col-left .inner {
        width: 44vw;
        margin: 0 0 0 auto
    }

    .col-loadingpage .col-left .content {
        width: 422px;
        max-width: 36vw
    }
}

@media (min-width:992px) {
    .col-loadingpage .col-left {
        padding-top: clamp(calc(100 / 2 * 1px), calc(100 / 1200 * 100vw), 100px);
        padding-bottom: clamp(calc(130 / 2 * 1px), calc(130 / 1200 * 100vw), 130px)
    }
}

@media (max-width:991px) {
    .col-loadingpage .col-left {
        padding-top: clamp(calc(130 / 2 * 1px), calc(130 / 1200 * 100vw), 130px);
        padding-bottom: clamp(calc(260 / 2 * 1px), calc(260 / 1200 * 100vw), 260px);
        max-width: 460px;
        margin: 0 auto
    }
}

.col-loadingpage .col-left .content {
    margin: 0 auto
}

.col-loadingpage .col-left .title {
    font-size: clamp(calc(22 * 1px), calc(40 / 1200 * 100vw), 40px);
    color: #1d24aa;
    font-family: bold;
    line-height: 1.25
}

.col-loadingpage .col-left .desc {
    line-height: 1.75;
    margin-top: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px);
    margin-bottom: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px)
}

@media (min-width:1280px) {
    .col-loadingpage .col-left .desc {
        font-size: 16px
    }
}

@media (max-width:1200px) and (min-widht:1279px) {
    .col-loadingpage .col-left .desc {
        font-size: 15px
    }
}

.form2 ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap
}

.form2 .cell2 {
    width: 49%
}

@media (max-width:640px) {
    .form2 .cell2 {
        width: 100%
    }
}

.form2 .cell {
    margin-bottom: 20px;
    display: flex;
    align-items: start;
    background-color: #fafafb
}

.form2 .cell:not(.cell2) {
    width: 100%
}

.form2 .cell .layui-input {
    background-color: transparent;
    border: 0;
    font-size: 14px;
    height: 48px;
    flex: 1
}

.form2 .cell .layui-textarea {
    background: #fff;
    border: 0;
    resize: none;
    flex: 1;
    height: 160px;
    padding-top: 16px
}

.form2 .cell .layui-form-select {
    flex: 1
}

.form2 .cell .layui-form-select dl {
    top: 50px;
    border: 0
}

.form2 .cell.impor {
    position: relative
}

.form2 .cell.impor .important {
    padding-left: 12px;
    transform: translateX(4px);
    color: #f6673f;
    line-height: 48px;
    position: relative;
    z-index: 5;
    position: absolute;
    left: 0;
    top: 0
}

.form2 .cell.impor .layui-input {
    padding-left: 30px
}

.form2 .cell.impor .layui-textarea {
    padding-left: 30px
}

.form2.f .cell {
    background: #fff
}

.form2.f .layui-input {
    background: #fff
}

.form2 .submitbox {
    padding-top: 20px
}

.form2 .submitbox .submit {
    background-color: #1d24aa;
    color: #fff;
    border-radius: 2em;
    line-height: 48px;
    font-family: bold;
    text-align: center;
    font-size: 16px;
    cursor: pointer
}

.form2 .submitbox .submit:hover {
    background: #000
}

.form2 .agree {
    margin-bottom: 20px;
    color: #999
}

.form2 .agree a {
    color: #1d24aa
}

.form2 .agree .layui-form-checkbox * {
    white-space: wrap;
    display: inline
}

.loadingpage-solution .image {
    height: clamp(calc(220 * 1px), calc(425 / 1200 * 100vw), 425px);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center
}

.loadingpage-solution .content {
    padding-top: clamp(calc(96 / 2 * 1px), calc(96 / 1200 * 100vw), 96px);
    padding-bottom: clamp(calc(170 / 2 * 1px), calc(170 / 1200 * 100vw), 170px)
}

.loadingpage-solution .content .title {
    color: #1d24aa;
    margin-bottom: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px);
    font-family: bold;
    font-size: clamp(calc(22 * 1px), calc(36 / 1200 * 100vw), 36px)
}

.loadingpage-solution .content .desc {
    line-height: 1.8;
    padding-top: clamp(calc(34 / 2 * 1px), calc(34 / 1200 * 100vw), 34px);
    border-top: 1px solid #eeeeee
}

@media (min-width:1280px) {
    .loadingpage-solution .content .desc {
        font-size: 16px
    }
}

@media (max-width:1200px) and (min-widht:1279px) {
    .loadingpage-solution .content .desc {
        font-size: 15px
    }
}

@media (max-width:991px) {
    .loadingpage-top {
        margin-bottom: clamp(calc(100 / 2 * 1px), calc(100 / 1200 * 100vw), 100px)
    }
}

@media (min-width:992px) {
    .loadingpage-top {
        display: flex
    }

    .loadingpage-top .lbox,
    .loadingpage-top .rbox {
        width: 50%
    }

    .loadingpage-top .rbox {
        padding-left: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px)
    }

    .loadingpage-top .lbox,
    .loadingpage-top .rbox {
        padding-top: clamp(calc(100 / 2 * 1px), calc(100 / 1200 * 100vw), 100px);
        padding-bottom: clamp(calc(140 / 2 * 1px), calc(140 / 1200 * 100vw), 140px)
    }
}

@media (max-width:991px) {
    .loadingpage-top .lbox {
        padding-top: clamp(calc(100 / 2 * 1px), calc(100 / 1200 * 100vw), 100px);
        padding-bottom: clamp(calc(80 / 2 * 1px), calc(80 / 1200 * 100vw), 80px)
    }
}

.loadingpage-top .lbox {
    padding-left: clamp(calc(100 / 2 * 1px), calc(100 / 1200 * 100vw), 100px);
    padding-right: clamp(calc(100 / 2 * 1px), calc(100 / 1200 * 100vw), 100px);
    position: relative;
    overflow: hidden
}

.loadingpage-top .lbox .tag {
    color: #fff;
    background-image: url('../images/tag.png');
    background-position: center bottom;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    top: 0;
    width: clamp(calc(100 * 1px), calc(125 / 1200 * 100vw), 125px);
    height: clamp(calc(70 * 1px), calc(89 / 1200 * 100vw), 89px);
    z-index: 9;
    text-align: center;
    line-height: 1.5;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 2%
}

@media (min-width:1280px) {
    .loadingpage-top .lbox .tag {
        font-size: 16px
    }
}

@media (max-width:1200px) and (min-widht:1279px) {
    .loadingpage-top .lbox .tag {
        font-size: 15px
    }
}

@media (max-width:640px) {
    .loadingpage-top .lbox .tag {
        font-size: 12px
    }
}

@media (max-width:991px) {
    .loadingpage-top .rbox {
        text-align: center
    }
}

.loadingpage-top .rbox .title {
    font-size: clamp(calc(24 * 1px), calc(40 / 1200 * 100vw), 40px);
    font-family: bold;
    color: #1d24aa;
    line-height: 1.1;
    margin-bottom: 10px
}

.loadingpage-top .rbox .no {
    font-size: clamp(calc(18 * 1px), calc(24 / 1200 * 100vw), 24px);
    padding-bottom: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px)
}

.loadingpage-top .rbox .desc {
    padding-top: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px);
    padding-bottom: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px);
    border-top: 1px solid #eeeeee;
    line-height: 1.75
}

@media (min-width:1280px) {
    .loadingpage-top .rbox .desc {
        font-size: 16px
    }
}

@media (max-width:1200px) and (min-widht:1279px) {
    .loadingpage-top .rbox .desc {
        font-size: 15px
    }
}

.loadingpage-top .rbox .btns .rbtn {
    width: clamp(calc(150 * 1px), calc(170 / 1200 * 100vw), 170px);
    font-size: 16px;
    white-space: nowrawp;
    padding-left: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px);
    padding-right: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px);
    line-height: clamp(calc(42 * 1px), calc(48 / 1200 * 100vw), 48px)
}

.loadingpage-top .rbox .btns .rbtn+.rbtn {
    margin-left: 12px
}

.loadingpage-top .setnum-box {
    padding-top: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px);
    padding-bottom: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px);
    border-top: 1px solid #eeeeee;
    border-bottom: 1px solid #eeeeee;
    display: flex;
    align-items: center;
    margin-bottom: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px)
}

.loadingpage-top .setnum-box .t {
    font-family: bold;
    margin-right: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px)
}

.loadingpage-top .setnum-box .setnum {
    display: flex;
    align-items: stretch;
    border: 1px solid #eeeeee;
    border-radius: 3px;
    width: 100px;
    height: 40px
}

.loadingpage-top .setnum-box .setnum input {
    width: 30px;
    height: 40px;
    text-align: center;
    padding: 0;
    font-size: 16px;
    font-family: bold
}

.loadingpage-top .setnum-box .setnum i {
    flex: 1;
    cursor: pointer;
    text-align: center;
    line-height: 40px;
    font-weight: bold;
    color: #1d24aa
}

@media (min-width:992px) {
    .loadingpage-form {
        display: flex;
        align-items: stretch
    }

    .loadingpage-form .lbox,
    .loadingpage-form .rbox {
        width: 50%
    }

    .loadingpage-form .lbox .inner,
    .loadingpage-form .rbox .inner {
        width: 44vw;
        max-width: 770px
    }

    .loadingpage-form .rbox .inner {
        padding-left: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px)
    }

    .loadingpage-form .lbox {
        display: flex;
        align-items: center
    }

    .loadingpage-form .lbox .inner {
        margin: 0 0 0 auto
    }

    .loadingpage-form .lbox .desc {
        width: 80%;
        max-width: 590px
    }
}

.loadingpage-form .lbox,
.loadingpage-form .rbox {
    padding-top: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px);
    padding-bottom: clamp(calc(120 / 2 * 1px), calc(120 / 1200 * 100vw), 120px)
}

.loadingpage-form .lbox {
    background-color: #1d24aa;
    color: #fff
}

@media (max-width:991px) {
    .loadingpage-form .lbox {
        text-align: center
    }

    .loadingpage-form .lbox .desc {
        padding: 0 6vw
    }
}

.loadingpage-form .lbox .tit {
    font-size: clamp(calc(20 * 1px), calc(36 / 1200 * 100vw), 36px);
    font-family: bold;
    margin-bottom: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px)
}

.loadingpage-form .lbox .desc {
    line-height: 1.8
}

@media (min-width:1280px) {
    .loadingpage-form .lbox .desc {
        font-size: 16px
    }
}

@media (max-width:1200px) and (min-widht:1279px) {
    .loadingpage-form .lbox .desc {
        font-size: 15px
    }
}

.loadingpage-form .rbox {
    background-color: #fafafb
}

@media (max-width:991px) {
    .loadingpage-form .rbox {
        padding-left: 6vw;
        padding-right: 6vw
    }
}

.loadingpage-form .rbox .submit {
    width: 240px;
    margin: 0 auto
}

.quote-box {
    margin-top: clamp(calc(80 / 2 * 1px), calc(80 / 1200 * 100vw), 80px);
    margin-bottom: clamp(calc(160 / 2 * 1px), calc(160 / 1200 * 100vw), 160px);
    border-radius: 12px;
    overflow: hidden
}

.quote-box .form2 {
    background: #fff
}

.quote-box table {
    table-layout: fixed;
    width: 100%;
    margin-bottom: 60px
}

.quote-box table tr {
    border-bottom: 1px solid #eeeeee
}

@media (max-width:991px) {
    .quote-box table thead {
        display: none
    }

    .quote-box table tr {
        display: block
    }

    .quote-box table th,
    .quote-box table td {
        width: 100%;
        display: block
    }

    .quote-box table .num,
    .quote-box table .tool {
        padding-left: 100px
    }

    .quote-box table .tool {
        text-align: left !important
    }
}

.quote-box table tr:hover {
    background-color: #fefefe
}

.quote-box table thead {
    height: 48px
}

.quote-box table thead th {
    background-color: #1d24aa;
    color: #fff
}

@media (min-width:992px) {
    .quote-box table th {
        color: #fff !important
    }
}

.quote-box table td,
.quote-box table th {
    padding-top: clamp(calc(22 / 2 * 1px), calc(22 / 1200 * 100vw), 22px);
    padding-bottom: clamp(calc(22 / 2 * 1px), calc(22 / 1200 * 100vw), 22px)
}

@media (min-width:992px) {

    .quote-box table td,
    .quote-box table th {
        padding-left: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px);
        padding-right: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px)
    }
}

.quote-box table .tool {
    color: #1d24aa;
    cursor: pointer;
    text-align: center
}

.quote-box table .goodinfo {
    display: flex;
    align-items: center
}

.quote-box table .goodinfo .imgbox {
    width: 80px;
    height: 80px;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center
}

@media (min-width:992px) {
    .quote-box table .goodinfo .imgbox {
        margin-right: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px)
    }
}

@media (max-width:991px) {
    .quote-box table .goodinfo .imgbox {
        margin-right: 20px
    }
}

.quote-box table .goodinfo .info {
    flex: 1
}

@media (min-width:992px) {
    .quote-box table .goodinfo .info {
        max-width: 394px
    }
}

.quote-box table .goodinfo .tit {
    font-size: 16px;
    font-family: bold
}

.quote-box table .goodinfo .tit:hover {
    color: #1d24aa
}

.quote-box table .goodinfo .no {
    margin: 8px 0 10px
}

@media (min-width:1280px) {
    .quote-box table .goodinfo .no {
        font-size: 16px
    }
}

@media (max-width:1200px) and (min-widht:1279px) {
    .quote-box table .goodinfo .no {
        font-size: 15px
    }
}

.quote-box table .goodinfo .desc {
    color: #999;
    line-height: 1.6;
    max-height: 3.2em;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.quote-box table .num {
    text-align: center
}

.quote-box table .setnum {
    display: flex;
    align-items: center;
    border: 1px solid #eeeeee;
    width: clamp(calc(100 * 1px), calc(110 / 1200 * 100vw), 110px);
    line-height: 30px
}

@media (min-width:992px) {
    .quote-box table .setnum {
        justify-content: center;
        margin: 0 auto
    }
}

.quote-box table .setnum input {
    width: clamp(calc(40 * 1px), calc(50 / 1200 * 100vw), 50px);
    height: 30px;
    padding: 0;
    text-align: center;
    border-left: 1px solid #eeeeee;
    border-right: 1px solid #eeeeee
}

.quote-box table .setnum .iconfont {
    width: 30px;
    height: 30px;
    text-align: center;
    cursor: pointer;
    font-size: 14px
}

.quote-box table .setnum .iconfont:hover {
    background: #fafafb
}

.quote-box table .del {
    cursor: pointer
}

.quote-box table .del:hover {
    color: #1d24aa
}

.quote-box .form {
    padding-left: clamp(calc(50 / 2 * 1px), calc(50 / 1200 * 100vw), 50px);
    padding-right: clamp(calc(50 / 2 * 1px), calc(50 / 1200 * 100vw), 50px);
    padding-top: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px);
    padding-bottom: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px);
    background: #fafafb
}

@media (max-width:991px) {
    .quote-box .form {
        width: 100vw
    }
}

.quote-box .form .submitbox .submit {
    width: 240px;
    margin: 0 auto
}

.quote-box-suc {
    text-align: center;
    padding-top: clamp(calc(140 / 2 * 1px), calc(140 / 1200 * 100vw), 140px);
    padding-bottom: clamp(calc(246 / 2 * 1px), calc(246 / 1200 * 100vw), 246px)
}

.quote-box-suc .icon {
    width: clamp(calc(280 / 2 * 1px), calc(280 / 1200 * 100vw), 280px);
    height: clamp(calc(250 / 2 * 1px), calc(250 / 1200 * 100vw), 250px);
    background-image: url('../images/sendsuc.png');
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
    display: inline-block
}

.quote-box-suc .title {
    font-size: clamp(calc(20 * 1px), calc(30 / 1200 * 100vw), 30px);
    font-family: bold;
    margin-top: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px);
    margin-bottom: clamp(calc(10 / 2 * 1px), calc(10 / 1200 * 100vw), 10px)
}

.quote-box-suc .desc {
    font-size: clamp(calc(15 * 1px), calc(16 / 1200 * 100vw), 16px);
    margin-bottom: clamp(calc(50 / 2 * 1px), calc(50 / 1200 * 100vw), 50px)
}

.quote-box-suc .vmore {
    width: 240px;
    line-height: 48px;
    font-size: 16px
}

.sales-inquiry {
    text-align: center;
    margin-bottom: clamp(calc(50 / 2 * 1px), calc(50 / 1200 * 100vw), 50px)
}

.sales-inquiry .title {
    font-size: clamp(calc(22 * 1px), calc(36 / 1200 * 100vw), 36px);
    font-family: bold;
    padding-bottom: clamp(calc(24 / 2 * 1px), calc(24 / 1200 * 100vw), 24px);
    position: relative;
    margin-bottom: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px)
}

.sales-inquiry .title::after {
    content: '';
    display: block;
    width: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px);
    height: clamp(calc(4 / 2 * 1px), calc(4 / 1200 * 100vw), 4px);
    background-color: #1d24aa;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    bottom: 0
}

.sales-inquiry .desc {
    line-height: 1.7
}

@media (min-width:1280px) {
    .sales-inquiry .desc {
        font-size: 16px
    }
}

@media (max-width:1200px) and (min-widht:1279px) {
    .sales-inquiry .desc {
        font-size: 15px
    }
}

.partnerbox {
    padding-top: clamp(calc(100 / 2 * 1px), calc(100 / 1200 * 100vw), 100px);
    padding-bottom: clamp(calc(120 / 2 * 1px), calc(120 / 1200 * 100vw), 120px)
}

.partner-two li,
.partner-one li {
    text-align: center
}

.partner-two li .icon,
.partner-one li .icon {
    width: 50px;
    height: 50px;
    display: inline-block;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center
}

.partner-two li .tit,
.partner-one li .tit {
    font-size: 18px;
    font-family: bold;
    margin: 10px 0 16px
}

.partner-two li .desc,
.partner-one li .desc {
    line-height: 1.5;
    color: #666
}

.partner-one .list li {
    padding-top: clamp(calc(46 / 2 * 1px), calc(46 / 1200 * 100vw), 46px);
    padding-bottom: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px)
}

@media (min-width:768px) {
    .partner-one .list {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        position: relative
    }

    .partner-one .list::before {
        content: '';
        display: block;
        width: 1px;
        height: 100%;
        background-color: #eeeeee;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        z-index: 5;
        top: 0
    }

    .partner-one .list li {
        width: 50%
    }

    .partner-one .list li .inner {
        max-width: 430px;
        width: 80%
    }

    .partner-one .list li:nth-child(2n) .inner {
        margin: 0 0 0 auto
    }
}

@media (max-width:767px) {
    .partner-one .list li {
        border-bottom: 1px solid #eeeeee
    }
}

.partner-one .list li:nth-child(1),
.partner-one .list li:nth-child(2) {
    border-bottom: 1px solid #eeeeee
}

.partner-two {
    padding-bottom: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px)
}

.partner-two ul {
    padding-top: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px)
}

.partner-two li {
    margin-bottom: clamp(calc(100 / 2 * 1px), calc(100 / 1200 * 100vw), 100px)
}

@media (min-width:640px) {
    .partner-two li .inner {
        width: 80%;
        margin: 0 auto
    }
}

.partner-three {
    background-color: #1d24aa;
    color: #fff;
    text-align: center
}

.partner-three .tit1 {
    margin-bottom: clamp(calc(24 / 2 * 1px), calc(24 / 1200 * 100vw), 24px)
}

.partner-three .desc {
    font-size: clamp(calc(16 * 1px), calc(18 / 1200 * 100vw), 18px);
    line-height: 1.6
}

.partner-form .title {
    font-size: clamp(calc(20 * 1px), calc(30 / 1200 * 100vw), 30px);
    font-family: bold;
    line-height: 1.3;
    text-align: center;
    max-width: 850px;
    margin: 0 auto;
    margin-bottom: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px)
}

.partner-form .form ul {
    display: flex;
    flex-wrap: wrap
}

.partner-form .form ul .cell3 {
    width: 32.5%
}

@media (max-width:1199px) {
    .partner-form .form ul .cell3 {
        width: 49%
    }
}

@media (max-width:640px) {
    .partner-form .form ul .cell3 {
        width: 100%
    }
}

.partner-form .submit {
    width: 240px;
    margin: 0 auto
}

.partner-form .tip {
    color: #999;
    line-height: 1.75;
    margin-bottom: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px)
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: #999
}

input:-moz-placeholder,
textarea:-moz-placeholder {
    color: #999
}

input::-moz-placeholder,
textarea::-moz-placeholder {
    color: #999
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
    color: #999
}

.pointer {
    cursor: pointer
}

.second-nav {
    border-bottom: 1px solid #eeeeee
}

.second-nav .wrap {
    display: flex;
    align-items: center;
    font-family: bold;
    font-size: clamp(calc(15 * 1px), calc(16 / 1200 * 100vw), 16px)
}

.second-nav .wrap li {
    padding-left: clamp(calc(48 / 2 * 1px), calc(48 / 1200 * 100vw), 48px);
    padding-right: clamp(calc(48 / 2 * 1px), calc(48 / 1200 * 100vw), 48px);
    position: relative
}

@media (max-width:480px) {
    .second-nav .wrap li {
        padding-left: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px);
        padding-right: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px)
    }
}

.second-nav .wrap li:first-child {
    padding-left: 0 !important
}

.second-nav .wrap li:last-child {
    padding-right: 0 !important
}

.second-nav .wrap li+li::before {
    content: '';
    width: 1px;
    height: 14px;
    background-color: #eeeeee;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    left: 0
}

.second-nav .wrap a {
    line-height: clamp(calc(48 * 1px), calc(60 / 1200 * 100vw), 60px);
    display: inline-block;
    color: #999;
    position: relative
}

.second-nav .wrap a.on {
    color: #000
}

.second-nav .wrap a.on::after {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #1d24aa;
    bottom: -1px
}

.aboutbox .hd {
    margin-bottom: clamp(calc(46 / 2 * 1px), calc(46 / 1200 * 100vw), 46px)
}

.aboutbox .hd .tag {
    color: #1d24aa;
    margin-bottom: clamp(calc(12 / 2 * 1px), calc(12 / 1200 * 100vw), 12px)
}

.aboutbox .hd .tit1 {
    line-height: 1.3
}

.about-one {
    padding-top: clamp(calc(70 / 2 * 1px), calc(70 / 1200 * 100vw), 70px)
}

.about-one .hd {
    text-align: left
}

.about-one .hd .tit1 {
    text-align: left;
    font-size: clamp(calc(22 * 1px), calc(36 / 1200 * 100vw), 36px)
}

.about-one .info {
    overflow: hidden
}

@media (min-width:640px) {
    .about-one .info .imgbox {
        float: left;
        width: clamp(calc(550 / 2 * 1px), calc(550 / 1200 * 100vw), 550px)
    }
}

.about-one .info .imgbox {
    background-color: #1d24aa;
    border-radius: .12rem;
    margin: 0 .3rem .3rem 0;
    overflow: hidden
}

@media (max-width:639px) {
    .about-one .info .imgbox {
        width: 100%
    }
}

.about-one .info .cimgbox {
    padding-bottom: 61.81818182%
}

.about-one .info p {
    line-height: 1.96;
    margin-bottom: 1em
}

@media (min-width:1280px) {
    .about-one .info p {
        font-size: 16px
    }
}

@media (max-width:1200px) and (min-widht:1279px) {
    .about-one .info p {
        font-size: 15px
    }
}

.about-one .datas {
    padding-top: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px);
    padding-bottom: clamp(calc(130 / 2 * 1px), calc(130 / 1200 * 100vw), 130px);
    text-align: center;
    display: flex;
    align-items: start;
    justify-content: space-between
}

@media (max-width:768px) {
    .about-one .datas {
        flex-wrap: wrap
    }

    .about-one .datas li {
        width: 50%;
        margin-bottom: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px)
    }
}

.about-one .datas .value {
    color: #1d24aa;
    margin-bottom: clamp(calc(10 / 2 * 1px), calc(10 / 1200 * 100vw), 10px)
}

.about-one .datas .value .v {
    font-size: clamp(calc(72 / 2 * 1px), calc(72 / 1920 * 100vw), 72px);
    font-family: bold
}

.about-one .datas .value .unit {
    font-size: clamp(calc(18 * 1px), calc(30 / 1200 * 100vw), 30px)
}

@media (min-width:1280px) {
    .about-one .datas .tit {
        font-size: 16px
    }
}

@media (max-width:1200px) and (min-widht:1279px) {
    .about-one .datas .tit {
        font-size: 15px
    }
}

.about-one .bar {
    color: #fff;
    text-align: center;
    background-color: #1d24aa;
    padding-top: clamp(calc(72 / 2 * 1px), calc(72 / 1200 * 100vw), 72px);
    padding-bottom: clamp(calc(72 / 2 * 1px), calc(72 / 1200 * 100vw), 72px);
    line-height: 1.5;
    font-size: clamp(calc(20 * 1px), calc(36 / 1200 * 100vw), 36px)
}

.about-two {
    padding-top: clamp(calc(96 / 2 * 1px), calc(96 / 1200 * 100vw), 96px);
    overflow: hidden
}

.about-two .hd {
    text-align: center;
    margin-bottom: 0
}

.about-two .hd .tit1 {
    margin-bottom: 0
}

.about-two .item {
    position: relative
}

@media (min-width:768px) {
    .about-two .item {
        display: flex;
        align-items: center;
        justify-content: space-between
    }

    .about-two .item:nth-child(2n) .info {
        order: -1
    }

    .about-two .item:nth-child(2n)::before {
        content: '';
        position: absolute;
        width: 300vw;
        height: 100%;
        left: -50vw;
        top: 0;
        background-color: #f7f7f7;
        z-index: -1
    }

    .about-two .item .imgbox,
    .about-two .item .info {
        width: 46.7%;
        padding-top: clamp(calc(72 / 2 * 1px), calc(72 / 1200 * 100vw), 72px);
        padding-bottom: clamp(calc(72 / 2 * 1px), calc(72 / 1200 * 100vw), 72px)
    }
}

.about-two .item .cimgbox {
    border-radius: .16rem;
    padding-bottom: 61.81818182%
}

.about-two .item .info {
    color: #000
}

@media (max-width:767px) {
    .about-two .item .info {
        margin-top: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px);
        padding-top: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px);
        padding-bottom: clamp(calc(70 / 2 * 1px), calc(70 / 1200 * 100vw), 70px)
    }
}

.about-two .item .info .title {
    color: #1d24aa;
    font-family: bold;
    font-size: clamp(calc(20 * 1px), calc(30 / 1200 * 100vw), 30px);
    margin-bottom: clamp(calc(16 / 2 * 1px), calc(16 / 1200 * 100vw), 16px)
}

.about-two .item .info .article {
    color: #000;
    font-size: 14px
}

.about-three {
    padding-top: clamp(calc(90 / 2 * 1px), calc(90 / 1200 * 100vw), 90px);
    padding-bottom: clamp(calc(90 / 2 * 1px), calc(90 / 1200 * 100vw), 90px);
    background-color: #f7f7f7
}

.about-three .hd {
    text-align: center
}

@media (min-width:992px) {
    .about-three .hd {
        margin-bottom: 0
    }
}

.about-three .hd .tit1 {
    margin-bottom: 0
}

.about-three .swiper-pagination {
    padding-top: 0
}

.swiper-honor .swiper-slide {
    padding-top: 5%
}

.swiper-honor .inner {
    text-align: center;
    max-width: 356px;
    margin: 0 auto
}

.swiper-honor .inner .imgbox {
    padding: 0 10%
}

.history-list .list {
    padding-top: clamp(calc(80 / 2 * 1px), calc(80 / 1200 * 100vw), 80px);
    padding-bottom: clamp(calc(180 / 2 * 1px), calc(180 / 1200 * 100vw), 180px);
    position: relative
}

.history-list .list::before {
    content: '';
    display: block;
    position: absolute;
    width: 1px;
    height: 100%;
    background: #fafafb;
    top: 0
}

@media (min-width:640px) {
    .history-list .list::before {
        left: clamp(calc(256 / 2 * 1px), calc(256 / 1200 * 100vw), 256px)
    }
}

@media (max-width:639px) {
    .history-list .list::before {
        left: 2px
    }
}

.history-list .item {
    margin-bottom: clamp(calc(50 / 2 * 1px), calc(50 / 1200 * 100vw), 50px);
    cursor: default
}

@media (min-width:640px) {
    .history-list .item {
        display: flex;
        align-items: flex-start
    }
}

@media (max-width:639px) {
    .history-list .item {
        text-align: left
    }
}

.history-list .item:hover .year,
.history-list .item:first-child .year {
    color: #1d24aa
}

.history-list .item:hover .info,
.history-list .item:first-child .info {
    opacity: 1
}

.history-list .item:hover .year::after,
.history-list .item:first-child .year::after {
    content: '';
    width: 7px;
    height: 100%;
    background-color: #1d24aa;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    right: -4px
}

@media (max-width:639px) {

    .history-list .item:hover .year::after,
    .history-list .item:first-child .year::after {
        width: 3px;
        left: 1px
    }
}

.history-list .item .year {
    font-size: clamp(calc(24 * 1px), calc(40 / 1200 * 100vw), 40px);
    font-family: bold;
    position: relative;
    color: #d4d5d8
}

@media (min-width:640px) {
    .history-list .item .year {
        margin-right: clamp(calc(60 / 2 * 1px), calc(60 / 1200 * 100vw), 60px);
        text-align: center;
        width: clamp(calc(256 / 2 * 1px), calc(256 / 1200 * 100vw), 256px)
    }
}

@media (max-width:639px) {
    .history-list .item .year {
        margin-bottom: clamp(calc(20 / 2 * 1px), calc(20 / 1200 * 100vw), 20px);
        padding-left: 22px
    }
}

.history-list .item .info {
    opacity: .5
}

@media (min-width:640px) {
    .history-list .item .info {
        flex: 1
    }
}

@media (max-width:639px) {
    .history-list .item .info {
        padding-left: 30px
    }
}

.history-list .item .info p {
    position: relative;
    line-height: 1.6;
    padding-left: 22px;
    margin-bottom: .5em
}

.history-list .item .info p::before {
    content: '';
    display: block;
    position: absolute;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #1d24aa;
    left: 0;
    top: .8em;
    transform: translateY(-3px)
}

.contact-box {
    overflow: hidden
}

@media (min-width:992px) {
    .contact-box {
        background: linear-gradient(90deg, #fafafb 50%, #fff 50%)
    }

    .contact-box .wrap {
        display: flex;
        align-items: center
    }

    .contact-box .wrap .lbox,
    .contact-box .wrap .rbox {
        width: 50%
    }

    .contact-box .lbox {
        padding-right: clamp(calc(78 / 2 * 1px), calc(78 / 1200 * 100vw), 78px)
    }

    .contact-box .rbox {
        padding-left: clamp(calc(78 / 2 * 1px), calc(78 / 1200 * 100vw), 78px)
    }
}

@media (max-width:991px) {
    .contact-box .wrap {
        width: 100vw
    }

    .contact-box .lbox {
        background: #fafafb
    }

    .contact-box .lbox,
    .contact-box .rbox {
        padding-left: 6vw;
        padding-right: 6vw
    }
}

.contact-box .title {
    font-size: clamp(calc(22 * 1px), calc(36 / 1200 * 100vw), 36px);
    font-family: bold;
    margin-bottom: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px)
}

.contact-box .lbox {
    padding-top: clamp(calc(88 / 2 * 1px), calc(88 / 1200 * 100vw), 88px);
    padding-bottom: clamp(calc(152 / 2 * 1px), calc(152 / 1200 * 100vw), 152px)
}

.contact-box .lbox .submit {
    width: 140px
}

.contact-box .rbox {
    padding-top: clamp(calc(80 / 2 * 1px), calc(80 / 1200 * 100vw), 80px);
    padding-bottom: clamp(calc(80 / 2 * 1px), calc(80 / 1200 * 100vw), 80px)
}

.contact-box .rbox .inner {
    padding-bottom: clamp(calc(90 / 2 * 1px), calc(90 / 1200 * 100vw), 90px)
}

.contact-box .rbox .hd {
    margin-bottom: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px)
}

.contact-box .rbox .hd .title {
    color: #1d24aa
}

.contact-box .rbox .hd .desc {
    font-size: 16px;
    padding-bottom: clamp(calc(26 / 2 * 1px), calc(26 / 1200 * 100vw), 26px);
    position: relative
}

.contact-box .rbox .hd .desc::after {
    content: '';
    display: block;
    position: absolute;
    width: clamp(calc(40 / 2 * 1px), calc(40 / 1200 * 100vw), 40px);
    height: clamp(calc(4 / 2 * 1px), calc(4 / 1200 * 100vw), 4px);
    background-color: #1d24aa;
    left: 0;
    bottom: 0
}

.contact-box .rbox .info {
    line-height: 24px;
    max-width: 260px
}

.contact-box .rbox .info p {
    margin-bottom: 14px
}

.contact-box .rbox .share {
    display: flex;
    margin-top: clamp(calc(30 / 2 * 1px), calc(30 / 1200 * 100vw), 30px)
}

.contact-box .rbox .share .sitem {
    margin-right: 14px
}

.contact-box .rbox .share .icon {
    width: 40px;
    height: 40px;
    background-color: #1d24aa;
    border-radius: 50%;
    display: block
}

.contact-box .rbox .share .icon .ic {
    width: 100%;
    height: 100%;
    display: block
}

.contact-box .rbox .share .icon .ic-in {
    background: url('../images/ic_in.png') no-repeat center center
}

.contact-box .rbox .share .icon .ic-in2 {
    background: url('../images/ic_in2.png') no-repeat center center
}

.contact-box .rbox .share .icon:hover {
    background: #999
}

.news-rec-expo {
    padding-top: clamp(calc(80 / 2 * 1px), calc(80 / 1200 * 100vw), 80px);
    padding-bottom: clamp(calc(80 / 2 * 1px), calc(80 / 1200 * 100vw), 80px)
}

.news-rec-expo .hd {
    font-size: clamp(calc(20 * 1px), calc(30 / 1200 * 100vw), 30px);
    font-family: bold;
    margin-bottom: clamp(calc(34 / 2 * 1px), calc(34 / 1200 * 100vw), 34px)
}

.news-rec-expo .inner {
    background: #fafafb;
    border-radius: 8px;
    padding: 24px;
    display: block
}

.news-rec-expo .inner:hover {
    background-color: #1d24aa;
    color: #fff
}

.news-rec-expo .inner:hover .date {
    background-image: url('../images/ic_expo_date2.png')
}

.news-rec-expo .inner:hover .site {
    background-image: url('../images/ic_expo_site2.png')
}

.news-rec-expo .inner .tit {
    font-size: 18px;
    font-family: bold;
    line-height: 1.5;
    margin-bottom: clamp(calc(20 * 1px), calc(30 / 1200 * 100vw), 30px)
}

.news-rec-expo .inner .date,
.news-rec-expo .inner .site {
    line-height: 20px;
    margin-bottom: 16px;
    padding-left: 30px;
    background-repeat: no-repeat;
    background-position: 0 center
}

.news-rec-expo .inner .date {
    background-image: url('../images/ic_expo_date.png')
}

.news-rec-expo .inner .site {
    background-image: url('../images/ic_expo_site.png')
}

.product-tip-box {
    border: 1px solid #eeeeee;
    padding: clamp(calc(14 * 1px), calc(24 / 1200 * 100vw), 24px);
    background: #fafafb;
    border-radius: 8px
}

@media (min-width:768px) {
    .product-tip-box {
        font-size: 15px;
        display: flex;
        justify-content: space-between;
        align-items: center
    }

    .product-tip-box .txt {
        flex: 1;
        margin-right: 5%;
        max-width: 550px
    }
}

.product-tip-box .txt {
    line-height: 1.6
}

.product-tip-box .rbtn {
    white-space: nowrawp
}

@media (max-width:767px) {
    .product-tip-box .rbtn {
        width: fit-content;
        margin: 10px auto 0;
        display: block
    }
}