blockquote,body,button,dd,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,hr,input,legend,li,ol,p,pre,td,textarea,th,ul {
    padding: 0
}

* {
    margin: 0;
    padding: 0;
    list-style: none
}

ol,ul {
    list-style: none
}

a {
    text-decoration: none
}

a:hover {
    text-decoration: none;
    color: var(--color)
}

legend {
    color: #000
}

fieldset,img {
    border: 0
}

img.imgauto {
    width: 100%;
    height: auto
}

button,input,select,textarea {
    font-size: 100%
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

.clearfix:after,.ks-clearfix:after {
    content: '\20';
    display: block;
    height: 0;
    clear: both
}

img {
    vertical-align: middle
}

@font-face {
    font-family: RobotoRegular;
    src: url(../fonts/Roboto-Regular-14.woff);
    font-display: swap
}

@font-face {
    font-family: RobotoBold;
    src: url(../fonts/Roboto-Bold-3.woff);
    font-display: swap
}

@font-face {
    font-family: RobotoItali;
    src: url(../fonts/Roboto-Italic-9.woff);
    font-display: swap
}

@font-face {
    font-family: RobotoMedium;
    src: url(../fonts/Roboto-Medium.woff2);
    font-display: swap
}

html {
    font-size: calc(100vw/19.2)
}

html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

body,button,input,select,textarea {
    font-family: RobotoRegular
}

body {
    min-height: 100%;
    font-family: RobotoRegular;
    font-size: .14rem;
    line-height: 1.5;
    color: #222
}

:root {
    --color: #0B7F2C;
    --color1: #cde2ff
}

#videomodal .modal-dialog {
    width: 60%
}

#imgModal .modal-dialog {
    width: max-content;
    text-align: center
}

#imgModal .modal-content {
    width: 100%;
    margin: auto
}

.modal-dialog {
    margin: .35rem auto
}

.embed-responsive-16by9::before {
    padding-top: 0
}

#videomodal .embed-responsive {
    height: 5.5rem
}

.text-primary {
    color: #4a7ff5
}

hr {
    margin: .35rem 0
}

img {
    border: 0;
    vertical-align: middle;
    max-width: 100%
}

ul {
    margin: 0
}

li {
    list-style: none
}

h1,h2,h3,h4,h5,h6 {
    font-weight: 700;
    margin: revert
}

a {
    color: #222;
    text-decoration: none;
    transition: all .3s ease-in
}

a:focus,a:hover {
    text-decoration: none
}

button,input {
    border-radius: 0
}

button {
    cursor: pointer
}

input[type=button],input[type=reset],input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer
}

textarea {
    resize: none;
    overflow: auto
}

button,input,select,textarea {
    border: 0;
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    background: 0 0;
    outline: 0
}

select {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    white-space: nowrap;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

select::-ms-expand {
    display: none
}

table {
    border-collapse: collapse
}

.table {
    margin-bottom: 0
}

.table table {
    width: 100%
}

.table td,.table th {
    border: .01rem solid #f2f4fb
}

.scale {
    transition: .6s all
}

.scale:hover {
    transform: scale(1.06)
}

.fl {
    float: left
}

.fr {
    float: right
}

.clear {
    zoom:1}

.clear:after {
    content: '';
    display: block;
    clear: both
}

.flex-center {
    display: flex;
    align-items: center
}

.flex {
    display: flex
}

.flex_bd {
    flex: 1;
    min-width: 0
}

p {
    margin: 0
}

.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.fixed {
    align-self: flex-start;
    position: sticky;
    top: 1rem
}

.line-1 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical
}

.line-2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.line-3 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    min-height: 78px
}

.line-4 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical
}

.line-5 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical
}

.line-6 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical
}

.line-7 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical
}

.line-8 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical
}

.line-9 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 9;
    -webkit-box-orient: vertical
}

.auto-container {
    max-width: 14rem;
    margin: auto
}

.top-search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #000;
    z-index: 100;
    opacity: .8;
    display: none
}

.modal-header {
    padding: .2rem
}

.modal-title {
    font-size: .2rem
}

.modal-header .close {
    padding: 0;
    margin: 0;
    line-height: .26rem;
    font-size: .3rem
}

.modal-header .close span {
    font-size: .3rem;
    line-height: .26rem
}

.modal-body {
    padding: .2rem
}

.modal-content {
    border-radius: .1rem
}

figure {
    margin: 0
}

.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction {
    bottom: .3rem
}

.swiper-pagination-bullet {
    margin: 0 .05rem
}

.swiper-button-prev {
    left: -.9rem;
    transform: rotate(180deg)
}

.swiper-button-next {
    right: -.9rem
}

.swiper-button-next,.swiper-button-prev {
    margin-top: 0;
    position: absolute!important;
    width: .16rem;
    height: .24rem
}

.swiper-button-next:before,.swiper-button-prev:before {
    content: '';
    display: block;
    border-right: .03rem solid #222;
    border-bottom: .03rem solid #222;
    transform: rotate(-45deg);
    background: 0 0;
    width: .12rem;
    height: .12rem;
    position: absolute;
    top: 40%;
    left: 36%;
    margin: auto;
    transition: all .3s linear
}

.btn_icon:after,.btn_icon:before {
    content: "";
    position: absolute;
    right: 50%;
    bottom: 50%;
    width: .12rem;
    height: .12rem;
    background-image: url(/res/magic/images/icon_small_arrow.png);
    background-size: contain;
    background-repeat: no-repeat
}

.btn_icon:before {
    transform: translate(50%,50%) translateZ(0)
}

.btn_icon:after {
    opacity: 0;
    transform: translate(50%,50%) translate3d(-.2rem,0,0)
}

@keyframes hover-effect-text {
    0% {
        opacity: 1;
        transform: translateY(0)
    }

    30% {
        opacity: 0;
        transform: translateY(0)
    }

    40% {
        opacity: 0;
        transform: translateY(.05rem)
    }

    100% {
        opacity: 1;
        transform: translateY(0)
    }
}

.btn_effect4 {
    color: #fff;
    text-align: center;
    transition: .5s cubic-bezier(.85,0,.15,1);
    max-width: 1.5rem;
    height: .4rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    position: relative;
    font-size: .16rem;
    font-family: RobotoBold;
    line-height: .26rem
}

.btn_effect4 .btn_effect4_text {
    margin-left: .15rem
}

.btn_effect4 .btn_effect4_icon {
    position: absolute;
    top: 50%;
    right: .15rem;
    width: .13rem;
    height: .13rem;
    border-radius: 50%;
    margin: -.07rem 0 0;
    transition: all .3s cubic-bezier(.4,0,1,1);
    overflow: hidden
}

.btn_effect4 .btn_effect4_icon .btn_effect4_icon_arrow {
    width: .13rem;
    height: .13rem;
    transition: .5s cubic-bezier(.85,0,.15,1);
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -.065rem;
    background: url(/res/magic/images/index_67.png);
    background-size: .13rem
}

.btn_effect4 .btn_effect4_icon_arrow:first-child {
    opacity: 1;
    transform: translateX(0)
}

.btn_effect4 .btn_effect4_icon_arrow:last-child {
    opacity: 0;
    transform: translateX(-.2rem)
}

.btn_effect4:hover {
    color: #fff
}

.btn_effect4:hover .btn_effect4_text {
    animation: hover-effect-text .5s cubic-bezier(.85,0,.15,1)
}

.btn_effect4:hover .btn_effect4_text {
    opacity: 1;
    transform: translateX(0)
}

.btn_effect4:hover .btn_effect4_icon_arrow:first-child {
    opacity: 0;
    transform: translateX(.2rem)
}

.btn_effect4:hover .btn_effect4_icon_arrow:last-child {
    opacity: 1;
    transform: translateX(0);
    background: url(/res/magic/images/index_68.png)
}

.btn_effect5 {
    transition: .5s cubic-bezier(.85,0,.15,1);
    display: inline-block
}

.btn_effect5 .btn_effect5_text {
    display: block;
    position: relative;
    line-height: inherit;
    width: 1rem;
    line-height: .4rem;
    text-align: center;
    transition: .5s cubic-bezier(.85,0,.15,1);
    display: inline-block;
    background-color: #eaeaea;
    padding: 0;
    font-weight: 400;
    color: #222;
    font-size: .16rem;
    border-radius: .05rem
}

.btn_effect5:hover {
    background-color: var(--color);
    border-color: #fff;
    color: #fff
}

.btn_effect5:hover .btn_effect5_text {
    animation: hover-effect-text .6s cubic-bezier(.85,0,.15,1);
    color: #fff
}

@-webkit-keyframes ctaBtnAnimation {
    0% {
        left: 100%
    }

    100% {
        left: -110%
    }
}

@keyframes ctaBtnAnimation {
    0% {
        left: 100%
    }

    100% {
        left: -110%
    }
}

@keyframes ctaBtnAnimation1 {
    0% {
        left: 100%
    }

    100% {
        left: -750%
    }
}

.additional-features {
    position: fixed;
    right: .2rem;
    top: 30%;
    z-index: 200;
    box-sizing: border-box;
    border-bottom: 0
}

.additional-features li {
    padding: .03rem 0
}

.additional-features .opa-0 {
    display: none
}

.additional-features .additional-icon {
    height: .5rem;
    position: relative;
    cursor: pointer
}

.additional-features .additional-icon a {
    display: inline-block
}

.additional-features .additional-icon img {
    max-width: .5rem;
    width: .5rem
}

#videomodal {
    top: 10%
}

#foot-ph {
    z-index: 999;
    position: fixed;
    bottom: 0;
    display: none;
    width: 100%
}

.new-foot-item {
    float: left;
    width: 50%;
    padding-top: .08rem;
    height: .513rem;
    text-align: center
}

.new-foot-item a {
    color: #fff;
    font-size: .18rem
}

@media (max-width: 640px) {
    #foot-ph {
        display:block
    }

    #videomodal .modal-dialog {
        width: 100%
    }

    #imgModal .modal-dialog {
        width: 100%
    }
}

@media (max-width: 768px) {
    .left-email {
        display:none
    }
}

.scale {
    transition: .6s all
}

.scale:hover {
    transform: scale(1.06)
}

.embed-responsive-16by9 {
    padding: 0;
    height: 100%
}

.btn_effect4_box {
    flex-flow: wrap
}

.btn_effect4 {
    position: relative;
    max-width: 100%;
    display: inline-block
}

.btn_small_wrap {
    color: #fff;
    position: relative;
    overflow: hidden
}

.btn_small_list {
    z-index: 2;
    border: .01rem solid #fff;
    border-radius: .1rem;
    background-color: #fff;
    color: var(--color);
    flex-direction: row;
    justify-content: center;
    align-items: center;
    display: flex;
    position: relative;
    padding: .11rem .24rem;
    text-transform: uppercase
}

.btn_small_list.hover {
    border: .01rem solid #fff;
    background-color: #fff;
    display: none;
    position: absolute;
    inset: 0
}

.btn_main_text {
    font-size: .16rem
}

.btn_small_icon {
    margin-left: .15rem
}

.btn_small_icon img {
    vertical-align: middle;
    margin-top: -.03rem;
    max-width: .08rem
}

.loading-box {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.5);
    z-index: 99;
    text-align: center;
    top: 0;
    padding-top: 10%;
    display: none
}

.loading-box img {
    width: 1.2rem
}

.head .left .gtranslate_wrapper .gt_switcher_wrapper {
    margin-right: .2rem
}

.head .left .gtranslate_wrapper .gt_switcher_wrapper {
    position: unset!important
}

.head .left .gt_container--hich1m .gt_switcher .gt_option {
    position: absolute;
    margin-top: 0
}

.head .left .gt_container--hich1m .gt_switcher .gt_option a {
    line-height: .24rem;
    height: .24rem;
    overflow: hidden
}

.head {
    background: #333;
    display: flex;
    justify-content: space-between;
    padding: .07rem 1rem
}

.head .left {
    display: flex;
    align-items: center
}

.head .left .gtranslate_wrapper .gt_switcher_wrapper {
    position: unset!important
}

.head .left .right_contact a {
    font-size: .16rem;
    color: #fff;
    margin-right: .2rem
}

.head .left .right_contact a img {
    max-width: .26rem;
    margin-right: .1rem
}

.head .right {
    display: flex;
    align-items: center;
    gap: .3rem
}

.head .right .search_input {
    height: .36rem;
    background: #fff;
    display: flex;
    align-items: center;
    border-radius: .05rem;
    padding: 0 .1rem
}

.head .right .search_input .search_btn {
    margin-left: .1rem
}

.head .right .search_input .search_btn img {
    max-width: .2rem
}

.head .right .btn_inquiry .quota_num {
    font-size: .16rem;
    font-family: RobotoBold;
    color: #fff;
    text-transform: uppercase
}

.head .right .head_share a {
    margin-right: .1rem
}

.head .right .head_share a img {
    max-width: .21rem
}

.head_box {
    padding: 0 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: all .5s linear
}

.head_box.c-style {
    position: fixed;
    width: 100%;
    background: #fff;
    z-index: 99;
    transform: translateY(-.5rem)
}

.head_box .logo_box {
    display: flex
}

.head_box .logo_box .logo_icon img {
    max-width: 1.2rem
}

.head_box .logo_box .slogan {
    font-size: .2rem;
    font-family: RobotoBold;
    line-height: .24rem;
    margin-left: .25rem
}

.head_box .nav_box .nav {
    display: flex
}

.head_box .nav_box .nav>.hasdrop {
    margin-right: .5rem
}

.head_box .nav_box .nav .hasdrop.pro {
    position: unset
}

.head_box .nav_box .nav .hasdrop .stair .a {
    font-size: .16rem;
    font-family: RobotoBold;
    text-transform: uppercase;
    line-height: 1rem;
    display: inline-block;
    position: relative
}

.head_box .nav_box .nav .hasdrop .stair .a i {
    position: absolute;
    bottom: .2rem;
    width: .12rem;
    height: .19rem;
    background: url(/res/magic/images/index_01_34.webp) no-repeat center;
    left: 0;
    right: 0;
    margin: auto;
    opacity: 0;
    transition: all .3s linear;
    background-size: contain
}

.head_box .nav_box .nav .hasdrop .sub.top_pro {
    width: 100%;
    left: 0;
    top: 1.5rem;
    padding: .4rem 2.6rem;
    border-top: .01rem solid var(--color);
    background-color: rgb(243 248 241 / 96%)
}

.head_box.c-style .nav_box .nav .hasdrop .sub.top_pro {
    top: 1rem
}

.head_box .nav_box .nav .hasdrop .sub.top_pro .top_pro_box {
    display: flex
}

.head_box .nav_box .nav .hasdrop .sub.top_pro .top_pro_box .item {
    width: 23.333%
}

.head_box .nav_box .nav .hasdrop .sub.top_pro .top_pro_box .item .img_box {
    border-bottom: .01rem solid rgb(11 127 44 / 30%);
    padding-bottom: .2rem
}

.head_box .nav_box .nav .hasdrop .sub.top_pro .top_pro_box .item .img_box img {
    max-height: .4rem;
    margin-bottom: .1rem
}

.head_box .nav_box .nav .hasdrop .sub.top_pro .top_pro_box .item .img_box p {
    font-size: .18rem;
    font-family: RobotoMedium;
    line-height: .26rem
}

.head_box .nav_box .nav .hasdrop .sub.top_pro .top_pro_box .item .text_box {
    margin-top: .2rem
}

.head_box .nav_box .nav .hasdrop .sub.top_pro .top_pro_box .item .text_box a {
    display: block;
    font-size: .18rem;
    line-height: .4rem;
    color: #666
}

.head_box .nav_box .nav .hasdrop .sub.top_pro .top_pro_box .item .text_box a:hover {
    color: var(--color)
}

.head_box .nav_box .nav .hasdrop .sub {
    position: absolute;
    top: 1rem;
    z-index: 2;
    background: #fff;
    display: none
}

.head_box .nav_box .nav .hasdrop .sub .s-menu {
    width: max-content
}

.head_box .nav_box .nav .hasdrop .sub .s-menu .hasdrop {
    width: 100%;
    position: relative
}

.head_box .nav_box .nav .hasdrop .sub .s-menu .hasdrop a {
    display: block;
    font-size: .16rem;
    line-height: .4rem;
    color: #666;
    padding: 0 .2rem;
    width: 100%
}

.head_box .nav_box .nav .hasdrop .sub .s-menu .hasdrop .drop-menu {
    position: absolute;
    left: 100%;
    background: #fff;
    top: 0;
    width: max-content;
    display: none
}

.head_box .right_box {
    display: none
}

.head_box .right_box .icosearch {
    display: none
}

.head_box .nav_box .nav .hasdrop.active .stair .a,.head_box .nav_box .nav .hasdrop:hover .stair .a {
    color: var(--color)
}

.head_box .nav_box .nav .hasdrop.active .stair .a i,.head_box .nav_box .nav .hasdrop:hover .stair .a i {
    opacity: 1
}

.head_box .nav_box .nav .hasdrop .sub .s-menu .hasdrop a:hover {
    background: var(--color);
    color: #fff
}

.footer {
    margin-top: 2.8rem;
    position: relative
}

.footer .footer_from {
    display: flex;
    position: absolute;
    left: 0;
    right: 0;
    top: -1.9rem;
    border-radius: .1rem;
    overflow: hidden
}

.footer .footer_from .left {
    width: 42.5%;
    position: relative;
    display: flex;
    align-items: center
}

.footer .footer_from .left .txt_box {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    padding: .75rem;
    color: #fff
}

.footer .footer_from .left .txt_box p:first-child {
    font-size: .4rem;
    font-family: RobotoBold;
    text-transform: uppercase;
    line-height: .46rem;
    margin-bottom: .1rem;
    white-space: pre-line
}

.footer .footer_from .left .txt_box p:last-child {
    font-size: .18rem;
    line-height: .26rem;
    white-space: pre-line
}

.footer .footer_from .right {
    background: var(--color);
    width: 57.5%;
    padding: 0 1rem;
    display: flex;
    align-items: center
}

.footer .footer_from .right form {
    width: 100%
}

.footer .footer_from .right form .input div input::placeholder,.footer .footer_from .right form textarea::placeholder {
    color: #fff
}

.footer .footer_from .right form .input {
    display: flex;
    justify-content: space-between;
    margin-bottom: .2rem;
    flex-wrap: wrap;
    gap: .15rem;
}

.footer .footer_from .right form .input div {
    /* width: 31.5%; */
    border-bottom: .01rem solid #fff;
    color: #fff;
    flex: 0 0 calc((100% - 1 * .15rem) / 2);
}
.footer .footer_from .right form .input div:nth-last-child(2){
    flex: 0 0 20%;
}
.footer .footer_from .right form .input div:last-child{
    flex: 0 0 70%;
}
.footer .footer_from .right form .input div input {
    padding-bottom: .1rem
}

.footer .footer_from .right form .upload-box {
    border-bottom: .01rem solid #fff
}

.footer .footer_from .right form .upload-box {
    margin-bottom: .15rem
}

.footer .footer_from .right form .upload-box #fileName {
    width: 100%!important;
    margin-top: .1rem;
    color: #fff;
    font-size: .16rem;
    overflow: hidden;
    margin-bottom: .1rem
}

.footer .footer_from .right form .upload-box .upload-wrap {
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
    height: .4rem;
    width: 100%
}

.footer .footer_from .right form .upload-box .upload-wrap .file-open {
    height: 100%;
    width: 1.5rem;
    line-height: .36rem;
    padding: 0 .1rem;
    border-radius: .05rem;
    background: rgb(255 255 255 / 30%)
}

.footer .footer_from .right form .upload-box .upload-wrap p {
    font-size: .18rem;
    display: inline-block;
    margin-left: .15rem;
    color: #fff;
    opacity: .5
}

.footer .footer_from .right form .upload-box .upload-wrap .file-open img {
    vertical-align: middle;
    margin-right: .2rem
}

.footer .footer_from .right form .upload-box .upload-wrap .file-ele {
    position: absolute;
    top: 0;
    right: 0;
    opacity: 0;
    height: 100%;
    width: 100%;
    cursor: pointer
}

input[type=file]::-webkit-file-upload-button {
    cursor: pointer
}

.footer .footer_from .right form .textarea_box {
    margin-bottom: .15rem;
    border-bottom: .01rem solid #fff
}

.footer .footer_from .right form .textarea_box textarea.content {
    width: 100%;
    height: .5rem;
    color: #fff
}

.footer .footer_from .right form .submit button .btn_small_wrap .btn_small_list {
    padding: .06rem .24rem;
    border-radius: .05rem;
    color: #333
}

.footer .footer_from .right form .submit button .btn_small_wrap .btn_small_list.hover {
    background-color: var(--color);
    color: #fff
}

.footer .footer_from .right form .submit button .btn_small_wrap .btn_small_list .btn_main_text {
    font-size: .18rem
}

.footer .footer_box {
    background: rgb(233 249 236);
    padding-top: 2.7rem
}

.footer .footer_box .foot_head {
    display: flex;
    border-bottom: .01rem solid #c0cdc2;
    justify-content: space-between;
    padding-bottom: .7rem
}

.footer .footer_box .foot_head .left {
    width: 22%
}

.footer .footer_box .foot_head .left .foot_contact .item {
    display: flex;
    align-items: flex-start;
    margin-bottom: .15rem
}

.footer .footer_box .foot_head .left .foot_contact .item .img_box {
    margin-right: .1rem
}

.footer .footer_box .foot_head .left .foot_contact .item .img_box img {
    max-width: .32rem
}

.footer .footer_box .foot_head .left .foot_contact .item .txt_box {
    max-width: 80%
}

.footer .footer_box .foot_head .left .foot_contact .item .txt_box p,.footer .footer_box .foot_head .left .foot_contact .item .txt_box p a {
    font-size: .18rem;
    line-height: .32rem;
    color: #333
}

.footer .footer_box .foot_head .left .foot_contact .item .txt_box p {
    line-height: .24rem
}

.footer .footer_box .foot_head .right {
    display: flex;
    width: 88%
}

.footer .footer_box .foot_head .right .left_category {
    display: flex;
    width: 68%;
    justify-content: space-evenly
}

.footer .footer_box .foot_head .right .left_category .item p,.footer .footer_box .foot_head .right .right_box>p {
    font-size: .18rem;
    font-family: RobotoBold;
    color: var(--color);
    text-transform: uppercase;
    margin-bottom: .15rem
}

.footer .footer_box .foot_head .right .left_category .item .item_box a {
    display: block;
    font-size: .18rem;
    line-height: .36rem;
    color: #333
}

.footer .footer_box .foot_head .left .foot_contact .item .txt_box p a:hover,.footer .footer_box .foot_head .right .left_category .item .item_box a:hover {
    color: var(--color)
}

.footer .footer_box .foot_head .right .right_box {
    width: 32%
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe {
    margin-top: .25rem;
    margin-bottom: .2rem
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .input_box {
    display: flex;
    justify-content: space-between;
    margin-bottom: .15rem
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .input_box .input {
    width: 85%;
    background: rgb(255 255 255 / 20%);
    line-height: .48rem
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .input_box .input input {
    font-size: .16rem;
    width: 100%;
    background: #fff;
    border: .01rem solid #c4dbc8;
    border-top-left-radius: .05rem;
    border-bottom-left-radius: .05rem;
    padding: 0 .15rem
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .input_box .input input::placeholder {
    color: #333
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .input_box .btn_effect4 {
    width: 1.2rem;
    cursor: pointer;
    height: .48rem
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .input_box .btn_effect4 .btn_small_list {
    border-radius: unset;
    border-color: var(--color);
    background: var(--color);
    border-top-right-radius: .05rem;
    border-bottom-right-radius: .05rem
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .input_box .btn_effect4 .btn_small_list.hover {
    border-color: var(--color);
    background: #fff
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .input_box .btn_effect4 .btn_small_list .btn_main_text {
    color: #fff
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .input_box .btn_effect4 .btn_small_list.hover .btn_main_text {
    color: var(--color)
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .input_box .btn_effect4 .btn_main_text {
    font-size: .16rem;
    font-family: RobotoBold
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .checkbox {
    font-size: .14rem;
    margin-bottom: .3rem;
    position: relative;
    margin-bottom: 0;
    margin-top: 0
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .checkbox .box {
    position: absolute;
    top: .01rem;
    left: 0;
    height: .2rem;
    width: .2rem;
    border: .01rem solid #ddd;
    border-radius: .03rem;
    transition: all .3s linear
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .checkbox #agree:checked+label .box::before {
    content: '✔';
    position: absolute;
    left: .02rem;
    top: -.03rem;
    width: .16rem;
    height: .16rem;
    color: var(--color)
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .checkbox input {
    margin-left: 0;
    display: none
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .checkbox label {
    padding-left: .3rem;
    font-size: .16rem;
    margin-bottom: 0;
    color: #333
}

.footer .footer_box .foot_head .right .right_box .foot_subscribe .checkbox label a {
    display: inline-block;
    text-decoration: underline;
    color: var(--color)
}

.footer .foot_head .right .right_box .foot_share a {
    display: inline-block;
    margin-right: .2rem
}

.footer .foot_head .right .right_box .foot_share a img {
    max-width: .23rem
}

.footer .foot_head .right .right_box .foot_share a:last-child {
    margin-right: 0
}

.footer .footer_box .foot_bottom {
    padding: .36rem 0
}

.footer .footer_box .foot_bottom .auto-container {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.footer .footer_box .foot_bottom .auto-container .left p,.footer .footer_box .foot_bottom .auto-container .right a {
    font-size: .18rem;
    color: #333
}

.footer .footer_box .foot_bottom .auto-container .left p img {
    max-height: .21rem;
    margin-right: .1rem
}

.footer .footer_box .foot_bottom .auto-container .right a {
    margin-right: .15rem
}

.footer .footer_box .foot_bottom .auto-container .right a:last-child {
    margin-right: 0
}

.sidebar_inner_bottom {
    position: fixed;
    bottom: .2rem;
    right: 0;
    background: #fff;
    width: 3rem;
    border-radius: .05rem;
    overflow: hidden;
    z-index: 10
}

.sidebar_inner_bottom .top {
    background: var(--color);
    color: #fff;
    font-size: .18rem;
    padding: .1rem;
    position: relative;
    cursor: pointer
}

.sidebar_inner_bottom .top:after,.sidebar_inner_bottom .top:before {
    display: block;
    content: '';
    position: absolute;
    bottom: 0;
    right: .15rem;
    width: .1rem;
    height: .1rem;
    transform: rotate(45deg);
    z-index: 1;
    transition: all .3s linear;
    top: 45%
}

.sidebar_inner_bottom .top:before {
    border-right: .02rem solid #fff;
    transform: rotate(-45deg)
}

.sidebar_inner_bottom .top:after {
    border-bottom: .02rem solid #fff;
        transform: rotate(130deg);
}

.sidebar_inner_bottom .top.open:after,.sidebar_inner_bottom .top.open:before {
    top: 35%;
}

.sidebar_inner_bottom .top.open:after {
    transform: rotate(45deg);
}

.sidebar_inner_bottom .top.open:before {
    transform: rotate(45deg);
}

.sidebar_inner_bottom .bottom_form {
    padding: .1rem .2rem;
    padding-bottom: .2rem;
    display: none
}

.sidebar_inner_bottom .bottom_form form .input {
    color: #666
}

.sidebar_inner_bottom .bottom_form form .input div {
    margin-bottom: .1rem
}

.sidebar_inner_bottom .bottom_form form .input div p {
    margin-bottom: .05rem;
    font-size: .15rem
}

.sidebar_inner_bottom .bottom_form form .input div input {
    border: .01rem solid #ddd;
    width: 100%;
    line-height: .35rem;
    padding: 0 .1rem;
    border-radius: .05rem;
    font-size: .15rem
}

.sidebar_inner_bottom .bottom_form form .submit button {
    background: var(--color);
    color: #fff;
    text-align: center;
    padding: .06rem 0;
    border-radius: .05rem;
    margin-top: .2rem;
    overflow: hidden;
    border: .01rem solid var(--color);
    width: 100%;
    transition: all .3s linear
}

.sidebar_inner_bottom .bottom_form form .submit button:hover {
    color: var(--color);
    background: 0 0
}

.sidebar_inner_bottom_m {
    display: none;
    position: fixed;
    bottom: .2rem;
    right: 0
}