@font-face {
    font-family: 'Independent';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.1/Dokrip.woff') format('woff');
    font-weight: normal;
    font-display: swap;
}
@font-face {
    font-family: 'YeongyanggunEumsikdimibang';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2104@1.1/dimibang_new.woff') format('woff');
    font-weight: normal;
    font-display: swap;
}
:root {
	--color-highlight: #d80526;
}


*{box-sizing: border-box;font-family: 'YeongyanggunEumsikdimibang', serif;}

html,body{padding:0;margin:0;}

.fonttitle,
.fonttitle *{font-family: 'Independent', sans-serif;font-weight: 500;}

.animclip{
    overflow: hidden;
    transition:all 1.3s;
    clip-path:polygon(50% 0, 50% 0, 50% 100%, 50% 100%);
}
.animclip.anim{clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%);}
.stamp {
    display: inline-block;        
    transform: scale(0);
    opacity: 0;
}
.stamp.anim{animation: stampAnimation 0.6s ease forwards;}

.dropstamp {
    display: inline-block;            
    opacity: 0;
    transform: translateY(-100px) scale(0) rotate(-20deg);
}
.dropstamp.anim{animation: dropStamp 1s ease forwards;}

@keyframes stampAnimation {
    0% {
        transform: scale(0);
        opacity: 0;
    }
    50% {
        transform: scale(1.2); /* 찍히는 순간 약간 커짐 */
        opacity: 1;
    }
    70% {
        transform: scale(0.9); /* 살짝 흔들림 효과 */
    }
    100% {
        transform: scale(1); /* 최종 자리 */
        opacity: 1;
    }
}
/* Keyframe 정의 */
@keyframes dropStamp {

    0% {
        transform: translateY(-100px) translateZ(-200px) rotateX(-20deg) scale(0);
        opacity: 0;
    }
    50% {
        transform: translateY(0) translateZ(50px) rotateX(10deg) scale(1.2); /* 앞으로 튀어나옴 */
        opacity: 1;
    }
    70% {
        transform: translateY(-5px) translateZ(30px) rotateX(-5deg) scale(0.9); /* 살짝 튕김 */
    }
    100% {
        transform: translateY(0) translateZ(0) rotateX(0deg) scale(1); /* 최종 자리 */
        opacity: 1;
    }
}

@keyframes blink {
    0% {        
        opacity: 0;
    }
    50% {        
        opacity: 1;
    }
    100% {        
        opacity: 0;
    }
}




h1,h2,h3,h4,h5,p,ul,ol {margin:0;padding:0;color:#333;line-height:1.2;}

a,
a:hover,
a:visited{color:#333;text-decoration: none;}

header{background:black;position:fixed;left:0;top:0;width:100%;height:80px;}
footer{background:black;position:fixed;left:0;bottom:0;width:100%;height:80px;}
.content{padding:80px 0;}

.section{position:relative;}
.section .section-bg{position:absolute;z-index:1;width:100%;height:100%;left:0;top:0;}
.section .section-bg img.bg{width:100%;height:100%;object-fit:cover;object-position:center;}
.section .section-content{position:relative;z-index:1;}

.section-video{
    
}
.section-video video{min-height:calc(100vh - 160px);width:100%;object-fit:cover;}

.bgthrough{position:relative;padding:0.5% 1.5% 1.5% 1.5%;display:inline-block;}
.bgthrough .text{position:relative;z-index:2;}
.bgthrough .bg{position:absolute;z-index:1;background:var(--color-highlight);height:100%;top:0;left:0;width:0%;transition:ease-in-out 0.4s all;}
.bgthrough.anim .bg{width:100%;}


.linetext{position:relative;}
.linetext .linewrap{position:absolute;overflow:hidden;z-index:-1;transition:ease-in-out 0.4s all;height:100%;transition-delay: 0s;}
.linetext .line{position:absolute;}
.linetext .star{position:absolute;opacity:0;}
.linetext .star.anim{animation:blink infinite;animation-duration: 2s;}

.section-franchise{padding:120px 20px 40px;position:relative;}
/*
.section-franchise .franchise-bg{position:absolute;z-index:1;left:0;top:0;width:100%;height:100%;}
.section-franchise .section-bg .bg{width:100%;height:100%;object-fit:cover;}
*/
.section-franchise .section-bg .top{width:100%;height:auto;position:absolute;top:0;left:0;}

.section-franchise .section-content{max-width:1300px;margin:0 auto;}

.section-franchise .franchise-title{display:flex;align-items: center;gap:20px;}
.section-franchise .franchise-title-map{width:45%;}
.section-franchise .franchise-title-map .map-wrapper{width:85%;margin:0 auto;position:relative;}
.section-franchise .franchise-title-map img.map{max-width:100%;width:100%;transition:ease-in-out 0s all;opacity:0;}
.section-franchise .franchise-title-map img.map.anim{opacity:1;transition-duration: 0.3s;}
.section-franchise .franchise-title-map img.pin{position:absolute;width:4%;}

.section-franchise .franchise-title-map img.pin.pin1{top:43%;left:5%;animation-delay: 0.4s;}
.section-franchise .franchise-title-map img.pin.pin2{top:37%;left:13%;animation-delay: 0.5s;}
.section-franchise .franchise-title-map img.pin.pin3{top:32%;left:22%;animation-delay: 0.6s;}
.section-franchise .franchise-title-map img.pin.pin4{top:56%;left:17%;animation-delay: 0.7s;}
.section-franchise .franchise-title-map img.pin.pin5{top:22%;left:44%;animation-delay: 0.8s;}
.section-franchise .franchise-title-map img.pin.pin6{top:45%;left:41%;animation-delay: 0.9s;}
.section-franchise .franchise-title-map img.pin.pin7{top:40%;left:47%;animation-delay: 1s;}
.section-franchise .franchise-title-map img.pin.pin8{top:59%;left:43%;animation-delay: 1.1s;}

.section-franchise .franchise-title-map img.pin.pin9{top:28%;left:54%;animation-delay: 1.2s;}
.section-franchise .franchise-title-map img.pin.pin10{top:47%;left:53%;animation-delay: 1.3s;}
.section-franchise .franchise-title-map img.pin.pin11{top:26%;left:63%;animation-delay: 1.4s;}
.section-franchise .franchise-title-map img.pin.pin12{top:36%;left:60%;animation-delay: 1.5s;}
.section-franchise .franchise-title-map img.pin.pin13{top:33%;left:37%;animation-delay: 1.6s;}

.section-franchise .franchise-title-map img.pin.pin14{top:20%;left:80%;animation-delay: 1.7s;}
.section-franchise .franchise-title-map img.pin.pin15{top:59%;left:69%;animation-delay: 1.8s;}
.section-franchise .franchise-title-map img.pin.pin16{top:49.6%;left:77%;animation-delay: 1.9s;}


.section-franchise .franchise-title-map img.ac{position:absolute;bottom:0;left:-17%;width:70%;}
.section-franchise .franchise-title-map img.ac.anim{animation-delay:1.9s}

.section-franchise .franchise-title-text{width:55%;}
.section-franchise .franchise-title-text h2{font-size:60px;color:white;line-height:1.4;}
.section-franchise .franchise-title-text h2 strong{line-height:1;}
.section-franchise .franchise-title-text h2 strong .bg{transition-delay:0s;}
.section-franchise .franchise-title-text h2 strong.anim .bg{transition-delay:0.4s;}
.section-franchise .franchise-title-text p {font-size:23px;color:white;margin-top:20px;}


.section-franchise .franchise-amount{width:100%;border:solid 2px white;position:relative;padding:40px 20px;margin-top:60px;}

.section-franchise .franchise-amount .amount-bg{position:absolute;left:0;top:0;width:100%;height:100%;background-size:cover;background-position:center;filter:brightness(0.4)}
.section-franchise .franchise-amount .amount-content{position:relative;z-index:2;}
.section-franchise .franchise-amount .amount-content h2{text-align: center;font-size:60px;color:white;}
.section-franchise .franchise-amount .amount-content h2 .linetext .linewrap{width:0px;left:-7px;bottom:-10px;height:100%;transition-delay: 0s;}
.section-franchise .franchise-amount .amount-content h2 .linetext .linewrap.anim{width:385px;transition-delay:2.1s}
.section-franchise .franchise-amount .amount-content h2 .linetext .line{width:385px;bottom:0;left:0;}
.section-franchise .franchise-amount .amount-content h2 .linetext .star{left:-18px;top:-12px;width:50px;}
.section-franchise .franchise-amount .amount-content h2 .linetext .star.anim{animation-delay:2.1s;}
.section-franchise .franchise-amount .amount-content p{text-align:center;color:white;font-size:23px;margin-top:20px;}

.section-franchise .franchise-amount-box{margin-top:30px;width:fit-content;margin-left:auto;margin-right:auto;}
.section-franchise .franchise-amount-box .wrapper{display:flex;justify-content: center;gap:20px;align-items: center;width:fit-content;margin:0 auto;}
.section-franchise .franchise-amount-box img{height:100px;}
.section-franchise .franchise-amount-box .countbox{font-size:57px;color:white;line-height:1;white-space: nowrap;display:flex;align-items: flex-end;gap:10px;}
.section-franchise .franchise-amount-box .countbox strong{font-size:98px;display:flex;justify-content: center;gap:4px;align-items: flex-end;}
.section-franchise .franchise-amount-box .countbox strong span{display:inline-block;text-align:center;min-width:90px;height:90px;line-height:90px;padding:0 10px;background:white;color:#222;overflow: hidden;}
.section-franchise .franchise-amount-box .countbox .digit-container {display: flex;flex-direction: column;transition-timing-function: cubic-bezier(0.15, 0, 0.15, 1);will-change: transform;}
.section-franchise .franchise-amount-box .countbox .digit-container i {font-style: normal;display: block;height: 90px;text-align: center;}
.section-franchise .franchise-amount-box .franchise-amount-store{text-align: right;font-size:25px;color:white;margin-top:10px;}



.section-story{background:black;padding:80px 0px 200px;}
.section-story .section-bg img.bg{object-position:bottom;}
.section-story .section-content{padding:0 20px;max-width:1300px;margin:0 auto;}
.section-story .section-content .story-title{text-align: center;}
.section-story .section-content .story-title h2{font-size:70px;}
.section-story .section-content .story-title h2 strong{color:var(--color-highlight);}
.section-story .section-content .story-title h2 img{height:0.45em;}
.section-story .section-content .story-title p{font-size:25px;margin-top:10px;}
.section-story .section-content .story-videobox{margin:50px auto 0;position:relative;max-width:800px;}
.section-story .section-content .story-videobox img{display:block;position:relative;z-index:1;width:100%;}
.section-story .section-content .story-videobox .story-video{position:absolute;width: 92%;height: 88%;top: 6%;left: 4%;z-index:2;}
.section-story .section-content .story-videobox .story-video video{width:100%;height:100%;object-fit:cover;object-position: center;background:black;}


.section-menu{padding:80px 0;}
.section-menu .section-content{max-width:1600px;margin:0 auto;padding:0 20px;}
.section-menu .menu-title{text-align: center;}
.section-menu .menu-title .subtitle{position:relative;width:fit-content;margin:0 auto 3px;}
.section-menu .menu-title .subtitle p{font-size:33px;color:white;line-height:1;}
.section-menu .menu-title .subtitle img{position:absolute;bottom:0px;width:100%;left:0;}
.section-menu .menu-title .title{position:relative;width:fit-content;margin:0 auto;font-size:67px;}
.section-menu .menu-title .title h2{font-size:67px;color:white;}
.section-menu .menu-title .title img.ac{width:1em;top:0;right:-2%;transform:translateY(-67%);position:absolute;}

.section-menu .menu-title h2 .linewrap{width:0px;left:-34px;bottom:-5px;height:100%;}
.section-menu .menu-title h2 .linewrap.anim{width:324px;}
.section-menu .menu-title h2 .linewrap .line{width:300px;bottom:0;left:0;}

.section-menu .menu-list{width:100%;padding: 0 50px;position:relative;}
.section-menu .menu-list-controls{}
.section-menu .menu-list-controls button{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border:0;padding:0;background:var(--color-highlight);border-radius: 50%;cursor:pointer;}
.section-menu .menu-list-controls button.next{right:10px;}
.section-menu .menu-list-controls button.prev{left:10px;}
.section-menu .menu-list-controls button img{width:100%;}
.section-menu .menu-list-viewer{width:100%;max-width:1400px;margin:30px auto 0;overflow:hidden;}
.section-menu .menu-list .menu-list-scroll,
.section-menu .menu-list .menu-list-scroll .list-wrapper{display:flex;white-space: nowrap;gap:0px;}
.section-menu .menu-list .menu-item{position:relative;background:rgba(0,0,0,0.5);transform:scale(0.88);transition:ease-in-out 0.3s all;}
.section-menu .menu-list .menu-item.center{transform:scale(1)}
.section-menu .menu-list .menu-item img{width: 100%;}

.section-menu .menu-desc{text-align: center;margin-top:30px;}
.section-menu .menu-desc p{padding:0 30px;color:white;font-size:30px;}
