/* basic */
@font-face {font-family: montserrat;src: url('montserrat.woff2') format('woff2');}
* {font-family: montserrat !important;}
body {font-size: 16px;}

/* color */
:root {
    --color: #DE2D2D;
}

/* btn */
.btn {text-transform: uppercase;border-radius: 5px;}

/* btn switch version */
.version {top: 20px;right: 20px;color: white;padding: 10px 20px;border-radius: 10px;z-index: 4;}

/* head */
.head {position: absolute;top: 0;left: 0;right: 0;width: 100%;z-index: 3;padding: 20px;background-image: linear-gradient(var(--000-5),transparent);}
.head-cont hop > a {width: 50px;height: 50px;border-radius: 10px;}
.head-cont hop > a:hover {background-color: var(--fff-1);}
.head-cont hop > a i {color: white;font-size: 36px;}
.head-cont hop.message hop-cont a {text-align: left;text-transform: none;}
.head-cont hop.message hop-cont a i {margin-right: 10px;}

.logo {width: 60px;height: 60px;display: block;}

/* menu */
menu {flex: 1;}
menu x {color: white;}
menu-cont {}
menu-cont li > a {padding: 0 20px;line-height: 50px;border-bottom: 3px transparent solid;color: white;font-size: 18px;}
menu-cont li > a.active,
menu-cont li > a:hover {border-bottom-color: var(--color);}
menu-group {border-radius: 5px;overflow: hidden;width: 140%;margin-left: -20%;}
menu-group a {line-height: 50px;}
menu-group a:not(:last-child) {border-bottom: 1px var(--eee) solid;}
menu-group a:hover {background-color: var(--color);color: white;}

/* light */
.light {height: 900px;position: relative;background-image: url(../images/light/0.jpg);background-size: cover;overflow: hidden;}
.light-cont {text-align: center;z-index: 1;pointer-events: none;animation-delay: .5s;}
.light-cont aside {display: inline-block;background-color: var(--color);padding: 10px 20px;border-radius: 5px;}
.light-cont h3 {color: white;text-transform: uppercase;font-size: 56px;display: inline-block;border-radius: 10px;padding: 10px 20px;background-color: var(--fff-1);}
.light-cont h3 span {color: var(--color);}
.light-cont h4 {text-transform: uppercase;font-weight: lighter;color: white;font-size: 40px;margin: 20px 0;}
.light-cont a {height: 60px;width: 300px;margin: 40px 0 80px;;pointer-events: all;}
.light-cont a .ico {font-size: 30px;}

/*name*/
.name {font-size: 160px;width: 1300px;height: 300px;animation-delay: 1s;}
.name symbol text {text-transform: uppercase;}
.text-copy {fill: none;stroke: white;stroke-dasharray: 6% 29%;stroke-width: 3px;stroke-dashoffset: 0%;animation: stroke-offset 5.5s infinite linear;}
.text-copy:nth-child(1) {stroke: var(--brown);animation-delay: -1;}
.text-copy:nth-child(2) {stroke: var(--color);animation-delay: -2s;}
.text-copy:nth-child(3) {stroke: var(--tomato);animation-delay: -3s;}
.text-copy:nth-child(4) {stroke: var(--brown);animation-delay: -4s;}
.text-copy:nth-child(5) {stroke: var(--orange);animation-delay: -5s;}
@keyframes stroke-offset {100% {stroke-dashoffset: -35%;}}

/*atropos*/
.atropos {width: 1300px;margin: auto;}
.atropos img {position: absolute;top: 0;left: 0;}
.atropos img:first-child {position: static;}
.atropos {position: relative;display: block;perspective: 1200px;transform: translate3d(0, 0, 0);}
.atropos-rotate-touch,
.atropos-rotate-scroll-x,
.atropos-rotate-scroll-y {-webkit-tap-highlight-color: rgba(0, 0, 0, 0);-webkit-touch-callout: none;user-select: none;}
.atropos-rotate-touch-scroll-y {touch-action: pan-y;}
.atropos-rotate-touch-scroll-x {touch-action: pan-x;}
.atropos-rotate-touch {touch-action: none;}
.atropos-scale,
.atropos-rotate {width: 100%;height: 100%;transform-style: preserve-3d;transition-property: transform;display: block;}
.atropos-shadow,
.atropos-highlight {position: absolute;pointer-events: none;transition-property: transform, opacity;display: block;opacity: 0;}
.atropos-shadow {z-index: -1;background: #000;left: 0;top: 0;width: 100%;height: 100%;filter: blur(30px);}
.atropos-highlight {left: -50%;top: -50%;width: 200%;height: 200%;background-image: radial-gradient(circle at 50%, rgba(255, 255, 255, 0.25), transparent 50%);z-index: 0;}
.atropos-rotate {position: relative;}
.atropos-inner {width: 100%;height: 100%;position: relative;overflow: hidden;transform-style: preserve-3d;transform: translate3d(0, 0, 0);display: block;}
.atropos-active {z-index: 1;}
.atropos-active .atropos-shadow {opacity: 1 !important;}
[data-atropos-offset],
::slotted([data-atropos-offset]) {transition-property: transform;}
[data-atropos-opacity] {transition-property: opacity;}
[data-atropos-offset][data-atropos-opacity],
::slotted([data-atropos-offset][data-atropos-opacity]) {transition-property: transform, opacity;}

/* title */
.title {padding: 50px 0;}
.title h3 {font-size: 30px;text-transform: uppercase;letter-spacing: 10px;}
.title span {width: 40px;height: 5px;background-color: var(--color);margin: 20px auto 0;}
.title-left {text-align: left;}
.title-left span {margin-left: 0;}

/* advantage */
.advantage {padding: 50px 0;}
.advantage-cont {margin-top: 50px;}
.advantage-cont li {overflow: hidden;padding: 50px 0;margin: -50px 0;position: relative;}
.advantage-cont li em {width: calc(50% - 120px);display: block;text-align: center;transition-duration: .3s;float: left;margin-top: -50px;}
.advantage-cont li em img {width: 360px;}
.advantage-cont li em:hover {transform: scale(.95);}
.advantage-cont li aside {width: 130px;height: 130px;border-radius: 100%;border: 2px var(--eee) solid;padding: 15px;margin: auto;transition-duration: 1s;position: absolute;left: 0;right: 0;}
.advantage-cont li aside i {width: 100%;height: 100%;border-radius: 100%;background-color: var(--color);display: flex;align-items: center;justify-content: center;font-size: 48px;color: white;}
.advantage-cont li aside:hover {transform: rotate(360deg);}
.advantage-txt {width: calc(50% - 125px);float: right;word-break: break-all;}
.advantage-txt h5 {margin-bottom: 20px;font-size: 18px;}
.advantage-cont li:nth-child(2n) em,
.advantage-cont li:nth-child(2n) aside {float: right;}
.advantage-cont li:nth-child(2n) .advantage-txt {float: left;}

/* produce */
.produce {margin: 80px 0;padding: 120px 0 60px;background-color: var(--f7);}
.produce .title {position: absolute;top: 0;width: 260px;}
.produce .swiper {margin-left: 300px;width: calc(100% - 90px);}
.produce .swiper-button-prev,
.produce .swiper-button-next {border-radius: 100%;border: 3px var(--color) solid;top: 300px;width: 60px;height: 60px;transition-duration: .3s;}
.produce .swiper-button-prev:hover,
.produce .swiper-button-next:hover {background-color: var(--color);color: white;}
.produce .swiper-button-next {left: 70px;right: auto;}
.produce .swiper-slide {background-color: var(--111);border-radius: 20px;margin-bottom: 60px;transition-duration: .3s;height: 480px;}
.produce .swiper-slide.shadow::after {background-color: var(--111);}
.produce .swiper-slide img {border-radius: 20px 20px 0 0;}
.produce-txt {padding: 25px;position: absolute;left: 0;bottom: 20px;overflow: auto;border-radius: 20px;height: 24%;transition-duration: .3s;width: 100%;word-break: break-all;}
.produce-txt h4 {color: white;text-transform: uppercase;font-size: 24px;margin-bottom: 10px;}
.produce-txt p {color: var(--666);line-height: 150%;}
.produce .swiper-slide:hover 
.produce-txt {height: 100%;background-color: var(--000-8);bottom: 0;}

/* about */
.about {padding: 50px 0 140px;}
.about .main {display: flex;}
.about-img {width: 680px;height: 430px;margin-right: 50px;text-align: center;position: relative;}
.about-img span {width: 100%;height: 130px;background-color: var(--color);display: block;}
.about-img em {width: 430px;height: 430px;border-radius: 20px;overflow: hidden;box-shadow: 40px 40px 40px var(--000-3);transition-duration: .3s;}
.about-img:hover em {box-shadow: 20px 20px 20px var(--000-5);transform: translate(10px,10px);}
.about-img:hover span {animation: about .4s infinite;}
.about-cont {flex: 1;margin-left: -20px;}
.about-cont h5 {margin-bottom: 20px;font-size: 18px;}

@keyframes about {
    0% {height: 130px;}
    15% {height: 50px;}
    30% {height: 150px;}
    45% {height: 80px;}
    60% {height: 180px;}
    75% {height: 30px;}
    90% {height: 210px;}
    100% {height: 130px;}
}

/* provider */
.provider {background-image: url(../images/provider.jpg);background-size: cover;padding: 140px 0;}
.provider .main {display: flex;}
.provider-info {width: 400px;margin-right: 50px;}
.provider-info p {}
.provider-info a {text-transform: uppercase;float: left;margin-top: 200px;}
.provider-info a i {background-color: var(--color);color: white;border-radius: 100%;font-size: 30px;padding: 5px;}
.provider-info a span {padding: 0 10px;font-size: 20px;}
.provider-info a:hover span {color: var(--color);}
.provider-cont {flex: 1;margin-right: -150px;}
.provider-cont li {float: left;margin: 10px;}
.provider-cont li a {display: block;width: 200px;height: 100px;border-radius: 10px;overflow: hidden;background-color: white;}
.provider-cont li a:hover {box-shadow: 0 5px 10px var(--000-1);}

/* employee */
.employee {padding: 50px 0;}
.employee-cont {padding: 50px;background-image: url(../images/team.jpg);background-size: cover;position: relative;}
.employee-cont .swiper-button-next::before,
.employee-cont .swiper-button-prev::before {content: '\e754';}
.employee-cont .swiper-button-next {right: 0;top: auto;bottom: 45%;transform: rotate(180deg);}
.employee-cont .swiper-button-prev {left: 0;bottom: 45%;}
.employee-txt {background-color: var(--f7);padding: 25px;margin: 55px 0;border-radius: 20px;height: 280px;}
.employee-txt.shadow::after {background-color: transparent;}
.employee-txt em {width: 120px;height: 120px;border: 10px white solid;margin-top: -90px;}
.employee-txt h5 {text-transform: uppercase;font-size: 20px;font-weight: normal;padding: 25px 0;border-bottom: 1px var(--ddd) solid;margin-bottom: 20px;}
.employee-txt p {word-spacing: -0.9px;}
.employee-txt:hover,
.employee-txt:hover.shadow::after {background-color: var(--color);}
.employee-txt:hover h5,
.employee-txt:hover p {color: white;border-color: var(--fff-2);}

/* foot */
.foot {margin-top: 140px;background-color: var(--222);}
.foot-cont {display: flex;padding: 50px 0;}
.foot-cont h3 {font-size: 18px;color: white;text-transform: uppercase;margin-bottom: 30px;font-weight: normal;}
.foot-support {flex: 1;}
.foot-support img {width: 540px;}
.foot-sns {width: 500px;}
.foot-sns ul {display: flex;}
.foot-sns ul li {}
.foot-sns ul li a {width: 50px;height: 50px;display: flex;align-items: center;font-size: 30px;color: var(--666);border-radius: 10px;}
.foot-sns ul li a:hover {background-color: var(--color);color: white;}
.foot-copy {background-color: var(--111);padding: 20px;text-transform: uppercase;text-align: center;color: var(--666);}
.top {border-radius: 10px;}

/* banner */
.banner {height: 400px;background-size: cover;padding-top: 90px;}
.banner .main {height: 100%;display: flex;align-items: center;}
.banner h2 {text-transform: uppercase;color: white;padding: 20px 40px;border-radius: 10px;font-size: 36px;animation-delay: .5s;}
.banner h2 z:first-child {color: var(--color);}

/* team */
.team {padding: 50px 0;}
.team-info h5 {margin: 20px 0;font-size: 18px;line-height: 150%;}

/*journey*/
.journey {}
.journey-time {height: 240px;background-image: url(../images/journey.jpg);background-size: cover;margin-top: 30px;}
.journey-time ul {display: flex;align-items: center;overflow: inherit;padding-top: 100px;}
.journey-time ul li {text-align: center;position: relative;transition-duration: .3s;}
.journey-time ul li i {width: 30px;height: 30px;border-radius: 100%;display: block;margin: auto;border: 4px var(--color) solid;}
.journey-time ul li span {position: absolute;left: -15px;top: 40px;width: 60px;font-size: 22px;}
.journey-time ul li:hover {transform: scale(1.3);}
.journey-time ul u {flex: 1;border-bottom: 4px var(--color) solid;}
.journey-cont {background-color: var(--f7);padding: 60px 0 30px;}
.journey-cont .swiper-slide {margin-bottom: 60px;background-color: white;border-radius: 20px;padding: 30px;}
.journey-cont .swiper-slide h5 {font-size: 22px;font-weight: normal;padding: 0 10px;border-left: 5px var(--color) solid;height: 22px;margin-bottom: 20px;}
.journey-cont .swiper-slide ul {overflow: inherit;padding: 0 20px;}
.journey-cont .swiper-slide ul li {list-style: disc;padding: 5px 0;line-height: 150%;}
.journey-cont .swiper-slide:hover {background-color: var(--eee);}

/* group */
.group {padding: 55px 0;}
.group-cont {display: grid;grid-template-columns: repeat(3,1fr);grid-gap: 30px;word-break: break-all;}
.group-cont li {text-align: center;} 
.group-cont li em {width: 180px;display: inline-block;transition-duration: .3s;}
.group-cont li i {width: 90px;height: 90px;border-radius: 100%;border: 3px var(--color) solid;display: flex;align-items: center;font-size: 48px;color: var(--color);margin: 40px auto;transition-duration: .5s;}
.group-cont li i:hover {transform: scale(1.2);}
.group-cont li h5 {font-size: 18px;margin: 20px 0;}
.group-cont li:hover em {transform: scale(.95);}

/* customer */
.customer {padding: 50px 0;}
.customer-info {padding: 30px 0;}
.customer-data {display: flex;padding: 30px 0;}
.customer-data li {flex: 1;text-align: left;padding: 0 40px;}
.customer-data li:not(:last-child) {border-right: 1px var(--eee) solid;}
.customer-data li h3 {font-size: 56px;}
.customer-data li h3 sub {text-transform: uppercase;font-size: 16px;font-weight: normal;margin-left: 10px;}
.customer-data li span {text-transform: uppercase;padding-top: 30px;display: block;}
.customer-brand {background-image: url(../images/provider.jpg);background-size: cover;padding: 50px 0 100px;}
.customer-link {display: grid;grid-template-columns: repeat(6,1fr);grid-gap: 20px;padding: 20px 0;}
.customer-link li a {border-radius: 10px;overflow: hidden;background-color: white;display: block;}
.customer-link li a:hover {box-shadow: 0 5px 10px var(--000-1);}

/*product*/
.product {padding: 50px 0;}
.product-cont li {margin: 60px 0;overflow: hidden;}
.product-cont li em {width: 44%;float: left;display: block;margin: 0 5% 0 0;}
.product-cont li:nth-child(2n) em {float: right;margin: 0 0 0 5%;}
.product-txt {flex: 1;width: 50%;display: inline-block;}
.product-txt p {word-break: break-all;}
.product-txt h4 {margin: 40px 0;border-left: 5px var(--color) solid;padding-left: 20px;text-transform: uppercase;line-height: 150%;font-size: 22px;}
.product-txt a {margin-top: 50px;width: 180px;}

/* game */
.game {padding: 50px 0;}

/* article */
article {}
article ul {background-color: var(--f7);padding: 20px 40px;border-radius: 20px;}
article img {border-radius: 20px;}
article h4 {font-size: 24px;margin: 20px 0;}
article h5 {font-size: 20px;border-left: 5px var(--color) solid;padding: 0 10px;margin: 20px 0;}
article h6 {font-size: 18px;margin: 10px 0;}

/* contact */
.contact {padding: 50px 0;}
.contact-cont {}
.contact-cont .group-cont p {text-align: center;}

.map iframe {width: 100%;height: 600px;}

/* cause */
.cause {background-image: url(../images/contact.jpg);background-size: cover;padding-top: 150px;margin-top: 150px;}
.cause .main {display: flex;}
.cause h3 {line-height: 70px;font-size: 70px;text-transform: uppercase;font-weight: normal;top: -230px;}
.cause h4 {font-size: 33px;text-transform: uppercase;padding: 10px 20px;background-color: var(--color);color: white;font-weight: normal;border-radius: 0 0 10px 10px;top: -150px;}
.cause-cont {flex: 1;margin-right: 80px;padding-top: 40px;}
.cause-cont li {display: flex;padding: 10px 0;font-size: 18px;}
.cause-cont li i {margin: 0;font-size: 32px;color: var(--color);}
.cause-cont li b {text-transform: capitalize;width: 130px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;margin: 0 20px;}
.cause-cont li p {flex: 1;}
.cause-from {width: 650px;background-color: white;padding: 20px;border-radius: 20px 20px 0 0;overflow: hidden;}
.cause-from li {float: left;padding: 5px;}
.cause-from li:nth-child(-n+4) {width: 50%;}
.cause-from li .btn {width: 100%;margin: 20px 5px 10px;font-weight: bold;}
.cause-from li a {width: 100%;height: 60px;}
.cause-from li textarea {height: 180px;}

.cooperation {padding-top: 50px;margin-top: 50px;background-image: url(../images/cooperation.jpg);}
.cooperation .cause-from {margin: auto;width: 800px;}

/* service */
.service {padding: 50px 0;}

/* form */
input,
textarea {border-radius: 5px;}
input {font-size: 16px;}

/*company*/
.company {padding: 50px 0;}
.company-cont {padding: 20px 0;}
.company-cont img {border-radius: 20px;margin: 10px auto;}
.company-cont h5 {font-size: 26px;}
.company-cont p {padding: 10px 0;}

/*join*/
.join {padding: 50px 0;}
.join-cont {padding: 20px 0;}
.join-cont p {padding: 10px 0;}
.join-cont img {margin: 10px 0;border-radius: 20px;}
.join-list {padding: 20px 0;}
.join-list fold-title {padding: 20px 0;}
.join-list fold-title h5 {font-size: 22px;}
.join-list fold-title span {padding: 0 20px;}


























@media(max-width:640px){
    /* basic */
    body {font-size: .2rem;}
    
    /* btn */
    .btn {border-radius: .1rem;}

    /* head */
    .head {padding: .1rem;}
    .head-cont hop > a {width: .7rem;height: .7rem;border-radius: .1rem;}
    .head-cont hop > a i {font-size: .4rem;}
    .head-cont hop.message hop-cont a i {margin-right: .1rem;}

    .logo {width: .55rem;height: .55rem;}

    /* menu */
    menu-cont {top: .9rem;}
    menu-cont li > a {padding: 0;line-height: .8rem;border: 0;font-size: .22rem;}
    menu-group {border-radius: 0;width: 100%;margin: 0;}
    menu-group a {line-height: .7rem;}
    menu-group a:not(:last-child) {border-color: var(--fff-1);}

    /* light */
    .light {height: 9rem;padding-top: 1rem;}
    .light-cont {}
    .light-cont aside {padding: .1rem .2rem;border-radius: .05rem;}
    .light-cont h3 {font-size: .35rem;border-radius: .1rem;padding: .2rem;}
    .light-cont h4 {font-size: .35rem;margin: .1rem 0;}
    .light-cont a {height: .7rem;width: 3rem;margin: .3rem 0 .7rem;}
    .light-cont a .ico {font-size: .3rem;}

    /*name*/
    .name {font-size: 1.6rem;width: 100%;height: 2rem;margin-top: 2.5rem;}

    /*atropos*/
    .atropos {width: 100%;}

    /* title */
    .title {padding: .5rem 0;}
    .title h3 {font-size: .3rem;letter-spacing: .1rem;}
    .title span {width: .4rem;height: .05rem;margin: .2rem auto 0;}
    .title-left span {margin-left: 0;}

    /* advantage */
    .advantage {padding: .5rem 0;}
    .advantage-cont {margin: 0;}
    .advantage-cont li {padding: 0 .2rem;margin: .3rem 0;}
    .advantage-cont li em {width:100%;float: none;margin: 0;}
    .advantage-cont li em img {width: 60%;}
    .advantage-cont li aside {width: 1.3rem;height: 1.3rem;padding: .1rem;position: static;margin: .2rem auto .4rem;}
    .advantage-cont li aside i {font-size: .52rem;}
    .advantage-txt {width: 100%;float: none;}
    .advantage-txt h5 {margin-bottom: .2rem;font-size: .22rem;}
    .advantage-cont li:nth-child(2n) em,
    .advantage-cont li:nth-child(2n) aside,
    .advantage-cont li:nth-child(2n) .advantage-txt {float: none;}

    /* produce */
    .produce {margin: .6rem 0;padding: .6rem .2rem;}
    .produce .title {position: static;width: 100%;}
    .produce .swiper {margin: 15px auto 0;width: 75%;}
    .produce .swiper-button-prev,
    .produce .swiper-button-next {top: 5.2rem;width: .6rem;height: .6rem;left: .2rem;}
    .produce .swiper-button-next {left: auto;right: .2rem;}
    .produce .swiper-slide {border-radius: .2rem;margin-bottom: .6rem;height: 6.4rem;}
    .produce .swiper-slide img {border-radius: .2rem .2rem 0 0;}
    .produce-txt {padding: .3rem;bottom: .3rem;border-radius: .2rem;height: 21%;}
    .produce-txt h4 {font-size: .26rem;margin-bottom: .15rem;}

    /* about */
    .about {padding: .5rem 0 1rem; margin: 15px;}
    .about .main {display: block;}
    .about-img {width: 100%;height: 4rem;margin: 0;}
    .about-img span {width: 100%;height: 1.3rem;}
    .about-img em {width: 4rem;height: 4rem;border-radius: .2rem;box-shadow: .4rem .4rem .4rem var(--000-3);}
    .about-img:hover em {box-shadow: .2rem .2rem .2rem var(--000-5);transform: translate(.1rem,.1rem);}
    .about-cont {padding: .5rem .2rem;}
    .about-cont h5 {margin-bottom: .2rem;font-size: .22rem;}
    .about-cont p {word-spacing: -2px;}

    /* provider */
    .provider {padding: .5rem .2rem;}
    .provider .main {display: block;}
    .provider-info {width: 100%;margin: 0;overflow: hidden;}
    .provider-info a {float: left;margin: .5rem 0;font-size: .22rem;font-weight: bold;}
    .provider-info a i {font-size: .3rem;padding: .1rem;}
    .provider-info a span {padding: 0 .2rem;}
    .provider-info p {word-spacing: -2px;}
    .provider-cont {margin: 0;display: grid;grid-template-columns: repeat(4,1fr);grid-gap: .1rem;}
    .provider-cont li {float: none;margin: 0;}
    .provider-cont li a {width: 100%;height: .8rem;border-radius: .1rem;display: flex;align-items: center;justify-content: center;}
    .provider-cont li a:hover {box-shadow: 0 .05rem .1rem var(--000-1);}

    /* employee */
    .employee {padding: .5rem 0;}
    .employee-cont {padding: 0 .6rem;}
    .employee-txt {padding: .2rem;margin: .6rem 0;border-radius: .2rem;height: 3.6rem;}
    .employee-txt em {width: 1.2rem;height: 1.2rem;border: .1rem white solid;margin-top: -.8rem;}
    .employee-txt h5 {font-size: .22rem;padding: .2rem 0;margin-bottom: .2rem;}
    .employee-txt p {font-size: .18rem;word-spacing: -1px;}

    /* foot */
    .foot {margin-top: 1rem;}
    .foot-cont {display: block;padding: .3rem 0;}
    .foot-cont h3 {font-size: .22rem;margin-bottom: .3rem;}
    .foot-support {margin: .3rem 0;}
    .foot-support img {width: 5rem;}
    .foot-sns {width: 100%;}
    .foot-sns ul li a {width: .7rem;height: .7rem;font-size: .4rem;border-radius: .1rem;}
    .foot-copy {padding: .2rem;}
    .top {border-radius: .1rem;}

    /* banner */
    .banner {height: 3rem;padding-top: .9rem;background-position: -11rem 0;}
    .banner h2 {padding: .2rem .2rem;border-radius: .1rem;font-size: .32rem;}

    /* team */
    .team {padding: .5rem .2rem;}
    .team-info h5 {margin: .2rem 0;font-size: .22rem;}
    .team-info p {word-break: break-all;}

    /*journey*/
    .journey-time {height: auto;margin-top: .3rem;}
    .journey-time ul {padding: .8rem .3rem 1rem;}
    .journey-time ul li i {width: .3rem;height: .3rem;}
    .journey-time ul li span {left: -.15rem;top: .5rem;width: .6rem;font-size: .2rem;}
    .journey-cont {padding: .6rem .2rem .2rem;}
    .journey-cont .swiper-slide {margin-bottom: .6rem;border-radius: .2rem;padding: .3rem;}
    .journey-cont .swiper-slide h5 {font-size: .3rem;padding: 0 .1rem;height: .3rem;margin-bottom: .2rem;}
    .journey-cont .swiper-slide ul {padding: 0 .2rem;}
    .journey-cont .swiper-slide ul li {padding: .1rem 0;}

    /* group */
    .group {padding: .5rem 0;}
    .group-cont {display: block;}
    .group-cont li {padding: .2rem;} 
    .group-cont li em {width: 2rem;}
    .group-cont li i {width: 1rem;height: 1rem;font-size: .5rem;margin: .4rem auto;}
    .group-cont li h5 {font-size: .22rem;margin: .2rem 0;}
    .group-cont li p {font-size: .18rem; word-spacing: -1px;word-break: keep-all;}

    /* customer */
    .customer {padding: .5rem .2rem;}
    .customer-info {padding: .3rem 0;}
    .customer-info p {word-spacing: -2px;}
    .customer-data {display: grid;grid-template-columns: repeat(2,1fr);padding: .3rem 0;}
    .customer-data li {padding: 0 .3rem;margin: .2rem 0;}
    .customer-data li:nth-child(2n) {border: 0;}
    .customer-data li h3 {font-size: .6rem;}
    .customer-data li h3 sub {font-size: .18rem;margin-left: .1rem;}
    .customer-data li span {padding-top: .3rem;}
    .customer-brand {padding: .5rem 0;}
    .customer-link {grid-template-columns: repeat(4,1fr);grid-gap: .1rem;padding: .2rem 0;}
    .customer-link li a {border-radius: .1rem;display: flex;align-items: center;justify-content: center;}
    .customer-link li a:hover {box-shadow: 0 .05rem 1rem var(--000-1);}

    /*product*/
    .product {padding: .5rem 0;}
    .product-cont li {margin: .6rem 0;}
    .product-cont li em {width: 80%;float: none;display: block;margin: auto;}
    .product-cont li:nth-child(2n) em {float: none;margin: auto;}
    .product-txt {width: 100%;display: block;text-align: center;}
    .product-txt h4 {margin: .4rem 0;border-left: .05rem var(--color) solid;padding-left: .2rem;text-align: left;font-size: .22rem;}
    .product-txt a {margin: .5rem auto;width: 50%;}
    .product-txt p {word-spacing: 1px; word-break: break-all;}

    /* game */
    .game {padding: .5rem .2rem;}
    .game-cont p {word-break: break-all;}

    /* article */
    article {}
    article ul {padding: .2rem .4rem;border-radius: .2rem;}
    article img {border-radius: .2rem;}
    article h4 {font-size: .26rem;margin: .2rem 0;}
    article h5 {font-size: .22rem;border-left: .05rem var(--color) solid;padding: 0 .1rem;margin: .2rem 0;}
    article h6 {font-size: .2rem;margin: .1rem 0;}

    /* contact */
    .contact {padding: .5rem .2rem;}

    .map iframe {height: 6rem;}

     /* cooperation */
    .cooperation {padding-top: .5rem;margin-top: .5rem;}
    .cooperation .cause-from {width: 100%;}

    /* cause */
    .cause {padding-top: 1.4rem;margin-top: 1.4rem;}
    .cause .main {display: block;}
    .cause h3 {line-height: .64rem;font-size: .64rem;top: -2.1rem;left: .2rem;}
    .cause h4 {font-size: .3rem;padding: .15rem .2rem;border-radius: 0 0 .1rem .1rem;top: -1.4rem;left: .2rem;}
    .cause-cont {margin: 0;padding: 0 .2rem .4rem;}
    .cause-cont li {padding: .15rem 0;font-size: .2rem;}
    .cause-cont li i {font-size: .36rem;}
    .cause-cont li b {width: 1.4rem;margin: 0 .2rem;}
    .cause-from {width: 100%;padding: .2rem;border-radius: .2rem .2rem 0 0;}
    .cause-from li {float: none;padding: .1rem 0;}
    .cause-from li:nth-child(-n+4) {width: 100%;}
    .cause-from li a {width: 100%;height: .8rem;}
    .cause-from li textarea {height: 2rem;}

    /* service */
    .service {padding: .5rem .2rem;}
    .service-cont p {word-break: break-all;}

    /* form */
    input,
    textarea {border-radius: .05rem;}
    input {font-size: .2rem;}
    
    /*company*/
    .company {padding: .5rem 0;}
    .company-cont {padding: .2rem 0;}
    .company-cont img {border-radius: .2rem;margin: .1rem auto;}
    .company-cont h5 {font-size: .3rem;}
    .company-cont p {padding: .1rem 0;word-break: break-all;}
    
    /*join*/
    .join {padding: .5rem 0;}
    .join-cont {padding: .2rem 0;}
    .join-cont p {padding: .1rem 0; word-break: break-all;}
    .join-cont img {margin: .1rem 0;border-radius: .2rem;}
    .join-list {padding: .2rem 0;}
    .join-list fold-title {padding: .2rem 0;}
    .join-list fold-title h5 {font-size: .24rem;}
    .join-list fold-title span {padding: 0 .2rem;}

    /*contact*/
    .contact {word-break: break-all;}
}