.banner-one{
    background-image:url(../images/banner-1.jpg);
    background-repeat:no-repeat;
    background-size:cover;
    background-attachment:fixed;
}
.banner-two{
    background-image:url(../images/banner-2.jpg);
    background-repeat:no-repeat;
    background-size:cover;
    background-attachment:fixed;
}
.banner-three{
    background-image:url(../images/banner-3.jpg);
    background-repeat:no-repeat;
    background-size:cover;
    background-attachment:fixed;
}
.banner-four{
    background-image:url(../images/banner-4.jpg);
    background-repeat:no-repeat;
    background-size:cover;
    background-attachment:fixed;
}
.index-slide .carousel-indicators{
    z-index:60;
    width:100%;
    text-align:center;
    left:0;
    margin-left:0;
}
.index-slide{
    position:relative;
}
.index-slide .carousel-indicators li{
    background:none;
    text-indent:0;
    border-top:none;
    border-right:none;
    border-left:none;
    border-bottom:1px solid transparent;
    display:inline-block;
    padding:10px 0;
    width:auto;
    height:auto;
    border-radius:0;
    color:#3c6a36;
    margin:0 20px;
    font-size:.95em;
    transition:all ease .4s
}
.index-slide .carousel-indicators li.active{
    border-bottom:1px solid #222;
}
.index-slide .carousel-indicators li:hover{
    border-bottom:1px solid #666;
    color:#666;
}
.index-slide .banner-title{
    font-weight:bold;
    color:#3c6a36;
    padding-top:0;
    margin-bottom:30px;
}
.banner-bg .container> a:hover .banner-title{
    color:#82ab28;
}

.banner-bg{
    display:flex;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
    height:100vh;
    min-height:720px;
    padding-top: 100px;
}
.banner-bg .container{
    padding: 30px 20px;
    transition: all ease .4s;
    border-radius: 10px;
    backdrop-filter: blur(10px);
    background: rgba(255,255,255,.36);
}
.banner-bg .container> a{
    display: block;
    color: #666;
}
.banner-bg .container:hover{
    background: rgba(255,255,255,.55);
}
.banner-bg .container:hover>a{
    color: #3c6a36;
}
.index-slide h1,.index-slide h2,.index-slide p{
    width: 100%;
}
.banner-bg ul{
    display: grid;

    grid-template-columns: auto auto auto;
    margin-bottom: 15px;
}
.index-slide .item>a img{
    position:absolute;
    bottom:-20px
}
.carousel-control.left,.carousel-control.right{
    background:none;
    color:#afc89e;
    width:8%;
    z-index:99;
    font-size:60px;
}
.banner-more,.read-more{
    display:inline-block;
    padding:10px 30px;
    font-weight:bold;
    letter-spacing:.05rem;
    transition:all ease .5s;
    min-width: 150px;
    text-align: center;
}
.banner-bg .banner-more{
    background:#ec9e40;
    border:1px solid #ec9e40;
    color:#fff;
}
.read-more{
    border:1px solid #ec9e40;
    color:#ec9e40;
}
.banner-bg .banner-more:hover,.banner-bg .banner-more:focus,.read-more:hover,.read-more:focus{
    background:none;
    border:1px solid #fff;
    color:#ec9e40;
}



@media (min-width:768px){
    .index-slide .banner-title{
        font-size:2.1em;
        line-height:1.3em;
    }
    .index-slide p{
        line-height:1.6em;
    }
}
@media (max-width:768px){
    .index-slide .banner-title{
        font-size:1.6em;
        margin-bottom:20px;
    }
}
.index-zero{
    margin-top: 110px;
    padding: 30px 20px;
    border-radius: 30px;
    box-shadow: 0 0 80px #f1f1f1;
    transition: all ease .4s;
}
.index-zero:hover{
    box-shadow: none;
    background: #fff;
}
.index-zero .grid-item>div{
    transition: all ease .4s;
}
.index-zero .grid-item>div:hover{
    transform: scale(1.04);
}
.index-zero p{
    margin-bottom: 15px;
}
.index-zero div p:nth-child(2){
    font-size: 1.1em;
    color: #3c6a36;
}
.index-zero div p:last-child{
    font-size: .9em;
    margin-bottom: 0;
    color: #666;
}

.index-one{
    margin:100px auto 65px auto;
}
.index-one .row{
    margin-left:-10px;
    margin-right:-10px;
}
.index-one div[class*='col-md']{
    padding-left:10px;
    padding-right:10px;
}
.one-item:hover h3,.one-item:focus h3,.one-slide .item a:hover h3,.one-slide .item a:focus h3{
    color:#ec9e40;
}
.first-item.one-item{
    min-height:580px;
    height:66vh;
}
.one-item{
    display:block;
    min-height:280px;
    height:calc(33vh - 10px);
    margin-bottom:20px;
    overflow:hidden;
    position:relative;
    transition:all ease .5s;
}
.one-item:hover,.one-item:focus,.one-slide:hover,.one-slide:focus{
    box-shadow:0 0 10px #eee;
}
.one-item-text{
    position:absolute;
    bottom:10px;
    left:10px;
    right:10px;
    padding:15px;
    color:#222;
    transition:all ease .4s;
}
.one-item-text h3{
    margin-bottom:10px;
    font-size:2.2rem;
    color:#3c6a36;
}
.one-item-text p{
    margin-bottom:0;
    font-size:.9em;
    color: #666;
}
.one-img{
    position:relative;
    height:100%;
    transition:all ease .4s;
}
.one-img img{
    min-width:100%;
    max-width:150%;
    min-height:100%;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
    -ms-transform:translate(-50%,-50%);
    -o-transform:translate(-50%,-50%);
}
.one-item:hover .one-img{
    transform:scale(1.05);
}
.one-item:hover .one-item-text{
    backdrop-filter:blur(4px);
}
.index-title{
    color:#1c1e41;
    text-align:center;
    margin-bottom:30px;
    font-size:2.8rem;
    margin-top: 0;
}
.title-des{
    text-align:center;
    margin-bottom: 35px;
}
.title-des span{
    display: inline-block;
    padding:5px 24px;
    position: relative;
    z-index: 1;
    font-size: .94em;
    color:#fff;
}
.title-des span:before{
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    clip-path: polygon(10px 0,100% 0,calc(100%  - 10px) 100% , 0 100%);
    background: #82ab28;
    z-index: -1;
}
.title-des span:hover:before{
    background: #f19b4f;
}
.index-title span{
    color:#82ab28;
}
.index-two{
    position:relative;
}
.index-two .form-control{
    height:96px;
    border-radius:0;
    box-shadow:0 0 10px #ddd;
    background:#fff;
    border:none;
}
.index-two .small-title{
    position:absolute;
    top:35px;
    font-size:2rem;
    left:20px;
}
.index-two button{
    background:#82ab28;
    color:#fff;
    border:none;
    height:100%;
    position:absolute;
    right:0;
    top:0;
    font-size:30px;
}
@media (min-width:768px){
    .index-two .form-control{
        padding-left:300px;
    }
    .index-two button{
        width:150px;
    }
}
.index-three{
    background-image:url(../images/index-three-bg.jpg);
    background-position:center;
    background-size:cover;
    background-attachment:fixed;
    margin-top:-40px;
    padding:150px 0 100px 0;
}
.index-four{
    margin-top:90px;
    margin-bottom:100px;
    font-size:1.05em;
    line-height:1.7em;
}
.svg-circle-lg,.svg-circle-sm{
    -webkit-animation:rotate-lg 300s linear infinite;
    -moz-animation:rotate-lg 300s infinite linear;
    animation:rotate-lg 300s linear infinite;
    -webkit-transform-origin:center;
    -moz-transform-origin:center;
    -ms-transform-origin:center;
    transform-origin:center;
}
.svg-circle-sm{
    -webkit-animation:rotate-sm 300s linear infinite;
    -moz-animation:rotate-sm 300s infinite linear;
    animation:rotate-sm 300s linear infinite;
    -webkit-transform-origin:center;
    -moz-transform-origin:center;
    -ms-transform-origin:center;
    transform-origin:center;
}
@keyframes rotate-lg{
    0%{
        transform:rotate(0)
    }
    100%{
        transform:rotate(360deg);
    }
}
@keyframes rotate-sm{
    0%{
        transform:rotate(360deg)
    }
    100%{
        transform:rotate(0);
    }
}

.four-grid{
    --rate:80px calc(100% - 100px);
    align-items: center;
    padding: 15px 10px;
    margin-bottom: 0;
    transition: all ease .4s;
}
.four-grid:hover{
    background: #ec9e40;
    color: #fff;
}
.four-grid:hover img{
    filter: brightness(0) invert(1);
}
.four-grid:hover .four-img:before{
    background: #f1f1f1;
}
.four-img{
    position: relative;
    z-index: 2;
}
.four-img:before{
    content: '';
    display: inline-block;
    width: 40px;
    height: 40px;
    background: #eee;
    position: absolute;
    right: 10px;
    bottom: 0;
    z-index: -1;
    border-radius: 20px;
    transition: all ease .4s;
}
.four-title{
    position:relative;
}
.four-title .svg-circle{
    -webkit-transform:translate(-30%);
    -ms-transform:translate(-30%);
    -moz-transform:translate(-30%);
    transform:translate(-30%);
    position:absolute;
    z-index:1;
    bottom:-15%;
    width:456px;
    height:456px;
}
@media (min-width:768px){
    .four-title img{
        float:right;
    }
    .four-title .index-title{
        position:absolute;
        right:-20px;
        text-align:right;
        top:50px;
    }
    .four-title .index-title span{
        display:block;
    }
}
.four-title .index-title{
    font-size:3.8rem;
}
.five-side a.item{
    height:calc(100vh - 122px);
    min-height:550px;
    max-height: 690px;
}
.five-side .carousel-caption{
    text-align:left;
    left:10%;
    bottom:40%;
}
.five-side h3{
    font-size:3rem;
}
.five-side p{
    margin-bottom:30px;
}
.five-more{
    color:#ec9e40;
}
.five-more:hover{
    color:#fff;
}
.five-more:hover>span{
    background:#82ab28;
    color:#fff;
    border: 1px solid #82ab28;
}
.five-more>span{
    font-size:40px;
    padding:10px;
    border:1px solid #ec9e40;
    border-radius:50px;
    color:#ec9e40;
    vertical-align:middle;
    margin-right:10px;
    transition:all ease .4s;
}
.five-side .carousel-indicators{
    justify-content:space-between;
    width:100%;
    left:0;
    margin:0;
}
.five-side .carousel-indicators li{
    background:none;
    border:none;
    border-radius:0;
    color:#fff;
    width:25%;
    display:inline-block;
    float:left;
    text-align:center;
    margin:0;
    position:relative;
}
.five-side .carousel-indicators li:before{
    content:'';
    height:100vh;
    width:1px;
    background:rgba(255,255,255,.4);
    position:absolute;
    bottom:-20px;
    right:0;
}
.five-side .carousel-indicators li>span{
    display:inline-block;
    border-bottom:2px solid transparent;
    padding-bottom:10px;
    transition:all ease .4s;
}
.five-side .carousel-indicators li:hover>span{
    transform:translateY(-20px);
}
.five-side .carousel-indicators li.active>span{
    border-bottom:2px solid #fff;
}


.index-seven{
    margin-top: 90px;
}

.index-seven a{
    display: grid;
    grid-template-columns: 70px calc(100% - 80px);
    grid-gap: 20px;
    align-content: center;
    align-items: center;
    font-weight: bold;
    color:#3c6a36;
    font-size: 1.08em;
    transition: all ease .4s;
}
.index-seven a:hover{
    color:#ec9e40;
    transform: scale(1.03);
}
.index-seven a:hover span{
    background: #ec9e40;
    color: #fff;
}
.index-seven a:hover span img{
    filter: brightness(0) invert(1);
}
.index-seven a:hover span:before{
    border: 1px solid  rgba(136 158 64 .5);
}

.index-seven .grid-item span{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    background: #f2f2f2;
    border-radius: 50%;
    position: relative;
    transition: all ease .4s;
}
.index-seven .grid-item span:before{
    content: '';
    position: absolute;
    left: -10px;
    top: -10px;
    right: -10px;
    bottom: -10px;
    border: 1px solid #dfe3e6;
    border-radius: 50%;
    transition: all ease .4s;
}


.index-eight {
    background: linear-gradient(rgba(224, 227, 227, 0.5) 0, #fff 100%);
    padding: 80px 0;
    margin: 80px 0;
}

.index-eight .container {
    overflow: hidden;
}

.partner-list {
    display: flex;
    animation: loop-logo 60s linear infinite;
    width: fit-content;
    grid-gap: 20px;
    padding-bottom: 20px;
    margin-bottom: 90px;
}

.partner-list span:hover {
    transform: scale(1.1);
}

@keyframes loop-logo {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(calc(-220px * 13));
    }
}

.partner-list span {
    display: flex;
    width: 200px;
    height: 70px;
    align-content: center;
    justify-content: center;
    justify-items: center;
    transition: all ease 0.4s;
    border-radius: 10px;
    background: #fff;
    padding: 3px 0;
    box-shadow: 0 0 10px #ddd;
}

.partner-list span img {
    object-fit: contain;
    pointer-events: none;
}

.review-item{
    transition: all ease .4s;
}
.review-item .grid{
    --rate:80px calc(100% - 90px);align-items: center
}
.review-item .orange{
    font-size: .96em;
}
.review-item .gray-box{
    height: calc(100% - 120px);
    position: relative;
    background: #ecebeb;
    margin-bottom: 30px;
    transition: all ease .4s;
}
.review-item .gray-box:before{
    content: '';
    position: absolute;
    bottom: -30px;
    left: 20px;
    width: 30px;
    height: 30px;
    clip-path: polygon(0 0,100% 0,50% 50%);
    background: #ecebeb;
}
.review-item:hover{
    transform: scale(1.03);
}
.review-item:hover .gray-box{
    background: #f9f9f9;
    box-shadow: 0 0 10px #ddd;
}


.index-nine {
    margin-bottom: 80px;
}

.index-nine .border-box {
    display: block;
    border: 1px solid #ddd;
    background: #fff;
    text-align: center;
    width: 100%;
    border-radius: 10px;
    overflow: hidden;
    color: #333;
    padding: 5px;
}

.index-nine .border-box:hover .pic-box {
    background: #fff;
    transform: scale(1.05);
}

.index-nine .border-box:hover h3 {
    color: #ec9e40;
}

.index-nine h3 {
    padding: 20px 10px;
    margin-bottom: 0;
    height: calc(100% - 170px);
    align-content: center;
    font-size: 1.1em;
}

.index-nine .pic-box {
    height: 160px;
    transition: all ease .4s;
}


.index-six {
    padding: 50px 20px 70px 20px;
    border-radius: 30px;
    margin: 0 -20px -50px -20px;
    position: relative;
    z-index: 1;
    background: #f2f8f7;
}

.index-six a {
    display: block;
    padding: 20px 15px ;
    border: 1px solid #fff;
    border-radius: 10px;
    background: #fff;
    color: #3c6a36;
    box-shadow: 0 0 5px #eee;
    transition: all ease .4s
}

.index-six a:hover {
    box-shadow: 0 0 10px #ddd;
    transform: scale(1.05);
}

.index-six a:hover h3 {
    color: #ec9e40;
}


.index-six h3 {
    margin-top: 20px;
    transition: all ease .4s;
    font-size: 1.2em;
}


.index-ten {
    background: #10302c;
    color: #fff;
    padding: 140px 0 80px 0;
    margin-bottom: -70px;
}
.index-ten .index-title{
    color: #fff;
}

.ten-left {
    color: #ccc;
    background: rgba(255,255,255,.1);
    transition: all ease .4s;
}

.ten-left:hover {
    color: #fff;
    background: rgba(255,255,255,.2);
    transform: scale(1.02);
}

.ten-left:hover h3,.ten-box a:hover h3 {
    color: #ec9e40;
}

@media(min-width: 992px) {
    .ten-left {
        text-align: center;
    }

    .ten-left h3 {
        padding: 0 10px;
    }

}
.index-ten h3{
    color: #fff;
    font-size: 1.77rem;
}
.ten-box a {
    --rate: calc(100% - 250px) 200px;
    align-items: center;
    color: #ccc;
    border-bottom: 1px solid #4d5766;
    padding: 10px 5px;
    transition: all ease .4s;
    margin-bottom: 0;
}

.ten-box a:hover {
    background: rgba(255,255,255,.1);
    transform: scale(1.02);
}

@media(min-width: 992px) {
    .ten-box .pic-box {
        min-height: 125px;
    }
}

@media(max-width: 992px) {
    .ten-box a {
        display: grid;
        grid-template-columns: calc(100% - 120px) 100px;
        justify-content: space-between;
    }

    .ten-box a>div {
        margin-bottom: 10px;
    }

    .ten-box .pic-box {
        min-height: 100px;
    }
}

.ten-box p {
    margin-bottom: 0;
}