@charset "UTF-8";

/* ----- layer popup ----- */
.lay_pop_done {position:absolute;}
.lay_pop {z-index: 9999 !important;position: absolute; overflow: hidden;border: 2px solid #17181d;}
.lay_pop a {display: block;}
.lay_pop a .text {max-width: 500px;min-width: 200px;background: #fffffffc;width: 100%;}
.lay_pop a .text .cont {padding: 25px;}
.lay_pop a .text p {text-align: center;color: #000; }
.lay_pop a .text .title {padding: 15px 20px;border-bottom: 1px solid #f1f1f1;}
.lay_pop a .text .title span {font-size: 28px;font-weight: 600;margin: 0 auto;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap: break-word;line-height: 1.2; max-height: 92px; }
.lay_pop a .text .sub {font-size: 21px;margin-bottom: 25px;line-height: 1.1; /word-break: keep-all;}
.lay_pop a .text .go .btn {border: 1px solid #145ebf;padding: 10px 25px;font-size: 19px;line-height: 1;color: #145ebf;transition: 0.3s;border-radius: 500px;}
.lay_pop a:hover .text .go .btn {background: #145ebf; color: #fff; transition: 0.3s;}

.lay_pop img {width: 100%;display: block;height: 100%;}
.lay_pop .lay_pop_text{color:#fff;position: relative;font-weight:300;padding: 8px;background: #181717f2;}
.lay_pop .lay_pop_text .chk_layerpop {margin-left:8px;}
.lay_pop .lay_pop_btn{position: absolute; top: 4px; right: 5px; width: 30px; height: 30px; background: url(/sites/www/images/main/popup_close.png) no-repeat center; transition: .3s; text-indent: -99999px; overflow:hidden;}
.lay_pop .lay_pop_btn:hover {transform:rotate(180deg);}
.lay_pop .lay_pop_cnt {background:#fff;}

.lay_pop .lay_pop_tit1 {color: #fff;font-size: 17px;}

.lay_pop[style*="visibility: hidden"] .lay_pop_btn {
  display: none !important;
}

@media (max-width: 1200px) {
	.lay_pop {left: 0 !important; top: 0 !important; width: 50%;}
    .lay_pop a .text {max-width: 100%;}
}
@media (max-width: 768px) {
	.lay_pop {width: 80%;}
	.lay_pop .lay_pop_tit1 {font-size: 14px;}
    .lay_pop a .text .title span {font-size: 26px;}
    .lay_pop a .text .sub {margin-top: 10px;font-size: 21px;margin-bottom: 15px;}
    .lay_pop a .text .go .btn {padding: 8px 20px;font-size: 17px;}
}
@media (max-width: 550px) {
	.lay_pop {width: 100%;}
}

#header {
  /* background-color: rgba(0, 0, 0, 0.04);
  backdrop-filter: blur(5px); */
}
#header.main_pg_hd .head_nav h1 a,
#header.main_pg_hd .head_top .head_top_log > li > a,
#header.main_pg_hd .head_nav .head_addon .head_nav_pop,
#header.main_pg_hd .head_nav .head_addon .head_nav_log > li > a,
#header.main_pg_hd .head_nav .head_gnb > li > a {
  color: #fff;
}

#header.main_pg_hd .head_nav .head_addon .head_nav_bar i,
#header.main_pg_hd .head_top .head_top_log > li > a > i,
#header.main_pg_hd .head_nav .head_addon .head_nav_log > li > a > span > i,
#header.main_pg_hd .head_nav .head_addon .head_nav_log > li > a > i,
#header.main_pg_hd .head_top .head_top_sns > li > a > i {
  opacity: 1;
  filter: brightness(0) invert(1);
}

#header.main_pg_hd .head_nav .head_addon .head_nav_pop > i,
#header.main_pg_hd .head_top .head_top_log > li > a > span > i {
  /* background-position: bottom; */
  opacity: 1;
}

/* #header.main_pg_hd .head_nav .head_addon .head_nav_log > li > a > span,
#header.main_pg_hd .head_top .head_top_log > li > a > span {
  background-color: rgba(255, 255, 255, 0.25);
} */

#header.main_pg_hd.active .head_nav h1 a,
#header.main_pg_hd.active .head_top .head_top_log > li > a,
#header.main_pg_hd.active .head_nav .head_addon .head_nav_pop,
#header.main_pg_hd.active .head_nav .head_addon .head_nav_log > li > a,
#header.main_pg_hd.active .head_nav .head_gnb > li > a {
  color: #161616;
}

#header.main_pg_hd.active .head_nav .head_addon .head_nav_bar i,
#header.main_pg_hd.active .head_top .head_top_log > li > a > i,
#header.main_pg_hd.active .head_nav .head_addon .head_nav_log > li > a > span > i,
#header.main_pg_hd.active .head_nav .head_addon .head_nav_log > li > a > i,
#header.main_pg_hd.active .head_top .head_top_sns > li > a > i {
  /* opacity: 0.75; */
  filter: none;
}

#header.main_pg_hd.active .head_nav .head_addon .head_nav_pop > i,
#header.main_pg_hd.active .head_top .head_top_log > li > a > span > i {
  /* opacity: 0.75; */
}

/* #header.main_pg_hd.active .head_nav .head_addon .head_nav_log > li > a > span,
#header.main_pg_hd.active .head_top .head_top_log > li > a > span {
  background-color: #dedfe9;
}

#header.main_pg_hd.active .head_top .head_top_log > li > a > span {
  background-color: #dedfe9;
} */

#header .head_nav h1 a {
  /* background: url('../images/common/logo-w.svg') no-repeat center center; */
  /* background-size: 100%; */
  width: 265px;
  height: 55px;
  display: block;
  overflow: hidden;
  position: relative;
}
#header .head_nav h1 a img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  position: absolute;
  top: 0;
  transition: all 0.5s ease-in-out;
}
#header .head_nav h1 a .logo-c {
  top: 55px;
}
#header.scroll .head_nav h1 a img {
  top:-55px;
}
#header.scroll .head_nav h1 a .logo-c {
  top:0;
}
#header.active .head_nav h1 a img {
  top:-55px;
}
#header.active .head_nav h1 a .logo-c {
  top:0;
}

#header i.ci_user {
  width: 100%;
  height: 100%;
  background-image: url(../images/common/ico-mypage-w.svg);
  background-size: contain;
}

#header i.ci_user_setting {
  width: 100%;
  height: 100%;
  background-image: url(../images/common/ico-user-setting-w.svg);
  background-size: contain;
}
#header.active i.ci_user_setting {background-image: url(../images/common/ico-user-setting.svg);}

#header i.ci_setting {
  width: 100%;
  height: 100%;
  background-image: url(../images/common/ico-setting-w.svg);
  background-size: contain;
}
#header i.ci_login {
  width: 100%;
  height: 100%;
  background-image: url(../images/common/ico-login-w.svg);
  background-size: contain;
}
#header i.ci_logout {
  width: 100%;
  height: 100%;
  background-image: url(../images/common/ico-logout-w.svg);
  background-size: contain;
}
#header i.ci_world {
  width: 100%;
  height: 100%;
  background: url(../images/common/ico-lang.png) no-repeat center center/contain;
}
#header .head_addon i.ci_world {
  filter: brightness(1) !important;
}
#header i.ci_bell {
  width: 100%;
  height: 100%;
  background-image: url(../images/common/ico-bell-w.svg);
  background-size: contain;
}
#header i.ci_join {
  width: 100%;
  height: 100%;
  background-image: url(../images/common/ico-join-w.svg);
  background-size: contain;
}
#header.active i.ci_join {
    width: 100%;
  height: 100%;
  background-image: url(../images/common/ico-join.svg);
  background-size: contain;
}


/* ----- 메인 수정 ----- */
/* 공통 */
#main .main-section {padding: 100px 20px; max-width: 1740px; /*border-bottom: 1px solid #d5d7dd;*/ margin: 0 auto; position: relative;}
#main .main-section::before {content: ''; width: 200%; height: 1px; background-color: #d5d7dd; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}
#main .main-section .section-title-wrap {font-weight: 400; word-break: keep-all; line-height: 1.5; width: 300px; position: relative; display: flex; align-items: flex-start; justify-content: center; flex-direction: column;}
#main .main-section .section-title-wrap p {font-size: 20px; color: #555;}
#main .main-section .section-title {display: block; font-family: "STUNNING"; font-size: 35px; margin-bottom: 20px;}
#main .main-section .section-title.title-eng {color: var(--main-color); font-size: 24px;}

#main .cont-more {font-size: 19px; display: flex; align-items: center; justify-content: flex-start; margin-top: 20px;}
#main .cont-more i {margin-left: 15px; display: flex; align-items: center; justify-content: center; padding: 15px; border-radius: 50%; border: 1px solid #d5d7dd; font-size: 16px; color: #d5d7dd; transition: 0.3s ease-in-out;}
#main .cont-more:hover i {background-color: var(--main-color); border-color: var(--main-color); color: #fff;}

#main .cont-more-m {width: 70px; height: 70px; background-color: #f9f9f9; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #6b6b6e; display: none;}
#main .cont-more-m i {display: flex; align-items: center; justify-content: center; font-size: 40px; transition: 0.3s ease-in-out;}
#main .cont-more-m:hover i {transform: rotate(180deg);}

#section-data, .main-section { will-change: opacity, transform; }
.section, .main-section {opacity: 0; transform: translateY(50px); transition: opacity 0.6s ease, transform 0.6s ease;}
.section.show,
.main-section.show {opacity: 1;transform: translateY(0);}

#main .nav-pills {margin-top: 20px;}
#main .nav-pills .nav-link {text-align: left;}

#main .nav-link {padding: 10px 22px; font-size: 20px; font-weight: 600; color: #212529; border-left: 3px solid #f3f3f3; border-radius: 0 !important;}
#main .nav-link:hover {border-left: 3px solid #343434; color: #343434;}
#main .nav-pills .nav-link.active, #main .nav-pills .show>.nav-link {background-color: transparent; border-color: #343434; color: #343434;}

#main .nav-link.green:hover {border-left: 3px solid #03a2a8; color: #03a2a8;}
#main .nav-pills .nav-link.green.active, #main .nav-pills .show>.nav-link.green {background-color: transparent; border-color: #03a2a8; color: #03a2a8;}
#main .nav-link.navy:hover {border-left: 3px solid #045ed9; color: #045ed9;}
#main .nav-pills .nav-link.navy.active, #main .nav-pills .show>.nav-link.navy {background-color: transparent; border-color: #045ed9; color: #045ed9;}
#main .nav-link.orange:hover {border-left: 3px solid #ff8600; color: #ff8600;}
#main .nav-pills .nav-link.orange.active, #main .nav-pills .show>.nav-link.orange {background-color: transparent; border-color: #ff8600; color: #ff8600;}

@media(max-width: 1600px) {
  #main .cont-more {display: none !important;}
  #main .cont-more-m {display: flex; position: absolute; bottom: 100px; left: 50%; transform: translateX(-50%);}

  #main .nav-pills {flex-direction: row !important; gap: 10px;}
  #main .nav-link {background-color: #f9f9f9; border-radius: 100px !important; border: none;}
  #main .nav-link:hover {border: none !important; background-color: #212529 !important; color: #fff !important;}
  #main .nav-pills .nav-link.active, #main .nav-pills .show>.nav-link {background-color: #212529 !important; color: #fff !important;}

  #main .nav-link.green:hover {background-color: #03a2a8 !important; color: #fff !important; border: none;}
  #main .nav-pills .nav-link.green.active, #main .nav-pills .show>.nav-link.green {background-color: #03a2a8 !important; color: #fff !important; border: none;}
  #main .nav-link.navy:hover {background-color: #045ed9 !important; color: #fff !important; border: none;}
  #main .nav-pills .nav-link.navy.active, #main .nav-pills .show>.nav-link.navy {background-color: #045ed9 !important; color: #fff !important; border: none;}
  #main .nav-link.orange:hover {background-color: #ff8600 !important; color: #fff !important; border: none;}
  #main .nav-pills .nav-link.orange.active, #main .nav-pills .show>.nav-link.orange {background-color: #ff8600 !important; color: #fff !important; border: none;}

}
@media(max-width: 1440px) {
  #main .main-section {padding: 80px 20px}

  #main .cont-more-m {bottom: 80px;}
}
@media(max-width: 1024px) {
  #main .main-section .section-title.title-eng {font-size: 22px;}
  #main .main-section .section-title {font-size: 32px; margin-bottom: 15px;}
}
@media(max-width: 768px) {
  #main .main-section {padding: 60px 20px}

  #main .main-section .section-title.title-eng {font-size: 22px;}
  #main .main-section .section-title {font-size: 30px; margin-bottom: 15px;}

  #main .cont-more {font-size: 18px;}
  #main .cont-more i {padding: 12px; margin-left: 10px;}

  #main .nav-pills {gap: 7px 5px;}
  #main .nav-link {font-size: 18px; padding: 7px 18px;}

  #main .cont-more-m {bottom: 60px; width: 60px; height: 60px;}
  #main .cont-more-m i {font-size: 34px;}
}
@media(max-width: 480px) {
  #main .nav-link {font-size: 17px; padding: 5px 12px;}
  #main .nav-pills {gap: 7px 3px;}
}
@media(max-width: 450px) {
  #main .main-section .section-title.title-eng {font-size: 20px;}
  #main .main-section .section-title {font-size: 26px;}
  #main .main-section .section-title-wrap p {font-size: 17px;}

  #main .cont-more {top: -40px;}
}


/* ----- 메인 비주얼 슬라이드 ----- */
#main .visual_area .main-visual-swiper::after {pointer-events: none; content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(../images/main/video-pattern.png); opacity: 0.7; mix-blend-mode: overlay; z-index: 10;}
#main .main-visual-swiper {width: 100%; height: 100vh; position: absolute; top: 0;}
/* #main .main-visual-swiper .swiper-slide {} */
#main .main-visual-swiper .swiper-slide video {width: 100%; height: 100%; object-fit: cover; pointer-events: none !important;}

#main .main-visual-swiper .main-visual-control {position: absolute; bottom: 50px; right: 100px; display: flex; align-items: center; justify-content: center; gap: 20px; margin-top: 20px; z-index: 20;}
#main .main-swiper-prev, #main .main-swiper-next {margin: 0; position: static; width: fit-content; height: fit-content; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 20px;}
#main .main-swiper-pagination {position: static; width: fit-content; height: fit-content; display: flex; align-items: center; justify-content: center; gap: 10px;}
/* #main .main-visual-swiper .play-pause-btn i {display: flex; align-items: center; justify-content: center; font-size: 28px; color: #fff;} */
#main .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, #main .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {width: 10px; height: 10px; transition: 0.3s ease-in-out;}
#main .swiper-pagination-bullet-active {width: 60px !important; border-radius: 20px !important; background-color: #fff;}

#main .slogan {pointer-events: none; position:absolute; bottom:0; left:50%; transform:translate(-50%, 0); width:200%; height:100%; z-index:10; padding:0; word-break:keep-all; max-width:2500px; display:flex; align-items:center; justify-content:center; flex-direction:column;}
#main .slogan .slo-cont {position:relative; text-align:center; animation: opacity 1s ease-in-out forwards; animation-delay: 3s; }
#main .slogan .slo-cont > strong {font-size: 28px; color:#ffffff; font-weight: 400; display:block; position: relative;}
#main .slogan .slo-cont .slo-sub-text {font-size: 33px; color: #fff; font-weight: 500; margin: 80px 0 25px; line-height: 1.5;}
#main .slogan .slo-cont > .slo-text {font-weight: 600; font-size: 65px; display: flex; align-items: center; justify-content: center; width:100%; position:relative; top:20px; color:#fff;}
#main .slogan .slo-cont > .slo-text .slo-ani {/*font-family: "STUNNING";*/ font-weight: bold;}
#main .slogan .slo-cont > .slo-text span {display:inline-block; vertical-align:middle; padding:0; margin:0; position:relative; font-weight: 600;}

@keyframes tracking-out-contract{
	0%{opacity:1}
	50%{opacity:0; font-size:0;}
	100%{opacity:0; font-size:0;}
}
@keyframes font-up{
	0%{top:10px;}
	50%{top:10px;}
	100%{top:-40px;}
}
.tracking-out-contract{-webkit-animation:tracking-out-contract 3s 1s ease-out forwards;animation:tracking-out-contract 3s 1s ease-out forwards}

#main .slogan .slo-cont > .slo-text span.slo-ani{color:var(--main-color); font-size:90px; animation:Tright 2s 1s ease-out forwards;}
@keyframes Tright{
	0%{font-size:90px; margin:0 5px;}
	50%{font-size:90px; margin:0 5px;}
	100%{font-size:90px; margin:0 5px; color:#fff;}
}
@keyframes opacity{
	from {opacity: 1;}
	to {opacity: 0;}
}

/* 영상 탭 */
#main .visual_area .inner .slide-texts {position: fixed; right: 0; top: 50%; transform: translateY(-50%); z-index:10; padding: 10px 8px 10px 10px; display: flex; gap: 8px; flex-direction: column; justify-content:center; align-items: center; background-color: rgba(255, 255, 255, 0.4); backdrop-filter: blur(14px); border-radius: 30px 0 0 30px; opacity: 1; transition: 0.3s ease-in-out;}
#main .visual_area .inner .slide-text {display: flex; width: 42px; height: 42px; border-radius: 50%; cursor: pointer; transition: background-color 0.3s; max-width: 220px; align-items: center; justify-content: center; text-align: center; vertical-align: middle; border-radius: 100px; font-size: 17px; font-weight: 500;}

#main .visual_area .inner .slide-text:hover {background-color: var(--main-color); color: #fff;}
#main .visual_area .inner .slide-text.active {background: var(--main-color); color: #fff;}
#main .visual_area .inner .slide-text.g-rise {background: url('../images/main/ico-grise.svg')no-repeat center center/60%;}
#main .visual_area .inner .slide-text.active.g-rise {background: url('../images/main/ico-grise-w.svg')no-repeat center center/60%; background-color: var(--main-color);}
#main .visual_area .inner .slide-text.g-rise:hover {background: url('../images/main/ico-grise-w.svg')no-repeat center center/60%; background-color: var(--main-color);}
#main .visual_area .inner .slide-text.univ {background: url('../images/main/ico-univ.svg')no-repeat center center/60%;}
#main .visual_area .inner .slide-text.active.univ {background: url('../images/main/ico-univ-w.svg')no-repeat center center/60%; background-color: var(--main-color);}
#main .visual_area .inner .slide-text.univ:hover {background: url('../images/main/ico-univ-w.svg')no-repeat center center/60%; background-color: var(--main-color);}

#main .visual_area .inner .slide-text.slide-more {background-color: rgba(255, 255, 255, 0.4);}
#main .visual_area .inner .slide-text.slide-more i {font-size: 30px; display: flex; align-items: center; justify-content: center; transition: 0.3s ease-in-out; pointer-events: none;}
#main .visual_area .inner .slide-text.slide-more i::before {line-height: normal !important;}
#main .visual_area .inner .slide-text.slide-more:hover {background-color: rgba(255, 255, 255, 0.8); color: inherit;}
#main .visual_area .inner .slide-text.slide-more:hover i {transform: rotate(180deg);}
#main .visual_area .inner .slide-texts .slide-speak{background-color: rgba(255, 255, 255, 0.4);width:42px;height:42px;border-radius:50%;display:inline-flex;justify-content:center;align-items:center; transition: 0.3s ease-in-out;}
#main .visual_area .inner .slide-texts .slide-speak:hover{background-color: rgba(255, 255, 255, 0.8); color: inherit;}
#main .visual_area .inner .slide-texts .slide-speak i{font-size:26px; display: flex; align-items: center; justify-content: center;}

.tooltip {font-size: 14px; z-index: 10;}
.tooltip .tooltip-inner {padding: 3px 9px;}

@media(max-width: 768px) {
    .tooltip {display: none;}
}

#header.scroll ~ #main .visual_area  .inner .slide-texts {opacity: 0; visibility: hidden; pointer-events: none;}

@media(max-width: 1440px) {
  #main .slogan .slo-cont > .slo-text {font-size: 45px;}
  #main .slogan .slo-cont .slo-sub-text {font-size: 28px;}
  #main .slogan .slo-cont > strong {font-size: 22px;}

  #main .slogan .slo-cont > .slo-text span.slo-ani{font-size:65px;}
  @keyframes Tright{
    0%{font-size:65px;}
    50%{font-size:65px;}
    100%{font-size:65px;}
  }
  /* #main .visual_area .inner {height: 700px; min-height: 100% !important;} */
  /* #main .main-visual-swiper {height: 700px;} */
}
@media(max-width: 1024px) {
  #main .slogan .slo-cont > .slo-text {font-size: 38px;}
  #main .slogan .slo-cont .slo-sub-text {display: 25px;}
  #main .slogan .slo-cont > strong {display: 20px;}

  #main .slogan .slo-cont > .slo-text span.slo-ani{font-size:55px;}
  @keyframes Tright{
    0%{font-size:55px;}
    50%{font-size:55px;}
    100%{font-size:55px;}
  }
  
  /* #main .visual_area .inner .slide-texts {padding: 10px 12px;} */
  /* #main .visual_area .inner .slide-text {padding: 8px 15px;} */
  /* #main .visual_area .inner .slide-text.slide-more {margin-left: 10px;} */
  /* #main .visual_area .inner .slide-texts .slide-speak {width: 40px; height: 40px;} */
}
@media(max-width: 768px) {
  #main .slogan .slo-cont > .slo-text {/*ont-size: 30px;*/ display: none;}
  #main .slogan .slo-cont .slo-sub-text {display: none;}
  #main .slogan .slo-cont > strong {display: none;}

  #main .slogan .slo-cont > .slo-text span.slo-ani{font-size:40px;}
  @keyframes Tright{
    0%{font-size:40px;}
    50%{font-size:40px;}
    100%{font-size:40px;}
  }

  #main .visual_area .inner .slide-texts .slide-text {display: none;}
  #main .visual_area .inner .slide-texts .slide-more {display: flex; margin-left: 0;}
}
@media(max-width: 500px) {
  #main .slogan .slo-cont > .slo-text {font-size: 22px;}

  #main .slogan .slo-cont > .slo-text span.slo-ani{font-size:32px;}
  @keyframes Tright{
    0%{font-size:32px;}
    50%{font-size:32px;}
    100%{font-size:32px;}
  }
}
@media(max-width: 380px) {
  #main .slogan .slo-cont > .slo-text {font-size: 20px;}

  #main .slogan .slo-cont > .slo-text span.slo-ani{font-size:28px;}
  @keyframes Tright{
    0%{font-size:28px;}
    50%{font-size:28px;}
    100%{font-size:28px;}
  }
}

/* 20250916 메인 동영상 잘림 현상 수정 */
#main .main-visual-swiper .swiper-slide {display: flex; align-items: center; justify-content: center;}
#main .main-visual-swiper .swiper-slide video.univ {object-fit: fill; max-width: 1920px;}
@media (max-width: 1440px) {
  #main .main-visual-swiper .swiper-slide video.univ {object-fit: cover;}
}


/* ----- 숫자로 보는 플랫폼의 핵심 지표 ----- */
/* body.modal-open {padding-right: 0 !important;} */
/* #main .modal {padding-right: 0 !important;} */

#main #section-data {padding: 100px 0px; background-color: #f4f5f8; display: flex; align-items: center; justify-content: center;}
#main #section-data .layout {overflow: hidden;}
#main #section-data .layout .g-data {max-width: 1940px; width: 1940px; left: 50%; transform: translateX(-50%);}
#main #section-data .title-group {max-width: 1700px; position: relative; display: block; width: 100%; text-align: center; margin: 0 auto}
#main #section-data .title-group .main-title {display: block; margin-bottom: 30px; width: 100%; font-family: "STUNNING"; font-size: 42px;}
#main #section-data .title-group .main-title span {font-family: "STUNNING"; color: var(--main-color);}
#main #section-data .title-group .sub-title {display: block; font-size: 28px; margin-bottom: 60px;}

.g-data .data-ctrl {margin-top:60px;font-size:0;text-align:center}
.g-data .data-ctrl > * {display:inline-block}
.g-data .data-ctrl button {display:inline-block;position:relative;background:none;border:0;width:33px;height:20px;margin:0 11px;transition:transform .3s ease-out}
.g-data .data-ctrl button.btn-prev:hover {transform:translateX(-6px)}
.g-data .data-ctrl button.btn-next:hover {transform:translateX(6px)}
.g-data .data-ctrl button .arr {display:block;position:relative;background:#141845;border:0;width:100%;height:2px;transition:.35s .35s;}
.g-data .data-ctrl button .arr:before,
.g-data .data-ctrl button .arr:after {content:"";display:block;position:absolute;top:50%;background-color:#141845;width:2px;height:13px;transition:.35s}
.g-data .data-ctrl button.btn-prev .arr{left:2px;}
.g-data .data-ctrl button.btn-prev .arr:before {left:2px;transform:translateY(-2px) rotate(-45deg)}
.g-data .data-ctrl button.btn-prev .arr:after {left:2px;transform:translateY(-11px) rotate(225deg)}
.g-data .data-ctrl button.btn-next .arr{left:-2px;}
.g-data .data-ctrl button.btn-next .arr:before {right:2px;transform:translateY(-2px) rotate(225deg)}
.g-data .data-ctrl button.btn-next .arr:after {right:2px;transform:translateY(-11px) rotate(-45deg)}
.g-data .data-auto button {width:15px}
.g-data .data-auto button:before {content:"";display:block;position:absolute;left:0;right:0;top:0;bottom:0;margin:auto}
.g-data .data-auto .btn-stop:before {border:2px solid #0a1646;border-top:0;border-bottom:0;width:8px;height:16px;box-sizing:border-box}
.g-data .data-auto .btn-play {display:none}
.g-data .data-auto .btn-play:before {border-width:7px 0 7px 10px;border-style:solid;border-color:transparent;border-left-color:#0a1646;width:0;height:0}

.g-data .g-data-box {position:relative;background-color:#fff;border-radius:20px;min-height:446px;padding:35px;box-shadow:0 13px 18px 0 rgba(144, 156, 187, .4);box-sizing:border-box;transition:all .25s ease-out}
.g-data-box .mp-tit {margin-bottom:25px;font-size:28px;font-weight:700;line-height:1.2}
.g-data-box .mp-num {font-weight:600; text-align: right; font-size: 22px; display: block; position: relative; z-index: 1;}
.g-data-box .mp-num > span {font-weight:600;}
.g-data-box .mp-num em {font-size:35px; font-family: 'Spoqa B'; font-weight: 800; margin-right: 5px;}
.g-data-box .mp-txt {font-size:1.211em;font-weight:500;line-height:1.2}
.g-data-box .mp-txt.s {color:#686868; font-size: 20px; text-align: right; word-break: keep-all;}
.g-data-box .mp-img-box {position:relative;background:#f2f4f6;border-radius:50%;width:156px;height:156px;margin:0 auto 33px}
.g-data-box .mp-img-box > img {position:absolute;left:0;right:0;margin:0 auto;}
.g-data-box .mp-list li {border-bottom:1px solid #dee4ea;margin-bottom:20px;padding-bottom:20px;box-sizing:border-box;}
.g-data-box .mp-list li:last-child {border-bottom:0;margin-bottom:0;padding-bottom:0}
.g-data-box .mp-list .mp-list-box {display:flex;align-items:center;justify-content:space-between;background:#f2f4f6;border-radius:10px;height:120px;padding:10px 23px;box-sizing:border-box}
.g-data-box .mp-list .mp-list-box .txt {color:#000;font-weight:500;line-height:1.2;letter-spacing:-.05em;font-size:1.16em}
.g-data-box .mp-list .mp-list-box .txt > span {font-size:.998em}

.g-data-box .mp-ico {position: absolute; right: 30px; bottom: 45px; width: 90px; height: 90px; z-index: 0;}

.g-data-box.p04 .mp-num, .g-data-box.p05 .mp-num {display: flex; align-items: center; justify-content: space-between;}

.g-data-box.p01 .mp-num {color: #7A73D1; margin-bottom: 15px;}
.g-data-box.p01 .p01-c {color: #7A73D1;}

.g-data-box.p02 .mp-num {color: #f2577e;}
.g-data-box.p02 .p02-c {color: #f2577e;}
.g-data-box.p02 .mp-ico {right: 28px; bottom: 35px;}

.g-data-box.p03 .mp-num {position: relative; margin-bottom: -8px; color: #0065F8; line-height: 1; z-index:1}
.g-data-box.p03 .p03-c {color: #0065F8;}
.g-data-box.p03 .mp-ico {width: 105px; right: 25px; bottom: 35px;}

.g-data-box.p04 .mp-num {font-size: 22px;}
.g-data-box.p04 .mp-num em {margin: 0 5px;}
.g-data-box.p04 .mp-num,
.g-data-box.p04 .p04-c {color: #3A59D1;}
.g-data-box.p04 .mp-ico {bottom: 32px;}

.g-data-box.p05 .mp-num {font-size: 22px;}
.g-data-box.p05 .mp-num em {margin: 0 5px;}
.g-data-box.p05 .mp-num {color: #0ABAB5;}
.g-data-box.p05 .mp-ico {width: 95px; right: 25px; bottom: 28px;}

.g-data-box.p06 .mp-num {color: #02ba7e;}
.g-data-box.p06 .p06-c {color: #02ba7e;}

.g-data-box.p07 .mp-num {color: #FF9B00;}
.g-data-box.p07 .p07-c {color: #FF9B00;}
.g-data-box.p07 .mp-ico {bottom: 30px;}

.g-data-box.swiper-slide-active .mp-tit,
.g-data-box.swiper-slide-active .mp-num,
.g-data-box.swiper-slide-active .mp-num,
.g-data-box.swiper-slide-active .mp-txt,
.g-data-box.swiper-slide-active .mp-txt span,
.g-data-box.swiper-slide-active .mp-num span,
.g-data-box.swiper-slide-active .mp-list .mp-list-box .txt {color:#fff !important}
.g-data-box.swiper-slide-active .mp-img-box {background-color:rgba(242, 244, 246, .3)}
.g-data-box.swiper-slide-active .mp-list-box {background-color:rgba(255, 255, 255 ,.25)}

.g-data-box.p01.swiper-slide-active {background-color:#7A73D1;}
.g-data-box.p02.swiper-slide-active {background-color:#f2577e;}
.g-data-box.p03.swiper-slide-active {background-color:#0065F8;}
/* .g-data-box.p03.swiper-slide-active .mp-txt {color:#2374ef !important;} */
.g-data-box.p04.swiper-slide-active {background-color:#3A59D1;}
.g-data-box.p05.swiper-slide-active {background-color:#0ABAB5;}
.g-data-box.p06.swiper-slide-active {background-color:#02ba7e;}
.g-data-box.p07.swiper-slide-active {background-color:#FF9B00;}

@media (max-width: 1440px) {
  #main #section-data .title-group .main-title {font-size: 36px;}
  #main #section-data .title-group .sub-title {font-size: 24px; margin-bottom: 50px;}
  #main #section-data {padding: 80px 0;}

  #main #section-data .layout .g-data {width: 1800px; max-width: 1800px;}

  .g-data .g-data-box {padding: 30px; min-height: 420px;}
  .g-data-box .mp-tit {font-size: 26px;}
}
@media (max-width: 1280px) {
  #main #section-data .layout .g-data {width: 1700px; max-width: 1700px;}

  .g-data .g-data-box {padding: 30px; min-height: 400px;}
  .g-data-box .mp-tit {font-size: 24px;}
  .g-data-box .mp-num em {font-size: 30px;}

  .g-data-box .mp-num {font-size: 20px;}
  .g-data-box.p04 .mp-num {font-size: 20px;}
  .g-data-box.p05 .mp-num {font-size: 20px;}
}
@media (max-width: 1024px) {
  #main #section-data .layout .g-data {width: 1500px; max-width: 1500px;}

  .g-data .g-data-box {min-height: 380px;}
  .g-data-box .mp-ico {width: 70px; height: 70px;}
  .g-data-box.p03 .mp-ico {width: 85px;}
  .g-data-box.p05 .mp-ico {width: 75px;}
}
@media (max-width: 768px) {
  #main #section-data {padding: 60px 0;}
  #main #section-data .title-group .main-title {font-size: 30px; margin-bottom: 20px;}
  #main #section-data .title-group .sub-title {font-size: 22px; margin-bottom: 40px;}

  .g-data-box .mp-tit {font-size: 22px;}
}
@media (max-width: 600px) {
  #main #section-data .layout .g-data {width: 1350px; max-width: 1350px;}
  #main #section-data .title-group .main-title {display: flex; flex-direction: column; gap: 7px;}
  .g-data .g-data-box {min-height: 350px;}
 
  .g-data-box .mp-num em {font-size: 26px;}
  .g-data-box .mp-num {font-size: 19px;}
  .g-data-box.p04 .mp-num {font-size: 19px;}
  .g-data-box.p05 .mp-num {font-size: 19px;}
}
@media (max-width: 450px) {
  #main #section-data .title-group .main-title {font-size: 26px;}
  .g-data .g-data-box {padding: 25px;}
}


/* ----- 다양한 소식 ----- */
#main .section-notice {display: flex; flex-wrap: wrap; gap: 60px; align-items: flex-start;}
#main .notice-list-wrap {width: calc(100% - 360px);}

#main .notice-list-wrap .notice-list {display: flex; flex-wrap: wrap; gap: 40px;}
#main .notice-list-wrap .notice-list li {width: calc(33.333% - 26.666px); position: relative; transition: 0.3s ease-in-out; overflow: hidden;}
#main .notice-list-wrap .notice-list li:nth-child(n+4) {display: none;}
/* #main .notice-list-wrap .notice-list li:hover {transform: translateY(-10px);} */
#main .notice-list-wrap .notice-list li a {display: block;}

#main .notice-list-wrap .arrow-btn {content: ''; width: 65px; height: 65px; background-color: #fff; position: absolute; top: -1px; right: -1px; border-radius: 0 0 0 35px; z-index: 10;}
#main .notice-list-wrap .arrow-btn::before {content: ''; width: 25px; height: 25px; background: radial-gradient(circle at left bottom, #0000 67%, #fff 0); position: absolute; top: 0; right: 64px;}
#main .notice-list-wrap .arrow-btn::after {content: ''; width: 25px; height: 25px; background: radial-gradient(circle at left bottom, #0000 67%, #fff 0); position: absolute; top: 64px; right: 0;}
#main .notice-list-wrap .arrow-btn .arrow {transition: background-color 0.3s ease-in-out; display: flex; align-items: center; justify-content: center; width: 55px; height: 55px; background-color: #9098a8; border-radius: 100%; position: absolute; top: 1px; right: 1px;}
#main .notice-list-wrap .arrow-btn .arrow::before {content: '\f061'; font-family: 'Font Awesome 6 Free'; font-weight: 400; transform: rotate(-45deg); font-size: 22px; color: #fff; position: relative; top: 1px; left: 1px;}
#main .notice-list-wrap li:hover .arrow-btn .arrow {background-color:var(--main-color);}

#main .notice-list .notice-img-wrap {width: 100%; height: 100%; min-height: 280px; border-radius: 20px 20px 0 0; overflow: hidden; position: relative;}
#main .notice-list .notice-img-wrap img {width: 100%; height: 100%; height: 280px; object-fit: cover; transition: 0.3s ease-in-out; border-radius: 0 90px 0 0;}
/* #main .notice-list-wrap .notice-list li:hover .notice-img-wrap img {transform: scale(1.05);} */

#main .notice-list .notice-text-wrap {padding: 30px; border: 1px solid #d5d7dd; border-radius: 0 0 20px 20px; border-top: none;}
#main .notice-list .notice-text-wrap .notice-tit {font-size: 22px; font-weight: 600; margin-bottom: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; max-width: 100%;}
#main .notice-list li:hover .notice-text-wrap .notice-tit {text-decoration: underline;}
#main .notice-list .notice-text-wrap .notice-desc {font-size: 18px; color: #555; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; line-height: 1.4; height: calc(1.4em * 2); margin-bottom: 20px;}

#main .notice-list .notice-text-wrap .notice-etc-wrap {display: flex; gap: 20px; align-items: center; font-size: 17px;}
#main .notice-list .notice-text-wrap .notice-cate {color: var(--main-color); font-weight: 600; position: relative;}
#main .notice-list .notice-text-wrap .notice-cate::before {content: ''; width: 1px; height: 12px; background-color: #ccc; position: absolute; top: 50%; transform: translateY(-50%); right: -11px;}
#main .notice-list .notice-text-wrap .notice-date {color: #999;}

@media(max-width: 1600px) {
  #main .section-notice {flex-direction: column; gap: 30px;}
  #main .notice-list-wrap {width: 100%;}
  #main .notice-list-wrap ul {margin-bottom: 120px;}
}
@media(max-width: 1440px) {
  #main .notice-list-wrap .notice-list {gap: 20px;}
  #main .notice-list-wrap .notice-list li {width: calc(33.333% - 13.333px);}
}
@media(max-width: 1024px) {
  #main .notice-list-wrap .arrow-btn {width: 60px; height: 60px;}
  #main .notice-list-wrap .arrow-btn .arrow {width: 50px; height: 50px;}
  #main .notice-list-wrap .arrow-btn::after {top: 59px;}
  #main .notice-list-wrap .arrow-btn::before {right: 59px;}
  
  #main .notice-list .notice-text-wrap {padding: 20px;}
  #main .notice-list .notice-text-wrap .notice-tit {font-size: 20px;}
  #main .notice-list .notice-text-wrap .notice-desc {font-size: 17px;}
}
@media(max-width: 768px) {
  #main .notice-list-wrap ul {margin-bottom: 90px;}
}
@media(max-width: 900px) {
  #main .notice-list-wrap .notice-list li {width: calc(50% - 10px);}
  #main .notice-list-wrap .notice-list li:nth-child(n+3) {display: none;}
}
@media(max-width: 600px) {
  #main .notice-list-wrap .notice-list {gap: 15px;}
  #main .notice-list-wrap .notice-list li {width: 100%;}
  #main .notice-list-wrap .notice-list li:nth-child(n+3) {display: block;}
  #main .notice-list-wrap .notice-list li:nth-child(n+4) {display: none;}

  #main .notice-list .notice-img-wrap {min-height: 250px;}
  #main .notice-list .notice-img-wrap img {height: 250px;}
  #main .notice-list-wrap .notice-list li:not(:first-child) .notice-img-wrap {display: none;}
  #main .notice-list-wrap .notice-list li:not(:first-child) .notice-text-wrap {border-radius: 20px; border-top: 1px solid #d5d7dd;}
  #main .notice-list-wrap .notice-list li:not(:first-child) .arrow-btn {display: none;}
}


/* ----- 명품강소기업 ----- */
#main .section-com {display: flex; flex-wrap: wrap; gap: 60px; align-items: flex-start;}
#main .section-com-wrap {width: calc(100% - 360px);}

#main .section-com-wrap .com-list-title {margin-bottom: 20px; margin-left: auto; display: flex; align-items: center; justify-content: flex-end;}
#main .section-com-wrap .com-list-title span {font-size: 22px; font-weight: 600;}
#main .section-com-wrap .com-list-title i {font-size: 35px; display: flex; align-items: center; justify-content: center; transition: 0.3s ease-in-out;}
#main .section-com-wrap .com-list-title:hover i.bi-plus {transform: rotate(180deg);}

#main .companytabs ul {display:flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 30px;}
#main .companytabs ul li {border-radius: 15px; /*border: 1px solid #d5d7dd;*/ box-shadow: 0px 0px 10px #30303021; text-align:center; width: calc(25% - 22.5px); overflow: hidden; transition: 0.3s ease-in-out;}
#main .companytabs ul li:hover {/*border-color: #30303021;*/ box-shadow: 0px 0px 15px #3939393d;}

#main .companytabs ul li:nth-child(n+13) {display: none;}

#main .companytabs ul li .com-box {padding: 20px; gap: 15px; display: flex; align-items: center; flex-direction: column;}
#main .companytabs ul li .com-box .com-img-wrap {width: 100%; height: 60px; border-bottom: 1px solid #d5d7dd85; padding-bottom: 10px;}
#main .companytabs ul li .com-box .com-img-wrap img {width: 100%; height: 100%; max-width: 110px; max-height: 60px; object-fit: contain;}

#main .companytabs ul li .com-box .com-txt-wrap {width: 100%; display: flex; flex-direction: column; align-items: center; font-size: 18px;}
#main .companytabs ul li .com-box .com-txt-wrap .com-cate-wrap {display: flex; align-items: center; justify-content: center; gap: 5px; margin-bottom: 8px;}
#main .companytabs ul li .com-box .com-txt-wrap .com-cate {padding: 5px 10px; line-height: 1.2; display: flex; align-items: center; justify-content: center; background-color: #f4f6fa; color: var(--main-color); border-radius: 50px; font-size: 15px; width: fit-content; margin: 0 auto; margin-bottom: 10px;}
#main .companytabs ul li .com-box .com-txt-wrap .cate-logo {width: 22px; height: 22px; background: url('../images/main/hidden-logo.svg')no-repeat center center/100%;}
#main .companytabs ul li .com-box .com-txt-wrap .com-name {width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; font-size: 18px; margin-bottom: 6px;}
#main .companytabs ul li .com-box .com-txt-wrap .com-type {width: 100%; font-size: 17px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

#main .section-com .nav-link:hover {border-left: 3px solid #045ed9; color: #045ed9;}
#main .section-com .nav-pills .nav-link.active, #main .section-com .nav-pills .show>.nav-link {background-color: transparent; border-color: #045ed9; color: #045ed9;}

/* .section-com-wrap .hidden-com li {display: none;}
.section-com-wrap .hidden-com li.show-item {display: block;}
.section-com-wrap .pre-com li {display: none;}
.section-com-wrap .pre-com li.show-item {display: block;} */

@media(max-width: 1600px) {
  #main .section-com {flex-direction: column; gap: 30px;}
  #main .main-section .section-title-wrap {width: 100%;}
  #main .section-com-wrap {width: 100%;}

  #main .companytabs ul {margin-bottom: 120px;}
  #main .section-com-wrap .com-list-title {position: absolute; bottom: 100px; left: 50%; transform: translateX(-50%); margin-bottom: 0;}
  #main .section-com-wrap .com-list-title span {display: none;}
  #main .section-com-wrap .com-list-title i {background-color: #f9f9f9; width: 70px; height: 70px; border-radius: 50%; font-size: 40px; color: #6b6b6e;}
}
@media(max-width: 1440px) {
  #main .companytabs ul {gap: 20px;}
  #main .companytabs ul li {width: calc(25% - 15px);}

  #main .section-com-wrap .com-list-title {bottom: 80px;}
}
@media(max-width: 900px) {
  #main .companytabs ul li {width: calc(33.333% - 13.333px);}
  #main .companytabs ul li:nth-child(n+10) {display: none;}
}
@media(max-width: 768px) {
  #main .section-com-wrap .com-list-title {font-size: 20px;}
  #main .section-com-wrap .com-list-title i {font-size: 32px;}

  #main .companytabs ul {margin-bottom: 90px;}
  #main .section-com-wrap .com-list-title {bottom: 60px;}
  #main .section-com-wrap .com-list-title i {width: 60px; height: 60px; border-radius: 50%; font-size: 34px;}
}
@media(max-width: 680px) {
  #main .companytabs ul li {width: calc(50% - 10px);}
  #main .companytabs ul li:nth-child(n+7) {display: none;}
}
@media(max-width: 450px) {
  #main .section-com-wrap .com-list-title {font-size: 19px;}
  #main .companytabs ul li {width: 100%;}
  #main .companytabs ul li:nth-child(n+4) {display: none;}
  #main .companytabs ul li .com-box {padding: 15px;}
}

/* 명품강소기업 모달 */
#company-modal {padding: 20px !important;}
#company-modal .modal-header {border-bottom: none !important;}
#company-modal .modal-header .btn-close {background-size: 80%;}
#company-modal .modal-footer {border-top: none !important; margin: 0 auto; padding-bottom: 0;}
#company-modal .modal-footer .com-modal-btn {background-color: #727579; padding: 15px 50px; border-radius: 50px; color: #fff; font-size: 20px; transition: 0.3s ease-in-out;}
#company-modal .modal-footer .com-modal-btn:hover {background-color: #fff; box-shadow: 0px 0px 15px #72757950; color: #212529;}
#company-modal .company-modal-cont {width: 100%; height: 100px; border: 1px solid #ebebeb; border-radius: 15px; display: flex; flex-wrap: wrap; height: 100%; overflow: hidden;}

#company-modal .company-modal-cont .com-left-wrap {width: 40%; background-color: #4c8cf0; padding: 40px 30px 30px; display: flex; flex-direction: column; align-items: center; justify-content: space-between; color: #fff;}
#company-modal .com-left-wrap .com-cont-img {width: 150px; height: 150px; background-color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; overflow: hidden; margin-bottom: 30px;}
#company-modal .com-left-wrap .com-cont-img img {width: 100%; height: 100%; max-width: 120px; object-fit: contain;}

#company-modal .com-left-wrap .com-name {font-size: 26px; font-weight: 600; margin-bottom: 30px;}
#company-modal .com-left-wrap .com-link {font-size: 20px; display: flex; align-items: center; justify-content: center; margin-bottom: 30px; flex-wrap: wrap; gap: 10px 0;}
#company-modal .com-left-wrap .com-link:hover .link-add {text-decoration: underline !important;}
#company-modal .com-left-wrap .com-link i {display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background-color: #3875d2; margin-left: 10px; font-size: 15px;}

#company-modal .com-left-wrap .com-etc {display: flex; gap: 15px; flex-wrap: wrap; width: 100%;}
#company-modal .com-left-wrap .com-etc li {width: calc(33.333% - 10px); background-color: #3b6cb9; display: flex; flex-direction: column; gap: 5px; align-items: flex-start; justify-content: center; padding: 10px 10px 15px 15px; border-radius: 10px;}
#company-modal .com-left-wrap .com-etc li i {margin-left: auto; display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background-color: #30599b;}
#company-modal .com-left-wrap .com-etc li .etc-tit {font-size: 17px;}
#company-modal .com-left-wrap .com-etc li .etc-txt, .com-left-wrap .com-etc li .etc-num {font-size: 18px; font-weight: 600;}

#company-modal .company-modal-cont .com-right-wrap {width: 60%; flex: 1; padding: 30px;}
#company-modal .com-right-wrap .com-info {font-size: 24px; font-weight: bold; margin-bottom: 20px;}

#company-modal .company-modal-cont .com-cont-top {border-bottom: 1px dashed #d5d7dd; padding-bottom: 30px; margin-bottom: 30px;}
#company-modal .com-right-wrap .com-info-list {display: flex; flex-wrap: wrap; gap: 20px 10px;}
#company-modal .com-right-wrap .com-info-list li {width: calc(50% - 10px); position: relative; padding-left: 15px; font-size: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; margin-left: 5px;}
#company-modal .com-right-wrap .com-info-list .tit {font-weight: 600; display: inline-block; width: 80px;}
#company-modal .com-right-wrap .com-info-list li .com-add:hover {text-decoration: underline !important;}
#company-modal .com-right-wrap .com-info-list li::before {content: ''; width: 5px; height: 5px; background-color: #7d7d7d; border-radius: 50%; position: absolute; top: 8px; left: 0;}

#company-modal .company-modal-cont .com-cont-bottom .com-desc {font-size: 17px; line-height: 1.5; word-break: keep-all; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; word-break: keep-all; margin-left: 5px;}
#company-modal .company-modal-cont .com-cont-bottom .com-more {margin-top: 50px; display: flex; align-items: center; justify-content: center; width: fit-content; margin-left: auto; font-size: 17px; color: #999;}
#company-modal .company-modal-cont .com-cont-bottom .com-more:hover a {text-decoration: underline !important;}
#company-modal .company-modal-cont .com-cont-bottom .com-more i {display: flex; align-items: center; justify-content: center; margin-right: 5px;}

@media(max-width: 1440px) {
  #company-modal .company-modal-cont {flex-direction: column;}
  #company-modal .company-modal-cont .com-left-wrap {width: 100%;}
  #company-modal .company-modal-cont .com-right-wrap {width: 100%;}
}
@media(max-width: 1024px) {
  #company-modal .company-modal-cont .com-left-wrap {padding: 30px 20px 20px;}
  #company-modal .company-modal-cont .com-right-wrap {padding: 20px;}
}
@media(max-width: 768px) {
  #company-modal .com-left-wrap .com-cont-img {width: 120px; height: 120px; margin-bottom: 20px;}
  #company-modal .com-left-wrap .com-name {margin-bottom: 20px; font-size: 24px;}
  #company-modal .com-left-wrap .com-link {margin-bottom: 20px;}
  #company-modal .com-right-wrap .com-info {font-size: 22px;}
  #company-modal .com-right-wrap .com-info-list {gap: 15px 0;}
  #company-modal .company-modal-cont .com-cont-top {padding-bottom: 20px; margin-bottom: 20px;}
}
@media(max-width: 575px) {
  #company-modal {padding: 5px !important;}
}
@media(max-width: 650px) {
  #company-modal .com-left-wrap .com-etc li {width: 100%;}
  #company-modal .com-right-wrap .com-info-list li {width: 100%;}
  #company-modal .com-left-wrap .com-etc li {padding: 15px;}
  #company-modal .com-left-wrap .com-etc li i {display: none;}
  #company-modal .com-left-wrap .com-etc li .etc-txt {width: 100%; text-align: right;}
}
@media(max-width: 500px) {
  .modal-dialog-scrollable .modal-content {padding: 10px !important;}
  #company-modal .company-modal-cont .com-left-wrap {padding: 20px 15px 15px;}
  #company-modal .com-left-wrap .com-cont-img {width: 100px; height: 100px; margin-bottom: 15px;}
  #company-modal .com-left-wrap .com-name {font-size: 21px; margin-bottom: 15px;}
  #company-modal .com-left-wrap .com-link {font-size: 19px; margin-bottom: 15px;}
  #company-modal .com-left-wrap .com-etc {gap: 10px;}
  #company-modal .company-modal-cont .com-right-wrap {padding: 15px;}
  #company-modal .com-right-wrap .com-info {font-size: 20px; margin-bottom: 15px;}
  #company-modal .com-right-wrap .com-info-list {gap: 12px;}
  #company-modal .com-right-wrap .com-info-list li {font-size: 17px;}
  #company-modal .company-modal-cont .com-cont-bottom .com-more {margin-top: 40px;}
}


/* ----- 주요 일정 ----- */
#main .section-cal {display: flex; flex-wrap: wrap; gap: 60px; align-items: flex-start;}
#main .section-cal-wrap {width: calc(100% - 360px);}

#main .cal-list-wrap .cal-list-tit {width: 100%; display: flex; align-items: center; justify-content: space-between; margin-bottom: 30px;}
#main .cal-list-wrap .cal-list-tit .cal-tit {font-size: 28px; font-weight: bold;}

#main .cal-list-wrap .cal-list {display: flex; flex-wrap: wrap; gap: 40px;}
#main .cal-list-wrap .cal-list li {width: calc(33.333% - 26.666px); border-radius: 20px; /*box-shadow: 0px 0px 10px #30303021;*/ background-color: #f9f9f9; transition: 0.3s ease-in-out;}
/* #main .cal-list-wrap .cal-list li:hover {transform: translateY(-10px);} */
#main .cal-list-wrap .cal-list li a {display: block; width: 100%; height: 100%; padding: 30px;}

#main .cal-list-wrap .cal-list li:nth-child(n+10) {display: none;}

#main .cal-list-wrap .cal-list .cal-cate-wrap {display: flex; align-items: center; gap: 10px; font-size: 17px; color: #999; margin-bottom: 20px;}
#main .cal-list-wrap .cal-list .cal-cate-wrap .cal-cate {display: block; width: fit-content; line-height: 1; padding: 8px 12px; border-radius: 50px; font-size: 17px; background-color: #444; color: #fff;}
#main .cal-list-wrap .cal-list .cal-cate-wrap .cal-kind {display: block; font-size: 17px; color: #999; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; width: 210px; flex: 1;}

#main .cal-list-wrap .cal-list .cal-cate.green {background-color: #03a2a8;}
#main .cal-list-wrap .cal-list .cal-cate.navy {background-color: #045ed9;}
#main .cal-list-wrap .cal-list .cal-cate.orange {background-color: #ff8600;}

#main .cal-list-wrap .cal-list a:hover .cal-cont-tit {text-decoration: underline;}
#main .cal-list-wrap .cal-list .cal-cont-tit {font-size: 22px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; max-width: 100%; margin-bottom: 20px;}
#main .cal-list-wrap .cal-list .cal-date-wrap {display: flex; gap: 20px; font-size: 17px;}
#main .cal-list-wrap .cal-list .cal-date-wrap .cal-date {color: #999;}
#main .cal-list-wrap .cal-list .cal-date-wrap .cal-dday {color: #999; position: relative;}
#main .cal-list-wrap .cal-list .cal-date-wrap .cal-dday.d-red {color: #dc3030;}
#main .cal-list-wrap .cal-list .cal-date-wrap .cal-dday::before {content: ''; width: 1px; height: 12px; background-color: #ccc; position: absolute; top: 50%; transform: translateY(-50%); left: -10px;}

@media(max-width: 1600px) {
  #main .section-cal {flex-direction: column; gap: 30px;}
  #main .section-cal-wrap {width: 100%;}

  #main .section-cal-wrap .cal-list {margin-bottom: 120px;}
  #main .section-cal-wrap .cal-list.all {margin-bottom: 0;}
}
@media(max-width: 1440px) {
  #main .cal-list-wrap .cal-list {gap: 20px;}
  #main .cal-list-wrap .cal-list li {width: calc(33.333% - 13.333px);}
}
@media(max-width: 1180px) {
  #main .cal-list-wrap .cal-list li a {padding: 25px;}
}
@media(max-width: 1024px) {
  #main .cal-list-wrap .cal-list li {width: calc(50% - 10px);}
  #main .cal-list-wrap .cal-list li:nth-child(n+7) {display: none;}
  #main .cal-list-wrap .cal-list .cal-cate-wrap {margin-bottom: 15px;}
  #main .cal-list-wrap .cal-list .cal-cont-tit {font-size: 20px; margin-bottom: 15px;}

  #main .cal-list-wrap .cal-list .cal-cate-wrap .cal-cate {font-size: 16px;}
  #main .cal-list-wrap .cal-list .cal-cate-wrap .cal-kind {font-size: 16px;}
}
@media(max-width: 768px) {
  #main .section-cal-wrap .cal-list {margin-bottom: 90px;}
  #main .section-cal-wrap .cal-list.all {margin-bottom: 0;}
}
@media(max-width: 680px) {
  #main .cal-list-wrap .cal-list {gap: 15px;}
  #main .cal-list-wrap .cal-list li {width: 100%;}
  #main .cal-list-wrap .cal-list li:nth-child(n+4) {display: none;}
}
@media(max-width: 450px) {
  #main .cal-list-wrap .cal-list li a {padding: 20px;}
}


/* ----- 팝업존 ----- */
#main .section-pop {display: flex; flex-wrap: wrap; gap: 60px; align-items: flex-start;}
#main .section-pop::before {display: none;}
#main .section-pop-wrap {width: calc(100% - 360px); margin-top: -10px;}

#main .gallery-popup-swiper {position: relative; width: 100%; height: 100%; padding-top: 10px;}
#main .gallery-popup-swiper .swiper-slide {display: flex; flex-direction: column; gap: 20px; transition: 0.3s ease-in-out; box-sizing: border-box;}
/* #main .gallery-popup-swiper .swiper-slide:hover {transform: translateY(-10px);} */

#main .gallery-popup-swiper .swiper-slide .pop-img-wrap {border: 1px solid #d5d7dd; max-height: 380px; width: 100%; height: 100%; border-radius: 20px; overflow: hidden;  aspect-ratio: 1/1;}
#main .gallery-popup-swiper .swiper-slide .pop-img-wrap img {width: 100%; height: 100%; max-height: 380px; object-fit: cover; transition: 0.3s ease-in-out;}
/* #main .gallery-popup-swiper .swiper-slide:hover .pop-img-wrap img{transform: scale(1.05)} */

#main .gallery-popup-swiper .swiper-slide .pop-cate {display: block; width: fit-content; padding: 7px 12px; background-color: #444; color: #fff; font-size: 17px; border-radius: 50px;}
#main .gallery-popup-swiper .swiper-slide .pop-tit {font-size: 22px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; max-width: 100%;}
#main .gallery-popup-swiper .swiper-slide:hover .pop-tit {text-decoration: underline !important;}
#main .gallery-popup-swiper .swiper-slide .pop-date {font-size: 17px; color: #999;}

#main .swiper-control-wrap {display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 20px;}

#main .swiper-control-wrap .swiper-button-prev,#main .swiper-control-wrap .swiper-button-next {margin: 0; position: static; width: fit-content; height: fit-content; display: flex; align-items: center; justify-content: center;}
#main .swiper-button-next:after, #main .swiper-rtl .swiper-button-prev:after,#main .swiper-button-next:after, #main .swiper-button-prev:after {font-size: 18px !important; font-weight: bold; color: #212529;}

#main .swiper-control-wrap .swiper-pagination {position: static; width: fit-content; height: fit-content; font-size: 20px; margin: 0 5px; color: #999; display: flex; align-items: center; justify-content: center; gap: 8px;}
#main .swiper-control-wrap .swiper-pagination .swiper-pagination-current {color: #212529;}

#main .swiper-control-wrap .gallery-popup-toggle i {display: flex; align-items: center; justify-content: center; font-size: 28px;}

@media(max-width: 1600px) {
  #main .section-pop {flex-direction: column; gap: 30px; position: relative;}
  #main .section-pop-wrap {width: 100%; margin-bottom: 80px;}
  #main .main-section .section-title-wrap {position: static;}

  #main .swiper-control-wrap {position: absolute; bottom: 100px; left: 50%; transform: translateX(-50%); margin-top: 0;}
}
@media(max-width: 1440px) {
  #main .swiper-control-wrap {bottom: 80px;}
}
@media(max-width: 768px) {
  #main .section-pop-wrap {margin-bottom: 60px;}

  #main .swiper-control-wrap {bottom: 60px;}

  #main .gallery-popup-swiper .swiper-slide {gap: 15px;}
  #main .gallery-popup-swiper .swiper-slide .pop-tit {font-size: 20px;}
}


/* ----- 다양한 소식 밑 빠른메뉴 ----- */
#main .section-research {max-width: 100%; border-bottom: none; padding: 0; background: url('../images/main/research-bg.jpg')no-repeat center center/cover; position: relative;}
#main .section-research::before {content: ''; width: 100%; height: 100%; background-color: rgba(0,0,0,.3); backdrop-filter: blur(5px); position: absolute; top: 0; left: 50%; transform: translateX(-50%);}
#main .section-research .research-wrap {width: 100%; height: 450px; display: flex; align-items: center; justify-content: center;}
#main .section-research .research-wrap .research-section {width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; position: relative;}
#main .section-research .research-wrap .research-section::before {content: ''; width: 1px; height: 100%; background-color: #ffffff44; position: absolute; top: 0; right: 0;}
#main .section-research .research-wrap .research-section:last-of-type::before {display: none;}

#main .research-section .section-link {background-color: transparent; width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 40px; text-align: center; word-break: keep-all; position: relative;}
#main .research-section .section-link::before {content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 0; opacity: 0; transition: 0.3s ease-in-out;}
#main .research-section .section-link.link01::before {width: calc(100% - 1px); background:url('../images/main/research-img01.jpg')no-repeat center center/cover; filter: brightness(0.5);}
#main .research-section .section-link.link02::before {width: calc(100% - 1px); background:url('../images/main/research-img02.jpg')no-repeat center center/cover; filter: brightness(0.5);}
#main .research-section .section-link.link03::before {width: calc(100% - 1px); background:url('../images/main/research-img03.jpg')no-repeat center center/cover; filter: brightness(0.5);}
#main .research-section .section-link.link04::before {background:url('../images/main/research-img04.jpg')no-repeat center center/cover; filter: brightness(0.5);}

#main .research-section .section-link:hover::before {opacity: 1;}
#main .research-section .section-link .sub-tit {font-size: 24px; color: #fff; transition: 0.3s ease-in-out; position: relative; z-index: 1;}
#main .research-section .section-link .tit {font-size: 35px; line-height: 1.4; font-family: "STUNNING"; color: #fff; transition: 0.3s ease-in-out; position: relative; z-index: 1;}

#main .research-section .cont-more {margin: 0;}
#main .research-section .cont-more i {background-color: #ffffff44; border: 1px solid #ffffff99; color: #ffffff99; margin: 0; position: relative; z-index: 1;}
#main .research-section .cont-more:hover i {background-color: inherit; border: 1px solid #fff; color: #fff;}
#main .research-section .section-link:hover .cont-more i {background-color: #fff; border-color: #fff; color: #212529;}

/* 호버 페이드효과 */
#main .research-wrap:hover .section-link:not(:hover) .tit,
#main .research-wrap:hover .section-link:not(:hover) .sub-tit {color: #ffffff99;}
#main .research-wrap:hover .section-link:not(:hover) .cont-more i {background-color: #ffffff22; border-color: #ffffff44; color: #ffffff44;}

@media (max-width: 1600px) {
  #main .section-research .cont-more {display: flex;}
}
@media (max-width: 1180px) {
  #main .research-section .section-link .tit {font-size: 32px;}
  #main .research-section .section-link .sub-tit {font-size: 22px;}
}
@media (max-width: 1024px) {
  #main .section-research .research-wrap {flex-direction: column; height: auto;}
  #main .research-section .section-link {flex-direction: row; justify-content: space-between;}
  #main .research-section .section-link .tit {font-size: 24px;}
  #main .research-section .section-link .tit br {display: none;}
  #main .research-section .section-link .sub-tit {display: none;}

  #main .research-section .section-link {padding: 30px;}
  #main .section-research .research-wrap .research-section::before {top: auto; bottom: 0; height: 1px; width: 100%;}
}
@media (max-width: 500px) {
  #main .research-section .section-link .tit {font-size: 20px; text-align: left;}
  #main .research-section .section-link .tit br {display: block;}

}





/* ----- 주요서비스 사용x ----- */
#main .section-link {background-color: #f9f9f9; border-bottom: none;}
/* #main .main-section .section-title::after{content:''; display: block; width: 50px; height:1px; background-color: #333; position: absolute; right: -40px;} */

.main-link-box {display:flex; justify-content: space-between; flex-wrap:wrap; gap: 80px;}
.main-link-box > ul {display:flex; justify-content: space-between; flex-wrap: wrap; z-index:0; width: calc(100% - 380px);}
.main-link-box > ul li a {display: flex; align-items: center; justify-content: center; flex-direction: column; transition: 0.3s ease-in-out;}
.main-link-box > ul li a:hover {transform: translateY(-10px);}
.main-link-box > ul li a p {width: 135px; height: 135px; background-color:#fff !important; border-radius:50%; margin-bottom: 30px;}
.main-link-box > ul li a span {display: flex; align-items: center; justify-content: center; text-align: center; position: relative; font-size: 20px; font-weight: 600;}
/* .main-link-box > ul li a span::before {content: ''; position: absolute; bottom: 0;left: 50%; width: 100%; height: 2px; background-color: #0c2e86; transform: translateX(-50%);} */
/* .main-link-box > ul li a span::after {content: '\F285'; font-family: 'bootstrap-icons'; font-size: 15px; margin-left: 5px;} */
.main-link-box > ul .link01 a p {background: url(../images/main/ico-service01.png) no-repeat center center/50%; transition: 0.3s ease-in-out;}
.main-link-box > ul .link02 a p {background: url(../images/main/ico-service02.png) no-repeat center center/50%;}
.main-link-box > ul .link03 a p {background: url(../images/main/ico-service03.png) no-repeat center center/50%;}
.main-link-box > ul .link04 a p {background: url(../images/main/ico-service04.png) no-repeat center center/50%;}
.main-link-box > ul .link05 a p {background: url(../images/main/ico-service05.png) no-repeat center center/50%;}
.main-link-box > ul .link06 a p {background: url(../images/main/ico-service06.png) no-repeat center center/50%;}
.main-link-box > ul .link07 a p {background: url(../images/main/ico-service07.png) no-repeat center center/50%;}
.main-link-box > ul .link08 a p {background: url(../images/main/ico-service08.png) no-repeat center center/50%;}

/* main 플로팅메뉴 */
/* #floating {opacity: 0;}
#floating div{display:none}
#header.scroll ~ #floating {opacity: 1;pointer-events: auto;} */





#main .ci_visual01 {
  width: 8.4rem;
  height: 9.9rem;
  background: url(../images/main/ci_visual01.png) no-repeat center center/contain;
}
#main .ci_visual02 {
  width: 9.6rem;
  height: 10.1rem;
  background: url(../images/main/ci_visual02.png) no-repeat center center/contain;
}
#main .ci_visual03 {
  width: 9.2rem;
  height: 9.8rem;
  background: url(../images/main/ci_visual03.png) no-repeat center center/contain;
}
#main .ci_visual04 {
  width: 9.3rem;
  height: 8.8rem;
  background: url(../images/main/ci_visual04.png) no-repeat center center/contain;
}
#main .ci_visual05 {
  width: 8.5rem;
  height: 8.9rem;
  background: url(../images/main/ci_visual05.png) no-repeat center center/contain;
}
#main .visual_area {
  width: 100vw;
  height: 100%;
  max-height: 100%;
  min-height: 100vh;
  overflow: hidden;
}
#main .visual_area:before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 250px;
    background: linear-gradient(to bottom, rgb(29 29 29 / 60%) 0%, rgba(0, 0, 0, 0) 80%);
    pointer-events: none;
    z-index: 20;
}
#main .visual_area .inner {
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 100vh;
  padding-top: 20rem;
  padding-bottom: 12rem;
  position: relative;
}
#main .visual_area .visual_txt {
  color: #fff;
  text-align: center;
  margin-bottom: 9rem;
  word-break: keep-all;
}
#main .visual_area .visual_txt h2 {
  font-size: 4.3rem;
  font-family: "STUNNING";
  text-shadow: 0.4rem 0 0.5rem rgba(64, 64, 64, 0.35);
  margin-bottom: 2.5rem;
}
#main .visual_area .visual_txt p {
  font-size: 2.5rem;
  font-weight: 500;
  text-shadow: 0.4rem 0 0.5rem rgba(64, 64, 64, 0.35);
}
#main .visual_area .visual_slide {
  width: 100%;
  position: relative;
  max-width: 175rem;
}
#main .visual_area .visual_slide .visual_slide_card {
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: 179rem;
  padding: 0 2rem;
  margin: 0 auto;
  height: 42rem;
}
#main .visual_area .visual_slide .visual_slide_card .slick-track {
  padding-top: 9.5rem;
}
#main .visual_area .visual_slide .visual_slide_card .item {
  width: 20%;
  padding: 3.5rem;
  border: 1px solid #fff;
  border-radius: 2rem 6rem 2rem 2rem;
  height: 32.5rem;
  color: #161616;
  margin: 0 2rem;
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(10px);
  position: relative;
  cursor: pointer;
}
#main .visual_area .visual_slide .visual_slide_card .item::before {
  content: "";
  display: none;
  background: url(../images/main/center_card.png) no-repeat center center/contain;
  height: 6.5rem;
  width: 100%;
  position: absolute;
  z-index: 1;
  left: 0;
  top: -5.9rem;
}
#main .visual_area .visual_slide .visual_slide_card .item > a {
  position: absolute;
  width: 5.6rem;
  height: 5.6rem;
  display: none;
  justify-content: center;
  align-items: center;
  right: -0.3rem;
  top: -6.3rem;
  background-color: #de4f70;
  border-radius: 50%;
  z-index: 2;
}
#main .visual_area .visual_slide .visual_slide_card .item > a::after {
  display: inline-block;
  font-family: "Font Awesome 6 Free";
  content: "\f061";
  font-weight: 400;
  color: #fff;
  font-size: 2rem;
  transform: rotate(-45deg);
}
#main .visual_area .visual_slide .visual_slide_card .item i {
  display: block;
  margin: 0 auto 2rem auto;
}
#main .visual_area .visual_slide .visual_slide_card .item span {
  display: block;
  margin-bottom: 1.5rem;
  text-align: center;
  font-weight: bold;
  font-size: 2.9rem;
}
#main .visual_area .visual_slide .visual_slide_card .item dl {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 2.3rem;
  font-weight: 500;
  margin-top: 1rem;
}
#main .visual_area .visual_slide .visual_slide_card .item dl dt {
  white-space: nowrap;
}
#main .visual_area .visual_slide .visual_slide_card .item dl dd {
  white-space: nowrap;
  font-size: 2rem;
}
#main .visual_area .visual_slide .visual_slide_card .item dl dd strong {
  white-space: nowrap;
  color: #e33c63;
  font-size: 3rem;
  font-weight: bold;
  margin-right: 0.5rem;
}
#main .visual_area .visual_slide .visual_slide_card .item.slick-center {
  background-color: #203a91;
  border: none;
  border-radius: 0 3rem 2rem 2rem;
  color: #fff;
  padding-top: 0.5rem;
  box-shadow: 0.4rem 0 0.7rem rgba(91, 108, 165, 0.5);
  animation: visual-card-ani 0.55s ease forwards;
}
#main .visual_area .visual_slide .visual_slide_card .item.slick-center > a {
  display: flex;
}
#main .visual_area .visual_slide .visual_slide_card .item.slick-center::before {
  display: block;
  opacity: 1;
}
#main .visual_area .visual_slide .visual_slide_card .item.slick-center span {
  font-size: 3rem;
  margin-bottom: 4rem;
}
#main .visual_area .visual_slide .visual_slide_card .item.slick-center dl dd strong {
  color: #fff;
}
#main .visual_area .visual_slide .visual_slide_ctrl {
  position: absolute;
  right: 8rem;
  top: 0;
  display: flex;
  align-items: center;
  width: auto;
  z-index: 10;
}
#main .visual_area .visual_slide .visual_slide_ctrl li a {
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  border-bottom: 1px solid #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}
#main .visual_area .visual_slide .visual_slide_ctrl li a i {
  color: #fff;
  opacity: 1;
  filter: brightness(0) invert(1);
}
#main .visual_area .visual_slide .visual_slide_ctrl li:first-child a, #main .visual_area .visual_slide .visual_slide_ctrl li:last-child a {
  border-top: 1px solid #fff;
  border-bottom: none;
  transform: translateY(2px);
}
#main .visual_area .visual_scroll {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-flow: column;
  align-items: center;
}
#main .visual_area .visual_scroll span {
  font-size: 1.8rem;
  font-weight: 600;
  color: #fff;
  display: block;
  margin-bottom: 1.5rem;
}
#main .visual_area .visual_scroll .line {
  width: 2.1px;
  height: 4rem;
  background-color: rgba(255, 255, 255, 0.3);
  overflow: hidden;
  position: relative;
}
#main .visual_area .visual_scroll .line::before {
  content: '';
  width: 100%;
  height: 10px;
  background-color: #fff;
  position: absolute;
  top:0;
  left: 0;
  animation: lineSlide 2s ease-in-out infinite;
}
/* #main .visual_area .visual_scroll .line div {
  width: 2px;
  height: 100%;
  max-height: 0;
  background: white;
  animation: scrollLine 1.5s infinite;
} */
#main .tbanner_area {
  padding: 40px 20px;
  background-color: #fff;
}
#main .tbanner_area .inner {
  /* max-width: 157rem; */
  max-width: 1700px;
  width: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
#main .tbanner_area .tbanner_slide_btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 25rem;
}
#main .tbanner_area .tbanner_slide_btn p {
  font-size: 18px;
  color: #161616;
  font-family: "STUNNING";
}
#main .tbanner_area .tbanner_slide_btn div {
  display: flex;
  align-items: center;
}
#main .tbanner_area .tbanner_slide_btn div a {
  width: 3rem;
  height: 3rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
#main .tbanner_area .tbanner_slide {
  width: calc(100% - 25rem);
}
#main .tbanner_area .tbanner_slide li {
  margin: 0 3rem;
}
#main .tbanner_area .tbanner_slide li a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
#main .tbanner_area .tbanner_slide li a img {
  display: block;
  width: 100%;
  max-width: 160px;
  object-fit: contain;
}
#main .tbanner_area .tbanner_slide .slick-track {height: 60px;}

#main {
  /* background: linear-gradient(to bottom, #f0f5fb, #f7fafd); */
}

/* #main .ci_support01 {
  background: url(../images/main/ci_support01.png) no-repeat center center/100%;
}
#main .ci_support02 {
  background: url(../images/main/ci_support02.png) no-repeat center center/100%;
}
#main .ci_support03 {
  background: url(../images/main/ci_support03.png) no-repeat center center/100%;
}
#main .ci_support04 {
  background: url(../images/main/ci_s
  upport04.png) no-repeat center center/100%;
}
#main .ci_arrow {
  background: url(../images/common/ci_arrow.png) no-repeat center center/100%;
}
#main .ci_angle {
  background: url(../images/common/ci_angle.png) no-repeat center center/100%;
}
#main .ci_cube {
  background: url(../images/common/ci_cube.png) no-repeat center center/100%;
}
#main .ci_book {
  background: url(../images/common/ci_book.png) no-repeat center center/100%;
} */
#main .support_area {
  /* padding: 8.5rem 2.5rem; */
  padding-bottom: 0;
  padding-top: 50px;
  /* min-height: 51rem; */
  min-height: 42rem;
  background-color: #e1eefa;
}
#main .support_area .inner {
  position: relative;
  /* max-width: 153rem; */
  width: 100%;
  margin: 0 auto;
}
#main .support_area .inner .support_title {
  /* background-color: var(--main-color); */
  color: #fff;
  width: 47rem;
  height: 32rem;
  border-radius: 5rem;
  padding-left: 5rem;
  display: flex;
  justify-content: center;
  flex-flow: column;
  position: absolute;
  left: 0;
  top: 0;
}
/* #main .support_area .inner .support_title h2 {
  margin-bottom: 2.5rem;
  font-size: 3.2rem;
  font-family: "STUNNING";
  font-weight: bold;
} */
#main .support_area .inner .support_title h2 span {
  font-family: "STUNNING";
  font-weight: bold;
}
#main .support_area .inner .support_title p {
  font-size: 18px;
  opacity: 0.7;
}
#main .support_area .inner .support_title span {
  display: block;
  margin-top: 0.5rem;
}
#main .support_area .inner .support_cont {
  background-color: #e1eefa;
  position: absolute;
  width: calc(100% - 36rem);
  height: 32rem;
  left: 36.5rem;
  border-radius: 6rem;
}
#main .support_area .inner .support_cont > ul {
  height: 100%;
  position: relative;
  display: flex;
  flex-flow: column;
  justify-content: center;
}
#main .support_area .inner .support_cont > ul > li {
  display: flex;
  align-items: center;
  width: 100%;
}
#main .support_area .inner .support_cont > ul > li > a {
  padding-left: 4.5rem;
  width: 20rem;
  color: #333333;
  font-size: 2rem;
  font-weight: 500;
  display: flex;
  align-items: center;
  margin: 1.5rem 0;
}
#main .support_area .inner .support_cont > ul > li > a::before {
  content: "";
  display: block;
  margin-right: 0.8rem;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background-color: #333333;
}
#main .support_area .inner .support_cont > ul > li .support_slide {
  width: calc(100% - 10rem);
  display: none;
  justify-content: space-between;
  align-items: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 5rem;
}
#main .support_area .inner .support_cont > ul > li .support_slide .slick-list {
  padding: 3rem 0;
}
#main .support_area .inner .support_cont > ul > li .support_slide .item.slick-active a {
  box-shadow: 0 0 0.6rem 0.2rem rgba(0, 16, 53, 0.1);
}
#main .support_area .inner .support_cont > ul > li .support_slide .item a {
  border-radius: 3rem;
  /* width: 20rem; */
  height: 22rem;
  margin: 15px;
  background-color: #fff;
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
}
#main .support_area .inner .support_cont > ul > li .support_slide .item a .img-wrap{
  width: 7.5rem;
  height: 7.5rem;
}
#main .support_area .inner .support_cont > ul > li .support_slide .item a .img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
#main .support_area .inner .support_cont > ul > li .support_slide .item a span {
  margin-top: 3.3rem;
  font-weight: 600;
  color: #000;
  font-size: 1.9rem;
  text-align: center;
  display: block;
  word-break: keep-all;
}
#main .support_area .inner .support_cont > ul > li .support_slide .item:hover {
  transform: translateY(-1rem);
  transition: 0.35s ease;
}
#main .support_area .inner .support_cont > ul > li .support_slide button {
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  border: 1px solid #cccccc;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 100;
  /* display: none; */
}
#main .support_area .inner .support_cont > ul > li .support_slide button::before {
  content: "";
  display: block;
  width: 1rem;
  height: 1.6rem;
  background: url(../images/common/ci_angle.png) no-repeat center center/contain;
}
#main .support_area .inner .support_cont > ul > li .support_slide .slick-prev {
  left: -1.5rem;
}
#main .support_area .inner .support_cont > ul > li .support_slide .slick-prev::before {
  transform: rotate(180deg);
}
#main .support_area .inner .support_cont > ul > li .support_slide .slick-next {
  right: -1.5rem;
}
#main .support_area .inner .support_cont > ul > li.active > a {
  background-color: #2d3f65;
  height: 6rem;
  border-radius: 0 3rem 3rem 0;
  color: #fff;
  font-weight: bold;
  position: relative;
}
#main .support_area .inner .support_cont > ul > li.active > a::before {
  display: none;
}
#main .support_area .inner .support_cont > ul > li.active > a::after {
  content: "";
  width: 6rem;
  height: 6rem;
  border-radius: 50%;
  position: absolute;
  left: -3rem;
  top: 0;
  background: url(../images/main/check_circle.png) no-repeat center center/contain;
}
#main .support_area .inner .support_cont > ul > li.active .support_slide {
  display: flex;
}
#main .not_cal_wrap {
  position: relative;
}
#main .notice_area {
  /* padding-top: 10rem; */
  position: relative;
}
/* #main .notice_area::before {
    content: "";
    width: 68vw;
    background-color: #fff;
    border-radius: 0 40rem 5rem 0;
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    max-width: 175rem;
    height: 70rem;
} */
/* #main .notice_area::after {
    content: "";
    width: 70vw;
    background-color: rgb(247, 250, 253);
    position: absolute;
    left: 0;
    bottom: -6rem;
    display: block;
    max-width: 175rem;
    height: 15rem;
    filter: blur(10px);
} */
#main .notice_area .inner {
  /* max-width: 156rem; */
  padding: 0 100px;
  width: 100%;
  margin: 0 auto;
}
#main .notice_area .inner .notice {
  position: relative;
  z-index: 10;
  max-width: 118rem;
}
#main .notice_area .inner .notice h2 {
  font-size: 4.3rem;
  font-family: "STUNNING";
  font-weight: bold;
  margin-bottom: 6rem;
  color: #000;
}
#main .notice_area .inner .notice .notice_tab {
  margin-bottom: 4rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 70rem;
}
#main .notice_area .inner .notice .notice_tab ul {
  width: 59.6rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#main .notice_area .inner .notice .notice_tab ul li a {
  font-size: 23px;
  font-weight: bold;
  color: #777983;
  position: relative;
}
#main .notice_area .inner .notice .notice_tab ul li a::before {
  content: "";
  position: absolute;
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 50%;
  background-color: var(--main-color);
  top: -1rem;
  left: 50%;
  transform: translateX(-50%);
  display: none;
}
#main .notice_area .inner .notice .notice_tab ul li:focus a, #main .notice_area .inner .notice .notice_tab ul li:hover a, #main .notice_area .inner .notice .notice_tab ul li.active a {
  color: #000;
}
#main .notice_area .inner .notice .notice_tab ul li:focus a::before, #main .notice_area .inner .notice .notice_tab ul li:hover a::before, #main .notice_area .inner .notice .notice_tab ul li.active a::before {
  display: block;
}
#main .notice_area .inner .notice .notice_tab > a {
  width: 5rem;
  height: 5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  border: 1px solid #d5d7dd;
  background-color: #fff;
}
#main .notice_area .inner .notice .notice_tab > a::before {
  content: "";
  display: block;
  width: 1.2rem;
  height: 1.2rem;
  background: url(../images/common/ci_plus.png) no-repeat center center/contain;
  transition: transform 0.3s ease-in-out;
}
#main .notice_area .inner .notice .notice_tab > a:hover::before {
  transform: rotate(180deg);
}
#main .notice_area .inner .notice .notice_list {
  display: none;
  width: 100%;
  margin-bottom: 20rem;
}
#main .notice_area .inner .notice .notice_list.active {
  display: flex;
}
#main .notice_area .inner .notice .notice_list li {
  position: relative;
  margin-right: 3rem;
  max-width: 36rem;
  height: 36rem;
}
#main .notice_area .inner .notice .notice_list li:nth-child(n+4) {
  display: none;
}
#main .notice_area .inner .notice .notice_list li::after {
  content: "N";
  display: none;
  width: 4.65rem;
  height: 4.65rem;
  /* background: url(../images/main/ci_new.png) no-repeat center center/contain; */
  position: absolute;
  top: -1px;
  right: 1.5rem;
  box-shadow: 1rem 0 2rem rgba(0, 16, 53, 0.1);
  background-color: #de4f70;
  border-radius: 0 0 10px 10px;
  color: #fff;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
}
#main .notice_area .inner .notice .notice_list li.new::after {
  display: flex;
  align-items: center;
  justify-content: center;
}
#main .notice_area .inner .notice .notice_list li > span {
  width: 12rem;
  height: 5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  font-size: 1.9rem;
  border-radius: 3rem;
  position: absolute;
  left: 0;
  top: 0;
  border: 1px solid transparent;
  background-color: #fff;
  transition: 0.25s all;
}
#main .notice_area .inner .notice .notice_list li .flot {
  position: absolute;
  top: 10rem;
  left: 0;
  padding: 0 2.5rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 230px;
}
#main .notice_area .inner .notice .notice_list li .flot strong {
  font-size: 24px;
  /* margin-bottom: 4.4rem; */
  display: block;
  display: -webkit-box;
  white-space: normal;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  /* word-break: keep-all; */
}
#main .notice_area .inner .notice .notice_list li .flot > span {
  line-height: 1.5;
  font-size: 19px;
  display: -webkit-box;
  white-space: normal;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  /* margin-bottom: 2.5rem; */
}
#main .notice_area .inner .notice .notice_list li .flot > div {
  color: #434343;
  font-size: 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}
#main .notice_area .inner .notice .notice_list li .flot > div small {
  font-weight: 500;
  font-size: 16px;
}
#main .notice_area .inner .notice .notice_list li .flot > div .more_btn {
  display: flex;
  align-items: center;
}
#main .notice_area .inner .notice .notice_list li .flot > div .more_btn span {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  overflow: hidden;
  margin-left: 0.7rem;
  background-color: #f3f3f3;
  display: flex;
  align-items: center;
  justify-content: center;
}
#main .notice_area .inner .notice .notice_list li .flot > div .more_btn span i {
  font-size: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* #main .notice_area .inner .notice .notice_list li .flot > div .more_btn:hover {
  font-weight: bold;
} */
#main .notice_area .inner .notice .notice_list li .flot > div .more_btn:hover span i {
  /* opacity: 1; */
  /* filter: brightness(0) invert(1); */
  /* animation: arrowMove 0.7s 0.15s ease forwards; */
}
#main .notice_area .inner .notice .notice_list li svg {
  fill: #fff;
}
#main .notice_area .inner .notice .notice_list li.green > span {
  border-color: #19a978;
  color: #19a978;
}
/* #main .notice_area .inner .notice .notice_list li.green .flot > div .more_btn:hover span {
  background-color: #19a978;
} */
#main .notice_area .inner .notice .notice_list li.red > span {
  border-color: #dd496c;
  color: #dd496c;
}
/* #main .notice_area .inner .notice .notice_list li.red .flot > div .more_btn:hover span {
  background-color: #dd496c;
} */
#main .notice_area .inner .notice .notice_list li.blue > span {
  border-color: #40b0ef;
  color: #40b0ef;
}
/* #main .notice_area .inner .notice .notice_list li.blue .flot > div .more_btn:hover span {
  background-color: #40b0ef;
} */
#main .notice_area .inner .notice .notice_list li.yellow > span {
  border-color: #ec9f4a;
  color: #ec9f4a;
}
/* #main .notice_area .inner .notice .notice_list li.yellow .flot > div .more_btn:hover span {
  background-color: #ec9f4a;
} */
#main .notice_area .inner .notice .notice_list li.gray > span {
  border-color: #a6b8c4;
  color: #a6b8c4;
}
/* #main .notice_area .inner .notice .notice_list li.gray .flot > div .more_btn:hover span {
  background-color: #a6b8c4;
} */
#main .notice_area .inner .notice .notice_list li:hover > span {
  color: #fff !important;
}
#main .notice_area .inner .notice .notice_list li:hover svg {
  stroke-width: 1;
}
#main .notice_area .inner .notice .notice_list li:hover.green > span {
  background-color: #19a978;
}
#main .notice_area .inner .notice .notice_list li:hover.green svg {
  stroke: #19a978;
}
#main .notice_area .inner .notice .notice_list li:hover.red > span {
  background-color: #dd496c;
}
#main .notice_area .inner .notice .notice_list li:hover.red svg {
  stroke: #dd496c;
}
#main .notice_area .inner .notice .notice_list li:hover.blue > span {
  background-color: #40b0ef;
}
#main .notice_area .inner .notice .notice_list li:hover.blue svg {
  stroke: #40b0ef;
}
#main .notice_area .inner .notice .notice_list li:hover.yellow > span {
  background-color: #ec9f4a;
}
#main .notice_area .inner .notice .notice_list li:hover.yellow svg {
  stroke: #ec9f4a;
}
#main .notice_area .inner .notice .notice_list li:hover.gray > span {
  background-color: #a6b8c4;
}
#main .notice_area .inner .notice .notice_list li:hover.gray svg {
  stroke: #a6b8c4;
}

#main .cal_mag_wrap {
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
}
#main .cal_mag_wrap .rise_txt {
	font-size: 13.7rem;
	color: rgba(127, 149, 170, 0.35);
	opacity: 0.6;
	position: absolute;
	z-index: 101;
	top: 37rem;
	right: -27rem;
	transform: rotate(90deg);
	font-weight: 800;
	line-height: 1;
  pointer-events: none;
}
/*
#main .calendar_area {
  margin-bottom: 7.5rem;
}*/
#main .calendar_area .inner {
  max-width: 156rem;
  padding: 0 2.5rem;
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-flow: column;
  align-items: flex-end;
}
#main .calendar_area .inner .calendar {
  width: 100%;
  max-width: 35rem;
  position: relative;
}
#main .calendar_area .inner .calendar h2 {
  font-size: 3.3rem;
  color: #030303;
  font-weight: bold;
  padding-top: 1.5rem;
  position: relative;
  display: inline-block;
}
#main .calendar_area .inner .calendar h2::after {
  content: "";
  width: 1.2rem;
  height: 1.2rem;
  background-color: var(--main-color);
  border-radius: 50%;
  right: -1.4rem;
  top: 0rem;
  position: absolute;
  display: none;
}
#main .calendar_area .inner .calendar .calendar_tab {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 3px solid #d6d7d7;
  margin: 5rem 0 2rem;
  word-break: keep-all;
}
#main .calendar_area .inner .calendar .calendar_tab li {
  width: 25%;
  display: flex;
  justify-content: center;
  position: relative;
}
#main .calendar_area .inner .calendar .calendar_tab li a {
  padding-bottom: 2rem;
  width: 100%;
  font-size: 19px;
  display: block;
  text-align: center;
  color: #3f3f3f;
  font-weight: bold;
  position: relative;
}
#main .calendar_area .inner .calendar .calendar_tab li a::before {
    content: "";
    position: absolute;
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    background-color: var(--main-color);
    top: -1rem;
    left: 50%;
    transform: translateX(-50%);
    display: none;
}
#main .calendar_area .inner .calendar .calendar_tab li.active a::before,
#main .calendar_area .inner .calendar .calendar_tab li.active a::before,
#main .calendar_area .inner .calendar .calendar_tab li.active a::before {
    display: block;
}
#main .calendar_area .inner .calendar .calendar_tab li.active::before {
  content: "";
  height: 4px;
  width: 100%;
  background-color: var(--main-color);
  position: absolute;
  bottom: -3px;
  left: 0;
  border-radius: 2px;
}
#main .calendar_area .inner .calendar .calendar_slide {
  position: relative;
  display: none;
}
#main .calendar_area .inner .calendar .calendar_slide.active {
  display: block;
}
#main .calendar_area .inner .calendar .calendar_slide::before {
  content: "";
  width: 1px;
  height: 40rem;
  background-color: #d5d7dd;
  position: absolute;
  left: 5rem;
  top: 2rem;
  z-index: 0;
}
#main .calendar_area .inner .calendar .calendar_slide li {
  margin-top: 1.8rem;
  position: relative;
  z-index: 1;
}
#main .calendar_area .inner .calendar .calendar_slide li a {
  display: flex;
  align-items: center;
  border-radius: 4rem;
  border: 1px solid #d3ddea;
  padding: 1.1rem 1.7rem;
  background-color: #fff;
}
#main .calendar_area .inner .calendar .calendar_slide li a span {
  width: 7rem;
  height: 7rem;
  border-radius: 3rem;
  border: 1px solid #d3ddea;
  margin-right: 1.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  color: #282828;
  font-size: 1.8rem;
}
#main .calendar_area .inner .calendar .calendar_slide li a dl {
  width: calc(100% - 9rem);
  color: #282828;
}
#main .calendar_area .inner .calendar .calendar_slide li a dl dt {
  font-weight: bold;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 18px;
}
#main .calendar_area .inner .calendar .calendar_slide li a dl dd {
  margin-bottom: 0.6rem;
  display: block;
  font-size: 18px;
}
#main .calendar_area .inner .calendar .calendar_slide li.today a span {
  border-color: #de4f70;
  background-color: #de4f70;
  color: #fff;
}
#main .calendar_area .inner .calendar .calendar_slide.blue li.today a span {
  background-color: #40b0ef;
  border-color: #40b0ef;
}
#main .calendar_area .inner .calendar .calendar_slide.green li.today a span {
  background-color: #19a978;
  border-color: #19a978;
}
#main .calendar_area .inner .calendar .calendar_slide.yellow li.today a span {
  background-color: #e8c00c;
  border-color: #e8c00c;
}
#main .calendar_area .inner .calendar .calendar_slide_ctrl {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 4rem;
}
#main .calendar_area .inner .calendar .calendar_slide_ctrl a {
  width: 4.6rem;
  height: 4.6rem;
  background-color: #e6e7e7;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
}
#main .calendar_area .inner .calendar .calendar_slide_ctrl a.calendar_slide_up i {
  transform: scale(0.8) rotate(-90deg);
}
#main .calendar_area .inner .calendar .calendar_slide_ctrl a.calendar_slide_dw i {
  transform: scale(0.8) rotate(90deg);
}
#main .calendar_area .inner .calendar .calendar_slide_ctrl a.slick-disabled {
  cursor: default;
}
#main .calendar_area .inner .calendar .calendar_slide_ctrl a.slick-disabled i {
  opacity: 0.4;
}
#main .calendar_area .inner .calendar .calendar_slide_ctrl ul {
  display: flex;
  align-items: center;
  margin: 0 1.5rem;
}
#main .calendar_area .inner .calendar .calendar_slide_ctrl ul li {
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 50%;
  background-color: #e0e1e2;
  margin: 0 3px;
  cursor: pointer;
}
#main .calendar_area .inner .calendar .calendar_slide_ctrl ul li.slick-active {
  background-color: #707070;
}
#main .magazine_area {
  width: 100%;
}
#main .magazine_area .inner {
  max-width: 156rem;
  padding: 0 2.5rem;
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-flow: column;
  align-items: flex-end;
}
#main .magazine_area .inner .magazine {
  position: relative;
  width: 37rem;
}
#main .magazine_area .inner .magazine::before {
  content: "";
  display: block;
  border-radius: 17rem 0 0 2rem;
  background-color: #3958b8;
  width: 50vw;
  height: 42.5rem;
  left: -12.5rem;
  position: absolute;
}
#main .magazine_area .inner .magazine .magazine_box {
  transform: translateY(6.5rem);
  margin-top: 1rem;
  position: relative;
  z-index: 1;
  padding-right: 2.5rem;
}
#main .magazine_area .inner .magazine .magazine_box h2 {
  position: relative;
  z-index: 1;
  padding-left: 2rem;
  font-size: 3.2rem;
  margin-bottom: 2.5rem;
  font-family: "STUNNING";
  color: #fff;
  font-weight: bold;
  line-height: 1;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card {
  padding: 2rem 2rem 4.5rem 2rem;
  background-color: #fff;
  border-radius: 2.5rem;
  position: relative;
  border-radius: 2.5rem;
  box-shadow: 1rem 0 3rem rgba(0, 16, 53, 0.16);
  display: flex;
  justify-content: space-between;
  height: 100%;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card::before {
  content: "";
  display: block;
  border-radius: 0 2rem 0 0;
  width: 12rem;
  height: calc(100% + 5rem);
  border: 1px solid #ffffff;
  opacity: 0.25;
  position: absolute;
  right: -2.5rem;
  top: -3.5rem;
  z-index: -1;
  border-left: none;
  border-bottom: none;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card .tit {
  padding-top: 3.5rem;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card .tit > span {
  font-family: "STUNNING";
  font-weight: bold;
  color: #2a2a2a;
  display: block;
  margin-bottom: 1.5rem;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card .tit > strong {
  font-family: "STUNNING";
  font-size: 3.2rem;
  color: #1b224e;
  margin-bottom: 4.5rem;
  display: block;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card .tit > strong small {
  font-weight: bold;
  font-size: 2.4rem;
  display: block;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card .tit p {
  color: #2b6cbf;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card .tit p span {
  font-size: 1.7rem;
  position: relative;
  display: inline-block;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card .tit p span::after {
  content: "";
  display: block;
  position: absolute;
  right: -0.9rem;
  top: -0.5rem;
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 50%;
  background-color: #de4f70;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card .tit p strong {
  font-size: 2.7rem;
  display: block;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card .img {
  border-radius: 1.6rem;
  overflow: hidden;
  box-shadow: 1rem 0 1.6rem rgba(58, 58, 58, 0.315);
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card .img img {
  object-fit: cover;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card ul {
  height: 7rem;
  border-radius: 0 6rem 0 0;
  background-color: #f0f0f0;
  position: absolute;
  bottom: 0;
  left: 0;
  display: flex;
  padding: 0 3rem;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card ul li {
  display: flex;
  align-items: center;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card ul li a {
  display: flex;
  align-items: center;
  color: #101a57;
  font-size: 1.8rem;
  font-weight: 600;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card ul li a i {
  margin-right: 0.8rem;
}
#main .magazine_area .inner .magazine .magazine_box .magazine_card ul li:first-child:after {
  content: "";
  display: block;
  background-color: #8c8fa4;
  width: 2px;
  height: 1.8rem;
  margin: 0 1.2rem;
}
#main .media_area {
  position: relative;
  margin-bottom: 7rem;
}
#main .media_area .inner {
  max-width: 156rem;
  padding: 0 2.5rem;
  width: 100%;
  margin: 0 auto;
}
#main .media_area .inner .media_title {
  margin-bottom: 5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 63.5%;
}
#main .media_area .inner .media_title h2 {
  font-size: 4.3rem;
  font-weight: bold;
  font-family: "STUNNING";
  color: #000;
  word-break: keep-all;
}
#main .media_area .inner .media_title .media_slide_ctrl {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
#main .media_area .inner .media_title .media_slide_ctrl li {
  margin-left: 1rem;
}
#main .media_area .inner .media_title .media_slide_ctrl li a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  background-color: #fff;
  box-shadow: 1rem 0 6rem rgba(0, 16, 53, 0.1);
}
#main .media_area .inner .media_title .media_slide_ctrl li a.media_slide_next {
  transform: rotate(180deg);
}
#main .media_area .inner .media_title .media_slide_ctrl li:last-child {
  margin-left: 2.5rem;
}
#main .media_area .inner .media_title .media_slide_ctrl li:last-child a {
  border: 1px solid #d5d7dd;
  box-shadow: none;
  background-color: transparent;
  display: flex;
  justify-content: center;
  align-items: center;
}
#main .media_area .inner .media_title .media_slide_ctrl li:last-child a::before {
  content: "";
  display: block;
  width: 1.2rem;
  height: 1.2rem;
  background: url(../images/common/ci_plus.png) no-repeat center center/contain;
  transition: transform 0.3s ease-in-out;
}
#main .media_area .inner .media_title .media_slide_ctrl li:last-child a:hover::before {
  transform: rotate(180deg);
}
  #main .media_area .inner .media_slide {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  width: 100%;
}
#main .media_area .inner .media_slide .media_slide_for {
  max-width: 72rem;
  width: 50%;
  margin-bottom: 7rem;
}
#main .media_area .inner .media_slide .media_slide_for .item {
  border-radius: 4rem 4rem 4rem 0;
  overflow: hidden;
  position: relative;
}
#main .media_area .inner .media_slide .media_slide_for .item .img img {
  height: 49rem;
  display: block;
  object-fit: cover;
  object-position: center;
  width: 100%;
}
#main .media_area .inner .media_slide .media_slide_for .item dl {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
}
#main .media_area .inner .media_slide .media_slide_for .item dl dt {
  height: 7rem;
  background-color: #f7fafd;
  border-radius: 0 2.5rem 0 0;
  position: relative;
  max-width: 24.5rem;
  width: 100%;
  font-size: 2rem;
  color: #333333;
  padding: 0 1.2rem;
  display: flex;
  align-items: center;
}
#main .media_area .inner .media_slide .media_slide_for .item dl dt::after {
  content: "";
  display: block;
  width: 3rem;
  height: 3rem;
  background: url(../images/main/media_tail.png) no-repeat center center/contain;
  position: absolute;
  right: -3rem;
  bottom: 0;
}
#main .media_area .inner .media_slide .media_slide_for .item dl dt::before {
  content: "";
  display: block;
  width: 2.5rem;
  height: 2.5rem;
  background: url(../images/main/media_tail.png) no-repeat center center/contain;
  position: absolute;
  left: -0.5px;
  top: -2.5rem;
}
#main .media_area .inner .media_slide .media_slide_for .item dl dt span {
  background-color: #fdd9da;
  font-weight: 500;
  font-size: 2rem;
  border-radius: 3rem;
  padding: 1rem 2rem;
  display: block;
  margin-right: 1rem;
}
#main .media_area .inner .media_slide .media_slide_for .item dl dd {
  height: 7rem;
  align-items: center;
  padding: 0 1.2rem;
  width: 100%;
  max-width: 46.5rem;
  background-color: #f7fafd;
  border-radius: 0 2.5rem 0 0;
  position: relative;
  display: flex;
  align-items: center;
}
#main .media_area .inner .media_slide .media_slide_for .item dl dd::after {
  content: "";
  display: block;
  width: 3rem;
  height: 3rem;
  background: url(../images/main/media_tail.png) no-repeat center center/contain;
  position: absolute;
  right: -3rem;
  bottom: 0;
}
#main .media_area .inner .media_slide .media_slide_for .item dl dd strong {
  font-size: 2.9rem;
  font-weight: bold;
  color: #1a1a1a;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#main .media_area .inner .media_slide .media_slide_for .item.video .img::before {
  content: "";
  display: block;
  width: 10rem;
  height: 10rem;
  background: url(../images/common/video.png) no-repeat center center/contain;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
#main .media_area .inner .media_slide .media_slide_nav {
  max-width: 76.5rem;
  width: 50%;
}
#main .media_area .inner .media_slide .media_slide_nav .item {
  width: 24rem;
  margin-left: 2rem;
}
#main .media_area .inner .media_slide .media_slide_nav .item a {
  width: 100%;
  height: 18rem;
  border-radius: 4rem;
  display: block;
  position: relative;
  overflow: hidden;
  margin-bottom: 2.5rem;
}
#main .media_area .inner .media_slide .media_slide_nav .item a img {
  display: block;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
#main .media_area .inner .media_slide .media_slide_nav .item span {
  text-align: center;
  font-size: 1.9rem;
  color: #333333;
  font-weight: 500;
  word-break: keep-all;
  display: -webkit-box;
  white-space: normal;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
#main .media_area .inner .media_slide .media_slide_nav .item.video a::before {
  content: "";
  display: block;
  width: 5rem;
  height: 5rem;
  background: url(../images/common/video.png) no-repeat center center/contain;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

@media (max-width: 1750px) {
  #main .visual_area .visual_slide .visual_slide_card {
    max-width: 144rem;
    padding: 0;
  }
  #main .visual_area .visual_slide .visual_slide_card .item {
    padding: 2.5rem;
    margin: 0 1.5rem;
    height: auto;
  }
  #main .visual_area .visual_slide .visual_slide_card .item > a {
    width: 4.6rem;
    height: 4.6rem;
    top: -5.2rem;
    right: 0;
  }
  #main .visual_area .visual_slide .visual_slide_card .item::before {
    height: 7.4rem;
    top: -5.75rem;
  }
  #main .visual_area .visual_slide .visual_slide_card .item span {
    font-size: 2.6rem;
  }
  #main .visual_area .visual_slide .visual_slide_card .item i {
    transform: scale(0.8);
  }
  #main .visual_area .visual_slide .visual_slide_card .item dl {
    font-size: 2rem;
  }
  #main .visual_area .visual_slide .visual_slide_card .item dl dd strong {
    font-size: 2.8rem;
  }
}
@media (max-width: 1580px) {
  #main .notice_area .inner .notice .notice_list li {max-width: 32rem; height: 32rem;}
  #main .notice_area .inner .notice .notice_list li > span {width: 10.5rem; height: 4.5rem;}
  #main .notice_area .inner .notice .notice_list li .flot {margin-top: -25px; padding: 0 2rem;}
}
@media (max-width: 1440px) {
  #main .notice_area::before {
    border-radius: 0 40rem 0rem 0;
    height: 55rem;
  }
  #main .notice_area .inner {
    padding: 0 2.5rem;
  }
  #main .notice_area .inner .notice {
    max-width: calc(100% - 35rem);
  }
  #main .notice_area .inner .notice h2 {
    margin-bottom: 4rem;
    font-size: 3.6rem;
  }
  #main .notice_area .inner .notice .notice_tab {
    margin-bottom: 4rem;
  }
  #main .notice_area .inner .notice .notice_list li {
    width: 33.3333333333%;
    background-color: #fff;
    border-radius: 2rem;
    box-shadow: 1rem 0 2.5rem rgba(0, 16, 53, 0.1);
    padding: 1.8rem;
    margin-right: 2rem;
    height: auto;
  }
  #main .notice_area .inner .notice .notice_list li::after {
    width: 4rem;
    height: 4rem;
    font-size: 18px;
    border-radius: 0 0 7px 7px;
  }
  #main .notice_area .inner .notice .notice_list li > span {
    position: relative;
    width: 11rem;
    height: 4rem;
    font-size: 1.8rem;
    margin-bottom: 2rem;
  }
  #main .notice_area .inner .notice .notice_list li .flot {
    position: relative;
    padding: 0;
    top: 0;
    min-height: 200px;
    margin-top: 0;
  }
  #main .notice_area .inner .notice .notice_list li .flot strong {
    font-size: 22px;
    /* margin-bottom: 3rem; */
  }
  #main .notice_area .inner .notice .notice_list li .flot > span {
    font-size: 17px;
    /* margin-bottom: 2rem; */
  }
  #main .notice_area .inner .notice .notice_list li svg {
    display: none;
  }

  body.dark #main .notice_area .inner .notice .notice_list li {
    background-color: #585858;
  }

  #main .media_area {
    margin-bottom: 20rem;
  }
  #main .media_area .inner .media_title {
    margin-bottom: 2rem;
    padding: 0 1rem;
    width: fit-content;
  }
  #main .media_area .inner .media_title h2 {
    font-size: 3rem;
    margin-bottom: 0;
    margin-right: 2rem;
  }
  #main .media_area .inner .media_slide {
    width: 100%;
  }
  #main .media_area .inner .media_slide .media_slide_for {
    display: none;
  }
  #main .media_area .inner .media_slide .media_slide_nav {
    max-width: 100%;
    width: calc(100% - 45rem);
  }
  #main .media_area .inner .media_slide .media_slide_nav .item {
    margin-left: 0;
    margin: 0 10px;
  }
  #main .media_area .inner .media_slide .media_slide_nav .item a {
    height: 20rem;
  }
  #main .media_area .inner .media_slide .media_slide_nav .item a img {
    width: 100%;
  }

  #main .magazine_area .inner .magazine {
    padding-right: 5rem;
    width: 32rem;
  }
  #main .magazine_area .inner .magazine::before {
    height: 37rem;
    left: -8.5rem;
  }
  #main .magazine_area .inner .magazine .magazine_box {
    padding: 0;
  }
  #main .magazine_area .inner .magazine .magazine_box .magazine_card::before {
    width: 5rem;
  }
  #main .magazine_area .inner .magazine .magazine_box .magazine_card .img {
    min-height: 0;
    margin-left: 1rem;
  }
  #main .magazine_area .inner .magazine .magazine_box .magazine_card .tit > span {
    margin-bottom: 1rem;
    font-size: 1.4rem;
  }
  #main .magazine_area .inner .magazine .magazine_box .magazine_card .tit > strong {
    font-size: 2.6rem;
    margin-bottom: 1.5rem;
  }
  #main .magazine_area .inner .magazine .magazine_box .magazine_card .tit p span {
    font-size: 1.5rem;
  }
  #main .magazine_area .inner .magazine .magazine_box .magazine_card .tit p strong {
    font-size: 2.2rem;
  }
  #main .magazine_area .inner .magazine .magazine_box .magazine_card ul {
    height: 5rem;
    padding: 0 1.5rem;
    border-radius: 0 3rem 0 0;
  }

  #main .calendar_area .inner .calendar .calendar_slide_ctrl {
    margin-top: 2rem;
  }

  /* #main .visual_area {
    min-height: auto;
  }
  #main .visual_area .inner {
    padding-top: 16rem;
    padding-bottom: 10rem;
    height: auto;
    min-height: 0;
  } */
  #main .visual_area .visual_txt {
    margin-bottom: 4rem;
  }
  #main .visual_area .visual_slide .visual_slide_card .item {
    padding: 3.5rem 1.5rem;
  }
  body.dark #main .visual_area::before {
    height: 100%;
    min-height: 0 !important;
  }

  #main .cal_mag_wrap .rise_txt {
    font-size: 9.7rem;
    top: 35rem;
    right: -20rem;
  }
}
@media (max-width: 1240px) {
  #main .visual_area .visual_slide .visual_slide_card .item > a {
    top: -2rem;
    right: 1rem;
  }
  #main .visual_area .visual_slide .visual_slide_card .item.slick-center {
    border-radius: 0 0 2rem 2rem;
  }
  #main .visual_area .visual_slide .visual_slide_card .item::before {
    height: 3rem;
    top: -2.9rem;
    background-color: #203a91;
    background-image: none;
    border-radius: 2rem 3rem 0 0;
  }
  #main .visual_area .visual_slide .visual_slide_card .item.slick-center span {
    font-size: 2.4rem;
    margin-bottom: 3rem;
  }
  #main .visual_area .visual_slide .visual_slide_card .item i {
    margin: 0 auto 1rem auto;
  }
  #main .visual_area .visual_slide .visual_slide_card .item dl dd strong,
  #main .visual_area .visual_slide .visual_slide_card .item span {
    font-size: 2rem;
  }
  #main .visual_area .visual_slide .visual_slide_card .item dl dd,
  #main .visual_area .visual_slide .visual_slide_card .item dl {
    font-size: 1.8rem;
  }
  #main .visual_area .visual_slide .visual_slide_card .item {
    padding: 2rem 2.5rem;
  }
  #main .support_area {
    padding: 6.5rem 2.5rem 0 2.5rem;
    min-height: 47rem;
  }
  #main .support_area .inner .support_title {
    width: 42rem;
    height: 30rem;
    padding-left: 4rem;
  }
  #main .support_area .inner .support_cont {
    width: calc(100% - 32rem);
    height: 30rem;
    left: 31.5rem;
  }
  #main .support_area .inner .support_cont > ul > li .support_slide .item a i {
    transform: scale(0.8);
  }
  #main .support_area .inner .support_cont > ul > li .support_slide .item a span {
    margin-top: 2rem;
  }
	    #main .cal_mag_wrap .rise_txt {
        font-size: 9.7rem;
        top: 39rem;
        right: -20rem;
    }
}
@media (max-width: 1024px) {
  #main .tbanner_area .tbanner_slide li {
    margin: 0 2rem;
  }
  #main .visual_area .visual_slide {
    overflow: hidden;
    max-width: 100vw;
  }
  #main .visual_area .visual_slide .visual_slide_card {
    max-width: 200vw;
    width: 140vw;
    transform: translateX(-20vw);
  }
  #main .notice_area .inner .notice .notice_tab ul li a {
    font-size: 20px;
  }
  #main .notice_area .inner .notice .notice_list li .flot {
    min-height: 180px;
  }
  #main .notice_area .inner .notice .notice_list li .flot strong {
    font-size: 19px;
  }
  #main .notice_area .inner .notice .notice_list li::after {
    width: 3.5rem;
    height: 3.5rem;
    font-size: 16px;
    border-radius: 0 0 5px 5px;
  }
  #main .calendar_area .inner .calendar .calendar_slide li a dl dd {
    font-size: 17px;
  }
  #main .calendar_area .inner .calendar .calendar_slide li a dl dt {
    font-size: 17px;
  }
}
@media (max-width: 900px) {
  /* #main {
    background: linear-gradient(to bottom, #f0f5fb, #ffffff);
  } */
  #main .support_area {
    padding: 4.5rem 0rem 0rem;
  }
  #main .support_area .inner .support_title {
    position: relative;
    width: 100%;
    display: block;
    padding: 5rem 6rem 10rem 6rem;
    height: auto;
    border-radius: 5rem 5rem 0 0;
  }
  #main .support_area .inner .support_title h2 {
    margin-bottom: 1.5rem;
    font-size: 2.9rem;
  }
  #main .support_area .inner .support_title h2 span {
    display: inline;
  }
  #main .support_area .inner .support_title p span {
    display: inline;
  }
  #main .support_area .inner .support_cont {
    width: 100%;
    left: 0;
    position: relative;
    height: auto;
    padding: 2rem 3rem 2rem 3rem;
    transform: translateY(-6rem);
    border-radius: 3rem;
  }
  #main .support_area .inner .support_cont > ul {
    flex-flow: column;
  }
  #main .support_area .inner .support_cont > ul > li {
    display: block;
  }
  #main .support_area .inner .support_cont > ul > li > a {
    width: 100%;
    color: #365373;
    font-size: 2.2rem;
    margin: 1rem 0;
    border: 1px solid #8d9cb1;
    height: 7rem;
    border-radius: 2rem;
  }
  #main .support_area .inner .support_cont > ul > li > a::before {
    position: absolute;
    right: 2.5rem;
    width: 3rem;
    height: 2rem;
    background: url(../images/common/ci_angle.png) no-repeat center center/contain;
    transform: rotate(90deg);
    opacity: 0.6;
  }
  #main .support_area .inner .support_cont > ul > li .support_slide {
    position: relative;
    width: 100%;
    transform: translateY(0);
    left: 0;
    top: 0;
  }
  #main .support_area .inner .support_cont > ul > li .support_slide .slick-list {
    padding: 0.3rem 0;
	}
  #main .support_area .inner .support_cont > ul > li.active > a {
    padding-left: 9rem;
    height: 7rem;
    border-radius: 2rem;
  }
  #main .support_area .inner .support_cont > ul > li.active > a::after {
    background: url(../images/common/chk.png) no-repeat center center/2rem #ee5176;
    border-radius: 2rem;
    left: 0;
    top: auto;
    height: 7rem;
    width: 7rem;
  }
	#main .notice_area {
    padding-top: 4rem;
    position: relative;
	}
	#main .notice_area .inner .notice h2 {
    margin-bottom: 3rem;
    font-size: 3.6rem;
  }
  #main .notice_area .inner .notice .notice_tab {
    margin-bottom: 3rem;
  }
	#main .calendar_area {
    width: calc(100% - 4rem);
    margin-bottom: 0;
  }
  #main .notice_area .inner .notice .notice_list {
    margin-bottom: 8rem;
  }
  #main .notice_area .inner .notice .notice_list li:nth-child(n+3) {
    margin-right: 0;
  }
  #main .calendar_area .inner .calendar .calendar_tab {
    margin: 3rem 0 2rem;
  }
  #main .calendar_area .inner .calendar .calendar_slide li a dl dd {
    /* font-size: 1.8rem; */
  }
  #main .calendar_area .inner .calendar .calendar_slide li a dl dt {
    /* font-size: 2rem; */
  }
  #main .cal_mag_wrap {
    position: relative;
    display: flex;
    justify-content: space-between;
    /* transform: translateY(-10rem); */
    /* padding: 0 1rem; */
  }
  #main .cal_mag_wrap .rise_txt {
    font-size: 10rem;
    top: 40rem;
    right: -20rem;
  }
  #main .calendar_area {
    width: 100%;
    margin-bottom: 0;
  }
  #main .media_area .inner .media_title h2,
  #main .calendar_area .inner .calendar h2,
  #main .notice_area .inner .notice h2 {
    font-size: 3rem;
  }
  #main .calendar_area .inner {
    justify-content: flex-start;
    flex-flow: row;
  }
  #main .calendar_area .inner .calendar {
    max-width: 100%;
    margin-bottom: 4rem;
  }
  #main .calendar_area .inner .calendar .calendar_slide::before {
    display: none;
  }
  #main .calendar_area .inner .calendar .calendar_tab li a {
    /* font-size: 2.1rem; */
  }
  #main .calendar_area .inner .calendar h2::after {
    right: -2rem;
    top: 1rem;
  }
  #main .magazine_area .inner .magazine {
    padding-right: 3rem;
  }
  #main .magazine_area .inner .magazine .magazine_box {
    margin-left: 3rem;
  }
  #main .magazine_area .inner .magazine::before {
    height: 100%;
  }
  #main .magazine_area .inner .magazine .magazine_box .magazine_card ul {
    height: 7rem;
    padding: 0 3.5rem;
    border-radius: 0 5rem 0 0;
  }
  #main .magazine_area .inner .magazine .magazine_box .magazine_card .tit > strong {
    font-size: 3.6rem;
    margin-bottom: 55%;
  }
  #main .magazine_area .inner .magazine .magazine_box .magazine_card .tit p span {
    font-size: 2.4rem;
  }
  #main .magazine_area .inner .magazine .magazine_box .magazine_card .tit p strong {
    font-size: 3rem;
  }
  #main .magazine_area .inner .magazine .magazine_box .magazine_card .img img {
    min-height: 30rem;
  }
  #main .magazine_area {
    width: calc(50% - 2rem);
  }
  #main .magazine_area .inner .magazine {
    width: 100%;
  }
  #main .magazine_area .inner .magazine::before {
    left: -4rem;
  }
  
  #main .notice_area::before {
    width: 95vw;
  }
  
  #main .notice_area::after {
    width: 95vw;
  }
  #main .notice_area .inner .notice {
    width: 100%;
    max-width: 100%;
  }
  #main .notice_area .inner .notice .notice_list li:last-child {
    margin-right: 0;
  }
  #main .media_area {
    margin-bottom: 3rem;
  }
  #main .media_area .inner .media_title {
    width: 100%;
    max-width: 100%;
  }
  #main .media_area .inner .media_slide .media_slide_nav {
    width: 100%;
  }
    #main .media_area .inner .media_slide .media_slide_nav .item a {
    height: 28rem;
  }
  #main .media_area .inner .media_slide .media_slide_nav .item span {
    font-size: 2.1rem;
  }
}
@media (max-width: 768px) {
  #main .visual_area .visual_txt {
    margin-bottom: 0;
  }
  #main .tbanner_area .tbanner_slide li {
    margin: 0 1rem;
  }
  #main .visual_area .visual_txt h2 {
    max-width: 40rem;
    margin: 0 auto 2rem auto;
    line-height: 1.4;
    font-size: 3.5rem;
  }
  #main .visual_area .visual_txt p {
    max-width: 50rem;
    line-height: 1.3;
    font-size: 2.3rem;
  }
  #main .visual_area .visual_slide .visual_slide_card .item {
    padding: 2rem 1.5rem;
  }
  #main .visual_area .inner {
    padding-top: 13rem;
  }
  #main .notice_area .inner .notice .notice_tab {
    margin-bottom: 2rem;
  }
  #main .notice_area .inner .notice .notice_tab ul {
    /* width: 48rem; */
    width: 100%;
    flex: 1;
    padding-right: 35px;
  }
}
@media (max-width: 680px) {
  #main .visual_area .visual_txt h2 {
    font-size: 3.2rem;
  }
  #main .visual_area .visual_slide .visual_slide_card .slick-track {
    padding-top: 10rem;
  }
  #main .visual_area .visual_slide .visual_slide_card .item {
    margin-bottom: 3rem;
  }
  #main .visual_area .visual_slide .visual_slide_card .slick-track {
    overflow: hidden;
  }
  #main .visual_area .visual_slide .visual_slide_ctrl {
    bottom: -35rem;
    right: 50%;
    transform: translateX(50%);
  }
}
@media (max-width: 620px) {
  #main .calendar_area {
    /* width: calc(50% - 2.5rem); */
  }
  #main .magazine_area .inner .magazine .magazine_box {
    margin-left: 1rem;
  }
  #main .magazine_area .inner .magazine {
    padding: 0;
  }
  #main .magazine_area {
    width: 50%;
  }
  #main .magazine_area .inner .magazine::before {
    left: -2.5rem;
    width: 55vw;
  }
  #main .notice_area .inner .notice .notice_list li {
    width: 50%;
  }
  #main .notice_area .inner .notice .notice_list li:nth-of-type(2) {
    margin-right: 0;
  }
  #main .notice_area .inner .notice .notice_list li:nth-child(n+3) {
  display: none;
  }
}
@media (max-width: 550px) {
  #main .notice_area .inner .notice .notice_tab ul li a {
    font-size: 18px;
  }
  #main .notice_area .inner .notice .notice_tab ul {
    padding-right: 20px;
  }
  #main .magazine_area .inner .magazine .magazine_box {
    margin-left: 3rem;
    padding-right: 3rem;
  }
  #main .cal_mag_wrap {
    flex-flow: row wrap;
  }
  #main .cal_mag_wrap .rise_txt {
	font-size: 8rem;
	top: 39rem;
	right: -15rem;
	}
  #main .calendar_area {
    width: 100%;
    margin-bottom: 5rem;
  }
  #main .cal_mag_wrap {
    /* margin-bottom: 7rem; */
  }
  #main .magazine_area .inner .magazine::before {
    width: 100vw;
  }
  #main .magazine_area {
    width: 100%;
  }
  #main .media_area .inner .media_title .media_slide_ctrl li:last-child {
    margin-left: 1rem;
  }
    #main .media_area .inner .media_title .media_slide_ctrl li a {
    width: 4rem;
    height: 4rem;
  }
  #main .cal_mag_wrap .rise_txt {
    display: none;
  }
  #main .support_area {
    padding-bottom: 0;
  }
  #main .support_area .inner .support_title {
    padding: 4rem 2rem 9rem 4rem;
  }
  #main .support_area .inner .support_cont {
    padding: 3rem 3rem 3rem 3rem;
  }
  #main .support_area .inner .support_cont > ul > li.active > a::after {
    left: -1rem;
  }
  #main .tbanner_area .inner {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 15px;
  }
  #main .tbanner_area .tbanner_slide {
    width: 100%;
  }
}
@media (max-width: 450px) {
  #main .notice_area .inner .notice .notice_tab ul li a {
    font-size: 17px;
  }
  #main .notice_area .inner .notice .notice_tab ul {
    padding-right: 10px;
  }
  #main .notice_area .inner .notice .notice_tab > a {
    width: 4.5rem;
    height: 4.5rem;
  }
  #main .notice_area .inner .notice .notice_list {
    flex-direction: column;
    gap: 15px;
  }
  #main .notice_area .inner .notice .notice_list li:nth-child(n+3) {
    display: block;
  }
  #main .notice_area .inner .notice .notice_list li:nth-child(n+4) {
    display: none;
  }
  #main .notice_area .inner .notice .notice_list li {
    width: 100%;
    max-width: 100%;
    margin-right: 0;
  }
  #main .notice_area .inner .notice .notice_list li .flot {
    min-height: auto;
  }
  #main .notice_area .inner .notice .notice_list li .flot strong {
    margin-bottom: 20px;
    font-size: 18px;
  }
  #main .notice_area .inner .notice .notice_list li .flot > span {
    display: none;
  }
}
@media (max-width: 425px) {
  #main .media_area .inner .media_title h2, #main .calendar_area .inner .calendar h2, #main .notice_area .inner .notice h2,
  #main .support_area .inner .support_title h2 {
    font-size: 2.5rem;
    margin-bottom: 2rem;
  }
}
@media (max-width: 400px) {
  #main .visual_area .visual_slide .visual_slide_card .item {
    margin: 0 0.7rem;
    padding: 2rem 1rem;
  }
  #main .visual_area .visual_slide .visual_slide_card .item i {
    /* margin: auto; */
    transform: scale(0.7);
  }
  #main .visual_area .visual_slide .visual_slide_card .item.slick-center {
    padding-top: 0;
    padding-bottom: 20px;
  }
  #main .visual_area .visual_slide .visual_slide_card .item.slick-center span {
    margin-bottom: 2.5rem;
  }
  #main .visual_area .visual_slide .visual_slide_card .item dl dd, #main .visual_area .visual_slide .visual_slide_card .item dl {
    /* flex-direction: column; */
    /* gap: 5px; */
  }
  #main .visual_area .visual_slide .visual_slide_ctrl {
    bottom: -35rem;
  }
}
@keyframes visual-card-ani {
  0% {
    transform: translateY(0);
    opacity: 0;
  }
  100% {
    transform: translateY(-3rem);
    opacity: 1;
  }
}
@keyframes lineSlide {
  0% {top:0; height: 0;}
  50% {height: 30px;}
  100% {top:100%;}
}
/* @keyframes scrollLine {
  0% {
    max-height: 0;
    transform: translateY(0);
  }
  100% {
    max-height: 5rem;
    transform: translateY(130%);
  }
} */
body.dark #header.main_pg_hd .head_nav {
  background-color: none;
}
body.dark #main .visual_area {
  background-image: none;
  position: relative;
}
body.dark #main .visual_area::before {
  position: absolute;
  left: 0;
  top: 0;
  content: "";
  display: block;
  width: 100vw;
  height: 100%;
  max-height: 100%;
  min-height: 100vh;
  background: url(../images/main/visual_bg.jpg) no-repeat center center/cover;
  filter: saturate(0);
}
body.dark #header.main_pg_hd.active .head_nav .head_addon .head_nav_log > li > a > i {
  opacity: 1;
  filter: brightness(0) invert(1);
}
body.dark #header.main_pg_hd.active .head_nav .head_addon .head_nav_log > li > a > span {
  background-color: #dedfe9;
}
body.dark #header.main_pg_hd.active .head_nav .head_addon .head_nav_bar i,
body.dark #header.main_pg_hd.active .head_top .head_top_log > li > a > i,
body.dark #header.main_pg_hd.active .head_top .head_top_sns > li > a > i,
body.dark #main .tbanner_area .tbanner_slide li a img,
body.dark #main .notice_area .inner .notice .notice_tab > a::before,
body.dark #main .notice_area .inner .notice .notice_list li .flot > div .more_btn span i,
body.dark #main .calendar_area .inner .calendar .calendar_slide_ctrl a.calendar_slide_dw i,
body.dark #main .calendar_area .inner .calendar .calendar_slide_ctrl a.calendar_slide_up i,
body.dark #main .media_area .inner .media_title .media_slide_ctrl li a i,
body.dark #main .media_area .inner .media_title .media_slide_ctrl li:last-child a::before,
body.dark #main .magazine_area .inner .magazine .magazine_box .magazine_card ul li a i,
body.dark #main .support_area .inner .support_cont > ul > li .support_slide button::before,
body.dark #main .support_area .inner .support_cont > ul > li > a::before,
body.dark #main .tbanner_area .tbanner_slide_btn div a i {
  opacity: 1;
  filter: brightness(0) invert(1);
}
body.dark #main .calendar_area .inner .calendar .calendar_slide_ctrl a.slick-disabled i {
  opacity: 0.5;
}
body.dark #main .support_area .inner .support_cont > ul > li .support_slide button,
body.dark #main .notice_area .inner .notice .notice_tab > a,
body.dark #main .media_area .inner .media_title .media_slide_ctrl li:last-child a {
  border-color: #575757;
}
body.dark #main .cal_mag_wrap .rise_txt {
  color: rgba(132, 132, 132, 0.35);
}
body.dark #main .magazine_area .inner .magazine .magazine_box .magazine_card,
body.dark #main .support_area .inner .support_cont {
  background-color: #161616;
}
body.dark #main .media_area .inner .media_slide .media_slide_for .item dl dt span {
  color: #030303;
}
body.dark #main .media_area .inner .media_slide .media_slide_for .item dl dt::after,
body.dark #main .media_area .inner .media_slide .media_slide_for .item dl dd::after,
body.dark #main .media_area .inner .media_slide .media_slide_for .item dl dt::before {
  background-image: url(../images/main/media_tail_dark.png);
}
body.dark #main .calendar_area .inner .calendar h2::after,
body.dark #main .notice_area .inner .notice .notice_tab ul li a::before {
  background-color: #3c6bfb;
}
body.dark #main .notice_area .inner .notice h2,
body.dark #main .media_area .inner .media_title h2,
body.dark #main .calendar_area .inner .calendar h2,
body.dark #main .media_area .inner .media_slide .media_slide_for .item dl dd strong,
body.dark #main .tbanner_area .tbanner_slide_btn p,
body.dark #header.main_pg_hd.active .head_nav h1 a,
body.dark #main .magazine_area .inner .magazine .magazine_box .magazine_card .tit > strong,
body.dark #main .notice_area .inner .notice .notice_tab ul li:focus a, body.dark #main .notice_area .inner .notice .notice_tab ul li:hover a, body.dark #main .notice_area .inner .notice .notice_tab ul li.active a,
body.dark #header.main_pg_hd.active .head_top .head_top_log > li > a,
body.dark #header.main_pg_hd.active .head_nav .head_addon .head_nav_pop,
body.dark #header.main_pg_hd.active .head_nav .head_addon .head_nav_log > li > a,
body.dark #main .calendar_area .inner .calendar .calendar_tab li.active a,
body.dark #main .support_area .inner .support_cont > ul > li .support_slide .item a span,
body.dark #main .magazine_area .inner .magazine .magazine_box .magazine_card ul li a,
body.dark #header.main_pg_hd.active .head_nav .head_gnb > li > a {
  color: #fff;
}
body.dark #main .magazine_area .inner .magazine .magazine_box .magazine_card .tit > span,
body.dark #main .calendar_area .inner .calendar .calendar_slide li a span,
body.dark #main .support_area .inner .support_cont > ul > li > a,
body.dark #main .calendar_area .inner .calendar .calendar_slide li a dl dt {
  color: #e5e5e5;
}
body.dark #main .calendar_area .inner .calendar .calendar_tab li a,
body.dark #main .notice_area .inner .notice .notice_list li .flot > span,
body.dark #main .media_area .inner .media_slide .media_slide_for .item dl dt,
body.dark #main .calendar_area .inner .calendar .calendar_slide li a dl dd,
body.dark #main .media_area .inner .media_slide .media_slide_nav .item span,
body.dark #main .notice_area .inner .notice .notice_list li .flot > div small,
body.dark #main .notice_area .inner .notice .notice_list li .flot > div .more_btn,
body.dark #main .notice_area .inner .notice .notice_tab ul li a {
  color: #b4b4b4;
}
body.dark #main {
  background: linear-gradient(to bottom, #303036, #212125);
}
body.dark #main .tbanner_area {
  background-color: #202020;
}
body.dark #main .media_area .inner .media_slide .media_slide_for .item dl dt,
body.dark #main .media_area .inner .media_slide .media_slide_for .item dl dd {
  background: #222222;
}
body.dark #main .notice_area::after,
body.dark #main .notice_area::before {
  background-color: #212125;
}
body.dark #main .notice_area .inner .notice .notice_list li > span,
body.dark #main .calendar_area .inner .calendar .calendar_slide li a,
body.dark #main .magazine_area .inner .magazine .magazine_box .magazine_card ul,
body.dark #main .support_area .inner .support_cont > ul > li .support_slide .item a {
  background-color: #585858;
}
body.dark #main .notice_area .inner .notice .notice_list li svg {
  fill: #585858;
}
body.dark #main .notice_area .inner .notice .notice_list li .flot > div .more_btn span,
body.dark #main .support_area .inner .support_cont > ul > li .support_slide button,
body.dark #main .calendar_area .inner .calendar .calendar_slide_ctrl a,
body.dark #main .media_area .inner .media_title .media_slide_ctrl li a,
body.dark #main .notice_area .inner .notice .notice_tab > a {
  background-color: #111111;
}

@keyframes arrowMove {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  60% {
    transform: translateX(3rem);
    opacity: 0.5;
  }
  61% {
    transform: translateX(-4rem);
    opacity: 0.5;
  }
  80% {
    opacity: 0.5;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}