@charset "UTF-8";

/* main common */
.inner{max-width:1548px}
.section{overflow:hidden;padding:120px 0}
.main-tit{display:block;margin-bottom:12px;font-weight:700;font-size:5rem;color:#1D1D1D;line-height:130%}
.main-tit span{color:#006FDB;line-height:130%}
.main-tit .main-small-tit{font-size:3.2rem;color:#1D1D1D}
.main-desc{margin-bottom:52px;font-size:2.1rem;color:#2d2d2d;line-height:140%}
.main-btn:before{content:"";display:block;position:absolute;top:0;left:0;z-index:-1;background:linear-gradient(92.39deg, #074799 0%, #009990 75.71%), #E9E9E9;inset:0 0 0 0;transition:transform .5s ease;transform:scaleX(0);transform-origin:bottom right}
.main-btn{display:inline-flex;align-items:center;gap:12px;overflow:hidden;position:relative;z-index:10;padding:16px 24px;border:1px solid #ddd;border-radius:32px;background:#fff;font-size:1.9rem;color:#555;box-sizing:border-box}
.main-btn:after{content:'';display:block;width:24px;height:24px;background:url('/img/icon/arrow_right.svg')no-repeat center;transition:all .6s}
.main-btn-small{display:block;position:absolute;top:32px;right:32px;width:40px;height:40px;border:1px solid #d8d8d8;border-radius:50%;background:#fff url('/img/icon/ico_plus.svg')no-repeat center}
.main-btn:hover:before{transform:scaleX(1);transform-origin:bottom left}
.main-btn:hover{color:#fff;background:none}
.main-btn:hover:after{filter:invert(100%)brightness(100%);scale:1.2}

@media (max-width:1280px){
  .section{padding:100px 0}
  .main-tit{font-size:4.4rem}
}
@media (max-width:1023px){
  .section{padding:80px 0}
  .main-tit{font-size:3.8rem}
  .main-desc{margin-bottom:40px}
  .main-btn{font-size:1.7rem}
  .main-btn-small{top:24px;right:24px}
}
@media (max-width:767px){
  .section{padding:60px 0}
  .main-tit{font-size:3.2rem}
  .main-tit br{display:none}
  /* .main-desc{font-size:1.9rem} */
  .main-btn{padding:12px 20px;font-size:1.5rem}
}
@media (max-width:480px){
  .main-desc{font-size:1.9rem}
}

@keyframes Bg {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(60px);
  }
}

@keyframes icon {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-4px);
  }
}

@keyframes iconRever {
  0%, 100% {
    transform: rotate(180deg) translateY(0px);
  }
  50% {
    transform: rotate(180deg) translateY(-4px);
  }
}

/* visual */
.visual{overflow:hidden;position:relative;z-index:0;padding:120px 0 190px;border-radius:0 0 0 120px;background:url('/img/main/bg-visual-1.svg')no-repeat bottom / 100%, linear-gradient(180deg, #F2FBFF 37.02%, #FFFFFF 100%)}
.visual:after{content:'';position:absolute;left:-68px;z-index:-1;bottom:52px;width:238px;height:361px;background:url('/img/main/bg-visual-2.svg')no-repeat}
.visual .main-tit{margin-bottom:32px;color:#303D1E}
.visual .main-tit span{color:#2DA00D}

@media (max-width:767px){
  .visual{margin:20px;padding:80px 0 190px;border-radius:20px;background-position:right bottom;background-size:120%}
  .visual:after{display:none}
}
@media (max-width:480px){
  .visual{background-position:calc(100% + 80px) bottom;background-size:200%}
  .visual .main-tit{font-size:2.8rem}
}

/* total */
.total{position:relative;z-index:0}
.total:before{content:'';position:absolute;top:50px;left:84px;z-index:-1;width:308px;height:308px;border-radius:50%;background:linear-gradient(355.12deg, rgba(255, 255, 255, 0) 3.93%, #F9FDFF 50.89%, #EDF7FF 96.07%);animation: Bg 6s ease-in-out infinite}
.total:after{content:'';position:absolute;top:102px;right:-228px;z-index:-1;width:782px;height:782px;border-radius:50%;background:linear-gradient(355.12deg, rgba(255, 255, 255, 0) 3.93%, #F5FBFF 50.89%, #F3F8FF 96.07%);transform:rotate(33.87deg);animation: Bg 6s ease-in-out infinite}
.total .main-tit{text-align:center}
.total .main-desc{text-align:center}
.total-box{display:flex;gap:32px}
.total-box > div{flex:1;position:relative;z-index:0;padding:44px 60px 32px;border:1px solid #d8d8d8;border-radius:32px;background:#F8F8F8}
.total-box > div:after{content:'';position:absolute;right:0;bottom:0;z-index:-1;background:url('/img/main/img-total01.svg')no-repeat right bottom / 100%}
.total-box > div:first-child:after{width:272px;height:223px;background-image:url('/img/main/img-total01.svg')}
.total-box > div:last-child:after{width:297px;height:199px;background-image:url('/img/main/img-total02.svg')}
.total-box > div strong{display:block;font-weight:700;font-size:2.5rem;color:#2d2d2d;line-height:150%}
.total-box > div span{font-weight:700;font-size:7rem;color:#175189}
@media (min-width:767px) and (max-width:1480px){
  .total-box > div:after{display:none}
}
@media (max-width:1023px){
  .total-box{gap:16px}
  .total-box > div{padding:32px 40px 32px;text-align:left}
  .total-box > div strong{font-size:2.2rem}
  .total-box > div span{font-size:6rem}
  .total-box > div:first-child:after{width:240px}
  .total-box > div:last-child:after{width:256px}
}
@media (max-width:767px){
  .total-box{flex-direction:column}
  .total-box > div strong{font-size:1.9rem}
  .total-box > div span{font-size:5rem}
  .total-box > div:first-child:after{width:160px}
  .total-box > div:last-child:after{width:174px}
}
@media (max-width:480px){
  .total-box > div{padding:32px 24px 120px}
  .total-box > div span{font-size:4rem}
}

/* fame */
.fame{position:relative;z-index:0;width:100%;margin:0 auto}
.fame-wrap{display:flex;gap:200px;padding-left:calc((100% - 1500px) / 2)}
.fame-left{flex-shrink:0;padding-top:32px}
.fame-slide{overflow:hidden;height:499px;position:relative}
.carousel-track{display:flex;align-items:flex-end;transition:transform 0.5s ease}
.carousel-cell{flex-shrink:0;overflow:hidden;position:relative;width:300px;margin:0 32px 16px 0;border:4px solid #fff;border-radius:20px 0 20px 0;background:#fff;box-shadow:4px 4px 10px rgba(0, 0, 0, 0.1);transition:all .4s}
.carousel-cell > a{display:block;width:100%;height:100%;padding:20px;}
.carousel-cell::after{content:'';position:absolute;top:0;left:0;z-index:1;width:100%;height:100%;background:rgba(255,255,255,0.7)/* ;pointer-events:none */}
.carousel-cell figure{overflow:hidden;width:100%;height:190px;margin-bottom:20px;border-radius:20px}
.carousel-cell figure img{width:100%;height:100%;object-fit:cover;transition:all 0.4s}
.carousel-cell.is-selected{width:400px}
.carousel-cell.is-selected figure{height:264px}
.carousel-cell.is-selected::after{display:none}
.fame-slide .fame-txt-box{padding:0 12px}
.fame-slide .fame-txt-box strong{display:block;margin-bottom:24px;font-weight:700;font-size:1.9rem;color:#2d2d2d;text-align:center}
.fame-slide .fame-txt-box dl div{display:flex;gap:20px}
.fame-slide .fame-txt-box dl div:not(:last-child){margin-bottom:8px}
.fame-slide .fame-txt-box dl dt{min-width:70px}
.fame-slide .fame-txt-box dl dd{color:#555}
.fame-slide .fame-txt-box dl div:last-child dd{font-weight:700;font-size:2.1rem;color:#1d1d1d}
.fame-bg:before{content:'';position:absolute;top:-104px;left:10px;z-index:-1;width:600px;height:600px;border-radius:50%;background:linear-gradient(355.12deg, rgba(255, 255, 255, 0) 3.93%, #E1F3FA 50.89%, #CDE1FF 96.07%);animation: Bg 6s ease-in-out infinite}
.fame-bg{overflow:hidden;position:absolute;top:0;left:50%;z-index:-1;width:calc(100% - 120px);max-width:1800px;height:100%;margin:0 auto;border-radius:354px;background:#EDF6FF;transform:translateX(-50%)}
.fame:after{content:'';position:absolute;bottom:-48px;left:calc((100% - 1500px) / 2 - 22px);z-index:-1;width:552px;height:394px;background:url('/img/main/img-fame.svg')no-repeat right bottom / 100%}
.carousel-cell.is-selected:hover figure img{scale:1.1}
.carousel-cell.is-selected:hover{border:4px solid #006FDB}

.control-box{display:flex;align-items:center;gap:12px;position:absolute;top:20px;left:432px}
.progress-bar{overflow:hidden;position:relative;width:260px;height:6px;border-radius:3px;background:#cfcfcf;cursor:pointer}
.progress-thumb{position:absolute;top:0;left:0;width:0;height:100%;border-radius:3px;background:#006FDB}
.slide-controls{display:flex;gap:7px;position:relative}
.slide-controls button{width:24px;height:24px}
.slide-controls #playBtn{display:none}

@media (max-width:1548px){
  .fame-wrap{gap:160px;padding-left:48px}
  .fame-slide{height:481px}
  .carousel-cell{margin:0 24px 60px 0}
  .carousel-cell > a{padding:16px 16px 20px}
  .carousel-cell figure{height:154px;border-radius:16px}
  .carousel-cell.is-selected{width:320px}
  .carousel-cell.is-selected figure{height:206px}
  .fame-bg{width:calc(100% - 48px);border-radius:32px}
  .fame:after{left:48px;bottom:-32px;width:508px}
  .fame-bg:before{left:-10%}

  .control-box{top:unset;left:0;bottom:4px}
}
@media (max-width:1280px){
  .fame-wrap{gap:60px}
  .fame:after{left:0;bottom:-12px;width:412px}
  .fame-bg:before{left:-20%}
}
@media (max-width:1023px){
  .fame-wrap{flex-direction:column;gap:40px;padding-left:32px}
  .fame-wrap .main-desc{margin-bottom:16px}
  .fame-left{width:auto;padding-top:0}
  .fame-left .main-tit > br{display:none}
  .fame-slide{height:422px}
  .carousel-cell{width:260px;margin:0 24px 16px 0}
  .carousel-cell figure{margin-bottom:12px}
  .fame-slide .fame-txt-box strong{margin-bottom:20px;font-size:1.7rem}
  .fame-bg{width:calc(100% - 23px)}
  .fame:after{top:-124px;right:16px;left:unset;bottom:unset;width:374px}

  .control-box{top:10px;left:342px;bottom:unset}
  .progress-bar{width:150px}
}
@media (max-width:767px){
  .fame-slide{height:462px}
  .fame-slide .fame-txt-box dl div:not(:last-child){margin-bottom:4px}
  .carousel-cell{margin:40px 24px 16px 0}
  .fame-bg{border-radius:20px}
  .fame:after{display:none}
  .control-box{top:4px;left:0}
}
@media (max-width:480px){
  .fame-wrap{padding:0 16px}
  .fame-slide{height:413px}
  .carousel-cell{width:283px;margin:40px 16px 0 0}
  .carousel-cell.is-selected{width:100%;box-shadow:none}
  .carousel-cell.is-selected figure{height:188px;margin-bottom:8px}
  .fame-slide .fame-txt-box strong{margin-bottom:16px}
  .fame-slide .fame-txt-box dl div{gap:8px}
  .fame-slide .fame-txt-box dl div:last-child dd{font-size:1.5rem}
  .fame-bg{width:100%;border-radius:0}
  .fame-bg:before{display:none}

  .fame-slide .pagination{display:none}
}

/* notice */
.notice-wrap{display:flex;gap:32px;margin-bottom:40px}
.notice-wrap > div{padding:32px 32px 0;border:1px solid #ddd;border-radius:20px;background:#fff}

.news{width:calc(100% - 562px)}
.news .krds-tab-area{gap:24px}
.news-list li:not(:last-child){margin-bottom:11px}
.news-list li a{display:flex;align-items:center;justify-content:space-between;gap:16px}
.news-list li a span:first-child{min-width:98px;padding:8px 12px;border-radius:4px;border:1px solid #E2EEFF;background:#E2EEFF;font-weight:700;font-size:1.5rem;color:#2d2d2d;text-align:center;transition:all .4s}
.news-list li a p:before{content:'';position:absolute;bottom:0;left:0;width:0;height:1px;background:#006FDB;transition:all .4s}
.news-list li a p{overflow:hidden;position:relative;margin-right:auto;padding-right:20px;font-size:1.9rem;color:#1d1d1d;white-space:nowrap;text-overflow:ellipsis;transition:all .4s}
.news-list li a span:last-child{flex-shrink:0;font-size:1.9rem;color:#717171;transition:all .4s}
.news .tab.full > ul{flex-wrap:nowrap}
.news .tab.full > ul > li{min-width:auto}
.news .tab.line.full .btn-tab{padding:0 12px}

.news-list li:hover p:before{width:100%}
.news-list li:hover p{color:#006FDB}
.news-list li:hover a span:first-child{border:1px solid #006FDB;background:#fff;color:#006FDB}
.news-list li:hover a span:last-child{color:#006FDB}

.main-gallery{flex-shrink:0;position:relative;width:530px}
.gallery-slide{width:100%}
.gallery-slide .swiper{padding-bottom:32px}
.main-gallery figure{overflow:hidden;width:100%;height:304px;border-radius:16px}
.main-gallery figure img{width:100%;height:100%;object-fit:cover}
.main-gallery .swiper-horizontal>.swiper-pagination-bullets, .main-gallery .swiper-pagination-bullets.swiper-pagination-horizontal{bottom:-4px}
.main-gallery .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .main-gallery .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{width:10px;height:10px;background:#d9d9d9}
.main-gallery .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{width:10px;background:#009990}
@media (max-width:1280px){
  .notice-wrap{flex-direction:column}
  .notice-wrap .news{width:100%;padding:18px 32px 32px}
  .main-gallery{width:100%}
  .main-gallery figure{height:256px}
}
@media (max-width:1023px){
  .notice-wrap{gap:24px}
  .notice-wrap > div{padding:20px 24px 0}
  .notice-wrap > div .main-tit{width:calc(100% - 48px)}
  .notice-wrap .news{padding:20px 24px 24px}
}
@media (max-width:767px){
  .news .krds-tab-area .tab-conts-wrap:first-child{display:none}
  .news-list li a span:first-child{display:none}
}
@media (max-width:480px){
  .news-list li a p{font-size:1.7rem}
  .news-list li a span:last-child{font-size:1.7rem}
}

/* banner */
.banner{display:flex;justify-content:space-between;align-items:center;position:relative;padding-left:24%;border-radius:20px;background:linear-gradient(92.39deg, #074799 0%, #009990 75.71%), #E9E9E9;color:#fff}
.banner-contact:after{content:'';position:absolute;bottom:0;left:0;width:21%;height:186px;background:url('/img/main/img-banner.svg')no-repeat left bottom / 100%}
.banner-contact strong{display:block;margin-bottom:8px;font-weight:700;font-size:1.9rem}
.banner-contact span{font-weight:700;font-size:3.2rem}
.banner-contact p{font-weight:400}

.banner-menu{display:flex;justify-content:center;gap:40px;width:59%;padding:48px 80px;border-radius:80px 20px 20px 80px;background:#074799}
.banner-menu li a:before{content:'';display:block;width:60px;height:60px;border-radius:50%;background:#fff no-repeat center;transition:.4s}
.banner-menu li:nth-child(1) a:before{background-image:url('/img/main/ico-banner01.png')}
.banner-menu li:nth-child(2) a:before{background-image:url('/img/main/ico-banner02.png')}
.banner-menu li:nth-child(3) a:before{background-image:url('/img/main/ico-banner03.png')}
.banner-menu li a{display:flex;align-items:center;gap:12px;position:relative;transition:all .4s}
.banner-menu li a:after{content:'';position:absolute;width:60px;height:60px;border:2px solid#fff;border-radius:50%;top:0;left:0;transition:.4s}
.banner-menu li a span{position:relative}
.banner-menu li a span:before{content:'';position:absolute;bottom:-4px;left:0;width:0;height:1px;background:#fff;transition:all .4s}

.banner-menu li a:hover:before{background-color:rgba(255, 255, 255, .5)}
.banner-menu li a:hover:after{top:-6px;left:-6px;width:72px;height:72px}
.banner-menu li a:hover span:before{width:100%}
@media (max-width:1440px){
  .banner-menu{gap:60px;width:53%;padding:30px 0}
  .banner-menu li a{flex-direction:column}
  .banner-menu li a:after{left:50%;transform:translate(-50%,0)}
  .banner-menu li a:hover:after{left:50%}
}
@media (max-width:1280px){
  .banner-menu{gap:28px}
}
@media (max-width:1023px){
  .banner{overflow:hidden;gap:20px;padding-left:40px}
  .banner-contact span{font-size:2.8rem}
  .banner-contact:after{display:none}
  .banner-menu{gap:40px;width:auto;padding:48px 40px;border-radius:0}
}
@media (max-width:767px){
  .banner{flex-direction:column;align-items:flex-start;padding-top:20px;padding-left:0}
  .banner-contact{padding:0 32px}
  .banner-contact span{font-size:2.5rem}
  .banner-menu{gap:18px;width:100%;padding:16px 24px}
  .banner-menu li a{flex-direction:row;gap:8px}
  .banner-menu li a:before{width:40px;height:40px;background:#fff no-repeat center / 52%}
  .banner-menu li:nth-child(1) a:before{background-size:70%}
  .banner-menu li a:after{top:0;left:0;width:40px;height:40px;transform:none}
  .banner-menu li a:hover:after{left:-6px;width:52px;height:52px}
}
@media (max-width:480px){
  .banner-contact{padding:0 20px}
  .banner-contact p{letter-spacing:-0.9px}
  .banner-menu{flex-direction:column}
  .banner-menu li a{font-size:1.5rem}
}