﻿@charset "utf-8";
/**/
body, div, canvas{-webkit-image-rendering: optimizeSpeed;-webkit-interpolation-mode: nearest-neighbor;}
html,body{}
body{background-size:auto; background-repeat:repeat-y; background-position:top center;  background-attachment:fixed}
*{-webkit-tap-highlight-color:rgba(0,0,0,0);}
input[type="submit"],
input[type="reset"],
input[type="button"],
button,select{ -webkit-appearance: none; }

.wap-blank-height-0{clear:both;visibility:hidden;height:0!important;line-height:0!important; float: none!important}
.wap-blank-height-5{clear:both;overflow:hidden;height:5px;}
.wap-blank-height-8{clear:both;overflow:hidden;height:8px;}
.wap-blank-height-10{clear:both;overflow:hidden;height:10px;}
.wap-blank-height-12{clear:both;overflow:hidden;height:12px;}
.wap-blank-height-14{clear:both;overflow:hidden;height:14px;}
.wap-blank-height-15{clear:both;overflow:hidden;height:15px;}
.wap-blank-height-18{clear:both;overflow:hidden;height:18px;}
.wap-blank-height-20{clear:both;overflow:hidden;height:20px;}
.wap-blank-height-25{clear:both;overflow:hidden;height:25px;}
.wap-blank-height-28{clear:both;overflow:hidden;height:28px;}
.wap-blank-height-30{clear:both;overflow:hidden;height:30px;}
.wap-blank-height-35{clear:both;overflow:hidden;height:35px;}
.wap-blank-height-40{clear:both;overflow:hidden;height:40px;}
.wap-blank-height-42{clear:both;overflow:hidden;height:42px;}
.wap-blank-height-45{clear:both;overflow:hidden;height:45px;}
.wap-blank-height-50{clear:both;overflow:hidden;height:50px;}
.wap-blank-height-60{clear:both;overflow:hidden;height:60px;}
.wap-blank-height-70{clear:both;overflow:hidden;height:70px;}
.wap-blank-height-80{clear:both;overflow:hidden;height:80px;}
.wap-blank-height-90{clear:both;overflow:hidden;height:90px;}
.wap-blank-height-94{clear:both;overflow:hidden;height:94px;}
.wap-blank-height-100{clear:both;overflow:hidden;height:100px;}

.wap-show,#wap-show,.wap-display-block{ display:block!important;}
.pc-show,#pc-show{ display:none!important;}
.btn-width-160{ width: 120px; height: 42px; line-height:42px; padding:0; font-size: 12px; }

.wap-z-index-0{ z-index: 0!important;}
.wap-z-index-1{ z-index: 1!important;}
.wap-z-index-2{ z-index: 2!important;}

.wap-text-center{ text-align: center;}
.wap-float-none{ float: none!important}
.wap-float-left{ float: left}
.wap-border-no{ border: none!important}
.wap-border-1{ border:1px solid #d3d7dd}

.wap-position-relative{ position: relative!important};

.wap-opacity-5{ opacity: .5}

.wap-font-weight-300{ font-weight: 300}
.wap-font-weight-600{ font-weight: 600}

.wap-font-size-10{ font-size: 10px}
.wap-font-size-12{ font-size: 12px}
.wap-font-size-13{ font-size: 13px}
.wap-font-size-14{ font-size: 14px}
.wap-font-size-15{ font-size: 15px}
.wap-font-size-16{ font-size: 16px}
.wap-font-size-18{ font-size: 18px}
.wap-font-size-20{ font-size: 20px}
.wap-font-size-24{ font-size: 24px}
.wap-font-size-28{ font-size: 28px}
.wap-font-size-30{ font-size: 30px}
.wap-font-size-40{ font-size: 40px}

.wap-line-height-auto{ line-height:initial!important;}
.wap-line-height-12{ line-height:12px!important;}
.wap-line-height-22{ line-height: 22px!important;}
.wap-line-height-25{ line-height: 25px!important;}
.wap-line-height-30{ line-height: 30px!important;}
.wap-line-height-32{ line-height: 32px!important;}
.wap-line-height-35{ line-height: 35px!important;}
.wap-line-height-40{ line-height: 40px!important;}
.wap-letter-spacing-1{letter-spacing:1px}
.wap-letter-spacing-2{letter-spacing:2px}
.wap-letter-spacing-3{letter-spacing:3px}
.wap-letter-spacing-10{letter-spacing:10px}
.wap-letter-spacing-14{letter-spacing:14px}
.wap-letter-spacing-20{letter-spacing:20px}

.wap-height-100vh{height:100vh;}
.wap-height-50vh{height:50vh;}
.wap-height-30vh{height:30vh;}

.wap-width-pp-100{ width: 100%!important}
.wap-width-pp-90{ width: 90%!important}
.wap-width-pp-80{ width: 80%!important}
.wap-width-pp-70{ width: 70%!important}
.wap-width-pp-60{ width: 60%!important}
.wap-width-200{width: 200px!important}
.wap-width-100{width: 100px!important}
.wap-width-80{width: 80px!important}
.wap-width-auto{width: auto!important}

.wap-margin-auto{ margin: auto!important;}
.wap-margin-0{ margin: 0px!important;}
.wap-margin-4{ margin: 4px!important;}
.wap-margin-right-4{ margin-right: 4px!important;}
.wap-margin-right-10{ margin-right: 10px!important;}
.wap-margin-right-14{ margin-right: 14px!important;}
.wap-margin-right-20{ margin-right: 20px!important;}
.wap-margin-right-24{ margin-right: 24px!important;}
.wap-margin-right-40{ margin-right: 40px!important;}
.wap-margin-bottom-4{ margin-bottom: 4px!important;}
.wap-margin-bottom-10{ margin-bottom: 10px!important;}
.wap-margin-bottom-14{ margin-bottom: 14px!important;}
.wap-margin-bottom-20{ margin-bottom: 20px!important;}
.wap-margin-bottom-30{ margin-bottom: 30px!important;}
.wap-margin-bottom-34{ margin-bottom: 34px!important;}
.wap-margin-bottom-44{ margin-bottom: 44px!important;}

.wap-padding-top-0{ padding-top: 0px!important;}
.wap-padding-top-4{ padding-top: 4px!important;}
.wap-padding-top-10{ padding-top: 10px!important;}
.wap-padding-top-20{ padding-top: 20px!important;}
.wap-padding-top-50{padding-top: 50px!important}
.wap-padding-left-0{ padding-left: 0!important;}
.wap-padding-left-10{ padding-left: 10px;}
.wap-padding-left-20{ padding-left: 20px;}
.wap-padding-right-0{ padding-right: 0!important;}
.wap-padding-bottom-0{ padding-bottom: 0!important;}
.wap-padding-bottom-10{ padding-bottom: 10px!important;;}
.wap-padding-bottom-20{ padding-bottom: 20px!important;;}
.wap-padding-bottom-30{ padding-bottom: 30px!important;;}
.wap-padding-bottom-40{ padding-bottom: 40px!important;;}
.wap-padding-bottom-50{ padding-bottom: 50px!important;;}
.wap-padding-bottom-100{ padding-bottom: 100px!important;;}
.wap-padding-bottom-150{ padding-bottom: 150px!important;;}
.wap-padding-bottom-160{ padding-bottom: 160px!important;;}
.wap-padding-bottom-180{ padding-bottom: 180px!important;;}
.wap-padding-0{ padding: 0!important;}
.wap-padding-10{ padding: 10px!important;}
.wap-padding-lr-4{ padding-left: 4px!important; padding-right: 4px!important;}
.wap-padding-lr-20{ padding-left: 20px!important; padding-right: 20px!important;}
.wap-padding-tb-20{ padding-top: 20px!important; padding-bottom: 20px!important;}
.wap-padding-tb-30{ padding-top: 30px!important; padding-bottom: 30px!important;}
.wap-padding-tb-40{ padding-top: 40px!important; padding-bottom:40px!important;}

.wap-color-black{ color:#303133}
.wap-color-white{ color: white}
.wap-color-gray{ color:#909399}
.wap-color-gray-2{ color:#606266}
.wap-color-blue{ color:#18126a}
.wap-color-pink{ color:#f19ec2}

.wap-ul-li-width-pp-100>li{ width: 100%!important}
.wap-ul-li-width-pp-50>li{ width: 50%!important}
.wap-ul-li-width-pp-33>li{ width: 33.33%!important}
.wap-ul-li-width-pp-25>li{ width: 25%!important}
.wap-column-width-pp-100>.column{ width: 100%!important}
.wap-column-width-pp-50>.column{ width: 50%!important}
.wap-column-width-pp-33>.column{ width: 33.33%!important}
.wap-column-width-pp-25>.column{ width: 25%!important}

.wap-btn-white-link{ border:1px solid white; background: transparent; color: white!important}
.wap-btn-white-link:hover,.btn-white-link:focus{color: #514b99!important; border-color: #fff!important; background: rgba(255, 255, 255, 0.7);}

.wap-height-100vh{height:100vh;}
.wap-height-50vh{height:50vh;}
.wap-height-auto{ height: auto!important}
.wap-height-20{ height: 20px!important}
.wap-height-24{ height: 24px!important}
.wap-height-26{ height: 26px!important}
.wap-height-30{ height: 30px!important}
.wap-height-40{ height: 40px!important}
.wap-height-50{ height: 50px!important}
.wap-height-60{ height: 60px!important}
.wap-height-70{ height: 70px!important}

.table.wap-table-scroll {
    display: block;
    overflow-x: auto;
    padding-bottom: 0.75rem;
    white-space: nowrap;
}

.casebox>.case-about-box,.casebox>.case-photo-box{ width: 100%; height: 100%; position: relative; float: left; overflow: hidden;}
.casebox>.case-photo-box{ height: 68%;}
.casebox>.case-about-box{ height: 32%; position: absolute; bottom:0; left: 0; background-color: #fff;}
.casebox>.case-about-box .case-info h2{font-size: 22px; font-weight: 900; }
.casebox>.case-about-box .case-info p{margin-bottom: 1.5em;  font-size: 13px}
.header .colorlib-logo {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: .6em;
    padding: 30px 10px; opacity: .9; display: none;
}
.btn-view{font-size: 12px;}
.bold {position: absolute; top: inherit;  bottom: 0; left: 5%; font-size: 25vw; margin-bottom: 0; }
.casebox>.case-point{ top:50%; margin-top: 130px !important; left: 50%; margin-left: -40px !important; transform: rotate(45deg); border-radius: 5%; display: none;}

.case-photo-box .swiper{ width:54%; height: auto; margin-left: 23%;}

.footer-about{margin-top: -200px;}
.footer-about>h2{ font-size: 20px;}
.footer-about>p{ font-size: 12px;}
.footer-bq{font-size: 10px; line-height: 1.8;}    
.footer-container{ width: 100%; max-width: 1600px; margin: auto; margin-bottom: 100px;}
.footer-container h2{ margin-bottom: 2em; font-size: 14px;}
.footer-container .column{ width: 100% !important;}
.footer-cqq{ bottom:2%; font-size: 14px;}

.btn-view{font-size: 12px; padding: 2px 7px 2px 7px; margin-bottom: 5px; letter-spacing: 0;}

/**/
@media screen and (max-width: 800px){
}
@media screen and (max-width: 660px){
}
/*wapss=========================================*/
@media screen and (max-width: 560px){
}
@media screen and (max-width: 450px){
}
@media screen and (max-width: 380px){
}	
@media screen and (max-width: 320px){
}
@media screen and (max-width: 310px){
}

