﻿@charset "utf-8";
@media (min-width: 576px){

}
@media (min-width: 768px){
    .nav-cart-info .nav-cart-list {
        width: 370px;
    }
    p{
        font-size:18px;
    }
    h5 {
        font-size: 20px;
    }
    .article-list .item .info {
        color: #000;
        font-size: 18px;
    }


}
@media (min-width: 992px) {
    .side1.col-lg-3 {
        width: 20%;
    }

    .content.col-lg-9 {
        width: 80%;
    }
}
@media (max-width: 1800px) {
    .ab_box_2 .tit {
        width: 60%;
    }
    .ab_box_2 {
        padding: 3% 5%;
   
    }
    .needs-validation {
        width: 80%;
      
    }
    .ab_three {
        gap: 0 30px;
   
    }
    .ab_three .ab_three_icon {
        width: calc((100% - 60px) / 3);
    }
    .bu_ok .ab_bg01 {
        right: -3%;
  
    }
    .home_service ul li ul {
        padding-left: 0;
    }
}


    @media (max-width: 1199px) {
.footer .footer_mid {
    width: 45%;
}
.footer .footer_right {
    width: 30%;
}
        .ab_box_2 .ab_bg03 {
            width: 40%;
        }
        .bu_ok .ab_bg01 {
            right: -12%;
        }
        .footer .foter_left {
            padding-right: 5%;
        }
        .ser_solid .ser_solid_1.aos-animate:before {
            height: 85%;
        }
    }


    @media (max-width: 991px) {
        .header .navbar .small-btn-box {
            margin-left: 0;
            position: relative;
            top: -12px;
        }
        .navbar .small-btn-box ul {
            margin: 0;
        }
        body .main .side {
            margin-bottom: 0;
        }

        .ab_box_2 .ab_bg03 {
            width: 30%;
        }
        .ab_box_2 .tit {
            width: 70%;
        }
        .ab_box_3 .tit:after {
            width: 150px;
            height: 180px;
            top: 55%;
        }
        .tit_s_ri {
            width: 80%;
            margin: 0 0 0 auto;
        }
        .ab_box_1 .ab_fx .pic {
            width: 20%;
            position: absolute;
            left: 0;
            top: 0;
        }
        .ab_box_1 .ab_fx .tit {
            width: 100%;
            padding-left: 0;
        }
    
        .ab_box_1 .ab_fx {
            flex-wrap:wrap;
        }
        .needs-validation {
            width: auto;
        }
        .main-content > .container,
        .main > .container {
            max-width: 100%;
            padding: 0 5%;
        }
        .bu_ok .ab_bg01 {
            right: -1%;
            width: 13%;
            top: -69%;
        }
        .home_service ul li ul {
            font-size: 16px;
        }
        .bu_ok .bu_ok_1 {
            min-width: auto;
        }

        .bu_ok .bu_ok_2 {
            font-size: 40px;
            min-width: 420px;
        }
        .bu_ok div {
            padding: 20px 20px;
        }
        .banner .slick-dots {
            bottom: 5px;
        }
        .banner{
            padding-top:149px;
        }
        .header .navbar-nav .nav-link {
            padding: 0px 20px 20px;
        }
        .page-box .container {
            max-width: 100%;
            padding: 0 5%;
        }
        .footer .footer_mid {
            width: 65%;
        }
        .footer .footer_right {
            width: 35%;
        }
        .footer .foter_left {
            padding-right: 0;
            width: 100%;
            margin-bottom:20px;
        }
        .content > .section > .container {
            max-width: 100%;
        }
        .function-bar .d-md-none {
            display: block !important;
        }

        .container.gx-md-2 > .function-bar {
            display: none !important;
        }
        .sideNavBtn a, .function-bar .btn.btn-primary {
            width: auto !important;
            padding: 5px 10px !important;
        }

        .side1 .collapse:not(.show) {
            display: none !important;
        }

        .side .collapse.navbar-collapse.show {
            margin-bottom: 20px;
            background-color: #fff;
        }

        .function-bar {
            justify-content: space-between !important;
        }

        .sideNavBtn {
            display: block !important;
        }
    
    }

@media (max-width: 767px) {
    .navbar .small-btn-box ul {
        position: relative;
        top: -2px;
    }
    .header .navbar .small-btn-box ul  li  a {
        font-size: 15px;
        padding: 3px 16px;
    }
    .header .navbar .small-btn-box {
        top: 0;
    }
    .pt10 {
        margin-bottom: 30px;
    }

    @keyframes ballDrop {
        0% {
            top: -120px;
            transform: scale(1);
        }

        60% {
            top: -29px;
            transform: scale(1);
        }

        75% {
            top: -45px;
        }

        90% {
            top: -29px;
        }

        100% {
            top: -13px;
        }
    }
    .breadcrumb-section {
        margin-bottom: 50px !important;
    }
    .Cale_money {
        margin-bottom: -20px;
    }
    a.more_x {
        font-size: 16px;
        padding: 15px 10px;
        width: 154px;

    }
    .article-list .item + .item {
        margin-top: 0;
    }
    .article-list .item .time {
        font-size: 12px;
        padding: 3px 8px;
        margin-bottom: 5px;
    }
    .article-list .item .icon i {
        width: 25px;
        height: 25px;
      
    }
    .article-list .item a {
        padding: 10px 0px;
    }
    .page-link {
        min-width: 2em;
        height: 2em;

    }
    .article-list {
        padding: 15px;
    }
    h3,
    h4{
        line-height:normal;
    }
    .ab_box_3 .tit:after {
        width: 100px;
        height: 130px;
        top: 65%;
    }
    .ab_box_2 .ab_bg03 {
        width: 50%;
        bottom: -80px;
    }
    .ab_box_3 .pic img{
        width:50%;
    }
    .ab_box_3 .pic {
        width: 150px;
        height: 150px;
        margin: 0 auto 30px;
    }
    .ab_box_3 .tit:before{
        display:none;
    }
    .ab_box_3 .tit {
        margin-left: 0;
        padding: 15px;
        width: 100%;
    }
    .ab_box_3 .d-flex{
        flex-wrap:wrap;
    }
    .ab_box_2:before {
        width: 150px;
        height: 180px;
    }
    .ab_box_2 {
        border-top-right-radius: 30px;
        border-bottom-right-radius: 30px;
        padding: 30px 15px;
    }
    .ab_box_2 .tit {
        width: auto;
    }
    .ab_bg4 {
        margin-bottom: 0;
        padding:0 15px;
    }
    .ab_bg4 .d-flex img {
        width: 100%;
        margin: 10px 0;
    }
    .ab_bg4 .d-flex {
        gap: 0;
        flex-wrap: wrap;
    }
    img.ab_bg02 {
        border-radius: 10px 40px 20px 30px;

    }
    .breadcrumb {
        padding: 0;
  
    }
    .breadcrumb li:first-child a {
        padding: 7px 10px;
    }
    .kind-info.bu_ok .h2.bu_ok_2::after {
        width: 35px;
        height: 35px;
        right: -12px;
        top: -19px;
    }
    .ab_box_1 {
        padding: 0px  15px 0;
    }
    .tit_s_ri {
        width: 100%;
    }
    .ab_box_1 .ab_fx .pic{
        display:none;
    }
    .consult .demo,
    .contact .demo {
        font-size: 16px;
        padding-top: 0;
        width: auto;
        text-align: left;
        margin-bottom: 0 !important;
    }
    .kind-info.bu_ok {
        margin: 0 0 30px;
    }
    body .form-select, body .form-control {
        padding: 8px;
    }
    .consult textarea {
        height: 100px;
    }
    .Cale_money .ko_rte {
        font-size: 24px;
    }
    .Cale_money a.more_x {
        padding: 10px 5px;
        width: 124px;
    }
    .ab_sear_en {
        padding: 20px 0;
    }
    .ab_sear h3 {
        margin: 0px auto 30px;
    }
    .ab_sear h5.h_sk {
        padding: 20px ;
        margin: 0px 0;
        text-align: left;
        line-height: 32px;
    }
    .item_bs img {
        width: 40%;
    }
    .footer .footer_mid ul li h5 {
        font-size: 18px;
    }
    .gotop a {
        width: 40px;
        height: 40px;
    }
    .footer .copyrights-info {
        margin: 20px 0;

    }
    .footer .footer_right {
        width: 100%;
        margin-top:20px;
    }
    .footer .footer_mid {
        width: 100%;
    }
    .home_Intr_box .tit {
        position: static;
        top: auto;
        transform: unset;
    }
        .home_Intr_box .tit h4{
            font-size:16px;
        }
        .home_Intr_box .tit h2 {
            font-size: 24px;
            padding: 0;
            margin-bottom: 10px;
        }
    .ser_h3 span {
        display: block;
        background-color: #fff;
      
    }
    .ser_h3 {
        font-size: 24px;
        justify-content: center;
    }
    .home_service .item_bs > ul > li {
        width: 100%;
        padding: 10px 0;
    }
    .ser_solid .item_bs {
        padding: 15px 15px;
    }
    .bu_ok .ab_bg01 {
        right: -4%;
        width: 23%;
        top: -39%;
        z-index: 10;
    }
    .home_about {
        padding: 60px 0 0;

    }
    .h2 {
        font-size: 2.5rem;
        margin-bottom: 30px;
    }
    .h2 .txt_en {
        font-size: 4rem;

    }
    .ab_three .ab_three_icon h5 {
        padding-top: 5px;
        height: auto;
    }
    .ab_three .ab_three_icon .hook {
        top: -6%;
   
    }
    .ab_three .ab_three_icon .hook img {
        width: 70%;
    }
    .item_bs {
        padding: 20px 5px;
    }
    .home_about p{
        text-align:left;
    }
    .home_about p span {
        display: unset;
    }
    .ab_three .ab_three_icon {
        width: 100%;
        margin-bottom:40px;
    }
    .ab_three {
        gap: 0;
        flex-wrap:wrap;
    }
    .bu_ok .bu_ok_1 {
        font-size: 24px;

    }
    .bu_ok div {
        padding: 15px 13px;
    }
    .kind-info.bu_ok .h2.bu_ok_2 {
        padding: 15px 30px;
    }

    .kind-info.bu_ok .h2.bu_ok_2,
    .bu_ok .bu_ok_2 {
        font-size: 30px;
        transform: unset;
        min-width: auto;
    }
    .bu_ok {
        flex-wrap: wrap;
    }
    .home_about h3 span {
        width: 30px;
        height: 30px;
    }
    .home_about h3 {
        font-size: 2rem;
        padding: 0 30px;
    }
    .header .bsnav-mobile .navbar {
        background: #56c1ef;
        padding: 10px;
    }
    .banner {
        padding-top: 73px;
    }

    .header .navbar .navbar-brand, #logo {
        width: 173px !important;
        height: 56px !important;
        background-size: cover;
    }
    .bsnav-mobile.right .navbar .navbar-nav .nav-item .caret, .bsnav-mobile.left .navbar .navbar-nav .nav-item .caret {
        display: block;
        position: absolute;
        right: 15px;
        top: 50%;
    }
    .header .navbar.newtop.logo-show:not(.logo-ani-show) .navbar-brand .logo, .header .navbar.newtop.logo-show:not(.logo-ani-show-bg) .navbar-brand .logo {
        display: unset;
    }
    .rwd-table.mob-mode tr:nth-child(odd) {
        background: rgb(238 238 238);
    }

    .rwd-table.mob-mode td:before {
        font-weight: 400;
        min-width: 30%;
        color: #000;
    }

    .rwd-table td:first-child a,
    .rwd-table td:first-child:before {
        color: #ffffff;
    }

    .order-list table.mob-mode td:first-child {
        background: #161616;
        border: solid 1px #161616;
    }

    .rwd-table.mob-mode td {
        padding: 10px 10px;
    }

    body .navbar-toggler.toggler-spring.active .navbar-toggler-icon {
        background-image: unset;
    }
    .btn.btn-primary {
        font-size: 14px;
        padding: 8px 10px;
        border-radius: 4px;
    }
  
    .bsnav-mobile .navbar-nav .nav-item .navbar-nav .navbar-nav {
        background: #c2e473;
    }

    .bsnav-mobile .navbar-nav .nav-item .navbar-nav {
        background: #56c1ef;
        margin-left: 0;
        margin-right: 0;
    }

        .bsnav-mobile .navbar-nav .nav-item .navbar-nav .nav-link {
            padding: 10px 10px;
            color: #fff;
            font-size: 16px;
        }

    .bsnav-mobile .navbar-nav .nav-item .nav-link {
        padding: 12px 0;
        color:#fff;
    }
    .header .navbar-nav .nav-item:hover > .nav-link {
        color: #c2e473;
    }
    .navbar-nav   .nav-item .caret {
        border-top: solid 5px #ffffff;
    }
    .bsnav-mobile .navbar-nav .nav-item .nav-link {
        border-bottom: solid 1px #ffffff82;
    }

    .bsnav-mobile .navbar-nav {
        padding: 0 0;
        text-align: left;
    }
    body .navbar .navbar-toggler {
        width: 23px;
        margin-right: 0;
        margin-left: 12px;
    }

    .navbar-toggler.toggler-spring .navbar-toggler-icon::after {
        top: 17px;
    }

    .navbar-toggler.toggler-spring .navbar-toggler-icon::before {
        top: 8px;
    }

    .navbar-toggler .navbar-toggler-icon, .navbar-toggler .navbar-toggler-icon::after, .navbar-toggler .navbar-toggler-icon::before {
        height: 1.5px;
    }

    }




