@charset "UTF-8";

/******************** common  *********************/
#container:not(.main){position: relative; padding-bottom: 150px;}
#container:not(.main)::before{content: ''; position: absolute; bottom: -45px; right: 0; z-index: -1; width: 462px; height: 208px; background: url(../../images/user/sub/sub-bg.png) no-repeat 50% / cover;}

.title01{font-size: var(--font-48); }
.title02{font-size: var(--font-38); }
.title03{font-size: var(--font-26); }
.title04{font-size: var(--font-24); }
.title01 + .title04{margin-top: 20px;}
.title{position: relative; font-weight: 800;}
.title::before{content: '';position: absolute;top: -4px;left: -10px;z-index: -1;width: 30px;height: 30px;border-radius: 50%;background: #DFE6F3;}


/* slide */
.swiper-control{margin-top: 48px;}
.swiper-control .swiper-btn{display: flex; align-items: center; justify-content: right; gap: 20px;}
.swiper-control .swiper-prev,
.swiper-control .swiper-next{width: 40px; height: 40px; border-radius: 10px; border: 2px solid var(--color-main); background: rgba(255,255,255,0.3);}
.swiper-control .swiper-prev span::before,
.swiper-control .swiper-prev span::after{content: '';width: 10px;height: 2px;display: block;}
.swiper-control .swiper-prev span::before{transform: rotate(-45deg);margin-top: 0px;}
.swiper-control .swiper-prev span::after{transform: rotate(45deg);margin-top: 4px;}
.swiper-control .swiper-next span::before,
.swiper-control .swiper-next span::after{content: '';width: 10px;height: 2px;display: block;}
.swiper-control .swiper-next span::before{transform: rotate(45deg);margin-left: 5px;margin-top: 0px;}
.swiper-control .swiper-next span::after{transform: rotate(-45deg);margin-left: 5px;margin-top: 4px;} 
.swiper-control .swiper-prev:hover,
.swiper-control .swiper-next:hover{background: #fff;}
.swiper-control .btn span::before, 
.swiper-control .btn span::after {background: var(--color-main);}

@keyframes aniPrgressbar {
  from { width: 0; }
  to { width: 100%; max-width: calc(100% - 10px);}
}
.swiper-pagination-bar {width: 100%;max-width: 270px;height: 18px;background: rgba(208, 208, 208, 0.3);border-radius: 10px;position: relative;top: unset;left: unset;bottom: unset;right: unset;margin-top: 20px;padding: 0 5px;float: right;}
.swiper-pagination-bar::before {content: '';position: absolute;top: 50%;transform: translateY(-50%);width: 0;height: 8px;border-radius: 10px;background: var(--color-main);}
.swiper-pagination-bar.active::before { animation: aniPrgressbar 4s ease-in-out .1s; animation-fill-mode: forwards; }


.top-cont{height: 320px; position: relative;}
.topImg-subj{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);font-size: 3.125em;color: #fff;font-weight: 700;padding-top: 80px;}
.topImg-bg{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: no-repeat bottom right / cover;background-image: url(../../images/user/sub/top-bg.png);}
.topImg-bg::after{content: ''; position: absolute; left: 0; bottom: 20px; width: 270px; height: 138px; background: url(../../images/user/sub/top-ico.png) no-repeat 50% / cover; }
.snb{position: absolute;bottom: -23px;left: 50%;transform: translateX(-50%);z-index: 1;max-width: 700px;width: 100%;}
.snb_hd{display: none}
.snb_ul{padding: 10px 30px;display: flex;justify-content: center;align-items: center;background-color: #fff;border: 1px solid #e4e4e4;border-radius: 2px;}
.snb_ul li a{color: var(--color-400);font-weight: 500;width: 100px;text-align: center;}
.snb_ul li.active a{color: var(--color-main); font-weight: 600;}
.lnb{margin-top: 140px; padding-bottom: 10px; border-bottom: 1px solid #000;}
.lnb-title{font-size: 2.125em; color: var(--color-main2);}
.lnb_wrap span{font-size: 0.875em; font-weight: 500; color: var(--color-400);}
.lnb_wrap span:last-child{color: var(--color-800); font-weight: 600;}


.info-container{padding-top: 100px;}
.info-container .cont + .cont{margin-top: 120px;}
.info-container.info-program .cont + .cont{margin-top: 160px;}

/* info-kusa */
.info-kusa .title{margin-bottom: 30px;}
.info-kusa .cont01{position: relative;}
.info-kusa .cont01::before{content: ''; position: absolute; bottom: 68px; left: 0; z-index: -1; width: 100%; height: 498px; background: var(--color-sub);}
.info-kusa .cont01::after{content: '';position: absolute;bottom: 68px;right: 0;width: 433px;height: 116px;background: url(../../images/user/sub/kusa-cont01.png) no-repeat 50% / cover;z-index: -1;}
.info-kusa .cont01 .cont-box{gap: 80px;}
.info-kusa .cont01 img{border-radius: 50px 50px 120px 0;flex: 1;max-width: 490px;width: 300px;}
.info-kusa .cont01 .txt{flex: 1;}
.info-kusa .cont01 .txt p{font-size: var(--font-20); font-weight: 600; color: var(--color-800); line-height: 1.7;}
.info-kusa .cont01 .txt p + p{margin-top: 18px;}
.info-kusa .box-wrap{display: flex; gap: 24px;}
.info-kusa .cont02 .cont-box{padding: 40px;border-radius: 40px;border: 1px solid var(--Gray-200, #E4E4E4);flex: 1;}
.info-kusa .cont02 .cont-box p{font-size: var(--font-20); line-height: 1.6; color: var(--color-800);}
.info-kusa .cont02 .cont-box p + p{margin-top: 16px;}
.org-chart__box{margin-top: 24px;border-radius: 40px 40px 120px 0px;border: 1px solid var(--Gray-200, #E4E4E4);background: var(--color-100);padding: 50px 40px;}
.org-chart {max-width: 792px;margin: 0 auto;text-align: center;position: relative;} 
.org-chart .org-box {background-color: var(--color-main2);border-radius: 10px;padding: 14px 36px;color: #000;font-weight: 800;position: relative;z-index: 1;min-width: 180px;font-size: var(--font-22);min-height: 56px;display: inline-flex;align-items: center;justify-content: center;} 
.org-chart .org-top {background-color: #000;color: #fff;font-size: var(--font-30);border-radius: 15px;min-height: 58px;} 
.org-chart .org-row {display: flex;justify-content: space-between;gap: 20px;margin: 16px 0;position: relative;} 
.org-chart .org-partners,
.org-chart .org-supporters {background-color: #002B87;color: #fff;font-size: var(--font-24);border-radius: 15px;min-width: 156px;min-height: 58px;} 
.org-chart .org-partners::before, 
.org-chart .org-supporters::before { content: ''; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); width: 2px; height: 44px; background: var(--color-300); } 
.org-chart .org-departments {display: flex;flex-direction: column;align-items: center;gap: 35px;} 
.org-chart .org-partners::after{content: '';position: absolute;top: 100%;left: 74px;width: 228px;height: 326px;background: url(../../images/user/sub/org-line01.svg) no-repeat 50% / cover;}
.org-chart .org-supporters::after{content: '';position: absolute;top: 100%;right: 74px;width: 229px;height: 53px;background: url(../../images/user/sub/org-line02.svg) no-repeat 50% / cover;}
.org-notes span{color: var(--color-800); font-weight: 800;}
.org-chart .note-left {position: absolute;left: 15%;bottom: 37px;;} 
.org-chart .note-right {position: absolute;right: 20%;top: 155px;} 
.org-chart .note-right2 {position: absolute;right: 16%;top: 200px;} 
.org-chart::before {content: '';position: absolute;top: 0;left: 50%;height: 100%;width: 2px;background-color: var(--color-300);} 
.org-row::before {content: '';position: absolute;top: -44px;left: 50%;transform: translateX(-50%);max-width: calc(100% - 157px);width: 100%;height: 2px;background-color: var(--color-300);} 

/* info-program */
.subTitle{margin-top: 10px; margin-bottom: 46px; position: relative;color: var(--color-main);display: inline-block;font-size: var(--font-24);font-weight: 700;}
.subTitle::after{content: '';position: absolute;bottom: 0;left: 0;width: calc(100% + 5px);height: 16px;background: url(../../images/user/main/tit-line.svg) no-repeat bottom right / cover;z-index: -1;}
.info-program .cont{gap: 50px;align-items: center;}
.info-program .cont > div{}
.info-program .img-wrap img{width: 100%; border-radius: 50px 50px 120px 0;}
.info-program .cont-box{padding: 30px;border-radius: 30px;border: 1px solid var(--color-main2);background-color: var(--color-sub2);min-height: 276px;color: var(--color-800);font-size: var(--font-20);font-weight: 600;line-height: 1.8;}
.info-program .cont-l .img-wrap{display: none;}
.info-program .cont-r {width: min(732px, 54%);flex: none;}
.info-program .img-wrap{font-size: 0;}
.info-program .cont01{flex-direction: row-reverse;}

/* bbs */
.bbs-gallery .board-list li.empty_list {
  width: calc(100% - 32px);
  border: 0;
  border-bottom: 1px solid #e4e4e4;
  margin: 0 auto;
}


/*--------------------------------------------------------------------- 반응형 --------------------------*/


@media screen and (max-width: 1600px) {
  *{font-size: 14px;}
  .topImg-subj{font-size: var(--font-44);}
  .title01{font-size: var(--font-42);}
  .title02{font-size: var(--font-34);}
  .info-kusa .cont01 .txt p{font-size: var(--font-18);}
  .info-program .cont-box{font-size: var(--font-18);min-height: 240px;}
  .info-kusa .cont02 .cont-box p{font-size: var(--font-18);}
  .org-chart .org-box{font-size: var(--font-18);}

  .org-chart .org-top{font-size: var(--font-26);}
  .org-chart .org-partners, .org-chart .org-supporters{font-size: var(--font-20);}

  .info-kusa .cont01 img{max-width: 450px;}
  .info-kusa .cont01 .txt p br {display: none;}
  .info-kusa .cont02 .cont-box br.pc-only{display: none;}
  .info-program .cont-r{width: min(732px, 52%);}
}

@media screen and (max-width: 1200px) {
  .top-cont{height: 350px;}
  .lnb{margin-top: 100px;}
  #container:not(.main)::before {width: 350px; height: 154px;}


  .info-container{padding-top: 80px;}
  .info-kusa .cont01{padding-bottom: 50px;}
  .info-kusa .cont01 .cont-box { gap: 40px; flex-direction: column; } 
  .info-kusa .cont01 img { flex: none; } 
  .info-kusa .cont01 .txt p br { display: none; } 
  .info-kusa .cont01::before {height: calc(100% - 200px); bottom: 0;}
  .info-kusa .cont01::after {bottom: 0;width: 230px;height: 85px;background-position: left;}
  .info-kusa .cont02 .cont-box {padding: 30px;border-radius: 30px;}
  .org-chart {width: 608px;}
  .org-chart .org-partners::after{background-image: url(../../images/user/sub/org-line01_m.svg);width: 158px;height: 284px;left: 63px;}
  .org-chart .org-supporters::after{background-image: url(../../images/user/sub/org-line02_m.svg);width: 158px;height: 51px;right: 63px;}
  .org-chart .org-row { margin: 14px 0; } 

  .org-chart .org-box { border-radius: 10px; min-width: 168px; } 
  .org-chart .org-partners, .org-chart .org-supporters { min-width: 142px; min-height: 54px; border-radius: 10px; font-size: 20px; } 
  .org-chart .org-departments { gap: 22px; } 
  .org-row::before {max-width: calc(100% - 142px);} 
  .org-chart .org-top { min-width: 180px; } 
  .org-notes span { font-size: 14px; } 
  .org-chart .note-left { left: 13%; } 
  .org-chart .note-right { right: 18%; top: 145px; } 
  .org-chart .note-right2 { right: 13%; top: 180px; } 

  /* info-program */
  .info-program .cont-l .img-wrap{display: block;}
  .info-program .cont {flex-direction: column;gap: 0;}
  .info-program .cont-box {margin-top: 40px;}
}


@media screen and (max-width: 768px) {
  /******************** common  *********************/
  #container:not(.main){padding-bottom: 100px;}
  #container:not(.main)::before {width: 222px; height: 102px; bottom: -20px;}
  .title::before { width: 24px; height: 24px; top: -2px; } 
  .title02{font-size: 24px;}

  .slide-btn__prev, .slide-btn__next{width: 35px; height: 35px;}
  .snb {max-width: 100%; left: 0; transform: none;}
  .snb_ul {padding: 10px 0; border-left: 0; border-right: 0; border-radius: 0;}
  .snb_ul li {padding: 0 10px;}
  .snb_ul li a {width: auto; font-size: var(--font-14);}
  .top-cont {height: 250px;}
  .topImg-bg{background-image: url(../../images/user/sub/top-bg_m.png);}
  .topImg-bg::after{display: none;}
  .topImg-subj {font-size: 34px;}
  .lnb{margin-top: 60px;}
  .lnb_wrap{display: none;}
  .lnb-title{font-size: 2em;}


  .info-container{padding-top: 60px;}
  .info-container .cont + .cont{margin-top: 90px;}
  .info-container.info-program .cont + .cont{margin-top: 100px;}
  .info-kusa .title{margin-bottom: 20px;}
  .info-kusa .cont01 { padding-bottom: 40px; } 
  .info-kusa .cont01::before { height: calc(100% - 100px); bottom: 0; } 
  .info-kusa .cont01::after { bottom: 0; width: 125px; height: 76px; background-position: left; } 
  .info-kusa .cont01 img {width: 100%; border-radius: 30px 30px 60px 0;}
  .info-kusa .cont01 .txt p { font-size: 18px; } 
  .info-kusa .box-wrap{flex-direction: column;gap: 16px;}
  .info-kusa .cont02 .cont-box {padding: 20px;}
  .info-kusa .cont02 .cont-box p { font-size: 16px; } 
  .info-kusa .cont02 .cont-box p + p { margin-top: 10px; } 
  .org-chart__box{margin-top: 16px; padding: 30px 20px;border-radius: 30px 30px 60px 0;}
  .org-chart__wrap{overflow-x: auto;padding-bottom: 20px;}
  .org-chart{}
  .org-chart__wrap::-webkit-scrollbar-thumb {background: var(--color-400);}


  /* info-program */
  .title01 {font-size: 32px;}
  .subTitle {font-size: 20px; margin-bottom: 30px;}
  .subTitle::after {height: 14px;}
  .info-program .img-wrap img {border-radius: 30px 30px 60px 0;}
  .info-program .cont-box { min-height: auto; margin-top: 16px; padding: 20px; font-size: 16px; } 

}




