@charset "utf-8";
#fp-nav{display:flex;flex-direction:column;align-items:center}
#fp-nav ul li a span,
.fp-slidesNav ul li a span{width:6px;height:6px;background:transparent;border:1px solid #dadada}
#fp-nav ul li a.active span,
.fp-slidesNav ul li a.active span,
#fp-nav ul li:hover a.active span,
.fp-slidesNav ul li:hover a.active span{width:6px;height:6px;background:var(--color-secondary);margin:-2px 0 0 -2px;border:none}
#fp-nav .fp-nav-label{text-align:center;font-size:1.4rem;color:#d3d3d3;margin-bottom:16px;writing-mode:vertical-lr;letter-spacing:1px}
.sec_tit > span{display:block;margin-bottom:20px;font-family:"Play-bold";font-size:2.2rem;color:var(--color-primary)}
.sec_tit h2{line-height:1.2}
.sec_tit h2 span{font-weight:600}

@media (max-width:1280px){
    .sec_tit{text-align:center}
    .sec_tit > span{font-size:2rem}
}
@media (max-width:1024px){
    .sec02, .sec03, .sec04{padding:80px 0}
}
@media (max-width:768px){
    .sec02, .sec03, .sec04{padding:60px 0}
    .sec_tit > span{font-size:1.8rem}
}

/* sec01 */
.sec01{position:relative}
.sec01 .visual_area{width:100%;height:100vh}
.sec01 .visual_area .visual01{background:url("../image/main/main_visual01.jpg")no-repeat center / cover}
.sec01 .visual_area .visual02{background:url("../image/main/main_visual02.jpg")no-repeat center / cover}
.sec01 .visual_txt{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);z-index:1}
.sec01 .visual_txt strong{font-size:7rem;font-family:"Play-bold";line-height:1.2;color:#fff}
.sec01 .visual_txt p{margin-top:40px;font-size:2.4rem;color:#fff}
.sec01 .slide_control{display:flex;align-items:center;gap:10px;margin-top:60px}
.sec01 .slide_control .control_btn{position:relative;width:36px;height:36px;border-radius:50%;border:4px solid #fff}
.sec01 .slide_control .visual_slide_prev{background:url("../image/icon/arrow_w.png")no-repeat center}
.sec01 .slide_control .visual_slide_next{background:url("../image/icon/arrow_w.png")no-repeat center;transform:rotate(180deg)}
.sec01 .slide_control .autoplay_wrap{position:relative;width:36px;height:36px}
.sec01 .slide_control .autoplay_wrap .progress_ring{position:absolute;top:0;left:0;transform:rotate(-90deg)}
.sec01 .slide_control .autoplay_wrap .progress_ring .progress_ring_cir{stroke-dasharray:97.39;stroke-dashoffset:97.39;transition: stroke-dashoffset 5000ms linear}
.sec01 .slide_control .autoplay_btn{position:absolute;top:0;left:0;width:36px;height:36px;border-radius:50%;border-color:rgba(255,255,255,0.3)}
.sec01 .slide_control .autoplay_btn.playing{background:url("../image/icon/pause.png")no-repeat center}
.sec01 .slide_control .autoplay_btn.paused{background:url("../image/icon/play.png")no-repeat center}

@media (max-width:1500px){
    .sec01 .visual_txt strong{font-size:6rem}
    .sec01 .visual_txt p{font-size:2rem}
}
@media (max-width:1280px){
    .sec01 .visual_txt strong{font-size:5rem;text-align:center}
    .sec01 .visual_txt p{margin-top:30px;text-align:center}
    .sec01 .slide_control{justify-content:center}
}
@media (max-width:768px){
    .sec01 .visual_txt strong{font-size:4rem}
    .sec01 .visual_txt p{font-size:1.8rem}
}
@media (max-width:420px){
    .sec01 .visual_txt strong{font-size:3.4rem}
    .sec01 .visual_txt p{font-size:1.7rem}
}

/* sec02 */
.sec02::before{content:"";position:absolute;left:0;bottom:0;width:100%;height:46%;background:#f0f0f0}
.sec02 .inner{position:relative}
.sec02 .rotate_btn{position:absolute;top:0;right:0}
.sec02 .rotate_btn a{position:relative;display:block;width:130px;height:130px}
.sec02 .rotate_btn a svg{display:block;width:100%;height:100%;font-family:'Play_regular';animation:rotateCircle 7s linear infinite;transform-origin:50% 50%}
.sec02 .rotate_btn a .center_con{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;left:50%;top:50%;width:90px;height:90px;background:var(--color-secondary);border-radius:50%;color:#fff;transform: translate(-50%,-50%);}
.sec02 .rotate_btn a .center_con span{font-size:1.5rem;font-weight:500}
.sec02 .rotate_btn a .center_con i{width:28px;height:28px;background:url("../image/icon/sec2_arrow.png");animation: bounce .7s infinite ease-in-out alternate}

.sec02 .sec_tit{text-align:center}
.sec02 .business_wrap{margin-top:80px}
.sec02 .business_wrap .business_box{display:flex;gap:30px}
.sec02 .business_wrap .business_box li{flex:1;min-width:0}
.sec02 .business_wrap .business_box li a{position:relative;display:flex;align-items:flex-end;justify-content:center;height:350px;padding:40px 35px;border-radius:12px;color:#fff;overflow:hidden;box-shadow:0 0 12px rgba(0, 0, 0, 0.3);transition:all 0.2s}
.sec02 .business_wrap .business_box li a:hover{align-items:center;border-radius:130px}
.sec02 .business_wrap .business_box li a::before{content:"";position:absolute;left:0;bottom:0;width:100%;height:0;background:rgba(0, 153, 163, 0.85);z-index:0}
.sec02 .business_wrap .business_box li a:hover::before{height:100%}
.sec02 .business_wrap .business_box li:first-child a{background:url("../image/main/sec2_ba01.jpg")no-repeat center / cover}
.sec02 .business_wrap .business_box li:nth-child(2) a{background:url("../image/main/sec2_ba02.jpg")no-repeat center / cover}
.sec02 .business_wrap .business_box li:nth-child(3) a{background:url("../image/main/sec2_ba03.jpg")no-repeat center / cover}
.sec02 .business_wrap .business_box li:nth-child(4) a{background:url("../image/main/sec2_ba04.jpg")no-repeat center / cover}
.sec02 .business_wrap .business_box li:last-child a{background:url("../image/main/sec2_ba05.jpg")no-repeat center / cover}
.sec02 .business_wrap .business_box li a .txt_wrap{position:relative;text-align:center}
.sec02 .business_wrap .business_box li a .txt_wrap span{display:block;font-family:"Play-bold";font-size:1.8rem}
.sec02 .business_wrap .business_box li a .txt_wrap em{display:block;font-size:2.2rem;font-weight:600}
.sec02 .business_wrap .business_box li a .txt_wrap .hide{height:0;opacity:0;transform: translateY(20px);transition: all 0.2s}
.sec02 .business_wrap .business_box li a:hover .txt_wrap .hide{height:fit-content;margin-top:20px;opacity:1;transform: translateY(0)}
.sec02 .business_wrap .business_box li a .txt_wrap .hide::after{content:"";display:block;width:30px;height:30px;margin:60px auto 0;background:url("../image/icon/sec2_more_icon.png")}
.sec02 .business_wrap .business_box li a:hover .txt_wrap .hide::after{animation:rotate 0.5s}

@media (max-width:1500px){
    .sec02 .rotate_btn{right:20px}
    .sec02 .business_wrap .business_box li a{padding:30px 20px}
    .sec02 .business_wrap .business_box li a .txt_wrap em{font-size:1.8rem}
    .sec02 .business_wrap .business_box li a .txt_wrap .hide::after{margin-top:40px}
}
@media (max-width:1280px){
    .sec02 .business_wrap{overflow:hidden;margin-top:40px}
    .sec02 .business_wrap .business_box{gap:0}
    .sec02 .business_wrap .business_box li{flex:none}
    .sec02 .business_wrap .business_box li a{height:280px;padding:40px;box-shadow:none}
    .sec02 .business_wrap .business_box li a:hover{border-radius: 200px}
    .sec02 .business_wrap .business_box li a .txt_wrap em{font-size:2.2rem}
    .sec02 .business_wrap .business_box li a .txt_wrap .hide p br{display:none}
    .sec02 .business_pagination{text-align:center}
    .sec02 .business_pagination .swiper-pagination-bullet-active{background:var(--color-primary)}
}
@media (max-width:1024px){
    .sec02 .business_wrap .business_box li a{height:240px;padding:25px}
    .sec02 .rotate_btn{position:unset;margin-top:20px}
    .sec02 .rotate_btn a{margin: auto}
}
@media (max-width:640px){
    .sec02 .business_wrap .business_box li a:hover{border-radius:12px}
}

/* sec03 */
.sec03{background:url("../image/main/sec03_bg.jpg") no-repeat center / cover}
.sec03 .sec_tit{color:#fff}
.sec03 .more_btn{display:inline-block;padding:15px 30px;margin-top:60px;border-radius:30px;border:1px solid #fff;font-weight:500;transition:background .3s}
.sec03 .more_btn:hover{background:#fff;color:#111}
.sec03 .more_btn i{display:inline-block;width:24px;height:24px;background:url("../image/icon/more_icon.png");vertical-align:sub}
.sec03 .more_btn:hover i{animation:rotate 0.5s}
/* sec04 */
.sec04::before{content:"";position:absolute;right:0;bottom:0;width:1154px;height:296px;background:url("../image/main/sec04_item.png");z-index:-1}
.sec04 .bg_rects{position:absolute;top:6vh;left:10vw;z-index:-1}
@media (max-width: 1920px) {
    .sec04 .bg_rects{top:0;left:0}
}
.sec04 .bg_rects .rect_wrap{position:relative}
.sec04 .bg_rects .rect_wrap .rect{position:absolute;width:400px;height:400px;border-radius:80px;opacity:0.12;border:2px solid#0099A3}
.sec04 .bg_rects .rect_wrap .rect1{animation: spin1 22s linear infinite;}
.sec04 .bg_rects .rect_wrap .rect2{animation: spin2 33s linear infinite  reverse;border-color:#888}

.sec04 .con_wrap{display:flex;align-items:flex-end;justify-content:space-between}
.sec04 .con_wrap .tab_btn{display:flex;gap:10px}
.sec04 .con_wrap .tab_btn button{width:180px;padding:15px;background:#A8A8A8;border-radius:30px;color:#fff;text-align:center;font-weight:500}
.sec04 .con_wrap .tab_btn button.on{background:var(--color-primary)}
.sec04 .news_box{display:none;gap:30px;margin-top:80px}
.sec04 .news_box.active{display:flex}
.sec04 .news_wrap .news_box li{flex:1;min-width:0}
.sec04 .news_wrap .news_box li a{display:block;padding:45px 40px;background:#fff;border:1px solid #D7DADF;border-radius:12px;transition:all 0.3s}
.sec04 .news_wrap .news_box li a:hover{border-color:var(--color-primary);box-shadow:0 0 10px rgba(0, 153, 163, 0.9);}
.sec04 .news_wrap .news_box li a .news_tit{height:60px;line-height:1.4;margin-bottom:12px;font-size:2.2rem;font-weight:500;text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.sec04 .news_wrap .news_box li a:hover .news_tit{text-decoration:underline}
.sec04 .news_wrap .news_box li a .desc{height:75px;margin-bottom:30px;text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;color:#777}
.sec04 .news_wrap .news_box li a .date{font-family:'Play-regular';color:#9F9F9F}
.sec04 .news_wrap .news_box li a .date::before{content:"";display:inline-block;width:20px;height:20px;margin-right:5px;background:url("../image/icon/date_icon.png");vertical-align:sub}

@media (max-width:1500px){
    .sec04 .news_wrap .news_box li a{padding:30px}
    .sec04 .news_wrap .news_box li a .news_tit{font-size:2rem}
}
@media (max-width:1280px){
    .sec04::before{content:none}
    .sec04 .con_wrap{gap:30px;flex-direction:column;justify-content:center;align-items:center}
    .sec04 .bg_rects .rect_wrap .rect{width:300px;height:300px}
    .sec04 .news_box{margin-top:40px}
    .sec04 .news_wrap .news_box li:last-child{display:none}
}
@media (max-width:1024px){
    .sec04 .news_box{flex-direction:column;gap:20px}
    .sec04 .news_wrap .news_box li a{padding:25px}
    .sec04 .news_wrap .news_box li a .news_tit,
    .sec04 .news_wrap .news_box li a .desc{height:auto}
}
@media (max-width:768px){
    .sec04 .con_wrap .tab_btn button{width:125px;padding:12px}
}
@media (max-width:420px){
}