@charset "utf-8";

/************************************************************************
 * 2024 프로모션/기획전 반응형 헤더 푸터 공통CSS
 * 작성자 : 정다운
 * 작성일 : 2024.02
************************************************************************/

/* [C] 개편 헤더/GNB */
.header{font-size:13px;position: relative;z-index:1000;background-color:#fff;min-width:768px;border-bottom:1px solid #aaa;height:76px;width:100%}
.header__inner{max-width:1280px;margin:0 auto;width:100%}
.header a:hover{text-decoration:underline;text-underline-position: under;text-decoration-color:#bbb;color:inherit}

/* 헤더 메인 */
.header-main{background:#fff;}
.header-main .header__inner{display:flex;align-items:center;height:76px;position: relative;}

/* 헤더 메인 > BI */
.header-bi{position: relative;padding:18px 0;width:126px}
.header-bi .header__link--home{display:block;width:126px;height:40px;text-indent:-9999em;background:url(//img.enuri.info/images/rev/bi_main_126x40.png) no-repeat 0 0}

/* 헤더메인 > 우측 메뉴 */
.header-menu{margin-left:auto;padding:0;height:76px;}
.header-menu .menu__list{display:flex;}
.header-menu .menu__list > li{width:76px;height:76px;position: relative;}
.header-menu .menu__list > li [class*="header__btn--"]{box-sizing:border-box;width:100%;height:100%;padding:50px 0 10px;font-size:13px;line-height:16px;color:#666;text-align:center;background:transparent}
.header-menu .menu__list > li [class*="header__btn--"]:before{content:"";position: absolute;width:32px;height:32px;left:22px;top:12px;background-image:url(//img.enuri.info/images/rev/common_sprite.png);background-repeat:no-repeat}
.header-menu .menu__list .btn__tx--name{display:flex;align-items:center;height:16px;justify-content:center;}
.header-menu .menu__list .btn__tx--name em{font-weight:600;color:#222;max-width:64px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.header__btn--login:before{background-position:-160px -550px}
.header__btn--recent:before{background-position:-200px -550px}
.header__btn--recent .btn__thumb{width:20px;height:20px;position:absolute;top:18px;left:28px}
.header__btn--recent .btn__thumb img{width:100%;height:100%}
.header__btn--alarm:before{background-position:-240px -550px}
.header__btn--alarm .btn__tag--count{position:absolute;top:12px;right:16px;font-size:11px;line-height:12px;padding:2px 4px;border-radius:8px;background-color:#ee4b4b;color:#fff;font-weight:600}
.header-menu--m{display:none;margin-left:auto}
.header-menu--m ul{display:flex;height:16px;padding-right:16px;}
.header-menu--m ul li{padding:0 8px;position: relative;border-left:1px solid #eeeeee}
.header-menu--m ul li:first-child{border-left:0}
.header-menu--m ul li a{font-size:14px;color:#444;line-height:16px;display:block;white-space:nowrap}
.header__link--mymenu em{font-weight:600;color:#222;display:inline-block;max-width:82px;overflow:hidden;text-overflow: ellipsis;white-space: nowrap;vertical-align: top;}
.header__link--emoney em{color:#3588F3}
.header__link--emoney em b{font-weight:600}

/* 헤더메인 > 우측 메뉴 > 로그인 하위메뉴 */
.header-menu .lay__menu{position:absolute;padding:9px 16px;border:1px solid #aaa;border-radius:8px;background-color:#fff;width:90px;z-index:1;box-shadow: 0 5px 10px rgba(0,0,0,0.15);left:50%;transform:translate(-50%,-10px) scale(0); opacity:0 ;transform-origin:50% 0;transition:.5s all cubic-bezier(.47,1.64,.41,.8);z-index:202;box-sizing:content-box}
.header-menu .header__btn--login:hover + .lay__menu,
.header-menu .lay__menu:hover{transform:translate(-50%,0) scale(1);opacity:1}
.header-menu .lay__menu:before{content:"";}
.header-menu .lay__menu li{font-size:13px;line-height:16px;padding:3px 0;color:#444;font-weight:500;overflow:hidden;text-overflow: ellipsis;white-space: nowrap;}
.header-menu .lay__menu li:before{content: "";position: absolute;width: 10px;height: 10px;border-left: 1px solid #aaa;border-top: 1px solid #aaa;background-color: #fff;transform: rotate(45deg);top: -6px;margin-left:-6px;left: 50%;border-radius: 2px;}
.header-menu .lay__menu li a:hover{color:#3f88f3;text-decoration-color:#3f88f3}

/* 헤더 > 상단 고정 처리 */
.header {top: -100%; transition: 0.25s all;}
.header.is_sticky{position:fixed;top:0;left:0;right:0;transform:none;background: rgba(255,255,255,1);/* backdrop-filter: blur(6px); */;transition: 0.25s all;}


/* 헤더 PC MIN */
@media (max-width:1312px) {
    .header-bi{margin-left:16px}
}

/* 헤더 모바일 */
@media (max-width:768px) {    
    .header{height:56px;width:100%;min-width:auto;font-size:14px;overflow:hidden}
    .header-main .header__inner{height:56px}
    .header-bi{padding:0;width:76px;padding:18px 0 14px}
    .header-bi .header__link--home{width:76px;height:24px;background:url(//img.enuri.info/images/icon/svg/icon_logo_ko.svg) no-repeat 0 0 / 100%}
    .header-menu{display:none}
    .header-menu--m{display:flex}
}

/* ================= 푸터 ==================*/
footer  * {box-sizing: border-box;}
footer .container{width: 100%; max-width: 1280px; transition: all 0.2s;}
footer .footer_menu_list {width: 260px; margin: 0 auto;}
footer .footer_menu_list ul {display: flex; flex-wrap: wrap; justify-content: center; overflow: hidden;}
footer .footer_menu_list ul li {flex:0 0 auto; padding: 0 10px; position: relative;}
footer .footer_menu .footer_menu_list ul li.first_list {order: 1;}
footer .footer_menu .footer_menu_list ul li.second_list {order: 2;}
footer .footer_menu .footer_menu_list ul li.third_list {order: 3;}
footer .footer_menu .footer_menu_list ul li.fourth_list {order: 4;}
footer .footer_menu .footer_menu_list ul li.fifth_list {order: 5;}
footer .footer_menu .footer_menu_list ul li.sixth_list {order: 6;}
footer .footer_menu .footer_menu_list ul li + li:after {content: ""; display: block; width: 1px; height: 12px; background-color: #eee; position: absolute; top: 50%; left: -1px; transform: translateY(-50%);}
footer .footer_menu .footer_menu_list .xs_no_bar:after {display: none;}
footer .footer_menu { border-top: 1px solid #333; border-bottom: 1px solid #eee; } 
footer .footer_menu .footer_menu_list ul li a { display: block; line-height: 46px; font-size: 13px; color: #666;line-height: 33px; } 
footer .footer_menu .footer_menu_list ul li a b{font-weight:600}
footer .footer_cont { padding:16px 0 20px; }
footer .footer_wrap {display: flex; flex-wrap: wrap;}
footer .footer_cont_left {width: 100%; padding: 0 10px;}
footer .footer_cont_right {width: 100%; padding: 0 10px;}
footer .footer_cont .footer_info { font-size: 0; text-align: center;} 
footer .footer_cont .footer_info > span { display: inline-block; font-size: 11px; color:#666; line-height: 22px; margin-right: 16px; } 
footer .footer_cont .footer_info > span b{font-weight:600}
footer .footer_cont .footer_info > span address { display: inline-block; padding-left: 9px; word-break: keep-all;} 
footer .footer_cont .footer_info > span a { color: inherit; } 
footer .footer_cont .footer_caution,
footer .footer_cont .footer_copyright { font-size: 11px; text-align: center; line-height: 18px; } 
footer .footer_cont .footer_caution { font-size: 11px; color: #999; margin-top: 18px; line-height: 22px; word-break: keep-all;} 
footer .footer_cont .footer_copyright { font-size: 11px; color: #666; margin-top: 4px; line-height: 22px; } 

@media (min-width: 768px){
    footer .container {padding: 0 16px;}
    footer .footer_menu_list {width: auto;}
    footer .footer_menu_list ul {justify-content: initial;}
    footer .footer_cont {padding: 16px 0 30px;}
    footer .footer_cont_left {width: 70%;}
    footer .footer_cont_right {width: 30%;}
    footer .footer_cont .footer_caution {font-size: 12px;line-height: 22px; word-break: keep-all; text-align: left;}
    footer .footer_cont .footer_info > span {font-size: 12px;}
    footer .footer_cont .footer_copyright {font-size: 11px; line-height: 22px; text-align: left;}
    footer .footer_cont .footer_info {text-align: left;}
    
}
@media (min-width: 930px){
    footer .footer_menu .footer_menu_list ul li a {line-height: 46px;}
    footer .footer_cont { padding: 26px 0 30px;} 
    footer .footer_cont .footer_info > span {font-size: 13px;}
}

@media (max-width:360px) {
    .footer_caution br {display: none !important;}
}

/* 푸터 > 앱다운 */
footer .appDown { position:relative; text-align: right; cursor: pointer; } 
footer .appDown .btn_openAappDownBox:before { content:""; display: inline-block; vertical-align: middle; width: 40px; height: 40px; background-position: 0 -180px; background-image: url("//img.enuri.info/images/rev/common_sprite.png"); background-repeat: no-repeat; } 
footer .appDown .btn_openAappDownBox .tx_tit { display: inline-block; vertical-align: middle; text-align: left; font-size: 12px; color:#333; line-height: 18px; } 

/* 푸터 > 앱다운 > 다운레이어 */
footer .box_appDown { display: none; position:absolute; bottom:100%; right:0; width: 480px; text-align: left; background-color: #fff; z-index: 10; border: 1px solid #ddd; border-radius: 2px; box-shadow: 0 0 12px rgba(0,0,0,0.1); } 
/* 푸터 > 앱다운 > 다운레이어 > 기본정보,Qr */
footer .box_appDown .col_wrap {justify-content: space-between;}
footer .appDown_info { padding: 16px; border-bottom: 1px solid #eee; } 
footer .appDown_info .appDown_info_text { } 
footer .appDown_info .appDown_info_text .link_enuri { display: block; font-size: 13px; font-weight: bold; color: #1A70DD; text-decoration: underline; margin-bottom:16px; } 
footer .appDown_info .appDown_info_text .icon_app_logo { content:""; display: inline-block; vertical-align: middle; width: 60px; height: 60px; background-position: 0 -120px; background-image: url("//img.enuri.info/images/rev/common_sprite.png"); background-repeat: no-repeat; cursor: pointer; } 
footer .appDown_info .appDown_info_text .tx_wrap { display: inline-block; vertical-align: middle; padding-left:12px; } 
footer .appDown_info .appDown_info_text .tx_wrap .tx_tit { font-size: 16px; font-weight: bold; color: #333; line-height: 24px; } 
footer .appDown_info .appDown_info_text .tx_wrap .tx_desc { font-size: 12px; line-height: 16px; color: #999; } 

/* 푸터 > 앱다운 > 다운레이어 > 다운로드 링크 */
footer .appDown_link { padding: 16px; border-right: 1px solid #eee; } 
footer .appDown_link .tx_tit { display: block; height: 16px; font-size: 12px; font-weight: bold; color: #333; margin-bottom: 8px; } 
footer .appDown_link a { display: block; font-size: 12px; line-height: 32px; text-decoration: underline; color:#666; } 
footer .appDown_link a:before { content:""; display: inline-block; width: 32px; height: 32px; vertical-align: top; background-image: url("//img.enuri.info/images/rev/common_sprite.png"); background-repeat: no-repeat; margin-right: 6px; } 
footer .appDown_link a.btn_appDown_aos { margin-bottom:8px; } 
footer .appDown_link a.btn_appDown_aos:before { background-position: -120px -180px; } 
footer .appDown_link a.btn_appDown_ios:before { background-position: -160px -180px; } 
.icon_qrcode { display: block; width: 92px; height: 92px; background: url("//img.enuri.info/images/rev/qr_enuri_app.png") no-repeat 0 0; } 

/* 푸터 > 앱다운 > 다운레이어 > SMS */
footer .appDown_sms { padding: 16px; } 
footer .appDown_sms .tx_tit { display: block; height: 16px; font-size: 12px; font-weight: bold; color: #333; margin-bottom: 8px; } 
form[name=form_send_appDown_link] { } 
form[name=form_send_appDown_link] .input_wrap { position:relative; padding-right: 55px; } 
form[name=form_send_appDown_link] input[name=phon_num] { box-sizing: border-box; border-radius: 2px; height: 32px; width: 100%; padding: 0 72px 1px 16px; border: 1px solid #ddd; background-color: #FBFBFB; font-family: inherit; letter-spacing: -1px; } 
form[name=form_send_appDown_link] input[name=phon_num]:valid, 
form[name=form_send_appDown_link] input[name=phon_num]:active, 
form[name=form_send_appDown_link] input[name=phon_num]:focus { border:1px solid #515B6D; outline: none; } 
form[name=form_send_appDown_link] .btn_send { position: absolute; top: 0; right: 0; bottom: 0; width: 56px; background-color: #515B6D; text-align: center; color: #fff; font-family: inherit; letter-spacing: -1px; padding-bottom: 1px; } 

footer .appDown_sms .tx_caution { margin-top:8px; }
footer .appDown_sms .tx_caution ul li { position:relative; color: #999; font-size: 11px; padding-left:12px; letter-spacing: -.5px; } 
footer .appDown_sms .tx_caution ul li:before {content:"-"; position:absolute; top:0; left:0;} 
footer .appDown:hover .box_appDown { display: block; }