﻿@charset "utf-8";
section { width:1400px; position:relative; z-index:10;}
section img { max-width:100%;}

.index_swiper { width:100%;}
.index_swiper .swiper-slide p { color:#fff; text-transform:uppercase; overflow:hidden; position:absolute; left:0; z-index:20;}
.index_swiper .swiper-slide .img { width:100%; height:100%; top:0; z-index:10;}
.index_swiper .swiper-slide-active .img img { animation:swiper_active 6s ease;}
.index_swiper .swiper-pagination { width:auto; height:4px; padding:4px; background:rgba(0,0,0,0.4); border-radius:10px; left:50%; bottom:10px; transform:translateX(-50%); opacity:0; display:flex; align-items:center;}
.index_swiper .swiper-pagination.open { opacity:1;}
.index_swiper .swiper-pagination-bullet { width:4px; height:100%; margin:0 2px !important; background:#fff; border-radius:4px; font-size:0; transition:width 0.3s;}
.index_swiper .swiper-pagination-bullet-active { width:16px; background:#ff6b00;}
.index_swiper .swiper-button { display:none;}
@keyframes swiper_active {
	0% { transform:scale(1.08);}
	10% { transform:scale(1.08);}
	100% { transform:scale(1);}
}

.index_title { height:42px; margin-bottom:20px; line-height:1; color:#485157; position:relative;}
.index_title h2 { font-size:24px; font-weight:bold; position:absolute; top:0; left:0;}
.index_title h3 { font-size:12px; position:absolute; bottom:0; left:0;}
.index_title dl { display:flex; align-items:center; position:absolute; bottom:0; left:185px;}
.index_title dl dd { padding-left:35px; position:relative;}
.index_title dl dd:before { width:1px; height:12px; content:""; background:#9fa0a0; position:absolute; top:50%; left:18px; transform:translateY(-50%);}
.index_title dl dd:first-child { padding:0;}
.index_title dl dd:first-child:before { display:none;}
.index_title dl dd a { height:100%; display:block;}
.index_title dl dd a:hover { color:#ff9803;}
.index_title .more { padding-bottom:8px; font-size:12px; position:absolute; bottom:0; right:0;}
.index_title .more:after { width:100%; height:1px; content:""; background:#898989; position:absolute; bottom:0; left:0;}
.index_title .more i { height:100%; padding-right:12px; color:#898989; display:inline-block; position:relative;}
.index_title .more i:before,
.index_title .more i:after { width:7px; height:7px; content:""; background:#898989; position:absolute; top:50%;}
.index_title .more i:before { height:1px; right:0; margin-top:-1px;}
.index_title .more i:after { width:1px; right:3px; margin-top:-4px;}
.index_title .more:hover:after { background:#ff9803;}
.index_title .more:hover i { color:#ff9803;}
.index_title .more:hover i:before,
.index_title .more:hover i:after { background:#ff9803;}

.index_part01 { width:920px; padding:50px 480px 50px 0;}
.index_part01:before { width:1920px; height:100%; content:""; background:#f3f5f6; position:absolute; top:0; left:50%; transform:translateX(-50%);}

.index_product { position:relative;}
.index_product .list {}
.index_product .list .scroll { overflow:hidden;}
.index_product .list .auto_list { width:calc((100% + 25px) / 3 * 100); display:flex; align-items:center;}
.index_product .list li { width:calc(1% - 25px); margin-right:25px;}
.index_product .list li a { padding-bottom:30px; display:block; position:relative;}
.index_product .list li p { width:100%; text-align:center; position:absolute; left:0; z-index:10;}
.index_product .list li .img { height:calc(100% - 30px); top:0;}
.index_product .list li .name { height:16px; line-height:1; font-size:15px; color:#3e3a39; bottom:0;}
.index_product .list li:hover .img img { transform:scale(1.08);}
.index_product .list li:hover .name { color:#ff6b00;}

.index_video { width:440px; position:absolute; top:50px; right:0;}
.index_video .list { height:320px;}
.index_video .list li { height:100%; line-height:1; display:block; position:relative;}
.index_video .list .video { height:290px; background:#000;}
.index_video .list .video video { width:100%; height:100%;}
.index_video .list .name { color:#898989; position:absolute; bottom:0; left:0;}
.index_video .list .view { padding-left:18px; position:absolute; bottom:0; right:0;}
.index_video .list .view:before { width:11px; height:13px; content:""; background:url(../images/app.png) no-repeat -110px -60px; position:absolute; top:50%; left:0; transform:translateY(-6px);}

.index_part02 { padding-top:50px; display:flex; align-items:center;}

.index_about { width:560px; margin-right:40px;}
.index_about .info { height:500px; overflow:hidden;}

.index_news { width:calc(100% - 600px);}
.index_news .list { height:500px; overflow:hidden;}
.index_news .list li { height:110px; margin-top:20px; line-height:1; font-size:12px;}
.index_news .list li:first-child { margin:0;}
.index_news .list li a { height:100%; padding-left:185px; color:#898989; display:flex; flex-direction:column; position:relative;}
.index_news .list li .img { width:165px; height:100%; border-radius:8px; position:absolute; top:0; left:0;}
.index_news .list li .name { margin-top:5px; font-size:16px; color:#485157;}
.index_news .list li .text { height:40px; margin-top:10px; line-height:20px; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;}
.index_news .list li .date { display:flex; align-items:center; position:absolute; bottom:5px; left:185px;}
.index_news .list li .date span { padding-left:20px; margin-left:30px; display:inline-block; position:relative;}
.index_news .list li .date span:first-child { margin:0;}
.index_news .list li .date span:before { width:14px; height:14px; content:""; background:url(../images/app.png) no-repeat -110px -80px; position:absolute; top:50%; left:0; transform:translateY(-50%);}
.index_news .list li .date span:nth-child(2):before { width:22px; background-position:-125px -80px;}
.index_news .list li:hover .img img { transform:scale(1.1);}
.index_news .list li:hover .name { color:#ff6b00;}

@media (max-width:1600px){
section { width:1200px;}
.index_part01 { width:800px; padding-right:400px;}
.index_video { width:360px;}
.index_video .list { height:280px;}
.index_video .list .video { height:250px;}
}
