html,
body {
    position: relative;
    height: 100%;
    overflow: hidden;
    background: #fff;
}

.swiper-container {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    overflow: hidden;
    transform-origin: 0 0;
}

.swiper-pagination-bullet {
    width: 20px;
    height: 20px;
    margin: 0 0 20px;
    background: #c4d700;
    border: 5px solid #fff;
    opacity: 1;
}

.swiper-pagination-bullet-active {
    background: #006428;
}

.wrap {
    display: flex;
    align-items: center;
    position: relative;
    z-index: 6;
    width: 100%;
    height: 100%;
    padding: 0 0 0 175px;
}


/* Ã§Â¬Â¬1Ã©Æ’Â¨Ã¥Ë†â€  */
.part1 {
    position: relative;
}

.banner {
    position: relative;
    z-index: 1;
}

.shutter {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: auto;
}

.shutter-img {
    z-index: 1;
}

.shutter-img,
.shutter-img a {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.shutter-img a {
    cursor: default;
}

.shutter-img a>img {
    width: 100%;
    height: 100%;
}

.shutter-img .created {
    overflow: hidden;
    position: absolute;
    z-index: 20;
}

.shutter-btn {}

.shutter-btn li {
    position: absolute;
    z-index: 10;
    top: 50%;
    width: 40px;
    height: 80px;
    margin-top: -18px;
    cursor: pointer;
}

.shutter-btn li.prev {
    left: 195px;
    background: url("../images/btn_left.png") no-repeat 0 0;
    background-size: 40px;
}

.shutter-btn li.next {
    right: 50px;
    background: url("../images/btn_right.png") no-repeat 0 0;
    background-size: 40px;
}


/* 
.banner-layer {
    position: absolute;
    z-index: 8;
    left: 0;
    top: 0;
    width: 100%;
    text-align: center;
}

.banner-font {
    position: absolute;
    z-index: 10;
    left: 0;
    top: 0;
    width: 100%;
    text-align: center;
} */


/* Ã§Â¬Â¬Ã¤ÂºÅ’Ã©Æ’Â¨Ã¥Ë†â€  */
.part2 {
    background: url(../images/part2_bg.jpg) no-repeat center center/cover;
}

.part2-main {
    width: 1200px;
    margin: 0 auto;
}

.part2-title {
    margin: 0 0 90px;
    text-align: center;
    opacity: 0;
    transform: translate3d(0, 50%, 0);
    transition: 1s;
}

.part2-box {
    display: flex;
    justify-content: space-between;
    padding-right: 30px;
}

.part2-left {
    width: 530px;
    background: url(../images/part2_left_g.png) no-repeat right bottom;
    opacity: 0;
    transform: translate3d(-50%, 0, 0);
    transition: 1s;
}

.part2-left img {
    width: 100%;
    opacity: 0;
    transform: translate3d(-50%, 0, 0);
    transition: 1s;
    border: 3px solid  #c7d206;
}

.part2-right {
    position: relative;
    width: 630px;
    padding-left: 75px;
}

.part2-name {
    padding: 0 0 20px;
    opacity: 0;
    transform: translate3d(50%, 0, 0);
    transition: 1s;
}

.part2-name .ch {
    display: block;
    font: bold 24px/30px 'Ã¥Â¾Â®Ã¨Â½Â¯Ã©â€ºâ€¦Ã©Â»â€˜';
    color: #006428;
}

.part2-name .en {
    display: block;
    font: 400 12px/16px 'Ã¥Â¾Â®Ã¨Â½Â¯Ã©â€ºâ€¦Ã©Â»â€˜';
}

.part2-p p {
    font: 400 16px/30px 'Ã¥Â¾Â®Ã¨Â½Â¯Ã©â€ºâ€¦Ã©Â»â€˜';
    color: #2f2f2f;
    opacity: 0;
    transform: translate3d(50%, 0, 0);
    transition: 1s;
}

.part2-more a {
    display: block;
    font: bold 16px/30px 'Ã¥Â¾Â®Ã¨Â½Â¯Ã©â€ºâ€¦Ã©Â»â€˜';
    color: #006428;
    text-transform: uppercase;
    opacity: 0;
    transform: translate3d(50%, 0, 0);
    transition: 1s;
}

.part2-img {
    position: absolute;
    right: 0;
    top: 240px;
    opacity: 0;
    transform: translate3d(50%, 0, 0);
    transition: 1s;
}

.part2-img ul {
    display: flex;
}

.part2-img ul li {
    width: 116px;
}

.part2-img ul li a {
    display: block;
    padding: 15px 0;
    color: #000;
    text-align: center;
    background: #fff;
}

.part2-li-img {
    position: relative;
    height: 60px;
}

.part2-li-t {
    position: absolute;
    z-index: 5;
    left: 0;
    top: 0;
    width: 100%;
    text-align: center;
    transition: 1s;
}

.part2-li-b {
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    text-align: center;
    opacity: 0;
    transform: rotateY(-180deg);
    transition: 1s;
}

.part2-img ul li a p {
    font: 400 16px/24px 'Ã¥Â¾Â®Ã¨Â½Â¯Ã©â€ºâ€¦Ã©Â»â€˜';
}

.part2-img ul li a:hover {
    color: #fff;
    background: #006428;
}

.part2-img ul li a:hover .part2-li-t {
    opacity: 0;
    transform: rotateY(180deg);
}

.part2-img ul li a:hover .part2-li-b {
    z-index: 10;
    opacity: 1;
    transform: rotateY(0);
}

/* Ã¥Å Â¨Ã§â€Â» */
.part2.swiper-slide-active .part2-title {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 1s;
}

.part2.swiper-slide-active .part2-left {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 1.5s;
}

.part2.swiper-slide-active .part2-left img {
    opacity: 1;
    transform: translate3d(-8px, -8px, 0);
    transition-delay: 1.5s;
}

.part2.swiper-slide-active .part2-name {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 2.5s;
}

.part2.swiper-slide-active .part2-p p {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 3s;
}

.part2.swiper-slide-active .part2-more a {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 3.5s;
}

.part2.swiper-slide-active .part2-img {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 4s;
}


/* Ã§Â¬Â¬Ã¤Â¸â€°Ã©Æ’Â¨Ã¥Ë†â€  */
.part3 {
    background: url(../images/part3_bg.jpg) no-repeat center 0;
}

.part3 .wrap {
    perspective: 1000px;
    align-items: flex-end;
}

.part3-title {
    text-align: center;
    opacity: 0;
    transform: translate3d(0, 50%, 0);
    transition: 1s;
}

.part3-nav {
    padding: 45px 0 90px;
    opacity: 0;
    transform: translate3d(0, 40%, 0);
    transition: 1s;
}

.part3-nav ul {
    display: flex;
    justify-content: center;
    width: 470px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #707070;
    border-radius: 25px;
}

.part3-nav ul li a {
    display: block;
    padding: 8px 15px;
    font: 400 16px/30px 'Ã¥Â¾Â®Ã¨Â½Â¯Ã©â€ºâ€¦Ã©Â»â€˜';
    color: #565656;
    background: url(../images/line.jpg) no-repeat 0 center;
}

.part3-nav ul li:nth-child(1) a {
    background: none;
}

.part3-nav ul li a:hover {
    color: #2c7f4f;
}

.part3-nav ul li.active a {
    color: #2c7f4f;
}


.part3-bottom {
    opacity: 0;
    transform: rotateX(-90deg);
    transform-origin: center bottom;
    transition: 1s;
}

.part3-bottom ul {
    display: flex;
    justify-content: center;
}

.part3-bottom ul li {
    width: 25%;
    padding: 10px 5px;
    background: #fff;
}

.part3-bottom ul li a {
    position: relative;
    display: block;
    background: rgba(196, 215, 0, 1);
}

.part3-li-layer {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: 1s;
}

.part3-li-layer p {
    font: 400 50px/56px 'Ã¥Â¾Â®Ã¨Â½Â¯Ã©â€ºâ€¦Ã©Â»â€˜';
    color: #fff;
}

.part3-bottom ul li img {
    width: 100%;
}

.part3-bottom ul li a:hover img {
    opacity: 0.2;
}

.part3-bottom ul li a:hover .part3-li-layer {
    top: 0;
    opacity: 1;
}

/* Ã¥Å Â¨Ã§â€Â» */
.part3.swiper-slide-active .part3-title {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 1s;
}

.part3.swiper-slide-active .part3-nav {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 1.5s;
}

.part3.swiper-slide-active .part3-bottom {
    opacity: 1;
    transform: rotateX(0);
    transition-delay: 2s;
}



/* Ã§Â¬Â¬4Ã©Æ’Â¨Ã¥Ë†â€  */
.part4 {
    background: url(../images/part4_bg.jpg) no-repeat center center/cover;
}

.part4-main {
    width: 1200px;
    margin: 0 auto;
}

.part4-title {
    text-align: center;
    opacity: 0;
    transform: translate3d(0, 50%, 0);
    transition: 1s;
}

.part4-nav {
    height: 84px;
    margin: 15px 0 0;
    padding: 40px 0 0;
    background: url(../images/part4_icon.png) no-repeat center center;
    opacity: 0;
    transform: translate3d(0, 40%, 0);
    transition: 1s;
}

.part4-nav ul {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 42px;
}

.part4-nav ul li {
    padding: 0 8px;
}

.part4-nav ul li a {
    display: block;
    font: bold 18px/36px 'Ã¥Â¾Â®Ã¨Â½Â¯Ã©â€ºâ€¦Ã©Â»â€˜';
    color: #fff;
}

.part4-nav ul li a:hover {
    color: #1c753f;
}

.part4-box {
    position: relative;
    margin: 24px 0 0;
    padding: 0 80px;
    opacity: 0;
    transform: translate3d(0, 30%, 0);
    transition: 1s;
}

.part4-left {
    position: absolute;
    z-index: 11;
    left: 0;
    top: 50%;
    transform: translate3d(0, -50%, 0);
    cursor: pointer;
}

.part4-right {
    position: absolute;
    z-index: 11;
    right: 0;
    top: 50%;
    transform: translate3d(0, -50%, 0);
    cursor: pointer;
}

.part4-banner .swiper-slide img {
    width: 100%;
}


/* Ã¥Å Â¨Ã§â€Â» */
.part4.swiper-slide-active .part4-title {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 1s;
}

.part4.swiper-slide-active .part4-nav {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 1.5s;
}

.part4.swiper-slide-active .part4-box {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 2s;
}



/* Ã§Â¬Â¬5Ã©Æ’Â¨Ã¥Ë†â€  */
.part5 {
    perspective: 1000px;
    background: url(../images/part5_bg.jpg) no-repeat center center/cover;
}

.part5-layer {
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(../images/part5_layer.png) no-repeat 0 center;
}

.part5-main {
    position: relative;
    z-index: 10;
    width: 1200px;
    margin: 0 auto;
}

.part5-title {
    margin: 0 0 20px;
    text-align: center;
    opacity: 0;
    transform: translate3d(0, 50%, 0);
    transition: 1s;
}

.part5-nav {
    opacity: 0;
    transform: translate3d(0, 40%, 0);
    transition: 1s;
}

.part5-nav ul {
    display: flex;
    justify-content: center;
    width: 340px;
    margin: 0 auto;
    padding: 10px 0;
    border: 1px solid #565656;
    border-radius: 25px;
}

.part5-nav ul li {
    padding: 0 15px;
    background: url(../images/line.jpg) no-repeat 0 center;
}

.part5-nav ul li:nth-child(1) {
    background: none;
}

.part5-nav ul a {
    display: block;
    font: 400 16px/24px 'Ã¥Â¾Â®Ã¨Â½Â¯Ã©â€ºâ€¦Ã©Â»â€˜';
    color: #323232;
}

.part5-box {
    width: 550px;
    padding: 20px 0 0;
}

.part5-box li {
    padding: 30px 0;
    opacity: 0;
    transform: rotateX(-90deg);
    transition: 1s;
}

.part5-box li a {
    display: flex;
}

.new-li-img {
    width: 112px;
    height: 112px;
    overflow: hidden;
}

.new-li-img img {
    width: 100%;
    height: 100%;
}

.new-li-font {
    width: 438px;
    padding: 0 0 0 24px;
    transition: 1s;
}

.new-li-title {
    position: relative;
    padding: 0 100px 0 0;

}
.new-li-title p{
    overflow: hidden;
    font: bold 14px/24px 'Ã¥Â¾Â®Ã¨Â½Â¯Ã©â€ºâ€¦Ã©Â»â€˜';
    color: #2f2f2f;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.new-li-title span {
    position: absolute;
    right: 0;
    top: 0;
    font: 400 12px/24px 'Ã¥Â¾Â®Ã¨Â½Â¯Ã©â€ºâ€¦Ã©Â»â€˜';
    color: #979797;
}

.new-li-p {
    font: 400 14px/24px 'Ã¥Â¾Â®Ã¨Â½Â¯Ã©â€ºâ€¦Ã©Â»â€˜';
    color: #505050;
    text-align: justify;
}

.part5-box li a:hover {
    padding: 0 8px 0 16px;
}

/* Ã¥Å Â¨Ã§â€Â» */
.part5.swiper-slide-active .part5-title {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 1s;
}

.part5.swiper-slide-active .part5-nav {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 1.5s;
}

.part5.swiper-slide-active .part5-box li {
    opacity: 1;
    transform: rotateX(0);
    transition-delay: 2s;
}



/* Ã§Â¬Â¬6Ã©Æ’Â¨Ã¥Ë†â€  */
.part6 {
    background: url(../images/part6_bg.png) no-repeat center 0/cover;
}

.part6 .wrap {
    align-items: center;
}

.part6-main {
    width: 1200px;
    margin: 0 auto;
}

.part6-title {
    text-align: center;
    opacity: 0;
    transform: translate3d(0, 50%, 0);
    transition: 1s;
}

.part6-tel {
    padding: 20px 0 45px;
    font: bold 36px/42px 'Ã¥Â¾Â®Ã¨Â½Â¯Ã©â€ºâ€¦Ã©Â»â€˜';
    text-align: center;
    color: #fff;
    opacity: 0;
    transform: translate3d(0, 40%, 0);
    transition: 1s;
}

.part6-box {
    display: flex;
    border: 1px solid #fff;
    opacity: 0;
    transform: translate3d(0, 30%, 0);
    transition: 1s;
}

.part6-li {
    width: 33.33%;
    padding: 25px 30px 25px 100px;
}

.part6-li:nth-child(1) {
    background: url(../images/part6_icon1.png) no-repeat 30px center;
}

.part6-li:nth-child(2) {
    background: url(../images/part6_icon2.png) no-repeat 30px center;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
}

.part6-li:nth-child(3) {
    background: url(../images/part6_icon3.png) no-repeat 30px center;
}

.part6-li p {
    font: 400 16px/30px 'Ã¥Â¾Â®Ã¨Â½Â¯Ã©â€ºâ€¦Ã©Â»â€˜';
    color: #fff;
}

.part6-ewm {
    padding: 40px 0;
    text-align: center;
    opacity: 0;
    transform: translate3d(0, 20%, 0);
    transition: 1s;
}

.part6-foot {
    display: flex;
    justify-content: space-between;
    font: 400 14px/24px 'Ã¥Â¾Â®Ã¨Â½Â¯Ã©â€ºâ€¦Ã©Â»â€˜';
    color: #fff;
    opacity: 0;
    transform: translate3d(0, 10%, 0);
    transition: 1s;
}

.foot-right {
    display: flex;
}

.foot-right p {
    padding: 0 5px;
}

/* Ã¥Å Â¨Ã§â€Â» */
.part6.swiper-slide-active .part6-title {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 1s;
}

.part6.swiper-slide-active .part6-tel {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 1.5s;
}

.part6.swiper-slide-active .part6-box {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 2s;
}

.part6.swiper-slide-active .part6-ewm {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 2.5s;
}

.part6.swiper-slide-active .part6-foot {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: 3s;
}


@media (max-width:1480px) {

    .banner-font,
    .banner-layer {
        width: 100%;
        height: 100%;
    }

    .banner-font {
        padding: 10% 0 0 175px;
    }

    .banner-font img {
        width: 80%;
    }

    .banner-layer img {
        width: 100%;
        height: 100%;
    }

    .part5-layer {
        background-size: 70% 100%;
    }
}



@media (max-width:1380px) {
    .wrap {
        padding: 0 0 0 150px;
    }

    .banner-font {
        padding: 5% 0 0 150px;
    }

    .banner-font img {
        width: 75%;
    }


    .part2-main {
        width: 1100px;
    }

    .part2-title {
        margin-bottom: 60px;
    }

    .part2-right {
        padding-left: 25px;
    }

    .part2-name {
        padding-bottom: 10px;
    }

    .part2-img ul li {
        width: 150px;
    }

    .part2-img ul li a {
        padding: 10px 0;
    }

    .part3-nav {
        padding: 30px 0 60px;
    }

    .part4-main {
        width: 1100px;
    }

    .part4-banner img {
        width: 100%;
    }

    .part5-main {
        width: 1100px;
    }

    .part5-layer {
        background-size: 72% 100%;
    }

    .part5-box li {
        padding: 20px 0;
    }

    .part6-main {
        width: 1100px;
    }

    .part6-tel {
        padding: 10px 0 35px;
    }

    .part6-ewm {
        padding: 20px 0;
    }

}