* {    padding: 0;    margin: 0;    box-sizing: border-box;    font-family: ' ';}ul li {    list-style: none;}a {    text-decoration: none;}a:hover {    text-decoration: none;}img {    vertical-align: top;    outline-width: 0ch;}body {    overflow-x: hidden;}:root {    --main-color: #dc97c0;    --main-color1: #eb6100;    --main-color-white: #ffffff;    --main-color-555: #555555;    --main-color-999: #999999;    --main-color-666: #666666;    --main-color-333: #333333;    --main-color-888: #888888;    --main-color-222: #222222;    --main-transition: all ease 0.4s;    --main-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;}@media only screen and (min-width: 996px) {    .pchead {        width: 100%;        position: fixed;        top: 0;        left: 0;        z-index: 99;        background-color: var(--main-color);        height: 100px;    }    .pcheader {        width: 100%;        max-width: 1630px;        padding: 0 65px;        margin: 0 auto;        display: flex;        align-items: center;        justify-content: space-between;        height: 100px;    }    .pclogo img {        height: 60px;    }    .pcnav {        display: flex;        align-items: center;        position: relative;        z-index: 99;    }    .pcnav>li {        position: relative;        transition: var(--main-transition);    }    .pcnav>li>a {        display: block;        height: 40px;        line-height: 40px;        font-size: 14px;        transition: var(--main-transition);        color: var(--main-color-white);        padding: 0 20px;    }    .pc_sec_nav {        position: absolute;        top: 100%;        left: 0;        width: 150px;        background-color: var(--main-color-white);        opacity: 0;        visibility: hidden;        transition: var(--main-transition);    }    .pc_sec_item a {        color: var(--main-color-666);        font-size: 14px;        display: block;        padding: 10px 20px;        transition: var(--main-transition);    }    .pcnav>li>a:hover {        color: var(--main-color);        background-color: var(--main-color-white);    }    .pc_sec_item .second_a:hover {        color: var(--main-color-white) !important;        background-color: var(--main-color-white) !important;    }    .pcnav li:hover .pc_sec_nav {        opacity: 1 !important;        visibility: visible !important;    }    .pc_sec_item:hover .pc_third_nav {        opacity: 1 !important;        visibility: visible !important;    }    .pc_sec_item:hover .second_a {        color: var(--main-color-white) !important;        background-color: var(--main-color) !important;    }    .third_a:hover {        color: var(--main-color-white) !important;        background-color: var(--main-color) !important;    }    .pc_sec_item {        position: relative;    }    .pc_third_nav {        position: absolute;        left: 100%;        top: 0;        z-index: 998;        width: 150px;        opacity: 0;        visibility: hidden;        transition: var(--main-transition);    }    .third_a {        color: var(--main-color-666);        background-color: var(--main-color-white);    }    .ml_mb_head {        display: none;    }    .ml_mb_nav {        display: none;    }    .ml_banner {        width: 100%;        z-index: 998;        margin-top: 100px !important;    }    .ml_banner:hover .bannerbtnleft {        left: 10px !important;        opacity: 1 !important;    }    .ml_banner:hover .bannerbtnright {        right: 10px !important;        opacity: 1 !important;    }    .ml_banner img {        width: 100%;    }    .bannerpage .swiper-pagination-bullet {        width: 15px !important;        height: 15px !important;    }    .bannerbtn {        width: 50px !important;        display: flex;        align-items: center;        justify-content: center;        color: var(--main-color-white);        font-size: 25px;        height: 50px !important;        transition: var(--main-transition);        background: rgba(0, 0, 0, .7);        background-image: none !important;        opacity: 0;    }    .bannerbtnleft {        left: 0 !important;    }    .bannerbtnright {        right: 0 !important;    }    .copy {        width: 100%;        text-align: center;        padding: 15px;        background-color: var(--main-color);        background-color: #eeeff2;    }    .copycon {        text-align: center;        max-width: 1200px;        text-align: center;        font-size: 14px;        color: var(--main-color-666);        margin: 0 auto;    }    .copycon a {        font-size: 14px;        color: var(--main-color-666);    }    .inbanner {        width: 100%;        height: 300px;        margin-top: 100px;        background-image: url(../images/inbanner.webp);        background-repeat: no-repeat;        background-size: cover;        background-position: center;        display: flex;        align-items: center;        justify-content: center;    }        .inbanner strong {            display: block;            font-size: 30px;            color: var(--main-color-white);            font-weight: normal;            display: none;        }    .inside {        padding: 10px 65px;        max-width: 1630px;        margin: 0 auto;    }    .inside p {        font-size: 14px;        color: var(--main-color-333);    }    .con1 {        padding: 80px 0;        background-image: url(../images/bg1.webp);        background-repeat: no-repeat;        background-position: right;    }    .con1con {        max-width: 1630px;        padding: 0 65px;        margin: 0 auto;    }    .con_title {        margin-bottom: 35px;    }    .con_title strong {        color: var(--main-color-333);        font-size: 32px;    }    .con_title strong span {        color: var(--main-color-999);        font-size: 18px;        font-weight: 400;    }    .con1con p {        font-size: 15px;        color: #808080;        line-height: 30px;        max-width: 1000px;    }    .con2con {        display: flex;        flex-wrap: wrap;        justify-content: space-between;    }    .con2left {        width: 50%;    }    .con2left img {        width: 100%;    }    .con2right {        width: 50%;        display: flex;        flex-direction: column;        justify-content: center;        padding: 5vw;        background-image: url(../images/bg2.png);    }    .con2right p {        color: #808080;        font-size: 15px;        line-height: 30px;    }    .con2right a {        display: block;        width: 140px;        height: 40px;        text-align: center;        color: var(--main-color-white);        background-color: var(--main-color);        border-radius: 40px;        font-size: 13px;        line-height: 40px;        margin-top: 30px;    }    .con3 {        padding: 80px 0;    }    .con3con {        max-width: 1630px;        padding: 0 65px;        margin: 0 auto;        display: flex;        flex-wrap: wrap;        justify-content: space-between;        align-items: center;    }    .con3left {        width: 45%;    }    .con3right {        width: 50%;    }    .zx_swiper {        width: 100%;    }    .zx_swiper img {        width: 100%;        height: 460px;        object-fit: cover;    }    .zx_swiper .swiper-slide {        cursor: pointer;    }    .con3pos {        position: absolute;        width: 100%;        height: 40px;        background: rgba(0, 0, 0, .7);        bottom: 0;        left: 0;        line-height: 40px;        width: 100%;        overflow: hidden;        text-overflow: ellipsis;        display: -webkit-box;        -webkit-box-orient: vertical;        -webkit-line-clamp: 1;        font-size: 14px;        color: var(--main-color-white);        text-align: center;        padding: 0 20px;    }    .zx_con img {        width: 50px;        display: block;        margin-bottom: 10px;    }    .zx_con a {        color: var(--main-color-333);        font-size: 18px;        margin-bottom: 20px;        display: block;    }    .zx_con a:hover {        color: var(--main-color);    }    .zx_con em {        font-style: normal;        font-size: 14px;        line-height: 30px;        color: var(--main-color-666);    }    .zx_btn {        width: 40px !important;        height: 40px !important;        border-radius: 50%;        text-align: center;        color: var(--main-color-white);        background-image: none !important;        background: rgba(0, 0, 0, .7);        font-size: 20px;        line-height: 40px;        text-align: center;    }    .hr {        opacity: .4;    }    .con4 {        padding: 80px 0;    }    .con4con {        max-width: 1630px;        padding: 0 65px;        margin: 0 auto;    }    .con4con ul {        display: flex;        flex-wrap: wrap;    }    .con4con ul li {        width: calc((100% - 60px) / 3);        margin-right: 30px;        margin-bottom: 30px;        cursor: pointer;    }    .con6 li {        margin-right: 0 !important;    }    .con4con ul li:hover a {        color: var(--main-color);    }    .con4con ul li a {        color: var(--main-color-333);        font-size: 16px;    }    .con4con ul li span {        display: block;        font-size: 14px;        color: var(--main-color-999);        margin: 10px 0;    }    .con4con ul li:nth-child(3n) {        margin-right: 0;    }    .con4con ul li p {        color: var(--main-color-666);        font-size: 14px;        width: 100%;        overflow: hidden;        text-overflow: ellipsis;        display: -webkit-box;        line-height: 30px;        -webkit-box-orient: vertical;        -webkit-line-clamp: 2;    }    .tagspan {        display: block;        padding: 5px 15px;        cursor: pointer;        font-size: 12px;        background-color: #f0f0f0;        border-radius: 40px;        display: inline-block;        margin-top: 20px;        color: var(--main-color-555);    }    .more {        display: block;        width: 140px;        height: 40px;        text-align: center;        color: var(--main-color-white);        background-color: var(--main-color);        border-radius: 40px;        font-size: 13px;        line-height: 40px;        margin: 0 auto;        margin-top: 30px;    }    .con5 {        padding: 80px 0;        background-image: url(../images/bg3.webp);        background-repeat: no-repeat;    }    .con5con {        max-width: 1630px;        margin: 0 auto;        padding: 0 65px;    }    .i_newbox {        display: flex;        flex-wrap: wrap;    }    .i_newitem {        width: calc((100% - 100px) / 3);        margin-right: 50px;        margin-bottom: 50px;        box-shadow: var(--main-shadow);        cursor: pointer;    }    .i_newitem:hover img {        transform: scale(1.1);    }    .i_newitem:hover a {        color: var(--main-color);    }    .i_newitem:nth-child(3n) {        margin-right: 0;    }    .n_box {        overflow: hidden;    }    .n_box img {        width: 100%;        height: 270px;        object-fit: cover;        transition: var(--main-transition);    }    .n_txt {        padding: 15px;        background-color: var(--main-color-white);    }    .n_txt a {        color: var(--main-color-333);        font-size: 16px;    }    .n_txt span {        display: block;        width: 100%;        overflow: hidden;        text-overflow: ellipsis;        display: -webkit-box;        -webkit-box-orient: vertical;        -webkit-line-clamp: 2;        margin: 15px 0;        font-size: 14px;        color: var(--main-color-666);        line-height: 25px;    }    .n_txt p {        font-size: 14px;        color: var(--main-color-666);    }    .con6 ul {        justify-content: space-between;    }    .con6 li {        margin-bottom: 60px !important;        width: 48% !important;    }    .foot {        padding: 80px 0;        background-color: #333333;    }    .footer {        max-width: 1630px;        padding: 0 65px;        margin: 0 auto;        display: flex;        align-items: center;        justify-content: space-between;    }    .footitem1 {        width: 20%;    }    .foot_title {        color: var(--main-color-white);        font-size: 25px;        font-weight: normal;        margin-bottom: 20px;        display: block;    }    .footitem1 ul li {        margin-bottom: 10px;        font-size: 14px;        color: var(--main-color-999);    }    .footitem3 {        width: 8%;    }    .footitem3 img {        width: 100%;    }    .footitem3 p {        font-size: 14px;        text-align: center;        color: var(--main-color-999);        margin-top: 10px;    }    .footitem2 {        flex: 1;        padding: 0 25px;    }    .footitem2 ul {        display: flex;        justify-content: center;    }    .footitem2 ul li {        width: 20%;        padding: 0 20px;    }    .footitem2 a {        display: block;    }    .f_a {        color: var(--main-color-white);        font-size: 14px;        margin-bottom: 10px;    }    .s_a {        margin-bottom: 10px;        font-size: 14px;        color: var(--main-color-999);    }    .aboutus1 {        width: 100%;        padding: 15px 0;        padding-bottom: 50px;    }    .aboutus1con {        max-width: 1630px;        padding: 0 65px;        margin: 0 auto;        display: flex;        flex-wrap: wrap;        justify-content: space-between;        align-items: center;    }    .aboutus1left {        width: 48%;    }    .aboutus1right {        width: 48%;    }    .aboutus1right img {        width: 100%;    }    .aboutus1left p {        font-size: 15px;        color: var(--main-color-555);        line-height: 30px;    }    .aboutus2 {        padding: 50px 0;    }    .aboutus2con {        max-width: 1630px;        padding: 0 65px;        margin: 0 auto;    }    .num_scroll {        width: 100%;    }    .mumping_mun {        display: flex;        flex-wrap: wrap;        justify-content: space-between;    }    .mumping_mun li {        text-align: center;        flex: 1;        padding: 50px 20px;        margin: 0 20px;        box-shadow: var(--main-shadow);    }    .mun_top {        display: flex;        justify-content: center;    }    .mun_top span {        color: var(--main-color-666);        display: block;        margin-left: 5px;    }    .mun_top h2 {        font-size: 40px;        font-weight: normal;        color: var(--main-color);    }    .mumping_mun li p {        text-align: center;        font-size: 15px;        color: var(--main-color-666);        margin-top: 10px;    }    .aboutus3 {        padding: 80px 0;        background-color: #fbfbfb;    }    .aboutus3con {        max-width: 1630px;        margin: 0 auto;        padding: 0 65px;    }    .aboutus3con ul {        display: flex;        flex-wrap: wrap;    }    .aboutus3con ul li:nth-child(3n) {        margin-right: 0;    }    .aboutus3con ul li {        width: calc((100% - 100px) / 3);        margin-right: 50px;        margin-bottom: 30px;        border-bottom: 5px solid var(--main-color);        padding: 50px 40px;        box-shadow: var(--main-shadow);    }    .aboutus3con ul li strong {        display: block;        font-weight: normal;        font-size: 22px;        color: var(--main-color-333);        margin-bottom: 5px;    }    .aboutus3con ul li p {        color: var(--main-color-999);        margin-bottom: 30px;        font-size: 12px;    }    .aboutus3con ul li span {        font-size: 15px;        color: #808080;        line-height: 35px;    }    .aboutus4 {        width: 100%;        padding: 50px 0;    }    .aboutus4con {        max-width: 1630px;        padding: 0 65px;        margin: 0 auto;    }    .mySwiper_case {        width: 100%;        padding-bottom: 80px !important;    }    .mySwiper_case img {        width: 100%;    }    .casepage .swiper-pagination-bullet {        width: 15px;        height: 15px;        background-color: var(--main-color);    }}@media only screen and (max-width: 996px) {    .aboutus4 {        width: 100%;        padding: 30px 15px;    }    .mySwiper_case {        width: 100%;        padding-bottom: 50px !important;    }    .mySwiper_case img {        width: 100%;    }    .casepage .swiper-pagination-bullet {        width: 15px;        height: 15px;        background-color: var(--main-color);    }    .aboutus3 {        padding: 30px 15px;        background-color: #fbfbfb;    }    .aboutus3con ul {        display: flex;        flex-wrap: wrap;    }    .aboutus3con ul li {        width: 100%;        margin-bottom: 30px;        border-bottom: 5px solid var(--main-color);        padding: 30px 20px;        box-shadow: var(--main-shadow);    }    .aboutus3con ul li strong {        display: block;        font-weight: normal;        font-size: 18px;        color: var(--main-color-333);        margin-bottom: 5px;    }    .aboutus3con ul li p {        color: var(--main-color-999);        margin-bottom: 15px;        font-size: 12px;    }    .aboutus3con ul li span {        font-size: 14px;        color: #808080;        line-height: 35px;    }    .aboutus2 {        padding: 30px 15px;    }    .num_scroll {        width: 100%;    }    .mumping_mun {        display: flex;        flex-wrap: wrap;        justify-content: space-between;    }    .mumping_mun li {        text-align: center;        width: 48%;        margin-bottom: 25px;    }    .mun_top {        display: flex;        justify-content: center;    }    .mun_top span {        color: var(--main-color-666);        display: block;        margin-left: 5px;    }    .mun_top h2 {        font-size: 25px;        font-weight: normal;        color: var(--main-color);    }    .mumping_mun li p {        text-align: center;        font-size: 15px;        color: var(--main-color-666);        margin-top: 10px;    }    .aboutus1 {        width: 100%;        padding: 30px 15px;    }    .aboutus1con {        margin: 0 auto;        display: flex;        flex-wrap: wrap;        flex-direction: column-reverse;        justify-content: space-between;        align-items: center;    }    .aboutus1left {        width: 100%;        margin-top: 20px;    }    .aboutus1right {        width: 100%;    }    .aboutus1right img {        width: 100%;    }    .aboutus1left p {        font-size: 14px;        color: var(--main-color-555);        line-height: 30px;    }    .foot {        padding: 30px 15px;        background-color: #333333;    }    .footitem {        margin-bottom: 25px;    }    .footer {        margin: 0 auto;        display: flex;        align-items: center;        flex-wrap: wrap;        justify-content: space-between;    }    .footitem1 {        width: 100%;    }    .foot_title {        color: var(--main-color-white);        font-size: 18px;        font-weight: normal;        margin-bottom: 15px;        display: block;    }    .footitem1 ul li {        margin-bottom: 10px;        font-size: 14px;        color: var(--main-color-999);    }    .footitem3 {        width: 100%;    }    .footitem3 img {        width: 100px;        height: 100px;    }    .footitem3 p {        font-size: 14px;        color: var(--main-color-999);        margin-top: 10px;    }    .footitem2 {        width: 100%;    }    .footitem2 ul {        display: flex;    }    .footitem2 a {        display: block;        margin-right: 10px;    }    .f_a {        color: var(--main-color-white);        font-size: 14px;        margin-bottom: 10px;    }    .s_a {        display: none !important;    }    .con5 {        padding: 30px 15px;    }    .i_newbox {        display: flex;        flex-wrap: wrap;    }    .i_newitem {        width: 100%;        margin-bottom: 30px;        box-shadow: var(--main-shadow);        cursor: pointer;    }    .n_box {        overflow: hidden;    }    .n_box img {        width: 100%;        object-fit: cover;        transition: var(--main-transition);    }    .n_txt {        padding: 15px;        background-color: var(--main-color-white);    }    .n_txt a {        color: var(--main-color-333);        font-size: 15px;    }    .n_txt span {        display: block;        width: 100%;        overflow: hidden;        text-overflow: ellipsis;        display: -webkit-box;        -webkit-box-orient: vertical;        -webkit-line-clamp: 2;        margin: 10px 0;        font-size: 14px;        color: var(--main-color-666);        line-height: 25px;    }    .n_txt p {        font-size: 12px;        color: var(--main-color-666);    }    .hr {        display: none;    }    .con4 {        padding: 30px 15px;    }    .con4con ul {        display: flex;        flex-wrap: wrap;    }    .con4con ul li {        width: 100%;        margin-bottom: 40px;        cursor: pointer;    }    .con4con ul li:hover a {        color: var(--main-color);    }    .con4con ul li a {        color: var(--main-color);        font-size: 15px;    }    .con4con ul li span {        display: block;        font-size: 13px;        color: var(--main-color-999);        margin: 10px 0;    }    .con4con ul li p {        color: var(--main-color-666);        font-size: 12px;        width: 100%;        overflow: hidden;        text-overflow: ellipsis;        display: -webkit-box;        line-height: 30px;        -webkit-box-orient: vertical;        -webkit-line-clamp: 2;    }    .tagspan {        display: block;        padding: 5px 15px;        cursor: pointer;        font-size: 12px;        background-color: #f0f0f0;        border-radius: 40px;        display: inline-block;        margin-top: 10px;    }    .more {        display: block;        width: 140px;        height: 40px;        text-align: center;        color: var(--main-color-white);        background-color: var(--main-color);        border-radius: 40px;        font-size: 13px;        line-height: 40px;        margin: 0 auto;        margin-top: 30px;    }    .con3 {        padding: 30px 15px;    }    .con3con {        margin: 0 auto;        display: flex;        flex-wrap: wrap;        justify-content: space-between;        align-items: center;    }    .con3left {        width: 100%;    }    .con3right {        width: 100%;        margin-top: 20px;    }    .zx_swiper {        width: 100%;    }    .zx_swiper img {        width: 100%;    }    .zx_swiper .swiper-slide {        cursor: pointer;    }    .con3pos {        position: absolute;        width: 100%;        height: 40px;        background: rgba(0, 0, 0, .7);        bottom: 0;        left: 0;        line-height: 40px;        width: 100%;        overflow: hidden;        text-overflow: ellipsis;        display: -webkit-box;        -webkit-box-orient: vertical;        -webkit-line-clamp: 1;        font-size: 14px;        color: var(--main-color-white);        text-align: center;        padding: 0 20px;    }    .zx_con img {        width: 30px;        display: block;        margin-bottom: 10px;    }    .zx_con a {        color: var(--main-color-333);        font-size: 16px;        margin-bottom: 10px;        display: block;    }    .zx_con a:hover {        color: var(--main-color);    }    .zx_con em {        font-style: normal;        font-size: 14px;        line-height: 30px;        color: var(--main-color-666);    }    .zx_btn {        width: 40px !important;        height: 40px !important;        border-radius: 50%;        text-align: center;        color: var(--main-color-white);        background-image: none !important;        background: rgba(0, 0, 0, .7);        font-size: 20px;        line-height: 40px;        text-align: center;    }    .con2 {        padding: 30px 15px;    }    .con2con {        display: flex;        flex-wrap: wrap;        justify-content: space-between;    }    .con2left {        width: 100%;    }    .con2left img {        width: 100%;    }    .con2right {        width: 100%;        display: flex;        flex-direction: column;        justify-content: center;        padding: 25px 10px;        background-image: url(../images/bg2.png);    }    .con2right p {        color: #808080;        font-size: 15px;        line-height: 30px;    }    .con2right a {        display: block;        width: 120px;        height: 35px;        text-align: center;        color: var(--main-color-white);        background-color: var(--main-color);        border-radius: 35px;        font-size: 12px;        line-height: 35px;        margin-top: 15px;    }    .con1 {        padding: 30px 15px;        background-image: url(../images/bg1.webp);        background-repeat: no-repeat;        background-size: cover;    }    .con_title {        margin-bottom: 15px;    }    .con_title strong {        color: var(--main-color-333);        font-size: 25px;    }    .con_title strong span {        color: var(--main-color-999);        font-size: 15px;        font-weight: 400;    }    .con1con p {        font-size: 14px;        color: var(--main-color-666);        line-height: 30px;    }    html {        overflow-x: hidden;    }    .inside {        padding: 30px 15px;        padding-top: 10px;        margin: 0 auto;    }    .inside p {        font-size: 14px;        color: var(--main-color-333);    }    .inbanner {        width: 100%;        height: 150px;        margin-top: 60px;        background-image: url(../images/inbanner.webp);        background-repeat: no-repeat;        background-size: cover;        background-position: center;        display: flex;        align-items: center;        justify-content: center;    }    .inbanner strong {        display: block;        font-size: 25px;        color: var(--main-color-white);        font-weight: normal;    }    .copy {        width: 100%;        text-align: center;        padding: 15px;        background-color: var(--main-color);        margin-bottom: 60px;    }    .copycon {        text-align: center;        text-align: center;        font-size: 13px;        color: var(--main-color-white);        margin: 0 auto;    }    .copycon a {        font-size: 13px;        color: var(--main-color-white);    }    .ml_banner {        width: 100%;        margin-top: 60px !important;    }    .ml_banner img {        width: 100%;    }    .bannerpage .swiper-pagination-bullet {        width: 10px !important;        height: 10px !important;    }    .bannerbtn {        width: 40px !important;        height: 40px !important;        display: flex;        align-items: center;        justify-content: center;        color: var(--main-color-white);        font-size: 25px;        transition: var(--main-transition);        background: rgba(0, 0, 0, .7);        background-image: none !important;    }    .pchead {        display: none;    }    .pcnav {        display: none;    }    .ml_mb_arrowChange {        transform: rotate(90deg);    }    .ml_mbnav_3 {        display: none;    }    .ml_mbnav_3_item {        display: flex;        padding: 0 20px;        justify-content: space-between;        align-items: center;        border-bottom: 1px solid #f3f3f3;        background-color: #efefef;    }    .ml_mbnav_3_item>a {        display: block;        width: 100%;        height: 40px;        line-height: 40px;        color: var(--main-color-666);        font-size: 14px;        padding-left: 35px;    }    .ml_mb_nav i {        font-size: 22px !important;        transition: var(--main-transition);    }    .ml_mbnav_2_item {        display: flex;        padding: 0 20px;        justify-content: space-between;        align-items: center;        border-bottom: 1px solid #f3f3f3;        background-color: #e3e3e3;    }    .ml_mbnav_2_item>a {        display: block;        height: 40px;        width: 100%;        line-height: 40px;        color: var(--main-color-666);        font-size: 14px;        padding-left: 20px;    }    .ml_mbnav_2 {        display: none;    }    .ml_mbnav_1_item>a {        display: block;        height: 40px;        line-height: 40px;        color: var(--main-color-666);        font-size: 14px;        width: 100%;    }    .ml_mbnav_1_item {        display: flex;        padding: 0 20px;        justify-content: space-between;        align-items: center;        border-bottom: 1px solid #f3f3f3;    }    .ml_mb_nav {        width: 100%;        height: calc(100% - 60px);        position: fixed;        top: 60px;        right: -100%;        background-color: var(--main-color-white);        z-index: 100;        border-top: 1px solid #ccc;        overflow: scroll;        padding: 20px 0;        transition: var(--main-transition);    }    .mb_navShow {        right: 0 !important;    }    .hb_fadeout {        opacity: 0 !important;    }    .change2 {        transform: translateY(-10px) rotate(-45deg);    }    .change1 {        transform: translateY(10px) rotate(45deg);    }    .hb span {        display: block;        width: 30px;        height: 1px;        background-color: var(--main-color-white);        transition: var(--main-transition);    }    .hb {        display: flex;        flex-wrap: wrap;        justify-content: space-between;        height: 20px;        flex-direction: column;    }    .ml_mb_logo img {        width: 120px;    }    .ml_mb_head {        display: flex;        height: 60px;        padding: 0 20px;        background-color: var(--main-color);        position: fixed;        top: 0;        left: 0;        align-items: center;        justify-content: space-between;        box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;        width: 100%;        z-index: 99;    }    .ml_pcheader {        display: none;    }}