@charset 'utf-8';

header{width: 100%; position: relative;  border-bottom:1px solid #00467f; box-sizing: border-box}
header .header-inner{max-width: 1200px; width: 1200px; margin: 0 auto; padding: 0 15px;height:160px; position: relative;}
header .header-inner .header-wrap{position: relative; padding-top:40px;}
header .header-inner .header-wrap:after{clear: both; display:block; overflow:hidden; content: ""; height:0}
header .header-inner .header-wrap .logo{float:left; margin-left:16px;}
header .header-inner .header-wrap .header-sch-wrap{float:left; margin-left:138px;}
.header-sch-wrap .header-search-box{width:600px;height:50px; background:#fff;border:3px solid #ed1c24; box-sizing: border-box; position: relative; border-radius: 12px 0 12px 0}
.header-sch-wrap .header-search-box input{width:530px; height:40px;font-size:16px;color:#555; border: none; margin:3px 0 0 3px}
.header-sch-wrap .header-search-box .btn-search{display: inline-block; width:26px; height:26px;
background: url(/images/new/common/btn/btn_red_search_icon.png) no-repeat 0 center; position: absolute; top:8px; right:12px; text-indent: -99999px;}
header .header-inner .header-wrap .util-menu{float:right; margin-top:10px}
header .header-inner .header-wrap .util-menu .util-list{}
header .header-inner .header-wrap .util-menu .util-list li{display:inline-block; margin-right:30px; position: relative;}
header .header-inner .header-wrap .util-menu .util-list li.myshop{margin-right:25px}
header .header-inner .header-wrap .util-menu .util-list li i{display:block; vertical-align: middle; width:36px; height:32px; margin:0 auto; text-align:center;}
header .header-inner .header-wrap .util-menu .util-list li a{}
header .header-inner .header-wrap .util-menu .util-list li a > p{position:absolute; top:37px; left:0; font-size:13px; text-align:center;}
header .header-inner .header-wrap .util-menu .util-list li.cart a > p{left:-3px;}
header .header-inner .header-wrap .util-menu .util-list li.delivery a > p{left:-2px;}
header .header-inner .header-wrap .util-menu .util-list li.myshop a > p{left:-10px;}
header .header-inner .header-wrap .util-menu .util-list li.cart .I-cart{background:url(/images/new/common/btn/btn_util_icon_img1.png) no-repeat center}
header .header-inner .header-wrap .util-menu .util-list li.cart .num-basket{width:18px; height:18px; line-height:19px; border-radius: 100%; background: #2496d4; display:block; color:#fff;
position: absolute; top:-6px; right:-12px; font-size:12px; text-align:center; font-family: Dotum,"돋움",sans-serif;}
header .header-inner .header-wrap .util-menu .util-list li.coupon .I-coupon{background:url(/images/new/common/btn/btn_util_icon_img2.png) no-repeat center}
header .header-inner .header-wrap .util-menu .util-list li.myshop .I-myshop{background:url(/images/new/common/btn/btn_util_icon_img3.png) no-repeat center}
header .header-inner .header-wrap .util-menu .util-list li.delivery{width:40px;}
header .header-inner .header-wrap .util-menu .util-list li.delivery .I-delivery{background:url(/images/new/common/btn/btn_util_icon_img4.png) no-repeat center; width:40px;}
header .header-menu-wrap{position: relative; margin-top:30px}
header .header-menu-wrap:after{clear: both; display:block; overflow:hidden; content: ""; height:0}
header .header-menu-wrap .category-wrap{position: absolute; top:0; left:0; z-index:10}
header .header-menu-wrap .category-wrap .btn-AllNav:after{clear:both; display:block; overflow:hidden; content:""; height:0}
header .header-menu-wrap .category-wrap .btn-AllNav {color:#444; font-size:15px;padding:0 0 19px 15px; display:block; height:41px;}
header .header-menu-wrap .category-wrap .btn-AllNav > span{line-height:17px; vertical-align: middle; display:block; font-size:15px; letter-spacing: -0.8px; float:left;}
header .header-menu-wrap .category-wrap .btn-AllNav .Icon-category{display:block; width:22px; height:16px; margin-right:10px;
vertical-align: middle; background:url(/images/new/common/btn/btn_caterogy_off.png) no-repeat center; float:left;}
header .header-menu-wrap .category-wrap .ctgrlist_wrap{display:block}
header .header-menu-wrap .header-gnb{padding-left:470px; /*padding-left:330px*/}
header .header-menu-wrap .header-gnb.header-gnb-executives{padding-left:445px;}
header .header-menu-wrap .header-gnb .gnb-menu li{display:inline-block;  vertical-align: middle; position: relative}
header .header-menu-wrap .header-gnb .gnb-menu > li > a:before{content: ''; position: absolute;  top:8px;  left: 1px;  display: block;  width:1px; height: 11px; background: #cccccc;}
header .header-menu-wrap .header-gnb .gnb-menu > li.first > a:before{display:none}
header .header-menu-wrap .header-gnb .gnb-menu li:last-child{padding-right:0}
header .header-menu-wrap .header-gnb .gnb-menu li > a{color:#444444; font-size:18px;  padding: 0 16px 14px 25px; /* padding: 0 13px 14px 22px; */ font-family:'notokr-medium';position: relative; display:block;}
header .header-menu-wrap .header-gnb .gnb-menu li > a.on{color:#00467f}
header .header-menu-wrap .header-gnb .gnb-menu li > a.on:after{content:""; position:absolute; bottom:0; left:50%; margin-left:-12px; width:24px; height:4px; background: #00467f;}
header .header-menu-wrap .members-link{position: absolute; top:0; right:11px}
header .header-menu-wrap .members-link > ul li{display:inline-block;padding: 0 4px 0 12px; vertical-align: middle; position: relative}
header .header-menu-wrap .members-link > ul li.first{padding-left:0}
header .header-menu-wrap .members-link > ul li.first:before{display:none}
header .header-menu-wrap .members-link > ul li > a{font-size:13px; color:#666;}
header .header-menu-wrap .members-link > ul li:before{content: ''; position: absolute;  top:4px;  left: 1px;  display: block;  width:1px; height: 10px; background: #cccccc;}

.ctgrlist-wrap .depth1-wrap{background-color:rgba(255, 255, 255, 0.7); width:168px; height:500px; border-right: 1px solid rgba(0, 0, 0, 0); border-left: 1px solid rgba(0, 0, 0, 0);}
.ctgrlist-wrap .depth1-wrap.on{background-color:#FFF; border-left:1px solid #ccc; border-right:1px solid #ccc; width:168px; border-bottom:1px solid #ccc;}
.ctgrlist-wrap .depth1-wrap .depth1{padding-top:20px; border-bottom:1px solid #d3d6cb}
.ctgrlist-wrap .depth1-wrap .depth1 > li {}
.ctgrlist-wrap .depth1-wrap .depth1 > li:last-child{margin-bottom:0}
.ctgrlist-wrap .depth1-wrap .depth1 > li > a{color:#444; font-size:15px; display:block; line-height:31px; padding:0 25px;}
.ctgrlist-wrap .depth1-wrap .depth1 > li > a.on{background-color:#2496d4; color:#fff;}
.ctgrlist-wrap .brand-list {padding:20px 25px 0 25px;}
.ctgrlist-wrap .brand-list li {margin-bottom:8px;}
.ctgrlist-wrap .brand-list li:last-child{margin-bottom:0}
.ctgrlist-wrap .brand-list li img.on {display: none;}
.ctgrlist-wrap .depth2-wrap{position:absolute; bottom:0px; left:169px; width:255px; border:1px solid #00467f; height:calc(100% - 40px); background-color:#fff; box-shadow: 3px 2px 5px 1px rgba(0, 0, 0, .2); box-sizing:border-box; padding-top:20px; display:none;}
.ctgrlist-wrap .depth2-wrap.on{display:block;}
.ctgrlist-wrap .depth2-wrap strong{padding:0 20px; display:block; font-size:22px; color:#222; font-family:'notokr-bold'; font-weight:normal;}
.ctgrlist-wrap .depth2-wrap .depth2{margin-top:20px;}
.ctgrlist-wrap .depth2-wrap .depth2 > li a{display:block; padding:0 20px; color:#444; font-size:15px; line-height:32px;}
.ctgrlist-wrap .depth2-wrap .depth2 > li a.on{background-color:#00467f; color:#fff;}

.ctgrlist-wrap .depth1-wrap .depth1 > li.menu-service{margin-top:10px;}
.ctgrlist-wrap .depth1-wrap .depth1 > li.menu-service > a{color:#00467f; font-size:17px;  font-family: "NanumSquareRound"; font-weight:800; border-top: 1px solid #d3d6cb; padding:5px 25px}
.ctgrlist-wrap .depth1-wrap .depth1 > li.menu-service > a.on{color:#fff; background:#00467f}

.expendables-nav .depth2-wrap{width:310px;}
.expendables-nav .depth2-wrap:after{clear:both; display:block; overflow:hidden; content:""; height:0}
.expendables-nav .depth2-wrap .depth2{float:left; width:50%}

/*footer*/
footer{width:100%; padding:40px 0; background-color: #f5f5f5;}
footer .footer-wrap{max-width: 1160px; width: 1160px; margin: 0 auto; padding: 0 15px; position: relative;}
footer .footer-wrap > .foot-nav li{display:inline-block; position: relative; padding: 0 4px 0 12px;}
footer .footer-wrap > .foot-nav li > a{color:#707070; font-size:15px;}
footer .footer-wrap > .foot-nav li.first{padding-left: 0}
footer .footer-wrap > .foot-nav li.first:before{display:none;}
footer .footer-wrap > .foot-nav li:before{content: ''; position: absolute; top: 7px;  left: 1px;  display: block;  width: 1px; height: 11px; background: #ddd;}
footer .footer-wrap .address{margin:45px 0 30px 0;}
footer .footer-wrap .address .layout-f-info-item{}
footer .footer-wrap .address .layout-f-info-item > li{display:inline-block; position: relative;  padding: 0 4px 0 12px;color:#888; font-size:14px}
footer .footer-wrap .address .layout-f-info-item > li.first{padding-left: 0}
footer .footer-wrap .address .layout-f-info-item > li.first:before{display:none;}
footer .footer-wrap .address .layout-f-info-item > li > a{color:#888; font-size:14px}
footer .footer-wrap .address .layout-f-info-item > li:before{content: ''; position: absolute; top:5px;  left: 1px;  display: block;  width: 1px; height: 11px; background: #888888;}
footer .footer-wrap .address .layout-f-info-item > li .link-line{border-bottom:1px solid #cccccc;}
footer .footer-wrap .copyright{font-size:14px; color:#888888;}
footer .main-cs{position: absolute; bottom:0; right:20px; text-align:right;}
footer .main-cs > strong{font-size:16px; color:#666666; font-family:'notokr-medium'; font-weight:400}
footer .main-cs .cs-number{color:#444444; font-size:36px; margin:5px 0; font-family: "NanumSquareRound"; font-weight:700; letter-spacing: -0.5px;}
footer .main-cs .cs-time > li{font-size:14px; color:#666666; line-height:21px;}
footer .family-site{position: absolute; top:0; right:20px}
footer .customized{display: inline-block; position: relative; text-align: left; border: 1px solid #cccccc; width:216px; box-sizing: border-box}
.customized-selectbar a {display: block; height: 40px; padding: 0 25px 0 11px; background: #fff url(/images/new/common/ico/bul_select_gray_type1.png) no-repeat 95% center;
line-height: 40px; color: #666;  box-sizing: border-box;  vertical-align: middle; overflow: hidden;}
.customized-selectlist {width: 100%; max-height: 140px; display: none; position: absolute; top: 40px; left: -1px; border: 1px solid #ccc;
border-top: none; background: #fff; overflow-y: auto;}
.customized-selectlist ul li{display:block;}
.customized-selectlist ul {}
.customized-selectlist ul li a {height: 40px; line-height:40px; padding: 0 0 0 11px; display: block;color: #666;z-index: 10;}

.sub .visual-brand-wrap{position: absolute; top:41px; left:-330px; z-index: 10; display:none}
.sub .visual-offline-wrap {position: absolute; top:41px; left:-391px; z-index: 10; display:none}
.sub .visual-brand-wrap a{display:block; width:1200px; height:360px; background: #fff url(/images/new/temp/sub_visual_brand.jpg) no-repeat center;}
.sub .visual-offline-wrap a{display:block; width:1200px; height:360px; background: #fff url(/images/new/temp/sub_visual_offline.jpg) no-repeat center;}

/*따라다니는 배너*/
.floatbar-banner{z-index: 300; width:101px;position: absolute; top:105px;left: 50%; margin-left: -725px; }
.floatbar-banner img{display:block; vertical-align: middle;}
.floatbar-banner > a{display:block; vertical-align: middle; overflow: hidden; margin-bottom:3px;}
.floatbar{width:102px; box-sizing: border-box; position: absolute; top:180px;left: 50%;  margin-left:620px; z-index: 300; background: #ffffff; border:1px solid #e6e6e6}
.floatbar .sky-haeder{padding:10px 0; text-align:center}
.floatbar .sky-haeder > strong{color:#666666; font-size:14px; font-weight:400; font-family: 'notokr-light'; display:block}
.floatbar .sky-haeder > span{display:block; margin:10px auto; width:30px; height:18px; line-height:18px; background: #2496d4; border-radius: 10px; color:#ffffff;
font-size:14px;font-family: 'notokr-light'; }
.floatbar .sky-content{width:82px; margin:0 auto;}
.floatbar .sky-content .recent-swiper-container{width:82px;height:170px;}
.floatbar .sky-content .recent-swiper-container .swiper-slide{height:82px; margin-bottom:5px;}
.floatbar .sky-content .recent-swiper-container .swiper-wrapper{}
.floatbar .sky-content .swiper-slide > a{display:block; border:1px solid #e6e6e6; box-sizing: border-box;margin-bottom:5px;}
.floatbar .sky-content .swiper-slide > a:last-child{margin-bottom:0}
.floatbar .sky-content .swiper-slide > a img{display:inline-block; vertical-align: middle;}
.floatbar .sky-content .recent-btn{text-align:center; margin-top:7px;}
.floatbar .sky-content .recent-btn a {display:inline-block; margin-left:-3px; }
.floatbar .sky-content .recent-btn a img{display:block; vertical-align: middle;}
.floatbar .sky-login{margin-top:7px; border-top:1px solid #e6e6e6; text-align:center; height:45px; line-height:45px; background: #f5f5f5;}
.floatbar .sky-login > a{color:#666666; font-size:14px; font-family: 'notokr-light';}
.floatbar .sky-top{height:33px;}
.floatbar .sky-top > button{margin:0; padding:0}
button{margin:0; padding:0}
.store-search-icon{position: absolute; top:53px; left: 50%;  margin-left:620px;}
.store-search-icon > a{display:block; vertical-align: middle}

.ctgrlist-wrap{display:block}
.sub .ctgrlist-wrap{display: none}

/*컨텐츠*/ 
.layBodyWrap {width:100%; position: relative; padding-bottom:50px;}
.layBodyWrap .page-content{max-width: 1200px; width: 1200px; margin: 0 auto; position: relative;}
.depth2-tit{text-align:center; color:#202020; font-size:36px; font-weight:700; font-family: "NanumSquareRound"; }

.location-wrap{max-width: 1200px; width: 1200px; margin: 0 auto 30px auto; padding: 0 15px; position: relative;}
.location-wrap .location-nav{margin-top:15px;}
.location-wrap .location-nav > li{display:inline-block; padding: 0 4px 0 12px;vertical-align: middle;}
.location-wrap .location-nav li > a{color:#444444; font-size:12px; vertical-align:middle;}
.location-wrap .location-nav li > a.on .open{background:url(/images/new/common/ico/ico_location_on.png) no-repeat;}
.location-wrap .location-nav li.location-box{position:relative;}
.location-wrap .location-nav li.location-box .open{display:inline-block; width:16px; height:16px; vertical-align: middle; margin-left:10px;
background:url(/images/new/common/ico/ico_location_off.png) no-repeat;}
.location-wrap .location-nav li.location-box .location-menu{display:none; width:150px; border:1px solid #e1e1e1; position: absolute; top:28px; left:0; z-index:10; background: #fff; padding:12px}
.location-wrap .location-nav > li:before {content: ""; width:8px; height:13px; position: absolute; top:2px; left:-1px; background:url(/images/new/common/ico/ico_gray_arrow.png) no-repeat;}
.location-wrap .location-nav > li.first{padding-left:0}
.location-wrap .location-nav > li.first:before{display:none}
.location-wrap .location-nav li.location-box .location-menu li{line-height:14px; padding-bottom:8px; word-break: break-all;}
.location-wrap .location-nav li.location-box .location-menu li:last-child{padding-bottom:0}
.location-wrap .location-nav li.location-box .location-menu li > a:hover{color:#007bc8}

/*0619 css추가*/
#topline{width:100%; position:relative;}
#topline .topline-btn{display: inline; vertical-align: middle; position: absolute; top: 50%; left: 50%;  z-index: 1;  width: 1200px;  margin-left: -600px; margin-top: -9px;}
#topline .topline-btn .btn-clse{width:18px; height:17px; display:inline; vertical-align:middle; position:absolute; top:50%; right:0; margin-top:-9px;
 background: url(/images/new/common/ico/ico_close_gray_type1.png) no-repeat; text-indent: -999em; z-index:1}

#topline a > img{width:100%; height:100%; display:block; vertical-align: middle;}


/*221007 추가*/
.kitchen-nav .depth2-wrap{width:340px;}
.kitchen-nav .depth2-wrap:after{clear:both; display:block; overflow:hidden; content:""; height:0}
.kitchen-nav .depth2-wrap .depth2{float:left; width:50%}

.sky-top{position: fixed; bottom: 40px; right: 40px; z-index:10;text-align: center;}
.btn-service-top {position: relative; display: block; margin-bottom:10px;}
.btn-service-top img {display: block;}
.btn-service-top .img-on { position: absolute; top: 0; left: 0; opacity: 0; transition: 0.3s;}
.btn-service-top:hover .img-on {opacity: 1;}

