 
/* layout */   

#wrap {  position:relative;  background:#FFF;}
#body {width:100%;}
 
.main_bg {background:#fff;}
.sub_bg {background:#FFF;}


.at-container {width:100%; max-width:1200px; margin:0 auto; position:relative;}


@media (max-width:1240px) {

.at-container {padding:0 20px;}
.at-container.wide {padding:0;}
}

/*util*/
.top_util {height:57px; border-bottom:1px solid #e5e5e5; background:#f7f7f7;}
.util {position:absolute; right:0; z-index:9999; top:30px;}
.util a {font-size:14px; color:#333333; display:inline-flex; height:55px; align-items:center; padding:0 8px; position:relative; background:url(../img/toputil_line.png) no-repeat right 21px;}
.util a:last-child {background:none;}
.util a .cart_cnt {display:inline-flex; align-items:center; justify-content:center; font-size:11px; border-radius:100%; width:17px; height:17px; background:#ff5656; color:#FFF;}

.top_tel {position:absolute; left:0; top:10px; font-size:16px; color:#222222; padding-left:25px; background:url(../img/top_tel_icon.png) no-repeat 0 4px;}
.top_tel strong {font-size:17px;}


@media (max-width:600px) {
    .top_tel {
        font-size:11px;
        top:0; /* 기존 13px → 0으로 올림 */
    }
    .top_tel strong { font-size:11px; }

    .util a {
        font-size:13px;
    }

    /* 추가로 util 위쪽 간격 더 좁히고 싶으면 여기서 top 값 조정 가능 */
    .util {
        top:-8px; /* 필요시 더 올리기 */right:10px;
    }
}


 /*header*/
 #header {height:100px; position:relative; width:100%;  z-index:99; border:1px solid rgba(255,255,255,0.15); z-index:99; }

.top-menu {display:none;}
.top-tel {display:none;}

.top_logo {position:absolute; right:0; top:10px;}
.top_logo_left {position:absolute; left:0; top:10px;}

.top-txt {font-family:"Nanum Myeongjo"; font-size:18px; position:absolute; right:0; top:50px; letter-spacing:-2px;}

#header h1 {position:absolute; left:0; top:0; display:flex; height:100px; align-items:center;}
#header h1 a {}


@media (max-width:1000px) {
    /* 헤더 전체 높이 유지 */
    #header {
        padding:0;
        position:relative;
        height:110px;
    }

    /* 로고 줄이기 & 중앙 정렬 */
    #header h1 {
        width:100px;
        margin:0 auto;
        position:relative;
        top:45px; /* 기존 0 → 20px으로 내려줌 */
        height:auto;
        display:flex;
        align-items:center;
        justify-content:center;
    }
    #header h1 a {
        display:inline-block;
        background-size:contain;
        height:50px;
    }
    #header h1 a img {
        height:50px;
        width:auto;
        display:block;
    }
}


/*top menu*/
#navigation {display:none;}
#navi {
    width: auto;        /* 메뉴 폭은 글자 수에 따라 자동 */
    max-width: 500px;   /* 필요 시 최대 폭 */
    margin: 0;
    position: absolute; /* 절대 위치 */
    left: 210px;        /* 로고(190px) + 여백 20px */
    top: 0;
    z-index: 99;
    height: 115px;
}


.navi_inner {position:relative;}

.gn {
    display: flex;
    justify-content: flex-start; /* 좌측 정렬 */
    gap: 15px;                   /* 메뉴 항목 간격 */
}
.gn:after { content:none; }
.gn li { position:relative; flex:auto; order:0; }
.gn li .btn_area { display:inline-block; height:49px; overflow:hidden; }
.gn li a { display:block; padding:0px 0px 0px 0px; text-align:center; }
.gn li a.first {  padding: 0 24px 0 24px;color:#333333; font-size:18px;  height:100px; display:flex; align-items:center; justify-content:center; padding-top:16px; letter-spacing:-1px; font-weight:500;}
.gn li:last-child a {background:none; padding-right:0;}
.gn li a.first span {position:relative; padding-bottom:8px; }
.gn li a.first span:after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 0;
    height: 2px;             /* 밑줄 두께 */
    background: #df7e42;     /* 밑줄 색상 */
    transition: all 0.3s ease;
}
.gn li:hover a.first {color:#df7e42; }
.gn li:hover a.first span:after {width:100%; left:0;}

/*
.gn > li:nth-child(3) {order:2;}
.gn > li:nth-child(6) {order:1;}
*/
.gn > li:nth-child(6) > a.first span {background:linear-gradient(to right, #f5a88d 10%, #f03f39 50%); display:inline-flex; font-size:20px; width:150px; height:40px; align-items:center; justify-content:center; padding:0; color:#FFF; border-radius:50px; box-shadow:3px 3px 7px rgba(0,0,0,0.13);}
.gn > li:nth-child(6) > a.first span i {margin-right:5px;}
.gn > li:nth-child(6) > a.first span:after {display:none;}

.gn li:hover ul.lnb_sub_wrap {display:inline-block; } 
.gn li ul.lnb_sub_wrap { position:absolute;   top:99px;	padding:0px 0; z-index:9999; display:none; background:#fff; z-index:9999;  min-width:220px;  left:0px; border-bottom-left-radius:20px; border-bottom-right-radius:20px; overflow:hidden; border:1px solid rgba(0,0,0,0.15); box-shadow:9px 9px 13px rgba(0,0,0,0.05);}
.gn li ul.lnb_sub_wrap li { display:block;  width:100%;  float:none; border-top:none; padding:0 0px; background:none; border-bottom:1px solid #dcdcdc;}
.gn li ul.lnb_sub_wrap li a {color:#808080; font-size:17px;   letter-spacing:-1px;  padding:15px 30px;  text-align:left;  display:block; font-weight:normal; background:none;  transition:all .3s; }
.gn li ul.lnb_sub_wrap li:hover a {color:#fff; background:#b4a9a4;}
.gn li ul.lnb_sub_wrap li a span {}
.gn li ul.lnb_sub_wrap li:last-child {border-bottom:none;}

/*.gn li:last-child ul.lnb_sub_wrap {left:auto; right:0;}*/


.mobile_top_menu {}
.mobile_top_menu a {z-index:999;  position:absolute; right:0; top:18px;  height:46px; line-height:46px; color:#333333; font-size:20px; text-align:center; display:inline-block;}
.mobile_top_menu:hover a{color:#1c9ae5 !important;}
.mobile_top_menu p {position:absolute; top:11px; left:68px; font-weight:bold;}
.mobile_top_menu a span {font-size:20px; color:#000000; font-weight:bold; padding-left:15px;}
 

@media (max-width:1000px) {

}


#all_menu_box {position:absolute;  z-index:999; background:none; width:100%; top:98px; padding:0 0px; box-sizing:border-box;   display:none;}
#all_menu {display:flex; border:1px solid #d6d6d6;  width:100%; border-radius:10px; background:#ffffff; overflow:hidden;}
#all_menu li {flex:1; border-left:1px solid #eeeeee; box-sizing:border-box; padding:20px 20px;   }
#all_menu li:hover {background:#f0f1a5;}
#all_menu li:first-child {border-left:none;}
#all_menu li a.first {color:#393939; font-size:18px; font-weight:bold;}
#all_menu .lnb_sub_wrap {margin-top:10px;}
#all_menu .lnb_sub_wrap li {display:block; float:none; width:100%; padding:3px 0px;  min-height:15px; border:none; background:none;}
#all_menu .lnb_sub_wrap a {color:#393939; font-size:16px; padding:3px 0; letter-spacing:-1px;}
#all_menu .lnb_sub_wrap a:hover {border-bottom:1px solid #000;}


/* 하단 레이아웃 */

.footermenu { padding:0px 0 0px 0;margin:0 0 0px; background:#5c5c5c; border-bottom:1px solid #616567;}
.footermenu li {display:inline-block; margin:0  0px; }
.footermenu li a {color:#fff; font-size:16px; padding:20px 15px; display:block; position:relative; letter-spacing:-1px;}
.footermenu li a:after {position:absolute; content:""; width:1px; height:13px; background:#d3d3d3; right:0; top:30px;}
.footermenu li:first-child a {background:none; padding-left:0;}
.footermenu li a.point {color:#ffff00; font-weight:bold;}

#footer {clear:both;padding:30px 0 50px; width:100%; background:#5c5c5c;}
#footer .footer_inner {position:relative; padding-left:8px;}
#footer h1 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#top_btn {position:fixed;bottom:20px;right:20px;width:50px;height:50px;line-height:46px;border:2px solid #333;color:#333;text-align:center;font-size:15px;z-index:90;background:rgba(255,255,255,0.5)}
#top_btn:hover{border-color:#5d574f;background:#77736d;color:#fff} 
#footer .at-container:after {display:block;visibility:hidden;clear:both;content:""}
#ft_logo {position:absolute; left:0; top:20px;}
#ft_logo2 {position:absolute; right:0; top:10px;}
#footer .ft_info{position:relative; padding-left:310px; width:100%;line-height:180%; padding-top:10px; color:rgba(255,255,255,0.5); font-size:15px; box-sizing:border-box; letter-spacing:-1px;}
#footer .ft_info span {margin-right:10px; font-weight:300;}
#footer .ft_info p {color:rgba(255,255,255,0.5); margin-top:5px;}


@media (max-width:990px) {


}

@media (max-width:1000px) {


/*util*/ 

a.topmenu_close {position:absolute; top:10px; right:10px;}
a.topmenu_close i { color:#000;}

#navigation {position:fixed; display:block; width:300px; background:#fff; z-index:9999; border:1px solid #1a1a1a; left:-100%; height:100%;}
#navigation ul.topmenu { width:100%;}
#navigation ul.topmenu li.category {padding:10px;  color:#000; font-size:26px; border-bottom:1px solid #a38a76; background:#fff; position:relative; text-align:center;}
#navigation ul.topmenu li.first { border-bottom:1px solid #e5e5e5; }
#navigation ul.topmenu li.first a {font-size:18px; padding:17px 0; color:#373737; text-indent:20px; display:block; text-decoration:none;  font-weight:normal; position:relative;
    font-weight: 800;}
#navigation ul.topmenu li.first a::after {content: "\f078"; font-family: 'FontAwesome'; color:#ccc; right:10px; position:absolute; top:15px; font-weight:normal; font-size:12px;}

#navigation ul.topmenu li.hover {}
#navigation ul.topmenu li.hover a::after {content: "\f077"; font-family: 'FontAwesome'; color:#808080; right:10px; position:absolute; top:15px; font-weight:normal; font-size:12px;}

#navigation ul.topmenu li.first ul.sec {position: absolute;    left: -9999px;}
#navigation ul.topmenu li.first ul.sec li {background:#f9f9f9; border-bottom:1px solid #e5e5e5;  }
#navigation ul.topmenu li.first ul.sec li:last-child {border-bottom:none;  }
#navigation ul.topmenu li.first ul.sec li a {display:block; padding:10px 0; color:#3d3530; font-size:14px; background:#eae3de;  text-indent:20px; font-weight:normal;font-weight: 600}
#navigation ul.topmenu li.first ul.sec li a::after {display:none;}
#navigation ul.topmenu li.hover ul.sec { left: 0px; width:100%;   top: 0px; position:relative;}
#navigation ul.topmenu li.first ul.sec li.depth3 a {text-indent:55px; font-size:14px;}

#navigation .bottom_info {  letter-spacing:-1px;  padding-left:0px; font-size:15px; padding-top:10px; padding-bottom:10px; background: #f2f2f2; text-align:center;}
#navigation .bottom_info span {color:#f15b42;}
#navigation .bottom_info a {background:url(../img/bottom_info_Bg2.png) no-repeat 0px center; display:inline-block; text-decoration:none; color:#5c5c5c; font-family:NanumGothic; font-weight:600; padding:12px 0px 12px 45px;}


#navi {display:none;}    
#header h1 {float:none; text-align:center;}
#header h1 img {width:190px;}
.top-menu {display:block; position:absolute; left:10px; top:50px; font-size:24px; width:40px; height:40px; text-align:center; line-height:35px; }
.top-menu a {color:#000;}
.top-tel {display:block; position:absolute; right:10px; top:50px; font-size:24px; width:40px; height:40px; text-align:center; line-height:35px;}
.top-tel a {color:#000;}
.top-txt {display:none;}
.top_logo {display:none;}
.top_logo_left {display:none;}

/* 하단 레이아웃 */

.footermenu { padding:0px 0 0px 0;margin:0 0 0px; margin-top:0px;}
.footermenu li {display:inline-block; margin:0  0px; }
.footermenu li a { font-size:12px; padding:0px 8px; display:block; position:relative; letter-spacing:-1px; font-weight:bold;}
.footermenu li a:after {position:absolute; content:""; width:1px; height:13px; background:#d3d3d3; right:0; top:8px;}
.footermenu li:first-child a {background:none; padding-left:0;}
.footermenu li a.point {color:#ff0000; font-weight:bold;}

#footer .ft_info {padding-left:0;}
#footer .footer_inner {padding-left:0px; padding:0 20px;}
#ft_logo {position:relative; width:100%; text-align:center; display:block; top:0; margin-bottom:20px;} 
#ft_logo img {width:180px;}
#footer .ft_info{ font-size:12px;}


}

/* ========================
   FOOTERMENU0909
   ======================== */
.footermenu0909 {
    padding: 0;
    margin: 0;
    background: #ffffff;
    border-bottom: 1px solid #ddd;
}

.footermenu0909 .at-container {
    max-width: 1200px; /* PC 최대 폭 */
    margin: 0 auto;
    padding: 0 15px; /* 좌우 여백 */
}

.footermenu0909 li {
    display: inline-block;
    margin: 0;
}

.footermenu0909 li a {
    color: #333333;
    font-size: 15px;
    padding: 15px 12px;
    display: block;
    position: relative;
    letter-spacing: -0.5px;
    text-decoration: none;
}

.footermenu0909 li a:after {
    position: absolute;
    content: "";
    width: 1px;
    height: 12px;
    background: #bbb;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

.footermenu0909 li:last-child a:after {
    display: none;
}

.footermenu0909 li a.point {
    color: #8B4513;
    font-weight: bold;
}

/* ========================
   FOOTER0909
   ======================== */
#footer0909 {
    clear: both;
    padding: 30px 0 30px;
    width: 100%;
    background: #ffffff;
}

.footer_inner0909 {
    max-width: 1200px; /* PC 최대 폭 */
    margin: 0 auto;
    padding: 0 15px; /* 좌우 여백 */
}

.ft_info0909 {
    line-height: 180%;
    color: #333333;
    font-size: 15px;
    letter-spacing: -1px;font-weight: 400;
}

.ft_info0909 span {
    margin-right: 10px;
    font-weight: 300;
    color: #777;
    display: inline-block;font-weight: 500;
}

.ft_info0909 p {
    margin-top: 5px;
    color: #b3795c;
    font-weight: bold;font-size: 12px;
}

/* ========================
   반응형 (모바일)
   ======================== */
@media (max-width: 768px) {
    /* footermenu - 모바일에서 한줄 좌측 정렬 */
    .footermenu0909 ul {
        text-align: left;
    }
    .footermenu0909 li {
        display: inline-block; /* 세로 → 가로 유지 */
        border: none;
    }
    .footermenu0909 li a {
        padding: 10px 8px;
        font-size: 14px;
        line-height: 1.4;
    }
    .footermenu0909 li a:after {
        display: inline-block;
        height: 12px;
        background: #bbb;
        vertical-align: middle;
    }

    /* 아이콘 정렬 */
    .footermenu0909 li a i {
        font-size: 14px;
        line-height: 1;
        vertical-align: middle; /* 글자와 높이 맞춤 */
        margin-left: 3px;
    }

    /* footer info - 모바일 */
    .ft_info0909 {
        font-size: 14px;
        line-height: 160%;
        text-align: left; /* 좌측 정렬 유지 */
    }
    .ft_info0909 span {
        display: block; /* 모바일에서 줄바꿈 */
        margin: 2px 0;
    }
    .ft_info0909 p {
        margin-top: 8px;
    }
}


/* 퀵메뉴*/
.Quick {position:absolute; z-index:999; right:calc(50% - 790px); width:141px;  top:0;}
.quick_menu_wrap { border:1px solid #dedede; padding:0;  font-size:12px;  background:#fff;  border-radius:10px;  overflow:hidden;}
.quick_menu_wrap .quick_tlt {background:#ffe683; color:#333; text-align:center; letter-spacing:0px;  font-size:18px; line-height:1.2em;}
.quick_menu_wrap .quick_tlt a {display:block; padding:18px 0;}
.quick_menu_wrap .quick_tlt a:hover {color:#000;}
.quick_menu_wrap ul.quick_menu_list {padding:10px;}
.quick_menu_wrap ul.quick_menu_list li { text-align:left; font-size:16px; letter-spacing:-1px;}
.quick_menu_wrap ul.quick_menu_list li p {font-size:14px;}

.quick_fixed {position: fixed;top: 5px !important;}

@media (max-width:1360px) {
.Quick {display:none;}
}