@charset "utf-8";



#wrapper { position: relative; text-align:center; color:#fff; background:#333; --sec-padding:110px; z-index:1; }
#wrapper section { position: relative; padding:var(--sec-padding) 0; z-index:9; }
#wrapper .section-bg { position: absolute; left:0; top:0; width:100%; height:100%; overflow:hidden; z-index:-1; }
#wrapper .section-bg::before { content:""; position: absolute; left:0; top;0; width:100%; height:100%; background:rgba(0,0,0,.7); }
#wrapper .section-bg img { width:100%; height:100%; object-fit: cover; }
#wrapper .wrap { margin:0 auto; max-width:var(--main-width); padding:0 30px; }
#wrapper .section-head { font-size:3rem; font-weight: 700; margin-bottom:20px; }
#wrapper .section-txt { padding:0 30px; }
#wrapper b { color:var(--main-color1); }


#wrapper .logo { font-weight: 800; }
#wrapper .logo img { display:block; margin:0 auto; }

@media (max-width: 1024px) {
    #wrapper .section-head { font-size:2.5rem; }
}

@media (max-width: 767px) {
    #wrapper { --sec-padding:60px; }
    #wrapper .wrap { padding:0 15px; }
    #wrapper .section-head { font-size:1.5rem; margin-bottom:15px; }
    #wrapper .section-txt { padding:0 15px; }
}





#mainVisual { min-height:100vh; display:flex; align-items: center; justify-content: center; }
#mainVisual .section-txt { font-size:2.5rem; font-weight:800; text-shadow: 0 0 10px #111; }
#mainVisual .section-txt > *:nth-child(n+3) { text-shadow: 0 0 5px #111; }
#mainVisual h2 { line-height: 1.2; }
#mainVisual .logo { font-size:2.875rem; margin:40px 0; }
#mainVisual .logo img { width:300px; }
#mainVisual .logo b { font-size:.75rem; letter-spacing:-.5px; line-height: 1; color:#fff; background:#c70a0a; border-radius: 3px 1px 6px 2px; padding:3px 4px 2.5px 3px; text-shadow: none; vertical-align: middle; margin-top:-8px; display: inline-block; }


#mainVisual .support { border-radius: 60px 0 60px 0; background:var(--main-color3); color:#fff; display:inline-block; padding:20px 50px; font-size:2.5rem; margin:30px 0; animation:tong 1.3s ease-in-out infinite; }

#mainVisual .mini-txt { font-size:1.25rem; }
#mainVisual .mini-txt p { font-size:2.5rem; }

@keyframes tong {
	0%   { transform: translateY(-5px); }
    50%  { transform: translateY(5px); }
    100% { transform: translateY(-5px); }
}


@media (max-width: 1024px) {
    #mainVisual .section-txt { font-size:2rem; }

    #mainVisual .logo { font-size:2.5rem; margin:40px 0; }
    #mainVisual .logo img { width:230px; }

    #mainVisual .support { font-size:1.375rem; }

    #mainVisual .mini-txt p { font-size:2rem; }
}

@media (max-width: 767px) {
    #mainVisual { min-height:auto; padding:40px 0 !important; }
    #mainVisual .section-txt { font-size:1.125rem; }

    #mainVisual h2 { font-size:1.125rem; line-height:1.4; }
    #mainVisual .logo { font-size:1.25rem; margin:30px 0; }
    #mainVisual .logo img { width:180px; }

    #mainVisual .support { font-size:1rem; border-radius: 30px 0 30px 0; padding:12px 20px; margin:20px 0; }

    #mainVisual .mini-txt { font-size:1rem; }
    #mainVisual .mini-txt p { font-size:1.375rem; }
}


.swiper img { position:absolute; left:0; top:0; width:100%; height:100%; object-fit: cover; }



#maxProfit .section-bg::before { /*backdrop-filter: blur(10px);*/ background:rgba(0,0,0,.3); }

#maxProfit .swiper { margin: 10px 0 -20px; font-weight:600; padding-bottom:20px; }
#maxProfit .swiper-slide { width:300px; text-align:center; color:#111; padding:50px 35px 30px; }
#maxProfit .swiper-slide::before,
#maxProfit .swiper-slide::after { content: ""; position: absolute; left:0; top:0; right:0; z-index:-1; }
#maxProfit .swiper-slide::before { border-radius: 99px; height:30px; background:rgba(0,0,0,.6); }
#maxProfit .swiper-slide::after { margin:15px 20px 0; background-image:linear-gradient(to bottom, #faf4f0, #faf4f0),
    url('../images/max-profit-receipt.png'); background-repeat: no-repeat; background-size: 100% calc(100% - 15px), 100% auto; background-position: top, bottom; bottom:0; box-shadow: 5px 5px 10px rgba(0,0,0,.5); }

#maxProfit .head { font-size:2.375rem; font-weight:900; margin-bottom:10px; }
#maxProfit .date { font-size:1.25rem; line-height:1; font-weight: 700; }
#maxProfit .price1 { color:var(--main-color3); border-bottom:1px solid rgba(0,0,0,.1); margin-bottom:15px; padding-bottom:10px; font-size:2.125rem; }
#maxProfit .price2 { font-size:1.875rem; }
#maxProfit .percent { /*display: inline-block; border-radius: 99px; padding:5px 15px; background:var(--main-color3); color:#fff;*/ margin-top:5px; line-height:1; }


@media (max-width: 767px) {
    #maxProfit .swiper-slide { width:270px; padding:40px 25px 20px; }
    #maxProfit .swiper-slide::after { margin:15px 15px 0; }

    #maxProfit .head { font-size:1.625rem; }
    #maxProfit .price1 { margin-top:10px; padding-top:5px; }
    #maxProfit .price1 strong { font-size:1.375rem; }
    #maxProfit .price2 { font-size:.875rem; }
    #maxProfit .percent { padding:3px 10px; font-size:.875rem; }
}



#videoReason .section-bg::before { background:rgba(0,0,0,.6); }
#videoReason .wrap { display:flex; flex-wrap: wrap; align-items: center; }

#videoReason .video { width:460px; height: 750px; background:#202020; border-radius: 20px; overflow: hidden; box-shadow: 5px 5px 20px rgba(0,0,0,.3); }
#videoReason .video img { width:100%; height:100%; object-fit: cover; }
#videoReason video { width:100%; height:100%; object-fit: cover; }

#videoReason .section-txt { margin-left:50px; flex:1; }
#videoReason h3 { font-size:5.5rem; }
#videoReason ol { margin-top:40px; counter-reset: counter; --row-gap:40px; --circle-size:90px; }
#videoReason li { position: relative; text-align:left; padding:50px var(--row-gap) 50px 160px; border-radius: 999px 0 0 999px; background-image: linear-gradient(rgba(0,0,0,.55), rgba(0,0,0,.55)), linear-gradient(rgba(var(--main-color2-rgb),.2), rgba(var(--main-color2-rgb),.2)); counter-increment: counter; margin:15px 0; font-size:1.625rem;  overflow: hidden; line-height:1.6; }
#videoReason li::before,
#videoReason li::after { position: absolute; left:var(--row-gap); top:50%; transform: translateY(-50%); width:var(--circle-size); height:var(--circle-size); }
#videoReason li::before { content: ""; border-radius: 99px; border:2px dashed var(--main-color1); animation: spin 25s linear infinite; }
#videoReason li::after { content: counter(counter); font-size:4.5rem; line-height:calc(var(--circle-size) - 2px); text-align: center; color:var(--main-color1); }

#videoReason li b { color:#f5cdd8; font-size:1.5rem; font-weight:600; line-height:1.3; display: inline-block; }
#videoReason li span { position: relative; padding:2px 15px 2px 5px; color:#111; display:inline-block; background: linear-gradient(-45deg, transparent 7px, var(--main-color1) 0); }
#videoReason li span::before { content: ""; position: absolute; right:-2px; bottom:-2px; border-bottom: 7px solid rgba(0,0,0,.4); border-top: 7px solid transparent; border-left: 7px solid rgba(0,0,0,.4); border-right: 7px solid transparent; transform: rotate(90deg); }
#videoReason li:nth-child(even)::before { animation-direction: reverse; }

@keyframes spin {
    0% { transform: translateY(-50%) rotate(0deg); }
    100% { transform: translateY(-50%) rotate(360deg); }
}



@media (max-width: 1200px) {
    #videoReason .video { width:300px; height:550px; }
}

@media (max-width: 1024px) {
    #videoReason .wrap { flex-direction: column-reverse; }
    #videoReason .video { width:70%; height:auto; margin:30px auto 0; }
    #videoReason .video img { width:100%; height:auto; }


    #videoReason h3 { font-size:4rem; }
    #videoReason ol { --row-gap:25px; --circle-size:70px; }
    #videoReason li { font-size:1.5rem; padding-left:120px; }
    #videoReason li::after { font-size:3.5rem; }

    #videoReason .section-txt { margin-left:0; }
}

@media (max-width: 767px) {
    #videoReason .video { width:90%; }

    #videoReason .section-txt { padding:0; }
    #videoReason h3 { font-size:2.25rem; }
    #videoReason ol { margin-top:15px; --row-gap:25px; --circle-size:50px; }
    #videoReason li { font-size:1.125rem; padding-left:90px; border-radius: 50px 0 50px 0; padding-top:25px; padding-bottom:25px; margin:5px 0; line-height:1.3; }
    #videoReason li::before,
    #videoReason li::after { top:55px; }
    #videoReason li::after { font-size:2.25rem; }

    #videoReason li b { font-size:1rem; }
    #videoReason li span { padding:1px 15px 1px 5px; margin:3px 0 5px; }
}



#blogReview { padding-bottom:0 !important; }
#blogReview b { background:linear-gradient(160deg, var(--main-color1), var(--main-color3)); -webkit-background-clip: text; color: transparent; }

#blogReview .subhead { font-size:2rem; }
#blogReview h3 { font-size:5.5rem; line-height:1.1; margin:30px 0 20px; }

#blogReview .image { padding-bottom:130%; }
#blogReview .desc { font-size:1.5rem; display: inline-block; background:var(--main-color1); color:#111; padding:3px 12px;  }

#blogReview .swiper-review { margin:70px 0 var(--sec-padding); }
#blogReview .swiper-review .swiper-slide { width:250px; border-radius: 10px; overflow: hidden; }

#blogReview .swiper-partner { background:#000; padding:30px 0; }
#blogReview .swiper-partner .swiper-wrapper { transition-timing-function: linear; align-items: center; }
#blogReview .swiper-partner .swiper-slide { width:auto; max-height:80px; text-align: center; line-height:1.2; }
#blogReview .swiper-partner .logo { width:80px; height:80px; }
#blogReview .swiper-partner img { object-fit: contain; }
#blogReview .swiper-partner .txt.en { font-size:1.25rem; text-transform: uppercase; }
#blogReview .swiper-partner .txt.jp strong { font-family: 'Shippori Antique B1'; font-size:2rem; font-weight: 400; display:block; margin-bottom:10px; }
#blogReview .swiper-partner .txt.jp span { font-size:.5rem; word-spacing:50px; letter-spacing:2px; opacity: .3; }


@media (max-width: 1024px) {
    #blogReview .subhead { font-size:1.5rem; }
    #blogReview h3 { font-size:3.5rem; }
    #blogReview .desc { font-size:1.25rem; }
}

@media (max-width: 767px) {
    #blogReview { padding-left: 15px !important; padding-right:15px !important; }
    #blogReview .subhead { font-size:1.25rem; }
    #blogReview h3 { font-size:2.5rem; margin:15px 0; }
    #blogReview .desc { font-size:1rem; line-height: 1.2; }

    #blogReview .swiper-review { margin:40px -15px; width:auto; }
    #blogReview .swiper-review .swiper-slide { width:180px; }

    #blogReview .swiper-partner { margin:0 -15px; width:auto; }
}




#storeCompare .wrap { display:grid; grid-template-columns: auto 1fr auto; align-items: center; justify-content: center; }

#storeCompare .section-txt { order:2; font-size:1.25rem; }
#storeCompare dt { font-size:2.25rem; color:var(--main-color1); font-weight:800; margin-bottom:5px; }
#storeCompare dd { margin-bottom:20px; }
#storeCompare .line { position:relative; width:1px; height:30px; background:#fff; margin:30px auto; }
#storeCompare ul { margin-bottom:30px; }
#storeCompare li { margin:10px 0; white-space: nowrap; }

#storeCompare .table-box { background:rgba(0,0,0,.7); border-radius:30px; padding:30px; }
#storeCompare .table-box:last-child { order:3; }
#storeCompare .title { font-size:2.875rem; }
#storeCompare .title img { width:200px; }

#storeCompare table { border-top:2px solid var(--main-color3); width:350px; border-collapse:collapse; border-spacing:0; margin-top: 10px; }
#storeCompare caption { position: absolute; width:0; height: 0; overflow:hidden; }
#storeCompare .th-width { width:40%; }
#storeCompare tr > * { padding:5px 10px; border-bottom:1px solid rgba(255,255,255,.2); }
#storeCompare td { border-left:1px solid rgba(255,255,255,.2); }
#storeCompare table:not(.table-other-sales) td:nth-of-type(2) { padding:5px 0; width:25%; }


@media (max-width: 1400px) {
    #storeCompare .wrap { grid-template-columns: auto auto; gap:30px 10px; }
    #storeCompare .section-txt { grid-column: 1/3; grid-row:1/2; }
    #storeCompare .table-box:last-child { order:3; }
}
@media (max-width: 1024px) {
    #storeCompare .wrap { gap:20px 3px; }

    #storeCompare .section-txt { font-size:.875rem; }
    #storeCompare dt { font-size:1.5rem; }
    #storeCompare dd { margin-bottom:10px; }
    #storeCompare .line { height:22px; margin:20px auto; }
    #storeCompare li { margin:5px 0; }

    #storeCompare .table-box { position: relative; padding:15px 10px; }
    #storeCompare .table-box:last-child::before { content:"\f0ec"; position:absolute; left:0; top:50%; transform: translate(-50%, -50%); font-family: "Font Awesome 7 Free"; color:#ff2525; width:30px; height:30px; font-size:.875rem; border-radius: 99px; background:#fff; display: flex; align-items: center; justify-content: center; padding-top:2px; }

    #storeCompare .title { font-size:1.52rem; }
    #storeCompare .title img { width:100px; }
    #storeCompare table { width:150px; font-size:.625rem; }
    #storeCompare .th-width { width:37%; }
    #storeCompare tr > * { padding:3px; }
    #storeCompare td { font-size:.5rem; }
    #storeCompare table:not(.table-other-sales) td:nth-of-type(2) { padding:2px 5px; line-height:1.1; }
}

#billTable .wrap { display:flex; justify-content: space-between; align-items: flex-end; }
#billTable .section-txt { width:45%; min-width:580px; }
#billTable .section-txt .desc { font-size:2rem; margin-bottom:15px; }
#billTable .section-txt h3 { font-size:5.5rem; line-height:1.1; }
#billTable .image { position: relative; margin:30px 0 -25%; }

#billTable .percent { position: absolute; right:0; top:5%; border-radius: 99px; width:var(--circle-size); height:var(--circle-size); background:var(--main-color3); color:#111; display: flex; flex-direction: column; align-items: center; justify-content: center; z-index:1; --circle-size: 180px; animation:tong 1.3s ease-in-out infinite; }
#billTable .percent::before { content: ""; position: absolute; left:var(--border-size); top:var(--border-size); right:var(--border-size); bottom:var(--border-size); background: rgba(var(--main-color3-rgb),.5); border-radius: inherit; z-index:-1; --border-size:-10px; }

#billTable .percent span { font-size:1.625rem; font-weight: 800; line-height: 1.2; }
#billTable .percent strong { font-size:5rem; line-height: 1; }

#billTable .price-box { position: relative; border-radius: 20px 20px 0 0; overflow: hidden; background:#101010; z-index:2; }
#billTable .price-box .title { padding:15px; background:var(--main-color3); color:#111; font-size:1.5rem; font-weight:600; }
#billTable .price-box div[class^="price"] { padding:30px 0; margin:0 30px; }
#billTable .price-box .price1 { border-bottom:2px dashed var(--main-color3); }
#billTable .price-box span { font-size:1.5rem; }
#billTable .price-box strong { display:block; font-size:3rem;  color:var(--main-color3); }
#billTable .price-box strong b { font-size:4.5rem; color:var(--main-color3); line-height: 1; }
#billTable p { font-size:1.5rem; margin-top:20px; }
#billTable p i { display: inline-block; vertical-align: middle; margin-top:-9px; }

#billTable .bill img { image-rendering: -webkit-optimize-contrast; transform: translateZ(0); backface-visibility:hidden; }




@media (max-width: 1200px) {
    #billTable .section-txt { min-width:450px; padding:0; }
    #billTable .section-txt .desc { font-size:1.625rem; }
    #billTable .section-txt h3 { font-size:4rem; }

    #billTable .percent { --circle-size: 140px; }
    #billTable .percent span { font-size:1.375rem; }
    #billTable .percent strong { font-size:3.5rem; }

    #billTable .price-box .title { font-size:1.375rem; }

    #billTable .price-box span { font-size:1.375rem; }
    #billTable .price-box strong b { font-size:3rem; }
    #billTable p { font-size:1.375rem; }
}

@media (max-width: 1024px) {
    #billTable .wrap { display:block; }
    #billTable .section-txt { min-width:550px; margin:0 auto; }
    #billTable .price-box .title,
    #billTable p { font-size:1.125rem; }

    #billTable .price-box div[class^="price"] { margin:0 20px; }
    #billTable .price-box strong b { font-size:4rem; }

    #billTable .bill { margin-top:60px; }
}

@media (max-width: 767px) {
    #billTable .section-txt { width:100%; min-width:auto; max-width:500px; margin:0 auto; padding:0; }
    #billTable .section-txt .desc { font-size:1.25rem; }
    #billTable .section-txt h3 { font-size:2.625rem; }
    #billTable .image { margin-top:15px; }

    #billTable .percent { --circle-size: 100px; }
    #billTable .percent::before { --border-size:-5px; }

    #billTable .percent span { font-size:1rem; }
    #billTable .percent strong { font-size:2.5rem; }


    #billTable .price-box .title { padding:10px; line-height:1.2; }

    #billTable .price-box .title,
    #billTable p { font-size:1rem; }

    #billTable .price-box div[class^="price"] { padding:15px 0; }

    #billTable .price-box span { font-size:1.1525rem; }
    #billTable .price-box strong { font-size:1.5rem; }
    #billTable .price-box strong b { font-size:2.5rem; }

    #billTable p { margin-top:10px; }

    #billTable .bill { margin-top:30px; }

}




#menuSlide { background:#000; }
#menuSlide .swiper-slide { width:400px; max-width:30%; }
#menuSlide .swiper-slide .image { position:relative; padding-bottom:140%; }

@media (max-width: 767px) {
    #menuSlide .swiper-slide { max-width:70%; }
}




#menuList { padding-left: var(--sec-gap) !important; padding-right: var(--sec-gap) !important; --sec-gap:5vw; --tit-w:500px; --line-size:20px; --li-size:130px; }

#menuList .type { position: relative; display:grid; grid-template-columns: var(--tit-w) 1fr; align-items: center; gap:10px 0; padding:40px 70px 50px; margin-bottom:20px; box-shadow: 5px 5px 20px rgba(0,0,0,.5); }
#menuList .type::before,
#menuList .type::after { content:""; position:absolute; left:0; top:0; right:0; bottom:0; z-index:-1; }
#menuList .type::before { background:url('../images/menu-list-type-bg.jpg') no-repeat center/cover; opacity:.8; }
#menuList .type::after { background:url('../images/menu-list-type-line.jpg') no-repeat top center/100% var(--line-size), url('../images/menu-list-type-line.jpg') no-repeat bottom center/100% var(--line-size); }

#menuList .section-head { font-size:2.5rem; line-height:1.2; text-align:left; align-self: end; margin-bottom:0; }
#menuList .subhead { display:flex; flex-direction: column; width:200px; align-self: baseline; }
#menuList .subhead span { display:inline-block; padding:10px 20px; color:#fff; border:2px solid #fff; box-shadow: 3px 3px 10px rgba(0,0,0,.7); border-radius: 99px; font-weight: 600; margin:3px; }

#menuList ul { width:100%; display:grid; grid-template-columns:repeat(auto-fill, minmax(var(--li-size), var(--li-size))); justify-content:center; justify-items:start; grid-column: 2/3; grid-row: 1/3; }
#menuList li { padding:0 10px; }
#menuList li span { display:block; margin-top:-5px; font-family: var(--title-font); white-space:normal; word-break:break-word; line-height:1.2; }

#menuList .section-txt { font-size:1.375rem; line-height:1.7; margin-top:50px; }


@media (max-width: 1600px) {
    #menuList { --sec-gap:3vw; --tit-w:470px; }
    #menuList .type {  padding:40px 55px 50px; }
}
@media (max-width: 1200px) {
    #menuList { --sec-gap:2vw; --tit-w:370px; --li-size:110px; }

    #menuList .section-head { font-size:2rem; }
}

@media (max-width: 1024px) {
    #menuList { --li-size:100px; --line-size:14px; }
    #menuList .type { display:block; padding:40px 20px 50px; }

    #menuList .section-head { font-size:1.625rem; text-align: center; margin-bottom:10px; }
    #menuList .subhead { flex-direction: row; justify-content: center; width:auto; }
    #menuList .subhead span { padding:5px 13px; margin:1px; border-width:1px; font-size:.875rem; }

    #menuList ul { margin-top:5px; }
    #menuList li { padding:0 5px; }
    #menuList li span { margin-top:0; font-size:.875rem; }

    #menuList .section-txt { font-size:1rem; --line-gap:10px; --box-gap:30px; margin-top:30px; }
}




#advantage .section-head { font-size:5rem; line-height:1.1; }
#advantage .section-head b { background: linear-gradient(160deg, var(--main-color1), var(--main-color3)); -webkit-background-clip: text; color: transparent; }

#advantage dl { display:grid; grid-template-columns:repeat(var(--card-cnt), 1fr); gap:30px; margin-top:50px; --card-cnt:3; }
#advantage .card { border-radius:40px; overflow:hidden; display:flex; flex-direction: column; padding:30px; background:linear-gradient(330deg, rgba(0,0,0,.9), rgba(20,20,20,.9)); box-shadow:0 6px 18px rgba(0,0,0,.1), inset 0 2px 0 rgba(50,50,50,.9); transition:.25s ease; }
#advantage .card:hover { transform:translateY(-5px); }

#advantage dt { position: relative; font-weight:600; font-size:2rem; margin-bottom:15px; }
#advantage dt span { font-size:1.5rem; }

#advantage dd { font-size:1.125rem; flex:1; border-radius: 20px; background:rgba(255,255,255,.07); box-shadow: inset 2px 2px 20px rgba(0,0,0,.3); padding:25px; display:flex; flex-direction: column; justify-content: center; }
#advantage dd em { font-style:normal; font-weight:500; color:var(--main-color1); }
#advantage dd span { display: block; }
#advantage dd span:before { content:"↓"; display:block; margin:10px 0; }


@media (max-width: 1024px) {
    #advantage .section-head { font-size:2.5rem; }
    #advantage dl { --card-cnt:2; gap:15px; }
    #advantage .card { padding:15px; }
    #advantage dt { font-size:1.25rem; margin-bottom:10px; }
    #advantage dt span { font-size:1.125rem; }
    #advantage dd { font-size:.875rem; }
}
@media (max-width: 767px) {
    #advantage dl { max-width:400px; gap:10px; margin:20px auto 0; --card-cnt:1; }
    #advantage dd { padding:18px; }
    #advantage dd span:before { margin:5px 0; }
}



#franchiseFee .section-bg::before { display:none; }
#franchiseFee .wrap { display:flex; align-items: center; justify-content: space-between; padding-bottom:20%; }
#franchiseFee .title { line-height:1.1; }
#franchiseFee .title h3 { font-size:6.875rem; margin-bottom:20px; }
#franchiseFee .title span { position: relative; display:inline-block; padding:7px 20px 5px; font-size:1.875rem; margin:0 3px; font-weight: 900; color:#111; }
#franchiseFee .title span::before { content:""; position: absolute; left:0; top:0; right:0; bottom:0; background:linear-gradient(140deg, var(--main-color1), var(--main-color3)); transform: skewX(-5deg); z-index:-1; }
#franchiseFee .title strong { display:block; font-size:2.5rem; margin-top:30px; }


#franchiseFee .section-txt { width:50%; font-size:2rem; text-align: left; text-shadow: 0 0 5px rgba(0,0,0,.3); }
#franchiseFee .section-txt ul { margin:30px 0; }

#franchiseFee .section-txt li { position: relative; }
#franchiseFee .section-txt li::before { content: ""; display:inline-block; vertical-align: middle; margin:-4px 10px 0 0; width:4px; height:4px; border-radius: 99px; background:#fff; }

#franchiseFee .section-txt b { border-bottom:2px solid var(--main-color1); font-weight: 900; }


@media (max-width: 1200px) {
    #franchiseFee .wrap { justify-content: space-evenly; }
    #franchiseFee .title h3 { font-size:5rem; }
}

@media (max-width: 1024px) {
    #franchiseFee .section-bg img { height:160%; }
    #franchiseFee .wrap { display:block; }

    #franchiseFee .title h3 { font-size:2.5rem; margin-bottom:15px; }
    #franchiseFee .title span { font-size:1rem; padding:5px 12px 3px; }

    #franchiseFee .title strong  { font-size:1.125rem; margin-top:15px; }

    #franchiseFee .section-txt { text-align: center; font-size:.813rem; margin:0 auto; margin-top:40px; line-height:1.6; }
    #franchiseFee .section-txt ul { margin:15px 0; }
    #franchiseFee .section-txt li::before { width:2px; height:2px; margin: -2px 5px 0 0; }
}



#faq { z-index: 1 !important; }
#faq .section-bg::before { background:rgba(0,0,0,.85); }
#faq .section-bg img { position: fixed; left:0; top:0; right:0; bottom:0; z-index:-1; }

#faq ul { position: relative; max-width:900px; margin:0 auto; border-radius: 20px; background:rgba(var(--main-color1-rgb), .1); color:#111; padding:60px 50px; }
#faq ul::before { content: ""; position:absolute; left:0; top:0; right: 0; bottom:0; background:#fff; z-index:-1; border-radius: inherit; }

#faq li { border-top:1px solid #333; }
#faq li i { transition-duration: .3s; }
#faq li .question { display: flex; align-items: center; text-align: left; justify-content: space-between; border-bottom:1px solid rgba(0,0,0,.1); width:100%; padding:10px 0; }
#faq li .question span { font-size:1.125rem; margin-right:10px; }
#faq li .ask { max-height:0; overflow:hidden; text-align: left; transition-duration: .3s; box-sizing: content-box; font-weight: 400; line-height: 1.5; }

#faq li.on i { transform: rotate(180deg); }
#faq li.on .ask { padding:20px 0; }


@media (max-width: 767px) {
    #faq ul { padding:35px 30px; }
    #faq li .question span { font-size:1rem; }
}



#factCheck .wrap { max-width:900px; margin:0 auto; }
#factCheck .desc { font-size:1.5rem; }
#factCheck .desc + span { background:var(--main-color3); padding:5px 10px; margin:2px 0 20px; }
#factCheck h3 { font-size:4rem; }
#factCheck h3 + span { font-size:1.25rem; margin-bottom:30px; }
#factCheck span { display: inline-block; }

#factCheck table { color:#111; font-size:1.125rem; width:100%; }
#factCheck table caption { background:rgba(0,0,0,.7); padding:10px; color:var(--main-color3); font-size:1.875rem; font-weight: 600; }
#factCheck table tr { border-bottom:1px solid #ddd; background:#fff; }
#factCheck table thead tr th { background:var(--main-color3); color:#fff; padding:10px; border-top:1px solid #fff; }
#factCheck table tbody tr > * { padding:7px; }
#factCheck table tbody th { font-weight: 400; }
#factCheck table tfoot tr > * { padding:10px; background:var(--main-bg1); color:var(--main-color1); }
#factCheck table tfoot td:nth-child(3) { font-size:1.5rem; text-align: left; }

#factCheck table td { font-weight: 400; }
#factCheck table td:nth-child(3) { font-weight: 900; }
#factCheck table td span { text-decoration: line-through; }

#factCheck p { border-radius: 10px; background:rgba(0,0,0,.5); padding:20px 30px; text-align: left; margin-top:20px; }


@media (max-width: 1024px) {
    #factCheck .section-bg { background:#111; }
    #factCheck .section-bg::after { content:""; position: absolute; left:0; top:0; right:0; bottom:0; background:linear-gradient(to top, #111 20%, transparent); }
    #factCheck .section-bg img { height:80%; }

    #factCheck .wrap { width:96%; }
    #factCheck .desc { font-size: 1.125rem; }
    #factCheck .desc + span { font-size:.75rem; }
    #factCheck h3 { font-size:2.25rem; line-height:1.1; margin-bottom:5px; }
    #factCheck h3 + span { font-size:1rem; }


    #factCheck table { font-size:.875rem; }
    #factCheck table caption { font-size:1.375rem; }
    #factCheck table tfoot td:nth-child(3) { font-size:1.25rem; }


    #factCheck p { font-size:.875rem; }
}

@media (max-width: 767px) {
    #factCheck .section-bg::after { background:linear-gradient(to top, #111 40%, transparent); }
    #factCheck .section-bg img { height:65%; }
}



#contactForm { position: relative; max-width:500px; margin:0 auto; border-radius: 20px; background:rgba(var(--main-color1-rgb),.1); border:1px solid var(--main-color1); padding:50px; --color-red:#e61247; }
#contactForm::before { content: ""; position:absolute; left:0; top:0; right: 0; bottom:0; background:#fff; z-index:-1; border-radius: inherit; }
#contactForm li { text-align: left; color:#111; font-size:1.25rem; }
#contactForm li:nth-child(even) { margin-bottom:5px; }
#contactForm li:nth-child(odd) { margin-bottom:20px; }
#contactForm li.required::after { content:" *"; color:var(--color-red); font-size:1.5rem; }

#contactForm input[type="text"],
#contactForm p,
#contactForm .agree-box { padding:15px; border:1px solid #111; background:#fff; border-radius: 3px; width:100%; }
#contactForm p { line-height: 1.5; height:100px; overflow-y: auto; font-size: .75rem; font-weight: 400; margin-bottom:10px; }
#contactForm input[type="radio"],
#contactForm input[type="checkbox"] { width:0; height:0; opacity: 0; visibility: hidden; }

#contactForm input + label { position: relative; padding-left:25px; margin-right:10px; font-size: 1rem; font-weight: 400; }
#contactForm input + label::before,
#contactForm input + label::after { content: ""; position: absolute; left:0; top:50%; transform: translateY(-50%); width:18px; height:18px; }
#contactForm input + label::before { border:1px solid #aaa; background:#fff; }
#contactForm input:checked + label::before { border-color:#111; }


#contactForm input[type="radio"] + label::before,
#contactForm input[type="radio"] + label::after { border-radius: 99px; }


#contactForm input[type="radio"]:checked + label::after { margin:0 4.5px; width:9px; height:9px; background:#111; }

#contactForm .agree-box { border-width:2px; }
#contactForm .agree-box button { border-radius: 5px; border:1px solid #333; background:none; padding:3px 7px; font-size:.75rem; }
#contactForm input[type="checkbox"] + label::before,
#contactForm input[type="checkbox"] + label::after { font-size:1rem; }

#contactForm input[type="checkbox"]:checked + label::after { content:"\f00c"; font-family: "Font Awesome 7 Free"; font-size:.75rem; font-weight: 900; text-align: center; line-height: 18px; color:var(--color-red); }

#contactForm .btngroup { margin-top:20px; }
#contactForm .btngroup button { background:#101010; color:#fff; padding:12px 50px; }




/* 개인정보동의 */
.modal { display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.4); }
.modal-content { background-color: #fefefe; margin: 10% auto; padding: 30px; border: 1px solid #888; width: 80%; max-width: 600px; border-radius: 8px; }
.modal-content h2 { padding-bottom: 20px; }
.close-btn { color: #aaa; float: right; font-size: 28px; font-weight: bold; }
.close-btn:hover,
.close-btn:focus { color: #000; text-decoration: none; cursor: pointer; }



@media (max-width: 767px) {
    #contactForm { padding:55px 25px; }
    #contactForm li { font-size:1.125rem; }

    #contactForm input + label { font-size:.875rem; }


}


#footer { position:relative; background:#000; text-align: center; padding:30px 0 100px; font-size:.875rem; z-index:9; }
#footer .logo { font-size:1.25rem; margin-bottom:30px; }
#footer .logo img { width:100px; }
#footer .logo b { font-size:.5rem; letter-spacing:-.5px; line-height: 1; color:#fff; background:#c70a0a; border-radius: 3px 1px 4px 2px; padding:2.5px 3px 2px 2px; vertical-align: middle; margin-top:-3px; display: inline-block; }

#footer p { margin-top:30px; font-size:.75rem; opacity: .6; }

@media (max-width: 767px) {

    #footer .logo { font-size:1rem; margin-bottom:30px; }
    #footer .logo img { width:70px; }
}




#quick-bottom { position: fixed; left:0; right:0; bottom:0; z-index:99; }
#quick-bottom ul { display: flex; }
#quick-bottom li { width:50%; }
#quick-bottom a { display: block; padding:10px; color:#fff; text-align: center; font-size:.875rem; font-weight: 400; }
#quick-bottom li:nth-child(1) { background:var(--main-bg1); }
#quick-bottom li:nth-child(2) { background:var(--main-color3); }


/* 팝업 */
#popup-overlay { position: fixed; top: 80px; left: 50px; display: flex; justify-content: center; align-items: center; z-index: 9999; }
#popup-overlay .popup-container { display: flex; gap: 20px; }

#popup-overlay .popup-box { width: 375px; height: 550px; background-color: #ffffff; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5); position: relative; display: flex; flex-direction: column; overflow: hidden; border: 0; border-radius: 10px; }

#popup-overlay .popup-content { flex-shrink: 0; height: 500px; }
#popup-overlay .popup-content img { width: 100%; height: 100%; display: block; object-fit: fill; }

#popup-overlay .popup-footer { height: 50px; flex-shrink: 0; display: flex; justify-content: space-between; align-items: center; padding: 0 10px; background: #f0f0f0; color: #000; font-size: 14px; }
#popup-overlay .popup-footer button { font-family: 'Pretendard'; background: none; border: none; color: #000; cursor: pointer; padding: 5px 10px; font-size: 14px; }



@media (max-width: 767px) {
    #popup-overlay { align-items: flex-start; overflow-y: auto; top: 0; left: 0; width: 100%; height: 100%; }
    #popup-overlay .popup-container { flex-direction: column; gap: 20px; align-items: center; position: relative; }

    #popup-overlay .popup-box { width: 90vw; max-width: 300px; height: auto; position: absolute; top: 30px; }

    #popup-overlay .popup-content { position: relative; height: 400px; }
    #popup-overlay .popup-content img { position: absolute; top: 0; left: 0; width: 100%; display: block; }
}
