@charset "utf-8";
/* *******************************************************
 * filename : main.css
 * description : 모바일 메인 css
 * date : 2018-02-27
******************************************************** */



#mainContent{background:#141414}

/* ******************  메인 비주얼 ********************** */
/* Main Layout :: VISUAL */
#mainVisual{position:relative; width:100%; overflow:hidden;}
#mainVisual .slick-track,
#mainVisual .slick-list {
	-webkit-perspective: 2000;
	-webkit-backface-visibility: hidden;
}
.main-visual-item{width:100%;}
.main-visual-item img{width:100%;}
/* VISUAL 화살표 */
#mainVisual .slick-arrow{position:absolute; top:50%; width:40px; height:40px; margin-top:-20px; cursor:pointer; border:0; cursor:pointer; z-index:9; font-size:0; }
#mainVisual .slick-arrow.slick-prev{left:0; background:rgba(0,0,0,.6) url(../images/button/main_visual_prev_btn.png) no-repeat; background-size:100% 100%; }
#mainVisual .slick-arrow.slick-next{right:0; background:rgba(0,0,0,.6) url(../images/button/main_visual_next_btn.png) no-repeat; background-size:100% 100%; }
/* VISUAL 버튼 */
#mainVisual .slick-dots{position:absolute; width:100%;left:0; bottom:10%; text-align:center;}
#mainVisual .slick-dots li{display:inline-block; margin:0 3px ; }
#mainVisual .slick-dots li button{
	cursor:pointer; margin:0px; padding:0px; background:none; font-size:0; width:8px; height:8px; border:1px solid #fff; opacity:0.4;filter:Alpha(opacity=40);
	-webkit-border-radius:50%;-moz-border-radius:50%;-o-border-radius:50%;border-radius:50%;
	-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s
}
#mainVisual .slick-dots li.slick-active button{background-color:#901219; width:30px; border-color:#901219; opacity:1.0;filter:Alpha(opacity=100); -webkit-border-radius:20px;-moz-border-radius:20px;-o-border-radius:20px;border-radius:20px;}		/* 버튼 active */

.main-visual-txt-con{position:absolute; bottom:10%; left:0px; width:100%; text-align:center; z-index:1; margin-bottom:20px;}
.main-visual-txt-con .main-visual-txt1{font-size:16px; color:#fff; letter-spacing:-0.5px; line-height:1.6em; font-family: 'Noto Serif KR', serif, "나눔고딕", NanumGothic, "Nanum Gothic","돋움", Dotum, Arial, sans-serif;}
.main-visual-txt-con .main-visual-txt1 b{display:block; font-size:22px; }

/* ******************  메인 컨텐츠 ********************** */
/* -------- 메인컨텐츠 :: 공통 -------- */
#mainContainer .main-tit{color:#fff; font-size:23px; text-align:center; ; font-weight:900; }
#mainContainer .main-tit:after{display:block; width:30px; height:3px; background-color:#bd1c25; content:""; margin:15px auto 20px;}

/* -------- 메인컨텐츠 :: 퀵메뉴 -------- */
#mainQuickMenuContent{overflow:hidden; width:100%;}
.quick-menu-list{display:flex; flex-wrap:wrap; background:#0e080a;}
.quick-menu-list > li{position:relative; width:50%; height:70px; border-right:1px solid #171314; border-top:1px solid #171314; box-sizing:border-box;}
.quick-menu-list > li:nth-child(even){border-right:0;}
.quick-menu-list > li:nth-child(-n+2){border-top:0;}
.quick-menu-list > li > button,
.quick-menu-list > li > a{display:block; width:100%; height:70px; padding-left:60px; background:url(../images/main/ico_arw_r.png) right 15px center / 17px auto no-repeat; font-size:10px; font-weight:700; color:#fff; line-height:70px; text-align:left; box-sizing:border-box;}
.quick-menu-list > li.baemin{background:url(../images/main/ico_baemin.png) 17px 17px / 36px auto no-repeat;}
.quick-menu-list > li.coupang{background:url(../images/main/ico_coupang.png) 17px 17px / 36px auto no-repeat;}
.quick-menu-list > li.kakaogift{background:url(../images/main/ico_kakaogift.png) 17px center / 36px auto no-repeat;}
.quick-menu-list > li.mealkit{background:url(../images/main/ico_mealkit.png) 17px 17px / 36px auto no-repeat;}

/* 220207 수정 */
.quick-menu-list > li .sub{display:none; position:absolute; left:0; bottom:0; overflow:hidden; width:201%; height:35px; background:#1d1d1d;overflow: auto;}


/* 220207 추가 */
.quick-menu-list > li .sub {-ms-overflow-style: none; /* IE and Edge */scrollbar-width: none; /* Firefox */}
.quick-menu-list > li .sub::-webkit-scrollbar {display: none !important; /* Chrome, Safari,Opera */ }

/* 220207 수정 */
.quick-menu-list > li .sub ul{white-space: nowrap;}
.quick-menu-list > li .sub ul:after{content:''; display:block; clear:both;}
.quick-menu-list > li .sub ul li{display: inline-block; position: relative;}

/* 220207 수정 */
.quick-menu-list > li .sub ul li:after{position:absolute; left:0; top: 11.5px; width:1px; height:10px; background:#5d5d5d; content:"";}




.quick-menu-list > li .sub ul li:first-child:after{display:none;}
.quick-menu-list > li .sub ul li a{display:block; padding:0 14px; font-size:10px; color:#fff; line-height:35px;}
.quick-menu-list > li:nth-child(even) .sub{left:-100%;}
.quick-menu-list > li:nth-child(even) .sub ul{justify-content:flex-end;}
.quick-menu-list > li.on{height:105px; background-color:#1d1d1d;}
.quick-menu-list > li.on > button,
.quick-menu-list > li.on > a{background-image:url(../images/main/ico_arw_b.png)}
.quick-menu-list > li.on .sub{display:block;}

/* -------- 메인컨텐츠 :: 추천메뉴 -------- */
#mainRecomMenuContent{position:relative; padding:27px 10px 45px 10px ; background:url(../images/main/main_menu_bg02.jpg) no-repeat; background-size:contain;}
/* 추천메뉴 :: 왼쪽 */
.recom-tit-box{text-align:center; margin-bottom:23px;}
.recom-tit-box .recom-tit{color:#fff;  }
.recom-tit-box .recom-tit:after{display:block; width:30px; height:3px; background-color:#bd1c25; content:""; margin:15px auto 20px;}
.recom-tit-box .recom-tit span{font-size:12px; letter-spacing:-0.25px; font-weight:500;}
.recom-tit-box .recom-tit strong{display:block; font-weight:900; font-size:23px; margin-top:5px}
.recom-tit-box .recom-sub-txt{color:#fff; line-height:18px; font-size:12px; ; font-weight:400; color:#fff; word-break:keep-all;}
/* 추천메뉴 :: 메뉴 */
.recom-menu-list-box{}
.recom-menu-list-box h4{height:58px; line-height:58px; color:#000; font-size:40px; ; font-weight:400; padding-left:22px; }
.recom-menu-list-box h4 b{font-weight:700;}
.recom-menu-list-box h4 span{font-weight:300;}
/* 추천메뉴 :: 메뉴 :: 메뉴상세 */
.recom-menu-item{position:relative; float:left; width:484px;}
.recom-menu-item .menu-thumb{display:block; position:relative;  width:100%; height:0; padding-top:115.08%; background-color:#000;}
.recom-menu-item .menu-thumb span{position:absolute; top:0; left:0; width:100%; height:100%; }
.recom-menu-item .menu-thumb img{width:100%; height:100%;}
.recom-menu-item.slick-current .menu-thumb img{opacity:1.0;filter:Alpha(opacity=100);}
.recom-menu-item .menu-tit{display:block; background-color:#ab171f; line-height:40px; color:#fff; font-size:13px; ; font-weight:900; padding:0 15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.recom-menu-item .menu-tit b{font-size:15px; opacity:0.3;filter:Alpha(opacity=30); margin-right:5px; font-family: 'Montserrat', sans-serif;}
.recom-menu-item .menu-detail-info {opacity:0;filter:Alpha(opacity=0); visibility:hidden; position:absolute; top:0px; left:0px; right:0px; ; height:557px; background-color:#000; background-color:rgba(0,0,0,0.8); text-align:center; -webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s}
.recom-menu-item .menu-detail-info b{color:#fff; opacity:0.3;filter:Alpha(opacity=30);font-size:31px; font-family: 'Montserrat', sans-serif; }
.recom-menu-item .menu-detail-info .menu-detail-tit{color:#fff; font-size:34px; font-weight:900; line-height:30px; display:block; padding:20px 0 25px;  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.recom-menu-item .menu-detail-info .menu-detail-txt{font-size:16px; line-height:30px; font-weight:600; color:#fff; margin-bottom:55px;}
.recom-menu-item .menu-detail-info .menu-detail-btn{display:block; width:126px; height:36px; margin:0px auto; line-height:36px; color:#fff; border-top:1px solid rgba(255,255,255,0.2); border-bottom:1px solid rgba(255,255,255,0.2); -webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s}
.recom-menu-item .menu-detail-info .menu-detail-btn em{font-size:10px; margin-right:15px;}
.recom-menu-item a:hover .menu-detail-info{opacity:1.0;filter:Alpha(opacity=100); visibility:visible;}
/* 추천메뉴 :: 메뉴 :: etc */
.recom-menu-box .slick-arrow{position:absolute; bottom:42px; width:51px; height:51px; cursor:pointer; border:0; cursor:pointer; z-index:9; font-size:0; -webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s}
.recom-menu-box .slick-arrow.slick-prev{left:-102px;background:#b8b8b8 url(/images/button/prev_btn_w.png) no-repeat 50% 50%}
.recom-menu-box .slick-arrow.slick-next{left:-51px;  background:#b8b8b8 url(/images/button/next_btn_w.png) no-repeat 50% 50%}
.recom-menu-box .slick-arrow:hover{background-color:#bd1c25}
.recom-menu-box-num{position:absolute; top:50%; left:-53px; width:106px; height:106px; margin-top:-53px; background:#bd1c25 url(/images/main/main_menu_num_bg.jpg) no-repeat 47px 45px; font-family: 'Montserrat', sans-serif; color:#fff; font-weight:700; ;}
.recom-menu-box-num .cur{ font-size:28px; position:absolute; top:30px; left:17px;}
.recom-menu-box-num .total{position:absolute; bottom:27px; right:22px;font-size:19px; opacity:0.55;filter:Alpha(opacity=55); }
/* VISUAL 버튼 */
.recom-menu-box .slick-dots{width:100%;text-align:center; padding-top:18px;}
.recom-menu-box .slick-dots li{display:inline-block; margin:0 3px ; }
.recom-menu-box .slick-dots li button{
	cursor:pointer; margin:0px; padding:0px; background:none; font-size:0; width:8px; height:8px; background-color:#bcbcbc;
	-webkit-border-radius:50%;-moz-border-radius:50%;-o-border-radius:50%;border-radius:50%;
	-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s
}
.recom-menu-box .slick-dots li.slick-active button{background-color:#901219;  border-color:#bd1c25; }		/* 버튼 active */


/* -------- 메인컨텐츠 :: STORE -------- */
#mainStoreContent{padding:0 10px;}
#mainStoreContent .store-sub-tit{text-align:center; color:#fff; font-size:12px; margin-bottom:15px; }
.main-store-wrapper{position:relative; z-index:1; max-width:1400px; margin:0px auto;}
/* 메인컨텐츠 :: 매장정보 */
.main-store-info-rolling-con{margin-top:8px;}
.main-store-info-item{}
.main-store-info-item .store-name{/* padding-left:18px;  */line-height:30px; /* background:url(/images/main/recom_tit_bg.jpg) no-repeat;  */background-size:auto 30px; color:#fff; font-size:16px;  font-weight:900; margin-bottom:38px; margin-right:100px;}
.main-store-info-item .store-event-view-btn{position:absolute; top:3px; right:0; width:90px; height:25px; line-height:25px; background-color:#bd1c24; text-align:center; color:#fff; font-size:12px;}
.main-store-info-item dl{margin-bottom:20px; ;}
.main-store-info-item dl dt{color:#000; font-size:18px; font-weight:600; margin-bottom:15px; }
.main-store-info-item dl dt i{font-size:18px; margin:-2px 5px 0 0 ;}
.main-store-info-item dl dd{font-size:15px; line-height:20px; color:#444; word-break:keep-all;}
.main-store-info-rolling-con .slick-arrow{position:absolute; bottom:-92px; width:58px; height:58px; border-radius:58px; cursor:pointer; border:0; cursor:pointer; z-index:9; font-size:0; -webkit-transition:all 0.4s;-moz-transition:all 0.4s;-o-transition:all 0.4s;-ms-transition:all 0.4s;transition:all 0.4s; box-shadow:1px 1px 5px rgba(0, 0, 0, .5);}
.main-store-info-rolling-con .slick-arrow.slick-prev{left:110px;background:#fff url(/images/button/prev_btn_b.png) no-repeat 50% 50%}
.main-store-info-rolling-con .slick-arrow.slick-next{right:145px;  background:#fff url(/images/button/next_btn_b.png) no-repeat 50% 50%}
.main-store-info-rolling-con .slick-arrow:hover{background-color:#4c4c4c; }
.main-store-info-rolling-con .slick-arrow.slick-prev:hover{background-image:url(/images/button/prev_btn_w.png)}
.main-store-info-rolling-con .slick-arrow.slick-next:hover{background-image:url(/images/button/next_btn_w.png)}
.store-rolling-box-num{position:absolute; left:110px; right:145px; ; bottom:-81px; line-height:58px; text-align:center;}
.store-rolling-box-num .cur{color:#222; font-size:18px; font-weight:900; vertical-align:middle;}
.store-rolling-box-num .line{color:#000; font-size:13px; opacity:0.5;filter:Alpha(opacity=50); margin:0 10px; vertical-align:middle;}
.store-rolling-box-num .total{color:#000; font-size:13px; font-weight:900; opacity:0.5;filter:Alpha(opacity=50); vertical-align:middle;}
/* 메인컨텐츠 :: STORE */
.main-store-photo-rolling-con{}
.main-store-photo-rolling-con .photo-item a{display:block; position:relative; width:100%; }
.main-store-photo-rolling-con .photo-img{display:block; height:0; padding-top:58.53%; position:relative;}
.main-store-photo-rolling-con .photo-img img{position:absolute; top:0px; left:0px; width:100%; min-height:100%;}
.main-store-photo-rolling-con .store-view-btn-box{
	position:absolute; top:0px; left:0px; width:100%; height:100%; background:#333; background-color:rgba(0,0,0,0.7);
	opacity:0;filter:Alpha(opacity=0); visibility:hidden;
	-webkit-transition:all 0.6s;-moz-transition:all 0.6s;-o-transition:all 0.6s;-ms-transition:all 0.6s;transition:all 0.6s
}
.main-store-photo-rolling-con .store-view-btn-box span{position:absolute; right:35px; top:50%; width:105px; height:20px; margin-top:-10px; border-bottom:1px solid #838383; color:#fff; font-size:10px; font-weight:900; text-align:right; line-height:20px;}
.main-store-photo-rolling-con .store-view-btn-box span i{float:left; font-size:18px;}
.main-store-photo-rolling-con a:hover .store-view-btn-box{opacity:1.0;filter:Alpha(opacity=50); visibility:visible;}
/* VISUAL 화살표 */
.main-store-photo-rolling-con .slick-arrow{position:absolute; top:50%; width:40px; height:40px; margin-top:-20px; cursor:pointer; border:0; cursor:pointer; z-index:9; font-size:0; }
.main-store-photo-rolling-con .slick-arrow.slick-prev{left:0; background:rgba(0,0,0,.6) url(/images/button/prev_btn.png) no-repeat; background-size:100% 100%; }
.main-store-photo-rolling-con .slick-arrow.slick-next{right:0; background:rgba(0,0,0,.6) url(/images/button/next_btn.png) no-repeat; background-size:100% 100%; }
/* -------- 메인 컨텐츠 :: 양쪽배너 -------- */
#mainSideBannerContent{padding:35px 0 0 0; position:relative; background-color:#1d1d1d}
.main-side-banner-box{text-align:center; color:#fff; margin-top:-1px;}
.main-side-banner-box a{display:block;}
.main-side-banner-box a img{width:100%;}

/* -------- 메인 컨텐츠 :: 하단 게시판 -------- */
#mainBoardContent{box-sizing:border-box; padding:38px 10px 54px}
.main-board-wrapper{position:relative; z-index:1; max-width:1400px; margin:0px auto;}
.main-board-box{position:relative;}
.main-board-box .main-bbs-tit{border-bottom:1px solid #414141; margin-bottom:12px;}
.main-board-box .main-bbs-tit strong{position:relative; top:1px;display:inline-block; color:#fff; font-size:23px; font-weight:600; border-bottom:1px solid #414141; padding-bottom:11px; padding-right:20px;}
.main-board-box .main-bbs-more-btn{position:absolute; top:5px; right:0px;}
.main-board-box .main-bbs-more-btn i{color:#fff; font-size:20px;}
.main-board-box .main-bbs-more-btn:hover i{color:#bd1c25}
.main-bbs-inner-box{position:relative; padding-left:120px; padding-top:3px;}
.main-board-box .main-bbs-thumb{position:absolute; display:block; top:0px; left:0; overflow:hidden; width:110px; }
.main-board-box .main-bbs-thumb img{width:100%; height:100%;}
.main-board-box .main-bbs-thumb .category{position:absolute; top:0px; left:0px; color:#fff; min-width:40px; height:40px; line-height:40px; text-align:center; padding:0 10px; font-size:15px; font-weight:600; ; background-color:#a90505;}
.main-bbs-info-box{padding:0 0 0 0; ;}
.main-bbs-info-box .main-bbs-subject{color:#fff; font-size:13px; font-weight:600; line-height:1.2em; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-bottom:10px; }
.main-bbs-info-box .main-bbs-txt{display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; box-orient:vertical; height:36px; overflow:hidden; color:#333; font-size:12px; line-height:18px; /* word-break:keep-all; */}

/* 뉴스 */
#mainNewsContent{margin-top:32px}
/* 영상 */
#mainVideoContent .main-bbs-thumb:after{position:absolute; top:0px; left:0px; right:0px; bottom:0px; content:""; background:url(/images/main/main_video_bg.png) no-repeat}

/***** 메인 슬라이드 화살표 추가 23-08-01 *****/
.main-slide-btn-box {position: absolute; top: 50%; transform: translateY(-50%); width: 100%; z-index: 9;}
.main-slide-btn-box button {position: absolute; font-size: 28px !important; color: #fff; transition: all 0.2s;}
.main-slide-btn-box button:hover {color: #bbb;}
.main-slide-btn-box .slide-prev {left: 40px;}
.main-slide-btn-box .slide-next {right: 40px;}

@media all and (max-width: 640px) {
	.main-slide-btn-box button {font-size: 18px !important;}
	.main-slide-btn-box .slide-prev {left: 20px;}
	.main-slide-btn-box .slide-next {right: 20px;}
}

@media all and (max-width: 480px) {
	.main-slide-btn-box .slide-prev {left: 0;}
	.main-slide-btn-box .slide-next {right: 0;}
}