.index_banner{width: 100%;height: 100vh;position: relative;}
.index_banner .txt{height: 100%;display: flex;flex-direction: column;justify-content: center;color: #fff;text-shadow: 0 1px 1px #000;}
.index_banner video{position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;}
.index_banner .btn_play{position: absolute;left: calc(50% - 25px);bottom: 30%;cursor: pointer;opacity: .5;width: 50px;height: 50px;transition: all .3s ease-out;}
.index_banner .btn_play svg{width: 100%;height: 100%;}
.index_banner .btn_play:hover{opacity: 1;}



.index_booking{padding: 100px 0;display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;}
.index_booking .title h2{font-size: 28px;line-height: 1;font-weight: normal;letter-spacing: 2px;}
.index_booking .title h2:after{content: '';display: block;width: 1em;height: 2px;background-color: var(--primary-color);margin-top: 5px;}
.index_booking .title h3{font-size: 14px;font-weight: normal;}
.booking{width: calc(100% - 220px);}
.booking ul{display: flex;flex-wrap: wrap;justify-content: space-between;}
.booking ul li{width: 24%;height: 56px;border: 1px solid #ebebeb;padding: 10px 16px;display: flex;align-items: center;}
.booking ul li label{font-size: 14px;color: #999;white-space: nowrap;}
.booking ul li input[type="text"]{width: 100%;height: 100%;font-size: 16px;border: none;background: none;}
.booking ul li:last-child{padding: 0;}
.booking ul li button{width: 100%;height: 100%;font-size: 14px;color: #fff;background: var(--primary-color);text-align: center;cursor: pointer;position: relative;z-index: 1;}
.booking ul li button:before{content: '';position: absolute;top: 0;left: 50%;z-index: -1;transform: translateX(-50%);height: 100%;width: 0;background-color: rgba(255,255,255,.12);transition: all 0.3s ease-in-out;}
.booking ul li button:hover:before{width: 100%;}

.index_title{text-align: center;color: #fff;}
.index_title h2{font-size: 48px;font-weight: normal;letter-spacing: 2px;}
.index_title p{font-size: 16px;}

.index_case{background-color: var(--primary-color);padding: 90px 0;}
.index_case ul{display: flex;flex-wrap: wrap;justify-content: space-between;margin-top: 40px;}
.index_case ul li{width: 24.5%;overflow: hidden;position: relative;}
.index_case ul li:after{content: '';display: block;padding-top: 117%;}
.index_case ul li a .pic,
.index_case ul li a .title:before,
.index_case ul li a .title{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}

.index_case ul li a .pic{background-repeat: no-repeat;background-position: center;background-size: cover;transition: all 0.5s ease-in-out;}
.index_case ul li a .title{display: flex;flex-direction: column;justify-content: center;text-align: center;}
.index_case ul li a .title:before{content: '';display: block;background-color: rgba(243 162, 62,.2);opacity: 0;transition: all 0.3s ease-in-out;}
.index_case ul li a .title h2{font-size: 36px;font-weight: normal;color: #7a6f65;margin-bottom: 6px;letter-spacing: 1px;}
.index_case ul li a .title p{font-size: 18px;color: #fff;}
.index_case ul li:hover a .pic{transform: scale(1.05);}
.index_case ul li:hover a .title:before{opacity: 1;}

.index_pro{padding: 90px 0;}
.index_pro .index_title h2{color: #000;}
.index_pro .index_title p{color: #666;}
.index_section_nav{width: 100%;text-align: center;margin: 40px 0;}
.index_section_nav li{display: inline-block;color: #666;border-right: 1px solid #666;line-height: 1;padding: 0 26px 0 20px;}
.index_section_nav li a{position: relative;}
.index_section_nav li a:after{content: '';position: absolute;bottom: -10px;left: 0;width: 0;height: 2px;background-color: var(--primary-color);transition: all .3s linear;}
.index_section_nav li:last-child{border: none;}
.index_section_nav li a:hover{color: var(--primary-color);}
.index_section_nav li a:hover:after{width: 100%;}
.index_pro .picList{display: flex;justify-content: space-between;flex-wrap: wrap;}
.index_pro .picList li{overflow: hidden;position: relative;}
.index_pro .picList li:nth-child(1),
.index_pro .picList li:nth-child(2),
.index_pro .picList li:nth-child(3){width: 33%;margin-bottom: .6%;}
.index_pro .picList li:nth-child(4),
.index_pro .picList li:nth-child(5),
.index_pro .picList li:nth-child(6){width: 24.55%; margin-right:10px;}
.index_pro .picList li:nth-child(7){width: 24.55%;margin-right:0px}
.index_pro .picList li:after{content: '';display: block;padding-top: 100%;}
.index_pro .picList li a .pic,
.index_pro .picList li a .title:after,
.index_pro .picList li a .title{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.index_pro .picList li a .pic{background-repeat: no-repeat;background-position: center;background-size: cover;transition: all 0.8s ease-in-out;}
.index_pro .picList li a .title{display: flex;flex-direction: column;justify-content: center;text-align: center;}
.index_pro .picList li a .title:after{content: '';display: block;z-index: 2;transition: all 0.3s ease-in-out;}
.index_pro .picList li:nth-child(1) a .title:after{background-color: rgba(243 162, 62,0);}
.index_pro .picList li a .title h2{font-size: 36px;font-weight: normal;color: #fff;letter-spacing: 1px;transition: all 0.5s ease-in-out;opacity: 0;margin-bottom: 6px;}
.index_pro .picList li a .title h2 span{position: relative;}
.index_pro .picList li a .title h2 span:before,
.index_pro .picList li a .title h2 span:after{content: '';display: block;position: absolute;top: 50%;width: 2em;height: 1px;background-color: #fff;}
.index_pro .picList li a .title h2 span:before{left: -3em;animation: moverL 2s linear infinite;}
.index_pro .picList li a .title h2 span:after{right: -3em;animation: moverR 2s linear infinite;}
.index_pro .picList li a .title p{font-size: 16px;color: #fff;transition: all 0.5s ease-in-out;opacity: 0;}
.index_pro .picList li:hover a .pic{transform: scale(1.1);}
.index_pro .picList li:hover a .title h2,
.index_pro .picList li:hover a .title p{opacity: 1;}
.index_pro .picList li:hover a .title:after{opacity: 0;}

.more{display: flex;align-items: center;justify-content: center;width: 24%;padding: 12px 0;border: 1px solid #999;margin: 50px auto 0;text-align: center;color: #999;position: relative;transition: all 0.3s ease-in-out;}
.more i{width: 16px;height: 16px;background: url(../images/icon06.png) no-repeat center/contain;display: inline-block;margin-left: 10px;transition: all 0.3s 0.3s ease-in-out;}
.more:before{content: '';position: absolute;top: 0;left: 0;z-index: -1;width: 0;height: 100%;background-color: var(--primary-color);opacity: 0;transition: all 0.5s ease-in-out;}
.more:hover{color: #fff;border-color: var(--primary-color);}
.more:hover i{transform: translateX(10px);}
.more:hover:before{width: 100%;opacity: 1;}

.index_style{background-color: var(--primary-color); padding: 90px 0;}
.index_style ul{display: flex;flex-wrap: wrap;justify-content: space-between;margin-top: 40px;}
.index_style ul li{width: 33%;overflow: hidden;position: relative;margin-top: .6%;}
.index_style ul li:after{content: '';display: block;padding-top: 66%;}
.index_style ul li a .pic{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.index_style ul li a .title{position: absolute;bottom: -60px;left: 0;width: 100%;height: 60px;line-height: 60px;padding: 0 20px;overflow: hidden;background-color: rgba(243 162, 62,.2);opacity: 0;transition: all 0.3s ease-in-out;}

.index_style ul li a .pic{background-repeat: no-repeat;background-position: center;background-size: cover;transition: all 0.5s ease-in-out;}
.index_style ul li a .title h2{float: left;font-size: 22px;font-weight: normal;color: #fff;letter-spacing: 1px;}
.index_style ul li a .title p{float: right;font-size: 14px;color: #fff;}
.index_style ul li:hover a .pic{transform: scale(1.05);}
.index_style ul li:hover a .title{bottom: 0;opacity: 1;}

.index_news{padding: 90px 0; }
.index_news .index_title h2{color: #000;}
.index_news .index_title p{color: #666;}
.swiperNews{margin-top: 50px;padding-bottom: 80px; position: relative;}
.swiperNews .swiper-slide .pic{width: 100%;background-repeat: no-repeat;background-position: center;background-size: cover;transition: all 0.3s ease-in-out;position: relative;}
.swiperNews .swiper-slide .pic:before{content: '';position: absolute;top: 0;left: 0;width: 100%;height: 0;background-color: rgba(243 162, 62,.2);transition: all 0.3s ease-in-out;}
.swiperNews .swiper-slide .pic:after{content: '';display: block;padding-top: 64%;}
.swiperNews .swiper-slide .date{color: #999;font-size: 20px;margin: 20px 0 16px;text-align: center;transition: all 0.2s ease-in-out;}
.swiperNews .swiper-slide .dot{width: 100%;height: 1px;background-color: #eee;text-align: center;position: relative;}
.swiperNews .swiper-slide .dot:before,
.swiperNews .swiper-slide .dot:after{content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);border-radius: 50%;transition: all 0.4s ease;}
.swiperNews .swiper-slide .dot:before{width: 4px;height: 4px;background-color: #d4d4d4;}
.swiperNews .swiper-slide .dot:after{width: 12px;height: 12px;border: 1px solid #d4d4d4;}
.swiperNews .swiper-slide h2,
.swiperNews .swiper-slide p{text-align: center;overflow:hidden; text-overflow:ellipsis;display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.swiperNews .swiper-slide h2{padding: 16px 0 50px;font-size: 20px;color: #000;font-weight: normal;position: relative;}
.swiperNews .swiper-slide h2:after{content: '';display: block;position: absolute;left: 50%;bottom: 25px;width: 30px;height: 1px;background-color: #999;transform: translateX(-50%);transition: all 0.4s ease;}
.swiperNews .swiper-slide p{font-size: 14px;color: #666;line-height: 1.8;}
.swiperNews .swiper-slide:hover h2{color: var(--primary-color);transition: all 0.2s ease-in-out;}
.swiperNews .swiper-slide:hover h2:after{bottom: 10px;width: 1px;height: 30px;background-color: var(--primary-color);}
.swiperNews .swiper-slide:hover .date{color: #000;}
.swiperNews .swiper-slide:hover .pic:before{height: 100%;}
.swiperNews .swiper-slide:hover .dot:before{background-color: var(--primary-color);}
.swiperNews .swiper-slide:hover .dot:after{border-color: var(--primary-color);}
.swiperNews .swiper-pagination-bullet{background-color: var(--primary-color);}




/*响应式*/
@media screen and (max-width: 1200px){
	
	.swiperBanner .swiper-slide h3{font-size: 14px;}
	.swiperBanner .swiper-slide h2{font-size: 24px;letter-spacing: 1px;}
	.swiperBanner .swiper-slide a{width: 120px;height: 34px;line-height: 34px;}
	.index_booking{padding: 30px 4%;}
	.index_booking .title h2{font-size: 16px;}
	.index_booking .title h3{font-size: 12px;}
	.booking{width: 100%;margin-top: 14px;}
	.booking ul li{width: 100%;height: 40px;margin: 4px 0;}
	.index_case{padding: 20px 4%;}
	.index_case ul{margin-top: 10px;}
	.index_case ul li{width: 100%;margin-top: 10px;}
	.index_case ul li:after{padding-top: 100%;}
	.index_case ul li a .title h2{font-size: 24px;}
	.index_case ul li a .title p{font-size: 16px;}
	.index_pro{padding: 30px 2%;}
	.index_section_nav{display: none;}
	.index_pro .picList li{width: 100%!important;margin-top: 10px;}
	.index_pro .picList li a .title h2{opacity: 1;font-size: 22px;}
	.index_pro .picList li a .title p{opacity: 1;font-size: 12px;}
	.more{width: 40%;margin: 20px auto 0;padding: 6px 0;font-size: 14px;}
	.index_style{padding: 20px 4%;}
	.index_style ul{margin-top: 20px;}
	.index_style ul li{width: 100%;}
	.index_style ul li a .title{bottom: 0;opacity: 1;height: 36px;line-height: 36px;padding: 0 10px;font-size: 14px;}
	.index_style ul li a .title h2{font-size: 16px;}
	.index_style ul li a .title p{font-size: 12px;}
	.index_news{padding: 20px 4% 30px;}
	.swiperNews{padding-bottom: 40px;margin-top: 20px;}
	.swiperNews .swiper-slide .date{font-size: 12px;margin: 14px 0;}
	.swiperNews .swiper-slide h2{font-size: 16px;padding: 16px 0 30px;white-space: nowrap;display: block;}
	.swiperNews .swiper-slide h2:after{bottom: 12px;}
}


@media screen and (min-width: 1280px){
    .index_banner .swiper-pagination{bottom: 40px;}
    .index_banner .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{width: 12px;height: 12px;margin: 0 6px;background-color: #fff;}
    .index_banner .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet-active{width: 30px;border-radius: 10px;}
}

@media screen and (max-width: 768px){
	.index_banner{ margin-top: 50px; height: 240px;}
}