@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.root_daum_roughmap {width:100% !important; height:500px !important;}
.root_daum_roughmap .wrap_map {height:500px !important;}
.roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.roughmap_lebel_text:after {content:"레드스퀘어"; font-size:12px; line-height:15px;}

.bullet-item .bullet-list { padding-left:22px; margin-top:3px; font-size:clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); line-height:1.3; background:url(../images/sub/check.png) no-repeat left;}
.bullet-item .bullet-list:first-child {margin-top:0;}


/* 레드스퀘어 */
.intro-title .flxWrap {align-items: flex-end;}
.intro-title .titlebx {flex:1 0 clamp(200px, calc( 490 / var(--inner) * 100vw ), 490px); max-width:clamp(200px, calc( 490 / var(--inner) * 100vw ), 490px); font-size:clamp(30px, calc( 80 / var(--inner) * 100vw ), 80px); font-family:var(--font2); color:var(--color-1); line-height:1.2;}
.intro-title .textbx {flex:1 0 auto; width:1%; padding-bottom:clamp(10px, calc( 13 / var(--inner) * 100vw ), 13px); font-size:clamp(20px, calc( 28 / var(--inner) * 100vw ), 28px); font-weight:500; line-height:1.2; letter-spacing: -1px;}
.intro-title .textbx .pt {display:block; padding-top:clamp(10px, calc( 15 / var(--inner) * 100vw ), 15px);}
.introWrap {padding-top:clamp(40px, calc( 86 / var(--inner) * 100vw ), 86px);}
.introWrap .intbox {padding-top:clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px);}
.introWrap .intbox:first-child {padding-top:0;}
.intbox .flxWrap {align-items:center;}
.intbox .image {flex:1 0 600px; max-width:600px; margin-right:clamp(10px, calc( 80 / var(--inner) * 100vw ), 80px);}
.intbox .textbx {flex:1 0 auto; width:1%;}
.intbox .title {font-size:clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); font-weight:500; line-height:1.2;}
.intbox .desc {padding-top:clamp(20px, calc( 37 / var(--inner) * 100vw ), 37px); font-size:clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); color: #454545; line-height:1.4;}
.intbox.reverse .flxWrap {flex-direction: row-reverse;}
.intbox.reverse .image {margin-right:0; margin-left:20px;}

.infobx {padding:clamp(20px, calc( 34 / var(--inner) * 100vw ), 34px) clamp(15px, calc( 40 / var(--inner) * 100vw ), 40px); background:var(--color-1);}
.infobx .box {flex:1 0 50%; max-width:50%; color: #fff;}
.infobx .logo img {width:clamp(120px, calc( 210 / var(--inner) * 100vw ), 210px);}
.infobx .addr {padding-top:clamp(15px, calc( 28 / var(--inner) * 100vw ), 28px); font-size:clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight:500;}
.infobx .infolist {padding-top:5px; font-size:clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px);}
.infobx .infolist:first-child {padding-top:0;}
.infobx .infolist .name {font-weight:600;}

/* 프렌차이즈 */
.franbg {padding:clamp(40px, calc( 80 / var(--inner) * 100vw ), 80px) 0;}
.franbg.bg1 {background:url(../images/sub/fran-bg1.jpg) no-repeat; background-size:cover;}
.franbg.bg2 {background:url(../images/sub/fran-bg2.jpg) no-repeat; background-size:cover;}
.franbg.bg3 {background:url(../images/sub/fran-bg3.jpg) no-repeat; background-size:cover;}
.franbg.bg1 .contain {max-width:930px !important;}

.fran02-area .title {padding-bottom:clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px); font-size:clamp(22px, calc( 38 / var(--inner) * 100vw ), 38px); font-weight:500; line-height:1.2;}
.fran02item {display:flex; flex-wrap:wrap; margin:-10px;}
.fran02list {flex:1 0 25%; max-width:25%; padding:10px;}
.fran02list .inner {padding:clamp(25px, calc( 33 / var(--inner) * 100vw ), 33px) clamp(15px, calc( 28 / var(--inner) * 100vw ), 28px); border-radius:20px; border:1px solid var(--color-1); height:clamp(260px, calc( 300 / var(--inner) * 100vw ), 300px); box-shadow:0 3px 12px rgba(0, 0, 0, .5);}
.fran02list .step {font-size:18px; font-weight:600; color:var(--color-1); text-transform:uppercase;}
.fran02list .tit { padding-top:3px; font-size:clamp(18px, calc( 24 / var(--inner) * 100vw ), 24px); font-weight:600;}
.fran02list .desc {padding-top:clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); font-size:clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); color: #454545; letter-spacing:-1px;}

.fran03item {margin:-10px;}
.fran03list {padding:10px;}
.fran03list .inner {border-radius:20px;  overflow:hidden; background:#fff;}
.fran03list .flxWrap {align-items:center;}
.fran03list .textbx {flex:1 0 auto; width:1%; padding:clamp(25px, calc( 49 / var(--inner) * 100vw ), 49px) clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px) clamp(25px, calc( 46 / var(--inner) * 100vw ), 46px) clamp(20px, calc( 59 / var(--inner) * 100vw ), 59px);  height:260px;}
.fran03list .textbx.type2 {height:310px;}
.fran03list .textbx.type3 {height:300px;}
.fran03list .image {flex:1 0 310px; max-width:310px;}
.fran03list .title {font-size:clamp(24px, calc( 34 / var(--inner) * 100vw ), 34px); font-weight:600;}
.fran03list .subtt {padding-top:clamp(15px, calc( 24 / var(--inner) * 100vw ), 24px); font-size:clamp(18px, calc( 22 / var(--inner) * 100vw ), 22px); font-weight:500;}
.fran03list .subtt .main-color {font-weight: bold;}
.fran03list .dec {padding-top:10px; font-size:clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); color: #454545; letter-spacing: -1px;}

.sec4.fran04-area {background:transparent;}
.sec4.fran04-area .vat,
.sec4.fran04-area .lasttext {font-family:'Pretendard',sans-serif;;}

.fran05-area {position: relative; max-width:1920px; margin:0 auto;}
.fran05-area .textbx { padding-top:clamp(30px, calc( 60 / var(--inner) * 100vw ), 60px); text-align: center;}
.fran05-area .textbx span {display: inline-block;}
.fran05-area .textbx .name {font-size:clamp(24px, calc( 38 / var(--inner) * 100vw ), 38px); font-weight:600;}
.fran05-area .textbx .dec {padding-left:clamp(15px, calc( 35 / var(--inner) * 100vw ), 35px); font-size:clamp(16px, calc( 18 / var(--inner) * 100vw ), 18px); color: #454545;}
.fran05-area .btn-arrow {top: 40%; margin-top:0;  width:clamp(35px, calc( 60 / var(--inner) * 100vw ), 60px); height:clamp(35px, calc( 60 / var(--inner) * 100vw ), 60px); border-radius:50%; border:1px solid var(--color-1); transition: all 0.4s; }
.fran05-area .btn-arrow::after {display:none;}
.fran05-area .btn-arrow svg {color:var(--color-1); width:clamp(20px, calc( 28 / var(--inner) * 100vw ), 28px);}
.fran05-area .btn-arrow:hover {background:var(--color-1);}
.fran05-area .btn-arrow:hover svg {color:#ffff;}
.fran05-area .swiper-button-prev {left:18%;}
.fran05-area .swiper-button-next {right:18%;}

.brandwrap {display:flex; flex-wrap:wrap; color: #fff;}
.brandwrap .titlebx {flex:1 0 clamp(250px, calc( 485 / var(--inner) * 100vw ), 485px); max-width:clamp(250px, calc( 485 / var(--inner) * 100vw ), 485px); }
.brandwrap .title {font-size:clamp(30px, calc( 80 / var(--inner) * 100vw ), 80px); font-family:var(--font2); line-height:1.2; font-weight:400;}
.brandwrap .descbx {flex:1 0 auto; width:1%; letter-spacing: -1px; }
.brandwrap .dec {font-size:clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); line-height:1.5;}
.brandwrap .pointdec {padding-top:clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); font-size:clamp(20px, calc( 26 / var(--inner) * 100vw ), 26px);font-weight:500;}
.brandwrap .square {display:inline-block; margin-top:5px; padding:4px 9px; background:#ca4e53;}
.fran06wrap {padding-top: clamp(50px, calc( 100 / var(--inner) * 100vw ), 100px);}
.fran06wrap .tt {display:inline-block; padding:0 clamp(20px, calc( 40 / var(--inner) * 100vw ), 40px); padding-bottom:clamp(12px, calc( 18 / var(--inner) * 100vw ), 18px); background:url(../images/sub/textbg.png) no-repeat center bottom; background-size:contain; font-size:clamp(22px, calc( 38 / var(--inner) * 100vw ), 38px); font-weight:bold;}

.fran06item {display:flex; justify-content:space-between; flex-wrap:wrap; padding-top:clamp(35px, calc( 60 / var(--inner) * 100vw ), 60px); margin:0 -40px;}
.fran06list {flex:1 0 50%; max-width:50%; padding:0 40px;}
.fran06list:nth-child(even) {padding-top:80px;}
.fran06list:nth-child(odd) {margin-top:-80px;}
.fran06list:nth-child(1) {margin-top:0 !important;}
.fran06list .textwrap {padding-left:clamp(15px, calc( 28 / var(--inner) * 100vw ), 28px); margin-top:-5px; letter-spacing:-0.5px;}
.fran06list .number {font-size:clamp(28px, calc( 46 / var(--inner) * 100vw ), 46px); font-weight:bold; color:var(--color-1);}
.fran06list .subtt {padding-top:clamp(15px, calc( 30 / var(--inner) * 100vw ), 30px); font-size:clamp(20px, calc( 26 / var(--inner) * 100vw ), 26px); font-weight:500;}
.fran06list .subtt .main-color {font-weight: bold;}
.fran06list .descbx {padding-top:clamp(10px, calc( 22 / var(--inner) * 100vw ), 22px);}
.fran06list .dec {font-size:clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); line-height:1.5;}
.fran06list .square {display:inline-block; margin-top:10px; padding:4px 11px; font-size:clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); background:#f9e7e8; color:var(--color-1);} 
.fran06list .plus {padding-top:clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px);}
.fran06list .plustxt {font-size:clamp(18px, calc( 22 / var(--inner) * 100vw ), 22px); font-weight:500;} 

/* 메뉴 */
.menuitem {display: flex; flex-wrap:wrap; margin:-10px;}
.menulist {flex:1 0 25%; max-width:25%; padding:10px;}
.menulist .inner {padding:clamp(25px, calc( 30 / var(--inner) * 100vw ), 30px) clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px); position:relative; background:#f7f7f7; text-align:center; letter-spacing:-1px; z-index: 1; transition: all 0.4s; height:100%;}
.menulist .inner::after {position:absolute; content: ''; left:0; top:0; width:100%; height:100%; border:1px solid var(--color-1); z-index: -1; transition: all 0.2s;}
.menulist .inner:hover:after {border-width:3px;}
.menulist .images {position:relative; padding-bottom:101.88%; overflow:hidden;}
.menulist .images img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; height:auto; max-width:100%; min-height:100%; object-fit: contain;}
.menulist .infobox {padding-top:10px;}
.menulist .best {display:inline-block ; margin-right:5px; padding:2px 6px; background:var(--color-1); border-radius:6px; color: #fff; font-size:15px; line-height:1;}
.menulist .name { font-size:clamp(15px, calc( 18 / var(--inner) * 100vw ), 18px); font-weight:500;}
.menulist .subname {padding-top:10px; color:#686868;}
.menulist .payitem {display:flex; justify-content:center; padding-top:clamp(10px, calc( 20 / var(--inner) * 100vw ), 20px);}
.menulist .paylist {display:flex; align-items:center; padding-right:clamp(5px, calc( 10 / var(--inner) * 100vw ), 10px); font-weight:500;}
.menulist .paylist:last-child {padding-right:0;}
.menulist .size {display: flex; align-items: center; justify-content: center; margin-right:6px; width:clamp(20px, calc( 22 / var(--inner) * 100vw ), 22px); height:clamp(20px, calc( 22 / var(--inner) * 100vw ), 22px); border-radius:50%; background:var(--color-1); color: #fff; font-size:14px; }

/* 매장소개 */
.store-item {display:flex; flex-wrap:wrap;  margin:-10px;}
.store-list {flex:1 0 25%; max-width:25%; padding:10px;}
.store-list .inner {position:relative;  border-radius:20px; overflow:hidden; height:100%; z-index: 1;} 
.store-list .inner::after {position: absolute; content: ''; left:0; top:0; width:100%; height:100%; border:1px solid #ddd; border-radius:20px; z-index: -1;} 
.store-list .image {position:relative; padding-bottom:77.19%; overflow:hidden;}
.store-list .image img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100%; height:auto; max-width:100%; min-height:100%;}
.store-list .textbx {padding:clamp(15px, calc( 17 / var(--inner) * 100vw ), 17px) clamp(10px, calc( 25 / var(--inner) * 100vw ), 25px);}
.store-list .company {font-size:clamp(13px, calc( 15 / var(--inner) * 100vw ), 15px); font-weight:600; color:var(--color-1);}
.store-list .name {padding-top:3px; font-size:clamp(16px, calc( 20 / var(--inner) * 100vw ), 20px); font-weight:600;}
.store-list .addr {padding-top:8px; color:#454545;}
.store-list .tel {margin-top:5px; padding-left:25px; font-weight:500; background:url(../images/sub/call.png) no-repeat left top 4px;}