body{padding: 10px 10px 0 10px;}
.main{width: 100%;}

header{padding: 10px; box-sizing: border-box;}
header .logo img{height: 30px;}
header .menu{display: none;}
header .mobile-menu{display: block;}
header .mobile-menu i{font-size: 30px; color: #353535;}
header .mobile-menu .close{display: none;}

.header_blank{height: 50px;}

.home{background: #FDCD33;}
.home_blank{height: 50px;}

.banner{height: auto; border-radius: 10px; overflow: hidden;}

.mobile-menu-list{display: block; height: calc(100vh - 50px); z-index: 999; position: fixed; left: 100%; bottom: 0; right: 0; box-sizing: border-box; background: #FFFFFF; padding: 20px; transition: all 0.3s; overflow: hidden;}
.mobile-menu-list .item{border-bottom: 1px solid #ccc; display: flex; align-items: center; justify-content: space-between; padding: 20px 0;}
.mobile-menu-list.active{left: 0;}

.mobile_nav{display: flex; align-items: center; justify-content: space-between; margin-top: 20px; padding: 20px; box-shadow: -3px 22px 31px 1px rgba(0,0,0,0.07);}
.mobile_nav .pic{display: flex; align-items: center; justify-content: center;}
.mobile_nav .pic img{width: 70px;}
.mobile_nav .name{width: 70px; padding-top: 5px; font-weight: bold;}

.shop{display: none;}

.follow{display: block; padding: 0px 20px 20px; box-shadow: -3px 22px 31px 1px rgba(0,0,0,0.07); margin-top: 20px; margin-bottom: 20px;}
.follow .title::after{content: "FOLLOW US"; color: #FFF5DF;}
.follow .content{padding-top: 30px; display: flex; justify-content: space-between;}
.follow .content .item{text-align: center; padding: 0 10px;}
.follow .content .item img{width: 100%;}
.follow .content .item .name{padding-top: 5px;}

.mobile_contact{display: block; padding: 0px 20px 20px; box-shadow: -3px 22px 31px 1px rgba(0,0,0,0.07); margin-bottom: 20px;}
.mobile_contact .title::after{content: "CONTACT US"; color: #FFF5DF;}
.mobile_contact .content{padding-top: 30px; color: #6E291B;}
.mobile_contact .content a{color: #6E291B;}
.mobile_contact .content .li{padding-bottom: 5px;}
.mobile_contact .content .li i{padding-right: 8px; font-weight: bold;}

.title{padding-top: 30px; font-size: 20px;}

.brand{height: auto; background-size: 100% auto; background: url("../images/mobile/brand_bg.png") repeat-y center top; margin-bottom: 20px; border-radius: 10px;}
.brand .content{display: block; padding-top: 30px;}
.brand .content .pic{padding: 0 20px;}
.brand .content .pic img{width: 100%;}
.brand .content .text{padding: 20px;}

.total{border-radius: 10px; background-image: url("../images/mobile/total_bg.png"); margin-bottom: 20px;}
.total .content{padding: 0 15px;}
.total .content .item{padding: 0; font-size: 16px;}
.total .content .item .num{font-size: 20px;}

.development{background-image: url("../images/mobile/development_bg.png"); border-radius: 10px;}
.development .content{background:url("../images/mobile/development_line.png?v=1") no-repeat center 40px; background-size: 129px auto; font-size: 14px; height: 1660px;}
.development .content .item{width: 350px; left: 50%; transform: translateX(-50%);}
.development .content .item .text{padding: 10px;}
.development .content .item .year{width: 142px;}
.development .content .item .icon{height: 38px;}
.development .content .item .icon img{width: 38px;}
.development .content .it1{top: 68px;}
.development .content .it1 .text{width: 122px;}
.development .content .it2{top: 204px;}
.development .content .it2 .text{width: 134px;}
.development .content .it3{top: 365px;}
.development .content .it3 .text{width: 145px;}
.development .content .it4{top: 536px;}
.development .content .it4 .text{width: 192px;}
.development .content .it5{top: 690px;}
.development .content .it5 .text{width: 90px;}
.development .content .it6{top: 852px;}
.development .content .it6 .text{width: 112px;}
.development .content .it7{top: 1060px;}
.development .content .it7 .text{width: 166px;}
.development .content .it8{top: 1204px;}
.development .content .it8 .text{width: 166px;}
.development .content .it9{top: 1322px;}
.development .content .it9 .text{width: 116px;}
.development .content .it10{top: 1572px;}
.development .content .it10 .text{width: 90px;}

.culture{margin-bottom: 20px; border-radius: 10px;}
.culture .content{display: block; padding: 20px 10px;}
.culture .vision{font-size: 16px;}
.culture .vision .item .name{width: auto; white-space: nowrap;}
.culture .profile{display: none;}
.culture .profile img{width: 100%;}
.culture .mobile{display: block;}

.story{height: auto; border-radius: 10px;}
.story .content{padding: 20px 0; margin-top: 30px; border-top: 1px solid #FFFFFF;}
.story .content .description{margin: 0 10px; padding: 10px; border-radius: 10px; font-size: 16px; text-align: left; line-height: 28px;}
.story .content .con{display: block; padding-top: 20px;}
.story .content .it1{padding: 0 10px; height: auto; margin-bottom: 0;}
.story .content .item{width: auto; position: relative;}
.story .content .item img{width: 100%; position: relative;}
.story .content .text{width: auto; padding: 0 10px; line-height: 24px;}
.story .content .tx1 .pic{padding: 20px 0;}

footer{margin: 0 -10px; padding: 10px 20px;}

.product .slide{min-width: auto;}
.product .slide img{border-radius: 10px;}
.product .cate{padding-top: 20px; padding-bottom: 26px;}
.product .cate .name{font-size: 20px;}
.product .cate .ename{font-size: 22px; top: 28px;}
.product .content{margin: 0 -5px; padding-bottom: 20px;}
.product .content .item{margin: 5px; width: calc(100%/2 - 10px);}
.product .content .item .pic{height: auto;}

.pro_detail{height: auto; background: #ffffff url("../images/mobile/pro_bg_top.png") no-repeat right top; background-size: 300px auto; position: relative; border-radius: 10px;}
.pro_detail::after{content: ""; background: #ffffff url("../images/mobile/pro_bg_bottom.png") no-repeat left bottom; background-size: 100% auto; position: absolute; width: 100%; height: 100px; bottom: 0; border-radius: 10px;}
.pro_detail .close{top: 12px; right: 12px;}
.pro_detail .content{padding: 76px 0 0; display: block;}
.pro_detail .content .pic{width: 350px; margin: 0 auto;}
.pro_detail .content .pic .plist{width: 60px; height: 280px;}
.pro_detail .content .pic .plist .swiper-slide{height: 60px; margin-bottom: 10px;}
.pro_detail .content .pic .plist .item{height: 60px; width: 60px;}
.pro_detail .content .pic .big{margin-left: 10px; width: 280px; height: 280px;}
.pro_detail .content .con{width: 350px; margin: 0 auto; padding: 20px 0;}
.pro_detail .content .con .name{font-size: 24px;}
.pro_detail .content .con .text{font-size: 16px; height: 172px; overflow-x: auto; margin-bottom: 80px;}

.store{padding-bottom: 20px; border-radius: 10px;}
.store .content{padding: 30px 5px 0;}
.store .content .item{margin: 5px; width: calc(100%/2 - 10px)}
.store .content .item img{width: 100%;}

.cooperate .slide{min-width: auto;}
.cooperate .slide img{border-radius: 10px;}
.franchise .desc{padding-top: 20px;}
.qualifications{padding-top: 20px; display: block;}
.qualifications .item{display: flex; align-items: center; width: 100%; box-sizing: border-box; padding: 20px 15px; margin-bottom: 15px;}
.qualifications .item .icon{width: 60px; height: 60px; margin: 0;}
.qualifications .item .line{height: 60px; width: 1px; margin: 0 15px;}
.qualifications .item .text{flex: 1; padding-top: 0; line-height: 30px;}

.step{padding-bottom: 80px;}
.step .con{padding-top: 50px;}
.step-con{display: none;}
.step-con-mobile{display: flex; padding-top: 100px;}
.step-con-mobile .step-con-left{flex: 1; position: relative;}
.step-con-mobile .item{padding: 15px; background: #FFFFFF; box-shadow: 0px 10px 25px 0px rgba(0,0,0,0.1); border-radius: 10px; position: absolute; right: 10px; width: 128px; box-sizing: border-box;}
.step-con-mobile .item::after{content: ""; width: 0px; height: 0px; border: 15px solid transparent; border-left-color: #ffffff; position: absolute; top: 50%; transform: translateY(-50%); filter: drop-shadow(0px 5px 5px rgba(0,0,0,0.1)); right: -26px;}
.step-con-mobile .item .tit{font-size: 18px; font-weight: bold; text-align: center;}
.step-con-mobile .item .text{font-size: 14px; padding-top: 8px; line-height: 20px;}
.step-con-mobile .it1{top: -63px; right: 0;}
.step-con-mobile .it2{top: 10px; left: 10px;}
.step-con-mobile .it3{top: 202px; right: -5px;}
.step-con-mobile .it4{top: 242px; left: 5px;}
.step-con-mobile .it5{top: 413px; right: -5px;}
.step-con-mobile .it6{top: 470px; left: -2px;}
.step-con-mobile .it7{top: 696px; right: -12px;}
.step-con-mobile .it8{top: 760px; left: 0;}
.step-con-mobile .it9{top: 948px; right: -14px;}
.step-con-mobile .step-con-right{flex: 1; position: relative;}
.step-con-mobile .step-con-right .item::after{border-left-color: transparent; border-right-color: #ffffff; right: 0; left: -26px;}
.step-con-mobile .step-con-pic{width: 80px; padding: 0 10px; position: relative;}
.step-con-mobile .step-con-pic img{width: 100%;}
.step-con-mobile .step-con-pic .num{position: absolute; inset: 0;}
.step-con-mobile .step-con-pic .num .li{width: 30px; height: 30px; background: #fecd33; border-radius: 15px; color: #FFFFFF; font-style: italic; display: flex; justify-content: center; align-items: center; text-indent: -3px; font-weight: bold; font-size: 14px; position: absolute;}
.step-con-mobile .step-con-pic .num .li1{left: 15px; top: 2px;}
.step-con-mobile .step-con-pic .num .li2{right: 5px; top: 66px;}
.step-con-mobile .step-con-pic .num .li3{left: 22px; top: 238px;}
.step-con-mobile .step-con-pic .num .li4{right: 12px; top: 290px;}
.step-con-mobile .step-con-pic .num .li5{left: 22px; top: 469px;}
.step-con-mobile .step-con-pic .num .li6{right: 18px; top: 540px;}
.step-con-mobile .step-con-pic .num .li7{left: 28px; top: 762px;}
.step-con-mobile .step-con-pic .num .li8{right: 15px; top: 828px;}
.step-con-mobile .step-con-pic .num .li9{left: 32px; top: 1014px;}

.mode .content{padding-top: 155px;}
.mode .content .top{width: 200px; right: 0; top: 30px;}
.mode .content .item{margin: 0 0 20px 0 !important;}
.mode .content .item .tit{padding: 10px 15px;}
.mode .content .item .con .odd{width: 120px; padding: 10px 15px;}
.mode .content .item .con .even{width: calc(100% - 140px); padding: 10px 15px;}
.mode .content .item .con .text{display: block;}
.mode .content .item .con .text .more{width: 100%;}
.mode .content .fpic{padding-top: 0;}
.mode .content .fpic img{width: 100%;}

.support .content{padding-top: 30px;}
.support .content .text{padding: 20px 0; display: block; background-size: 100% auto; background-image: url("../images/mobile/support_bg.png");}
.support .content .text .li{width: 100%;}
.support .content .text .li .item .tit{padding-bottom: 10px;}
.support .content .text .li .item .con{padding-bottom: 20px; line-height: 1.7;}
.support .content .icon{display: block; width: 80%; margin: 0 auto;}

.qa .content{padding-top: 30px;}
.qa .item{padding-top: 15px; padding-bottom: 15px;}
.qa .item .questions .con{font-size: 18px;}

.apply .content{padding-top: 30px; padding-bottom: 20px;}
.apply .content .btn{margin: 0 auto;}

.contact{width: auto; margin: 0 0 20px 0 !important; padding: 15px;}
.contact .content{display: block;}
.contact .con .tit{padding: 10px 0; font-size: 20px;}
.contact .con .item{padding: 10px 0;}
.contact .map{width: 100%; margin-top: 20px;}