@charset "utf-8";

#mvWrap {position:relative; height:100vh; overflow:hidden;z-index: 11;}
#mVisual { width:100%; height:100%; background:#222}
.mvWrap .slick-list, .mvWrap .slick-track, .mvWrap .slick-slide {height:100%;}
#mVisual .mv_slider {position:relative; height:100%; overflow:hidden;}
#mVisual .mv_slider.mv1 {background:url('/images/main/mv1.jpg') no-repeat 70% center / cover;}
#mVisual .mv_slider.mv2 {background:url('/images/main/mv2.jpg') no-repeat 70% center / cover;}
#mVisual .mv_slider.mv3 {background:url('/images/main/mv3.jpg') no-repeat 70% center / cover;}

#mVisual .mv_slider .inner {display:flex;  justify-content:space-between; height:100%}
#mVisual .mv1 .img {width:1093px; position:absolute; right:0; bottom:0} 
#mVisual .mv1 .img img {width:100%}
#mVisual .inner{display: flex; align-items: end; padding-bottom: 24rem;}
#mVisual .mtxt{color: #fff;}
#mVisual .mtxt h4{font-size: 4rem;margin-bottom: 2rem;}
#mVisual .mtxt h3{font-family: 'paperlogy'; font-size: 8.6rem; font-weight: 800;}
#mVisual .mtxt p{font-family: 'ONE-Mobile-Title'; font-size: 2.6rem; margin-top: 5rem; line-height: 1.5;}

.mvControl {position:absolute; left:50%; bottom:100px; transform:translateX(-50%); z-index:20; width:1600px; color:#FFF;}
.mvControl .in-box {display:flex; align-items:center; gap:24px;}
.mvProgress {width:200px; height:2px; background:rgba(255,255,255,.3); overflow:hidden;}
.mvProgress span {display:block; width:0; height:100%; background:#FFF;}
.mvControl button {position:relative; width:24px; height:24px; padding:0; border:0; background:transparent; font-size:0; cursor:pointer;}
.mvControl button:before {content:''; position:absolute; left:50%; top:50%; width:10px; height:10px; border-top:2px solid #FFF; border-left:2px solid #FFF;}
.mvControl .mvPrev:before {transform:translate(-50%,-50%) rotate(-45deg);}
.mvControl .mvNext:before {transform:translate(-50%,-50%) rotate(135deg);}
.mvControl .num {margin:0; font-size:1.6rem; font-weight:400; color:#FFF; font-family:'Roboto';}
.mvControl .mvNow {font-weight:600;}
.mvControl .mvTotal {opacity:.4;}


@media all and (max-width:1600px){
    #mVisual .mv1 .img {width:60%}
	.mvControl { width:90%; bottom:50px}
    #mVisual .inner{padding-bottom: 15rem;}
    #mVisual .mtxt h3{font-size: 7rem;}
    #mVisual .mtxt p{font-size: 2.3rem;}
}
@media all and (max-width:1280px){
    #mVisual .mtxt h4{font-size: 3rem;}
}
@media all and (max-width:1024px){
    #mVisual .inner{padding-bottom: 10rem;}
    #mVisual .mtxt h3{font-size: 6rem;}
    #mVisual .mtxt p{font-size: 2rem;}
	#mVisual .mv1 .img {width:70%}
}
@media all and (max-width:976px){
    #mVisual .mtxt {padding-top:0; justify-content:center; ; height:50% }
	#mVisual .mtxt {text-align:Center; width:100%;  align-items: center;}
	#mVisual .img {width:100%; }
	#mVisual .img img {width:100%; max-width:640px; margin:0 auto}
    
	.mvControl { width:350px}
}
@media all and (max-width:768px){
    #mVisual .mtxt { height:60% }
    #mVisual .img img {width:90%; }
    #mVisual .mtxt h4{font-size: 2.5rem;}
    #mVisual .mtxt h3{font-size: 5.5rem;}
}
@media all and (max-width:480px){
    #mVisual .img img {width:120%; margin-left:-10%}
    #mVisual .mtxt h3{font-size: 4.5rem;}
    #mVisual .mtxt p{font-size: 1.8rem; margin-top: 3rem;}

	.mvControl { width:265px}
	.mvControl .in-box { gap:10px;}
	.mvProgress {width:140px; margin-right:10px} 
}



#mBrand { position: relative; width: 100%; padding: 10rem 0 17rem; background: linear-gradient(to bottom, #fcf7ef 0%, #fff 70%); z-index: 10; overflow: hidden;}
#mBrand .brand_content { position: relative; text-align: center; }
#mBrand .brand_store { width: 37.4rem; margin: 0 auto; }
#mBrand .brand_store img { display: block; width: 100%; }
#mBrand .brand_since {font-family: 'Oswald'; display: flex; align-items: center; justify-content: center; gap: 4.5rem; margin: 6rem 0 5rem; font-size: 2rem; font-weight: 400; color: #222; }
#mBrand .brand_since em { color: #e21e25; font-style: normal; }
#mBrand .brand_since i { display: block; width: 12rem; height: 1px; background: #e3d6c7; }
#mBrand .brand_title h2 { margin: 0; font-size: 6rem; font-weight: 700; line-height: 1.4;color: #222; letter-spacing: -0.05em;}
#mBrand .brand_title span { color: #e21e25; }
#mBrand .brand_desc {margin: 5rem 0;}
#mBrand .brand_desc p { font-size: 1.8rem; font-weight: 400; line-height: 2; color: #555; }
#mBrand .brand_btn { display: inline-flex; align-items: center; justify-content: center; min-width: 18rem; height: 5rem; padding: 0 20px; border: 1px solid #e21e25; border-radius: 50px; box-sizing: border-box; font-size: 1.8rem; font-weight: 600; color: #e21e25; transition: all 0.3s; }
#mBrand .brand_btn:hover { background: #e21e25; color: #fff; }

#mBrand .brand_deco { position: absolute; z-index: 1; pointer-events: none; }
#mBrand .brand_deco img { display: block; width: 100%; }
#mBrand .deco_left { width: 43.5rem; left: 0; bottom: 7rem;}
#mBrand .deco_right { width: 52.5rem; right: 0; top: -12rem; }

@media (max-width: 1480px) {
    #mBrand .deco_left { width: 35rem;}
    #mBrand .deco_right { width: 42rem;}
}
@media (max-width: 1280px) {
    #mBrand .brand_store { width: 33rem;}
    #mBrand .brand_since {font-size: 1.8rem;}
    #mBrand .brand_title h2 {font-size: 5rem;}
    #mBrand .brand_desc {margin: 4rem 0;}
    #mBrand .brand_desc p { font-size: 1.6rem;}
    #mBrand .deco_right { width: 32vw;}
    #mBrand .deco_left { width: 28vw;}
}

@media (max-width: 768px) {
    #mBrand .brand_store { width: 30rem;}
    #mBrand .brand_since i { width: 8rem; }
    #mBrand .brand_title h2 { font-size:4rem; }
}

@media (max-width: 480px) {
    #mBrand .brand_store{width: 26rem;}
    #mBrand .brand_since{margin: 4rem 0;gap: 3rem;font-size: 1.6rem;}
    #mBrand .brand_title h2{font-size: 3.5rem;}
    #mBrand .brand_desc p br{display: none;}
    #mBrand .brand_desc p { font-size: 1.8rem; font-weight: 400; line-height: 2; color: #555; }
    #mBrand .brand_btn{font-size: 1.6rem; min-width: 16rem;}
    #mBrand .deco_right {top: -5rem; width: 40vw; right: -5rem;}
    #mBrand .deco_left {width: 34vw; left: -3rem; bottom: 3rem;}
}


#big_txt { width: 100%; padding-bottom: 5rem; overflow: hidden; }
#big_txt h3 { display: block; width: max-content; margin: 0; white-space: nowrap; font-size: 15rem; line-height: 1.2;  color: #e21e25; will-change: transform; font-family: 'paperlogy';font-weight: 900;}
#big_txt h3 span { color: transparent; -webkit-text-fill-color: transparent; -webkit-text-stroke: 1px #e21e25; text-shadow: -8px -8px 0 #fcf7f0; }


@media (max-width: 1280px) {
    #big_txt h3 {font-size: 10rem;}
}

@media (max-width: 768px) {
    #big_txt {padding-bottom: 0;}
    #big_txt h3 {font-size: 8rem;}
}
@media (max-width: 480px) {
    #big_txt {padding-bottom: 3rem;}
    #big_txt h3 {font-size: 6rem;}
}

#big_txt2 { width: 100%; padding: 10rem 0 17rem; overflow: hidden; }
#big_txt2 h3 { display: block; width: max-content; margin: 0; white-space: nowrap; font-size: 15rem; line-height: 1.2; color: #e21e25; will-change: transform; font-family: 'paperlogy'; font-weight: 900; }
#big_txt2 h3 span { color: transparent; -webkit-text-fill-color: transparent; -webkit-text-stroke: 1px #e21e25; text-shadow: -8px -8px 0 #fcf7f0; letter-spacing: 0;}

@media (max-width: 1480px) {
    #big_txt2 h3 { font-size: 13rem; }
}

@media (max-width: 1280px) {
    #big_txt2 { padding: 8rem 0 14rem; }
    #big_txt2 h3 { font-size: 10rem; }
}

@media (max-width: 768px) {
    #big_txt2 { padding: 0rem 0 10rem; }
    #big_txt2 h3 { font-size: 8rem; }
}

@media (max-width: 480px) {
    #big_txt2 { padding:0 0 8rem; }
    #big_txt2 h3 { font-size: 6rem; }
}

#big_txt3 { width: 100%; padding-bottom: 17rem; overflow: hidden; }
#big_txt3 h3 { display: block; width: max-content; margin: 0; white-space: nowrap; font-size: 15rem; line-height: 1.2;  color: #e21e25; will-change: transform; font-family: 'paperlogy';font-weight: 900;}
#big_txt3 h3 span { color: transparent; -webkit-text-fill-color: transparent; -webkit-text-stroke: 1px #e21e25; text-shadow: -8px -8px 0 #fcf7f0; }


@media (max-width: 1280px) {
    #big_txt3 h3 {font-size: 10rem;}
}

@media (max-width: 768px) {
    #big_txt3 {padding-bottom: 10rem;}
    #big_txt3 h3 {font-size: 8rem;}
}
@media (max-width: 480px) {
    #big_txt3{padding-bottom: 8rem;}
    #big_txt3 h3 {font-size: 6rem;}
}



#mValue { position: relative; display: flex; align-items: center; min-height: 100vh; box-sizing: border-box; background: #fff; overflow: hidden; }
#mValue .value_title { text-align: center; margin-bottom: 6rem; }
#mValue .value_title h2 { font-size: 5.6rem; }
#mValue .value_title p { display: flex; align-items: center; justify-content: center; gap: 2rem; margin-top: 3rem; font-size: 1.8rem; color: #666; }
#mValue .value_title p span { display: block; width: 6rem; height: 1px; background: #d0cfcd; }

#mValue .value_stack { position: relative; width: 100%; height: 54rem; }
#mValue .value_card { position: absolute; top: 0; left: 0; display: flex; width: 100%; height:100%; overflow: hidden; border-radius: 1.5rem; will-change: transform; }
#mValue .value_card:nth-child(1) { top: 0; z-index: 1; background: #b88712; }
#mValue .value_card:nth-child(2) { top: 4rem; z-index: 2; background: #693f21; }
#mValue .value_card:nth-child(3) { top: 8rem; z-index: 3; background: #c10007; }

#mValue .value_info { display: flex; flex-direction: column; justify-content: center; width: 50%; padding: 6rem 8rem; box-sizing: border-box; color: #fff; }
#mValue .value_info > span { font-size: 1.8rem; font-weight: 700; color: #fff178; font-family: 'montserrat';}
#mValue .value_info h3 { margin-top: 5rem; font-size: 4rem; line-height: 1.45; font-family: 'ONE-Mobile-Title'; font-weight: normal;}
#mValue .value_info p { margin-top: 3rem; font-size: 1.8rem; line-height: 1.8; color: rgba(255,255,255,0.7); }

#mValue .value_img { width: 50%; height: 100%; overflow: hidden; }
#mValue .value_img img { display: block; width: 100%; height: 100%; object-fit: cover; }

@media (max-width: 1600px) {
    #mValue {min-height: 110vh; }
}
@media (max-width: 1280px) {
    #mValue {min-height: 100vh; }
    #mValue .value_title h2 { font-size: 4.5rem; }
    #mValue .value_stack {height: 50rem;}
    #mValue .value_info{padding: 5rem;}
    #mValue .value_info h3 { font-size: 3rem; margin-top: 3rem; }
    #mValue .value_info p { font-size: 1.6rem; }
}

@media (max-width: 768px) {
    #mValue .value_title h2 { font-size: 4rem; }
    #mValue .value_stack { height: min(60rem, calc(100vh - 23rem)); }
    #mValue .value_card { flex-direction: column; height: calc(100% - 4rem); }
    #mValue .value_card:nth-child(2) { top: 2rem; }
    #mValue .value_card:nth-child(3) { top: 4rem; }
    #mValue .value_info { width: 100%; flex: 1; min-height: 0; padding: 3rem 4rem; }
    #mValue .value_info h3 { font-size: 2.8rem; margin-top: 2rem; }
    #mValue .value_info p { font-size: 1.5rem; margin-top: 2rem; }
    #mValue .value_img { width: 100%; height: 50%; flex-shrink: 0; }
}

@media (max-width: 480px) {
    #mValue .value_title{margin-bottom: 4rem;}
    #mValue .value_title h2 { font-size: 3.5rem; }
    #mValue .value_title p {gap: 1rem; font-size: 1.5rem;margin-top: 2rem;}
    #mValue .value_title p span { width: 2rem; }
    #mValue .value_card { border-radius: 1rem; }
    #mValue .value_info { padding: 2.5rem; }
    #mValue .value_info > span { font-size: 1.4rem; }
    #mValue .value_info h3 { font-size: 2.4rem; margin-top: 1.5rem; }
    #mValue .value_info p { font-size: 1.5rem; margin-top: 1.5rem; }
    #mValue .value_info p br { display: none; }
}


#mMenu { position: relative; padding: 5rem 0 17rem; background: #fff; overflow: hidden; }
#mMenu .menu_top { display: flex; align-items: flex-end; justify-content: space-between; gap: 5rem; margin-bottom: 7rem; padding: 0 10rem;}
#mMenu .menu_title h2 { font-size: 5.6rem; font-weight: 700; line-height: 1.35; letter-spacing: -0.05em; color: #222; }
#mMenu .menu_title h2 span { color: #e21e25; }
#mMenu .menu_title p { margin-top: 2.5rem; font-size: 1.8rem; font-weight: 400; color: #999; }

#mMenu .menu_tab { display: flex; align-items: center; gap: 0.5rem; flex-shrink: 0; padding-bottom: 1rem; }
#mMenu .menu_tab button { display: flex; align-items: center; justify-content: center; width: 9rem; height: 9rem; padding: 0; border: 1px solid #e21e25; border-radius: 50%; background: #fff; color: #e21e25; font-size: 2.2rem; font-weight: 600; cursor: pointer; transition: all 0.3s; font-family:'ONE-Mobile-Title'; font-weight: normal;}
#mMenu .menu_tab button.on, #mMenu .menu_tab button:hover { background: #e21e25; color: #fff; }

#mMenu .menu_slider { margin: 0 -1.5rem; }
#mMenu .menu_slider .slick-list { overflow: hidden; }
#mMenu .menu_slider .slick-track { display: flex; }
#mMenu .menu_slider .slick-slide { height: 45rem; margin: 0 1.5rem; }
#mMenu .menu_card { position: relative; height: 100%; border-radius: 1.5rem; background: #ede5da; overflow: hidden; }
#mMenu .menu_img { position: absolute; inset: 0; display: flex; align-items: flex-end; justify-content: center; overflow: hidden; }
#mMenu .menu_img img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center bottom; transition: transform 0.5s; }
#mMenu .menu_name { position: relative; z-index: 1; padding: 3.5rem 2.5rem; font-size: 3rem; text-align: center; color: #222; transition: opacity 0.3s;  font-family: 'ONE-Mobile-Title'; font-weight: normal;}

#mMenu .menu_hover { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4rem 2rem; box-sizing: border-box; background: rgba(39,32,24,0.6); color: #fff; text-align: center; opacity: 0; visibility: hidden; transition: all 0.35s; }
#mMenu .menu_hover h3 { font-size: 3.4rem; font-weight: 400; line-height: 1.4; font-family: 'ONE-Mobile-Title';}
#mMenu .menu_hover p { margin-top: 3rem; font-size: 1.8rem; font-weight: 400; line-height: 1.7; color: rgba(255,255,255,0.9); }
#mMenu .menu_hover a { position: relative; display: flex; align-items: center; justify-content: center; width: 6rem; height: 6rem; margin-top: 5rem; border-radius: 50%; background: #fff; transition: all 0.3s; }
#mMenu .menu_hover a span { position: relative; display: block; width: 3rem; height: 3rem; }
#mMenu .menu_hover a span:before { content: ''; position: absolute; top: 50%; left: 0; width: 100%; height: 1px; background: #222; }
#mMenu .menu_hover a span:after { content: ''; position: absolute; top: 0; left: 50%; width: 1px; height: 100%; background: #222; }
#mMenu .menu_hover a:hover { transform: rotate(90deg); }
#mMenu .menu_card:hover .menu_hover { opacity: 1; visibility: visible; }
#mMenu .menu_card:hover .menu_name { opacity: 0; }
#mMenu .menu_card:hover .menu_img img { transform: scale(1.05); filter: blur(3px); }

#mMenu .menu_control { display: flex; align-items: center; justify-content: space-between; gap: 5rem; margin-top: 5rem; padding: 0 10rem;}
#mMenu .menu_progress { position: relative; width: 75%; height: 2px; background: #f0eae3; overflow: hidden; }
#mMenu .menu_progress span { display: block; width: 0; height: 100%; background: #e21e25; transition: width 0.4s; }
#mMenu .menu_navigation { display: flex; align-items: center; gap: 3rem; flex-shrink: 0; }
#mMenu .menu_num { display: flex; align-items: center; gap: 0.6rem; font-size: 1.7rem; font-family: 'Roboto'; color: #aaa; }
#mMenu .menu_num strong { color: #e21e25; font-weight: 700; }
#mMenu .menu_navigation button { position: relative; width: 5.5rem; height: 5.5rem; padding: 0; border: 0; border-radius: 50%; background: #fcf7ef; cursor: pointer; transition: background 0.3s;}
#mMenu .menu_navigation button:before { content: ''; position: absolute; top: 50%; left: 50%; width: 1rem; height: 1rem; border-top: 2px solid #e21e25; border-right: 2px solid #e21e25; }
#mMenu .menu_prev:before { transform: translate(-30%,-50%) rotate(-135deg); }
#mMenu .menu_next:before { transform: translate(-70%,-50%) rotate(45deg); }
#mMenu .menu_navigation button:hover { background: #f5e5df; }

@media (max-width: 1480px) {
    #mMenu .menu_top {padding: 0 5rem;}
    #mMenu .menu_title h2 { font-size: 4.8rem; }
    #mMenu .menu_slider { margin: 0 -1rem; }
    #mMenu .menu_slider .slick-slide { margin: 0 1rem; height: 40rem;}
    #mMenu .menu_name { font-size: 2.4rem; }
    #mMenu .menu_hover h3 { font-size: 2.5rem; }
    #mMenu .menu_hover p { font-size: 1.6rem; }
    #mMenu .menu_control {padding: 0 5rem;}
}

@media (max-width: 1280px) {
    #mMenu { padding-bottom: 14rem; }
    #mMenu .menu_title h2 { font-size: 4.3rem; }
    #mMenu .menu_tab button { width: 7rem; height: 7rem; font-size: 1.7rem; }
}

@media (max-width: 1024px) {
    #mMenu .menu_top {padding: 0;}
    #mMenu .menu_top { gap: 3rem; }
    #mMenu .menu_title h2 { font-size: 3.8rem; }
    #mMenu .menu_title p { font-size: 1.6rem; }
    #mMenu .menu_card { height: 40rem; }
    #mMenu .menu_name { font-size: 2.3rem; }
    #mMenu .menu_control {padding: 0;}
}

@media (max-width: 768px) {
    #mMenu { padding: 4rem 0 10rem; }
    #mMenu .menu_top { flex-direction: column; align-items: center; margin-bottom: 5rem; text-align: center;}
    #mMenu .menu_title h2 { font-size: 3.5rem; }
    #mMenu .menu_tab { gap: 1rem; padding-bottom: 0; }
    #mMenu .menu_tab button { width: 6.5rem; height: 6.5rem; font-size: 1.6rem; }
    #mMenu .menu_card { height: 40rem; }
    #mMenu .menu_control { gap: 3rem; margin-top: 3rem; }
    #mMenu .menu_navigation { gap: 1.5rem; }
    #mMenu .menu_navigation button { width: 4.5rem; height: 4.5rem; }
}

@media (max-width: 480px) {
    #mMenu { padding-bottom: 8rem; }
    #mMenu .menu_top { gap: 3rem; margin-bottom: 4rem; }
    #mMenu .menu_title h2 { font-size: 3.3rem; }
    #mMenu .menu_title p { margin-top: 2rem;}
    #mMenu .menu_tab button { width: 6rem; height: 6rem;}
    #mMenu .menu_slider { margin: 0 -0.7rem;}
    #mMenu .menu_slider .slick-slide { margin: 0 0.7rem;  height: 43rem;}
    #mMenu .menu_name { padding: 3rem 1rem;}
    #mMenu .menu_hover p { margin-top: 2rem; }
    #mMenu .menu_hover a { width: 5rem; height: 5rem; margin-top: 3rem; }
    #mMenu .menu_control { gap: 2rem; }
    #mMenu .menu_progress { width: 100%; }
    #mMenu .menu_navigation { gap: 1rem; }
    #mMenu .menu_navigation button { width: 4rem; height: 4rem; }
}



#mFranchise { position: relative; background: #fff; overflow: hidden; }
#mFranchise .fran_title { margin-bottom: 6rem; text-align: center; }
#mFranchise .fran_title h2 { font-size: 4.5rem; font-weight: 700; line-height: 1.4; letter-spacing: -0.05em; color: #222; }
#mFranchise .fran_title h2 span { color: #e21e25; }
#mFranchise .fran_title p { margin-top: 2rem; font-size: 1.7rem; font-weight: 400; line-height: 1.8; color: #999; }

#mFranchise .fran_wrap { position: relative; padding: 0 1.5rem;}
#mFranchise .fran_slider { position: relative; }
#mFranchise .fran_slider .slick-list { overflow: hidden; border-radius: 1.5rem; }
#mFranchise .fran_slider .slick-track { display: flex; }
#mFranchise .fran_slider .slick-slide { height: auto; }
#mFranchise .fran_slider .slick-slide > div { height: 100%; }

#mFranchise .fran_item { display: flex !important; width: 100%; height: 58rem; overflow: hidden;gap: 1rem;}
#mFranchise .fran_img { width: 50%; height: 100%; overflow: hidden;  border-radius: 1.5rem; }
#mFranchise .fran_img img { display: block; width: 100%; height: 100%; object-fit: cover; }
#mFranchise .fran_info { position: relative; display: flex; width: 50%; height: 100%; padding: 6rem 8rem; box-sizing: border-box; background: #fcf7f0; overflow: hidden; border-radius: 1.5rem;  }
#mFranchise .fran_num { position: absolute; top: 7rem; right: 7rem; z-index: 1; font-family: 'Oswald'; font-size: 13rem; font-weight: 400; line-height: 1; letter-spacing: -0.05em; color: transparent; -webkit-text-fill-color: transparent; -webkit-text-stroke: 1px #f4ce9e; }
#mFranchise .fran_num::before { content: attr(data-num); position: absolute; top: -0.8rem; left: -1rem; z-index: -1; color: #faf0e3; -webkit-text-fill-color: #faf0e3; -webkit-text-stroke: 0; }

#mFranchise .fran_content { position: relative; z-index: 2; width: 100%; margin-top: 5rem;}
#mFranchise .fran_content h3 { font-size: 4rem; font-weight: 400; font-family: 'ONE-Mobile-Title'; line-height: 1.5; letter-spacing: -0.05em; color: #222; }
#mFranchise .fran_content h3 em {color: #e21e25; }
#mFranchise .fran_content p { margin-top: 3rem; font-size: 1.8rem;line-height: 1.9; color: #666; }

#mFranchise .fran_btn { display: inline-flex; align-items: center; justify-content: space-between; gap: 3rem; min-width: 18rem; height: 5rem; margin-top: 7rem; padding: 0 3rem; border-radius: 5rem; box-sizing: border-box; background: #e21e25; font-size: 1.8rem; font-weight: 600; color: #fff; transition: all 0.3s; }
#mFranchise .fran_btn span { position: relative; display: block; width: 1rem; height: 1rem; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg); }
#mFranchise .fran_btn:hover { background: #b91118; }

#mFranchise .fran_store { position: absolute; right: 8rem; bottom: 8rem; width: 34.2rem; z-index: 1; pointer-events: none; }
#mFranchise .fran_store img { display: block; width: 100%; }

#mFranchise .fran_wrap { position: relative; }
#mFranchise .slick-dots { position: absolute; top: 50%; right: 2rem; z-index: 10; display: flex; flex-direction: column; align-items: center; gap: 0.8rem; transform: translateY(-50%); width: fit-content; left: auto; height: fit-content;}
#mFranchise .slick-dots li { display: flex; align-items: center; justify-content: center; width: 1rem; height: 1rem; margin: 0; padding: 0; opacity: 1 !important;}
#mFranchise .slick-dots li.slick-active { height: 4.5rem; background: transparent !important;}
#mFranchise .slick-dots li button { display: block; width: 0.8rem; height: 0.8rem; padding: 0; border: 0; border-radius: 50%; background: #e21e25; font-size: 0; cursor: pointer; transition: all 0.3s; }
#mFranchise .slick-dots li.slick-active button { height: 4.5rem; border: 1px solid #e21e25; border-radius: 5rem; background: transparent !important; }
#mFranchise .slick-dots li button:before { display: none; }

@media (max-width: 1680px) {
    #mFranchise .fran_store { width: 26rem; }
}

@media (max-width: 1480px) {
    #mFranchise .fran_item { height: 52rem; }
    #mFranchise .fran_info { padding: 5rem 6rem; }
    #mFranchise .fran_content h3 { font-size: 3.5rem; }
    #mFranchise .fran_content p { font-size: 1.6rem; }
    #mFranchise .fran_store { width: 21rem; }
    #mFranchise .fran_num { font-size: 10rem; right: 3rem; top: 3rem;}
}

@media (max-width: 1280px) {
    #mFranchise .fran_title h2 { font-size: 4rem; }
    #mFranchise .fran_item { height: 48rem; }
    #mFranchise .fran_info { padding: 4rem; }
    #mFranchise .fran_store { width: 17rem; right: 3rem; bottom: 3rem;}
    #mFranchise .fran_slider .slick-slide{height: 60rem;}
    #mFranchise .fran_num{font-size: 8rem; right: 2rem; top: 2rem;}
}

@media (max-width: 1024px) {
    #mFranchise .fran_item { height: 45rem; }
    #mFranchise .fran_info { padding: 3rem; }
    #mFranchise .fran_store { width: 14rem; }
    #mFranchise .fran_control { right: 1rem; }
}

@media (max-width: 976px) {
    #mFranchise .fran_slider .slick-slide{height: 100%;}
    #mFranchise .fran_title { margin-bottom: 4rem; }
    #mFranchise .fran_title h2 { font-size: 3.5rem; }
    #mFranchise .fran_item { height: auto; flex-direction: column; }
    #mFranchise .fran_img { width: 100%; height: 33rem; }
    #mFranchise .fran_info { width: 100%; min-height: 40rem; padding: 5rem 4rem; }
    #mFranchise .fran_content { padding-bottom: 5rem; }
    #mFranchise .fran_content h3 { font-size: 2.8rem; }
    #mFranchise .fran_num { top: 2rem; right: 3rem; font-size: 8rem; }
    #mFranchise .fran_store { width: 17rem; right: 3rem; bottom: 1rem; }
    #mFranchise .slick-dots { right: 1.5rem; }
    #mFranchise .slick-dots li.slick-active, #mFranchise .slick-dots li.slick-active button { height: 3.5rem; }
    #mFranchise .slick-dots { top: auto; right: auto; bottom: 3rem; left: 50%; flex-direction: row; gap: 0.8rem; transform: translateX(-50%); }
    #mFranchise .slick-dots li { width: 1rem; height: 1rem; }
    #mFranchise .slick-dots li.slick-active { width: 4.5rem; height: 1rem; }
    #mFranchise .slick-dots li.slick-active button { width: 4.5rem; height: 0.8rem; }
}

@media (max-width: 480px) {
    #mFranchise .fran_title h2 { font-size: 3rem; }
    #mFranchise .fran_img { height: 25rem; }
    #mFranchise .fran_info { min-height: 39rem; padding: 3rem 2rem; }
    #mFranchise .fran_content { padding-bottom: 4rem; margin-top: 0;}
    #mFranchise .fran_content h3 { font-size: 2.2rem; }
    #mFranchise .fran_content p { margin-top: 2rem; font-size: 1.4rem; }
    #mFranchise .fran_num { font-size: 6rem; }
    #mFranchise .fran_btn { min-width: 13rem; height: 4rem; margin-top: 2.5rem; font-size: 1.4rem; }
    #mFranchise .fran_store { width: 12rem; right: 1rem; bottom: 1rem; }
}


#mFaq { position: relative; padding: 16rem 0; background: #fff; overflow: hidden; }
#mFaq > .inner { position: relative; z-index: 2; }
#mFaq .faq_title { text-align: center; margin-bottom: 5rem; }
#mFaq .faq_title h3 { font-size: 5.6em; font-weight: 700; line-height: 1.4; letter-spacing: -0.05em; color: #222; }
#mFaq .faq_title p { margin-top: 2.5rem; font-size: 1.8rem;  line-height: 1.8; color: #666; }

#mFaq .faq_list { width: 100%; max-width: 120rem; margin: 0 auto; }
#mFaq .faq_item { margin-bottom: 1rem; border-radius: 1rem; background: #fff; box-shadow: 0 0 1.5rem rgba(226,30,37,0.07); overflow: hidden; transition: background 0.3s; }
#mFaq .faq_item.on { background: #c9000b; }
#mFaq .faq_question { display: flex; align-items: center; width: 100%; min-height: 7.5rem; gap: 2.5rem; padding: 2rem 3rem; border: 0; background: transparent; box-sizing: border-box; text-align: left; cursor: pointer; }
#mFaq .faq_q { flex-shrink: 0; font-family: 'ONE-Mobile-Title'; font-size: 1.8rem; font-weight: 400; color: #e21e25; }
#mFaq .faq_question strong { flex: 1; font-size: 2.2rem; font-weight: 600; line-height: 1.5; color: #222; }
#mFaq .faq_arrow { position: relative; display: block; flex-shrink: 0; width: 0.9rem; height: 0.9rem; border-right: 2px solid #333; border-bottom: 2px solid #333; transform: rotate(45deg); transition: transform 0.3s; }
#mFaq .faq_item.on .faq_q, #mFaq .faq_item.on .faq_question strong { color: #fff; }
#mFaq .faq_item.on .faq_arrow { border-color: #fff; transform: rotate(225deg); }

#mFaq .faq_answer { display: none; }
#mFaq .faq_item.on .faq_answer { display: block; }
#mFaq .faq_answer_inner { padding: 0 7rem 3rem 6.9rem; font-size: 1.8rem; font-weight: 400; line-height:1.8; color: #777; word-break: keep-all; }
#mFaq .faq_item.on .faq_answer_inner { color: #f8f7bc; }

#mFaq .faq_circle { position: absolute; top: -13rem; right: -12rem; width: 55rem; height: 55rem; z-index: 1; pointer-events: none; animation: faqRotate 20s linear infinite; }
#mFaq .faq_circle svg { display: block; width: 100%; height: 100%; overflow: visible; }
#mFaq .faq_circle text { fill: #e21e25; font-family: 'Roboto'; font-size:3rem; font-weight: 800; }

@keyframes faqRotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@media (max-width: 1480px) {
    #mFaq .faq_circle { width: 40rem; height: 40rem; right: -10rem; }
}

@media (max-width: 1280px) {
    #mFaq { padding: 12rem 0; }
    #mFaq .faq_title h3 { font-size: 4rem; }
    #mFaq .faq_title p { margin-top: 2rem; font-size: 1.6rem;}
    #mFaq .faq_list { max-width: 95rem; }
    #mFaq .faq_circle { width: 27rem; height: 27rem; top: -10rem; right: -9rem; }
    #mFaq .faq_question strong {font-size: 2rem;}
    #mFaq .faq_answer_inner {font-size: 1.6rem; }
}

@media (max-width: 976px) {
}

@media (max-width: 768px) {
    #mFaq { padding: 10rem 0; }
    #mFaq .faq_title { margin-bottom: 4rem; }
    #mFaq .faq_title h3 { font-size: 3.5rem; }
    #mFaq .faq_answer_inner { padding: 0 3rem 3rem 5rem; }
    #mFaq .faq_answer_inner br { display: none; }
}

@media (max-width: 480px) {
    #mFaq { padding: 6rem 0 8rem; }
    #mFaq .faq_title h3 { font-size: 3.2rem; }
    #mFaq .faq_title p { font-size: 1.4rem; }
    #mFaq .faq_question { gap: 1.2rem; padding: 1.8rem 1.5rem; min-height: 5.5rem;}
    #mFaq .faq_q { font-size: 1.6rem; }
    #mFaq .faq_question strong { font-size: 1.5rem; }
    #mFaq .faq_answer_inner { padding: 0 2rem 2.5rem 4rem; font-size: 1.4rem; line-height: 1.9; }
    #mFaq .faq_circle { width: 17rem; height: 17rem; top: -7rem; right: -10rem; }
}


#mContact { position: relative; width: 100%; min-height: 55rem; padding: 13rem 0; box-sizing: border-box; background-color: #51483e; background-position: center; background-repeat: no-repeat; background-size: cover; background-image: url('/images/main/mcontact_bg.jpg');}
#mContact .inner { position: relative; z-index: 1; display: flex; align-items: stretch; gap: 7rem; }
#mContact .contact_left { display: flex; flex-direction: column; justify-content: space-between; width: 50%; color: #fff; }
#mContact .contact_text h2 { font-size: 5.5rem; font-weight: 700; line-height: 1.3; letter-spacing: -0.05em; }
#mContact .contact_text p { margin-top: 3rem; font-size: 1.8rem; font-weight: 400; line-height: 1.8; color: rgba(255,255,255,0.65); }
#mContact .contact_tel { display: flex; align-items: center; gap: 2rem; width: fit-content; margin-bottom: 6rem; color: #fff; }
#mContact .tel_icon { display: flex; align-items: center; justify-content: center; width: 7rem; height: 7rem; border: 1px solid rgba(255,255,255,0.6); border-radius: 50%; }
#mContact .tel_icon img { display: block; width: 3.5rem; height: 3.5rem; object-fit: contain; }
#mContact .contact_tel strong { font-family: 'ONE-Mobile-Title'; font-size: 4.5rem; font-weight: 400; letter-spacing: -0.03em; }

#mContact .contact_right { width: 50%; }
#mContact #contactForm { display: flex; flex-direction: column; justify-content: space-between; height: 100%; }
#mContact .contact_fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 2.5rem; }
#mContact .contact_field { display: flex; align-items: center; gap: 2rem; min-height: 8rem; border-top: 1px solid rgba(255,255,255,0.35); box-sizing: border-box; }
#mContact .contact_field.field_full { grid-column: 1 / -1; }
#mContact .contact_field label { display: flex; align-items: center; gap: 1.2rem; flex-shrink: 0; font-size: 1.8rem; font-weight: 600; color: #fff; }
#mContact .contact_field label img { display: block;  height: 1.4rem; object-fit: contain; }
#mContact .contact_field input { width: 100%; min-width: 0; height: 100%; padding: 0; border: 0; outline: 0; background: transparent; font-size: 1.7rem; font-weight: 400; color: #fff; }
#mContact .contact_field input::placeholder, #mContact .contact_field textarea::placeholder { color: rgba(255,255,255,0.4); }
#mContact .contact_field input:focus, #mContact .contact_field textarea:focus { outline: none; }
#mContact .contact_field:focus-within { border-color: rgba(255,255,255,0.9); }
#mContact .field_message { align-items: flex-start; flex-direction: column; gap: 2rem; padding: 2.5rem 0; }
#mContact .field_message textarea { display: block; width: 100%; height: 12rem; padding: 0; border: 0; outline: 0; background: transparent; resize: none; box-sizing: border-box; font-family: inherit; font-size: 1.7rem; line-height: 1.7; color: #fff; }

#mContact .contact_bottom { display: flex; justify-content: space-between; gap: 2rem; padding-top: 2.5rem; border-top: 1px solid rgba(255,255,255,0.35); }
#mContact .contact_agree { display: flex; align-items: center; gap: 0.5rem;     height: fit-content;}
#mContact .privacy_view { padding: 0; border: 0; border-bottom: 1px solid rgba(255,255,255,0.7); background: transparent; font-size: 1.5rem; color: rgba(255,255,255,0.75); cursor: pointer; }
#mContact .agree_text { font-size: 1.5rem; color: rgba(255,255,255,0.75); }
#mContact .agree_label { position: relative; display: inline-flex; align-items: center; gap: 1rem; cursor: pointer; }
#mContact .agree_label input { position: absolute; width: 1px; height: 1px; opacity: 0; }
#mContact .agree_check { display: block; position: relative; flex-shrink: 0; width: 1.8rem; height: 1.8rem; border: 1px solid #fff; border-radius: 50%; box-sizing: border-box; }
#mContact .agree_label input:checked + .agree_check { background: #e21e25; border-color: #e21e25; }
#mContact .agree_label input:checked + .agree_check:after { content: ''; position: absolute; top: 0.3rem; left: 0.5rem; width: 0.4rem; height: 0.7rem; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(45deg); }
#mContact .agree_label input:focus-visible + .agree_check { outline: 2px solid #fff; outline-offset: 3px; }
#mContact .agree_label > span:last-child { font-size: 1.5rem; color: rgba(255,255,255,0.75); }
#mContact .privacy_view { padding: 0; border: 0; border-bottom: 1px solid rgba(255,255,255,0.6); background: transparent; font-size: 1.4rem; color: rgba(255,255,255,0.8); cursor: pointer; }

#mContact .contact_submit { display: inline-flex; align-items: center; justify-content: center; gap: 3rem; flex-shrink: 0; min-width: 18rem; height: 5.5rem; padding: 0 2.5rem; border: 0; border-radius: 0.7rem; background: #e21e25; font-size: 2rem; font-weight: 400; color: #fff; cursor: pointer; transition: background 0.3s; font-family: 'ONE-Mobile-Title';}
#mContact .contact_submit:hover { background: #b91118; }
#mContact .submit_arrow { display: block; width: 0.9rem; height: 0.9rem; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg); }

.privacy_modal { position: fixed; inset: 0; z-index: 9999; display: none; align-items: center; justify-content: center; padding: 2rem; box-sizing: border-box; }
.privacy_modal.on { display: flex; }
.privacy_dim { position: absolute; inset: 0; background: rgba(0,0,0,0.65); }
.privacy_box { position: relative; z-index: 1; display: flex; flex-direction: column; width: 100%; max-width: 65rem; max-height: 85vh; overflow: hidden; border-radius: 1.5rem; background: #fff; box-shadow: 0 1rem 5rem rgba(0,0,0,0.2); }
.privacy_head { display: flex; align-items: center; justify-content: space-between; padding: 2.5rem 3rem; border-bottom: 1px solid #eee; }
.privacy_head h3 { font-size: 2.4rem; font-weight: 700; color: #222; }
.privacy_close { position: relative; width: 3rem; height: 3rem; padding: 0; border: 0; background: transparent; cursor: pointer; }
.privacy_close:before, .privacy_close:after { content: ''; position: absolute; top: 50%; left: 50%; width: 2.3rem; height: 2px; background: #333; }
.privacy_close:before { transform: translate(-50%,-50%) rotate(45deg); }
.privacy_close:after { transform: translate(-50%,-50%) rotate(-45deg); }
.privacy_body { padding: 3rem; overflow-y: auto; }
.privacy_body h4 { margin: 0 0 1rem; font-size: 1.8rem; font-weight: 700; color: #222; }
.privacy_body p { margin: 0 0 3rem; font-size: 1.6rem; line-height: 1.8; color: #666; }
.privacy_body p:last-child { margin-bottom: 0; }
.privacy_foot { padding: 2rem 3rem; border-top: 1px solid #eee; text-align: center; }
.privacy_confirm { min-width: 14rem; height: 4.5rem; border: 0; border-radius: 0.5rem; background: #e21e25; font-size: 1.6rem; font-weight: 600; color: #fff; cursor: pointer; }
html.contact_privacy_open { overflow: hidden; }

@media (max-width: 1480px) {
    #mContact .inner { gap: 5rem; }
    #mContact .contact_text h2 { font-size: 4.8rem; }
    #mContact .contact_tel strong { font-size: 4rem; }
    #mContact .contact_field { gap: 1.5rem; }
    #mContact .contact_field label { font-size: 1.6rem; }
}

@media (max-width: 1280px) {
    #mContact { padding: 8rem 0; }
    #mContact .contact_text h2 { font-size: 4.2rem; }
    #mContact .contact_text p { font-size: 1.6rem; }
    #mContact .contact_tel strong { font-size: 3.5rem; }
    #mContact .tel_icon { width: 6rem; height: 6rem; }
    #mContact .contact_field input { font-size: 1.5rem; }
    #mContact .contact_submit { min-width: 15rem; font-size: 1.6rem; }
}

@media (max-width: 976px) {
    #mContact { padding: 8rem 0; }
    #mContact .inner { flex-direction: column; gap: 6rem; }
    #mContact .contact_left, #mContact .contact_right { width: 100%; }
    #mContact .contact_text h2 { font-size: 4.5rem; }
    #mContact .contact_tel { margin-top: 4rem; margin-bottom: 0;}
    #mContact .contact_fields { gap: 0 3rem; }
    #mContact .contact_field { min-height: 7rem; }
    #mContact .contact_bottom { margin-top: 2rem; }
}

@media (max-width: 768px) {
    #mContact { padding: 7rem 0; }
    #mContact .contact_text h2 { font-size: 3.8rem; }
    #mContact .contact_text p { font-size: 1.6rem; }
    #mContact .contact_tel strong { font-size: 3.2rem; }
    #mContact .contact_field label { font-size: 1.6rem; }
    #mContact .field_message textarea { height: 10rem; }
    .privacy_head { padding: 2rem; }
    .privacy_head h3 { font-size: 2rem; }
    .privacy_body { padding: 2rem; }
    .privacy_body h4 { font-size: 1.7rem; }
    .privacy_body p { font-size: 1.6rem; }
}

@media (max-width: 480px) {
    #mContact { padding: 6rem 0; }
    #mContact .inner { gap: 5rem; }
    #mContact .contact_text h2 { font-size: 3.2rem; }
    #mContact .contact_text p { margin-top: 2rem;}
    #mContact .contact_tel { gap: 1.5rem; margin-top: 3rem; }
    #mContact .tel_icon { width: 5rem; height: 5rem; }
    #mContact .tel_icon img { width: 2.8rem; height: 2.8rem; }
    #mContact .contact_tel strong { font-size: 2.8rem; }
    #mContact .contact_fields { grid-template-columns: 1fr; }
    #mContact .contact_field { gap: 1.5rem; }
    #mContact .contact_field.field_full { grid-column: auto; }
    #mContact .contact_field label { min-width: 10rem; font-size: 1.6rem; }
    #mContact .contact_field input { font-size: 1.6rem; }
    #mContact .field_message { gap: 1.5rem; }
    #mContact .field_message textarea { height: 9rem; font-size: 1.6rem; }
    #mContact .contact_bottom { flex-direction: column; align-items: stretch; gap: 2.5rem; }
    #mContact .agree_label > span:last-child { font-size: 1.6rem; }
    #mContact .contact_submit { width: 100%; }
    .privacy_box { max-height: 80vh; }
    .privacy_body h4 { font-size: 1.6rem; }
    .privacy_body p { font-size: 1.6rem; }
}