@charset "UTF-8";

.main-visual {position:relative; background:#fff; overflow:hidden;}
.main-visual .mainSlider {position:relative;}
.main-visual .slick-slide {position:relative; height:100vh; overflow:hidden;}
.main-visual .item {position:absolute; top:0; left:0; width:100%; height:100%; overflow:hidden;}
.main-visual .item .video-js,
.main-visual .item video {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover;}
.main-visual .item iframe {position:absolute; top:50%; left:50%; width:100vw; height:100vh; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%);}
.main-visual .item img {position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.main-visual .caption {position:absolute;top:50%;left:0; width:100%; text-align:center; transform:translateY(-50%); z-index:10;}
.main-visual .caption img {display:inline-block;}
.main-visual .btns {position:absolute; top:60%; left:50%; width:90px; margin-left:-45px;display:flex; align-items:center; justify-content:center; background:rgba(249,249,249,.15); height:34px; border-radius:34px; z-index:11;}
.main-visual .btns .arrow {display:none; margin-right:20px; /* display:flex; */}
.main-visual .slider-pause,
.main-visual .slider-play {width:13px; height:13px; text-indent:-9999em; border:0; border-radius:100%;  background-repeat:no-repeat; background-position:50% 50%; background-color:transparent; z-index:5}
.main-visual .slider-play {background-image:url('../img/main/bt_play.png'); margin-right:10px;}
.main-visual .slider-pause {background-image:url('../img/main/bt_stop.png')}
.main-visual .slider-pause:focus,
.main-visual .slider-play:focus {outline:0}
.main-visual .slick-counter {display:flex; color:#fff; z-index:6; font-size:18px; line-height:1.3em; font-weight:700;}
.main-visual .slick-counter .total {opacity:.6;}
.main-visual .slick-counter .bar {padding:0 6px;  opacity:.6;}
.main-scroll {position:absolute; bottom:30px; left:50%; width:90px; text-align:center; transform:translateX(-50%); z-index:12;
	-webkit-animation: scrollDown .9s linear infinite alternate;
    -moz-animation: scrollDown .9s linear infinite alternate;
    -o-animation: scrollDown .9s linear infinite alternate;
    -ms-animation: scrollDown .9s linear infinite alternate;
    animation: scrollDown .9s linear infinite alternate;
}
.main-scroll p {font-size:12px; line-height:1.3em; color:#fff; margin-bottom:15px;}
.main-scroll .down-arrow-1,
.main-scroll .down-arrow-2 {width:10px; height:8px; margin:0 auto; background:url('../img/main/scroll_down.png') 50% 50% no-repeat; animation: mouse-scroll 1s infinite;}
.main-scroll .down-arrow-1 {margin:0 auto 5px; animation-delay: .1s;  animation-direction: alternate;}
.main-scroll .down-arrow-2 {animation-delay: .3s; animation-direction: alternate}

@keyframes mouse-scroll {
  0% {
    opacity: .1;
  }
  50% {
    opacity: 0.5;
  }
  100% {
    opacity: 1;
  }
}
@keyframes scrollDown{from{bottom:30px;}to{bottom:40px;}}


.main-product {position:relative; padding:150px 0; background:#fff; z-index:2; overflow:hidden;}
.main-product h2 {font-size:60px; line-height:1.4em; color:#071624; margin-left:63px; }
.main-product .inner {max-width:1567px;}
.main-product .product-inner {position:relative;}
.main-product .menu {width:470px; margin-left:63px; position:absolute;  padding-top:75px;}
.main-product .menu ul {display:block; padding-bottom:20px;}
.main-product .menu ul li {width:auto; margin-bottom:16px; position:relative; display:flex; align-items:center;}
.main-product .menu ul li:last-child {margin-bottom:0;}
.main-product .menu ul li a {display:inline-flex; align-items:center; padding:0 40px;height:50px; border:1px solid #e5e5e5; background:#fff; border-radius:25px; color:#1e1e1e; font-size:22px; line-height:1.4em; font-weight:500; position:relative;}
.main-product .menu ul li .line {width:80px; height:1px; background:#000; margin-right:10px; opacity:0;}
.main-product .menu ul li .num {font-size:18px; line-height:1.4em; font-weight:700; color:#000; opacity:0;}
.main-product .menu ul li.active a {background:#000; border-color:#000; font-weight:700; color:#fff; box-shadow:10px 10px 20px rgba(0,0,0,.10);}
.main-product .menu ul li.active .line,
.main-product .menu ul li.active .num {opacity:1;}
.main-product .left-menu.fixed {position:fixed; top:150px; left:50%; margin-left:-700px; z-index:10}
.main-product .left-menu.fixed-bottom {position:absolute; bottom:50px; left:50%; margin-left:-700px; z-index:10}
.main-product .content {margin-left:auto; padding-left:67px; width: calc(100% - 470px);  padding-top:75px;}
.main-product .content ul {display:flex; flex-wrap:wrap; margin:0 -25px;}
.main-product .content ul li {width:50%; padding:0 25px; margin-bottom:225px; font-size:18px; line-height:1.4em; position:relative;}
.main-product .content ul li:nth-child(even) {margin-bottom:0; margin-top:225px;}
.main-product .content ul li:last-child {margin-bottom:0;}
.main-product .content ul li a {display:block; position:relative;  overflow:hidden; background-repeat:no-repeat; background-position:50% 50%; background-size:cover; transition: all .5s ease-in-out;}
.main-product .content ul li .cont {position:absolute; top:0; left:0; width:100%; height:570px; padding:85px 55px; color:#fff; z-index:10}
.main-product .content ul li .num {font-weight:700; margin-bottom:40px;}
.main-product .content ul li p {opacity:.40; margin-bottom:24px;}
.main-product .content ul li h3 {font-size:43px; line-height:1.4em; font-weight:700;}
.main-product .content ul li .more {position:absolute; bottom:125px; left:55px; width:170px; height:54px; border:1px solid rgba(255,255,255,.5); border-radius:54px; color:#fff; display:flex; align-items:center; justify-content:center; transition: all 0.2s}
.main-product .content ul li .more .arrow {width:0; height:0; background:url('../img/main/arrow.png') 50% 50% no-repeat; margin-left:15px; opacity:0; display:block; transition: all 0.2s}
.main-product .content ul li .pic {position:relative; height:0; padding-bottom:121%; overflow:hidden; border-radius:20px;}
.main-product .content ul li .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.main-product .content ul li a:hover .more {border-color:#fff;}
.main-product .content ul li a:hover .more .arrow {opacity:1; width:15px; height:11px;}
.main-product .content ul li a:hover .pic img {transform:translateY(-50%) scale(1.06,1.06); -ms-transform:translateY(-50%) scale(1.06,1.06); -webkit-transform:translateY(-50%) scale(1.06,1.06);}
.main-product .bg1 {position:absolute; bottom:0; right:0;  width:100%; height:100%; z-index:-1; background:url('../img/main/product_b_bg1.png') 50% 100% no-repeat;}
.main-product .bg2 {position:absolute; bottom:0; left:0;  width:100%; height:100%; z-index:-1; background:url('../img/main/product_b_bg2.png') 0 100% no-repeat;}
.main-product .bg3 {position:absolute; top:0; right:0;  width:100%; height:100%; z-index:-1; background:url('../img/main/product_r_bg.png') 100% 0 no-repeat;}
.main-product .bg4 {position:absolute; bottom:0; right:0;  width:100%; height:100%; z-index:-1; background:url('../img/main/product_line_bg.png') 0% 100% no-repeat;}


.main-more {width:170px; height:54px; border:1px solid rgba(255,255,255,.5); border-radius:54px; font-size:18px; color:#fff; display:inline-flex; align-items:center; justify-content:center; transition: all 0.2s}
.main-more .arrow {width:0; height:0; background:url('../img/main/arrow.png') 50% 50% no-repeat; margin-left:15px; opacity:0; display:block; transition: all 0.2s}
.main-more:hover {border-color:#fff;}
.main-more:hover .arrow {opacity:1; width:15px; height:11px;}

.main-company {height:868px; display:flex; align-items:center; justify-content:center;}
.main-company .content {text-align:center; color:#fff;}
.main-company .content h2 {font-size:20px; line-height:1.3em; color:#3deaa9;font-weight:400; margin-bottom:50px;}
.main-company .content .tit {font-size:52px; line-height:1.25em; font-weight:700; margin-bottom:40px;}
.main-company .content p {font-size:20px; line-height:1.65em; opacity:.80; margin-bottom:70px;}
.main-company .bg {position:fixed; top:0; left:0; width:100%; height:100%; background:url('../img/main/company_bg.jpg') 50% 50% no-repeat; background-size:cover; z-index:-10;}

.main-sustain {padding:185px 0 240px; background:#fff;}
.main-sustain .slide-inner {margin-left:570px; position:relative;}
.main-sustain .slick-list {padding-right:100px;}
.main-sustain .item a {display:block;}
.main-sustain .item-inner {display:flex; align-items:center; opacity:.36; transition: all .5s ease-in-out;}
.main-sustain .item-inner .photo {width:731px; margin-right:96px;}
.main-sustain .item-inner .pic {position:relative; height:0; padding-bottom:92.6%; overflow:hidden;}
.main-sustain .item-inner .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.main-sustain .item-inner .info {flex:1 1 auto; min-width:0; width:1%; color:#071624; position:relative; padding-right:20px;}
.main-sustain .item-inner .info h2 {color:#007e4f; font-size:50px; line-height:1.4em; font-weight:700; margin-bottom:60px;}
.main-sustain .item-inner .info dl dt {font-size:30px; line-height:1.4em;font-weight:700; margin-bottom:22px;}
.main-sustain .item-inner .info dl dd {font-size:20px ;line-height:1.5em;}
.main-sustain .item-inner .info .more {position:absolute; top:50%; right:100px; width:98px; height:68px; display:inline-block;  z-index:10}
.main-sustain .item-inner .info .more:before {content:"";position:absolute; top:0; left:-20px; width:100%; height:100%; background:url('../img/main/arrow_more.png') 0 50% no-repeat; z-index:1; transition:0.4s;}
.main-sustain .item-inner .info .more:after {content:"";position:absolute; top:0; right:20px; width:68px; height:68px; border-radius:100%; background:#ebf6eb; transition:0.5s; z-index:0;}
.main-sustain .item a:hover .item-inner .info .more:after {right:0;}
.main-sustain .item a:hover .item-inner .info .more:before {left:0;}
.main-sustain .slick-slide.slick-current .item-inner {opacity:1;}
.main-sustain .slick-number {position:absolute; bottom:0; left:50%; color:#000; margin-left:-170px; z-index:20; font-size:14px; line-height:1.4em;font-weight:500; display:flex; align-items:center;}
.main-sustain .slick-number .bar {width:60px; height:1px; background:#bdbdbd; margin:0 5px;}
.main-sustain .slick-arrow {position:absolute; top:50%; width:100px; height:68px; margin-top:-34px;font-size:0; line-height:0; background:transparent;  z-index:20}
.main-sustain .slick-arrow:focus {outline:0;}
.main-sustain .slick-arrow:before {content:""; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-color:transparent; background-position:50% 50%; background-size:contain; z-index:1;}
.main-sustain .slick-arrow:after {content:""; position:absolute; top:0; width:68px; height:68px; background:#ebf6eb; border-radius:100%; z-index:0;}
.main-sustain .slick-prev {left:-130px; }
.main-sustain .slick-prev:before {background-image:url('../img/main/slide_prev.png')}
.main-sustain .slick-prev:after {left:0;}
.main-sustain .slick-next {right:160px;}
.main-sustain .slick-next:before {background-image:url('../img/main/slide_next.png')}
.main-sustain .slick-next:after {right:0;}


@media (max-width: 1920px) {
	.main-sustain .slide-inner {margin-left:260px;}
	.main-sustain .slick-number {margin-left:10px;}
}

.main-news {padding-bottom:110px; background:#fff url('../img/main/news_bg.png') 0 100% no-repeat;}
.main-news .inner {position:relative;}
.main-news .main-more {position:absolute; top:20px; right:20px; border-color:#bcbcbc; color:#7a7a7a}
.main-news .main-more .arrow {background-image:url('../img/main/arrow2.png')}
.main-news .main-more:hover {border-color:#7a7a7a;}
.main-news h2 {font-size:60px; line-height:1.4em; font-weight:700; margin-bottom:70px;}
.main-news .slick-list {margin:0 -8px;}
.main-news .slick-track {margin:0;}
.main-news .slick-slide {padding:0 8px 30px;}
.main-news .news-slider a {display:block; border:1px solid #b7b7b7; border-radius:20px; overflow:hidden;}
.main-news .news-slider a .thumb {position:relative; height:0; padding-bottom:83.7%; overflow:hidden;}
.main-news .news-slider a .thumb img {position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.main-news .news-slider a .info {padding:44px 30px; background:#fff;}
.main-news .news-slider a .info .tit {font-size:24px; line-height:1.3em; margin-bottom:20px; font-weight:700; color:#000; height:calc(1.3em * 1 * 2); -webkit-line-clamp:2; overflow:hidden; text-overflow:ellipsis; word-break:break-all; white-space:normal; display:-webkit-box;  -webkit-box-orient:vertical; }
.main-news .news-slider a .info .date {color:#9a9a9a; font-size:20px;line-height:1.3em;}
.main-news .news-slider a:hover {box-shadow:5px 10px 20px rgba(0,0,0,.10);}
.main-news .news-slider a:hover {border-color:#000;}
.main-news .news-slider a:hover .thumb img {transform:translateY(-50%) scale(1.06,1.06); -ms-transform:translateY(-50%) scale(1.06,1.06); -webkit-transform:translateY(-50%) scale(1.06,1.06);}
.main-news .slick-dots {display:flex; justify-content:center; margin-top:25px;}
.main-news .slick-dots li {line-height:0; padding:0 5px;} 
.main-news .slick-dots li button {border:0; font-size:0; line-height:0; width:12px; height:12px; background:#ececec; border-radius:100%;}
.main-news .slick-dots li button:focus {outline:0;}
.main-news .slick-dots li.slick-active button {background:#1d611d}


.main-contact {background:url('../img/main/contact_bg.jpg') 50% 50% no-repeat; background-size:cover; padding:125px 0;}
.main-contact .inner {display:flex; justify-content:flex-end;}
.main-contact .bnr-inner {max-width:937px; width:100%;}
.main-contact ul {display:flex; margin-left:-27px;}
.main-contact ul li {width:calc(50% - 27px); margin-left:27px; border-radius:18px; color:#fff; transition:0.3s;}
.main-contact ul li:nth-child(1) {background:rgba(0,129,79,.60);}
.main-contact ul li:nth-child(2) {background:rgba(0,0,0,.33);}
.main-contact ul li a {display:block; position:relative; padding:184px 50px 100px;}
.main-contact ul li a i {display:block; margin-bottom:35px;}
.main-contact ul li a dl dt {font-size:41px; line-height:1.4em; font-weight:700; margin-bottom:28px;}
.main-contact ul li a dl dd {font-size:18px; line-height:1.67em; letter-spacing:-.02em;}
.main-contact ul li a .more {position:absolute; top:100px; right:100px; width:37px; height:37px; background:url('../img/main/bnr_more.png') 50% 50% no-repeat; background-size:contain; transition:0.3s; opacity:0;}
.main-contact ul li a:hover .more {opacity:1; top:55px; right:52px;}
.main-contact ul li:nth-child(1):hover {background:rgba(0,129,79,.80);}
.main-contact ul li:nth-child(2):hover {background:rgba(0,0,0,.50);}