*{padding: 0;margin: 0;border: 0;outline: none;font-size: 16px;font-family: -apple-system, "Yu Gothic";font-weight: 500;color: #000;font-style: normal;text-decoration: none;box-sizing: border-box;list-style: none;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-webkit-appearance: none;appearance: none}
.bold{font-family: -apple-system, "Yu Gothic bold";font-weight: 600}
html,body{-webkit-text-size-adjust: 100% !important;text-size-adjust: 100% !important;touch-action: manipulation}
.header-box{width: 100%;height: 80px}
.header{width: 100%;height: 80px;background: #0145f2;overflow: hidden;position: fixed;top: 0;z-index: 99}
.header-content{margin: 0 auto;max-width: 1420px;position: relative;height: 100%;overflow: hidden}
.logo{width: 190px;position: absolute;top: 50%;transform: translate(0,-50%)}
.header-btns{display: flex;position: absolute;top: 50%;transform: translate(0,-50%);right: 0}
.header-btns p{display: inline-block;background: #fff;color: #0145f2;padding: 10px 28px;border-radius: 30px;font-size: 14px;font-weight: 600;cursor: pointer;transition: .2s;margin-left: 12px}
.header-btns .consult-btn{background: #fecc00;color: #333}
.menu{display: flex;color: #fff;margin:26px 0 0 252px;position: relative}
.menu p{font-weight: 600;cursor: pointer;transition: .2s;color: #fff;margin-right: 2vw}
.menu span{display: block;height: 4px;background: #fecc00;border-radius: 6px;position: absolute;top: 30px;transition: .3s;width: 0}
.menu-here{color: #fecc00}
.banner{width: 100%;height: 660px;background: linear-gradient(60deg, #eff6ff,#eae6ff);overflow: hidden}
.banner-content{margin: 0 auto;max-width: 1420px;position: relative;height: 100%}
.banner-tab{display: inline-block;background: rgba(255,255,255,.8);width: auto;margin-top: 70px;border-radius: 30px}
.banner-tab p{float: left;border-radius: 30px;padding: 9px 30px;cursor: pointer;font-size: 14px;transition: .2s}
.banner-tab-here{background: #0145f2;color: #fff !important}
.banner-content-left{transition: 1s;margin-left: 10px}
.slogen{margin: 30px 0 0 6px;height: 140px;overflow: hidden}
.slogen p{font-size: 50px;line-height: 1.4}
.slogen-des{margin: 20px 0 0 6px;overflow: hidden;height: 60px}
.slogen-des p{font-size: 18px;line-height: 1.8;color: #555}
.banner-btns{width: 300px;margin-top: 40px}
.banner-btns p{background: #fff;font-size: 17px;text-align: center;padding: 14px 0;margin-bottom: 14px;border-radius: 30px;cursor: pointer;font-weight: 600;transition: .2s}
.banner-btns .see-more-btn{background: #0145f2;color: #fff}
.slogen-big-box,.slogen-des-box{transition: .3s}
.banner-tel{text-align: center;width: 300px;line-height: 1.5}
.banner-tel p{font-size: 15px;color: #666;padding-top: 8px}
.banner-tel a,.banner-tel a i{font-size: 20px;letter-spacing: 1px;color: #222;transform: .2s}
.banner-tel i{padding-left: 6px}
.banner-main{position: relative;z-index: 1}
.shade-box{position: absolute;z-index: 2;width: 634px;height: 50px;right: 10px;pointer-events: none}
.shade-top{top: 0;background: linear-gradient(#eff6ff, transparent)}
.shade-bottom{bottom: 0;background: linear-gradient(to top, #eff6ff, transparent)}
.scroll-box1{position: absolute;top: 0;right: 10px}
.scroll-box2{position: absolute;top: 0;right: 230px}
.scroll-box3{position: absolute;top: 0;right: 450px}
.box{width: 194px;height:660px;border:1px solid #eee;overflow:hidden;transition: .8s}
.wrap{will-change: transform}
.item{height:360px;justify-content:center}
.item img{width: 194px;height: 260px;border-radius: 8px;display: block;transition: .2s}
.item p{width: 100%;height: 72px;border-radius: 8px;background: #fff;margin-top: 10px;overflow: hidden;line-height: 1.4;transition: .2s}
.item p b{padding: 14px 14px 0 14px;display: block;color: #333;font-weight: 600}
.item span{color: #666;padding: 0 14px;font-size: 13px;display: block}
.page-content{width: 100%;max-width: 1420px;margin: 0 auto}
.page-title{width: 100%;line-height: 1.5;overflow: hidden;position: relative;transition: .9s}
.page-title b{font-size: 40px;display: block;font-weight: 600;padding: 0 0 10px 20px;line-height: 1.2}
.page-title span{font-size: 17px;color: #666;padding-left: 20px;font-weight: 500}
.page-title i{background: #0145f2;display: block;width: 6px;height: 64px;border-radius: 4px;position: absolute;left: 0;top: 50%;transform: translate(0,-50%)}
.page-title-row i{top: 40%;height: 80px}
.page-about{width: 100%;position: relative;padding: 60px 0}
.about-content{display: flex}
.about-text{padding-top: 30px;flex: 1;line-height: 2.2;transition: 1s}
.about-imgs{margin-right: 60px;display: none}
.about-imgs img{width: 410px}
.about-tab{display: flex;padding-top: 30px}
.about-tab p{background: #fecc00;color: #000;display: inline-block;padding: 15px 32px;font-size: 14px;border-radius: 30px;transition: .4s;line-height: 1;cursor: pointer;margin-right: 14px}
.left-hide{transform: translate(50px,0);opacity: 0}
.right-hide{transform: translate(-50px,0);opacity: 0}
.top-hide{transform: translate(0,50px);opacity: 0}
.bottom-hide{transform: translate(0,-50px);opacity: 0}
.is-hide{transform: translate(20px,0);opacity: 0}
.blue-content{background: #eff6ff;width: 100%;overflow: hidden;padding-bottom: 60px}
.grey-content{background: #f7f8fa;width: 100%;overflow: hidden;padding-bottom: 60px;position: relative;}
.topic-content{display: flex;margin-top: 40px}
.page-topic{width: 100%;padding: 60px 0 50px}
.page-reason{width: 100%;padding: 60px 0 36px}
.doubt-img{width: 320px;position: relative;transition: 1s}
.doubt-img img{width: 170px;position: absolute;margin-left: 80px}
.topic-list{display: flex;flex-wrap: wrap;justify-content: space‑between;width: 80%;flex: 1;margin-top: 20px}
.topic-list li{width: calc((100% - 42px) / 3);background: #fff;border-radius: 10px;display: flex;padding-bottom: 18px;transition: .8s;margin: 0 0 14px 14px}
.topic-list li p{width: 30px;margin: 20px 0 0 20px}
.topic-list li p i{color: #d7614f;height: 30px;background: #ffe8e8;display: block;width: 30px;border-radius: 50%;text-align: center;line-height: 1.8}
.topic-list li div{margin: 18px 20px 0 10px}
.topic-list li div b{display: block;padding-bottom: 6px}
.topic-list li div span{line-height: 1.4;font-size: 14px;display: block;color: #666}
.feature-slogen{width: 100%;background: #f8fbff;margin: -12px auto 0;border-radius: 10px;overflow: hidden;position: relative;z-index: 2;border: 1px solid #ddd}
.feature-slogen b{color: #0145f2;padding: 18px 0 0 20px;display: block;font-size: 28px;transition: .7s}
.feature-slogen p{color: #555;padding: 8px 20px 18px;transition: .8s}
.page-advantage-title{padding: 60px 0 38px}
.page-operate-title{padding: 10px 0 38px}
.page-advantage{display: flex;flex-wrap: wrap;justify-content: space‑between;margin: 0 -8px 50px}
.page-advantage li{width: calc((100% - 64px) / 4);border: 1px solid #e3e8f0;border-radius: 10px;transition: .6s;margin: 0 8px 16px}
.page-advantage li div{margin: 30px auto 0;width: 66px;height: 66px}
.page-advantage li div img{width: 100%;height: 100%}
.page-advantage li b{display: block;line-height: 1.2;text-align: center;font-size: 18px;padding: 8px 0 12px}
.page-advantage li p{display: block;padding: 0 24px;color: #666;font-size: 15px;padding-bottom: 22px;line-height: 1.7}
.page-content-width{max-width: 1420px}
.reason-page-title{max-width: 1420px;margin: 0 auto}
.container{position: relative;display: flex;margin-top: 10px}
.container .swiper {position: relative;overflow: hidden}
.container .swiper-wrapper {display: flex;box-sizing: content-box;transition-property: transform;width: 100%;height: 100%}
.container .swiper-slide{flex-shrink: 0;display:flex;border-radius:8px;background: #fff;overflow: hidden;transition: .5s}
.reason-li{padding-bottom: 40px}
.reason-li img{width: 46px;height: 46px;border-radius: 50%;margin: 30px 0 0 30px}
.reason-li b{display: block;padding: 10px 30px 4px;font-size: 18px}
.reason-li span{display: block;padding: 8px 30px 16px;line-height: 1.3}
.reason-li div{padding: 0 30px}
.reason-li div *{font-size: 15px}
.reason-li div i{padding-right: 6px;color: #0145f2}
.reason-li div p{line-height: 2;color: #666}
.container .swiper-button{width: 30px;position: absolute;height: 260px;cursor: pointer}
.container .swiper-button i{position: absolute;top: 150px;font-size: 54px;width: 100%;left: -16px;color: #ccc}
.container .swiper-button-prev{left: -30px}
.container .swiper-button-next{right: -30px}
.container .swiper-button-next i{transform: rotateY(180deg);left: 18px}
.replacemen-title{padding: 60px 0 34px}
.replacemen-content{overflow: hidden;display: flex;padding-bottom: 50px;margin: 0 -9px}
.replacemen-content li{width: 50%;border-radius: 10px;border: 1px solid #e3e8f0;background: #fcfcfc;transition: .6s;margin: 0 9px}
.replacemen-box{padding: 0 28px}
.replacemen-box b{display: block;padding: 20px 0 16px;border-bottom: 1px solid #e3e8f0;font-size: 18px}
.replacemen-box span{display: block;padding: 20px 0 18px;line-height: 1.5}
.replacemen-box div{padding-bottom: 26px;line-height: 2}
.replacemen-box div p{color: #666;font-size: 15px}
.replacemen-box div p i{padding-right: 6px;color: #0145f2}
.replacemen-here{background: #eff6ff !important}
.hide{opacity: 0}
.comment-content{width: 100%;background-image: url("../images/bg.jpg");background-repeat: no-repeat;background-size: cover;background-position: center;background-attachment: fixed}
.comment-grey-content{width: 100%;height: 100%;background: url("../images/grey.png")}
.comment-main{max-width: 1420px;margin: 0 auto;padding: 60px 0 36px;overflow: hidden}
.comment-main .page-title b{color: #fff;text-shadow: 1px 1px 0 #000}
.comment-main .page-title span{color: #eee;text-shadow: 1px 1px 0 #000}
.comment-list{display: flex;margin: 30px -10px 0;flex-wrap: wrap;justify-content: space‑between}
.comment-list li{width: calc((100% - 80px) / 4);background: #fff;border-radius: 10px;overflow: hidden;transition: .9s;margin: 0 10px}
.comment-img{width: 100%}
.comment-box{padding: 12px 20px 20px}
.comment-box b{font-size: 18px;display: block}
.comment-box span{display: block;padding: 4px 0;color: #888;font-size: 14px}
.comment-box p{font-size: 15px}
.comment-box i{margin-top: 20px;display: inline-block;font-size: 12px;border: 1px solid #ddd;padding: 2px 10px;border-radius: 3px;color: #666}
.scroll-wrap{width: 100%;overflow: hidden;border-radius: 8px;transition: 1s}
.scroll-track{display: flex;will-change: transform}
.scroll-item{flex: 0 0 calc((100% - 60px) / 4);margin-right: 20px;background: #f5f5f5;border-radius: 8px;font-size: 24px;padding-bottom: 20px}
.comment-scroll-box{padding: 14px 20px 4px}
.comment-scroll-box b{display: block;color: #333;font-size: 17px;padding-bottom: 4px}
.comment-scroll-box span i{font-size: 14px;color: #f60;padding-right: 2px}
.comment-scroll-box p{display: inline;font-size: 15px;font-weight: 600;padding-left: 2px}
.comment-scroll-text{padding: 0 20px;color: #666;line-height: 1.3;display: block}
.comment-des-title{color: #fff;font-size: 22px;text-shadow: 1px 1px 0 #000;padding: 30px 0 26px 10px}
.page-support-title,.page-question-title,.page-pricing-title,.page-flow-title,.page-assist-title{padding: 60px 0 30px}
.support-list{display: flex;flex-wrap: wrap;justify-content: space‑between;overflow: hidden;margin: 0 -9px}
.support-list li{width: calc((100% - 36px) / 2);border: 1px solid #e3e8f0;border-radius: 10px;display: flex;overflow: hidden;transition: .9s;margin: 0 9px 18px}
.support-list li p{width: 120px;background: #f2f6fd;position: relative}
.support-list li p img{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);width: 50px}
.support-list li div{padding: 20px;flex: 1}
.support-list li div b{display: block;font-size: 18px;padding-bottom: 6px}
.support-list li div span{display: block;line-height: 1.4}
.question-list{width: 100%;padding-bottom: 60px;overflow: hidden}
.question-list li{width: 100%;border-bottom: 1px solid #d5dde9;overflow: hidden;padding: 8px 0;height: 66px;position: relative;transition: .6s;cursor: pointer}
.question-list li dl{width: 100%;overflow: hidden}
.question-list li dl dt,.question-list li dl dd{display: flex;height: 44px;line-height: 3.2}
.question-list li dl dt p,.question-list li dl dd p{width: 60px;padding-left: 10px;color: #0145f2}
.question-list li dl dd p{color: #01cf11}
.question-list li dl span{display: block;flex: 1}
.question-list li dl dd span{font-size: 14px;color: #666}
.question-list li dl dt i{position: absolute;right: 10px;font-size: 20px;color: #ccc;top: 0;cursor: pointer}
.question-list li dl *{line-height: 3.6}
.open-answer{height: 110px !important}
.open-answer .iconfont{transform: rotateX(180deg)}
.page-contact{width: 100%;background: #0145f2;color: #fff;overflow: hidden;position: relative;padding-bottom: 40px}
.page-contact-bg{width: 720px;height: 720px;border-radius: 50%;background: rgba(255,255,255,.08);position: absolute;z-index: 0;left: 50%;transform: translate(-50%,0);top: -360px}
.page-contact-main{position: relative;z-index: 1;text-align: center;overflow: hidden}
.center-title{font-size: 40px;color: #fff;padding: 60px 0 30px;display: block;transition: .9s}
.bottom-contact-btns{width: 800px;display: flex;margin: 0 auto;transition: .9s}
.bottom-contact-btns p,.bottom-contact-btns a{background: #fff;color: #0145f2;width: 50%;border-radius: 40px;padding: 16px 0;font-size: 18px;cursor: pointer;transition: .2s;margin: 0 15px}
.bottom-contact-btns .yellow-bg{background: #fecc00;color: #000}
.contact-tips{position: relative;width: 600px;margin: 0 auto;text-align: center;transition: .9s}
.contact-tips p{display: inline-block;text-align: center;color: #fff;padding: 30px 20px;position: relative;z-index: 2}
.contact-tips::before{content:"";border-top: 1px solid #fff;width: calc(50% - 220px);position: absolute;top: 50%;left:0;transform: translateY(-50%);z-index:1}
.contact-tips::after{content:"";border-top: 1px solid #fff;width: calc(50% - 220px);position: absolute;top: 50%;right:0;transform: translateY(-50%);z-index:1}
.customer-service-list{width: 628px;margin: 0 auto;display: flex;transition: .9s}
.customer-service-list li{width: 50%;margin: 0 30px}
.back-home-btn{position: absolute;color: #fff;top: 50%;left: 1vw;font-size: 23px;transform: translate(0,-50%);cursor: pointer;}
.back-home-btn:hover{color: #ffd21c;}
.customer-service-list{width: 314px}
.customer-service-list li{width: 100%;}
.customer-service-li{padding-bottom: 8px}
.customer-service-list .customer-service-li *{color: #fff;font-size: 18px}
.customer-service-list .customer-service-li i{padding-right: 8px}
.customer-service-qr{width: 100%;display: flex}
.customer-service-qr p{text-align: center;margin: 0 12px}
.customer-service-qr p img{width: 130px;display: block;margin: 0 auto}
.customer-service-qr p span{display: block;text-align: center;color: #fff;line-height: 2.4}
.customer-service-tel{color: #fff;border-top: 1px dotted rgba(255,255,255,.4);border-bottom: 1px dotted rgba(255,255,255,.4);padding: 12px 0;margin-top: 6px;display: block}
.customer-service-tel i{color: #fff;padding-right: 6px}
.customer-service-tips{font-size: 13px;color: #ddd;padding-top: 22px;transition: .9s}
.footer{width: 100%;background: #14161b;overflow: hidden}
.page-footer{max-width: 1260px;margin: 0 auto;padding-top: 40px}
.page-footer dl{display: flex;border-bottom: 1px dotted #666;padding-bottom: 30px}
.page-footer dt{width: 340px}
.page-footer dt *{color: #888}
.page-footer dt .bold{color: #fff}
.footer-logo{display: flex;overflow: hidden}
.footer-logo img{width: 48px;border-radius: 8px;height: 48px}
.footer-logo-text{padding: 4px 0 0 16px;line-height: 1.4}
.footer-slogen{line-height: 1.8;padding-top: 16px;font-size: 14px}
.page-footer dd{flex: 1}
.page-footer dd ul{display: flex;float: right}
.page-footer dd ul li{line-height: 2;margin-left: 3vw}
.page-footer dd ul li b{color: #fff;display: block;padding-bottom: 4px}
.page-footer dd ul li span{color: #888;display: block;cursor: pointer}
.page-footer dd ul li a{color: #888;cursor: pointer}
.footer-bottom-text{display: flex;padding: 20px}
.footer-bottom-text p{color: #888;font-size: 15px}
.footer-bottom-text span{color: #666;text-align: right;display: block;flex: 1}
.create-mail-content{position: fixed;z-index: 100;width: 100%;height: 100%;top: 0;left: 0;display: none}
.create-mail-bg{cursor: pointer;position: absolute;width: 100%;height: 100%;z-index: 0;background: rgba(0, 0, 0, .3)}
.create-mail-main{width: 460px;background: #fff;z-index: 1;position: absolute;top: 49%;left: 50%;transform: translate(-50%, -50%);border-radius: 8px;overflow: hidden;padding-bottom: 23px}
.mail-title{width: 100%;text-align: center;font-size: 18px;padding: 22px 0 0;text-shadow: 1px 1px 0 #fff}
.create-mail-main dl{padding: 20px 32px 4px}
.create-mail-main dl dt i{font-size: 13px;padding-left: 6px;color: #0084cf}
.create-mail-main dl dd{padding: 8px 0 14px}
.create-mail-main dl dd input,.create-mail-main dl dd select{border-radius: 3px;border: 1px solid #ccc;height: 40px;width: 100%;padding-left: 14px;box-shadow: 0}
.create-mail-main dl dd input:focus,.create-mail-main dl dd select:focus{border: 1px solid #0084cf;box-shadow: 0 0 10px #b9e6ff}
.create-mail-btns{text-align: center}
.create-mail-btns p{display: inline-block;background: #f2f2f2;border-radius: 4px;padding: 8px 26px;margin: 0 4px;cursor: pointer;transition: .1s;font-size: 15px}
.create-mail-btns .create-mail-submit{background: #0145f2;color: #fff}
.tips-content{background: rgba(0,0,0,.7);color: #fff;z-index: 999;position: fixed;top: 48%;left: 50%;transform: translate(-50%,-50%);padding: 12px 30px;border-radius: 8px;display: none;font-size: 15px}
.header-btns .wap-menu-btn{display: none}
.header-btns .wap-hide{display: none}
.wap-banner{width: 100%;overflow: hidden;background: #0145f2;padding: 0 0 16px;opacity: 0;position: absolute;top: -999px;pointer-events: none;}
.wap-swiper{width: 100%;overflow: hidden}
.wap-swiper .swiper-wrapper{display: flex;transition-timing-function: linear !important}
.wap-swiper .swiper-slide{flex-shrink: 0;color: #fff;font-size:20px;line-height: 0}
.wap-swiper .swiper-slide img{display: block;width: 100%;border-radius: 6px 6px 0 0}
.wap-swiper .swiper-slide div{width: 100%;background: #fff;border-radius: 0 0 6px 6px;line-height: 1.3;padding: 8px}
.wap-swiper .swiper-wrapper .swiper-slide b{font-weight: 600;display: block;font-size: 14px;padding: 1px 0 2px;color: #000}
.wap-swiper .swiper-wrapper .swiper-slide span{display: block;height: 28px;font-size: 12.5px;color: #555;line-height: 1.1}
.float-part-right{position: fixed;right: -44px;width: 44px;line-height: 0;bottom: 150px;border-radius: 8px 0 0 8px;overflow: hidden;transition: .5s;z-index: 100}
.float-part-right a{height: 44px;background: #0145f2;text-align: center;color: #fff;line-height: 2.2;cursor: pointer;font-size: 20px;transition: .3s;display: block}
.float-part-right .icon-icophone{background: #01cf11}
.float-part-right .icon-fanhuidingbu{background: #f60}
.float-part-right a:hover{opacity: .9}
.wap-menu-content{width: 100vw;height: 100vh;position: fixed;top: 0;right: 0;z-index: 100;display: none;transition: .5s}
.wap-menu-bg{position: absolute;z-index: 0;width: 100%;height: 100%;top: 0;left: 0}
.wap-menu-main{position: absolute;width: 190px;height: calc(100vh - 48px);background: #0145f2;right: 0;top: 48px}
.wap-menu-main p{width: 100%;text-align: center;color: #fff;padding: 20px 0 10px}
.wap-menu-main .nav-here{color: #fecc00;font-weight: 600}
.wap-menu-style{right: -170px}
.goto-info-btn{color: #1165b8;display: block;font-size: 18px;padding-left: 20px;padding-top: 4px;font-weight: 600;}
.confirm-mask{position: fixed;top:0;left:0;width: 100%;height: 100%;background: rgba(0,0,0,0.55);z-index: 9999;display: none}
/* 弹窗盒子 */
.confirm-box{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);background: #ffffff;border-radius: 12px;width: 300px;max-width: 420px;overflow: hidden}
.confirm-text{padding: 32px 24px;text-align: center;font-size: 16px;color: #333;line-height: 1.6}
.confirm-btn-wrap{display: flex;border-top: 1px solid #eee;}
.confirm-btn{flex: 1;text-align: center;padding:14px 0;font-size:16px;border: none;background: #fff;cursor: pointer}
.confirm-cancel{color:#666;border-right:1px solid #eee}
.confirm-ok{color:#0145f2}
.confirm-btn:active{background:#f5f5f5}
.pricing-list{display: flex;margin: 0 -9px}
.pricing-li{width: 20%;margin: 0 9px;border-radius: 10px 10px 0 0;transition: 1s;background: #fff;}
.pricing-li-header{height: 86px;border-radius: 10px 10px 0 0}
.pricing1 .pricing-li-price,.pricing1 .pricing-li-price *{color: #4c94e3}
.pricing2 .pricing-li-price,.pricing2 .pricing-li-price *{color: #008181}
.pricing3 .pricing-li-price,.pricing3 .pricing-li-price *{color: #f8864b}
.pricing4 .pricing-li-price,.pricing4 .pricing-li-price *{color: #e36257}
.pricing5 .pricing-li-price,.pricing5 .pricing-li-price *{color: #8960e4}
.pricing1 .pricing-li-header{background: #deedfe}
.pricing2 .pricing-li-header{background: #d5f4f6}
.pricing3 .pricing-li-header{background: #ffe6d9}
.pricing4 .pricing-li-header{background: #ffd1cd}
.pricing5 .pricing-li-header{background: #e7dcff}
.pricing-content{border: 1px solid #e3e8f0;border-top: 0;border-radius: 0 0 10px 10px}
.pricing-li-header p{padding: 21px 0 0 20px;line-height: 1.5}
.pricing-li-header p i{display: block;font-size: 16px;color: #333}
.pricing-li-header p span{font-size: 14px;color: #999}
.pricing-li-show{text-align: center;padding: 14px 0;border-bottom: 1px dotted #ddd}
.pricing-li-tip,.pricing-li-money{font-size: 14px;color: #888}
.pricing-li-price{font-size: 32px;position: relative}
.pricing-li-price i{font-weight: 800;padding-right: 2px;color: #333}
.pricing-li-info{padding: 9px 28px 0;line-height: 2.05;height: 276px}
.pricing-li-info p{position: relative;padding-left: 16px;font-size: 14px;color: #555}
.pricing-li-info p i{display: block;position: absolute;top: 50%;left: 0;transform: translate(-50%,-50%);color: #aaa;font-size: 14px}
.pricing-li-des{border-top: 1px dotted #ddd}
.pricing-li-des p{font-size: 13px;color: #888;padding: 14px 16px}
.sale-off{position: absolute;top: 50%;left:50%;transform: translate(0,-50%);color: #fff !important;background: #f32;border-radius: 32px;font-size: 13px;padding: 2px 10px;font-style: italic;margin: -18px 0 0 62px;width: 90px;display: inline-block;}
.sale-off::before{content: '';position: absolute;left: 0;bottom: -3px;width: 0;height: 0;border-top: 12px solid #ff3b30;border-right: 30px solid transparent;z-index: -1}
.pricing3 .sale-off{margin: -18px 0 0 54px}
.restaurant-main{width: 100%;position: relative}
.restaurant-main *{pointer-events: none;}
.restaurant-bg{width: 100%;position: relative;z-index: 0;pointer-events: none;}
.takeout{width: 6.6%;position: absolute;z-index: 1;right: 24%;top: 66%;animation: fadeLoop 3s infinite ease-in-out;}
.tto{width: 3.5%;position: absolute;z-index: 1;left: 13%;top: 35%;animation: ttoLoop 4s infinite ease-in-out;}
.tel-svg{width: 1%;position: absolute;top: 28.6%;left: 26.2%;z-index: 1;animation: telLoop 3s infinite ease-in-out;}
.tel-svg{width: 1%;position: absolute;top: 28.6%;left: 26.2%;z-index: 1;animation: telLoop 3s infinite ease-in-out;}
.machine1{position: absolute;z-index: 2;width: 2%;top: 68%;left: 57.5%;}
.machine2{position: absolute;z-index: 2;width: 1.3%;top: 11.9%;left: 62.5%;}
.food1,.food2,.food3,.food4{position: absolute;z-index: 3;width: 2.6%;}
.food1{top: 65%;left: 59%;animation: foodLoop1 3s infinite ease-in-out;opacity: 0;}
.food2{top: 64.1%;left: 59.8%;animation: foodLoop2 3s infinite ease-in-out;animation-delay: .3s;opacity: 0;}
.food3{top: 63.2%;left: 60.6%;animation: foodLoop3 3s infinite ease-in-out;animation-delay: .6s;opacity: 0;}
.food4{top: 62.3%;left: 61.4%;animation: foodLoop4 3s infinite ease-in-out;animation-delay: .9s;opacity: 0;}
.kds{position: absolute;z-index: 1;width: 2%;top: 6.8%;left: 60.2%;animation: posLoop 3s infinite ease-in-out;}
.pos,.pay{position: absolute;z-index: 1;width: 2.6%;top: 57.2%;left: 54.7%;animation: posLoop 4s infinite ease-in-out;}
.pay{top: 60.4%;left: 57.2%;animation: posLoop 4s infinite ease-in-out;}
.receipt{position: absolute;z-index: 2;width: 1%;top: 67%;left: 57.8%;animation: receiptLoop 2s infinite ease-in-out}
.receipt2{position: absolute;z-index: 2;width: .8%;top: 11%;left: 62.6%;animation: receiptLoop 2s infinite ease-in-out}
.restaurant-first{width: 100%;position: relative;margin-bottom: 20px;transition: .8s;z-index: 9}
.restaurant-last{width: 100%;position: relative;margin: 20px 0 60px;transition: .8s}
.restaurant-first-left,.restaurant-last-left{width: 53%;display: flex;border-radius: 10px;padding: 20px 0 10px}
.restaurant-first-left .restaurant-li{width: 33.33%;}
.restaurant-first-right{width: calc(55% - 55% / 3);display: flex;border-radius: 10px;padding: 20px 0 10px;position: absolute;height: 100%;top: 0;right: 0;}
.restaurant-first-right .restaurant-li{width: 50%;}
.restaurant-last-left{margin-left: 8%;background: #fcf7e4;border: 1px solid #f2eacd;}
.restaurant-last-right{width: calc(36.7% - 55% / 4);display: flex;border-radius: 10px;padding: 20px 0 10px;position: absolute;height: 100%;top: 0;right: 0;margin-right: 8%;background: #ebfae8;border: 1px solid #d2e8cf;}
.restaurant-li{text-align: center;position: relative;}
.restaurant-li img{width: 50%;}
.restaurant-li p{line-height: 1.2;font-size: 85%;}
.restaurant-first-left{background: #eff6ff;border: 1px solid #e3e8f0;}
.restaurant-first-right{background: #fff1f0;border: 1px solid #fce6e4;}
.guide-line{position: absolute;z-index: 9;}
.guide-line i{position: absolute;width: 20px;height: 20px;border-radius: 50%;background: #fff;border: 5px solid #0145f2;bottom: 0;z-index: 1;}
.guide-line span{position: absolute;left: 9.5px;height: 100%;border-right: 1px dashed #0145f2;z-index: 0;}
.guide-line1{left: 6%;}
.guide-line2{right: 35.5%;}
.guide-line2 i{border: 5px solid #dd473a}
.guide-line2 span{border-right: 1px dashed #dd473a}
.guide-line3{left: 44%}
.guide-line3 i{bottom: auto;top: 0;border: 5px solid #c89e09}
.guide-line3 span{border-right: 1px dashed #c89e09}
.guide-line4{right: 15.5%}
.guide-line4 i{bottom: auto;top: 0;border: 5px solid #50be09}
.guide-line4 span{border-right: 1px dashed #50be09}
.blue-content-flow{margin-top: 50px;}
.flow-title{padding: 8px 0 18px 10px;position: relative;overflow: hidden;z-index: 1;transition: .6s;}
.flow-title i{display: block;width: 100%;height: 0;border-bottom: 1px dotted #ddd;position: absolute;z-index: 0;top: 50%;}
.flow-title p{background: #f7f8fa;position: relative;z-index: 1;display: inline-block;padding-right: 20px;font-size: 20px;}
.flow-title span{font-size: 20px;color: #1c72f3;padding-right: 6px;}
.flow-list{display: flex;margin: 0 -10px;align-items: stretch;position: relative;z-index: 1;}
.flow-li{background: #fff;margin: 0 10px;border-radius: 10px;flex: 1;min-width: 0;border: 1px solid #e7ecf5;transition: .6s;}
.flow-li-arow{width: 30px;position: relative;transition: .5s;}
/* 箭头尺寸小，沿用 top-hide 但位移量收敛，避免入场时跳动过大 */
.flow-li-arow.top-hide{transform: translate(0,14px);}
.flow-li-arow i{transform:translate(-50%,-50%) rotate(-180deg) ;position: absolute;top: 50%;left: 50%;color: #999;}
.flow-info{padding: 22px 26px;display: flex;}
.flow-info-left{width: 48px;height: 48px;position: relative;background: #f7f8fa;border-radius: 12px;margin-right: 14px;}
.flow-info-left img{position: absolute;width: 36px;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.flow-info-right{flex: 1;min-width: 0;}
.flow-info-right i{display: inline-block;background: #eff6ff;color: #1c72f3;padding: 6px 18px;border-radius: 30px;line-height: 1;font-size: 13px;font-weight: 600;}
.flow-info-right span{display: block;margin:8px 0 4px;}
.flow-info .bold{font-size: 18px}
.flow-info p:last-child{color: #777;line-height: 1.5;}
.flow-title-two{padding: 30px 0 18px 10px;}
.flow-li .flow-info-left img:last-child{display: none;}
.flow-here{border: 1px solid #afc7fd;}
.flow-here .flow-info .bold{color: #1c72f3;}
.flow-here .flow-info-right i{background: #1c72f3;color: #fff;}
.flow-here .flow-info-left{background: #f2f6fd;}
.flow-here .flow-info-left img:first-child{display: none;}
.flow-here .flow-info-left img:last-child{display: inline-block;}
.assist-list{overflow: hidden;display: flex;margin: 0 -10px}
.assist-li{border: 1px solid #e4e8f0;margin: 0 10px;border-radius: 10px;width: 25%;transition: .6s}
.assist-li .bold{text-align: center;background: #f3f6fd;padding: 30px 0;font-size: 20px}
.assist-li p{position: relative;text-align: center;line-height: 0;padding: 20px 0}
.assist-li p img{width: 50%;margin: 12px 0}

@keyframes telLoop {
	0%{transform: scale(1)}
	20%{transform: scale(1.4)}
	30%{transform: scale(1)}
	50%{transform: scale(1.4)}
	60%{transform: scale(1)}
}
@keyframes fadeLoop {
	0%{opacity: 0}
	30%{opacity: 1;right: 20%;top: 69%}
	75%{opacity: 1;right: 20%;top: 69%}
	90% {opacity: 0;right: 15%;top: 75%}
	100% {opacity: 0}
}
@keyframes ttoLoop {
	0%{opacity: 0}
	20%{opacity: 1;left: 13%;top: 38.8%}
	30%{opacity: 1;transform: scale(1)}
	40%{opacity: 1;transform: scale(1.4)}
	50%{opacity: 1;transform: scale(1)}
	60%{opacity: 1;transform: scale(1.5)}
	70%{opacity: 1;transform: scale(1)}
	85%{opacity: 1}
	90%{opacity: 0;left: 13%;top: 38.8%}
	100%{opacity: 0}
}
@keyframes foodLoop1 {
	0%{opacity: 0}
	30%{opacity: 1;top: 67%;left: 59%;}
	75%{opacity: 1;top: 67%;left: 59%;}
	95% {opacity: 1;top: 67%;left: 59%;}
	100% {opacity: 0;top: 69%;left: 62%;}
}
@keyframes foodLoop2 {
	0%{opacity: 0}
	30%{opacity: 1;top: 66.1%;left: 59.8%;}
	75%{opacity: 1;top: 66.1%;left: 59.8%;}
	85% {opacity: 1;top: 66.1%;left: 59.8%;}
	100% {opacity: 0;top: 68.1%;left: 62.8%;}
}
@keyframes foodLoop3 {
	0%{opacity: 0}
	30%{opacity: 1;top: 65.2%;left: 60.6%;}
	75%{opacity: 1;top: 65.1%;left: 60.6%;}
	80% {opacity: 1;top: 65.2%;left: 60.6%;}
	100% {opacity: 0;top: 67.2%;left: 64.6%;}
}
@keyframes foodLoop4 {
	0%{opacity: 0}
	30%{opacity: 1;top: 64.3%;left: 61.4%;}
	75%{opacity: 1;top: 64.3%;left: 61.4%;}
	100% {opacity: 0;top: 66.3%;left: 65.4%;}
}
@keyframes posLoop {
	
	
	
	
	
	0%{opacity: 0;transform: scale(0);}
	10%{opacity: 1;}
	20%{transform: scale(1.15)}
	30%{transform: scale(1)}
	40%{transform: scale(1.15)}
	50%{transform: scale(1)}
	80%{opacity: 1}
	90%{opacity: 1}
	100% {opacity: 0}
}
@keyframes receiptLoop {
	0%{opacity: 0;transform: translate(0,0);}
	50%{opacity: 1;transform: translate(0,-5px);}
	90%{opacity: 0;}
	100% {opacity: 0;transform: translate(0,-5px);}
}
@media screen and (min-width: 1281px) {
	.header-btns p:hover{background: #01cf11;color: #fff}
	.menu p:hover{opacity: .85}
	.menu-here:hover{opacity: 1 !important}
	.banner-tab p:hover{color: #0145f2}
	.banner-btns p:hover{background: #01cf11;color: #fff}
	.banner-tel a:hover,.banner-tel a:hover i{color: #0145f2}
	.item:hover p{background: #f6f6f6}
	.item:hover img{opacity: .8}
	.about-tab p:hover{background: #0145f2;color: #fff;transform: translate(0,-6px);transition: .2s}
	.topic-list li:hover{transition: .2s;transform: translate(0,-10px)}
	.page-advantage li:hover{transform: translate(0,-10px);transition: .3s;background: #f4f9ff}
	.container .swiper-slide:hover{background: #f4f9ff}
	.container .swiper-button:hover i{color: #0145f2}
	.comment-list li:hover{transform: translate(0,-10px);transition: .3s;background: #eff6ff}
	.scroll-item:hover{background: #eff6ff}
	.support-list li:hover{;transition: .3s;background: #f9fbff}
	.question-list li:hover dt span{color: #0145f2}
	.bottom-contact-btns p:hover{background: #01cf11;color: #fff}
	.create-mail-btns p:hover{opacity: .8}
	.page-footer dd ul li span:hover{color: #ddd}
	.page-footer dd ul li a:hover{color: #ddd}
	.pricing-li:hover{background: #f9f9ff;transform: scale(1.05);}
}
@media screen and (max-width: 1440px) {
	.header-content,.banner-content,.page-content,.comment-main{max-width: 1260px}
	.back-home-btn{display: none;}
}
@media screen and (max-width: 1280px) {
	body{overflow: hidden;width: 100%;height: auto;overflow-y: scroll}
	*{font-size: 14px;font-weight: 400}
	.header-content,.banner-content,.page-content,.comment-main,.page-footer{max-width: 96vw}
	.banner-content-left{left: 0}
	.scroll-box1{right: 0}
	.scroll-box2{right: 220px}
	.scroll-box3{right: 440px}
	.download-btn{display: none !important}
	.menu p{margin-right: 3.4vw}
	.left-hide{transform: translate(-50px,0);opacity: 0}
	.comment-box p,.comment-scroll-text,.support-list li div span{color: #555}
	.feature-slogen b{font-size: 22px}
	.feature-slogen p{line-height: 1.6}
	.page-about,.page-advantage-title{padding: 40px 0 }
	.about-tab{padding-top: 20px}
	.page-topic,.replacemen-title{padding: 40px 0 30px}
	.page-reason,.comment-main,.page-support-title,.center-title{padding: 40px 0 20px}
	.page-question-title{padding: 18px 0 16px}
	.container .swiper-button{width: 38px;height: 38px;background: rgba(1, 69, 242, .3);border-radius: 50%;top: 50%;margin-top: -20px;z-index: 99}
	.container .swiper-button i{color: #fff;font-size: 24px;top: 50%;left: 66%;transform: translate(-50%,-50%)}
	.container .swiper-button-prev{margin-left: 14px}
	.container .swiper-button-next{margin-right: 14px;transform: rotateY(180deg)}
	/* ===== 導入の流れ（平板：2列グリッド） ===== */
	.blue-content-flow{margin-top: 40px;padding-bottom: 40px}
	.page-flow-title{padding: 40px 0 22px}
	.flow-title{padding: 6px 0 14px 10px}
	.flow-title p{font-size: 17px;padding-right: 14px}
	.flow-title span{font-size: 17px}
	.flow-title-two{padding: 22px 0 14px 10px}
	.flow-list{display: grid;grid-template-columns: repeat(2,1fr);gap: 14px;margin: 0}
	.flow-li{flex: none;width: auto;min-width: 0;margin: 0}
	.flow-li-arow{display: none}
	/* 3枚構成の PHASE 2 は末尾を全幅にして余白を作らない */
	.flow-second .flow-li:last-child{grid-column: 1 / -1}
	.flow-info{padding: 18px}
	.flow-info-left{width: 42px;height: 42px;margin-right: 12px}
	.flow-info-left img{width: 32px}
	.flow-info .bold{font-size: 16px}
	/* ===== 連携サービス（平板：维持4列并收紧） ===== */
	.page-assist-title{padding: 40px 0 22px}
	.assist-list{margin: 0 -7px}
	.assist-li{margin: 0 7px}
	.assist-li .bold{font-size: 17px;padding: 18px 0}
	.assist-li p{padding: 14px 0}
	.assist-li p img{width: 56%;margin: 9px 0}
}
@media screen and (max-width: 1024px) {
	.consult-btn{display: none !important}
	.header,.header-box{height: 60px}
	.logo{width: 160px;top: 46%}
	.menu{margin: 18px 0 0 210px}
	.menu p{margin-right: auto;margin-left: 3vw}
	.menu span{top: 26px}
	.box{width: 140px}
	.banner-btns p{font-size: 15px}
	.item{height: 290px;padding-bottom: 18px}
	.item img{width: 140px;height: 188px}
	.item p{height: auto;padding-bottom: 10px}
	.item p *{font-size: 12px}
	.item p span{height: 34px}
	.scroll-box2{right: 155px}
	.scroll-box3{right: 310px}
	.banner-tab p{padding: 8px 24px}
	.page-title b{font-size: 30px;padding: 0 0 2px 20px}
	.page-title span{font-size: 16px}
	.slogen p{font-size: 35px}
	.short-banner .banner-tab{margin-top: 50px}
	.slogen{height: 100px;margin: 20px 0 0 6px}
	.slogen-des{margin: 6px 0 0 6px;height: 50px}
	.slogen-des p{font-size: 16px;line-height: 1.6}
	.banner-btns{margin-top: 30px}
	.page-about{padding: 40px 0}
	.about-text{padding-top: 10px}
	.about-tab p{font-size: 13px;padding: 12px 22px}
	.doubt-img{width: 150px;z-index: 9}
	.doubt-img img{width: 166px;margin: 30px 0 0 14px}
	.page-topic{padding: 40px 0 28px}
	.topic-content{margin-top: 10px}
	.feature-slogen{z-index: 10}
	.blue-content{padding-bottom: 46px}
	.page-advantage-title{padding: 40px 0 28px}
	.page-topic, .page-reason,.comment-main{padding: 40px 0 20px}
	.page-advantage li div{margin: 14px auto 0}
	.page-advantage li b{font-size: 15px;padding: 4px 0 8px}
	.reason-li b,.bottom-contact-btns p{font-size: 16px}
	.reason-li div p{font-size: 13px}
	.page-advantage li p{font-size: 14px}
	.reason-li{padding-bottom: 0}
	.replacemen-title,.page-support-title{padding: 40px 0 25px}
	.replacemen-box div p,.support-list li div span{font-size: 14px}
	.page-question-title{padding: 20px 0}
	.comment-box p,.comment-scroll-text{font-size: 13px}
	.question-list{padding-bottom: 44px}
	.center-title{font-size: 34px;padding: 44px 0 20px}
	.page-footer dd ul li{line-height: 2.2}
	.page-footer dd ul li b{font-size: 15px}
	.page-footer dd ul li span{font-size: 14px}
	.page-footer{padding-top: 30px}
	.shade-box{display: none}
	.reason-li span{color: #666}
	.support-list li div{padding: 16px 22px}
}
/* 价格卡（平板/手机）已在 @media (max-width: 1279px) 区块统一处理 */
@media screen and (max-width: 768px) {
	.header-content,.banner-content,.page-content,.comment-main,.page-footer{max-width: 92vw}
	.header,.header-box{height: 48px}
	.wap-banner{opacity: 1;position: relative;top: auto;pointer-events: auto}
	.menu{opacity: 0;pointer-events: none}
	.banner{display: none}
	.header-box{background: #0145f2}
	.header-btns p{display: none;padding: 0;font-size: 14px;margin-left: 6px;background: none;color: #fff;padding: 4px 6px}
	.header-btns .consult-btn{background: none;color: #fff}
	.about-tab,.wap-menu-btn,.wap-hide{display: block !important}
	.logo{width: 120px}
	.about-content{padding-top: 4px}
	.header-btns .wap-menu-btn{background: #fecc00 ;color: #000;padding: 4px 18px;margin-left: 10px}
	.header-btns .wap-menu-btn:active{background: #01cf11;color: #fff}
	.header-btns p:active{color: #fecc00}
	.page-about{padding: 26px 0}
	.page-title b{font-size: 22px;padding: 0 0 4px 16px;line-height: 1}
	.page-title span{font-size: 13px;padding-left: 16px;color: #888;line-height: 1.3;display: block}
	.page-title i{height: 36px;top: 48%}
	.about-text{font-size: 15px;line-height: 1.8;padding: 6px 2px 0;color: #555}
	.about-tab{padding-top: 14px}
	.about-tab p{margin: 0 6px 8px 0;font-size: 13px;padding: 9px 16px}
	.page-topic,.page-advantage-title,.page-reason,.replacemen-title,.comment-main,.page-support-title{padding: 26px 0 16px}
	.doubt-img{display: none}
	.topic-list{margin: 10px -7px 0 -7px}
	.topic-list li{width: calc((100% - 28px) / 2);margin: 0 7px 14px}
	.topic-list li p{margin: 20px 0 0 10px;width: 20px}
	.topic-list li p i{width: 20px;height: 20px;font-size: 12px;line-height: 1.5}
	.topic-list li:last-child{display: none}
	.feature-slogen{background: #fff;border: 0}
	.feature-slogen b{font-size: 20px}
	.blue-content{padding-bottom: 30px}
	.feature-slogen p{font-size: 15px}
	.page-title-row i{top: 27% !important}
	.page-advantage{margin: 0 -6px 26px}
	.page-advantage li{width: calc((100% - 24px) / 2);margin: 0 6px 14px}
	.page-advantage li p{padding: 0 12px 12px}
	.page-advantage li b{font-size: 15px}
	.page-advantage li div{width: 56px;height: 56px;margin: 10px auto 0}
	.reason-li img{margin: 12px 0 0 12px;width: 38px;height: 38px}
	.reason-li b{padding: 6px 12px 0;font-size: 15px}
	.reason-li span{padding: 6px 12px 8px;height: 68px}
	.reason-li div{padding: 0 12px}
	.reason-li div p{line-height: 1.8}
	.reason-blue-content{padding-bottom: 60px}
	.container .swiper-button{width: 34px;height: 34px;background: rgba(1, 69, 242, .8);border-radius: 3px;top: auto;margin: 0;z-index: 99;bottom: -46px}
	.container .swiper-button-prev{margin-left: 50%;left: -40px}
	.container .swiper-button-next{margin-right: 50%;right: -40px}
	.replacemen-title .page-title i{top: 33%}
	.replacemen-content{display: block;margin: 0}
	.replacemen-content li{width: calc(100% - 2px);margin: 0 0 14px}
	.replacemen-box{padding: 0 16px}
	.replacemen-box b{padding: 16px 0 12px;font-size: 17px}
	.replacemen-box span{font-size: 15px;padding: 10px 0 8px}
	.replacemen-box div{padding-bottom: 12px}
	.replacemen-content{padding-bottom: 20px}
	.comment-list{margin: 18px -7px 0}
	.comment-list li{width: calc((100% - 28px) / 2);margin: 0 7px 14px}
	.comment-des-title{padding: 6px 0 16px 10px;font-size: 18px}
	.scroll-item{flex: 0 0 calc((100% - 60px) / 1.2);margin-right: 12px}
	.comment-scroll-box b{font-size: 15px}
	.comment-box{padding: 10px 12px 15px}
	.comment-box b{font-size: 16px}
	.comment-box p, .comment-scroll-text{font-size: 14px}
	.support-list li div b{font-size: 16px}
	.support-list li{width: 100%;margin: 0 9px 12px}
	.support-list li p{width: 70px}
	.support-list li p img{width: 38px}
	.support-list li div{padding: 12px 14px}
	.question-list li dl dt, .question-list li dl dd{height: 34px}
	.question-list li dl *{line-height: 3}
	.question-list li{height: 56px}
	.open-answer{height: 90px !important}
	.center-title{font-size: 24px;padding: 30px 0 18px}
	.bottom-contact-btns{width: 90vw}
	.bottom-contact-btns p,.bottom-contact-btns a{margin: 0 6px;padding: 13px 0;font-size: 14px}
	.contact-tips{width: 96vw}
	.customer-service-list{display: block;margin: 0 auto;width: 80vw}
	.customer-service-list li{width: 100%;margin: 0;padding: 0 30px;margin-bottom: 18px}
	.customer-service-qr p{width: 100%;margin: 0}
	.customer-service-list .customer-service-li *{font-size: 17px}
	.customer-service-qr p img{width: 110px;height: 110px;border-radius: 3px}
	.page-footer{padding-top: 20px}
	.customer-service-tips{padding: 0 40px;line-height: 1.8}
	.page-footer dl{padding: 0 10px 14px;display: block}
	.page-footer dt{width: 100%}
	.footer-slogen{padding-top: 12px}
	/* 手机端もフッターのクイックリンクを表示（2列グリッド） */
	.page-footer dd{display: block;margin-top: 4px}
	.page-footer dd ul{display: grid;grid-template-columns: 1fr 1fr;gap: 0 24px;float: none;display: none;}
	.page-footer dd ul li{margin-left: 0;padding: 10px 0 4px}
	.page-footer dd ul li span{padding: 3px 0}
	.page-footer dt *{line-height: 1.6}
	.footer-bottom-text{display: block;padding: 12px 14px}
	.footer-bottom-text p{font-size: 13px}
	.footer-bottom-text span{text-align: left;font-size: 12px;padding-top: 6px}
	.comment-main{padding-bottom: 26px}
	.create-mail-main{width: 86vw}
	.goto-info-btn{font-size: 14px;}
	.restaurant-li p{font-size: 2vw;line-height: 1;font-weight: 500 !important}
	.restaurant-first-left, .restaurant-last-left{width: 59%;}
	.restaurant-first-right{width: calc(59% - 59% / 3);}
	.restaurant-last-left{margin-left: 3%;}
	.restaurant-last-right{width: calc(36.7% - 51% / 8);margin-right: 0}
	.guide-line i{width: 12px;height: 12px;border: 3px solid #0145f2}
	.guide-line span{left: 6px;border-right: 1px dotted #0145f2;}
	.guide-line2 i{border: 3px solid #dd473a}
	.guide-line2 span{border-right: 1px dashed #dd473a}
	.guide-line3{left: 42%}
	.guide-line3 i{bottom: auto;top: 0;border: 3px solid #c89e09}
	.guide-line3 span{border-right: 1px dashed #c89e09}
	.guide-line4{right: 18%}
	.guide-line4 i{bottom: auto;top: 0;border: 3px solid #50be09}
	.guide-line4 span{border-right: 1px dashed #50be09}
	/* ===== 導入の流れ（手机：单列纵向流程） ===== */
	.blue-content-flow{margin-top: 26px;padding-bottom: 30px}
	.page-flow-title{padding: 26px 0 14px}
	.flow-title{padding: 2px 0 12px}
	.flow-title i{display: none}
	.flow-title p{display: block;background: transparent;padding-right: 0;font-size: 15px;line-height: 1.5;padding-left: 10px;}
	.flow-title span{display: block;font-size: 14px;padding-right: 0;margin-bottom: 2px}
	.flow-title-two{padding: 18px 0 12px}
	.flow-list{display: block;grid-template-columns: none;margin: 0}
	.flow-li{flex: none;width: auto;margin: 0 0 6px}
	.flow-second .flow-li:last-child{grid-column: auto}
	/* 横向箭头改为向下的连接箭头 */
	.flow-li-arow{display: block;width: 100%;height: 20px;position: relative;margin: 0 0 6px}
	.flow-li-arow i{font-size: 18px;color: #b7c4de;transform: translate(-50%,-50%) rotate(-90deg)}
	.flow-info{padding: 14px}
	.flow-info-left{width: 38px;height: 38px;border-radius: 10px;margin-right: 10px}
	.flow-info-left img{width: 28px}
	.flow-info-right i{padding: 5px 14px;font-size: 12px}
	.flow-info-right span{margin: 6px 0 4px}
	.flow-info .bold{font-size: 15px}
	/* ===== 連携サービス（手机：2列） ===== */
	.page-assist-title{padding: 26px 0 14px}
	.assist-list{display: grid;grid-template-columns: repeat(2,1fr);gap: 10px;margin: 0;overflow: visible}
	.assist-li{width: auto;margin: 0}
	.assist-li .bold{font-size: 15px;padding: 12px 0}
	.assist-li p{padding: 10px 0}
	/* 卡片变宽后 logo 会挤成两列，这里强制块级单列堆叠并居中；同时给封顶避免过大 */
	.assist-li p img{display: block;width: 62%;max-width: 160px;margin: 8px auto}
}
/* ===== 平板 / 手机：价格卡横向滑动轮播（<1280px，即 1279px 及以下）===== */
@media screen and (max-width: 1279px) {
	.pricing-list{
		position: relative;
		display: flex;
		flex-wrap: nowrap;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		scroll-snap-type: x mandatory;
		margin: 0 -4vw;
		padding: 24px 0 28px;
		scrollbar-width: none;
	}
	.pricing-list::-webkit-scrollbar{display: none}
	/* 首尾占位已移除：无限循环由 JS 克隆卡片组实现，克隆组本身即为首尾缓冲 */
	.pricing-li{
		--s: 0.84;
		/* 手机按 56vw 自适应，平板/大屏封顶 420px，避免卡片过大 */
		flex: 0 0 auto;
		width: min(56vw, 420px);
		margin: 0;
		scroll-snap-align: center;
		display: flex;
		flex-direction: column;
		transform: translate(0,0) scale(var(--s));
		transition: transform 0.3s, opacity 0.3s;
	}
	.is-active{z-index: 9;}
	/* 中间（居中）卡片为基准大小 1，两侧缩小到 0.84 */
	.pricing-li.is-active{--s: 1}
	/* 兼容原有滚动出现动画：入场时保留下移动画并带上缩放 */
	.pricing-list .pricing-li.top-hide{
		transform: translate(0,50px) scale(var(--s));
		opacity: 0;
	}
	.pricing-content{flex: 1;display: flex;flex-direction: column}
	.pricing-li-info{height: auto;flex: 1}
	.pricing-li-show{position: relative}
	.sale-off{font-size: 12px;}
	.pricing-list{padding-top: 0;}
}
/* ===== 製品紹介ドロップダウン（PC/タブレット共通） ===== */
.menu-drop-btn{white-space: nowrap}
.menu .drop-arrow{font-style: normal;font-size: 9px;margin-left: 5px;display: inline-block;transition: transform .25s;vertical-align: 2px;transform-origin: 50% 40%;color: #fff;}
.menu.menu-drop-open .drop-arrow{transform: rotate(180deg)}
.menu-panel{position: absolute;top: 54px;left: -22px;width: 600px;max-width: calc(100vw - 40px);background: #fff;border-radius: 0 0 10px 10px;box-shadow: 0 14px 44px rgba(1,20,60,.18);padding: 26px 34px 22px;display: flex;gap: 38px;opacity: 0;visibility: hidden;transform: translateY(12px);transition: opacity .25s,transform .25s,visibility .25s;z-index: 60}
.menu.menu-drop-open .menu-panel{opacity: 1;visibility: visible;transform: translateY(0)}
.menu-panel::before{content: '';position: absolute;top: -7px;left: 74px;width: 14px;height: 14px;background: #fff;transform: rotate(45deg);border-radius: 2px}
.menu-panel-col{flex: 1;min-width: 0}
.menu-panel-col b{display: block;font-size: 15px;color: #333;padding-bottom: 12px;border-bottom: 1px solid #eceff5;margin-bottom: 4px}
.menu-panel-col a{display: flex;align-items: center;justify-content: space-between;font-size: 15px;font-weight: 500;color: #333;padding: 13px 2px;cursor: pointer;transition: .2s}
.menu-panel-col a .arrow{font-style: normal;color: #0145f2;font-size: 12px;margin-left: 12px;flex: none;transition: .2s;transform: rotate(-90deg);}
.menu-panel-col a:hover{color: #0145f2;padding-left: 10px}
.menu-panel-col a:hover .arrow{transform: translate(2px,-2px) rotate(-180deg)}
/* ドロップダウン表示のためヘッダーのクリップを解除する。
   ただし overflow:visible にすると BFC が消えて .menu の上マージン(26px)が
   外に相殺され、ロゴ・ボタン全体が26px押し下げられるため、
   display:flow-root で BFC を維持したままクリップだけ解除する */
@media screen and (min-width: 769px) {
	.header{overflow: visible}
	.header-content{overflow: visible;display: flow-root}
}
@media screen and (max-width: 1024px) {
	.menu-panel{top: 40px;left: -14px;width: 520px;padding: 20px 24px 16px;gap: 26px}
	.menu-panel::before{left: 58px}
}
@media screen and (max-width: 768px) {
	/* 手机端顶部菜单整体隐藏，製品紹介走右侧抽屉菜单 */
	.menu-panel{display: none}
	.wap-menu-main .wap-menu-group{display: block;text-align: center;font-size: 12px;color: #9db8ff;padding: 16px 0 2px}
	.wap-menu-main a{display: block;width: 100%;text-align: center;color: #fff;padding: 14px 0 8px;font-size: 14px;cursor: pointer}
	.wap-menu-main a.nav-here{color: #fecc00;font-weight: 600}
}
