@charset "utf-8";
@import "navi_n.css";

/* DARKMODE */
.dark_on {
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(5%, #1e1e20), color-stop(38%, #1e1f21));
  background-image: -o-linear-gradient(top, #1e1e20 5%, #1e1f21 38%);
  background-image: linear-gradient(to bottom, #1e1e20 5%, #1e1f21 38%);
}
.dark_on .slidemenu li a > .con, .dark_on .cont03 .wrap .swiper .swiper-container .swiper-slide .text, .dark_on .cont03 .swiper-pagination-bullet, .dark_on .cont05 .swiper-pagination-bullet, .dark_on .sub_head .breadcrumb li, .dark_on .sub_head .breadcrumb li.selected {color: #fff;}
.dark_on .swiper-pagination-bullet {background: #fff;}
.dark_on .cont03 .swiper-pagination-bullet-active {color: #ffef10;}
.dark_on .cont03 .swiper-pagination-bullet-active::after {background-color: #ffef10;}
.dark_on .cont05 .swiper-pagination-bullet-active {color: #ffef10;}
.dark_on .cont05 .swiper-pagination-bullet-active::after {background-color: #ffef10;}
.dark_on .swiper-btnWrap .swiper-button-prev, .dark_on .swiper-btnWrap .swiper-button-next {color: #fff;border: 1px solid #fff;}
.dark_on .swiper-btnWrap .swiper-button-prev:hover, .dark_on .swiper-btnWrap .swiper-button-next:hover {color: #ffef10;border: 1px solid #ffef10;}
.dark_on .footer .f_text li p {color: inherit;}
.dark_on .gnb .menu2, .dark_on .headmenu.sticky .nav_btn { /*background: #ff6939;*/ }
.dark_on .sub_head .breadcrumb li+li::before {color: #ff6939;}
.dark_on #btn_top i {color: #fff;border: 2px solid #fff;background-color: #000;}

/* main */
.dark_on .cont01, .dark_on .cont03, .dark_on .cont05 {  background: inherit; }
.dark_on .cont02, .dark_on .cont04, .dark_on .sub_footwrap { background-color: #414141; }

/* Sub */
.dark_on .sub_con_01 h2 {color: #fff;}
.dark_on .row.event_bg .icon01::after {filter: invert(1);}
.dark_on .row.event_bg .icon02::after {filter: invert(1);}
.dark_on .row.event_bg .icon03::after {filter: invert(1);}
.dark_on .row.event_bg .icon04::after {filter: invert(1);}
.dark_on .row.event_bg .icon05::after {filter: invert(1);}
.dark_on .row.event_bg .icon06::after {filter: invert(1);}
.dark_on .bg_txt0402 {background: #1e1f21; color: #fff; padding-bottom: 1.5rem;}
.dark_on .bg_txt0402 .txt0402 {color: #000;}
.dark_on .top_wrapper, .dark_on .top_wrapper.sub02, .dark_on .top_wrapper.sub03 {background: #1e1f21;}
.dark_on p { color: #fff; }
.dark_on p .bg_txt0204{ color: #000; }
.dark_on .point { color: #fff; }
.dark_on .caption { color: #e7e7e7;}
.dark_on .contwrap h3 {color: #fff;}
.dark_on .row blockquote {color: #fff;}
.dark_on .contwrap h3::after {background-color: #878787;}
.dark_on .swiper-button-next, .dark_on .swiper-button-prev {border: 1px solid #fff;color: #fff;}
.dark_on .swiper-button-next:hover, .dark_on .swiper-button-prev:hover {border: 1px solid #2ca6df; color: #2ca6df;}
.dark_on .sub_foot .relation .rel_tit, .dark_on .sub_foot .relation .rel_tit::after {background-color: #ff6939;}

.dark_on .contents .row.bg1 h2, .dark_on .contents .title h3 {color: #fff;}
.dark_on .contents h2 div span.q:nth-child(1) {-webkit-text-stroke: 3px #fff;}
.dark_on .contents h2 div span.q:nth-child(2) {color: #fff;}

.dark_on h3, .dark_on .flex_mod h4, .dark_on .flex_mod h5 {color: #fff;}
.dark_on .sub_foot .relation .rel_tit {color: #fff;}
.dark_on .sub_foot .relation .rel_tit::before {filter: invert(1);}
.dark_on .sub_foot .relation li p {color: #fff;}
.dark_on .sub_foot .relation .swiper-slide p {color: #fff;}
.dark_on .source {background: transparent;border: 1px solid #fff;}
.dark_on .source strong {color: #ff6939;}
.dark_on .sub_con.sub2 .row h3 {color: #fff;}
.dark_on .dialog_box {border: 4px solid #fff;color: #fff;background-image: -webkit-gradient(linear, left top, left bottom, color-stop(5%, #1e1e20), color-stop(38%, #1e1f21));background-image: -o-linear-gradient(top, #1e1e20 5%, #1e1f21 38%);background-image: linear-gradient(to bottom, #1e1e20 5%, #1e1f21 38%);}
.dark_on .dialog_box.bottom:before {border-color: #fff transparent transparent transparent;}
.dark_on .dialog_box.bottom:after {border-color: #000 transparent transparent transparent;}
.dark_on .dialog_box span {background: #fff;color: #000;}
.dark_on .magazine .row h3 {box-shadow: #ff6939 0px -14px 0px inset;}
.dark_on .sub_con .event_txt p {color: #fff;}
.dark_on .row.event_info p {color: #fff;}
.dark_on .row.event_info h3 {color: #73c4db; border-bottom: 2px solid #73c4db;}
.dark_on .sub_con .row .roundbox {  background: #73c4db;}
.dark_on .quizwrap h3 {  background: #f4b2bb;}
.dark_on .list_wrap .inner .list h3, .dark_on .list_wrap .inner .list ul li span {color: #fff;}
.dark_on .list_wrap .inner .list h3 {border-bottom: 15px solid rgb(255 105 57);}

.dark_on .sub_full.event {filter: invert(1);}
.dark_on .sub_full h3 {color: #000;}
.dark_on .row.event_bg .fwb {color: #000;}
.dark_on .row.event_bg p {color: #000;}
/*추가*/
.dark_on .container .imgwrap span .m_text{color: #fff;}
.dark_on .sub_con_01 .write_info.one {color: #fff;}
.dark_on .bg_txt0404 {color: #000;}
.dark_on .cont05 .wrap .swiper .swiper-container .swiper-slide .text .depth {color: #A6A5A5;}
.dark_on .row p.box {color: #fff;border:1px solid #fff;}
.dark_on .sub_con_01 .write_info.one span.text2, .dark_on .sub_con_01 .write_info.one span.text {border:2px solid #fff;}
.dark_on .sub_foot .relation p b {color: #ffef10;}
.dark_on .contwrap .cat_tit {color: #fff;border: 1px solid #fff;max-width: 500px;margin: 0 auto;padding: 10px;}


.dark_on .sub_txt i {filter: invert(1);}
/* ZOOMMODE */
.zoom .contents  { zoom: 110%; }
.zoom .contents img { zoom: 100% !important; }
.zoom .cont03 .wrap .swiper {padding-left: 75px;}

* {-webkit-tap-highlight-color: rgba(255, 255, 255, 0);}
#wrap {position: relative; overflow-x: hidden;}
/* 본문바로가기 */
#skip_menu a { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 0; font-size: 0; line-height: 0; overflow: hidden; z-index: 10000; }
#skip_menu a:focus,
#skip_menu a:active { height: auto; background-color: #000; font-size: 1rem; color: #fff; font-weight: 500; text-align: center; line-height: 2rem; }

.not_scroll {position: fixed; overflow: hidden; width: 100%; height: 100% }
.mo_bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 1);
  z-index: 120;
}
.container {position: relative;max-width: 1280px;height: 100%;margin: 0 auto;}
.container:after {content:'';clear: both;display: block;}
.container2 {position: relative; width: 100%; height: 100%; margin: 0 auto; }

/*추가*/
.gnb .menu .gnb__list .gnb__depth-item:hover a {
  color: #4890E8;
  text-decoration: underline;
  text-underline-position: under;
}


.gnb__list .gnb__item>a {
  font-size: 32px;
  font-weight: 800;
  /* padding: 45px 0 20px; */
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.gnb_m_list .tab1 {color: #538349;}
.gnb_m_list .tab2 {color: #a67b5f;}
.gnb_m_list .tab3 {color: #7b5ca0;}

.gnb__item .tab1 {
  background: #538349;
}

.gnb__item .tab2 {
  background: #a67b5f;
}

.gnb__item .tab3 {
  background: #7b5ca0;
}

/* header */
.headmenu {position: absolute;left: 0;top: 0;z-index: 400;width: 100%;}
.header {position: fixed;background:#fff; display: flex;justify-content: space-between;align-items: center;width: 100%;margin: 0 auto;z-index: 100;padding:20px;border-bottom:1px solid #d2d2d2;box-shadow:0px 0 10px 0px #353535;}
.header__tit .header__tit-txt { float: left;padding-left: 70px; color: #304292;font-family: 'yg-jalnan';}
.header__tit .header__tit-txt img {width: 250px;}
.header__tit .logo__txt {font-size: 18px;float: left;margin: 5px 0 0 15px;color: #304292;font-weight: 600;padding-left: 15px;}
.header__tit .logo__txt span {font-weight: 300;color: #767575;font-size: 16px;}
.header__util {margin-right: 8.5%;}
.header__util:after { display: block; clear: both; content: ""; }
.header__util > a { color: #000; border: 2px solid #000; padding: 6px 12px; border-radius: 18px; font-size: 16px; -webkit-transition: 0.2s; transition: 0.2s; font-weight: 400; }
.header__util > a:hover, .header__util > a.active { color: #fff; background: #000; font-weight: 400; }
.header__util > a.dark:hover, .header__util a.dark.active {border: 3px solid #000;width: 40px;display: inline-block;padding: 0;filter: invert(1);border-radius: 50%;filter: drop-shadow(1px 1px 1px black);}
.header__util > a.size:hover, .header__util a.size.active {border: 3px solid #000;width: 40px;display: inline-block;padding: 0;filter: invert(1);border-radius: 50%;filter: drop-shadow(1px 1px 1px black);}
.header__util > a.size:hover, .header__util > a.size.active {background: #000;}
.header__util > a+a { margin-left: 0.3rem; }
.headmenu .nav_btn {position: fixed;top: 0;right: 4%;/* height: 82px; */padding: 32px;font-size: 18px;cursor: pointer;transition: 0.3s;z-index: 500;color: #000;font-weight: 600;z-index: 300;/*border-bottom-left-radius: 25px;*/background: transparent;}

/*추가*/

.headmenu .nav_btn {
  display: inline-block;
  width: 80px;
  /*height: 80px;*/
  background-image: url("../image/common/menu.png");
  background-size: 40px;
  background-repeat: no-repeat;
  background-position: center;
  text-indent: -9999px;
  overflow: hidden;
  cursor: pointer;
}
.headmenu.active .nav_btn {
  background-image: url("../image/common/menu_close.png");
  background-size: 28px;
}

/*.headmenu.active .nav_btn {color: #000;}*/
/*.headmenu.active.sticky .nav_btn {color: #fff;}
.headmenu.sticky .nav_btn { background: #2762AE;}*/
.header__util .dark, .header__util .size {border: 3px solid #000;width: 40px;display: inline-block;padding: 0;filter: invert(1);border-radius: 50%;}
.header__util .dark:hover, .header__util .size:hover {border: 3px solid #000;width: 40px;display: inline-block;padding: 0;filter: invert(1);border-radius: 50%;}
.headmenu.active { position: fixed; }
.headmenu.active .header__tit .logo__txt {color: #000;/*border-left: 2px solid #000;*/}
/*.headmenu.active .header__tit .header__tit-txt img {filter: invert(1);}*/
.headmenu.active .header__util .last_view {color: #000;border: 2px solid #000;margin-top:10px;}
.headmenu.active .header__util .last_view:hover {color: #fff;background: #000; font-weight: 400;}
.headmenu.active .header__util > a.dark, .headmenu.active .header__util > a.size {filter: invert(1);}
.headmenu.active .header__util > a.dark:hover, .headmenu.active .header__util > a.dark.active, .headmenu.active .header__util > a.size:hover, .headmenu.active .header__util > a.size.active {filter: drop-shadow(1px 1px 1px black);}
.headmenu.sticky .link {display: block;}

.banner_pc {display: block;}
.banner_mo {display: none;}

#gnb.active {transform: translateY(0);opacity: 1;}
.gnb .menu2 {display: none;}
.gnb .menu {margin: 20px auto;max-width: 1280px;}
.gnb .menu .gnb__list {display: flex;justify-content: space-around;text-align: center;}
.gnb .menu .gnb__list .gnb__depth-item {margin-top: 10px;border-bottom:1px solid #ddd; padding-bottom: 10px;}
.gnb .menu .gnb__list .gnb__depth-item:nth-child(1) {border-top:1px solid #ddd;padding-top: 10px;}
.gnb .menu .gnb__list .gnb__depth-item a {display: block;font-size: 21px;}
/*.gnb .menu .gnb__list .gnb__depth-item:hover a {text-decoration: underline;text-underline-position: under;}*/
/*추가*/
.h_menu {font-size: 1.6rem;font-weight: 600;}
.h_menu ul li{display: inline-block;padding-left: 20px;}
.h_menu ul li span {font-size: 1.7rem;color:#ddd;font-weight: 100;padding-left:13px;}
.h_menu ul li a {color: #538349;}
.h_menu ul li a.menu02{color: #a67b5f;}
.h_menu ul li a.menu03{color: #7b5ca0;}
.gnb .menu .gnb__list .gnb__depth-item:hover a {color: #538349;}
.gnb .menu .gnb__list .gnb__item:nth-child(2) .gnb__depth-item:hover a {color: #a67b5f;}
.gnb .menu .gnb__list .gnb__item:nth-child(3) .gnb__depth-item:hover a {color: #7b5ca0;}
.gnb .menu .gnb__list .gnb__item:nth-child(4) .gnb__depth-item:hover a {color: #9660a2;}

.gnb__list .gnb__item > a {font-size: 32px;font-weight: 800;/* padding: 45px 0 20px; */background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.gnb__item .tab1 {background: #538349;}
.gnb__item .tab2 {background: #a67b5f;}
.gnb__item .tab3 {background: #7b5ca0;}
.gnb__item .tab4 {background: #9660a2;}

.pc_gnb {overflow: hidden;padding: 24px 0;margin-right: 15px;}
.pc_gnb > ul {width: 760px;float: left;background: rgb(255 255 255 / 80%);}
.navigation a.last_view {font-size: 15px;float: right;margin-top: 3px;}
.vol_wrap .gnb_close {display: none;position: absolute;left: 0;padding: 5px 10px;background: #fff;top: -5px;}
.vol_wrap .gnb_close.active {display: block;}
#gnb {width: 100%;position: fixed;padding: 127px 0 50px;background: #fff;overflow: hidden;z-index: 50;top: 0;transform: translateY(-100%);opacity: 0;transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out;}
.top_util .btn_search {text-indent: -9999px;display: inline-block;width: 19px;height: 19px;overflow: hidden;background: url(../img/common/btn_search.png) no-repeat 50% 50%;}
.pc_gnb > ul > li {float: left;/* padding-left: 15px; */text-align: center;width: 20%;}
.pc_gnb > ul > li > a {font-size: 20px;}
.pc_gnb > ul > li .submenu {padding-top: 30px;display: none;}
.pc_gnb > ul > li .submenu ul li {padding-bottom: 15px;line-height: 1.5;letter-spacing: -1px;}
.pc_gnb ul li > a {font-weight: 500;}

.pc_gnb ul li a > .fwb {color: #d22144;}
.submenu ul li > a  {font-weight: 500;/* color: #7d7d7d; */}
.submenu li a:hover {border-bottom: 4px solid #d22144;}

.m_gnb {display: none;} 
.m_gnb {margin: 45px 10px 0;}
.m_gnb li a {color: #fff;}
.m_gnb > li > a {color: #fff;font-size: 20px;}
.m_submenu {display: none;margin: 0 30px;}
.m_submenu li {margin-bottom: 15px;}
.m_gnb .vol_wrap .date {color: #fff;}

.m_vol_wrap {z-index: 200;width: 100%;background: #353682;bottom: 0;clear: both;overflow: hidden;position: fixed;text-align: center;padding: 7px 0;display: none;font-size: 14px;}
.m_vol_wrap .date, .m_vol_wrap .last_view {color: #fff;}
.m_vol_wrap .date {float: left;margin-left: 15px;}
.m_vol_wrap .last_view {float: right;margin-right: 15px;}




.header .btm .navigation > ul > li > a.last_view {font-size: 15px;padding: 22px 19px;}
.header .btm .navigation > ul > li > a:after {content: "";display: block;}
.header .btm .navigation > ul > li > a.last_view:after {display: none;}
/* .header .btm .navigation > ul > li a:focus:after {position: absolute;left: 0;bottom: -11px;width: 100%;height: 7px;background-color: red;} */
.header .btm .navigation > ul > li > a:hover:after {position: absolute;left: 0;bottom: -6px;width: 100%;height: 7px;background-color: red;}
.header .btm .navigation > ul > li > a.last_view:hover:after {display: none;}

.header .btm .navigation > ul > li > a.special {padding: 30px 15px 30px 15px;margin-left: 90px}
.header .btm .navigation > ul > li > a.special span {display: inline-block; padding: 8px 30px; background-color: #5870a9; font-size: 17px; font-weight: bold; border-radius: 30px; line-height: 20px; color: #dcffff;}
.header .btm .navigation > ul > li > a.special .c_fff {color: #fff;}
/* .header .btm .navigation > ul > li > a.special:after {bottom: 0;} */

.spe-ul{margin-left: 90px}

.header .btm .navigation .service {position: absolute; top: 30px; right: -190px; color: #fff; font-size: 0;  line-height: 22px; padding-left: 10px;}
.header .btm .navigation .service:after {bottom: 0px; left: 10px;}
.header .btm .navigation .service span {display: inline-block; padding: 8px 30px; background-color: #323b50; font-size: 17px; font-weight: bold; border-radius: 30px; line-height: 20px;}

.header .btm .navigation > ul > li .depth2 {display: none;visibility: visible;position: absolute;left: 0;top: 72px;width: 210px;background-color: rgba(0,0,0,.8);padding: 15px 20px;z-index: 100;} /* depth2 */
.header .btm .navigation > ul > li .depth2 > li > a {display: block; position: relative; width: 100%; padding: 7px 0; font-size: 17px; color: #fff; transition: all .4s;} /* depth2 */
.header .btm .navigation > ul > li .depth2 a:before {content: ""; display: none; position: absolute; left: 0; top: 50%; width: 10px; height: 2px; background-color: #ed6364; transform: translateY(-50%);}
.header .btm .navigation > ul > li .depth2 > li > a:hover,
.header .btm .navigation > ul > li .depth2 > li > a:focus {color: #f76869; }
.header .btm .navigation > ul > li:hover > a,
.header .btm .navigation > ul > li:focus > a {color: #cd1719; }
.header .btm .navigation > ul > li:hover .depth2,
.header .btm .navigation > ul > li:focus .depth2 {display: block;}
.header .btm .navigation > ul > li .depth2 > li:hover a,
.header .btm .navigation > ul > li .depth2 > li:focus a {padding-left: 18px;  }
.header .btm .navigation > ul > li .depth2 > li:hover a:before,
.header .btm .navigation > ul > li .depth2 > li:focus a:before {display: inline-block; }
.header .btm .navigation > ul > li:hover > a:after,
.header .btm .navigation > ul > li:focus > a:after {display: block; }
.header .btm .mo_btn {display: none; position: absolute; left: 20px; top: 50%; transform: translateY(-50%);}
.header .btm .mo_btn:after {content: "\e91c"; display: inline-block; font-family: xeicon; font-size: 40px;}


.header .btm .navigation > ul > li:hover > a:after,
.header .btm .navigation > ul > li:focus > a:after {display: block; }
.header .btm .mo_btn {display: none; position: absolute; left: 20px; top: 50%; transform: translateY(-50%);}
.header .btm .mo_btn:after {content: "\e91c"; display: inline-block; font-family: xeicon; font-size: 40px;}
.header .date {font-weight: 600;font-size: 14px;border-left: 2px solid #000;padding-left: 12px;color: #030000;}
.header .vol_wrap {float: left;padding: 16px 0;}
.search_wrap {position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
.search_wrap .ico {display: block; cursor: pointer;}
.search_wrap .ico:after {content: "\e97a"; display: inline-block; font-family: xeicon; font-size: 35px;}
.search2::before {content: "\e97a"; display: inline-block; font-family: xeicon; font-size: 20px; margin-right: 5px;color:#243350}
.search_inner{background-color:#fff; border-radius: 30px; height:30px}

header .outline {margin: 0 auto;height: 90px;}
header .outline > div { display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; height: 100%; }
/* footer */
.footer {position: relative; padding: 50px 0; background-color: #eeebe8; z-index: 101; }
.f_top {display: flex;justify-content: space-between;}
.related {display: flex;flex-wrap: wrap;justify-content: flex-end;}
.footer > * {font-size: 14px; color: #222; line-height: 1.4; }
.footer h2 {position: absolute;left: 0;top: 0;width: 240px;height: 60px;background: url('../image/common/f_logo.jpg') no-repeat;background-size: 240px 60px;}
.footer h2 > a {display: block; width: 100%; height: 100%; }
.footer .f_text {padding-left: 300px;  }
.footer .f_text ul {position: relative; }
.footer .f_text ul li {margin-bottom: 5px; }
.footer .f_text li span {display: inline-block;font-weight: 600;}
.footer .f_text li span:after {content: ""; display: inline-block; width: 1px; height: 10px; margin: 0 10px; background-color: #b0b0b0; }
.footer .f_text li p {display: inline-block; vertical-align: top;}
.footer .f_text .copyright {margin-top: 10px; font-size: 12px; color: #878787; line-height: 1.3; }
.footer .f_sns {position: absolute; right: 0; top: 0; }
.footer .f_sns ul {font-size: 0;}
.footer .f_sns li {display: inline-block; width: 44px; height: 44px; margin-left: 10px;}
.footer .f_sns li:first-child {margin-left: 0; }
.footer .f_sns li a {display: block; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: 100% auto;}
.footer .f_sns li.f_sns01 a {background-image: url('../image/common/f_sns01.png'); }
.footer .f_sns li.f_sns02 a {background-image: url('../image/common/f_sns02.png'); }
.footer .f_sns li.f_sns03 a {background-image: url('../image/common/f_sns03.png'); }
.footer .f_sns li.f_sns04 a {background-image: url('../image/common/f_sns04.png'); }
.footnote{
  font-size: 14px
}
.wMain .quickMenu {
  margin-top: 980px;
}
.wSub .quickMenu {
  margin-top: 355px;
}

.img_tit{font-size: 18px; font-weight: bold;text-align: left}

/* 지난호보기 */
#last_view {text-align: right;position: relative;margin-top:50px;}
#last_view .scroll {width: 200px;padding: 8px 20px 8px 8px; font-size: 0.95em; border: 1px solid rgba(0, 0, 0, 0.2);appearance: none; -webkit-appearance: none; -moz-appearance: none; background: url(../image/common/scroll_arr.png) no-repeat 90% center; color: #000; text-align: left; height: auto; text-indent: 8px;cursor: pointer;}
#last_view .scroll::-ms-expand { display: none; }
#last_view .scroll option:checked { background-color: #684718; color: #fff; }
#last_view .scroll:hover, #last_view .scroll:focus { outline: none; box-shadow: 0 0 5px rgba(104, 71, 24, 0.5); }
#last_view .scroll option {color: #fff; background: #000;}

.site-side {display: flex;flex-direction: column;gap: 10px;position: fixed;right: 15px;top: 265px;z-index: 20;}
.site-side .btn--function {background-color: #FEFEFE;background-size: cover;width: 56px;height: 56px;text-align: center;box-sizing: border-box;color: #fff;border-radius: 50%;cursor: pointer;}
/*.sns_box button {display: block;float: right;text-align: center;margin-right: 1rem;width: 56px;height: 56px;opacity: 0;visibility: hidden;cursor: pointer;}
.sns_box button.share {background: #FEFEFE;color: #fff;border-radius: 50%;margin: 0;opacity: 1;visibility: visible;border: 1px solid #BAB9B9;}
.sns_box button img { max-width: 100%; width: 100%; }
.sns_box.on button { opacity: 1; visibility: visible;}
.sns_box {position: fixed;right: 15px;z-index: 64;opacity: 1;-webkit-transition: 0.5s;transition: 0.5s;top: 463px;}
.sns_box.fix {bottom: 19.4rem; opacity: 1;}
.sns_box.on {width: 44rem; opacity: 1;}
.page_wrap {display: flex;border: 1px solid #b1b1b1;flex-direction: column;background: #fff;}
.page_wrap .btn_page {border-bottom: 1px solid #b1b1b1;margin-bottom: 0;box-sizing: border-box;width: 56px;height: 56px;}
.page_wrap .btn_page:last-child {border-bottom: none;}
.page_wrap .page_txt {display: none;}
.btn_page i {color: #515151;}*/
/* IR 효과 */
.ir_su {overflow: hidden; position:absolute; width:0; height:0; line-height:0; text-indent:-9999px;} /* 대체 텍스트가 아닌 접근성을 위한 숨김 텍스트를 제공할 때 */

/* quickMenu */
/*.quickMenu {
	position: absolute;
	top: 28px;
	right: 50%;
	width: 105px;
	margin-right: -750px;
	z-index: 101;
}
.quickMenu.fixed {
	position: fixed;
	top: 158px;
	margin-top: 15px;
}
.quickMenu ul {
	padding: 10px 0 20px;
	border: 1px solid #c2c2c2;
	border-radius: 50px;
	background-color: #fff;
}
.quickMenu ul li {
	width: 80%;
	margin: 0 auto !important;
	text-align: center;
}
.quickMenu ul li a {
  display: inline-block;
  width: 100%;
  margin: 10px 0;
  padding-top: 54px;
  background-repeat: no-repeat;
  background-position: top center;

  font-size: 14px;
  text-align: center;
  color: #333;
  line-height: 1.2;
 }
.quickMenu ul li.q1 a {
  background-image: url('../image/common/quick_1.png');
    background-size: 39px 39px;
}
.quickMenu ul li.q2 a {
  background-image: url('../image/common/quick_2.png');
  background-size: 48px 39px;
}
.quickMenu ul li.q3 a {
  background-image: url('../image/common/quick_3.png');
  background-size: 29px 39px;
}
.quickMenu ul li.q4 a {
  background-image: url('../image/common/quick_4.png');
  background-size: 27px 40px;
}
.quickMenu .top_btn {
  display: block;
  width: 34px; height: 34px;
  margin: -17px auto 0;
  background-image: url('../image/common/quick_top.png');
  text-indent: -9999px; text-align: center;
}*/

.mo_links {
  display: none;
}

.mo_util {opacity: 0;}
/* common */
.mhid {display: block; }
.visual_mhid {display: inline-block; }
.mshow {display: none; }
.visual_mshow {display: none; }
.mhid_960 {display: block; }
.mshow_960 {display: none; }

#btn_top {
	visibility: hidden;
	position: fixed;
	bottom: 75px;
	right: 15px;
	z-index: 200;
	cursor: pointer;
	visibility: visible;
	opacity: 0;
	transition: visibility 0s linear 0s, opacity 300ms;
}
#btn_top.btn_top_visible {
	visibility: visible;
	opacity: 1;
	transition: visibility 0s linear 0s, opacity 300ms;
}
#btn_top i {
  width: 44px;
  height: 44px;
  text-align: center;
  line-height: 40px;
  background-color: #ffffff;
  border-radius: 50%;
  border: 2px solid #000;
  box-sizing: border-box;
}


@media screen and (max-width: 1280px) {
  .banner_pc {display: block;}
  .banner_mo {display: none;}
/*     .container {padding: 0 2%; } */
    .search_wrap {right: 20px; }
    .footer {padding: 20px 20px 30px; }
   
    .header .btm .navigation > ul > li > a { margin: 0 5px; }
    .header .btm .navigation > ul > li .depth2 {left: 5px; }
    .header .btm .navigation > ul > li.service span {font-size: 16px; }
    .header .btm .navigation > ul > li.service > a:after {bottom: 2px; left: 0;}
    .header__util {display:none;}
    .h_menu {display: none;}
}

@media screen and (max-width: 1182px) {
  .container {padding: 0 10px; }

  .quickMenu {
    display: none;
  }

  /* 모바일 퀵메뉴 링크 */
  .mo_links {
    display: block;
    margin: 20px 0;
    font-size: 0;
  }
  .mo_links a {
    display: inline-block;
    width: 33.3333%;
    margin: 10px 0;
    padding-top: 70px;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 60px 60px;
    font-size: 14px;
    text-align: center;
    color: #333;
    line-height: 1.2;
  }
  .mo_links .link1 {
    background-image: url('../image/common/quick_1.png');
  }
  .mo_links .link2 {
    background-image: url('../image/common/quick_2.png');
  }
  .mo_links .link3 {
    background-image: url('../image/common/quick_3.png');
  }
  .mo_links .link4 {
    background-image: url('../image/common/quick_4.png');
  }
}

@media screen and (max-width: 1024px) {
  .header__util {display:none;}
  .h_menu {display: none;}
  .site-side {display: none;}
  .header__tit .logo__txt {display: none;}
	.headmenu .header__util {/* display: none; */opacity: 0;}
  .container { width: 100%; }
  .gnb__list .gnb__item > a {font-size: 16px;}
  .gnb .menu .gnb__list .gnb__depth-item a {font-size: 16px;}
  .gnb .menu .gnb__list .gnb__depth-item {margin-top: 5px;}
  .header .btm .navigation > ul > li > a.special{margin-left: 5px}
  .header .btm .navigation {/* display: none; */left: 0;right: auto;width: 100%;}
  .submenu ul li > a {color: #fff;}
  .header .btm h1 {width: 116px;/* height: 40px; */margin: 0 auto;background-size: 100% auto;float: none;}
  .header .btm .mo_btn {display: block; }
  .pc_gnb > ul > li {float: none;text-align: left;width: 100%;}
  .pc_gnb > ul > li > a {color: #fff;float: none;}
  .mobile .header .btm .mo_btn:after {content: "\e921";}
  .mobile .pc_gnb > ul > li {display: block;width: 100%;float: none;text-align: left;}
  .mobile .header .btm .navigation > ul > li > a {padding: 10px; color: #fff; }
  .mobile .header .btm .navigation > ul > li.service > a {padding: 10px; margin: 0 5px; color: #fff; }
  .mobile .header .btm .navigation > ul > li.service span {display: block; padding: 0; background-color: transparent; border-radius: 0; font-size: 20px;}
  .mobile .header .btm .navigation > ul > li:hover .depth2 {display: block;}
  .mobile .header .btm .navigation > ul > li {float: none; width: 100%;}
  .mobile .header .btm .navigation > ul > li:hover > a {color: #f93b3d; }
  .mobile .header .btm .navigation > ul > li:hover > a:after,
  .mobile .header .btm .navigation > ul > li:focus > a:after {display: none; }
  .mobile .header .btm .navigation > ul > li .depth2 {display: none; position: relative; left: 20px; right: 20px; top: 0; width: auto; background-color: transparent; padding: 5px 20px;} /* depth2 */
  .mobile .header .btm .navigation > ul > li:hover .depth2 {display: none; } /* depth2 */
  .mobile .header .btm .navigation > ul > li .depth2 > li > a {display: block; position: relative; width: 100%; padding: 7px 0 7px 20px; font-size: 17px; color: #fff;} /* depth2 */
  .mobile .header .btm .navigation > ul > li .depth2 a:before {display: block; background-color: #fff;}
  .mobile .header .btm .navigation > ul > li .depth2 li:hover a:before {background-color: #f76869;}
  .mobile .header .btm .navigation > ul > li .depth2 > li > a:hover,
  .mobile .header .btm .navigation > ul > li .depth2 > li > a:focus {color: #f76869; }


  .header .btm .navigation .service {
    display: block;
    position: static;
    top: 20px;
    right: auto;
    padding: 10px 10px 30px;
    margin: 0 5px;

  }

  .header .btm .navigation > ul > li > a.special span,
  .header .btm .navigation .service span {
    display: block;
    padding: 0;
    background-color: transparent;
    border-radius: 0;
    font-size: 20px;
    line-height: 100%;
  }

	.header .btm {padding: 15px 0;}
	.header .vol_wrap {display: none;}
	.navigation .vol_wrap {display: block;}
	.pc_gnb {float: none;width: 100%;margin-right: 0;background: none;display: none;}
}

@media screen and (max-width: 960px) {
  .related {justify-content: center;}
  .f_top {flex-direction: column;}
  /*main {padding-top: 17.6vw; }*/
  .footer h2 {position: relative; left: 50%; transform: translateX(-50%); width: 180px; height: 45px; background-size: 180px 45px;}
  .footer .f_text {padding-left: 0; text-align: center; padding-top: 80px; }
  .footer .f_sns {width: 100%; left: 50%; top: 65px; transform: translateX(-50%); text-align: center;}

  .mhid_960 {display: none; }
  .mshow_960 {display: block; }
  .header__util {display:none;}
  .h_menu {display: none;}
  .header__tit .logo__txt {display: none;}
}
@media screen and (max-width: 768px) {
  .related {justify-content: center;}
  #last_view {order: -1;text-align: center;margin-top:20px;}
  #btn_top {display: none;}
  .banner_pc {display: none;}
  .banner_mo {display: block;}
  
  .mhid {display: none; }
  .visual_mhid  {display: none; }
  .mshow {display: block; }
  .visual_mshow {display: inline-block; }

  #gnb.active {height: 100%;}
  .headmenu.active .mo_util {opacity: 1;}
  .mo_util .logo__txt {display: block;margin-bottom: 5px;font-size: 16px;font-weight: 500;}
  .headmenu.active .mo_util .header__util {display: block;}
  .headmenu.active .mo_util .header__util {opacity: 1;position: fixed;bottom: 1%;width: 100%;text-align: center;z-index: 100;transition: transform .5s;transition: opacity 1s ease-in-out;}
  .gnb__list .gnb__item {width: 100%;margin-bottom: 5px;}
  .gnb .menu .gnb__list {flex-wrap: wrap;/*gap: 7px;*/}
  #btn_top {display: none;}
  #gnb {padding: 80px 0 35px;}
  .header__util .size {display: none;}
  .header {padding:20px 0 15px 0;}
  .header__tit .header__tit-txt {padding:5px 0 0 20px;}
  .header__util {display:none;}
  .h_menu {display: none;}
  .header__tit .logo__txt {display: none;}
  .gnb .menu .gnb__list .gnb__depth-item:nth-child(1) {padding-top:5px;}
  .gnb .menu .gnb__list .gnb__depth-item {padding-bottom:5px;}

}
@media screen and (max-width: 640px) {
  .header .btm h1 {width: 90px; height: 30px; }
  .header .btm .mo_btn {left: 10px; }
  .header .btm .mo_btn:after,
  .search_wrap .ico:after {font-size: 28px; }
  .search_wrap {right: 10px; }
  .footer .f_text li span:after {margin: 0 5px; }
  .h_menu {display: none;}
}

@media screen and (max-width: 475px) {
  .header__tit .header__tit-txt img {width: 180px;}
  .headmenu .nav_btn {padding: 45px 15px;font-size: 16px;}
  .footer > * {
    font-size: 12px;
  }
	.header {align-items: baseline;}
  #btn_top {width: 40px;height: 40px;padding-top: 10px;bottom: 31px;}
  #btn_top span {display: none;}
  .h_menu {display: none;}
}

@media screen and (max-width: 320px) {

  #gnb {padding: 70px 0 0;}
  .gnb__list .gnb__item > a {font-size: 20px;}
  .gnb .menu .gnb__list .gnb__depth-item {margin-top: 5px;}
  .gnb .menu .gnb__list .gnb__depth-item a {font-size: 16px;}
  .header__util > a {font-size: 14px; padding: 3px 6px;}
  .mo_util span img {height: 29px;}
  .header__util > a+a {margin-left: 0;}
  .h_menu {display: none;}
}