body,html {margin:0; padding:0; width:100%; height:100%;}
@media  (min-width:1600px){
    .container {max-width:1300px!important;}
    .carousel-indicators {bottom:130px;}
    .carousel-indicators li{ width:12px; height:12px; border-radius: 6px}
    .carousel-indicators .active{ width:50px; height:12px; border-radius: 6px}
    .carousel-control-prev {font-size: 85px;}
    .carousel-control-next {font-size:85px;}
    .nav-link {margin-top:6px; padding:10px 40px; font-size: 18px;}
    .nav-link {color:#000000;}
    .nav-pills .nav-link.active, .nav-pills .show > .nav-link {background-color:#28a7e1;}
    .wh100 { width:100%; height:100%;}
    .banner {min-height:984px;}
    .menu_bg {border-radius: 10px; margin-top:30px; padding:15px 20px;}
    .menu_bg .logo {width:180px;display: inline-block;}
    .menu_bg .logo img {width:100%;}
    .menu_bg .menu {display: block; float: right; vertical-align: top;}
    .b-r10 {border-radius:10px}
    .p-t8 {padding-top:10%!important;}
    .p-30 {padding:50px; height:520px;}
    .color {color:#ffffff!important;}
    .br{border-right:1px #ededed solid;}
    .bbr{border-bottom:1px #ededed solid; border-right:1px #ededed solid;}
    .bb{border-bottom:1px #ededed solid;}
    .title{}
    .title h2{ font-size:32px; text-align: center; color:#333333;}
    .title p{font-size: 20px; text-align: center; color:#868686;}
    .technique-bg {background-image: url("../img/technique-bg.png"); background-size: 100% 100%; }
    .technique-bg .box-bg01 {height:490px; background-image: url("../img/box-bg01.png"); background-repeat: no-repeat; background-size:100% 100%; background-position: top center;  background-color: #87d824; border-radius: 10px; padding:285px 25px 25px 25px;}
    .technique-bg .box-bg02 {height:490px; background-image: url("../img/box-bg02.png"); background-repeat: no-repeat; background-size:100% 100%; background-position: bottom center;  background-color: #e6ad44; border-radius: 10px; padding:25px;}
    .technique-bg .box-bg03 {height:490px; background-image: url("../img/box-bg03.png"); background-repeat: no-repeat; background-size:100% 100%; background-position: top center;  background-color: #48bee1; border-radius: 10px; padding:285px 25px 25px 25px;}
    .technique-bg .box-bg04 {height:490px; background-image: url("../img/box-bg04.png"); background-repeat: no-repeat; background-size:100% 100%; background-position: bottom center;  background-color: #e6513d; border-radius: 10px; padding:25px;}
    .technique-bg .row .col-3 {padding:10px!important;}
    .technique-bg .row h4 {font-size: 32px; color: #ffffff; font-weight: bold;}
    .technique-bg .row p {font-size: 16px; color: #ffffff; }

    .service-bg  {background-image: url("../img/service-bg.png"); background-size:  100% 100%;}
    .service-bg img {width:100%;}
    .advantage-bg {background-image: url("../img/advantage-bg.png"); background-size: 100% 100%;}
    .advantage-bg .height{height:610px;}
    .advantage-bg .row div {text-align: center; padding-top: 10px;}
    .advantage-bg .row h3 {font-size: 16px; color: #000; text-align: center; font-weight: bold; }
    .advantage-bg .row p { font-size: 14px; color: #868686; text-align: center;}

    .company-bg  {background-image: url("../img/company-bg.png"); background-size: 100% 100%;}
    .company-bg .height{height:610px;}
    .company-bg h1 {font-size: 34px; color: #000;}
    .company-bg h1 span {font-size: 22px; color: #868686; font-weight: initial; font-family: Arial;}
    .company-bg p {margin-top: 20px!important; line-height:30px; font-size: 16px; line-height:24px;color: #868686; text-indent:2em;}
    .company-bg img {width:100%;}

    .footer_bg {height:85px; border-radius: 10px 10px 0px 0px; background-color: #000; opacity: 0.2;}
    .footer-txt h3{color:#fff; font-size:18px; margin-bottom: 5px!important;;}
    .footer-txt p{color:#fff; font-size:16px; text-indent:2em each-line;}
    .footer-txt .col-4{text-align: right;}
    .m-menu{display: none;}
    .m-footer{display: none;}
}
@media  (min-width:990px) and (max-width: 1600px){
    .container {max-width:1000px!important;}
    .carousel-indicators {bottom:17%;}
    .carousel-indicators li{ width:12px; height:12px; border-radius: 6px}
    .carousel-indicators .active{ width:50px; height:12px; border-radius: 6px}
    .nav-link {margin-top:6px; padding:10px 40px; font-size: 18px;}
    .carousel-control-prev {font-size: 85px;}
    .carousel-control-next {font-size:85px;}
    .nav-link {color:#000000;}
    .nav-pills .nav-link.active, .nav-pills .show > .nav-link {background-color:#28a7e1;}
    .wh100 { width:100%; height:100%;}
    .banner {min-height:810px;}
    .menu_bg {border-radius: 10px; margin-top:30px; padding:10px 20px;}
    .menu_bg .logo {display: inline-block;}
    .menu_bg .menu {display: block; float: right; vertical-align: top;}
    .b-r10 {border-radius:10px}
    .p-t8 {padding-top:9%!important;}
    .p-30 {padding:40px; height:520px;}
    .color {color:#ffffff!important;}
    .br{border-right:1px #ededed solid;}
    .bbr{border-bottom:1px #ededed solid; border-right:1px #ededed solid;}
    .bb{border-bottom:1px #ededed solid;}
    .title{}
    .title h2{ font-size:32px; text-align: center; color:#333333;}
    .title p{font-size: 16px; text-align: center; color:#868686;}
    .technique-bg {background-image: url("../img/technique-bg.png"); background-size: 100% 100%; }
    .technique-bg .box-bg01 {height:410px; background-image: url("../img/box-bg01.png"); background-repeat: no-repeat; background-color: #87d824; border-radius: 10px; padding:230px 25px 25px 25px;}
    .technique-bg .box-bg02 {height:410px; background-image: url("../img/box-bg02.png"); background-repeat: no-repeat; background-color: #e6ad44; border-radius: 10px; padding:25px;}
    .technique-bg .box-bg03 {height:410px; background-image: url("../img/box-bg03.png"); background-repeat: no-repeat; background-color: #48bee1; border-radius: 10px; padding:230px 25px 25px 25px;}
    .technique-bg .box-bg04 {height:410px; background-image: url("../img/box-bg04.png"); background-repeat: no-repeat; background-color: #e6513d; border-radius: 10px; padding:25px;}
    .technique-bg .row .col-3 {padding:10px!important;}
    .technique-bg .row h4 {font-size: 24px; color: #ffffff; font-weight: bold;}
    .technique-bg .row p {font-size: 14px; color: #ffffff; }

    .service-bg  {background-image: url("../img/service-bg.png"); background-size:  100% 100%;}
    .advantage-bg {background-image: url("../img/advantage-bg.png"); background-size: 100% 100%;}
    .advantage-bg .height{height:520px;}
    .advantage-bg .row div {text-align: center;}
    .advantage-bg .row h3 {font-size: 16px; color: #000; text-align: center; font-weight: bold;}
    .advantage-bg .row p {font-size: 14px; color: #868686; text-align: center;}

    .company-bg  {background-image: url("../img/company-bg.png"); background-size: 100% 100%;}
    .company-bg .height{height:520px;}
    .company-bg h1 {font-size: 32px; color: #000;}
    .company-bg h1 span {font-size: 20px; color: #868686; font-weight: initial; font-family: Arial;}
    .company-bg p {font-size: 12px; color: #868686; text-indent:2em;}
    .company-bg img {width:100%;}

    .footer_bg {height:85px; border-radius: 10px 10px 0px 0px; background-color: #000; opacity: 0.2;}
    .footer-txt {padding:15px 25px 15px 25px!important;}
    .footer-txt h3{color:#fff; font-size:14px; margin-bottom: 5px!important;;}
    .footer-txt p{color:#fff; font-size:12px; text-indent:2em each-line;}
    .footer-txt .col-4{text-align: right;}
    .m-menu{display: none;}
    .m-footer {display: none;}
}
@media screen and (min-width: 768px) and (max-width: 989px) {
    .logo {width:11rem; padding:0.3rem 0;}
    .logo img {width:100%;}
    .navbar-toggler {color:#868686!important; border: 1px #868686 solid!important;}
    .navbar-toggler .fa {font-size: 2rem!important;}
    .nav-pills {background-color: #ededed;}
    .nav-item {width:20%; text-align:center;font-size: 1.5rem; margin-bottom: 1rem;}
    .nav-item span{float: right;}
    .banner {height: 25rem; background-size:170%;}
    #index {margin-top:6rem;}
    .carousel-control-prev {font-size: 5rem;}
    .carousel-control-next {font-size:5rem;}
    .technique-bg {background-image: url("../img/technique-bg.png"); background-size: 100% 100%; }
    .technique-bg .box-bg01 {background-color: #87d824; border-radius:1rem; padding:2rem; height: 15rem;}
    .technique-bg .box-bg02 {background-color: #e6ad44; border-radius:1rem; padding:2rem; height: 15rem;}
    .technique-bg .box-bg03 {background-color: #48bee1; border-radius:1rem; padding:2rem; height: 15rem; margin-top: 1rem;}
    .technique-bg .box-bg04 {background-color: #e6513d; border-radius:1rem; padding:2rem; height: 15rem; margin-top: 1rem;}
    .technique-bg .row h4 {font-size: 1.5rem; color: #ffffff; font-weight: bold;}
    .technique-bg .row p {font-size: 1.2rem; color: #ffffff; }

    .service-bg  {background-image: url("../img/service-bg.png"); background-size:  100% 100%;}
    .service-bg  img {width:100%;}

    .advantage-bg {background-image: url("../img/advantage-bg.png"); background-size: 100% 100%;}
    .advantage-bg .row div {text-align: center;}
    .advantage-bg .row h3 {font-size: 1.2rem; color: #000; text-align: center; font-weight: bold;}
    .advantage-bg .row p {font-size: 1rem; color: #868686; text-align: center;}

    .br{border-right:1px #ededed solid;}
    .bbr{border-bottom:1px #ededed solid; border-right:1px #ededed solid;}
    .bb{border-bottom:1px #ededed solid;}
    .company-bg  {background-image: url("../img/company-bg.png"); background-size: 100% 100%;}
    .company-bg img  {width: 100%;}
    .title{}
    .title h2{ font-size:2rem; text-align: center; color:#333333;}
    .title p{font-size: 1rem; text-align: center; color:#868686;}
    .color {color:#ffffff!important;}

    .company-bg h1 {font-size: 2rem; color: #000;}
    .company-bg h1 span {font-size: 1.4rem; color: #868686; font-weight: initial; font-family: Arial;}
    .company-bg p {font-size: 1.2rem; color: #868686; text-indent:2em;}
    .company-bg img {width:100%; height:20rem;}
    .footer-txt {background-color: #333;}
    .footer-txt div {color:#fff; font-size:1.6rem; text-align: center; }
    .footer-txt div span { margin: 1.5rem 1rem 1.5rem 0;}
    .footer-txt h3{color:#fff; font-size:1.3rem; margin-bottom: 1rem!important;  margin-top: 1rem!important;text-align: center;}
    .footer-txt p{color:#fff; font-size:1.2rem; text-indent:2em each-line; text-align: center;}
    .p-t8 {padding:12% 0!important;}
    .b-r10 {border-radius:1rem;}
    .p-30 {padding:2rem; }
    .pc-footer {display: none;}
    .pc-menu {display: none;}
}
@media only screen and (min-width: 350px) and (max-width: 767px){
    .logo {width:11rem; padding:0.3rem 0;}
    .logo img {width:100%;}
    .navbar-toggler {color:#868686!important; border: 1px #868686 solid!important;}
    .navbar-toggler .fa {font-size: 2rem!important;}
    .nav-pills {background-color: #ededed;}
    .nav-item {width:20%; text-align:center;font-size: 1.5rem; margin-bottom: 1rem;}
    .nav-item span{float: right;}
    .banner {height: 16rem; background-size:170%;}
    #index {margin-top:6rem;}
    .carousel-control-prev {font-size: 5rem;}
    .carousel-control-next {font-size:5rem;}
    .technique-bg {background-image: url("../img/technique-bg.png"); background-size: 100% 100%; }
    .technique-bg .box-bg01 {background-color: #87d824; border-radius:1rem; padding:2rem; height: 15rem;}
    .technique-bg .box-bg02 {background-color: #e6ad44; border-radius:1rem; padding:2rem; height: 15rem;}
    .technique-bg .box-bg03 {background-color: #48bee1; border-radius:1rem; padding:2rem; height: 15rem; margin-top: 1rem;}
    .technique-bg .box-bg04 {background-color: #e6513d; border-radius:1rem; padding:2rem; height: 15rem; margin-top: 1rem;}
    .technique-bg .row h4 {font-size: 1.5rem; color: #ffffff; font-weight: bold;}
    .technique-bg .row p {font-size: 1.2rem; color: #ffffff; }

    .service-bg  {background-image: url("../img/service-bg.png"); background-size:  100% 100%;}
    .service-bg  img {width:100%;}

    .advantage-bg {background-image: url("../img/advantage-bg.png"); background-size: 100% 100%;}
    .advantage-bg .row div {text-align: center;}
    .advantage-bg .row h3 {font-size: 1.2rem; color: #000; text-align: center; font-weight: bold;}
    .advantage-bg .row p {font-size: 1rem; color: #868686; text-align: center;}

    .br{border-right:1px #ededed solid;}
    .bbr{border-bottom:1px #ededed solid; border-right:1px #ededed solid;}
    .bb{border-bottom:1px #ededed solid;}
    .company-bg  {background-image: url("../img/company-bg.png"); background-size: 100% 100%;}
    .company-bg img  {width: 100%;}
    .title{}
    .title h2{ font-size:2rem; text-align: center; color:#333333;}
    .title p{font-size: 1rem; text-align: center; color:#868686;}
    .color {color:#ffffff!important;}

    .company-bg h1 {font-size: 2rem; color: #000;}
    .company-bg h1 span {font-size: 1.4rem; color: #868686; font-weight: initial; font-family: Arial;}
    .company-bg p {font-size: 1.2rem; color: #868686; text-indent:2em;}
    .company-bg img {width:100%; height:20rem;}
    .footer-txt {background-color: #333;}
    .footer-txt div {color:#fff; font-size:1.6rem; text-align: center; }
    .footer-txt div span { margin: 1.5rem 1rem 1.5rem 0;}
    .footer-txt h3{color:#fff; font-size:1.3rem; margin-bottom: 1rem!important;  margin-top: 1rem!important;text-align: center;}
    .footer-txt p{color:#fff; font-size:1.2rem; text-indent:2em each-line; text-align: center;}
    .p-t8 {padding:12% 0!important;}
    .b-r10 {border-radius:1rem;}
    .p-30 {padding:2rem; }
    .pc-footer {display: none;}
    .pc-menu {display: none;}
}