/* https://nlcy.go.kr/resource/templete/nlcy/common/newMain/css/layout.css */

@charset "utf-8";
@import url('reset.css');
@import url('common.css');

body { padding-top : 155px }
body.active { padding-top : 80px }
#nuriTop { background-color: #EEF1F6; padding: .3rem .5rem; font-size: .6rem; }
#nuriTop .max_inner { display : flex; align-items: center; gap : .5rem; padding: 0; }
#nuriTop .max_inner img { width : 26px }
.header_wrap:before { display: none; }
header#headerPc { position : fixed; top : 0; left : 0; width : 100%; z-index: 9; background-color: #fff; transition : top .3s ease-in-out }
header#headerPc .top_header { border-bottom : 2px solid #FFF2DB }
header#headerPc.active { top : -82px }
header#headerPc .top_header .max_inner { justify-content: space-between; padding: .3rem 0; }
header#headerPc .top_header a { font-size : .7rem; }
header#headerPc .top_header li { position : relative; padding : 0 .8rem }
header#headerPc .top_header li:first-child { padding-left : 0 }

header#headerPc .top_header .left li ~ li:before { content : ''; width : 1px; height : 12px; background-color: #ccc; position : absolute; top : 8px; left : 0 }
header#headerPc .top_header .right li ~ li:before { content : ''; width : 4px; height : 4px; background-color: #DEDEDE; position : absolute; top: 13px; left : 0; border-radius: 100%; }
header#headerPc .top_header .right a { font-size: .7rem; }
header#headerPc .top_header .right li:last-child a { font-weight : bold }
header#headerPc .top_header .right select { border : none; font-size : .9rem; font-weight: bold; }
header#headerPc .btm_header { position : relative }
header#headerPc .btm_header:after { content : ''; width : 100%; height: 80px; background-color: #FFF8DD; position : absolute; top: 0; left : 0; z-index: -1; }
header#headerPc .btm_header .max_inner { display : flex; justify-content: space-between; align-items: start; }
header#headerPc .btm_header .max_inner > h1 { width: 250px; display : flex; align-items: center; height: 80px; }
header#headerPc .btm_header .max_inner > h1 img { display : block; width : 100%; height : auto }
.holiday_wrap,
.holiday_wrap > div:not(.holidayPopup, .holidayPopup2) {position:relative;display : flex;align-items: center;z-index: 1;top: 6px;}
.holiday_wrap > div:not(.holidayPopup, .holidayPopup2) { background-color: #FF9933; border-radius : 0 10px 10px 0; overflow : hidden; padding : 0 1rem 0 1.3rem; position : relative; left : -10px; gap : 10px; height : 55px; z-index: -1; /* color: #fff; */top: 0; }
.holiday_wrap > div:not(.holidayPopup, .holidayPopup2) img { position : relative; top : -4px }
.holiday_wrap > div:not(.holidayPopup, .holidayPopup2) span { color: #fff; font-weight: bold }
.holiday_wrap > div:not(.holidayPopup, .holidayPopup2) b { display : block; width : 35px; line-height : 35px; background-color: #fff; font-size : .8rem; text-align: center; color : #FF9933; letter-spacing: -1.5px; border-radius : 5px }

header#headerPc .btm_header #nav { position : relative; display : flex; width: 900px; padding: 27px 0; justify-content: center; overflow: hidden; }
header#headerPc .btm_header #nav > li { margin : 0; width : 20%; position: relative; }
header#headerPc .btm_header #nav > li:hover > ul { background-color : #ff9933; height : 100% }
header#headerPc .btm_header #nav > li:hover > ul a { color : #fff }
header#headerPc .btm_header #nav > li ul a:hover { background-color : #C66300 }
header#headerPc .btm_header #nav > li > a { text-align: center; font-weight: 600; /* transition : all .3s ease; */ text-align: center; white-space: nowrap; /* font-size: .9rem; */ }
header#headerPc .btm_header #nav > li > a span { font-size: 1.1rem; font-weight: 500; }
header#headerPc .btm_header #nav > li > a span:before { content : ''; width : 6px; height : 6px; border-radius : 100%; background-color: #FFC534; display: block; position : absolute; top : 8px; left: 0; transform: initial; }
header#headerPc .btm_header #nav > li:first-child > a span:before { display : none }
header#headerPc .btm_header #nav > li > a { display : block; text-align: center; }
header#headerPc .btm_header #nav:hover ul { display : block }
header#headerPc .btm_header #nav ul { position : relative; display : none; text-align: center; padding: 10px 0; margin-top: 25px; }
header#headerPc .btm_header #nav ul li { padding : 0 .5rem }
header#headerPc .btm_header #nav ul a { font-size : .8rem; display: block; padding: .2rem; border-radius: 10px; font-weight: 500; }
header#headerPc .btm_header #nav ul a:hover { background-color : #404040; }


#headerMobile { position : fixed; top : 0; left: 0; width : 100%; display : none; background-color: #fff; z-index: 9; border-bottom : 2px solid #FFF6DB; transition : all .3s ease }
#headerMobile .header_wrap { display : flex; justify-content: space-between; padding : .5rem; align-items: center; position : static }
#headerMobile .header_wrap h1 img { max-width : 150px }
#headerMobile .header_wrap div { display : flex; gap : 1rem; align-items: center; }
#headerMobile .mobile_search_wrap { display : none; padding : 1rem; border-top : 2px solid #FFF2DB }
#headerMobile .mobile_search_wrap.active { display : block }
#headerMobile .mobile_search_wrap .top { display : flex; justify-content: space-between; }
#headerMobile .mobile_search_wrap form *:not(.multiLangBox, .multiLangBox *) { height : 55px; line-height : 55px; border-radius : 50px; }
#headerMobile .mobile_search_wrap .top * { width : 120px; font-size : .9rem; font-weight: bold; }
#headerMobile .mobile_search_wrap select { display : block; border : 2px solid #F26513; width : 150px !important; padding : 0 1rem }
#headerMobile .mobile_search_wrap button { display : block; border : 2px solid #FCC005; color : #f26513 }
#headerMobile .mobile_search_wrap .btm { border : 2px solid #f26513; border-radius : 50px; overflow : hidden; display : flex; margin-top : .5rem }
#headerMobile .mobile_search_wrap .btm input { flex : auto; border : none; padding : 0 1rem }
#headerMobile .mobile_search_wrap .btm button { width : 55px; height : 55px; display : flex; align-items: center; justify-content: center; border-radius : 100%; border : none; }
#headerMobile .mobile_search_wrap .btm button.btn_search { background-color: #F26513; position : relative; right : -3px; top : -1px }
#headerMobile .mobile_search_wrap .btm button.btn_search i { background-color: #fff; }
#mobileHeaderContent { position : fixed; top : 0; left : -100%; width : 100%; height : 100%; background-color: #fff; z-index: 5000; }
#mobileHeaderContent.active { left : 0 }
#mobileHeaderContent .mobileTop { position : relative; z-index: 2; background-color: #fff; padding : 1rem }
#mobileHeaderContent .mobileTop h1 {position: absolute; top: 10px;right: 1rem;}
#mobileHeaderContent .mobileTop h1 img { max-width : 200px }
#mobileHeaderContent .mobileTop p { border : 2px solid #FFC534; border-radius : .5rem; padding : 1rem 1.5rem; display : flex; align-items: center; margin : 2rem 0 1rem; font-size : .8rem; gap : 1rem; }
#mobileHeaderContent .mobileTop p img { width : 30px }
#mobileHeaderContent .mobileTop p span { color : #3C3C3C }
#mobileHeaderContent .m_login_wrap { display : flex; gap : 10px }
#mobileHeaderContent .m_login_wrap a { display : block; line-height : 45px; width : 50%; text-align: center; color : #111; border-radius : 10px; background-color: #F2F2F2; font-weight: bold; font-size : .8rem }
.mobile_nav { height: calc(100% - 198px); overflow : auto; background-color: #888; }
.mobile_nav:before { content : ''; width: 150px; height : 100%; background-color: #FFF8DD; position : absolute; top : 0; left : 0; }
.mobile_nav .gnb_m { position : relative; height: 100%; }
.mobile_nav .depth.depth1 { position : relative; width : 140px; transition : initial; padding : 0 10px }
.mobile_nav .gnb_m a { display : block; color :#111111; font-size : 16px; font-weight: 600;padding-left:10px;}
.mobile_nav .menu-all-depth2 { display : none; background-color: #fff; height : 100%; border-top : 1px solid #DEDEDE; padding : .5rem 1rem 1rem 1rem  }
.mobile_nav .menu-all-depth2 a { color : #3C3C3C; font-size : 15px  }
.mobile_nav .menu-all-depth2 a:hover { color : #ff9933 }
.mobile_nav .depth1-title,
.menu-all-depth3 { display : none }
.mobile_nav .menu-all-depth1__item { border-bottom : 1px solid #FFC534; width : 150px }
.mobile_nav .menu-all-depth1__item,
.mobile_nav .menu-all-depth1__item .depth1 { display : block !important; line-height : 45px; width : 150px; width : 100% !important }
.mobile_nav .menu-all-depth1__item.active .depth1 { background-color: #FF9933; color : #fff; padding : 0 10px }
.mobile_nav .menu-all-depth1__item.active .menu-all-depth2 { display : block; padding : 0 }

.mobile_nav .menu-all-depth2 { position : absolute; top : 0; left: 150px; width: calc(100% - 150px); padding-bottom: 0;z-index:10; }
.new_win { color : #fff; font-size : 12px }
#navCloseBtn {width : 25px; height : 25px }
#navCloseBtn svg { display : block }
#headerMobile .holiday_wrap,
.holiday_wrap_btm { background-color: #FF9933; justify-content: center; padding: 0; height: auto; align-items: center; }
#headerMobile .holiday_wrap div:not(.holidayPopup, .holidayPopup2),
#headerMobile .mobile_search_wrap button { margin: 0 !important; }
.holiday_wrap_btm div { z-index: 0; left : 0; margin : 0 }
.holiday_wrap_btm { display : none }


#mainFooter { background : url('/resource/templete/nlcy/common/newMain/img/main/bg_footer.png') no-repeat center top / cover; padding : 25rem 0 0 0 }
.foot_slide_wrap { display : flex; gap : 20px; background-color: #fff; border-radius : 20px; padding : 1.2rem 1.5rem }
.foot_slide_wrap .swiper_ctrl_wrap { position : relative; width : 100px; background-color: #fff; display : flex; gap : 5px; align-items: center; }
.foot_slide_wrap .swiper_ctrl_wrap * { flex-shrink: 0; }
.foot_slide_wrap .swiper_ctrl_wrap * i { filter : brightness(0) inset(-1) }
.foot_slide_wrap .swiper_ctrl_wrap button { width : 25px; height : 25px; display : flex; align-items: center; justify-content: center; border-radius : 100% }
.foot_slide_wrap .swiper_ctrl_wrap button .ic_pause { display : block }
.foot_slide_wrap .swiper-slide { display : flex; align-items: center; justify-content: center; width : auto }
.foot_slide_wrap .footSwiper a img { display : block; max-width : 100%; height : auto; margin : 0 auto }

.foot_slide_wrap .swiper-arrow { position : static; margin : 0; width : 25px; height : 25px; border : 1px solid #DEDEDE; border-radius : 100%; display : flex; align-items: center; justify-content: center; }
.foot_slide_wrap .swiper-arrow i { width : 10px; height : 10px }
.foot_slide_wrap .swiper-button-next:after,
.foot_slide_wrap .swiper-button-prev:after { display : none !important }


.foot_btm { display : flex; gap : 1rem; margin-top : 2rem; padding-bottom : 2rem }
.foot_btm h1 { width : 230px }
.foot_btm h1 img { width : 100% !important }
.foot_btm div.flex { justify-content: space-between; flex : auto }
.foot_btm div,
.foot_btm div .only_pc { color : #fff; font-size : .7rem; line-height : 150%; font-weight: 600; }
.foot_btm a + a { margin-left : 2rem }
#footerBtm { background-color: #398761; position : relative; overflow : hidden }
#footerBtm .inner { display : flex; align-items: center; justify-content: space-between; height : 40px }
#footerBtm .inner div:first-child a { display : inline-block; position : relative; color : #76C495; font-size : .7rem }
#footerBtm .inner div:first-child a ~ a { padding-left: 40px }
#footerBtm .inner div:first-child a ~ a:before { content : ''; width : 6px; height : 6px; border-radius : 100%; background-color: #256C49; position : absolute; top : 50%; left : 15px; transform : translate(0, -50%) }
#footerBtm .inner div:last-child { display : flex }
#footerBtm .inner div:last-child a,
#footerBtm .inner div:last-child img { height : 40px }
#footerBtm .inner div a:first-child { color : #fff; font-weight: bold; }


.holiday_wrap .holidayPopup,
.holiday_wrap .holidayPopup2 { display: none; position: absolute; left: auto; top: 75px; right: 0; width: 395px; height: auto; background-color: #FFEDD0; border: 1px solid #dfdfdf; border-radius: 10px; padding: 15px; z-index: 999; line-height: 60px; }

.holiday_wrap .holidayPopup > .inner,
.holiday_wrap .holidayPopup2 > .inner {background: #fff; }

.holiday_wrap .holidayPopup h3 { position: relative; height: 30px; line-height: 30px; }

.holiday_wrap .holidayPopup h3 button { position: absolute; top: 0; right: 0; }

.holiday_wrap .holidayPopup ul { margin: 20px -5px 0; overflow: hidden; }

.holiday_wrap .holidayPopup ul li { float: left; width: 12.5%; margin: 3px; }

.holiday_wrap .holidayPopup ul li p { border: 3px solid #dfdfdf; border-radius: 8px; line-height: 39px; text-align: center; font-size: 16px; }

.holiday_wrap .holidayPopup .calendar th { line-height: 60px; }

.sub_inquiry { margin-top : 0 !important }
.holiday_wrap > div:not(.holidayPopup, .holidayPopup2) { top : 1px !important }
.gnb_m .menu-all-depth2__item.active > a { color : #fff !important }
.mobile_search_wrap  { display : none }

@media ( max-width: 1650px ) {header#headerPc .btm_header .max_inner > h1 { width : 200px }
header#headerPc .btm_header .max_inner > h1 img { width : 100% }
header#headerPc .btm_header #nav > li > a { font-size : .9rem }
header#headerPc .btm_header #nav { width : 750px; margin : 0 auto }
header#headerPc .btm_header #nav:hover { width : 750px }
header#headerPc .btm_header #nav ul a { font-size : .7rem; }
.holiday_wrap > div:not(.holidayPopup, .holidayPopup2) { padding : 0 .5rem 0 1rem }
.holiday_wrap > div:not(.holidayPopup, .holidayPopup2) span { font-size : .8rem; white-space: nowrap; }
 }

@Media ( max-width : 1500px ) {.holiday_wrap a { width : 100px; position : relative; top : 8px }
.holiday_wrap a img {width: 100% !important;}
.holiday_wrap, .holiday_wrap > div:not(.holidayPopup, .holidayPopup2) { height : 45px; margin-top : 14px }
 }

@media ( max-width : 1400px ) { html, body { font-size : 19px }
 .holiday_wrap a { display : none }
.holiday_wrap > div:not(.holidayPopup, .holidayPopup2) { border-radius : 50px; padding : .3rem .5rem }
.holiday_wrap > div:not(.holidayPopup, .holidayPopup2) b {width: 30px;height: 30px;line-height: 30px;font-size : .8rem}
 }

@media ( max-width : 1280px ){
 .holiday_wrap_btm { position : relative; display : flex; height : auto; top : -10px; height : 62px; transition : all .3s ease; margin : 0; }
 .holiday_wrap_btm a { display : block; top : 0px; }
 .holiday_wrap > div:not(.holidayPopup, .holidayPopup2) { margin-top : 0; left:0; z-index:1; }
 #headerPc .holiday_wrap { display : none }
 }


@media ( max-width : 1200px ) { html, body { font-size : 18px }
 body { padding-top : 83px; }
 body.active { padding-top : 83px }
 #headerPc { display : none }
 #headerMobile { display : block }
 body.active #headerMobile { top : -32px }
 body.active .holiday_wrap { display : none }
 .holiday_wrap, .holiday_wrap > div {margin-top : 0;top: 0;}
 .search_toggle_btn i { width : 30px; height : 20px }
 .search_toggle_btn i { background : url('/resource/templete/nlcy/common/main/img/common/ic_search.png') no-repeat center center / cover; mask-image: none; height : 30px }
 .nav_toggle_btn img { width : 25px !important; height : auto }
 .holiday_wrap a { display : block; /* position: static; */top: 2px; }
 .holiday_wrap_btm { display : none }


 #mainFooter { padding : 25rem 0 0 0; background : url('/resource/templete/nlcy/common/newMain/img/main/m_bg_footer.png') no-repeat top center / cover }
 .holiday_wrap .holidayPopup2 { top:50px; right: auto; left:50%; transform:translateX(-50%); }

 .menu-all-depth1__item.active .depth1 { background: #FF9933; border-radius: 0 !important;}
 .gnb_m .menu-all-depth3 li a:before { top : 0 !important }
 .mobile_search_wrap { display : none; margin : 1rem auto; }
 .mobile_search_wrap .btn_keyboard {position: absolute;top: 50%;margin-top: -14px;right: 58px; }
 .mobile_search_wrap .m_search_top select,
.mobile_search_wrap .m_search_top .sch_box { border : 3px solid #FF9933; border-radius : 50px }
 .mobile_search_wrap .svg_keyboard {position: absolute;top: 50%;margin-top: -14px;right: 58px; }
 }



@media ( max-width : 1000px ){
 #mainFooter { padding : 40% 0 0 0 }
 .foot_btm,
 #footerBtm .inner { flex-direction: column; align-items: center; text-align: center; }
 #footerBtm { height : auto }
 .foot_btm div.flex { flex-direction: column; gap : .8rem }
  .foot_btm div.flex a img { width : 80px !important  }
 #footerBtm .inner { padding : 1rem; height : auto }
 #footerBtm .inner div.footer_social { gap : .5rem; margin-top : 1rem }
 #footerBtm .inner div.footer_social a img { border-radius : 100%; width : 45px; height: 45px }
 .foot_btm div .only_pc { display : none }
 .foot_btm .only_mobile { display : block; text-align : center; color : #fff; font-size : .7rem; margin-top : .5rem }
 .foot_slide_wrap { padding : .5rem; border-radius : 10px }
 .foot_slide_wrap a img { max-width : 140px !important  }

 }

 @media( max-width : 768px ){
.container.sub { padding-top : 0 !important }
.mobile_search_wrap { display : block !important; text-align: right;}
.mobile_search_wrap .m_search_top {position:relative; }

.mobile_search_wrap .m_search_top select { width : calc(100% - 140px); padding : 0 1rem; background-position: right 15px center; font-weight: bold; height: calc(2rem + 9px); margin-bottom:10px;float:left;}
.mobile_search_wrap .m_search_top div {clear:both; display : flex; gap :0 !important; overflow : hidden; flex : auto }
.mobile_search_wrap .m_search_top input { border : none; padding : 0 1rem; flex : auto; height : 3rem; }

.mobile_search_wrap button { flex-shrink: 0; }
.mobile_search_wrap .btn_search {min-width:48px; width : 3rem !important; height : 3rem !important; display : flex; align-items: center; justify-content: center; background-color: #FF9933; border-radius : 100% }
.mobile_search_wrap .btn_search img { width : 25px }
.mobile_search_wrap .btn_detail_search {position:absolute;top:0;right:0; background-color: #ff9933; color : #fff; border-radius : 50px; display : inline-flex; align-items: center; gap : .5rem; padding : .5rem 1rem; font-size : .8rem; font-weight: bold; margin-top : 0 !important; }

#footerBtm .inner .fb_mn{overflow:hidden;width:100%;}
#footerBtm .inner .fb_mn a{float:left;width:50%;}

 }

.main .inner {background: none; }
#mobileHeaderContent .memberBox { font-size : 14px;}
#mobileHeaderContent .categoryWrap { display : flex; gap : .5rem; justify-content: space-between; margin : 1rem 0; background-color: #f9f9f9; padding : .5rem; border-radius : .5rem; }
#mobileHeaderContent .categoryWrap li { position : relative; width : 25% }
#mobileHeaderContent .categoryWrap li:after { content : ''; width : 1px; height : 100%; background-color: #dfdfdf; position : absolute; top : 0; right : 0; display: block;}
#mobileHeaderContent .categoryWrap li:last-child:After { display : none }
#mobileHeaderContent .categoryWrap a { display : flex; flex-direction: column-reverse; align-items: center; font-size : .8rem }
#mobileHeaderContent .categoryWrap a .categoryCount b { font-weight: bold; color : #ff9933; font-size : 1rem }
#mobileHeaderContent .btnBox { display : flex; gap : .5rem }
#mobileHeaderContent .btnBox span { width : 100%; text-align: center; }
#mobileHeaderContent .btnBox a { display : block; width : 100%; border-radius : 10px; background-color: #C66300; color : #fff; line-height : 45px; font-size : 1rem  }

@media ( max-width : 400px ){
#mobileHeaderContent .categoryWrap { flex-wrap : wrap }
#mobileHeaderContent .categoryWrap li { width : 48% }
#mobileHeaderContent .categoryWrap li:nth-child(2n):after { display : none }
#mobileHeaderContent .btnBox a { font-size : .8rem  }
}


