/* BASIC css start */
/* 오른쪽퀵버튼 */
.top_family {text-align:center; height:30px; overflow:hidden; background:#212121;}
.top_family a{display:block;}
.top_family a img {height:30px;}
#fix_pagescroll { position:fixed;right:-50px;bottom:70px;z-index:99999;  -webkit-transition:all 1s;moz-transition:all 1s;-o-transition:all 1s;transition:all 1s;}
#fix_pagescroll.active {right:16px;bottom:65px;}
.updown > div {margin-top:5px;opacity:1;-webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s;  transition: all 0.3s;}
.updown > div:hover {opacity:0.8;}
.updown div.r_icon { cursor:pointer; position:relative; width:35px;height:35px; line-height:35px; 	background:rgba(102,102,102,0.3);  border:0px solid #ddd;  text-align:center; box-sizing:border-box;}
.updown div.r_icon i {font-size:14px;color:#fff;}
.updown img { width:35px;height:35px; }

.updown div.r_icon1 { cursor:pointer; position:relative; width:35px;height:35px; line-height:45px;background:rgba(255,238,46,0.3);  border:0px solid #ddd; text-align:center; box-sizing:border-box;}
.updown div.r_icon1 i {font-size:22px;color:#3c1e1e;}





#header .header_top div { display: inline-block; vertical-align: middle; font-size: 12px;}
#header .header_top .menubtn { width: 22px; left: 15px; position: absolute; top: 50%; transform: translateY(-50%);}
#header .header_top .btn_search { width: 20px; left: 35px; position: absolute; top: 40%; transform: translateY(-50%);} /* 추가★ */
#header .header_top .allmenu_btn { width: 100%;}
#header .header_top .basket { width: 34px; right: 10px; position: absolute; top: 50%; transform: translateY(-50%);}
#header .header_top .basket a { position: relative;}
#header .header_top .basket a img { width: 25px;}
#header .header_top .basket a span { display: block; position: absolute; top: 10px; right: -8px; line-height: 16px; color: #fff; background: #000; width: 17px; height: 17px; border-radius: 50%;  font-size: 0.6em; font-family: 'Roboto', sans-serif; text-align: center;}
#header .header_top .login{ position: absolute; top: 50%; transform: translateY(-50%); right: 45px; width: 26px;}
#header .header_top .login i { font-size: 30px;  }
#header .header_top .login a img{width:100%;}
#header .header_top .logo { width: 100%;}
#header .header_top .logo img { height:27px;  vertical-align: middle; }
#header .menu_swip {width: 100%;float: left; overflow: hidden; background: #f7ede4; padding: 14px 15px;}
#header .menu_swip .swiper-slide {width: initial !important; padding-right: 28px; height: auto;} 
#header .menu_swip a.active { color: #a48f78 !important; font-weight: bold;}
#header .menu{background: #f7ede4; overflow: hidden;}
#header .menu a{ font-size: 1em; color: #3b3b3b; font-family: 'Roboto','나눔고딕','NanumGothic', sans-serif;}
#header .menu a.active{ color: #000 !important; font-weight:bold;}

/* 메뉴 */
.mask{display:none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); z-index: 102;}
#all_menu{ position: fixed; top: 0; left: -100%; width: 84%; height: 100%; z-index: 1001; background: #fff;}
#all_menu .all_menu_in{ padding: 5px 15px 30px; max-height: 90%; overflow: auto;}
#all_menu .closeArea{ padding: 15px;}
#all_menu .closeArea img{ width: 19px;}
#all_menu .in_logo{ text-align: center; }
#all_menu .in_logo a img{ width: 120px;}
#all_menu .all_menu_join{ margin: 30px 0 40px;}
#all_menu .all_menu_join .a_top{}
#all_menu .all_menu_join .a_top li{ margin: 0 8px 0 0; font-size: .85rem; letter-spacing: 1px; }
#all_menu .all_menu_join .a_top li a{ display:block; padding: 13px 0; color: #000; font-size: .9rem; font-family: 'Noto Sans KR', sans-serif; }




/* 햄버거메뉴 안 분류 */
.headerGnb{}
.headerGnb .gnbInner .menu-list > li{ position: relative; -webkit-tap-highlight-color: rgba(0,0,0,0); padding: 20px 0; border-bottom: 1px solid #595858; }
.manuinba{position: absolute; bottom: 140px;  left: 120px;}

.toggle, .menu-submenu { cursor: pointer; font-size: 14px; position: relative; letter-spacing: 1px;}
.menu-submenu { display: none; margin: 5px 0 0; padding: 10px 22px; }
.menu-submenu >li{line-height: 36px;}
.menu-submenu >li a{ display: block; padding: 10px 0; color: #5c5c5c; font-family: 'Lato', 'NanumBarunGothic', sans-serif; line-height: 17px;}

.cate a{ /* display: block;  */ }

.cate li:nth-child(1) {display:none;}
.cate li:nth-child()  {display:none;}

/* 햄버거메뉴 안 분류 더보기 */
.ddBtn {position: absolute; top: 21px; right: 0; padding:9px 20px;}
.ddBtn:before{ -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 1; z-index: 2;}
.ddBtn:before, .ddBtn:after {content: ''; display: block; position: absolute; top: 50%; right: 12px; width: 12px; height: 2px; margin-top: -1px; background-color: #232323; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transition: all 0.3s; transition: all 0.3s ease-out;}
.ddBtnActive {padding:15px 20px;}
.ddBtnActive:before{ -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); background: #232323 !important;}
.ddBtnActive:after { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); background: #232323 !important; opacity: 0;}




/* 가이드 */


.infoBx1 .fotToggle1 { position: relative; -webkit-tap-highlight-color: rgba(0,0,0,0); padding: 0; }
.infoBx1 .fotToggle1 p{ color: #000; font-size: .95rem;font-family: 'Noto Sans KR', sans-serif; border-bottom: 1px solid #595858; padding: 20px 0; }
.infoBx1 .fotToggle1 .subInfo { display: none; margin: 18px 0 0; }
.infoBx1 .fotToggle1 .subInfo > li{line-height: 32px;}
.infoBx1 .fotToggle1 .subInfo > li a{ width:100%; color: #444; font-size: .825rem; font-family: 'Noto Sans KR', sans-serif; display: block; border: 0px solid #000 !important;; }

.menu_list_in a { display:block; color: #000; font-size: .95rem;font-family: 'Noto Sans KR', sans-serif; border-bottom: 1px solid #595858; padding: 20px 0; }


.ddBtn {position: absolute; top: 21px; right: 0; padding:9px 20px;}
.ddBtn:before{ -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 1; z-index: 2;}
.ddBtn:before, .ddBtn:after {content: ''; display: block; position: absolute; top: 50%; right: 12px; width: 12px; height: 2px; margin-top: -1px; background-color: #232323; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transition: all 0.3s; transition: all 0.3s ease-out;}
.ddBtnActive {padding:15px 20px;}
.ddBtnActive:before{ -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); background: #232323 !important;}
.ddBtnActive:after { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); background: #232323 !important; opacity: 0;}
/* sns 아이콘 영역 */
.snsiconArea{ position: absolute; left: 0px; bottom: 0; width: 100%; height: 48px; line-height: 48px; border-top: 1px solid #595758; background: #fff;}
.snsiconArea .linkInfo_bot { padding-left:15px; }
.snsiconArea .linkInfo_bot:after{content:''; display:block; clear:both}
.snsiconArea .linkInfo_bot li{ float: left; width : ; text-align: center; margin-right:10px; }
.snsiconArea .linkInfo_bot li a img{vertical-align: middle;}

/* 저작권 */
.copy{margin:20px 0; color:#999999; font-size: .79rem; font-family: 'Spoqa Han Sans', 'Spoqa Han Sans JP','Noto Serif KR', 'Sans-serif';}



.tooltipTarget { position:relative; }
.icoTooltip { z-index:auto; position:absolute; top:10%; left:73%; }

#header.headroom--top {position:relative;}
#header.headroom--not-top {position:fixed; top:0; left:0; width:100%; z-index:100; background:#fff;}
#header.slideDown.animated {
    -webkit-animation-name: slideDown;
    animation-name: slideDown;
}

#header.slideUp.animated {
    -webkit-animation-name: slideUp;
    animation-name: slideUp;
}

#header.slideUp {
    height: 129px;
}


.animated {
    -webkit-animation-duration: .5s;
    animation-duration: .5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}


@-webkit-keyframes slideDown {
    0% {
        -webkit-transform: translateY(-30px)
    }

    100% {
        -webkit-transform: translateY(0)
    }
}

@keyframes slideDown {
    0% {
        transform: translateY(-30px)
    }

    100% {
        transform: translateY(0)
    }
}

@-webkit-keyframes slideUp {
    0% {
        -webkit-transform: translateY(0)
    }

    100% {
        -webkit-transform: translateY(-30px)
    }
}

@keyframes slideUp {
    0% {
        transform: translateY(0)
    }

    100% {
        transform: translateY(-30px)
    }
}
/* BASIC css end */