@charset "utf-8";

/*///////////////////////////////////////////////////////////////////////////////////////////////////////////

   board_search
   검색

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.board_search,
.board_search .select select,
.board_search .select input,
.board_search .select .search_btn{transition: all 0.3s ease; -webkit-transition: all 0.3s ease;}
.board_search{overflow: hidden; display: flex; flex-wrap: wrap; justify-content:space-between; align-items: center; gap: 1rem; margin-bottom:1.4rem;}
.board_search .count{color: #333; font-size: 1.7rem; font-weight: 500;}
.board_search .count strong{font-weight: 500;}
.board_search .count span{color: #17469E;}

.board_search .select{float:right;}
.board_search .select select,
.board_search .select input,
.board_search .select .search_btn{height:35px; line-height:35px;}
.board_search .select select{min-width:100px; border:1px solid #cecece;}
.board_search .select input[type="text"]{width:200px;}
.board_search .select .search_btn{display:inline-block; width:auto; padding:0 25px; background:#333333; vertical-align:middle; text-decoration:none; color:#fff;}

@media screen and (max-width:720px){
  .board_search .count,
  .board_search .select{float:none;}
}
@media screen and (max-width:640px){
  .board_search .select select,
  .board_search .select input,
  .board_search .select .search_btn{height:32px; line-height:32px;}
  .board_search .select select{min-width:90px;}
  .board_search .select .search_btn{padding:0 20px;}
}
@media screen and (max-width:480px){
  .board_search .select{position:relative;}
  .board_search .select select{width:100%; margin-bottom:5px;}
  .board_search .select input[type="text"]{width:100%; padding:0 70px 0 5px;}
  .board_search .select .search_btn{position:absolute; bottom:0; right:0;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

   page
   페이징

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.page{display: flex; justify-content: center; align-items: center; gap: 0.4rem; margin-top: 6rem;}
.page >a{
  display: flex; justify-content: center; align-items: center; width: 4.2rem; height: 4.2rem; font-size: 1.5rem; color: #555; font-weight: 500; border: 1px solid transparent; border-radius: 50%;
  -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
.page >a.on{background-color: #18469D; border-color: #18469D; color: #fff;}
.page >a[class*="page_"]{border: 1px solid #EEE; text-indent: -9999px; background: url(../../../images/site/kor/content/page_img01.svg) no-repeat center center / 100% auto;}
.page >a.page_left,
.page >a.page_right{background-image: url(../../../images/site/kor/content/page_img02.svg);}
.page >a.page_right,
.page >a.page_end{
  -webkit-transform: rotate(180deg); transform: rotate(180deg);
}
.page >a.page_left{margin-right: 1.6rem;}
.page >a.page_right{margin-left: 1.6rem;}
.page >a:hover{border-color: #18469D;}

@media screen and (max-width:640px){
  .page{margin-top: 4rem;}
  .page >a.page_left{margin-right: 1rem;}
  .page >a.page_right{margin-left: 1rem;}

  .page >a{display: none; position: relative; }
  .page >a[class*="page_"],
  .page >a[class*="page_"],
  .page >a.page_left + a,
  .page >a:nth-last-of-type(3),
  .page >a.on{display: flex; }
  .page >a:not(.on):nth-of-type(3){margin-right: 2.2rem;}
  .page >a:not(.on):nth-of-type(3):before{content: "···"; position: absolute; left: calc(100% + 0.5rem); cursor: none;}
  .page >a:not(.on):nth-last-of-type(3){margin-left: 2.2rem;}
  .page >a:not(.on):nth-last-of-type(3):before{content: "···"; position: absolute; right: calc(100% + 0.5rem); cursor: none;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

   notice_list
   공지형_게시판

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.notice_list{border-top: 1px solid #2D2D2D;}
.notice_list >ul{}
.notice_list >ul >li{display: table; table-layout: fixed; width: 100%; border-bottom: 1px solid #EEE;}
.notice_list >ul >li.thead{ border-bottom: 1px solid #C6C6C6;}
.notice_list >ul >li >*{display: table-cell; height: 7rem; padding: 1rem; vertical-align: middle; color: #2D2D2D; font-size: 1.7rem; text-align: center; }
.notice_list >ul >li.thead >*{font-size: 1.8rem; font-weight: 600;}
.notice_list >ul >li .no{width: 8rem;}
.notice_list >ul >li.notice .no{background: url(../../../images/site/kor/common/board_img01.svg) no-repeat center center / 2.4rem auto; text-indent: -9999px; color: transparent;}
.notice_list >ul >li .divi{width: 13rem;}
.notice_list >ul >li .divi i{display: inline-block; padding: 0.525rem 1.2rem; color: #17469E; font-weight: 500; background-color: #F0F8FF; border-radius: 1.2rem;}
.notice_list >ul >li .subject{width: auto; text-align: left; line-height: 1;}
.notice_list >ul >li.thead .subject{text-align: center; }
.notice_list >ul >li .subject >a{display: inline-block; position: relative; width: auto; max-width: 100%; line-height: 1;}
.notice_list >ul >li .subject >a.new{padding-right: 3.2rem;}
.notice_list >ul >li .subject >a.re_end{padding-right: 7.6rem;}
.notice_list >ul >li .subject >a.re_end.new{padding-right: 10.4rem;}
.notice_list >ul >li .subject >a >strong{overflow: hidden; display: inline-block; width: auto; max-width: 100%; white-space: nowrap; text-overflow: ellipsis; line-height: 1; font-weight: 600; background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)), linear-gradient(to right, #2D2D2D, #2D2D2D, #2D2D2D); background-size: 100% 0.1rem, 0 0.1rem !important; background-position: 100% 100%, 0 100% !important; background-repeat: no-repeat !important;
  -webkit-transition: background-size 0.3s; transition: background-size 0.3s;
}
.notice_list >ul >li .subject >a:hover >strong{background-size: 0 0.1rem, 100% 0.1rem !important;}
.notice_list >ul >li .subject >a >strong .new,
.notice_list >ul >li .subject >a >strong .re_end{display: none;}
.notice_list >ul >li .subject >a.new >strong .new{display: block; position: absolute; top: -0.2rem; right: 0; width: 2.4rem; height: 2.4rem; background-color: #17469E; text-indent: -9999px; border-radius: 50%;}
.notice_list >ul >li .subject >a.new >strong .new:before{content: "N"; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; line-height: 2.4rem; color: #fff; text-indent: 0; text-align: center; font-size: 1.5rem; font-weight: 400}
.notice_list >ul >li .subject >a.re_end >strong .re_end{display: block; position: absolute; top: 0; right: 0; color: #17469E;}
.notice_list >ul >li .subject >a.re_end.new >strong .re_end{display: block; position: absolute; top: 0; right: 2.9rem; color: #17469E;}
.notice_list >ul >li .writer{width: 13rem;}
.notice_list >ul >li .date{width: 13rem;}
.notice_list >ul >li .counter{width: 13rem;}
.notice_list >ul >li .file_atch{width: 10rem;}
.notice_list >ul >li .file_atch span{display: block; width: 2.4rem; height: 2.4rem; margin: 0 auto; text-indent: -9999px; background: url(../../../images/site/kor/common/board_img02.svg) no-repeat center center / 100% auto;}

@media screen and (max-width:1024px){
  .notice_list >ul >li{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 0.6rem 1rem; padding: 2rem 0; table-layout: auto; }
  .notice_list ul li.thead{display:none;}
  .notice_list >ul >li >*{height: auto; padding: 0;}
  .notice_list >ul >li .no{width: 100%; text-align: left;}
  .notice_list >ul >li.notice .no{margin-bottom: 0.3rem; background-position: left center;}
  .notice_list >ul >li .divi{width: auto; }
  .notice_list >ul >li .divi i{font-size: 1.4rem; padding: 0.3rem 1rem; border-radius: 0.4rem;}
  .notice_list >ul >li .subject{width: 100%; margin: 1rem 0 0.4rem; font-size: 1.8rem;}
  .notice_list >ul >li .subject >a.re_end{padding-right: 8.2rem;}
  .notice_list >ul >li .subject >a.re_end.new{padding-right: 11rem;}
  .notice_list >ul >li .writer{width: auto; }
  .notice_list >ul >li .date{width: auto; }
  .notice_list >ul >li .counter{width: auto; }
  .notice_list >ul >li .file_atch{width: auto; }
  .notice_list >ul >li >*{display: flex; justify-content: flex-start; align-items: center; text-align: left;}
  .notice_list >ul >li >*:after{content: ""; display: block; padding-right: 1rem; width: 1px; height: 1.5rem; border-right: 1px solid #EEE;}
  .notice_list >ul >li >*.no:after,
  .notice_list >ul >li >*.divi:after,
  .notice_list >ul >li >*.subject:after,
  .notice_list >ul >li >*:last-child:after{display: none;}
}



/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

   faq_list
   FAQ_게시판

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.faq_list{border-top: 1px solid #2D2D2D;}
.faq_list >li{}
.faq_list >li >div{}
.faq_list >li >.question{ position: relative; width: 100%;}
.faq_list >li >.question:before{
  content: "Q"; display: flex; flex-wrap: wrap; justify-content: center; align-content: center; align-items: center; position: absolute; top: 1.8rem; left: 2rem; width: 4.8rem; height: 4.8rem; color: #555; font-size: 2.8rem; font-weight: 600; background-color: #fff; border: 1px solid #DDD; border-radius: 50%;
  -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
.faq_list >li >.question.on:before{color: #FFF; background-color: #17469E; border-color: #17469E;}
.faq_list >li >.question:hover:before{border-color: #17469E;}
.faq_list >li >.question:after{content: ""; display: block; position: absolute; top: 2.6rem; right: 3rem; width: 2.8rem; height: 2.8rem; background: url(../../../images/site/kor/common/board_img05.svg) no-repeat center center / 100% auto;}
.faq_list >li >.question.on:after{
  -webkit-transform: rotate(-180deg); transform: rotate(-180deg);
}
.faq_list >li >.question >a{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; min-height: 8.4rem; padding: 1.8rem 7rem 1.8rem 10rem; border-bottom: 1px solid #EEE;}
.faq_list >li >.question strong{display: block; position: relative; padding-left: 10rem; color: #2D2D2D; font-size: 1.8rem; font-weight: 600;}
.faq_list >li >.question i{display: inline-block; position: absolute; top: 2.2rem; left: 10rem; width: 8.6rem; padding: 0.525rem 1.2rem; color: #17469E; font-weight: 500; background-color: #F0F8FF; border-radius: 1.2rem; font-size: 1.7rem; text-align: center;}
.faq_list >li >.answer{
  display: none; position: relative; padding: 1.8rem 2rem 1.8rem 10rem; border-top: 1px solid #17469E; background-color: #FAFAFA; color: #555; font-size: 1.7rem; line-height: 1.4; font-weight: 500;
}
.faq_list >li >.answer p{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; min-height: 4.8rem;}
.faq_list >li >.answer p >*{display: block; width: 100%;}
.faq_list >li >.answer:before{content: "A"; display: flex; flex-wrap: wrap; justify-content: center; align-content: center; align-items: center; position: absolute; top: 1.8rem; left: 2rem; width: 4.8rem; height: 4.8rem; color: #17469E; font-size: 2.8rem; font-weight: 600; background-color: #fff; border: 1px solid #17469E; border-radius: 50%;}
.faq_list >li >.answer .links{margin-top: 2rem;}
.faq_list >li >.answer .links li{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 0.4rem 2.4rem; position: relative; padding-left: 3.2rem; color: #555; font-size: 1.7rem; font-weight: 500; line-height: 1.4;}
.faq_list >li >.answer .links li:not(:first-child){margin-top: 0.5rem;}
.faq_list >li >.answer .links li:before{content: ""; display: block; position: absolute; top: 0.6rem; left: 0; width: 2.4rem; height: 2.4rem; background: url(../../../images/site/kor/content/cont0502_img04.svg) no-repeat center center / 100% auto;}
.faq_list >li >.answer .links li:not(.down){min-height: 3.6rem;}
.faq_list >li >.answer .links li:not(.down) a{color: #353535; text-decoration: underline; text-underline-position: under;}
.faq_list >li >.answer .links li.down:before{background-image: url(../../../images/site/kor/content/cont0502_img01.svg);}
.faq_list >li >.answer .links li.down a{
    display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 0.6rem; padding: 0.7rem 1rem; color: #555; font-size: 1.6rem; line-height: 1; background-color: #fff; border: 1px solid #DDD; border-radius: 0.8rem;
    -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
.faq_list >li >.answer .links li.down a:hover{background-color: #555; border-color: #555; color: #fff;}
.faq_list >li >.answer .links li.down a:before{
    content: ""; display: block; width: 2rem; height: 2rem; background: url(../../../images/site/kor/content/cont0502_img02.svg) no-repeat center center / 100% auto;
    -webkit-transition: all 0.4s linear; transition: all 0.2s linear;
}
.faq_list >li >.answer .links li.down a.icon_prev:before{background-image: url(../../../images/site/kor/content/cont0502_img05.svg);}
.faq_list >li >.answer .links li.down a:hover:before{background-image: url(../../../images/site/kor/content/cont0502_img03.svg);}
.faq_list >li >.answer .links li.down a.icon_prev:hover:before{background-image: url(../../../images/site/kor/content/cont0502_img06.svg);}

@media screen and (max-width: 1200px){
  .faq_list >li >.answer .links{}
  .faq_list >li >.answer .links li{gap: 0.4rem 1.6rem; font-size: 1.5rem; padding-left: 2.8rem;}
  .faq_list >li >.answer .links li:not(:first-child){margin-top: 0.4rem;}
  .faq_list >li >.answer .links li:not(.down){min-height: 3.2rem;}
  .faq_list >li >.answer .links li.down a{padding: 0.6rem 0.8rem; font-size: 1.4rem; gap: 0.4rem;}
  .faq_list >li >.answer .links li.down a:before{width: 1.8rem; height: 1.8rem;}
}
@media screen and (max-width: 1024px){
  .faq_list >li >.question >a{min-height: 8rem; padding: 1.5rem 5.5rem 1.5rem 8rem;}
  .faq_list >li >.question:before,
  .faq_list >li >.answer:before{width: 4.2rem; height: 4.2rem; font-size: 2.2rem;}
  .faq_list >li >.question:after{top: 2rem; right: 1.75rem;}
  .faq_list >li >.question i{position: relative; left: auto; top: auto; width: auto; margin-right: auto; font-size: 1.5rem; padding: 0.3rem 1rem; border-radius: 0.4rem;}
  .faq_list >li >.question strong{width: 100%; padding-left: 0; margin-top: 0.8rem; font-size: 1.7rem; line-height: 1.4;}
  .faq_list >li >.answer{padding: 1.5rem 0 1.5rem 8rem;}
  .faq_list >li >.answer p{min-height: 4.2rem;}
}
@media screen and (max-width: 700px){
  .faq_list >li >.answer .links{}
  .faq_list >li >.answer .links li{font-size: 1.6rem;}
}
@media screen and (max-width: 640px){
  .faq_list >li >.question >a{min-height: 7rem; padding: 1.5rem 4.5rem 1.5rem 6rem;}
  .faq_list >li >.question:before,
  .faq_list >li >.answer:before{top: 1.5rem; left: 1rem; width: 3.6rem; height: 3.6rem; font-size: 1.8rem;}
  .faq_list >li >.question:after{top: 2rem; right: 1.2rem;}
  .faq_list >li >.answer{padding: 1.5rem 0 1.5rem 6rem;}
  .faq_list >li >.answer p{min-height: 3.6rem;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

   board_insert
   게시판 등록

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.board_insert{padding: 4rem; background-color: #FAFAFA;}
.board_insert .detail{}
.board_insert .detail >li{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 1.2rem;}
.board_insert .detail >li:not(:first-child){margin-top: 1.6rem;}
.board_insert .detail >li .titles{width: 7rem;}
.board_insert .detail >li .titles strong{color: #1D1D1D; font-size: 1.8rem; font-weight: 600;}
.board_insert .detail >li .txts{flex: 1;}
.board_insert .detail >li .txts >*{display: block; width: 100%; height: 5rem; padding: 1.5rem; border: 1px solid #D8D8D8; outline: none; background-color: #fff; border-radius: 1.2rem; }
.board_insert .detail >li .txts >*::placeholder{color: #ccc;}
.board_insert .detail >li .txts >textarea{height: 40rem;}

@media screen and (max-width: 1024px){
  .board_insert{padding: 3rem;}
  .board_insert .detail >li:not(:first-child){margin-top: 1rem;}
}
@media screen and (max-width: 640px){
  .board_insert{padding: 2rem;}
  .board_insert .detail >li{gap: 0.8rem;}
  .board_insert .detail >li:not(:first-child){margin-top: 0.8rem;}
}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

   board_view
   게시판 상세

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.board_view{border-top: 1px solid #2D2D2D; border-bottom: 1px solid #EEE;}
.board_view .t{padding: 3rem 0; text-align: center; border-bottom: 1px solid #C6C6C6;}
.board_view .t >i{display: inline-block; font-size: 1.7rem; font-weight: 500; color: #17469E; margin-bottom: 1.6rem; padding: 0.525rem 1.2rem; border-radius: 1.2rem; background-color: #F0F8FF;}
.board_view .t >strong{display: block; width: 100%; color: #2D2D2D; font-size: 3rem; font-weight: 700; text-align: center; }
.board_view .t >.info{display: flex; flex-wrap: wrap; justify-content: center; align-items: stretch; gap: 1rem 2rem; margin-top: 1.4rem;  font-size: 1.7rem;}
.board_view .t >.info >li{position: relative; color: #717171;}
.board_view .t >.info >li:not(:last-child){padding-right: 2rem;}
.board_view .t >.info >li:not(:last-child):before{content: ""; display: block; position: absolute; top: 50%; right: 0; width: 1px; height: 1.6rem; margin-top: -0.8rem; background-color: #EEE;}
.board_view .t >.info >li >em{display: inline-block; margin-right: 1.6rem; color: #2D2D2D; font-weight: 600;}
.board_view .links{display: block; width: 100%; padding: 2.4rem 3rem; background-color: #FAFAFA;}
.board_view .links li{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 0.4rem 2.4rem; position: relative; padding-left: 3.2rem; color: #555; font-size: 1.7rem; font-weight: 500; line-height: 1.4;}
.board_view .links li:not(:first-child){margin-top: 0.5rem;}
.board_view .links li:before{content: ""; display: block; position: absolute; top: 0.6rem; left: 0; width: 2.4rem; height: 2.4rem; background: url(../../../images/site/kor/content/cont0502_img04.svg) no-repeat center center / 100% auto;}
.board_view .links li:not(.down){min-height: 3.6rem;}
.board_view .links li:not(.down) a{color: #353535; text-decoration: underline; text-underline-position: under;}
.board_view .links li.down:before{background-image: url(../../../images/site/kor/content/cont0502_img01.svg);}
.board_view .links li.down a{
    display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 0.6rem; padding: 0.7rem 1rem; color: #555; font-size: 1.6rem; line-height: 1; background-color: #fff; border: 1px solid #DDD; border-radius: 0.8rem;
    -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
.board_view .links li.down a:hover{background-color: #555; border-color: #555; color: #fff;}
.board_view .links li.down a:before{
    content: ""; display: block; width: 2rem; height: 2rem; background: url(../../../images/site/kor/content/cont0502_img02.svg) no-repeat center center / 100% auto;
    -webkit-transition: all 0.4s linear; transition: all 0.2s linear;
}
.board_view .links li.down a.icon_prev:before{background-image: url(../../../images/site/kor/content/cont0502_img05.svg);}
.board_view .links li.down a:hover:before{background-image: url(../../../images/site/kor/content/cont0502_img03.svg);}
.board_view .links li.down a.icon_prev:hover:before{background-image: url(../../../images/site/kor/content/cont0502_img06.svg);}
.board_view .c{padding: 4rem 3rem 3rem; color: #2D2D2D; font-size: 1.7rem; font-weight: 500; line-height: 1.5;}
/* 게시판 상세 내용 */
.board_view .c >img{display: block; width: auto; max-width: 100%; margin: 0 auto 3rem; border-radius: 2rem;}
.board_view .c >video{display: block; width: 100%; height: auto;}
.board_view .c >.iframe{display: block; position: relative; width: 100%; height: 0; padding-top: 56.25%; margin: 0 auto 3rem;}
.board_view .c >.iframe >iframe{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
/* 게시판 상세 사진 갤러리 */
.board_view .gallerys{margin-bottom: 3rem;}
.board_view * + .gallerys{margin-top: 3rem;}
.board_view .gallerys{}
.board_view .gallerys .t_wrap{position: relative; width: calc(100% - 24rem); margin: 0 auto;}
.board_view .gallerys .gallery_top{overflow: hidden;}
.board_view .gallerys .gallery_top .swiper-wrapper{}
.board_view .gallerys .gallery_top .swiper-wrapper .swiper-slide{position: relative;width: 100%;height: 0;padding-top: calc(56.25% + 4.4rem);box-sizing: border-box;}
.board_view .gallerys .gallery_top .swiper-wrapper .swiper-slide img{position: absolute;top: 0;left: 0;display: block;width: calc(100% - 2px);height: calc(100% - 2px - 4.4rem);object-fit: contain;border-radius: 2rem;background-color: #fff;border: 1px solid #f4f4f4;}
.board_view .gallerys .gallery_top .swiper-wrapper .swiper-slide span{overflow: hidden;position: absolute;bottom: 0;left: 0;display: block;width: 100%;padding: 1rem 2rem;text-align: center;background-color: #fff;color: #1d1d1d;font-size: 1.6rem;border-radius: 0 0 2rem 2rem;white-space: nowrap;text-overflow: ellipsis;box-sizing: border-box;}
.board_view .gallerys .t_wrap .next,
.board_view .gallerys .t_wrap .prev{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; position: absolute; top: 0; width: 8rem; height: 100%;}
.board_view .gallerys .t_wrap .prev{left: -8rem;}
.board_view .gallerys .t_wrap .next{right: -8rem;}
.board_view .gallerys .t_wrap .next a,
.board_view .gallerys .t_wrap .prev a{
  display: block; width: 100%; height: 6rem; text-indent: -9999px; background: url(../../..//images/site/kor/common/board_img04.svg) no-repeat center center / 150% auto;
  -webkit-transform: translateX(0); transform: translateX(0);
  -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
.board_view .gallerys .t_wrap .next a{
  -webkit-transform: translateX(0) rotate(180deg); transform: translateX(0) rotate(180deg);
}
.board_view .gallerys .t_wrap .prev a:hover{
  -webkit-transform: translateX(-1rem); transform: translateX(-1rem);
}
.board_view .gallerys .t_wrap .next a:hover{
  -webkit-transform: translateX(1rem) rotate(180deg); transform: translateX(1rem) rotate(180deg);
}
.board_view .gallerys .gallery_thumbs{overflow: hidden;margin-top: 1.4rem;text-align: center;}
.board_view .gallerys .gallery_thumbs .swiper-wrapper{display: inline-flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; width: auto; height: auto; }
.board_view .gallerys .gallery_thumbs .swiper-wrapper .swiper-slide{overflow: hidden; position: relative; width: 100%; height: 14.5rem; }
.board_view .gallerys .gallery_thumbs .swiper-wrapper .swiper-slide:before{
  content: ""; display: block; position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); border-radius: 0.8rem; cursor: pointer; border: 2px solid transparent; box-sizing: border-box;
  -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
.board_view .gallerys .gallery_thumbs .swiper-wrapper .swiper-slide.swiper-slide-active:before{background-color: transparent; border-color: #17469E;}
.board_view .gallerys .gallery_thumbs .swiper-wrapper .swiper-slide img{position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 0.8rem; border: 1px solid #f4f4f4; cursor: pointer;}
.board_view .gallerys .gallery_thumbs .swiper-wrapper .swiper-slide span{display: none;}

/* 답글 */
.board_view .re_end{padding: 3rem; border-top: 1px solid #EEE;}
.board_view .re_end .re_t{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 1rem; }
.board_view .re_end .re_t >strong{display: flex; flex-wrap: wrap; justify-content: flex-start; align-content: center; gap: 0.4rem; color: #17469E; font-size: 1.8rem; font-weight: 600;}
.board_view .re_end .re_t >strong:before{content: ""; display: block; width: 2.4rem; height: 2.4rem; background: url(../../../images/site/kor/common/board_img03.svg) no-repeat center center / 100% auto;}
.board_view .re_end .re_t >ul{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 1rem 2rem; margin-left: auto;}
.board_view .re_end .re_t >ul >li{position: relative; color: #717171;}
.board_view .re_end .re_t >ul >li:not(:last-child){padding-right: 2rem;}
.board_view .re_end .re_t >ul >li:not(:last-child):before{content: ""; display: block; position: absolute; top: 50%; right: 0; width: 1px; height: 1.6rem; margin-top: -0.8rem; background-color: #EEE;}
.board_view .re_end .re_t >ul >li >em{display: inline-block; margin-right: 1.6rem; color: #2D2D2D; font-weight: 600;}
.board_view .re_end .re_t >ul >li{}
.board_view .re_end .re_t >ul >li >em{}
.board_view .re_end .re_b{margin-top: 2rem; padding: 2.4rem; color: #555; font-weight: 500; line-height: 1.4; background-color: #FAFAFA; border-radius: 1.2rem;}

/* 댓글 입력*/
.reply,
.reply_box{padding: 2.4rem 3rem; border-bottom: 1px solid #EEE;}
.board_view .c + .reply,
.board_view .c + .reply_box{border-top: 1px solid #EEE;}
.reply .reply,
.reply .reply_box,
.reply_box .reply,
.reply_box .reply_box{border-bottom: 0; border-top: 1px solid #EEE;}
.reply_box#outs_0{border-top: 1px solid #EEE; border-bottom: 0;}
.reply .reply_name{display: block; font-size: 1.7rem; font-weight: 700; line-height: 1.5; color: #2d2d2d;}
.reply #reply_pass,
.reply .reply_pass{display: flex; flex-wrap: wrap; justify-content: flex-start; align-content: flex-start; align-items: center; gap: 0 2.4rem;}
.reply #reply_pass input,
.reply .reply_pass input{order: 1; padding: 0.8rem 1.4rem; color: #2D2D2D; font-size: 1.5rem; border: 1px solid #DDD; background-color: #FAFAFA; border-radius: 0.6rem;}
.reply #reply_pass input::placeholder,
.reply .reply_pass input::placeholder{color: #2D2D2D;}
.reply #reply_pass .reply_name,
.reply .reply_pass .reply_name{order: 1;}
.reply #reply_pass .inputs,
.reply .reply_pass .inputs{order: 3; display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 1rem; width: 100%; margin-top: 0.4rem;}
.reply .inputs textarea{width: calc(100% - 1rem - 10rem); height: 10rem; padding: 1rem 1.4rem; border: 1px solid #DDD; resize: none; border-radius: 0.6rem; font-size: 1.5rem; color: #2D2D2D; background-color: #FAFAFA;}
.reply .reply_pass .inputs textarea{width: calc(100% - 1rem - 10rem - 1rem - 10rem);}
.reply .inputs textarea::placeholder{color: #2D2D2D;}
.reply .inputs a{
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center; width: 10rem; height: auto; color: #fff; font-size: 1.5rem; line-height: 1.5; font-weight: 500; background-color: #17469E; border: 1px solid #17469E; border-radius: 0.6rem; box-sizing: border-box;
  -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
.reply .inputs a:hover{background-color: #fff; color: #17469E;}
.reply .inputs a.cancel{background-color: #FE3016; border-color: #FE3016;}
.reply .inputs a.cancel:hover{background-color: #fff; color: #FE3016;}
.reply #reply_pass span{order: 2; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; position: relative; padding-left: 2.2rem; font-size: 1.5rem; font-weight: 400; color: #17469E; line-height: 1.2;}
.reply #reply_pass span:before{content: ""; display: block; position: absolute; top: -0.1rem; left: 0; width: 1.8rem; height: 1.8rem; margin-right: 0.6rem; background: url(../../../images/site/kor/common/board_img08.svg) no-repeat center center / 100% auto;}
/* 댓글 */
.reply_box{padding: 0;}
.reply_box .txts{display: flex; flex-wrap: wrap; justify-content: flex-start; align-content: flex-start; align-items: flex-start; padding: 2.4rem 3rem;}
.reply_box .txts.re{position: relative; padding-left: 7rem; background-color: #F9F9F9; border-top: 1px solid #EEE; border-bottom: 1px solid #EEE;}
.reply_box .txts.re + .txts.re{border-top: 0;}
.reply_box .txts.re:before{content: ""; display: block; position: absolute; top: 2rem; left: 3rem; width: 2.4rem; height: 2.4rem; background: url(../../../images/site/kor/common/board_img07.svg) no-repeat center center / 100% auto;}
.reply_box .txts .writer{order: 1; display: block; width: 100%; font-size: 1.7rem; font-weight: 700; line-height: 1.5; color: #2d2d2d;}
.reply_box .txts .reply_contents{order: 2; display: block; width: 100%; margin-top: 0.4rem; margin-bottom: 2rem; font-size: 1.7rem; line-height: 1.5; color: #2d2d2d;}
.reply_box .txts .inputs{order: 2; display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; gap: 1rem; width: 100%; margin-top: 0.4rem;}
.reply_box .txts .date{order: 3; display: block; font-weight: 400; font-size: 1.4rem; line-height: 1.2; color: #2d2d2d;}
.reply_box .txts .btns{order: 4; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 2rem; margin-left: auto; }
.reply_box .txts .btns a{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; font-size: 1.5rem; font-weight: 600; line-height: 1; color: #2D2D2D;}
.reply_box .txts .btns a:before{content: ""; display: block; width: 1.8rem; height: 1.8rem; margin-right: 0.4rem; background: url(../../../images/site/kor/common/board_img07.svg) no-repeat center center / 80% auto; }
.reply_box .txts .btns a.re_edit{color: #17469E;}
.reply_box .txts .btns a.re_edit:before{background-image: url(../../../images/site/kor/common/board_img09.svg); background-size: 100% auto;}
.reply_box .txts .btns a.re_delete{color: #FE3016;}
.reply_box .txts .btns a.re_delete:before{background-image: url(../../../images/site/kor/common/board_img10.svg); background-size: 100% auto;}

/* 이전 다음글 */
.reply + .prev_next_link{margin-top: 0; border-top-color: #2D2D2D;}
.reply_box + .prev_next_link{margin-top: 0; border-top-color: #2D2D2D;}
.prev_next_link{margin-top: 12.5rem; border-top: 1px solid #EEE; border-bottom: 1px solid #EEE;}
.prev_next_link >ul{display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch; position: relative; }
.prev_next_link >ul:before{
  content: ""; display: block; position: absolute; top: 50%; left: 50%; width: 1px; height: calc(100% - 2.4rem - 2.4rem); background-color: #EEE;
  -webkit-transform: translateY(-50%); transform: translateY(-50%);
}
.prev_next_link >ul >li{width: 100%;}
.prev_next_link >ul >li >*{display: flex; flex-wrap: wrap; justify-content: flex-start; align-content: center; align-content: center; gap: 0.4rem; position: relative; width: 100%; height: 100%; padding: 2.4rem 2.4rem 2.4rem 8rem;}
.prev_next_link >ul >li:nth-child(2) >*{padding: 2.4rem 8rem 2.4rem 2.4rem; text-align: right;}
.prev_next_link >ul >li >a:hover:before{background-color: #eee;}
.prev_next_link >ul >li >*:before{
  content: ""; display: block; position: absolute; top: 50%; left: 0; width: 5.5rem; height: 5.5rem; margin-top: calc(-5.5rem / 2); border-radius: 50%; border: 1px solid #ddd; background: #fff url(../../../images/site/kor/common/board_img04.svg) no-repeat center center / 100% auto;
  -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
.prev_next_link >ul >li:nth-child(2) >*:before{
  left: auto; right: 0;
  -webkit-transform: rotate(180deg); transform: rotate(180deg);
}
.prev_next_link >ul >li >* >strong{display: block; width: 100%; font-size: 1.8rem; color: #2D2D2D; font-weight: 600;}
.prev_next_link >ul >li >* >p{display: block; width: 100%; color: #555; font-weight: 500; }

/* 자료 사용 문의 */
.board_use{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; margin-top: 8.2rem; }
.board_use >strong{display: flex; flex-wrap: wrap; flex-direction: column; justify-content: center; align-content: center; align-items: center; gap: 1rem; width: 14.2rem; padding: 1rem; color: #151515; font-size: 1.8rem; font-weight: 700; line-height: 1.2; background-color: #F0F8FF;}
.board_use >strong:before{content: ""; display: block; width: 2.4rem; height: 2.4rem; background: url(../../../images/site/kor/common/board_img11.svg) no-repeat center center / 100% auto;}
.board_use >ul{width: calc(100% - 14.2rem); padding: 2rem 2.5rem; border-top: 1px solid #EEE; border-bottom: 1px solid #EEE;}
.board_use >ul >li{color: #2D2D2D;}
.board_use >ul >li:before{background-color: #2D2D2D;}



@media screen and (max-width: 1200px){
  .board_view .links{padding: 1.2rem 2rem;}
  .board_view .links li{gap: 0.4rem 1.6rem; font-size: 1.5rem; padding-left: 2.8rem;}
  .board_view .links li:not(:first-child){margin-top: 0.4rem;}
  .board_view .links li:not(.down){min-height: 3.2rem;}
  .board_view .links li.down a{padding: 0.6rem 0.8rem; font-size: 1.4rem; gap: 0.4rem;}
  .board_view .links li.down a:before{width: 1.8rem; height: 1.8rem;}

  .board_view .gallerys .t_wrap{width: calc(100% - 16rem);}
  .board_view .gallerys .t_wrap .next,
  .board_view .gallerys .t_wrap .prev{width: 6rem;}
  .board_view .gallerys .t_wrap .prev{left: -6rem;}
  .board_view .gallerys .t_wrap .next{right: -6rem;}
}
@media screen and (max-width: 1024px){
  .board_view .t{padding: 2.5rem 0;}
  .board_view .t >i{margin-bottom: 1.2rem; font-size: 1.5rem; padding: 0.3rem 1rem; border-radius: 0.4rem;}
  .board_view .t >strong{font-size: 2.8rem; line-height: 1.2;}
  .board_view .t >.info{margin-top: 1rem; font-size: 1.6rem; gap: 1rem 1.6rem;}
  .board_view .t >.info >li:not(:last-child){padding-right: 1.6rem;}
  .board_view .t >.info >li >em{margin-right: 1.2rem;}
  .board_view .c{padding: 3rem 2rem;}
  .board_view .c >img,
  .board_view .c video,
  .board_view .c .iframe{margin: 0 auto 2rem;}
  .board_view .re_end{padding: 2rem;}
  .board_view .re_end .re_t >ul{gap: 0.4rem 1.6rem;}
  .board_view .re_end .re_t >ul >li >em{margin-right: 1.2rem;}
  .board_view .re_end .re_t >ul >li:not(:last-child){padding-right: 1.6rem;}
  .board_view .re_end .re_b{margin-top: 1.4rem; padding: 2rem;}
  .prev_next_link{margin-top: 8rem;}
  .prev_next_link >ul >li >*:before{width: 4.5rem; height: 4.5rem; margin-top: calc(-4.5rem / 2);}
  .prev_next_link >ul >li >*{padding: 1.8rem 1.8rem 1.8rem 6.2rem;}
  .prev_next_link >ul >li:nth-child(2) >*{padding: 1.8rem 6.2rem 1.8rem 1.8rem;}

  .board_view .gallerys{margin-bottom: 2rem;}
  .board_view * + .gallerys{margin-top: 2rem;}
  .board_view .gallerys .t_wrap{width: calc(100% - 12rem);}
  .board_view .gallerys .gallery_thumbs{margin-top: 1rem;}
  .board_view .gallerys .gallery_thumbs .swiper-wrapper .swiper-slide{height: 12rem;}

  .reply{padding: 2rem;}
  .reply_box{padding: 0;}
  .reply_box .txts{padding: 2rem;}
  .reply_box .txts.re{padding-left: 6rem;}
  .reply_box .txts.re:before{left: 2rem;}
  .reply_box .txts .btns{gap: 1.4rem;}
  .reply #reply_pass .inputs,
  .reply .reply_pass .inputs{order: 2;}
  .reply #reply_pass span,
  .reply .reply_pass span{order: 3; margin-top: 0.6rem;}
}
@media screen and (max-width:840px){
  .board_view .gallerys .t_wrap{width: calc(100% - 7rem);}
  .board_view .gallerys .t_wrap .next,
  .board_view .gallerys .t_wrap .prev{width: 3.5rem;}
  .board_view .gallerys .t_wrap .prev{left: -3.5rem;}
  .board_view .gallerys .t_wrap .next{right: -3.5rem;}
  .board_view .gallerys .t_wrap .next a,
  .board_view .gallerys .t_wrap .prev a{height: 3rem; background-size: 220% auto}
  .board_view .gallerys .gallery_thumbs .swiper-wrapper .swiper-slide{height: 12rem;}

  .board_use >ul{padding: 1.5rem;}
}
@media screen and (max-width: 700px){
  .board_view .links{padding: 1rem;}
  .board_view .links li{font-size: 1.6rem;}
}
@media screen and (max-width: 640px){
  .board_view .re_end .re_t{gap: 0.4rem;}
  .board_view .re_end .re_t >ul{width: 100%; margin-left: 0; }
  .board_view .re_end .re_b{margin-top: 1.2rem; padding: 1.5rem;}
  .prev_next_link{margin-top: 6rem;}
  .prev_next_link >ul{flex-wrap: wrap; }
  .prev_next_link >ul:before{display: none;}
  .prev_next_link >ul >li >*{padding: 1.5rem 1.5rem 0.75rem 6.5rem;}
  .prev_next_link >ul >li:nth-child(2) >*{padding: 0.75rem 1.5rem 1.5rem 6.5rem; text-align: left;}
  .prev_next_link >ul >li >*:before{
    left: 1rem; width: 4rem; height: 4rem; margin-top: -2rem;
    -wbkit-transform: rotate(90deg); transform: rotate(90deg);
  }
  .prev_next_link >ul >li:nth-child(2) >*:before{
    right: auto; left: 1rem;
    -wbkit-transform: rotate(-90deg); transform: rotate(-90deg);
  }
  .prev_next_link >ul >li:nth-child(2) >*:after{content: ""; display: block; position: absolute; top: 0; left: 1rem; width: calc(100% - 2rem); height: 1px; background-color: #EEE; }

  .board_view .gallerys .gallery_thumbs{margin-top: 0.6rem;}

  .reply #reply_pass .inputs,
  .reply .reply_pass .inputs{gap: 0.6rem;}
  .reply .inputs textarea{width: calc(100% - 0.6rem - 7rem);}
  .reply  .reply_pass .inputs textarea{width: calc(100% - 0.6rem - 7rem - 0.6rem - 7rem);}
  .reply .inputs a{width: 7rem;}

  .board_use{margin-top: 5rem;}
  .board_use >strong{flex-direction: row; justify-content: flex-start; width: 100%; padding: 1.5rem 2rem;}
  .board_use >ul{width: 100%; padding: 1.5rem 2rem;}
}
@media screen and (max-width: 480px){
  .board_view .c{padding: 2rem;}
  .board_view .gallerys .gallery_thumbs .swiper-wrapper .swiper-slide{height: 9rem;}
  .board_view .gallerys .gallery_thumbs{margin-top: 0.2rem;}

  .reply_box .txts .btns{justify-content: flex-end; width: 100%; margin-top: 0.4rem;}
}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

  photo_list

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.photo_list{}
.photo_list >ul{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 4rem 2rem;}
.photo_list >ul >li{width: calc((100% - 6rem) / 4);}
.photo_list >ul >li >a{display: block; width: 100%; height: auto;}
.photo_list >ul >li >a .photo{overflow: hidden; display: block; position: relative; width: 100%; height: 0; padding-top: 69.566%; border-radius: 2rem; border: 1px solid #EEE;}
.photo_list >ul >li >a .photo >span{display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.photo_list >ul >li >a .photo >span:before{content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; backdrop-filter: blur(5px);}
.photo_list >ul >li >a .photo >span img{
  position: absolute; top: 50%; left: 50%; transform-origin: left top; width: 100%; height: 100%; object-fit: cover; object-position: top center;
  -webkit-transform: scale(1) translate(-50%,-50%); transform: scale(1) translate(-50%,-50%);
  -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
.photo_list >ul >li >a:hover .photo >span img{
  -webkit-transform: scale(1.15) translate(-50%,-50%); transform: scale(1.15) translate(-50%,-50%);
}
.photo_list >ul >li >a .label{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 0.4rem; margin-top: 2rem;}
.photo_list >ul >li >a .label i{display: block; padding: 0.95rem 1.2rem; color: #17469E; font-size: 1.7rem; font-weight: 500; line-height: 1; background-color: #F0F8FF; border-radius: 1.2rem;}
.photo_list >ul >li >a .subject{
  overflow: hidden; display: inline-block; max-width: 100%; width: auto; margin-top: 2rem; color: #1D1D1D; font-size: 2.4rem; font-weight: 700; line-height: 1.4; white-space: nowrap; text-overflow: ellipsis; background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)), linear-gradient(to right, #1D1D1D, #1D1D1D, #1D1D1D); background-size: 100% 0.1rem, 0 0.1rem !important; background-position: 100% 100%, 0 100% !important; background-repeat: no-repeat !important;
  -webkit-transition: background-size 0.3s; transition: background-size 0.3s;
}
.photo_list >ul >li >a .label + .subject{margin-top: 0.8rem;}
.photo_list >ul >li >a:hover .subject{background-size: 0 0.1rem, 100% 0.1rem !important;}
.photo_list >ul >li >a .date{display: block; width: 100%; font-size: 1.6rem; color: #555; font-weight: 400; line-height: 1.6;}

@media screen and (max-width: 1200px){
  .photo_list >ul{gap: 3rem 1.6rem;}
  .photo_list >ul >li{width: calc((100% - 4.8rem) / 4);}
  .photo_list >ul >li >a .label{margin-top: 1.6rem;}
  .photo_list >ul >li >a .label i{font-size: 1.5rem; padding: 0.8rem 1rem; border-radius: 0.8rem;}
  .photo_list >ul >li >a .subject{margin-top: 1.6rem; font-size: 2rem;}
  .photo_list >ul >li >a .date{font-size: 1.5rem;}
}
@media screen and (max-width: 1024px){
    .photo_list >ul{gap: 3rem 1.6rem;}
  .photo_list >ul >li{width: calc((100% - 3.2rem) / 3);}
}
@media screen and (max-width: 840px){
  .photo_list >ul{gap: 3rem 1.5rem;}
  .photo_list >ul >li{width: calc((100% - 3rem) / 3);}
}
@media screen and (max-width: 600px){
  .photo_list >ul{gap: 3rem 1.5rem;}
  .photo_list >ul >li{width: calc((100% - 1.5rem) / 2);}
}
@media screen and (max-width: 360px){
  .photo_list >ul{gap: 3rem 1.5rem;}
  .photo_list >ul >li{width: 100%;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

  youtube_list

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.youtube_list{}
.youtube_list >ul{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 4rem 2rem;}
.youtube_list >ul >li{width: calc((100% - 6rem) / 4);}
.youtube_list >ul >li >a{display: block; width: 100%; height: auto;}
.youtube_list >ul >li >a .photo{overflow: hidden; display: block; position: relative; width: 100%; height: 0; padding-top: 69.566%; border-radius: 2rem; border: 1px solid #EEE;}
.youtube_list >ul >li >a .photo >span{display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.youtube_list >ul >li >a .photo >span img{
  position: absolute; top: 50%; left: 50%; transform-origin: left top; width: 100%; height: 100%; object-fit: cover;
  -webkit-transform: scale(1) translate(-50%,-50%); transform: scale(1) translate(-50%,-50%);
  -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
.youtube_list >ul >li >a:hover .photo >span img{
  -webkit-transform: scale(1.15) translate(-50%,-50%); transform: scale(1.15) translate(-50%,-50%);
}
.youtube_list >ul >li >a .subject{
  overflow: hidden; display: inline-block; max-width: 100%; width: auto; margin-top: 2rem; color: #1D1D1D; font-size: 2.4rem; font-weight: 700; line-height: 1.4; white-space: nowrap; text-overflow: ellipsis; background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)), linear-gradient(to right, #1D1D1D, #1D1D1D, #1D1D1D); background-size: 100% 0.1rem, 0 0.1rem !important; background-position: 100% 100%, 0 100% !important; background-repeat: no-repeat !important;
  -webkit-transition: background-size 0.3s; transition: background-size 0.3s;
}
.youtube_list >ul >li >a:hover .subject{background-size: 0 0.1rem, 100% 0.1rem !important;}
.youtube_list >ul >li >a .date{display: block; width: 100%; font-size: 1.6rem; color: #555; font-weight: 400; line-height: 1.6;}

@media screen and (max-width: 1200px){
  .youtube_list >ul{gap: 3rem 1.6rem;}
  .youtube_list >ul >li{width: calc((100% - 4.8rem) / 4);}
  .youtube_list >ul >li >a .subject{margin-top: 1.6rem; font-size: 2rem;}
  .youtube_list >ul >li >a .date{font-size: 1.5rem;}
}
@media screen and (max-width: 1024px){
   .youtube_list >ul{gap: 3rem 1.6rem;}
  .youtube_list >ul >li{width: calc((100% - 3.2rem) / 3);}
}
@media screen and (max-width: 840px){
  .youtube_list >ul{gap: 3rem 1.5rem;}
  .youtube_list >ul >li{width: calc((100% - 3rem) / 3);}
}
@media screen and (max-width: 600px){
  .youtube_list >ul{gap: 3rem 1.5rem;}
  .youtube_list >ul >li{width: calc((100% - 1.5rem) / 2);}
}
@media screen and (max-width: 360px){
  .youtube_list >ul{gap: 3rem 1.5rem;}
  .youtube_list >ul >li{width: 100%;}
}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

  pdf

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.pdf{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch; gap: 4.5rem; margin-top: 4rem;}
.pdf .pdf_menu{width: 30rem; height: 100%;}
.pdf .pdf_menu >strong{display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 1rem; width: 100%; height: 6.6rem; padding: 0 2.4rem; color: #fff; font-size: 1.7rem; font-weight: 500; line-height: 1.5; background-color: #17469E; border-radius: 0.8rem;}
.pdf .pdf_menu >strong em{display: block; margin-left: auto; font-weight: 400;}
.pdf .pdf_menu >ul{overflow-y: auto; display: block; width: 100%; height: calc(100% - 1.2rem - 6.6rem); margin-top: 1.2rem; border-bottom: 1px solid #aaa;}
.pdf .pdf_menu >ul >li{}
.pdf .pdf_menu >ul >li.on{}
.pdf .pdf_menu >ul >li >a{
  display: block; position: relative; width: 100%; height: auto; padding: 1.575rem 2.4rem; color: #555; font-size: 1.7rem; font-weight: 500; line-height: 1.5; background-color: #fff; border-bottom: 1px solid #D8D8D8;
  -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
.pdf .pdf_menu >ul >li.on >a{padding: 1.575rem 5rem 1.575rem 2.4rem;}
.pdf .pdf_menu >ul >li >a:after{
  content: ""; opacity: 0; visibility: hidden; display: block; position: absolute; top: 50%; right: 2rem; width: 1.6rem; height: 1.6rem; margin-top: -0.8rem; background: url(../../../images/site/kor/common/board_img06.svg) no-repeat center center / 100% auto;
  -webkit-transition: all 0.2s linear; transition: all 0.2s linear;
}
.pdf .pdf_menu >ul >li.on >a:after{opacity: 1; visibility: visible;}
.pdf .pdf_menu >ul >li.on >a{color: #17469E; background-color: #F3F5FA; border-color: #111;}
.pdf .pdf_menu >ul >li >a:hover{background-color: #F3F5FA;}
.pdf .pdf_view{overflow: hidden; flex: 1; height: 100%;}
.pdf .pdf_view iframe{height: 100% !important;}

@media screen and (max-width: 1024px){
  .pdf{margin-top: 3rem; gap: 2rem;}
  .pdf .pdf_menu{width: 24rem;}
  .pdf .pdf_menu >strong{height: 5.3rem; padding: 0 2rem;}
  .pdf .pdf_menu >ul{height: calc(100% - 1rem - 5.3rem); margin-top: 1rem;}
  .pdf .pdf_menu >ul >li >a{padding: 1.4rem 2rem; font-size: 1.6rem;}
  .pdf .pdf_menu >ul >li.on >a{padding: 1.4rem 4.4rem 1.4rem 2rem;}
  .pdf .pdf_menu >ul >li >a:after{right: 1.6rem;}
}
@media screen and (max-width: 840px){
  .pdf .pdf_menu{width: 20rem;}
}
@media screen and (max-width: 740px){
  .pdf .pdf_menu{display: none;}
}
@media screen and (max-width: 640px){
  .pdf{height: auto !important;}
  .pdf .pdf_view iframe{height: 65vh !important;}
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////

    no_board_data
    데이터 없는 경우

/////////////////////////////////////////////////////////////////////////////////////////////////////////// */
.no_board_data{padding: 8rem 0; font-size: 1.8rem; text-align:center; border-top: 1px solid #2D2D2D; border-bottom:1px solid #EEE;}

@media screen and (max-width:640px){
  .no_board_data{padding: 6rem 0;}
}