html{scroll-behavior: smooth;}

.head-title-maintenance{background-image: linear-gradient(to left,#ee5c1b,#ffb847); position: relative; width: 100%; height: 100%;}
.head-title-maintenance::before{content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: url(../images/square.png); }
.head-title-maintenance .img-title{ max-width: 300px; margin: auto;}
.head-title-maintenance .img-title img{ margin: 28px auto;}

.tab-anchor { margin: 35px auto; }
.tab-anchor ul{ display: table; width: 100%;}
.tab-anchor ul li{display: table-cell;width: 33.33%;padding: 7px;position: relative;}
.tab-anchor ul li a{
	-webkit-transition:all 1s;
	-moz-transition:all 1s;
	transition:all 1s;}
.tab-anchor ul li:first-child{ padding-left: 0;}
.tab-anchor ul li:last-child{ padding-right: 0;}
.tab-anchor .bg-tab{ padding: 20px 0 20px 0; text-align: center; font-size: 20px; position: relative;
    background: rgba(229,229,229,1);
    background: -moz-linear-gradient(top, rgba(229,229,229,1) 0%, rgba(205,205,205,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(229,229,229,1)), color-stop(100%, rgba(205,205,205,1)));
    background: -webkit-linear-gradient(top, rgba(229,229,229,1) 0%, rgba(205,205,205,1) 100%);
    background: -o-linear-gradient(top, rgba(229,229,229,1) 0%, rgba(205,205,205,1) 100%);
    background: -ms-linear-gradient(top, rgba(229,229,229,1) 0%, rgba(205,205,205,1) 100%);
    background: linear-gradient(to bottom, rgba(229,229,229,1) 0%, rgba(205,205,205,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5e5e5', endColorstr='#cdcdcd', GradientType=0 );}
.tab-anchor .bg-tab img{margin-right: 6px;}
.tab-anchor .bg-tab .line-hover{ position: absolute; bottom: 0; left: 0; background: #ff7a0f; display: block; height: 6px; width: 100%; opacity: 0;}
.tab-anchor .bg-tab .line-hover::before{ content: '▲'; color: #ff7a0f; bottom: -5px; position: absolute; left: 0; right: 0;}
.tab-anchor .bg-tab:hover .line-hover{ opacity: 1; transition: all 0.5s;}

.insurance-service{ display: flex; flex-wrap: wrap; width: 100%; margin: 18px auto;}
.insurance-service .service-gk,
.insurance-service .service-tough{ width: 50%;}
.insurance-service .service-gk{ padding-right:12px; text-align: center;}
.insurance-service .service-tough{ padding-left:12px; text-align: center;}
.insurance-service .service-title{ background: #fff; border-bottom: 4px solid #ccc; padding: 12px 4px; color: #000; font-size: 22px; font-weight: bold; text-align: left;}
.insurance-service .service-logo{ margin: 12px auto; text-align: center; width: 100%;}
.insurance-service .service-logo img{ max-width: 100%; margin: auto;}
.insurance-service .viewmore{ display: block; width: 240px; text-align: center; border: 2px solid #000; padding: 12px; margin: 18px auto;}
.insurance-service .viewmore:hover{ transition: all 0.3s; color: #000; background-color: #fff109;}

.warpper-bgorange{ background: #ffaa07; width: 100%; display: block;}
.warpper-bgorange .warpper-bgdark-orange{ position: relative; height: 114px; background: #ff7f39; max-width: 1000px; margin: 18px auto; padding: 24px 0;}
.warpper-bgorange .warpper-bgdark-orange::before{ content: url(../images/triangle-left.png); position: absolute; left: -98px; top: 0;}
.warpper-bgorange .warpper-bgdark-orange::after{ content: url(../images/triangle-right.png); position: absolute; right: -98px; top: 0;}
.warpper-bgorange .link-contact{ background: #fff; text-align: center; display: block; padding: 12px; width: 70%; border-radius: 6px; border-bottom: 4px solid #ccc; margin: auto; font-size: 22px; color: #ff6613;}
.warpper-bgorange .link-contact:hover{ transition: all 0.3s; opacity: 0.9;}
.warpper-bgorange .link-contact.long-text{ width: 96%;}

.topic-warranty{ text-align: center; line-height: 3; font-size: 19px; padding: 12px 8px;}
.topic-warranty .line-red{ display: inline-block; background: url(../images/line-red.jpg) no-repeat; background-position: bottom; line-height: 3;}
.topic-warranty .line-red img{ margin: -14px 2px 0 0;}
.topic-warranty .content-warranty{ margin-top: 22px; font-size: 15px; text-align: left; line-height: 1.5; font-weight: 300;}

.tire{ display: block; width: 100%; margin: 30px auto 100px; position: relative;}
.tire .img-tire{ position: absolute; right: 0; bottom: -45px;}
.tire .img-tire img{ max-width:100%;}
.tire .topic-tire{ width: 80%; padding: 40px; padding-right: 76px; font-size: 22px; line-height: 2; font-weight: bold; color: #ff782e; text-align: center; margin: auto;
    border-top: 8px solid #ffe825;
    -moz-border-top: 8px solid #ffe825;
    -webkit-border-top: 8px solid #ffe825;
    border-bottom: 8px solid #ffe825;
    -moz-border-bottom: 8px solid #ffe825;
    -webkit-border-bottom: 8px solid #ffe825;
    border-left: 8px solid #ffb268;
    -moz-border-left: 8px solid #ffb268;
    -webkit-border-left: 8px solid #ffb268;
    border-right: 8px solid #ffb268;
    -moz-border-right: 8px solid #ffb268;
    -webkit-border-right: 8px solid #ffb268;}


.title-square-car{ color: #000; font-size: 20px;}
.title-square-car img{ width: 23px !important; margin: 0!important;}


.price-list{ margin-bottom: 60px;}
.price{margin: 15px auto;}
.price .left {
    width: 32%;
    display: inline-block;
    vertical-align: top;
}
.price .right {
    width: 60%;
    display: inline-block;
    /* margin-bottom: -40px; */
}
.price ul{ display: table; width: 100%;}
.price ul li{ display: table-cell; width: 25%; padding: 4px 12px; vertical-align: middle;}
.price ul li:first-child{ padding-left: 0;}
.price ul li:last-child{ padding-right: 0;}
.price .textblue{ color: #00a6e3; font-size: 18px; font-weight: bold;}
.price .textblue{ color: #00a6e3; font-size: 18px; font-weight: bold;}
.price .textblue img{
    max-width: 80%;
    left: 60px;
    position: relative;    
}
.price .textpink{
    color: #f24195;
    font-size: 18px;
    font-weight: bold;
    /* margin-top: -160px; */
    /* position: absolute; */
}
.price .textpink img{
    max-width: 100%;
    left: 30px;
    top: 20px;
    position: relative;
}
.price .max-price_blue {
    background-image: url(/insurance/images/blue_back.gif);
    background-repeat: repeat;
    border: 4px solid #9bddf5;
    position: relative;
    font-weight: bold;
    height: 85px;
}
.price .max-price_pink {
    background-image: url(/insurance/images/pink_back.gif);
    background-repeat: repeat;
    border: 4px solid #ffbade;
    position: relative;
    font-weight: bold;
    height: 85px;
}
.price .max-price_blue p {
    text-align: center;
    color: #00a6e3;
    font-size: 18px;
    padding: 8% 0;
}
.price .max-price_pink p {
    text-align: center;
    color: #f460a4;
    font-size: 18px;
    padding: 8% 0;
}
.price ul li .box-price { 
    background: #fff;
    border: 4px solid #dcdcdc;
    position: relative;
    font-weight: bold;
    height: 85px;
}
.price ul li .box-price .yellow {
    background: #fff109;
    color: #000;
    text-align: center;
    font-size: 16px;
    padding: 2px;
}
.price ul li .box-price .text-price{text-align: center; font-size: 33px; color: #f30000;}
.price ul li .box-price .text-price strong{ font-size: 18px;}
.price ul li .box-price .text-price small{ font-size: 10px; font-weight: normal;}
.price ul li .box-price .ribbon{ background: url(../images/ribbon.png) no-repeat; width: 200px; height: 50px; margin-left: -25px; padding: 2px; text-align: center; color: #000; font-size: 18px;}
.price-list .remark{ 
    font-size: 12px;
    margin-top: 60px;
}
.acp{ text-align: center;}
.acp .img-header{ display: block; width: 100%;}
.acp .img-header img{ max-width: 100%; margin: 28px auto;}
.acp h2{ font-size: 19px;}
.acp .text-green{ color: #009944;}
.acp .text-blue{ color: #00a6e3;}
.acp .text-pink{ color: #f24195;}
.acp .text-yellow{ color: #fff000;}
.acp .tab-color{ text-align: center; padding: 22px; border-radius: 6px; color: #fff;}
.acp .tab-color h3{ font-size: 26px;}
.acp .tab-color strong{ font-size: 20px;}
.acp .tab-color strong.number-price{ font-size: 28px;}
.acp .tab-color.bg-light-green{ background: #8ec900;}
.acp .tab-color.bg-blue{ background: #21b3e9;}
.acp .tab-color.bg-pink{ background: #f860a8;}
.acp .remark-acp{ color: #000; font-size: 12px; margin-bottom: 50px;}
.acp .thumb-acp img{ max-width: 100%; margin-bottom: 8px;}
.acp .thumb-acp{ text-align: left;}
.acp .thumb-acp span{ font-weight: bold; display: block;}
.acp .thumb-acp{ padding-bottom: 40px;}
.acp .thumb-acp .images-thumb{ text-align: center;}

.sub-acp{ background: #8ec31f; padding: 18px 0; text-align: center; margin: 4px;}
.sub-acp img{ max-width: 100%;}
.tab-acp ul{ display: table; width: 100%;}
.tab-acp ul li{ display: table-cell; width: 33.33%; padding: 12px; position: relative;}
.box-color{ position: absolute; bottom: 0; left: 0; width: 100%; padding: 0px 12px;}
.box-color ul{ display: table; width: 100%;}
.box-color ul li{ display: table-cell; width: 33.33%; padding: 8px; text-align: center; color: #fff;}
.box-color ul li span{ padding: 2px; border-radius: 4px; display: block; margin: auto;}
.box-color .bg-light-green{ background: #8ec900;}
.box-color .bg-blue{ background: #21b3e9;}
.box-color .bg-pink{ background: #f860a8;}

.banner-tumbnail img{ width:100%; padding:4px;}
.banner-tumbnail ul{ display: flex; flex-wrap: wrap;}
.banner-tumbnail ul li{ display: block;}
.banner-tumbnail ul.banner-red li{ width: 20%;}
.banner-tumbnail ul.banner-green li{ width: 25%;}
.banner-tumbnail ul.images-table li{ width: 50%;}
.banner-tumbnail .remark-banner{ font-size: 12px; text-align: left; color: #000;}
.banner-tumbnail ul.images-charecter-line1 li{ width: 33.33%;}
.banner-tumbnail ul.images-charecter-line2 li{ width: 50%;}
.banner-tumbnail ul.images-charecter-line3 li{ width: 100%;}




@media(max-width:1198px){
    .warpper-bgorange .warpper-bgdark-orange::before,
    .warpper-bgorange .warpper-bgdark-orange::after{ display: none;}
}

@media(max-width:970px){
    .tab-anchor ul{ display: block; }
    .tab-anchor ul li{ display: block; width: 100%; padding: 12px !important;}
        .price .textblue img {
        max-width: 80%;
        left: 20px;
    }
    .price .textpink img {
        max-width: 86%;
        left: 10px;
    }
    .price .max-price_blue p,.price .max-price_pink p {
        font-size: 16px;
        padding: 12% 0;
    }
    .price ul li .box-price .text-price {
        font-size: 26px;
    }
    .price ul li .box-price .yellow {
        font-size: 14px;
    }
}

@media(max-width:910px){
    .tab-acp ul{ display: block; width: 100%;}
    .tab-acp ul li{ display: block; width: 60%; padding: 12px; position: relative; margin: auto;}

    .box-color{ position: relative; padding: 0;}
    .box-color ul{ display: table; width: 100%;}
    .box-color ul li{ display: table-cell; width: 33.33%; padding: 4px !important;}
}

@media(max-width:940px){
    .price .right {width: 67%;}
    .price ul{ display: flex; flex-wrap: wrap; width: 100%;}
    .price ul li{display: block;width: 49%;padding: 4px 6px;}
    .price ul li.textblue{ display: block; width: 100%; text-align: center;}
    .price ul li.textpink{ display: block; width: 100%; text-align: center;}
}

@media(max-width:768px){
    .insurance-service .service-gk,
    .insurance-service .service-tough{ width: 100%; padding: 12px 0;}

    .warpper-bgorange .warpper-bgdark-orange{ padding: 28px 0;}
    .warpper-bgorange .link-contact{ width: 90%; font-size: 17px;}

}

@media(max-width:680px){
    .tire .topic-tire{ width: 80%; padding: 22px; padding-right: 22px; font-size: 22px;}
    .tire .img-tire{ bottom: -85px;}
    
    .price .max-price_blue {
        border: 3px solid #9bddf5;
        height: 50px;
    }
    .price .max-price_pink {
        border: 3px solid #ffbade;
        height: 50px;
    }
    .price ul li .box-price { 
        border: 3px solid #dcdcdc;
    }    
    
    .price .left {
        width: 100%;
        display: inline-block;
    }
    .price .right {
        width: 100%;
        display: inline-block;
    }
    .price .textblue img {
        max-width: 100%;
        left: 23%;
        position: relative;
    }
    .price .textpink img {
        max-width: 100%;
        left: 20%;
        top: 0;
        position: relative;
    }
    .price .textpink {
        color: #f24195;
        font-size: 18px;
        font-weight: bold;
        margin: 40px 0 0 0;
        position: relative;
    }
    .price ul {margin: 4px auto 10px;}
    .price ul li{display: block;width: 80%;margin: 4px auto;padding: 0;}
    .price .max-price_blue p,.price .max-price_pink p {
        font-size: 18px;
        padding: 0;
        line-height: 39px;
    }
    .price ul li .box-price .text-price {
        font-size: 33px;
    }
    .price ul li .box-price .yellow {
        font-size: 16px;
    }



    
}

@media(max-width:480px){
    .warpper-bgorange .warpper-bgdark-orange{ padding: 15px 0;}
    .warpper-bgorange .link-contact{ width: 90%; font-size: 18px;}

    .tab-acp ul li{ display: block; width: 100%;}
    .box-color ul{ display: table; width: 100%;}
    .box-color ul li{ display: table-cell; width: 33.33%; padding: 4px !important;}
    .acp .thumb-acp{ padding-bottom: 12px;}

    .banner-tumbnail ul.banner-red li{ width: 50%;}
    .banner-tumbnail ul.banner-green li{ width: 50%;}
    .banner-tumbnail ul.images-table li{ width: 100%;}
}