@charset "UTF-8";
*{text-decoration:none}
img{border:0}
.stith2{font-size:40px; text-align:center; padding:20px 0; font-weight:bold}
@-ms-viewport{width:device-width}
@-o-viewport{width:device-width}
@viewport{width:device-width}
html{-ms-overflow-style:scrollbar;font-family:helvetica neue,helvetica,arial,sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}
[hidden],template{display:none}
a{background-color:transparent;text-decoration: none;color:#333;}
a:active,a:hover{outline:0;color:#333;}
button{overflow:visible}
button,select{text-transform:none}
button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}
button[disabled],html input[disabled]{cursor:default}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
table{border-collapse:collapse;border-spacing:0}
td,th{padding:0}


.toolpc{display:block;position: fixed;right:5%;bottom: 50%;text-align:center;width:45px;z-index:998; }
#ask66inq_ss{cursor:pointer;border-radius:50%; width:45px;background: var(--allcolor);; height:45px;box-shadow: 0 0.2rem 0.4rem rgb(0 0 0 / 70%); display:block}
.toolpc a,.toolpc .wechaticon{cursor:pointer; border-radius:50%; width:45px;background: var(--allcolor);; height:45px;box-shadow: 0 0.2rem 0.4rem rgb(0 0 0 / 70%); display:block; text-align:center; line-height:45px;; margin-top:15px}
.toolpc img{vertical-align: middle;}
.toolpc a.selfURL{  font-family:fantasy; font-weight:400; color:#fff;}

.cf::after,.cf::before{content:"";display:table}
.cf::after{clear:both}
.hide{display:none!important}
.nowrap{white-space:nowrap}
.align-right{text-align:right}
.pd14{padding:0 14px;}
.highcolor{color:222;}
.bordertp{border-top:1px solid #d7d7d7;}
iframe{border:none}
html{width:100%;height:100%;height:100vh}
body *{box-sizing:border-box}
body{display:flex;flex-direction:column;font-size:16px;line-height:1.625;font-weight:400;width:100%;min-height:100%;margin:0;padding:0;font-family:helvetica neue,helvetica,arial,sans-serif;color:#333333;position:relative;text-rendering:optimizeSpeed;margin-bottom:0!important;-webkit-font-feature-settings:"kern" 1,"liga" 1,"dlig" 1,"calt" 0;-moz-font-feature-settings:"kern" 1,"liga" 1,"dlig" 1,"calt" 0;-ms-font-feature-settings:"kern" 1,"liga" 1,"dlig" 1,"calt" 0;font-feature-settings:"kern" 1,"liga" 1,"dlig" 1,"calt" 0}
.section-inner::after,.section-inner::before,.wrapper::after,.wrapper::before,footer::after,footer::before,header::after,header::before,main::after,main::before{display:table;content:""}
body b,body strong,h1,h2{font-weight:500}
h1,h2,h3{display: inline;font-size: inherit;margin-block: auto;font-weight: inherit;}
h1{display:block;}
.checkout-final-state-box-content .voucher-code,body.lang-ja,body.lang-ko,body.lang-tw,body.lang-zh-TW{-webkit-font-feature-settings:normal;-moz-font-feature-settings:normal;-ms-font-feature-settings:normal}
body.lang-ja,body.lang-ko,body.lang-tw,body.lang-zh-TW{font-family:helvetica neue,helvetica,arial,sans-serif;font-feature-settings:normal}
body.lang-ja *,body.lang-ko *,body.lang-tw *,body.lang-zh-TW *{text-rendering:unset!important}
.app{position:relative;overflow:hidden;padding-top:0;padding-top:env(safe-area-inset-top);padding-right:0;padding-right:env(safe-area-inset-right);padding-bottom:0;padding-bottom:env(safe-area-inset-bottom);padding-left:0;padding-left:env(safe-area-inset-left)}
.app::after{clear:both}
.web .app{flex:1 0 auto;display:flex;flex-direction:column}
.nav{background-color:#fff;border-bottom:1px solid #eceff3;box-shadow: inset 0 1px 0 rgba(255,255,255,0.15),0 1px 5px rgba(0,0,0,0.075);}
.nav-holder{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-around;align-items:center;position:relative;min-height:80px;padding:0 16px;margin:0}
.nav-holder::after,.nav-holder::before{content:"";display:table}
.nav-holder::after{content:"";position:absolute;top:-1px;left:0;width:100%;height:1px;opacity:0;background-color:#18202e;transition:opacity .3s;z-index:1;clear: both;}
.active-menu .nav-holder:after{top:0;right:0;bottom:0;left:0;width:100%;height:100vh;opacity:.5}
.nav-logo{width:47px;height:48px;flex-shrink:0;position:relative}
.nav-logo a{display:inline-block;width:100%}
.nav-logo a img{width:100%}
.nav-logo svg{transition:all .2s;position:absolute;top:0;left:0}
.nav-logo svg g{fill:#455c83}
.nav-title{margin-left:15px;    white-space: nowrap;}
.nav-title h1,.nav-title>h3,.nav-title>h2{padding:0;margin:0;font-weight: bold;line-height: 1;font-size: 24px;letter-spacing: -2px;display: block;}
.nav-title .intro{color: #888888;display:none;height: 24px;overflow: hidden;}
.nav-tabs{flex-grow:1;text-align:right;position:relative;font-size:.95rem;line-height:1.86667;}
#nav-tabs{ overflow: auto}
#nav-tabs::-webkit-scrollbar-track {  -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.3);  background-color: #fff;}
#nav-tabs::-webkit-scrollbar {  width: 3px; height:4px;  background-color:#c62828;}
#nav-tabs::-webkit-scrollbar-thumb {  background-color:#1c8ebf;}

.nav-tabs a{color:#333333;transition:color .15s ease-in-out;padding:0 10px;font-size:15px;line-height:35px;font-weight:400;text-align:center;height:35px;}
body:not(.touched) .nav-tabs a:hover{color:var(--allcolor);border-bottom-color:transparent}
.nav-tabs ul{list-style:none;margin:0;padding:0;white-space:nowrap;display: none;}
.nav-tabs ul li{display:inline-block;padding:0 7px;font-size: 16px;line-height:1.46667;color:#455c83;cursor:default;position:relative}
.nav-tabs ul li.nav-line-cbt-tab-current a,body:not(.touched) .nav-tabs ul li.nav-line-cbt-tab-current a:hover{color:#0097f5}
.nav-tabs ul li.nav-line-cbt-tab-current:after{content:"";position:absolute;display:block;bottom:-18px;left:7px;right:7px;height:2px;width:calc(100% - 14px);background-color:#0097f5}
.nav-tabs ol{list-style:none;margin:0;padding:0;white-space:nowrap;counter-reset:li}
.nav-tabs ol li{display:inline-block;padding:0 14px;font-size:.95rem;line-height:1.46667;color:#455c83;cursor:default;position:relative}
.nav-tabs ol li:before{content:"";counter-increment:li;display:inline-block;vertical-align:middle;color:#fff;font-size:11px;line-height:1.6;font-weight:400;width:18px;height:18px;overflow:hidden;text-align:center;background-color:#0097f5;border-radius:50%}
.nav-tabs ol li:not(:last-of-type):after{content:"";position:absolute;display:block;right:2px;top:8px;width:6px;height:6px;pointer-events:none;cursor:default;color:#7d8da8;opacity:.5;border-color:currentColor;border-width:1px 1px 0 0;border-style:solid;-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(45deg);transform:rotate(45deg);transition:color .15s ease-in-out}
.nav-tabs ol li a,.nav-tabs ol li span{position:relative;padding:7px}
.nav-tabs ol li a:before,.nav-tabs ol li span:before{content:"";-webkit-transform:scaleX(-1) rotate(135deg);transform:scaleX(-1) rotate(135deg);position:absolute;opacity:1;transform-origin:left top;border-style:solid;border-width:1px;border-color:#fff;border-bottom:none;border-left:none;height:7px;width:3.5px;left:-13px;top:18px}
.nav-tabs ol li.state-active:before{content:counter(li)}
.nav-tabs ol li.state-active a:before,.nav-tabs ol li.state-active span:before{opacity:0}
.nav-tabs ol li.state-active~li:before{content:counter(li);background-color:#7d8da8;opacity:.5}
.nav-tabs ol li.state-active~li a,.nav-tabs ol li.state-active~li span{color:#7d8da8}
.nav-tabs ol li.state-active~li a:before,.nav-tabs ol li.state-active~li span:before{opacity:0}
.nav-tabs-mobile{padding:0;font-size:.95rem;line-height:1.46667;position:relative;white-space:nowrap}
.nav-tabs-mobile:before{content:"";display:block;position:absolute;top:1px;left:-16px;width:1px;height:18px;border-right:1px solid #a2aec1;opacity:.5}
.nav-tabs ol,.nav-tabs ul{display:none}
.nav-tabs ul li.highlight{padding:0 0 0 15px;}
.nav-tabs ul li.highlight a{transition:all .15s;border-radius:4px;display:inline-block;text-decoration:none;white-space:nowrap;color:#fff;background-color:var(--allcolor);text-align:center;padding: 0 20px;}
.nav-tabs ul li.highlight a:hover{color:#fff;}
.nav-menu{margin:0;white-space:nowrap;font-size:.95rem;line-height:1.86667}
.nav-menu>ul{list-style:none;margin:0;padding:0}
.nav-menu>ul>li{display:inline-block;vertical-align:middle;margin:0;padding:0}
.nav-menu>ul>li>a{transition:all .15s;text-decoration:none; display:block; padding:0 4px}
body:not(.touched) .nav-menu>ul>li>a:hover{border-bottom-color:transparent}
.web .nav-menu>ul>li.nav-menu-item-login{display:none}
.nav-menu>ul>li.nav-menu-item-login a{color:#888888;padding:7px 15px;margin:0;font-size:16px;line-height:45px;transition:color .15s ease-in-out}
.nav-menu .login .icon-user{width:20px;height:20px;vertical-align: text-bottom;margin-right:5px;}
.nav-menu .user-menu i{font-size:32px;color:var(--allcolor);font-weight: bold;}

.line-1,.line-2,.line-3 {border-top: 2px solid var(--allcolor);display: block;transition: margin 0.5s, transform 0.5s;width: 25px;}
.line-2 {margin: 5px 0;}
.navbox .line-1 {transform: rotate(45deg);margin: 0;}
.navbox .line-3 {transform: rotate(-45deg);margin: 0;}
.navbox .line-2 {margin: -2px 0;opacity: 0;}

.nav-menu .user-menu .icon-menu{width:32px;vertical-align: top;}
body:not(.touched) .nav-menu>ul>li.nav-menu-item-login a:hover{color:#888888;border-bottom-color:transparent}
.nav-role-hp{border-bottom:0;width:100%;width:100vw;z-index:20;position:fixed;left:0;top:0;}
.w-notifications-menu,.w-user-menu{top:0;max-width:270px;transition:all .4s;-webkit-transform:translate3d(100vw,0,0)}
.nav-line-sticky .nav-role-hp{background-color:#fff;box-shadow:0 6px 40px 1px rgba(88,184,245,.1)}
.nav:not(.nav-role-hp){margin-right:0;margin-right:calc(-1 * env(safe-area-inset-right));margin-left:0;margin-left:calc(-1 * env(safe-area-inset-left))}
.nav-tabs{padding:0}
.w-user-menu{position:absolute;right:0;width:100%;height:100vh;z-index:150;background-color:#fff;border-radius:0;padding:10px;display:block;transform:translate3d(100vw,0,0);box-shadow:0 1px 4px 1px rgba(111,158,188,.3);opacity:0;pointer-events:none}
.w-user-menu.reopen{transition:opacity .4s}
.w-user-menu:before{content:"";display:block;position:absolute;pointer-events:none;z-index:1;height:12px;left:0;right:25px;top:8px;background-image:-webkit-gradient(linear,left top,left bottom,from(white),to(rgba(255,255,255,.001)));background-image:linear-gradient(white,rgba(255,255,255,.001))}
@keyframes w-user-menu-desktop-animation{0%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0);opacity:0}
100%{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);opacity:1}
}
.web.active-menu .w-user-menu{opacity:1;display:block;pointer-events:all;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
.w-user-menu-close{position:absolute;top:6px;right:10px;border-bottom:none}
@supports (padding:max(0px)){.w-user-menu{padding-right:10px;padding-right:max(10px,env(safe-area-inset-right))}
.w-user-menu-close{right:10px;right:max(10px,env(safe-area-inset-right))}
}
.w-user-menu-close span{position:relative;display:inline-block;color:#888;transition:color .2s;text-decoration:none;font-size:.95rem;line-height:1.46667;padding-right:28px;height:22px}
.w-user-menu-close span:after,.w-user-menu-close span:before{position:absolute;top:50%;right:10px;transition:background-color .2s;content:"";width:18px;height:2px;display:block;z-index:1;background-color:#888}
.w-user-menu-close span:before{-webkit-transform:rotate(45deg);transform:rotate(45deg)}
.w-user-menu-close span:after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}
body:not(.touched) .w-user-menu-close span:hover{color:#dadee6}
body:not(.touched) .w-user-menu-close span:hover:after,body:not(.touched) .w-user-menu-close span:hover:before{background-color:#dadee6}
.w-user-menu ul{padding:10px 0;margin:20px 0;list-style:none;font-size:16px;font-weight:400;line-height:22px;scroll-behavior:smooth;overscroll-behavior-x:none}
.w-user-menu ul>li li,.w-user-menu-username>span>span{font-size:1rem;overflow:hidden;text-overflow:ellipsis}
.w-user-menu ul ul{margin:0}
.w-user-menu ul+ul{margin-top:-10px;border-top:none!important}
.w-user-menu ul:not(:last-of-type){border-top:1px solid #eceff3;border-bottom:1px solid #eceff3}
.w-user-menu ul:last-of-type{margin-bottom:-7px}
.w-user-menu ul a{display:block;white-space:normal;color:#333333;padding:7px 15px;transition:color .15s ease-in-out}
body:not(.touched) .w-user-menu ul a:hover{color:#0097f5;border-bottom-color:transparent}
.w-user-menu-logout .w-user-menu ul a{color:#7d8da8}
body:not(.touched) .w-user-menu-logout .w-user-menu ul a:hover{color:#333333}
.w-user-menu ul .w-user-menu-submenu-trigger{display:inline-block}
.w-user-menu ul>li{padding:0}
.w-user-menu ul>li:not(.open-content)>.w-user-menu-submenu-content,.w-user-menu ul>li:not(.open-content)>ul{display:none}
.w-user-menu ul>li.open-content>ul{display:block}
.w-user-menu ul>li.open-content>.w-user-menu-submenu-content{display:block;margin-bottom:7px}
.w-user-menu ul>li.open-trigger .w-user-menu-submenu-trigger:after{-webkit-transform:rotate(135deg);transform:rotate(135deg)}
.w-user-menu ul>li li{text-transform:none;line-height:1.375}
.w-user-menu ul>li li a{white-space:nowrap;color:#333333}
body:not(.touched) .w-user-menu ul>li li a:hover{color:#333333}
.w-user-menu .w-user-menu-level ul>li.highlight{text-decoration:none;white-space:nowrap;color:#fff;background-color:#0097f5;border-radius: 8px;text-align: center;}
.w-user-menu .w-user-menu-level ul>li.highlight a{color:#fff;}
.w-user-menu-features-items:last-of-type{border-bottom:1px solid #eceff3}
.w-user-menu-content-outer{position:relative;overflow-x:hidden;overflow-y:auto;max-height:calc(100vh - 18px);-webkit-overflow-scrolling:touch;touch-action:manipulation;scroll-behavior:smooth;overscroll-behavior-x:none;-ms-scrollbar-arrow-color:#455c83;-ms-scrollbar-3dlight-color:#dadee6;-ms-scrollbar-border-color:#dadee6;-ms-scrollbar-shadow-color:#dadee6;-ms-overflow-style:-ms-autohiding-scrollbar;padding:0 10px 0 0}
.w-user-menu-content-outer::-webkit-scrollbar,.w-user-menu-content-outer::-webkit-scrollbar-thumb{-webkit-appearance:none;width:15px;height:15px;border-radius:13px;background-clip:padding-box;border:5px solid transparent}
.w-user-menu-content-outer::-webkit-scrollbar-track{border-radius:13px;background-clip:padding-box;border:5px solid transparent;background-color:#f4f5f8}
.w-user-menu-content-outer::-webkit-scrollbar-thumb{color:#d8dde5;box-shadow:inset 0 0 0 10px}
.w-user-menu-content-outer:hover::-webkit-scrollbar-thumb{color:#d8dde5}
.w-user-menu-content-outer:hover::-webkit-scrollbar-thumb:hover{color:#cbd1dc}
.w-user-menu-content-outer::-webkit-scrollbar-button:end:increment,.w-user-menu-content-outer::-webkit-scrollbar-button:start:decrement{height:1px;width:1px;display:block;background-color:transparent}
.w-user-menu-login a:after{right:15px;-webkit-transform:rotate(45deg);transition:color .15s ease-in-out,transform .15s ease-in-out}
.w-user-menu-login a{background-color:#f5f6f8;border-radius:4px}
.w-user-menu-login a{width:100%;position:relative;color:#333333;font-size:1rem;line-height:1.375;font-weight:500;display:block;margin:10px 0 0}
.w-user-menu-login a:after,.w-user-menu-login a:before{position:absolute;content:"";display:block}
body:not(.touched) .w-user-menu-login a:hover{color:#333333!important}
.w-user-menu-login a span{padding:0;}
.w-user-menu-login a:before{left:10px;top:6px;width:25px;height:25px;background-repeat:no-repeat;background-position:center center}
.w-user-menu-login a:after{top:12px;width:10px;height:10px;color:#888;border-color:currentColor;border-width:2px 2px 0 0;border-style:solid;-webkit-transform-origin:center center;transform-origin:center center;transform:rotate(45deg)}
.w-user-menu-level ul:first-of-type{border-top:none;}
.w-user-menu-level{transition:opacity .3s ease-in-out;overflow:hidden;}
.app .container{margin-top:80px;}
.bannerSwiper .swiper-slide{min-height:0vh;}
.bannerSwiper .swiper-slide .swiper-box{position:relative;}
.bannerSwiper .swiper-slide .swiper-box img{display:block;padding:0;margin:0; max-width:100vw}
.bannerSwiper .swiper-slide .swiper-box .info{position:absolute;left:0;bottom:0;color:#fff;padding:5px 14px;line-height:1.2;text-align:left; background:#616161b3}
.bannerSwiper .swiper-slide .swiper-box .info .title{font-size: 32px;margin-bottom:14px;}
.bannerSwiper .swiper-slide .swiper-box .info .subtitle{margin-bottom:14px;}
.bannerSwiper .swiper-slide .swiper-box .info .more{display:inline-block;width:60px;border: 1px solid #fff;text-align:center;padding:5px 0;border-radius: 5px;color:#fff;}
.bannerSwiper .swiper-pagination-bullet {
cursor: pointer;width: 14px;height: 14px;background: #e5e5e5;opacity: 1;margin-bottom: 20px !important;border-radius: 100px;transition: width 0.6s;display: inline-block;}
.bannerSwiper .swiper-pagination-bullet-active{background: #81D3F8;width: 42px;position: relative;overflow: hidden;}
.bannerSwiper .swiper-pagination .swiper-pagination-bullet-active span{content:"";display:block;position:absolute;background:var(--allcolor);width:0%;height:100%;left:0;}
.container .pdtit{padding:50px 14px;}
.container .tit{font-size: 40px;font-weight:bold;}
.container .ctit{text-align: center;}
.container .line{width:80px;height:8px;background:var(--allcolor);}
.container .ctit .line{margin:0 auto;}
.container .btn{display:inline-block;background-color: var(--allcolor);padding:10px 0;text-align:center;color:#fff;font-size: 24px;border-radius: 8px;}
.container .project{background:var(--allcolor);color:#fff;}
.container .project .tit{color:#fff;}
.container .project .line{background-color:#fff;margin-bottom:20px;}
.container .project .content ul{margin: 0;}
.container .about .content{color:#000;}
.container .about .content select{width:100%;line-height:60px;height: 60px;border-radius: 8px;border-color: #eee;background-color: #fff;font-size: 16px;color:#333;appearance:none;-moz-appearance:none;-webkit-appearance:none;background: url("../images/icon_down.png") no-repeat scroll right transparent;background-size: 18px;background-origin: content-box;}
.container .about .content .tab{width:100%;margin-top:20px;text-align:left;line-height:1.2;border:1px solid #ccc;color:#333;}
.container .about .content .tab th,.container .about .content .tab td{padding:20px 14px;}
.container .about .content .tab td{border-bottom:1px solid #ccc;}
.container .about .content .tab th{border-right:1px solid #ccc;border-bottom:1px solid #ccc;}
.container .about .content .tab tr:nth-child(odd){background-color:#f5f5f5;}
.container .about .content .more{width:192px;margin-top:30px;}
.container .product .banner img{width:100%;display:block;}
.container .product .ctit{position: relative;padding-left:0;padding-right:0;}
.container .product .bg{background-repeat: no-repeat;background-size: cover;background-position: center;position: absolute;left: 0;top: 0;bottom: 0;right: 0;z-index: -1;opacity: 0.5;}
.productSwiper{margin-top:30px;}
.productSwiper .swiper-slide{width: 70%;}
.productSwiper .swiper-slide .box{background-color:#fff;border:1px solid #d7d7d7;padding:30px 14px;}
.productSwiper .swiper-slide .box img{width:100%;}
.productSwiper .swiper-slide .box .hover{display:none;}
.productSwiper .swiper-pagination{position: relative;margin-top:15px;}
.productSwiper .swiper-pagination-bullet {cursor: pointer;width: 14px;height: 14px;background: transparent;opacity: 1;border-radius: 50%;transition: width 0.6s;display: inline-block;border:1px solid #333;}
.productSwiper .swiper-pagination-bullet-active{background: #333;}
.container .swiper-button-next,.container .swiper-button-prev{display:none}
.container .about .content .tab tr:nth-child(odd){background-color:#f5f5f5;}
.container .product .more{width:220px;margin-top:10px;}
.container .product .more .icon-right{width:32px;vertical-align: text-bottom;}
.container .news{background-color:#f5f5f5;padding-left:0;padding-right:0;}
.container .news .rt{display:none}
.container .news .content ul{padding-inline-start: 0;margin-top:30px;}
.container .news .content ul li{list-style-type:none;background-color:#fff;margin-bottom:10px;}
.container .news .content ul li .box{padding-top:20px;padding-bottom:20px;}
.container .news .content ul li .box .left{width:60%;float:left;}
.container .news .content ul li .box .right{width:36%;float:right;}
.container .news .content ul li .box .right img{width:100%;display:block;border-radius: 10px;}
.container .news .content .box.noimg .left{width:100%;}
.container .news .content .more{width:220px;margin:10px auto 0 auto;display: block;}
.container .news .content .more .icon-right{width:32px;vertical-align: text-bottom;}
.container .news .time{color:#888888;}
.container .contact{background-color:#fff;}
.container .contact .pdtit{padding-bottom:0}
.container .contact .content .box{text-align:center;margin-top:30px;}
.container .contact .content .box .one{width:50%;float: left;}
.container .contact .content .box .one .icon{width:100px;height:100px;border-radius: 50%;padding-top:18px;border: 1px solid #333;margin: 0 auto 10px auto;}
.container .contact .content p{text-align:left;line-height:1.2;}
.container .contact .map{margin-bottom:30px;}
.container .contact .map img{width:100%;}
.container .contact .qrbox .one{text-align:center;margin-bottom:30px;line-height:1;}
.container .contact .qrbox .one img{width:50%;}
.container .contact .fmenu{margin-top:15px;}
.container .contact .fmenu ul{padding-inline-start: 0;margin:30px 0 0 0;text-align:center;padding-bottom: 20px;}
.container .contact .fmenu ul li{list-style-type:none;display:inline-block;padding:5px 12px;}
.container .contact .fmenu ul li a{color: #333;}
.container.page .breadcrumb.pdtit{color:#ffffff;background-color:var(--allcolor);font-size: 14px;padding-top:10px;padding-bottom:10px;}
.container .breadcrumb a{color:#ffffff;}
.container .breadcrumb span{display:inline-block;margin:0 5px;}
.container.page .pdtit{padding-top:40px;padding-bottom: 40px;}
.container.page .pdtit .info{background-color:#f5f5f5;color:#888;margin:0;border-radius:8px;padding:20px;}
.container.page .pdtit .info h1{font-size: 40px;font-weight: 650;margin:0 0 10px 0;padding:0;line-height: 1.2;color: #333;}
.container.page .contact .content .box{margin-top:0;}
.aboutpage .project{background-color:#f5f5f5;color:#333;margin:30px 0;border-radius:8px;padding-bottom: 20px;position: relative;}
.aboutpage .project .stit{font-weight:bold;padding-top:20px;padding-left: 20px;margin-bottom:10px;}
.aboutpage .project .content{color:#333;}
.container.page .pic{padding:30px 14px;text-align:center;}
.container.page .pic img{width:100%;display:block;}
.aboutpage .project .pic{border:0;margin-bottom: -20px;padding-bottom: 0;}
.aboutpage .project .pic img{padding:0;}
.aboutpage .subtit{text-align:center;font-weight:bold;font-size: 32px;margin-top:50px;color:#333;}
.aboutpage .intro{margin-top:25px;padding-top:15px;}
.aboutpage .intro .pic{margin:30px 0;}
.productpage .productSwiper{margin-top:0;padding:0 14px 50px 14px;}
.productpage .productSwiper .swiper-slide{font-size:20px;text-align:center;width: 100%;margin-top:30px;}
.productpage .productSwiper .swiper-slide .box{position: relative;margin-bottom: 10px;}
.productpage .menu{background-color:#f5f5f5;color:#333;margin:0;padding-top:20px;padding-bottom:20px;font-size: 20px;}
.productpage .menu .stit{font-weight:bold;}
.productpage .menu ul{list-style-type: none;padding-inline-start: 20px;}
.productpage .menu ul li{white-space: nowrap;text-overflow: ellipsis;overflow: hidden;width: 90%;color: #888888;padding: 3px 0;font-size: 16px;}
.productpage .product .pbox .pdtit{margin-top: -40px;padding: 0;}
.productpage .product-info .pdtit .contentbox{font-size: 20px;}
.productpage .product-info .pdtit .pre{width:150px;margin:30px auto;display: block;}
.productpage .product-info .down{color: #888888}
.productpage .product-info .down .icon-down{width: 24px;margin-right:5px;}
.productpage .product-info .down a{color: var(--allcolor);}
.productpage .product-info .tag{padding:20px 0;}
.productpage .product-info .tag span{display:inline-block;margin:0 8px 0 0;}
.container .rightbox .ad img{width:100%}
.page .rightbox .qrbox{display:none}
.newspage{background-color:#f5f5f5;}
.newspage .news{padding-bottom: 20px;}
.newspage .news .pdtit{padding-bottom:0;}
.newspage .news .rt{display:block;}
.newspage .news .content ul li .box .left .text{font-size:20px;}
.newspage .news-info .tit{line-height:1.2;}
.newspage .news-info .tit h1{font-size: 40px;font-weight: 650;margin-top: 30px;}
.newspage .news-info .contentbox img{width:100%;}
.newspage .news-info .time{color: #888888;}
.newspage .news-info .time .avatar{display:inline-block;width:16px;height:16px;border-radius:50%;background-color:#888;margin-right:5px;vertical-align: text-bottom;}
.newspage .news-info .pdtit{padding:0 0 40px 0;}
.newspage .news-info .pinfo .left{background-color:#fff;padding:50px 14px;}
.newspage .news-info .rightbox{padding:0 14px;}
.contactpage .pdtit .line{margin-bottom:40px;}
.contactpage .pdtit .content p{line-height:1.2;margin: 10px 0;}
.contactpage .pdtit .map{margin:15px 0;}
.contactpage .pdtit .map img{width:100%;}
.page .form{margin:20px 0;}
.page .form input,.page .form textarea,.page .form .input{width:100%;border: 1px solid #d7d7d7;line-height:36px;margin-bottom:1rem;padding:0 10px;display:block;font-size: 16px;}
.page .form .code{padding:0;}
.page .form .code input{border:0;width:calc(100% - 120px);float:left;margin:0;}
.page .form .code .captcha{float:right;width:120px;background-color:#d7d7d7;height: 36px;}
.page .form .sub{font-size:16px;border: 0;width:120px;}
.swiper .swiper-slide .swiper-box{text-align:center;}

@-webkit-keyframes rotate{
 from {
  -webkit-transform:rotate(0)
 }
 to {
  -webkit-transform:rotate(360deg)
 }
}
@keyframes rotate{
 from {
  transform:rotate(0)
 }
 to {
  transform:rotate(360deg)
 }
}
.anim-rotate{-webkit-animation-name: rotate;animation-name: rotate;-webkit-animation-duration: 1s;animation-duration: 1s;-webkit-animation-timing-function: linear;animation-timing-function: linear;}
.anim-loop{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;}
.loading{text-align:center;padding:1rem 0;}
.loading img{width:2rem;height:2rem;}

footer,header,main{width:100%;margin:0;padding:0}
footer::after,header::after,main::after{clear:both}
footer{background-color: var(--allcolor);color:#fff;font-size: 14px;text-align:center;padding:20px 0;}
footer a{color:#fff; margin:0 0 0 3px}
.topbtn{cursor: pointer;background-color:var(--allcolor); opacity:.9;position: fixed;left: 14px;bottom: 28px;text-align:center;width:40px;height:40px;padding-top:8px;border-radius: 8px;z-index:999;}

.topbtn img{width:24px;}
.tool{position: fixed;right: 14px;bottom: 15px;text-align:center;width:68px;z-index:999;}

@keyframes see-animation{
0%{opacity:0;-webkit-transform:translate(0,30px);transform:translate(0,30px)}
100%{opacity:1;-webkit-transform:translate(0,0);transform:translate(0,0)}
}
@keyframes see-down{
0%{opacity:0;-webkit-transform:translate(0,-30px);transform:translate(0,-30px)}
100%{opacity:1;-webkit-transform:translate(0,0);transform:translate(0,0)}
}
@keyframes see-in{
0%{opacity:0;}
100%{opacity:1;}
}
@media all and (min-width:1100px){
.nav-holder{padding:0 20px}
.nav-tabs{padding:16px 28px}
.nav-tabs ol,.nav-tabs ul{display:block}
.nav-tabs-mobile{display:none}
.nav-menu>ul>li.nav-menu-item-user{display: none;}
.nav-role-hp .nav-menu>ul>li.nav-menu-item-login{display:inline-block}
.nav-back-link{padding:16px 20px 0}
.nav-title h1,.nav-title>h3,.nav-title>h2{font-size: 28px;}
.nav-title .intro{display:block;}
.nav-logo{width:63px;height:64px;}
.app .container{margin-top:107px;}
.swiper .swiper-slide .swiper-box img{width: 100%;height:100%;max-height:88vh;margin:0 auto;}
.swiper .swiper-slide .swiper-box .info{padding:5px 8%;}
.container .content{line-height:32px;}
.container .lf{float:left}
.container .rt{float:right}
.container .pdtit,.container .product .ctit{padding:50px 8%;}
.container .project .content{width:60%;}
.container .project .content ul{float:left;width:50%;font-size: 16px;line-height: 32px;}
.container .project .lf{width:30%;padding-top:20px;}
/*.container .about{background:url(../images/bg2.png) no-repeat right;background-size: 36%;background-position-y: 20%;}*/
.container .about .lf{width:60%}
.container .about .content .tab th, .container .about .content .tab td{padding: 30px 14px;}
.container .product .banner{position: relative;height: 6vw; z-index:1}
.container .product .banner img{position: absolute;right: 8%;width: auto;height:18vw;z-index:-1;top:-12vw;}
.container .productSwiper .swiper-slide{width:30%}
.container .productSwiper .swiper-slide .box .hover{z-index:1;position: absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.7);color:#fff;padding: 0 14px;font-size: 16px;}
.container .productSwiper .swiper-slide .box .hover .text{width:100%;height:100%;display:flex;text-align:center; align-content: center;
flex-wrap: wrap;justify-content: center;flex-direction: column;}
.container .productSwiper .swiper-slide .box .hover .text h3{display:block;text-align:center;font-size: 32px;line-height:1.6;margin-block: revert;}
.container .productSwiper .swiper-slide .box:hover .hover{display:block;}
.container .swiper-button-next,.container .swiper-button-prev{display:block;}
.container .swiper-button-next{right:5%;color:#888888;}
.container .swiper-button-prev{left:5%;color:#888888;}
.container .swiper-button-prev::after,.container .swiper-button-next::after{font-size:60px;font-weight:bold;}
.container .news .lf{width:70%;}
.container .news .content ul li .box .left{width:70%;}
.container .news .content ul li .box .left .text{min-height:8vw;font-size: 24px;}
.container .news .content ul li .box .right{width:26%;}
.container .news .content ul li .box{padding:30px 20px;}
.container .news .rt{display:block;width:27.5%;margin-top: 30px;}
.container .news .rt .content{padding:30px 14px;background-color:#fff;}
.container .news .rt .name{font-size: 20px;color: #888888;border-bottom: 1px solid #d7d7d7;padding-bottom:15px;}
.container .news .rt .name h1{font-size:28px;font-weight:bold;line-height:1;margin: 0;color: #333;}
.container .news .rt .content p{line-height:1.3;font-size: 20px;}
.container .rightbox{width:27.5%;}
.container .rightbox .content{background-color: #fff;margin-bottom: 2px;}
.container .rightbox .qrbox .one{text-align:center;margin-bottom:30px;line-height:1;}
.container .rightbox .qrbox .one img{width:65%;}
.container .contact .content{font-size: 20px;padding-bottom:30px;}
.container .contact .content .lf{width:38%;}
.container .contact .content .rt{width:60%;padding-top:20px;}
.container .contact .qrbox{width:520px;margin:auto;}
.container .contact .qrbox .one{float:left;width:200px;margin:0 30px;}
.container .contact .qrbox .one img{width:100%}
.container .contact .fmenu{font-size: 16px;margin:40px 0;}
footer{font-size: 16px;}




.container .project .content,.container .contact .qrbox .one:last-child,.container .product .banner img{-webkit-transform:translate(15px,0);transform:translate(15px,0);transition:transform 1s ease-in-out;}
.container .project .lf,.container .contact .qrbox .one:first-child{-webkit-transform:translate(-15px,0);transform:translate(-15px,0);transition:transform 1s ease-in-out}
.container .project.see .lf,.container .project.see .content,.container .contact1.see .lf,.container .contact1.see .rt,.container .contact .qrbox.see .one:first-child,.container .contact .qrbox.see .one:last-child,.container.page .about .content,.container .product .banner.see img{-webkit-transform: translate(0,0);transform: translate(0,0);}
.container .product .productSwiper .swiper-slide,.container .news .rightbox{opacity: 1;transition: transform 2s ease-in-out,opacity .3s ease-in-out;}
.container .product.see .productSwiper .swiper-slide:first-child{animation: see-animation 1s 0s ease forwards;}
.container .product.see .productSwiper .swiper-slide:nth-child(2){animation: see-animation 1s .25s ease forwards;}
.container .product.see .productSwiper .swiper-slide:nth-child(3){animation: see-animation 1s .5s ease forwards;}
.container .about .content{opacity: 1;transition: transform 2s ease-in-out,opacity .3s ease-in-out;}
.container .about.see .content{animation: see-down 1s 0s ease forwards;}
.container .product.business.see .productSwiper .swiper-slide:first-child{animation: see-down 1s 0s ease forwards;}
.container .product.business.see .productSwiper .swiper-slide:nth-child(2){animation: see-down 1s .25s ease forwards;}
.container .product.business.see .productSwiper .swiper-slide:nth-child(3){animation: see-down 1s .5s ease forwards;}
.container .news .rightbox{opacity: 0;transition: transform 2s ease-in-out,opacity .3s ease-in-out;}
.container .news.see .rightbox{animation: see-in 1s 0s ease forwards;}

.aboutpage .about{background:url('')}
.aboutpage .about .content{opacity: 1;}
.aboutpage .about .project .lf{width:65%;padding-top:0;}
.aboutpage .project .pic{width:35%;position: absolute;right: 20px;bottom: 0;padding:0;margin-bottom:0;}
.aboutpage .about .pic{width:30%;margin-left:3%;}
.aboutpage .about .intro .pic{float:left;height:24vw;display: flex;align-content: center;flex-direction: column;justify-content: center;}
.aboutpage .about .intro .pic img{vertical-align: middle;}
.aboutpage .about .intro .pic:nth-child(2){margin-left:0;}
.container.page .contact .content .box{margin-top: 30px;}
.productpage .product .productSwiper .swiper-slide{float:left;opacity: 1;padding:0;}
.productpage .product .pbox .pdtit{margin-top: -40px;padding: 50px 8%;}
.productpage .product .pbox .productSwiper.rt{width:74%;}
.productpage .productSwiper .swiper-slide{margin:0 3% 30px 0;}
.productpage .menu.lf{width:22%; background-color: transparent;border: 1px solid #d7d7d7;}
.productpage .pinfo .lf{width:70%}
.page .rightbox .qrbox{display:block;}
.newspage .news .rightbox{opacity: 1;}
.newspage .news .pcbox{padding:0 8%;}
.newspage .news-info .pdtit{padding:50px 8%;}
.newspage .news-info .pinfo .left{background-color:#fff;padding:30px;}
.newspage .news-info .rightbox{padding:0;}
.contactpage .pdtit .lf{width:34%;}
.contactpage .pdtit .rt{width:58%;}
}
@media all and (min-width:1230px){
.nav-holder{padding:3px 60px}
.nav-tabs{padding:16px 32px 16px 64px}
.nav-back-link{padding:16px 45px 0}
}
@media all and (min-width:1230px) and (min-height:480px){.nav-role-wiz .nav-tabs{padding:16px 32px 16px 64px}
.w-user-menu{right:35px}
}
@media all and (min-width:1366px) and (min-height:600px){body{width:100%;width:100vw;overflow-x:hidden}
}
@media (max-width: 760px){
.toolpc{ right:0}
}