@charset "utf-8";
/*
	느티울 ogam
    Write Date : 2020. 10. 22.
	Last Modify Date : 2020. 10. 25.
*/

/* Layout */
#wrap { width:100%; max-width:1920px; min-width:320px; margin:0 auto; }

/* gnb */
#header { overflow:hidden; position:fixed; top:0; width:100%; max-width:1920px; min-height:90px; box-sizing:border-box; z-index:8; }
.headWrap { background:rgba(0, 0, 0, 0.4); -webkit-transition:all 0.3s ease-out;-o-transition:all 0.3s ease-out;-moz-transition:all 0.3s ease-out;transition:all 0.3s ease-out; }
.headWrap .logo { position:absolute; left:0; top:0; padding:27px 0 0 2.7%; }
.gnbWrap .gnb { margin:0 320px; }
.gnb .gnbList { font-size:0; letter-spacing:-4px; text-align:center; white-space:nowrap; -webkit-transition:all 0.3s ease-out;-o-transition:all 0.3s ease-out;-moz-transition:all 0.3s ease-out;transition:all 0.3s ease-out; }
#header.active .gnbList:after { content:''; position:absolute; top:90px; left:0; width:100%; height:1px; background-color:#dedede; }
#header.active .gnbList:before { content:''; position:absolute; top:91px; left:0; width:100%; height:100%; background-color:#f7f7f7; }
.gnb .gnbList>li { display:inline-block; min-width:7em; padding:0 2.3%; font-size:18px; vertical-align:top; letter-spacing:normal; white-space:normal; }
.gnb .gnbList>li>a { position:relative; display:block; padding:35px 0; color:#fff; text-decoration:none; }
#header.active .gnb .gnbList>li>a { text-decoration:none; }
#header.active .gnb .gnbList>li.active>a:before { content:''; position:absolute; bottom:-1px; left:-2%; width:104%; height:4px; background-color:#8fad18; z-index:1; }
.gnb .gnbList>li>div { position:relative; display:none; padding:25px 0 70px; font-size:16px; text-align:left; z-index:1; }
.gnb .gnbList>li>div>ul { position:absolute; width:100%; }
.gnb .gnbList>li>div>ul>li { padding-top:14px; line-height:1.2; }
.gnb .gnbList>li>div>ul>li:first-child { padding-top:0; }
.gnb .gnbList>li>div>ul>li>a { display:block; font-weight:250; color:#555; text-decoration:none; }
.gnb .gnbList>li>div>ul>li>a:hover,
.gnb .gnbList>li>div>ul>li>a:focus,
.gnb .gnbList>li>div>ul>li>a:active { font-weight:250; color:#8fad18; }
.gnbWrap .sns { display:none; }
.gnbWrap .moGnbClose { display:none; }
.headWrap .headUtil { position:absolute; right:0; top:0; /*padding:31px 2.8% 0 0;*/ }
.headUtil>ul { font-size:0; letter-spacing:-4px; }
.headUtil>ul>li { display:inline-block; margin-left:20px; font-size:13px; font-weight:300; vertical-align:middle; letter-spacing:normal; }
.headUtil a { color:#fff; }
.headUtil .btnMem>span>a { position:relative; display:inline-block; margin-left:7px; padding-left:12px; }
.headUtil .btnMem>span>a:before { content:''; position:absolute; top:3px; left:0; width:1px; height:10px; background-color:#fff; }
.headUtil .btnMem>span:first-child a { margin-left:0; padding-left:0; }
.headUtil .btnMem>span:first-child a:before { display:none; }
.headUtil .btnSiteMap { width:60px; min-height:90px; background-color:#9ec014; }
#header.active .headUtil .btnSiteMap { background-color:transparent; }
.headUtil .btnSiteMap a { position:relative; overflow:hidden; display:block; width:24px; height:20px; margin:35px auto; font-size:16px; text-indent:-999px; }
.headUtil .btnSiteMap a:before,
.headUtil .btnSiteMap a:after { content:''; position:absolute; width:100%; height:2px; background-color:#fff; }
.headUtil .btnSiteMap a:before { left:0; top:0; }
.headUtil .btnSiteMap a:after { right:0; bottom:0; }
.headUtil .btnSiteMap a span { display:block; position:absolute; top:50%; right:0; width:75%; height:2px; margin-top:-1px; background-color:#fff; visibility:visible; overflow:visible; }
.headWrap .btnMoGnb { display:none; position:absolute; right:0; top:0; padding:31px 2.8% 0 0; }
.headWrap .btnMoGnb button { position:relative; overflow:hidden; width:24px; height:20px; font-size:16px; text-indent:-999px; }
.headWrap .btnMoGnb button:before,
.headWrap .btnMoGnb button:after { content:''; position:absolute; width:100%; height:2px; }
.headWrap .btnMoGnb button:before { left:0; top:0; }
.headWrap .btnMoGnb button:after { right:0; bottom:0; }
.headWrap .btnMoGnb button span { display:block; position:absolute; top:50%; right:0; width:75%; height:2px; margin-top:-1px; visibility:visible; overflow:visible; }
.headWrap .moMem { display:none; }

/* Quick Menu */
.sideNav { position:fixed; top:90px; right:50%; max-width:1920px; height:100%; margin-right:-960px; background-color:rgba(0,0,0,0.5); z-index:8; }
#header.active + .sideNav { z-index:7; }
.sideNav>div { width:70px; text-align:center; }
.sideNav .quickMenu { background-color:#8fb746; }
.sideNav .quickMenu>li { position:relative; padding-top:1px; }
.sideNav .quickMenu>li:first-child { padding-top:1px; }
.sideNav .quickMenu>li:before { content:''; position:absolute; top:0; left:5%; width:90%; height:1px; background-color:#486b9a; }
.sideNav .quickMenu>li:first-child:before { display:none; }
.sideNav .quickMenu>li>a { display:block; min-height:83px; padding-top:26px; font-size:12px; font-weight:300; color:#fff; letter-spacing:-0.02em; }
.sideNav .quickMenu>li>a>span { display:block; padding-top:44px; background-position:top center; background-repeat:no-repeat; }
.sideNav .quickMenu>li.quick01>a>span { background-image:url(../images/common/icon_quick_menu01.png); }
.sideNav .quickMenu>li.quick02>a>span { background-image:url(../images/common/icon_quick_menu02.png); }
.sideNav .quickMenu>li.quick03>a>span { background-image:url(../images/common/icon_quick_menu03.png); }
.sideNav .quickMenu>li.quick04>a>span { background-image:url(../images/common/icon_quick_menu04.png); }
.sideNav .snsList { margin:37px 0 5px; }
.sideNav .snsList>li { margin-top:1px; }
.sideNav .snsList>li>a { display:block; padding:16px 0; }
.sideNav .snsList>li>a img { max-width:24px; }
.sideNav .btnTop button { width:100%; padding:10px 0; font-size:12px; color:#fff43f; }
.sideNav .btnTop button span { position:relative; padding:0 16px 0 3px; }
.sideNav .btnTop button span:before { content:''; position:absolute; top:50%; right:0; width:0; height:0; margin-top:-2px; border-style: solid; border-width: 0 4px 6px 4px; border-color: transparent transparent #fff43f transparent; }

/* footer */
#footer {  padding:45px 15px 80px; background-color:#222; color:#999; }
#footer .footerWrap { position:relative; max-width:1200px; margin:0 auto; padding:0 80px 0 295px; box-sizing:border-box; }
.footerWrap a { color:#999; }
.footerWrap .logo { position:absolute; top:5px; left:0; }
.footerWrap .footMid { padding-left:11%; }
.footerWrap .linkList { margin-bottom:20px; font-size:0; letter-spacing:-4px; }
.footerWrap .linkList>li { position:relative; display:inline-block; margin-right:14px; padding-right:15px; font-size:15px; vertical-align:top; line-height:1.5; letter-spacing:normal; }
.footerWrap .linkList>li.last { margin-right:0; padding-right:0; }
.footerWrap .linkList>li:before { content:''; position:absolute; top:6px; right:0; width:1px; height:11px; background-color:#d9d9d9; }
.footerWrap .linkList>li.last:before { display:none; }
.footerWrap .linkList>li>a { color:#d9d9d9; }
.footerWrap address { font-weight:300; font-size:13px; line-height:1.5; }
.footerWrap address>ul>li { position:relative; display:inline-block; margin-left:4px; padding-left:8px; }
.footerWrap address>ul>li:first-child { margin-left:0; padding-left:0; }
.footerWrap address>ul>li:before { content:''; position:absolute; top:5px; left:0; width:1px; height:11px; background-color:#999; }
.footerWrap address>ul>li:first-child:before { display:none; }
.footerWrap .infoList>li { display:inline-block; margin-left:13px; font-size:13px; font-weight:300; vertical-align:top; line-height:1.5; }
.footerWrap .infoList>li:first-child { margin-left:0; }
.footerWrap .copyright { margin-top:14px; font-weight:300; font-size:12px; letter-spacing:0.02em; }
.footerWrap .btnTop { position:absolute; top:5px; right:0; }
.footerWrap .btnTop button { width:68px; height:68px; background-color:#393939; border-radius:50%; font-size:12px; color:#e5e5e5; }
.footerWrap .btnTop button span { position:relative; padding:7px 0; }
.footerWrap .btnTop button span:before { content:''; position:absolute; top:0; left:50%; width:0; height:0; margin-left:-3px; border-style: solid; border-width: 0 3.5px 5px 3.5px; border-color: transparent transparent #e5e5e5 transparent; }
/*.footerWrap .other { position:absolute; top:0; right:0; }*/
@media all and (max-width:1940px) {
    .sideNav { right:0; margin-right:0; }
}
@media all and (max-width:1359px) {
    .sideNav { display:none; }
    .headWrap .headUtil { padding-right:2.8%; }
    .headUtil .btnSiteMap { width:auto; background-color:transparent; }
}
@media all and (max-width:1240px) {
    .headWrap .logo { max-width:270px; padding:27px 0 0 10px; }
    .gnbWrap .gnb { margin:0 130px 0 240px; }
    .gnb .gnbList>li { padding:0 1.8%; font-size:16px; }
    .gnb .gnbList>li>div { font-size:16px; }
    .headWrap .headUtil { padding-right:10px; }
    .headUtil .btnMem>span { display:block; text-align:right; }
    .headUtil .btnMem>span>a { margin:2px 0; padding-left:0; font-size:12px; }
    .headUtil .btnMem>span>a:before { display:none; }
    .headUtil .btnLang a { padding:6px 13px 7px; }
    .headUtil .btnSiteMap { margin-left:15px; }
}
@media all and (max-width:960px) {
    /* gnb */
    #header { position:absolute; }
    body.gnbOpen #header { overflow:visible; }
    body.gnbOpen { overflow:hidden; }
    body.gnbOpen .headWrap:before { content:''; position:absolute; top:0; left:0; width:100%; height:10000%; background-color:#000; background-color:rgba(0,0,0,0.6); z-index:9; }
    .gnbWrap { overflow-y:auto; display:none; position:fixed; top:0; right:0; width:90%; max-width:360px; height:100%; background-color:#353941; z-index:10; }
    .headWrap .logo { max-width:none; padding:27px 0 0 2.8%; }
    .gnb h2.blind { position:static; left:auto; width:auto; height:auto; overflow:visible; background-color:#9bac19; padding:23px 30px; font-size:18px; font-weight:400; color:#fff; }
    .gnbWrap .gnb { margin:0; padding-bottom:150px; background-color:#fff; }
    .gnb .gnbList>li { display:block; width:auto; padding:0; border-bottom:1px solid #dedede; font-size:15px; text-align:left; }
    .gnb .gnbList>li>a { padding:18px 50px 18px 30px; color:#353535; }
    .gnb .gnbList>li>div { padding:14px 35px 16px; background-color:#f7f7f7; font-size:15px; }
    .gnb .gnbList>li>div>ul { position:static; width:auto; }
    .gnb .gnbList>li>div>ul>li { position:relative; padding:1px 0; }
    .gnb .gnbList>li>div>ul>li:before { content:''; position:absolute; top:18px; left:0; width:2px; height:2px; background-color:#979797; }
    .gnb .gnbList>li>div>ul>li>a { position:relative; padding:9px 0 9px 13px; color:#666; }
    .gnb .gnbList>li>div>ul>li>a:hover,
    .gnb .gnbList>li>div>ul>li>a:focus,
    .gnb .gnbList>li>div>ul>li>a:active { letter-spacing:normal; }
    .gnb .gnbList>li.sNav>a:before { content:''; position:absolute; right:25px; top:50%; width:17px; border-top:1px solid #bbb; text-indent:-999px; }
    .gnb .gnbList>li.sNav>a:after { overflow:hidden; content:'메뉴 펼치기'; position:absolute; right:33px; top:50%; width:1px; height:12px; margin-top:-7px; border-right:1px solid #bbb; transition:.4s ease;-webkit-transition:.4s ease;-moz-transition:.4s ease;-o-transition:.4s ease; }
    .gnb .gnbList>li.sNav.navOpen>a:before{ -webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg); }
    .gnb .gnbList>li.sNav.navOpen>a:after { -webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg); }
    .gnbWrap .sns { display:block; padding:40px 20px; font-size:0; text-align:center; letter-spacing:-4px; }
    .gnbWrap .sns>li { display:inline-block; width:20%; font-size:16px; letter-spacing:normal; }
    .gnbWrap .sns>li>a { display:block; width:44px; height:44px; line-height:42px; margin:0 auto; background-color:#2d3137; border-radius:50%; }
    .gnbWrap .sns>li>a>img { max-width:22px; margin-top:-4px; vertical-align:middle; }
    .gnbWrap .moGnbClose { display:block; position:absolute; top:22px; right:22px; }
    .gnbWrap .moGnbClose button { overflow:hidden; width:20px; height:20px; font-size:16px; text-indent:-999px; }
    .gnbWrap .moGnbClose button span { display:block; position:relative; left:0; top:50%; right:0; width:100%; height:1px; visibility:visible; overflow:visible; }
    .gnbWrap .moGnbClose button span:before,
    .gnbWrap .moGnbClose button span:after { content:''; position:absolute; width:100%; height:1px; background:#fff; }
    .gnbWrap .moGnbClose button span:before { left:0; top:0; transform:rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);}
    .gnbWrap .moGnbClose button span:after { right:0; bottom:0; transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg); }
    .headWrap .headUtil { display:none; }
    .headWrap .btnMoGnb { display:block; }

    .headWrap .moMem { display:block; background-color:#71811a; }
    .headWrap .moMem>ul { font-size:0; text-align:center; letter-spacing:-4px; }
    .headWrap .moMem>ul>li { position:relative; display:inline-block; width:33.33333%; font-size:14px; font-weight:300; vertical-align:top; letter-spacing:normal; }
    .headWrap .moMem>ul>li:before { content:''; position:absolute; top:50%; left:0; width:1px; height:12px; margin-top:-5px; background:#5f7ea7; }
    .headWrap .moMem>ul>li:first-child:before { display:none; }
    .headWrap .moMem>ul>li>a { display:block; padding:15px 0; color:#fff; }
    
    /* footer */
    #footer {  padding:30px 10px 50px; }
    #footer .footerWrap { padding:0; text-align:center; }
    .footerWrap .logo { position:static; top:auto; left:auto; margin-bottom:18px; }
    .footerWrap .logo img { max-width:60px; }
    .footerWrap .footMid { padding-left:0; }
    .footerWrap .linkList { margin-bottom:13px; }
    .footerWrap .linkList>li { margin-right:10px; padding-right:11px; font-size:14px; }
    .footerWrap .linkList>li:before { top:5px; }
    .footerWrap .infoList>li { margin:0 3px; }
    .footerWrap .infoList>li:first-child { margin:0 3px; }
    .footerWrap .btnTop { display:none; }
    /*.footerWrap .other { display:none; }*/
}
@media all and (max-width:640px) {
    #header { min-height:72px; }
    .headWrap .logo { padding:20px 0 0 2.8%; }
    .headWrap .logo img { max-height:34px; }
    .headWrap .btnMoGnb { padding:24px 2.8% 0 0 }
    .footerWrap address { font-size:12px; }
    .footerWrap address>ul>li.last { display:block; margin-left:0; padding-left:0; }
    .footerWrap address>ul>li.last:before { display:none; }
    .footerWrap .linkList>li { margin-right:7px; padding-right:7px; font-size:12px; }
    .footerWrap .linkList>li:before { top:4px; }
    .footerWrap .infoList>li { font-size:12px; }
    .footerWrap .copyright { font-size:11px; }
}


/* popup */
.pop_contents_in h4 { margin-bottom:10px; font-size:14px; font-weight:500; }
.pop_contents_in strong{ font-weight:500; }

/* view popup 비밀번호 변경 레이어  */
.behindBg { position:absolute; top:0; left:0; width:100%; background:#000; height:100% !important; z-index:999;filter:alpha(opacity=70); opacity:0.7; }
#mobile_quick_navi {display:none;}
#layer_view { position:fixed; width:100%; height:2000px; top:0; left:0; display:none; z-index:999; }
#layer_view .pop_contents { position:absolute; z-index:100001; width:1030px; max-width:100%; height:630px; border:5px solid #ededed; background:#fff; box-sizing:border-box; }
#layer_view .pop_contents .pop_contents_in { padding:50px 10px 0; max-width:980px; margin:0 auto; }
#layer_view .pop_contents .pop_contents_top { background:#f6f6f6; width:100%; height:191px; margin-bottom:50px; }
#layer_view .pop_contents .pop_contents_top ul { padding:30px 20px 0; }
#layer_view .pop_contents .pop_contents_top li { color:#666; font-size:13px; font-weight:300; line-height:1.6em; letter-spacing:-0.05em; }
#layer_view .pop_contents .pop_contents_1 { background:#fff; width:100%; height:152px; border-top:5px solid #000; border-bottom:1px solid #d8d8d8; margin-bottom:50px; }
#layer_view .pop_contents .pop_contents_1 p { padding-top:60px; text-align:center; }
#layer_view .pop_contents .pop_contents_1 p span label { color:#666; font-size:13px; line-height:30px; }
#layer_view .pop_contents .pop_contents_1 p input { vertical-align:middle; color:#666; font-size:13px; line-height:28px; width:160px; height:28px; border:1px solid #ddd; padding:0 5px; }
#layer_view .pop_contents .btn_closed { position:absolute; top:0; right:0; }
#layer_view .pop_contents .btn_closed .btn_view_close { display:block; }

@media all and (max-width:640px) {
    #layer_view .pop_contents { height:auto !important; }
    #layer_view .pop_contents .pop_contents_in { padding:15px 10px 0; }
    #layer_view .pop_contents .pop_contents_top { margin-bottom:15px !important; }
    #layer_view .pop_contents .pop_contents_1 { margin-bottom:10px !important; }
    #layer_view .pop_contents .pop_contents_1 p span { font-size:0; }
    #layer_view .pop_contents .pop_contents_1 p span label { display:inline-block; width:35%; text-align:left; }
    #layer_view .pop_contents .pop_contents_1 p input { display:inline-block; width:65%; box-sizing:border-box; }
    #layer_view .pop_contents .pop_contents_in .button1 a { font-size:14px; }
}



/* 메인팝업*/
.layer_popup{position:absolute; top:0; left:0;width:auto; max-width:100%; height:auto !important; z-index:100000000;border:#444444 solid 1px;background:#fff; box-sizing:border-box;}
.layer_popup .layer_popup_closed{/*position:absolute;*/ bottom:0; left:0;width:100%;overflow:hidden;padding:0 0;height:30px;line-height:30px;background:#444444;}
.layer_popup .layer_popup_closed .fl{float:left;color:#fff;padding-left:10px;}
.layer_popup .layer_popup_closed .fr{float:right;width:20%;text-align:right;color:#fff;padding-right:10px;}
.layer_popup .layer_popup_closed .fr a{color:#fff;}
.layer_popup select, .layer_popup input, .layer_popup img { vertical-align:middle;}
.layer_popup .layer_popup_in img{width:100%;}