@charset "utf-8";

.doc-cnt {margin-bottom:50px;}

.sub-title {text-align:center; margin-bottom:55px;}
.sub-title.mb {margin-bottom:20px;}
.sub-title.mgb {margin-top:100px;}
.sub-title.mgb h1 {margin-bottom:10px;}
.sub-title h1 {font-size:35px; color:#242424; letter-spacing:-.02em; font-weight:700; line-height:1.3em; margin-bottom:70px;}
.sub-title p  {text-align:center;}
.sub-title p span {font-weight:500; color:#ac0c19;}

.sub-title h2 {position:relative; font-size:28px; font-weight:700; color:#242424; letter-spacing:0; line-height:1.3em; padding-bottom:15px;}
.sub-title h2:before {position:absolute; content:""; width:30px; height:3px; background:#ac0c19; left:50%; margin-left:-15px; bottom:0;}

.doc-tit {margin-bottom:30px;}
.doc-tit h3 {position:relative; padding-left:30px; font-size:22px; font-weight:600; color:#242424; letter-spacing:-.02em; line-height:1.3em;}
.doc-tit h3:before {position:absolute; content:""; width:24px; height:24px; background:url('../images/sub/doc-tit-ico.png') 50% 50% no-repeat; background-size:contain; top:50%; margin-top:-12px; left:0;}

.table01 {width:100%; border-collapse:collapse; border-spacing:0px; border-top:1px solid #505050; text-align:center;}
.table01 th {height:60px; font-size:18px; line-height:-.03em; font-weight:600; padding:12px 20px; border:1px solid #dfdfdf; border-top:0; color:#fff; background:#163149; line-height:1.3em;}
.table01 td {text-align:center; font-size:16px; padding:7px 4px; border:1px solid #dfdfdf; line-height:1.750em; color:#222; height:60px;}
.table01 td.left {text-align:left; padding:10px 25px;}
.table01 td strong {font-weight:600; font-size:18px; color:#222;}
.table01 tr:first-child {border-top:0;}
.table01 tr th:first-child,
.table01 tr td:first-child {border-left:0; border-top:0;}
.table01 tr th:last-child,
.table01 tr td:last-child {border-right:0;}

.promise {display:flex; flex-direction:column; justify-content:center; align-items:flex-end; min-height:450px; background-size:cover; background-repeat:no-repeat; background-position:50% 50%;}
.promise .txt-box {width:38%;}
.promise .txt-box .tit {font-style:italic; color:#fff; font-family: 'ghanachoco'; font-size:52px; letter-spacing:-.02em; line-height:1.5em;}
.promise .txt-box .tit span {position:relative;}
.promise .txt-box .tit span:before {position:absolute; content:""; width:100%; height:8px; background:rgba(200, 136, 0, 0.8); left:0; bottom:0;}
.promise .txt-box .tit.ml {margin-left:80px;}
.promise .txt-box .txt {font-size:27px; font-weight:500; color:#fff; letter-spacing:0; line-height:1.3em; margin-top:20px;}
.promise .txt-box .txt span img {vertical-align:middle; margin-left:5px;}

.promise-list {}
.promise-list ul {}
.promise-list ul li {display:flex; align-items:center; justify-content:space-between; margin-top:100px;}
.promise-list ul li:nth-child(even) {flex-direction:row-reverse;}
.promise-list ul li .img {}
.promise-list ul li .tt-box {width:41.6%; padding-left:90px;}
.promise-list ul li:nth-child(even) .tt-box {text-align:right; padding-right:90px; padding-left:0;}
.promise-list ul li .tt-box .num {font-size:80px; color:#f2f2f2; letter-spacing:-.02em; font-weight:700; line-height:0.2em;}
.promise-list ul li .tt-box .tit {font-family: 'ghanachoco'; font-size:40px; color:#242424; letter-spacing:-.02em; line-height:1.3em; margin-bottom:20px;}
.promise-list ul li .tt-box .tit span {color:#ac0c19;}
.promise-list ul li .tt-box .txt {font-size:19px; color:#454545; line-height:2.0em; letter-spacing:-.02em;}

.customer {}
.customer .tits {position:relative; font-size:30px; font-weight:500; color:#242424; letter-spacing:-.02em; line-height:1.27em; text-align:center; width:100%; max-width:360px; margin:0 auto;}
.customer .tits:before {position:absolute; width:26px; height:22px; content:"“"; font-family: "Noto Sans KR", sans-serif; font-size:60px; font-weight:700; color:rgba(106, 2, 10, 0.2); left:0; top:0;}
.customer .tits:after {position:absolute; width:26px; height:22px; content:"”"; font-family: "Noto Sans KR", sans-serif; font-size:60px; font-weight:700; color:rgba(106, 2, 10, 0.2); right:0; bottom:0;}
.customer .tit strong {}
.customer .txts {text-align:center; margin-bottom:55px; margin-top:25px;}
.customer-list {}
.customer-list ul {display:flex; flex-wrap:wrap; margin:0 -15px; margin-bottom:-40px;}
.customer-list ul li {width:33.3333%; text-align:center; padding:0 15px; margin-bottom:40px;}
.customer-list ul li .img {}
.customer-list ul li .tit {font-size:18px; color:#242424; letter-spacing:-.03em; font-weight:600; line-height:1.3em; margin:15px 0 5px;}
.customer-list ul li .red-tt {font-size:16px; font-weight:500; color:#ac0c19; letter-spacing:-.03em; line-height:1.3em;}
.customer-list ul li .txt {margin-top:5px;}

.service {}
.service .service-list {}
.service .service-list ul {display:flex; flex-wrap:wrap; margin:0 -15px; margin-bottom:-40px;}
.service .service-list ul li {width:33.3333%; padding:0 15px; margin-bottom:40px;}
.service .service-list ul li .img {}
.service .service-list ul li .tit {font-size:18px; font-weight:700; color:#242424; letter-spacing:-.02em; line-height:1.39em; margin:15px 0 10px;}
.service .service-list ul li .txt {}

.service-box {background:#f8f8f8; padding:20px 35px;}
.service-box ul {}
.service-box ul li {line-height:1.88em; margin-bottom:3px;}
.service-box ul li:last-child {margin-bottom:0;}

.lunch-box {text-align:center;}
.lunch-box .img {}
.lunch-box .tit {font-size:18px; color:#454545; letter-spacing:-.02em; line-height:2.22em; margin-top:50px;}
.lunch-box .tit span {font-weight:500; color:#ac0c19;}
.lunch-box .tit2 { color: #242424; margin-top: 30px; letter-spacing: -.03em; line-height: 1.3em; font-size: 24px;     font-family: 'GmarketSans'; font-weight: 700;}

.order {display:flex; align-items:center;}
.order .img {}
.order .tt-box {padding-left:80px;}
.order .tt-box .lg-tit {font-size:38px; font-weight:700; color:#242424; letter-spacing:-.02em; line-height:1.18em;}
.order .tt-box .lg-tit span {color:#ac0c19;}
.order .tt-box .time {font-size:25px; font-weight:600; color:#454545; letter-spacing:-.03em; line-height:1.3em; margin:25px 0 15px;}
.order .tt-box .time span {}
.order .tt-box .order-list {}
.order .tt-box .order-list ul {margin-bottom:35px;}
.order .tt-box .order-list ul li {font-size:21px; font-weight:700; color:#454545; letter-spacing:-.03em; line-height:1.24em; margin-bottom:10px;}
.order .tt-box .order-list ul li span {font-weight:500; color:#242424; letter-spacing:-.02em;}
.order .tt-box .order-list ul li span img {vertical-align:middle; margin-right:5px;}
.order .tt-box .txt {font-size:18px; font-weight:500; color:#454545; letter-spacing:-.02em; line-height:1.667em; margin-bottom:10px;}
.order .tt-box .txt span {color:#ac0c19; font-weight:600;}
.order .tt-box .red-tt {font-size:16px; font-weight:500; color:#ac0c19; letter-spacing:-.02em; margin-top:25px;}

.payment {}
.payment .payment-list {}
.payment .payment-list ul {display:flex; margin-left:-30px;}
.payment .payment-list ul li {display:flex; flex-direction:column; justify-content:center; width:calc(50% - 30px); margin-left:30px; min-height:320px; text-align:center; border:1px solid #ddd;}
.payment .payment-list ul li .ico {}
.payment .payment-list ul li .tit {font-size:18px; font-weight:500; color:#242424; letter-spacing:-.02em; line-height:1.56em; margin:25px 0 10px;}
.payment .payment-list ul li .txt {}

.reservation-img {text-align:center;}

.refund {}
.refund .tits {font-size:25px; font-weight:600; letter-spacing:-.02em; text-align:center; width:100%; max-width:340px; margin:0 auto; height:60px; line-height:60px; color:#fff; background:#231916; border-radius:30px; margin-bottom:70px;}
.refund .refund-img {text-align:center;}
.refund .refund-list {margin-top:60px;}
.refund .refund-list ul {display:flex; flex-wrap:wrap; margin-left:-30px; margin-bottom:-40px;}
.refund .refund-list ul li {width:calc(33.3333% - 30px); margin-left:30px; margin-bottom:40px;}
.refund .refund-list ul li .box {position:relative; font-size:18px; font-weight:600; letter-spacing:-.02em; border-radius:15px 0 15px 15px; margin-bottom:-25px; width:100px; background:#ac0c19; text-align:center; color:#fff; height:45px; line-height:45px;}
.refund .refund-list ul li .tit {display:flex; justify-content:center; align-items:center; background:#f8f8f8; min-height:75px; text-align:center;}
.refund .refund-list ul li .tit strong {font-size:25px; font-weight:600; color:#ac0c19; padding-left:7px;}

.trend-bg {min-height:380px; display:flex; flex-direction:column; justify-content:center; background-size:cover; background-repeat:no-repeat; background-position:50% 50%; margin-top:100px;}
.trend-bg .tit {text-align:center; font-size:30px; font-weight:500; color:#fff; letter-spacing:-.03em; line-height:1.60em;}
.trend-bg .tit strong {background:#d29e2e;}

.convenience {text-align:center;}
.convenience .tit {font-size:30px; font-weight:600; color:#242424; letter-spacing:-.02em; line-height:1.33em; margin-bottom:12px;}
.convenience .tit strong {font-size:38px; color:#ac0c19; font-weight:700; letter-spacing:-.02em; font-style:italic;}
.convenience .txt {}
.convenience .convenience-img {margin-top:50px;}

.banner {}
.banner .tit {font-family: 'ghanachoco'; font-size:50px; color:#ac0c19; letter-spacing:-.02em; line-height:1.0em; text-align:center;}
.banner .txt {font-size:16px; color:#242424; letter-spacing:-.02em; line-height:1.88em; text-align:center; margin:15px 0 90px;}
.banner .txt span {font-size:20px; color:#ac0c19; font-weight:500;}
.banner .txt span strong {font-weight:600;}
.banner .box-wrap {display:flex; justify-content:center;}
.banner .box-wrap .box-tt {display:inline-block; font-size:25px; font-weight:600; letter-spacing:-.02em; border-radius:30px; padding:0 40px; height:60px; line-height:60px; background:#231916; color:#fff; text-align:center; margin-bottom:60px;}

.banner-img {}
.banner-img.mgt {margin-top:30px;}

.modal {max-width:640px !important;}
.inquiry-pop {}
.inquiry-pop .tit {font-size:30px; font-weight:700; letter-spacing:-.02em; text-align:center; height:80px; line-height:80px; color:#fff; background:#ac0c19;}
.inquiry-pop .txt {font-size:17px; color:#454545; letter-spacing:0; line-height:1.41em; text-align:center; margin:35px 0 30px;}
.inquiry-pop .right-tt {text-align:right; margin-bottom:10px; padding-right:60px;}
.inquiry-pop .right-tt span {color:#c9252c;}
.inquiry-pop .board-form {padding:0 60px;}
.inquiry-pop .board-form table {border:0;}
.inquiry-pop .board-form table th {white-space:nowrap; background:#fff; border:0; font-weight:400; padding-left:0; padding-right:0;}
.inquiry-pop .board-form table th .required {color:#c9252c;}
.inquiry-pop .board-form table td {border:0; padding:5px 20px; padding-right:0;}
.inquiry-pop .board-form table .item-flex {display:flex; align-items:center;}
.inquiry-pop .board-form table .input {border-radius:5px;}
.inquiry-pop .board-form table .btn-pack.medium {border-radius:5px;}
.inquiry-pop .form-agree {margin-bottom:0;}
.inquiry-pop input.btn-pack.large.focus {background:#ac0c19; width:170px; border-color:#ac0c19;}
.inquiry-pop .form-agree .check a {font-size:15px; color:#d08421; border:0; margin-left:0;}

.modal a.close-modal {top:30px !important;}

.custom-flex {display:flex; justify-content:space-between; margin-top:200px; margin-bottom:100px;}
.custom-flex .img {width:57.1%;}

.custom-flex .tab-slider {position:relative; width:34.6%; padding-bottom:50px;}
.tab-slider .tab {margin-bottom:40px;}
.tab-slider .tab ul {display:flex; flex-wrap:wrap; justify-content:center; margin-left:-10px; margin-bottom:-10px;}
.tab-slider .tab ul li {width:calc(25% - 10px); margin-bottom:10px; margin-left:10px;}
.tab-slider .tab ul li a {display:flex; justify-content:center; align-items:center; border:1px solid #ddd; height:40px; border-radius:5px; background:#fff; color:#454545; font-weight:500; text-align:center;}
.tab-slider .tab ul li.active a {background:#ac0c19; color:#fff;}
.tab-slider .slider {text-align:center;}
.tab-slider .slider .slides {position:static !important;}
.tab-slider .slider .slide {display:none;}
.tab-slider .slider .slide:first-child {display:block;}
.tab-slider .slider .slide ul {display:grid; grid-template-columns:repeat(4, 1fr); gap:28px 10px; margin:0 -8px;}
.tab-slider .slider .food {display:block; width:100%; background:none; border:0;}
.tab-slider .slider .thumb {position:relative; width:100%; max-width:75%; margin:0 auto; overflow:hidden; border-radius:50%;}
.tab-slider .slider .thumb:before {content:''; display:block; padding-bottom:100%;}
.tab-slider .slider .thumb img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:auto !important; height:auto !important; max-width:100%; max-height:100%; object-fit:contain;}
.tab-slider .slider .food.active .thumb:after,
.tab-slider .slider .food:hover .thumb:after {content:''; position:absolute; top:0; left:0; width:100%; height:100%; inset: 0; padding:2px; background:linear-gradient(120deg,#e47816,#b41c18); -webkit-mask: linear-gradient(#fff 0 0) content-box,  linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; border-radius:100%;}

.tab-slider .slider .slick-arrow {position:absolute; bottom:25px; z-index:50; overflow:hidden; width:14px; height:24px; border-radius:100%; border:0; background-repeat:no-repeat; text-indent:-9999em; transition:.2s; background:transparent; background-size:contain; background-repeat:no-repeat; z-index:6;}
.tab-slider .slider .slick-prev {left:0; background-image:url("../images/sub/slide_prevs.png");}
.tab-slider .slider .slick-next {right:0; background-image:url("../images/sub/slide_nexts.png");}
.tab-slider .slider .slick-dots {position:absolute; bottom:7px; left:0; width:100%; text-align:center; z-index:5; line-height:1.5em; display:flex !important; flex-wrap:wrap; align-items:center; justify-content:center; padding:0 20px;}
.tab-slider .slider .slick-dots li {width:7%; position:relative; display:inline-block; padding:0 5px; font-size:14px; cursor:pointer;}
.tab-slider .slider .slick-dots li button {position:relative; display:block; background:#fff; width:12px; height:12px; border:1px solid #9e9e9e; border-radius:50%; overflow:hidden; text-indent:-9999px;}
.tab-slider .slider .slick-dots li.slick-active button {width:50px; background:#ac0c19; border-radius:10px; border:1px solid #ac0c19;}
.tab-slider .slider .tit {display:flex; flex-direction:column; justify-content:center; font-size:15px; line-height:1.33em; letter-spacing:-.04em; margin:10px 0 5px; min-height:40px;}
.tab-slider .slider .price {font-size:16px; font-weight:500; color:#454545; letter-spacing:-.04em;}

.go-link {}
.go-link ul {display:flex; margin:0 -10px; justify-content:center;}
.go-link ul li {padding:0 10px;}
.go-link ul li a {display:block;}

.button-pop {text-align:center;}
.button-pop .button-img {}
.button-pop .lg-tit {font-size:19px; color:#242424; letter-spacing:-.03em; line-height:1.47em; font-weight:600; margin:15px 0;}
.button-pop .lg-tit span {color:#ac0c19;}
.button-pop .cotanct-tt {}
.button-pop .cotanct-tt strong {color:#ac0c19; font-weight:500; margin-bottom:45px;}
.btn-pack.focus {width:170px;}

.fancybox-navs {width:435px !important; height:460px !important; box-shadow:7px 0px 18px rgba(0, 0, 0, 0.1);}
.fancybox-navs .fancybox-inner {display:flex; flex-direction:column; justify-content:center; width:435px !important; height:460px !important; box-shadow:7px 0px 18px rgba(0, 0, 0, 0.1);}

.button-pop .btn-pack {width:180px; height:45px; line-height:45px; margin-top:40px;}

.sub-cnt {margin-top:200px;}

/* 식판 */
.tray-wrap {position:relative;}
.tray-wrap .area {position:absolute; border-radius:100%; overflow:hidden; _background:rgb(255,0,0,.2)}
.tray-wrap .area:before {content:''; display:block; padding-bottom:100%;}
.tray-wrap .area img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%);
width:auto !important; height:auto !important; max-width:100%; max-height:100%; object-fit:contain;}

/* 식판 - 5찬 */
.tray-wrap.st1 .main-side-dish {top:19.4%; left:8.2%; width:21.7%;}
.tray-wrap.st1 .side-dish-1 {top:20.6%; left:32.5%; width:18.4%;}
.tray-wrap.st1 .side-dish-2 {top:20.6%; left:53.5%; width:18.4%;}
.tray-wrap.st1 .side-dish-3 {top:20.6%; left:74.5%; width:18.4%;}
.tray-wrap.st1 .rice {top:52.9%; left:8.7%; width:26.8%;}
.tray-wrap.st1 .soup {top:52.9%; left:41.7%; width:26%;}
.tray-wrap.st1 .topping {top:57.8%; left:74.3%; width:17.2%;}

/* 식판 - 9찬 */
.tray-wrap.st2 .main-side-dish {top:33.2%; left:7.8%; width:22.4%;}
.tray-wrap.st2 .side-dish-1 {top:35.1%; left:33.4%; width:18%;}
.tray-wrap.st2 .side-dish-2 {top:35.1%; left:53.8%; width:18%;}
.tray-wrap.st2 .side-dish-3 {top:35.1%; left:74.7%; width:18%;}
.tray-wrap.st2 .side-dish-4 {top:8.1%; left:9.7%; width:18%;}
.tray-wrap.st2 .side-dish-5 {top:8.1%; left:31.2%; width:18%;}
.tray-wrap.st2 .side-dish-6 {top:8.1%; left:53%; width:18%;}
.tray-wrap.st2 .side-dish-7 {top:8.1%; left:74.8%; width:18%;}
.tray-wrap.st2 .rice {top:62.8%; left:9.3%; width:26.2%;}
.tray-wrap.st2 .soup {top:62.8%; left:41.9%; width:26%;}
.tray-wrap.st2 .topping {top:67.7%; left:74.6%; width:17.2%;}

/* 정기배달도시락 */
.txt-center {text-align: center;}
.font-g {font-family: 'ghanachoco';}
#sub .premium-delivery .contain {max-width: 1460px;}
.premium-delivery, .premium-delivery .sub-title h1 {color: #fff;}
.premium-delivery .sec {padding: clamp(2.5rem, 0.625rem + 4.6875vw, 6.25rem) 0;}
.premium-delivery .sec:first-child {padding-top: 0;}
.premium-delivery .box {font-size: clamp(1.25rem, 0.5625rem + 1.7188vw, 2.625rem); line-height: 1.42857em; padding: clamp(1.875rem, 0.625rem + 3.125vw, 4.375rem) 15px; border: 3px solid transparent; border-image: linear-gradient(to right, #c39738 25%, #c29836 50%, #fee8a6 75%, #c29836 100%); border-image-slice: 1;}
.premium-delivery .txt-box .bg-red {background: #ac0c19;}
.premium-delivery .txt-box .bg-gold {background: #c88800;}
.premium-delivery .advantage-items {display: flex; gap: 30px; flex-wrap: wrap;}
.premium-delivery .advantage-items .item {position: relative; z-index: 1; width: calc((100% - 60px) / 3); padding: clamp(1.25rem, -0.9375rem + 5.4688vw, 5.625rem) 15px;}
.premium-delivery .advantage-items .item:before {position: absolute; content: ''; top: 0; right: 0; bottom: 0; left: 0; background: #000; border-radius: 10px; border: 1px solid #ddd; opacity: .7; z-index: -1;}
.premium-delivery .advantage-items .num {display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; position: absolute; top: 18px; left: 18px; font-weight: 700; font-size: clamp(0.875rem, 0.6875rem + 0.4688vw, 1.25rem); color: #ac0c19; background: rgba(255,255,255,.8); border-radius: 100%;}
.premium-delivery .advantage-items .icon {margin-bottom: clamp(0.9375rem, 0.625rem + 0.7813vw, 1.5625rem);}
.premium-delivery .advantage-items .txt {font-size: clamp(0.9375rem, 0.8125rem + 0.3125vw, 1.1875rem); line-height: 1.47368em;}
.premium-delivery .sec-circles .box {border-width: 10px; padding: clamp(1.25rem, 0rem + 3.125vw, 3.75rem) 15px;}
.premium-delivery .sec-circles .sec-tit {margin-bottom: 35px;}
.premium-delivery .sec-circles .items {display: flex; justify-content: center; gap: clamp(0.9375rem, 0.1563rem + 1.9531vw, 2.5rem);}
.premium-delivery .sec-circles .circle-tit {background: rgba(172,12,25,.6); width: fit-content; margin:clamp(0.9375rem, 0.4688rem + 1.1719vw, 1.875rem) auto 0; padding: 0 15px;}






