@charset "utf-8";

@keyframes proBar{
    0%{width:0;}
    100%{width:100%;}
}
.pro-ani{animation: proBar 5s 1;}

main{padding-top:120px;overflow: hidden;}
main .slide-section{padding-left: 120px;position: relative;}
main .slide-section .slide-wrap{position: relative;}
main .slide-section .slide-wrap .slick-slide{}
main .slide-section .slide-wrap .slick-slide img{display: block;width:100%;}
main .slide-section .control-box{position: absolute;width:100%;max-width: 1400px;left:50%;transform: translateX(-50%);bottom:40px;display: flex;align-items: center;gap:20px;}
main .slide-section .control-box .target-button{display: flex;gap:10px;align-items: center;}
main .slide-section .control-box .target-button button{display:block;}
main .slide-section .control-box .target-button .pause{display:none;}
main .slide-section .control-box .target-button .pause.active{display:block;}
main .slide-section .control-box .target-button .play{display:none;}
main .slide-section.control-box .target-button .play.active{display:block;}
main .slide-section .control-box .target-button button img{display:block;width:100%;}
main .slide-section .control-box .timeline{display:inline-block;width:140px;vertical-align:middle;position: relative;height:1px;background: rgba(255,255,255,0.5);z-index: 10;}
main .slide-section .control-box .pro-bar{position: absolute;display: inline-block;left: 0;right: 0;top: 0;height:1px;background: #fff;}
main .slide-section .control-box .pagingInfo{font-size: 14px;font-weight: normal;color: #fff;display: flex;align-items: center;gap:10px;}
main .slide-section .control-box .pagingInfo span{position: relative;}
main .slide-section .control-box .pagingInfo em{font-weight: bold;position: relative;}

main .section01{padding:140px 0 150px;}
main .section01 .layout{display: flex;}
main .section01 .layout > div{flex:1;width:100%;max-width: 50%;}
main .section01 .box{}
main .section01 .box .link-tab{display: flex;gap:50px;}
main .section01 .box .link-tab h2{position:relative;font-size: 18px;font-weight: bold;color: #202020;}
main .section01 .box .link-tab h2:after{content: "";position:absolute;left:0;bottom:0;width:100%;height:2px;background: #f06650;}
main .section01 .box .link-tab a{display: inline-block;font-size: 18px;font-weight: 600;color: #787878;}
main .section01 .box h3{margin-top:60px;font-size: 40px;font-weight: bold;line-height: 1.35;color: #202020; max-width: 480px; word-break: keep-all;}
main .section01 .box dl{margin-top:20px;}
main .section01 .box dl dt{width:82px;font-size: 18px;font-weight: 600;color: #787878;}
main .section01 .box dl dd{padding:0 0 5px 82px;font-size: 18px;font-weight: 600;color: #202020;}
main .section01 .box >  a{margin-top:50px;display: inline-block;  font-size: 18px;font-weight: 600;color: #202020;}
main .section01 .box >  a:after{content: "→";display: inline-block;margin-left: 10px;}
main .section01 .img{position: relative;}
main .section01 .img:before{content: "";position:absolute;top:-42px;right:-60px;display: inline-block;width:120px;height:151px;background: url(/_public/images2/main/bg_icon.svg) no-repeat;background-size: cover;}
main .section01 .img img{display: block;width:100%;position: relative;}

main .section02{position:relative;padding:120px 0;background: url(/_public/images2/main/bg.png) top center no-repeat;background-size: cover;}
main .section02 .layout{max-width:1260px;}
main .section02 .hgroup{text-align: center;}
main .section02 .hgroup p{ font-size: 20px;font-weight: normal;color: #ccc;}
main .section02 .hgroup p br{display: none;}
main .section02 .hgroup h2{margin-top:10px;font-size: 40px;font-weight: bold;color: #fff;}
main .section02 ul{margin-top:70px;display: flex;gap:30px;}
main .section02 ul li{position: relative;top:0;flex:1;transition: all 0.3s;}
main .section02 ul li a{position: relative;display: block;height:100%;}
main .section02 ul li a img{display: block;width:100%;}
main .section02 ul li h3{position: absolute;top:50%;transform: translateY(-50%);left:0;width:100%;text-align: center;  font-size: 24px;font-weight: bold;letter-spacing: -0.48px;color: #fff;transition: all 0.3s;}
main .section02 ul li .mask{position: absolute;top:0;left:0;width:100%;height:100%;background: rgba(255,255,255,0.8);text-align: center;padding-top:90px;transition: all 0.3s;opacity: 0;}
main .section02 ul li .mask:after{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:-19px;display:block;background: url(/_public/images2/icon/more_ico.svg) no-repeat;background-size: cover;width:38px;height:38px;}
main .section02 ul li .mask h4{font-size: 24px;font-weight: bold;letter-spacing: -0.48px;text-align: center;color: #202020;}
main .section02 ul li .mask p{margin-top:30px;font-size: 18px;font-weight: 500;line-height: 1.67;letter-spacing: -0.36px;color: #202020; text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 4;}
main .section02 ul li:hover{top:-20px;}
main .section02 ul li:hover h3{opacity: 0;}
main .section02 ul li:hover .mask{opacity: 1;}

main .section03{padding:120px 0 110px;}
main .section03 .title-group{display: flex;gap:20px;align-items: center;}
main .section03 .title-group h2{font-size: 32px;font-weight: bold;color: #202020;}
main .section03 .title-group a{display: inline-block;}
main .section03 .title-group a img{display:block;}
main .section03 .main-info{display: flex;justify-content: space-between;}
main .section03 .main-info .left{width:100%;max-width:686px;}
main .section03 .main-info .left p{margin-top:20px;font-size: 20px;font-weight: 600;color: #787878;}
main .section03 .main-info .left ul{display: flex;margin-top:50px;gap:80px;}
main .section03 .main-info .left ul li{position:relative;display: flex;flex-direction: column;align-items: center;justify-content: center;gap:20px;}
main .section03 .main-info .left ul li:before{content: "";position:absolute;left:-40px;display: block;width:1px;height:55px;background: #ddd;}
main .section03 .main-info .left ul li:first-child:before{display: none;}
main .section03 .main-info .left ul li i{display: inline-block;}
main .section03 .main-info .left ul li i img{display:block;}
main .section03 .main-info .left ul li span{display: inline-block;font-size: 16px;font-weight: 500;color: #202020;}
main .section03 .main-info .left .button-box{display: flex;margin-top:50px;gap:15px;}
main .section03 .main-info .left .button-box a{display: flex;width:220px;height:50px;justify-content: center;align-items: center;gap:30px;border-radius: 5px;border: solid 1px #787878;background-color: #fff;font-size: 16px;font-weight: 500;color: #202020;line-height: 48px;}
main .section03 .main-info .left .button-box a:after{content: "→";display: inline-block;}
main .section03 .main-info .left .button-box a:hover{border-color: #f06650;background: #f06650;color:#fff;}
main .section03 .main-info .left .button-box a:hover:after{color:#fff;}
main .section03 .main-info .right{position:relative;width:100%;max-width: 620px;}
main .section03 .main-info .right .video-wrap{position: relative;width: 100%;max-width: 560px;padding-top:326px;}
main .section03 .main-info .right .video-wrap iframe{position:absolute;top:0;left:0;width: 100%;height:100%;}
main .section03 .main-info .right span{position:absolute;top: 62px;right: -70px;display: inline-block;font-size: 32px;font-weight: bold;color: #ccc;transform: rotate(90deg);}
main .section03 .main-bbs{margin-top:120px;}
main .section03 .main-bbs ul{display: flex;gap:20px;margin-top:30px;}
main .section03 .main-bbs ul li{position:relative;top:0;border-radius: 5px;background: #f5f5f5;transition: all 0.3s;padding:30px; width: 25%;border: solid 1px #f5f5f5;}
main .section03 .main-bbs ul li a{display: block;}
main .section03 .main-bbs ul li h3{ text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;font-size: 19px;font-weight: normal;line-height: 1.42;letter-spacing: -0.38px;color:#202020;height:54px;}
main .section03 .main-bbs ul li .bottom{margin-top:40px;display: flex;align-items: center;justify-content: space-between;}
main .section03 .main-bbs ul li .bottom span{display: inline-block;font-size: 15px;font-weight: normal;color: #787878;}
main .section03 .main-bbs ul li .bottom i{display:inline-block;}
main .section03 .main-bbs ul li .bottom i img{display:block;}
main .section03 .main-bbs ul li:hover{top:-10px;box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);border: solid 1px #ddd;background-color: #fff;}
main .section03 .main-bbs ul li.nodata{width:100%;background: none;text-align: center;font-size: 19px;font-weight: normal;letter-spacing: -0.38px;color: #202020;border:0;padding:50px 0;}
main .section03 .main-bbs ul li.nodata:hover{box-shadow: none;top:0;border:0;}

main .section04{background: #191919;padding:120px 0 90px;}
main .section04 .title-group{position:relative;display: flex;gap:20px;align-items: center;ju}
main .section04 .title-group h2{font-size: 32px;font-weight: bold;color: #fff;}
main .section04 .title-group a{display: inline-block;}
main .section04 .title-group a img{display:block;}
main .section04 .title-group .target-control{position:absolute;right:0;display: flex;align-items: center;gap:35px;}
main .section04 .title-group .target-control button{display: inline-block;width:30px;height:30px;font-size:0;}
main .section04 .title-group .target-control #target_prev2{background: url(/_public/images2/main/main_prev.svg) no-repeat;background-size: cover;}
main .section04 .title-group .target-control #target_prev2.slick-disabled{background: url(/_public/images2/main/main_prev_last.svg) no-repeat;background-size: cover;}
main .section04 .title-group .target-control #target_next2{background: url(/_public/images2/main/main_next.svg) no-repeat;background-size: cover;}
main .section04 .title-group .target-control #target_next2.slick-disabled{background: url(/_public/images2/main/main_next_last.svg) no-repeat;background-size: cover;}
main .section04 .slide-box{margin-top:45px;display:block;padding-left: calc(50% - 700px);}
main .section04 .slide-box .multiple-slide{}
main .section04 .slide-box .multiple-slide .slick-list{padding-bottom: 20px;}
main .section04 .slide-box .multiple-slide .slick-slide{margin:0 10px;position: relative;width:100%;max-width: 335px;}
main .section04 .slide-box .multiple-slide .slick-slide a{display: block;}
main .section04 .slide-box .multiple-slide .slick-slide img{display: block;width:100%;}
main .section04 .slide-box .multiple-slide .slick-slide .mask{position: absolute;top:0;left:0;width:100%;height:100%;background: rgba(255,255,255,0.8);display: flex;align-items: center;justify-content: center;transition: all 0.3s;opacity: 0;}
main .section04 .slide-box .multiple-slide .slick-slide .mask h3{ font-size: 20px;font-weight: 600;text-align: center;color: #202020;}
main .section04 .slide-box .multiple-slide .slick-slide .mask:after{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:-19px;display:block;background: url(/_public/images2/icon/more_ico.svg) no-repeat;background-size: cover;width:38px;height:38px;}
main .section04 .slide-box .nodata{padding:100px 0;text-align: center; font-size: 20px;font-weight: 600;color:#fff;}
main .section04 .slide-box .multiple-slide .slick-slide:hover .mask{opacity: 1;}

@media all and (max-width:1650px) {
    main{padding-top:90px;}
    main .slide-section .control-box{left:59%;}
}

@media all and (max-width:1440px) {
    main .slide-section .control-box{left:66%;}

    main .section01{padding:140px 20px 150px;}
    main .section04{padding:120px 0 90px 20px;}
}

@media all and (max-width:1280px) {
    main{padding-top:60px;}

    main .slide-section{padding-left:0;}
    main .slide-section .control-box{padding:0 30px;left:50%;bottom:30px;}
    main .slide-section .control-box .timeline{width:100px;}

    main .section01{padding:80px 20px;}
    main .section01 .img:before{width:40px;height:51px;top: -13px;right: -20px;}

    main .section02{padding:60px 20px 80px;}

    main .section03{padding:80px 20px;}
    main .section03 .main-info{flex-direction: column;gap:28px;}
    main .section03 .main-info .left{max-width:100%;}
    main .section03 .main-info .left ul{}
    main .section03 .main-info .left ul li{flex:1;}
    main .section03 .main-info .right{max-width:100%;}
    main .section03 .main-info .right .video-wrap{max-width:calc(100% - 60px);padding-top:52%;}
    main .section03 .main-bbs{margin-top:80px;}
    main .section03 .main-bbs ul{flex-wrap: wrap;}
    main .section03 .main-bbs ul li{width:calc(50% - 10px);flex: initial;}
}


@media all and (max-width:1024px) {
    main .section01 .layout{flex-direction: column;gap:30px;}
    main .section01 .layout > div{max-width:100%;}
    main .section01 .box .link-tab{gap:20px;}
    main .section01 .box .link-tab a{font-size:15px;}
    main .section01 .box .link-tab h2{font-size: 15px;}
    main .section01 .box h3{margin-top:30px;font-size: 32px;font-weight: bold;line-height: 1.38; max-width: 100%}
    main .section01 .box dl dt{font-size: 16px;width:71px;}
    main .section01 .box dl dd{font-size: 16px;padding-left:71px;}
    main .section01 .box > a{margin-top:20px;width:100%;display: flex;align-items: center;justify-content: center;height:40px;border-radius: 20px;font-size:15px;border: solid 1px #ccc;}


    main .section02 .hgroup p{word-break:keep-all;font-size: 16px;font-weight: normal;line-height: 1.63;}
    main .section02 .hgroup p br{display: inline;}
    main .section02 .hgroup h2{word-break:keep-all;font-size: 32px;font-weight: bold;line-height: 1.38;}

    main .section02 ul li .mask{display: none;}
    main .section02 ul li h3{font-size:20px;}

    main .section03 .title-group{gap:10px;}
    main .section03 .title-group h2{font-size:26px;}
    main .section03 .title-group a img{width:30px;}
    main .section03 .main-info .left p{font-size: 16px;font-weight: 600;line-height: 1.5;}
    main .section03 .main-info .left ul{margin-top:40px;flex-wrap: wrap;gap:40px 0;}
    main .section03 .main-info .left ul li{flex: initial;width:33.3333%;}
    main .section03 .main-info .left ul li span{font-size:14px;}
    main .section03 .main-info .left .button-box{margin-top:40px;flex-direction: column;gap:10px;}
    main .section03 .main-info .left .button-box a{width:100%;height:44px;padding:0 15px;justify-content: space-between;font-size: 14px;}
    main .section03 .main-info .right{display: flex;flex-direction: column-reverse;gap:10px;align-items: flex-end;}
    main .section03 .main-info .right span{position: relative;top:0;right:0;transform: none; font-size: 20px;}
    main .section03 .main-info .right .video-wrap{max-width:100%;padding-top:57%;}
    main .section03 .main-bbs ul{margin-top:20px;gap:15px;}
    main .section03 .main-bbs ul li{padding:24px;}
    main .section03 .main-bbs ul li a h3{font-size: 16px;font-weight: 500;line-height: 1.5;letter-spacing: -0.32px;height:50px;}
    main .section03 .main-bbs ul li .bottom{margin-top:20px;}
    main .section03 .main-bbs ul li .bottom span{font-size:13px;}

    main .section04{padding:80px 0 80px 20px;}
    main .section04 .title-group{padding-bottom: 70px;}
    main .section04 .title-group h2{font-size:26px;}
    main .section04 .title-group a img{width:30px;}
    main .section04 .title-group .target-control{bottom:0;right:20px;gap:20px;}
    main .section04 .title-group .target-control button{width:24px;height:24px;}
    main .section04 .slide-box .multiple-slide .slick-slide{max-width:250px;}
    main .section04 .slide-box{margin-top:20px;}
    main .section04 .slide-box .nodata{padding:50px 0;font-size: 16px;}
}


@media all and (max-width:768px) {
    main .section02{background: url(/_public/images2/main/m_bg.png) top left no-repeat;background-size: cover;}
    main .section02 ul{margin-top:60px;flex-direction: column;gap:20px;}
    main .section03 .main-bbs ul li{width:100%;}
    main .section04 .slide-box .multiple-slide .slick-slide{max-width:200px;}
}