@charset "utf-8";
/* *******************************************************
 * filename : content.css
 * description : 만개돌파 이벤트 페이지 CSS
 * date : 2026-06-05
******************************************************** */
.area-1420{ max-width:1420px; margin:0px auto; }

#middleArea{position: relative; z-index:9; background:#fff; margin-top: 100vh;}


/* 카운트 */
.count-num-box{display:flex; align-items:center; font-size:6rem;}
.count-num-item-wrap{height:1em; line-height:1em; overflow:hidden; color:#fff;}
.count-num-item-wrap .count-num-item-box{height:10em; }
.count-num-item-wrap .count-num-item-box .count-num-item {height:1em; line-height: 1em; color:#fff; font-weight:500;}

/* 카운트02 */
.num-box .count-num{font-size:5rem; color:#fff; font-weight:500;}
.main-intro-con .left-box .intro-counter-box .counter-item .num-box .count-num + .nun-plus{font-size:2rem;}

/* ios */
/* .ios-os .count-num-item-box:not(.down){height:10.05em;} */
 
/* active */
.animated .count-num-item-box{animation:count-up-ani 3s forwards;}
.animated .count-num-item-box.down {animation:count-down-ani 3s forwards;}
@keyframes count-up-ani {
    0% {
        transform: translate3d(0, 0, 0);
    }
    100% {
        transform: translate3d(0, -90%, 0);
    }
}
@keyframes count-down-ani {
    0% {
        transform: translate3d(0, -90%, 0);
    }
    100% {
        transform: translate3d(0, 0, 0);
    }
}

/* ******************** 
* 만개달성 이벤트 페이지 2025-10-31MJ
******************** */
/* *** 이벤트페이지 헤더 *** */
/* Header :: Logo */
#header.event-header  .logo svg path,
#header.event-header  .logo svg rect{transition:var(--transition-custom);}
/* Header :: Gnb */
.event-header #gnb > ul{display: inline-block; margin-left:0;}
.event-header #gnb > ul li{width:auto !important;}
.event-header #gnb > ul li a{padding:0 3rem;}
/* Header :: 공홈 버튼 */
.header-event-link{margin-right:3rem;}
.header-event-link a{display:flex; align-items:center; justify-content:space-between; /* background:var(--main-color); */ font-size:1.4rem; color:#fff; font-weight:600; width:15rem; height:3.5rem; border-radius:3.5rem; text-align:center; padding:0 2rem; box-sizing:border-box; transition: var(--transition-custom); border:2px solid #fff;}
.header-event-link a i{font-size:2rem;}
.header-event-link a:hover{background:#fff; color:var(--main-color);}

/* Header :: Fixed */
#header.event-header.top-fixed  .logo svg path,
#header.event-header.top-fixed  .logo svg rect{fill:var(--main-color);}
#header.event-header.top-fixed #gnb > ul li a{color:#000;}
#header.event-header.top-fixed .header-event-link a{color:#000; border-color:#000;}
#header.event-header.top-fixed .header-event-link a:hover{background:#000; color:#fff;}


/* *** 이벤트페이지 서브비주얼 *** */
#eventVisual{position:fixed; top:0; width:104%; height:100vh; left: -2%; /* transition:height 0.4s ease-in-out; */ font-family: var(--font-family2);}
#visualEffect{position: absolute; inset:0; width:100%; min-width:800px; height:100%; z-index:999; pointer-events: none;}
#eventVisual .visual-img-con{
	position:absolute; 
	top:0px; 
	left:0px; 
	width:100%;
	height:100vh;
	overflow:hidden; 
	/* transition:height 0.4s ease-in-out; */
}
#eventVisual .visual-img-inner{
	width:100%; 
	height:100%; 
	background-size:cover !important; 
	transform: scale(1.1,1.1); 
	transition:transform 5s linear;
}
#eventVisual .visual-txt-con{position:relative; z-index:1; display:table; width:100%; height:100%; color:#fff;}
#eventVisual .visual-txt-container{position:relative; width:100%; box-sizing: border-box;}
#eventVisual .table-cell-layout {vertical-align:middle; box-sizing: border-box;}
#eventVisual .event-visual-txt-box{text-align:center; margin-top:6rem;}
#eventVisual .event-visual-txt-box .visual-top-txt{position: relative; display: inline-flex; align-items:center; justify-content:center; height:5rem; background:var(--main-color); padding:0 3rem; box-sizing:border-box; font-size:2rem; letter-spacing:-0.05em; color:#fff; font-weight:400; opacity:0; transform:TranslateY(50px); transition:var(--transition-custom2); transition-delay:0.4s;}
#eventVisual .event-visual-txt-box .visual-top-txt:before{position: absolute; content:''; height:100%; width:2.2rem; background:no-repeat center; background-size: cover; background-image:url('/web-static-images/content/event_visual_tit_left.png?ver=251104'); top:0; right:100%;}
#eventVisual .event-visual-txt-box .visual-top-txt:after{position: absolute; content:''; height:100%; width:2.2rem; background:no-repeat center; background-size: cover; background-image:url('/web-static-images/content/event_visual_tit_right.png?ver=251104'); top:0; left:100%;}
#eventVisual .visual-tit{ font-size:7rem; line-height: 1.1; letter-spacing:-0.05em; color:#fff; font-weight:400; margin-top:4rem;}
#eventVisual .visual-txt{ font-size:2rem; line-height: 1.6; letter-spacing:-0.05em; color:rgba(255,255,255,0.5); font-weight:400; margin-top:3rem; opacity:0; transform:TranslateY(50px); transition:var(--transition-custom2); transition-delay:1s;}

/* animated */
#eventVisual.animated .event-visual-txt-box .visual-top-txt{opacity:1; transform:TranslateY(0px);}
#eventVisual.animated .visual-tit.cm-word-split-JS.splitting .char{animation: text-active-animation2 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
#eventVisual.animated .visual-txt{opacity:1; transform:TranslateY(0px);}

@keyframes text-active-animation2 {
	from {
		opacity:0;filter:Alpha(opacity=0);
		-webkit-transform: translateY(100%); 
		transform: translateY(100%);
	}
	to {
		opacity:1.0;filter:Alpha(opacity=100);
		-webkit-transform: translateY(0); 
		transform: translateY(0); 
	}
}

.visual-scroll-down{position: absolute; bottom:0; left:50%; transform:translateX(-50%); z-index:99; text-align:center;}
.visual-scroll-down .scroll-txt{font-size:1.4rem; line-height:1.5; letter-spacing:0; color:#fff; font-weight:500; font-family:var(--font-family2);}

.visual-scroll-down .scroll-txt{display: flex;}
.visual-scroll-down .scroll-txt em{font-size:1em; display:inline-block; animation: scroll-down-ani 2s ease-in-out 0s infinite; font-weight:500;}
.visual-scroll-down .scroll-txt em:nth-child(1){animation-delay:1s;}
.visual-scroll-down .scroll-txt em:nth-child(2){animation-delay:1.04s;}
.visual-scroll-down .scroll-txt em:nth-child(3){animation-delay:1.08s;}
.visual-scroll-down .scroll-txt em:nth-child(4){animation-delay:1.12s;}	
.visual-scroll-down .scroll-txt em:nth-child(5){animation-delay:1.16s;}
.visual-scroll-down .scroll-txt em:nth-child(6){animation-delay:1.2s;}
.visual-scroll-down .scroll-txt em:nth-child(7){animation-delay:1.24s;}
.visual-scroll-down .scroll-txt em:nth-child(8){animation-delay:1.28s;}
.visual-scroll-down .scroll-txt em:nth-child(9){animation-delay:1.32s;}
.visual-scroll-down .scroll-txt em:nth-child(10){animation-delay:1.36s;}
.visual-scroll-down .scroll-txt em:nth-child(11){animation-delay:1.4s;}

.visual-scroll-down .scroll-bar{display: block; position: relative; width:2px; height:9.5rem; background:rgba(255,255,255,0.1); margin:1rem auto 0; overflow:hidden;}
.visual-scroll-down .scroll-bar:before{position: absolute; content:''; width:100%; height:2rem; background:#fff; top:0; left:0; animation: scroll-down-move 2s ease-in-out 0s infinite;}

@keyframes scroll-down-ani {
    0% {
        opacity: 0;
        transform: translateY(-50%) rotateX(90deg)
    }
    20%,80% {
        opacity: 1;
        transform: translateY(0) rotateX(0)
    }
    100% {
        opacity: 0;
        transform: translateY(50%) rotateX(-90deg)
    }
}
@keyframes scroll-down-move {
    0% {
        transform: translateY(-2rem)
    }
    100% {
        transform: translateY(11.5rem)
    }
}

/* *** 이벤트페이지 공통 *** */
.event-page{font-family: var(--font-family2);}
.event-con{padding:15rem 0;}
.cm-event-tit-box{text-align:center; margin-bottom:5rem;}
.cm-event-tit-box .cm-event-tit{font-size:5rem; line-height:1.3; letter-spacing:-0.05em; color:#000; font-weight:500; }
.cm-event-tit-box .cm-event-tit .red{color:var(--main-color); font-weight:inherit;}
.cm-event-tit-box .cm-event-txt{font-size:2rem; line-height:1.7; letter-spacing:-0.05em; color:#000; font-weight:500; margin-top:2.5rem; opacity:0; transform:TranslateY(30px); transition:var(--transition-custom2); transition-delay:1s;}

/* animated */
.animated .cm-event-tit-box .cm-event-tit.cm-word-split-JS.splitting .char{animation: text-active-animation2 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
.animated .cm-event-tit-box .cm-event-txt{opacity:1; transform:TranslateY(0px);}

.cm-event-btn{display: flex; align-items:center; justify-content:space-between; width:100%; max-width:55rem; height:8rem; background:#000; border-radius:8rem; padding:0 4rem; box-sizing:border-box; margin:6rem auto 0; font-size:2.4rem; font-weight:500; color:#fff; transition:var(--transition-custom);}
.cm-event-btn i{font-weight:400;}

.cm-event-btn:hover{background:var(--main-color);}


/* *** 숫자로 보는 아이파킹 *** */
#eventNumber{background:#f5f5f5;}
.number-list{display: flex; justify-content:space-between;}
.number-list .list-item{position: relative; display: flex; flex-direction:column; align-items:center; justify-content:center; width:calc((100% - 7rem)/3); height:45.5rem; background:#fff; border-radius:2rem; text-align:center; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.number-list .list-item .inner-item + .inner-item{margin-top:2.5rem;}
.number-list .list-item .plus-txt-box{position: relative; opacity:0; transform:translateY(50px); transition:all 1s ease-in-out; transition-delay:1.2s;}
.number-list .list-item .plus-txt{position: relative; display: inline-block; font-size:1.6rem; line-height:1.4; letter-spacing:-0.05em; color:#fff; font-weight:400; border-radius:3.5rem; background:var(--main-color); padding:0.5rem 1.5rem; box-sizing:border-box; margin-bottom:2rem;}
.number-list .list-item .plus-txt:before{position: absolute; content:'\e936'; color:var(--main-color); left:50%; top:100%; transform:translateX(-50%); font-size:3rem; font-family:'xeicon'; line-height:0.3;}
.number-list .list-item .txt{display: block; font-size:7rem; line-height:1.1; letter-spacing:-0.05em; color:#000; font-weight:500}
.number-list .list-item .txt .small{font-size:0.57em; line-height:2.125;}
.number-list .list-item .txt02{font-size:2rem; line-height:1.6; letter-spacing:-0.05em; color:#000; font-weight:500}
.number-date-txt{font-size:1.6rem; line-height:1.85; letter-spacing:-0.05em; color:#888; font-weight:500; font-family: var(--font-family1); text-align:center; margin-top:5.5rem; opacity:0; transform:translateY(50px); transition:var(--transition-custom2); transition-delay:0.7s}
.number-list .list-item .inner-icon{position: absolute; bottom:-4rem; right:2rem; width:13rem; height:13rem;}
.number-list .list-item .inner-icon img{filter: drop-shadow(0.5rem 0.5rem 0.5rem rgba(42, 42, 42, 0.2)); width:100%;}

.number-list .list-item:nth-child(1){transition-delay:0.5s;}
.number-list .list-item:nth-child(2){transition-delay:0.7s;}
.number-list .list-item:nth-child(3){transition-delay:0.9s;}
/* animated */
.animated .number-list .list-item{opacity:1; transform:translateY(0);}
.animated .number-date-txt{opacity:1; transform:translateY(0);}
.animated .number-list .list-item .plus-txt-box{opacity:1; transform:translateY(0);}


/* *** 함께 달성한 아이파킹의 기록 *** */
#eventRecord .cm-event-tit-box{position: relative;}
#eventRecord .cm-event-tit-box .cm-event-tit{position: relative; z-index:9;}
#recordEffect{position: absolute; width:40rem; height:40rem; top:50%; left:50%; transform:translate(-50%, -50%); pointer-events:none;}
.record-flow-wrap{margin-top:8rem;}
.record-flow-list{display: flex; border-top:2px solid #f5f5f5; border-bottom:2px solid #f5f5f5; box-sizing:border-box; opacity:0; transform:translateX(50px); transition:var(--transition-custom2); transition-delay:0.5s}
.record-flow-list.reverse{transform:translateX(-50px); border-top:0;}
.record-flow-list .list-item{display: flex; align-items:center; transform:translateX(-100%); animation: record-flow 30s infinite linear; height:15rem;}
.record-flow-list.reverse .list-item{transform:translateX(-200%); animation: record-flow-reverse 37s infinite linear;}
.record-flow-list .list-item .flow-txt{font-size:4rem; line-height:1.5; letter-spacing:-0.05em; color:#000; font-weight:500; white-space:nowrap; margin:0 4rem;}
.record-flow-list .list-item .flow-icon img{filter: drop-shadow(2rem 2rem 1rem rgba(42, 42, 42, 0.3));}
.record-flow-list .list-item .flow-img{border-radius:6.5rem; overflow:hidden;}

/* animaged */
.animated .record-flow-list{transform:translateX(0px); opacity:1}
.animated .record-flow-list.reverse{transform:translateX(0px);}

@keyframes record-flow {
	from { transform: translateX(-100%);}
	to {transform: translateX(-200%);}
}
@keyframes record-flow-reverse {
	from { transform: translateX(-200%);}
	to {transform: translateX(-100%);}
}


/* *** 어디서나 아이파킹 *** */
#eventAnywhere{background:#f5f5f5;}
.anywhere-list{display: flex; justify-content:space-between;}
.anywhere-list .list-item{position: relative; width:calc(50% - 1rem); border-radius:2rem; background:#fff;}

.anywhere-list .list-item.img-item .img-box{opacity:0; transform:translateY(50px); transition:var(--transition-custom2); transition-delay:1s;}
.anywhere-list .list-item.img-item .img-box img{width:100%;}

.anywhere-list .list-item.graph-item{position: relative; padding:8.5rem 6rem; box-sizing:border-box;}
.anywhere-list .list-item.graph-item .txt-box{position: absolute; top:6rem; left:6rem; width:calc(100% - 12rem); opacity:0; transform:translateY(50px); transition:var(--transition-custom2); transition-delay:1s;}
.anywhere-list .list-item.graph-item .txt-box .txt{font-size:2.4rem; line-height:1.41; letter-spacing:-0.05em; color:#000; font-weight:500; margin-bottom:1rem;}
.anywhere-list .list-item.graph-item .txt-box .tit{font-size:7rem; line-height:1.1; letter-spacing:-0.02em; color:#222; font-weight:500;}
.anywhere-list .list-item.graph-item .txt-box .tit span{color:var(--main-color);}
.anywhere-list .list-item.graph-item .inner-graph{position: relative; display: flex; align-items: flex-end; height:100%; margin:0 -0.7rem;}
.anywhere-list .list-item.graph-item .inner-graph:before{position: absolute; content:''; width:calc(100% - 1.4rem); height:1px; background:#eee; left:0.7rem; bottom:0;}
.anywhere-list .list-item.graph-item .inner-graph .graph{position: relative; display: flex; align-items: flex-end; width:calc((100% - 1.4rem) / 11); height:100%; margin:0 0.7rem; text-align:center; font-size:1.4rem; line-height:1.5; letter-spacing:-0.02em; color:#000; font-family: var(--font-family1);}
.anywhere-list .list-item.graph-item .inner-graph .graph .year{position: absolute; top:calc(100% + 2rem); left:0; width:100%; font-weight:500; color:#666}
.anywhere-list .list-item.graph-item .inner-graph .graph .bar{position: relative; background:#f2f2f2; border-radius:5px 5px 0 0; width:100%; color:#000; font-weight:500; height:0;}
.anywhere-list .list-item.graph-item .inner-graph .graph .bar span{position: absolute; bottom:100%; left:50%; transform: translateX(-50%); /* width:100%; */}
/* .anywhere-list .list-item.graph-item .inner-graph .graph-arrow-img{position: absolute; width:0; height:0; bottom:0; left:calc(100% - 22.4rem); transition: all 0.8s 0.8s ease-in-out;}
.anywhere-list .list-item.graph-item .inner-graph .graph-arrow-img img{width:100%; height:100%; object-fit:cover; } */
/* point */
.anywhere-list .list-item.graph-item .inner-graph .graph.point .bar{background:rgba(240,65,55,0.8); color:#f04137; font-size:1.6rem;}
/* 차트 높이 설정 */
.anywhere-list .list-item.graph-item .inner-graph .graph .bar{height:0; transition:height 1.5s ease-in-out;}
.anywhere-list .list-item.graph-item .inner-graph .graph .bar{transition-delay:0s;}

/* animated */
.animated .anywhere-list .list-item.graph-item .txt-box,
.animated .anywhere-list .list-item.img-item .img-box{opacity:1; transform:translateY(0);}
/* .animated .anywhere-list .list-item.graph-item .inner-graph .graph .bar{height:attr(data-bar type(<percentage>));} */

/* graph-on */
.anywhere-list .list-item.graph-item.graph-on .inner-graph .graph .bar{transition-delay:0.2s;}
.anywhere-list .list-item.graph-item.graph-on .inner-graph .graph:nth-child(1) .bar{height:1%;}
.anywhere-list .list-item.graph-item.graph-on .inner-graph .graph:nth-child(2) .bar{height:5.3%;}
.anywhere-list .list-item.graph-item.graph-on .inner-graph .graph:nth-child(3) .bar{height:7.2%;}
.anywhere-list .list-item.graph-item.graph-on .inner-graph .graph:nth-child(4) .bar{height:14%;}
.anywhere-list .list-item.graph-item.graph-on .inner-graph .graph:nth-child(5) .bar{height:23%;}
.anywhere-list .list-item.graph-item.graph-on .inner-graph .graph:nth-child(6) .bar{height:32%;}
.anywhere-list .list-item.graph-item.graph-on .inner-graph .graph:nth-child(7) .bar{height:42.7%;}
.anywhere-list .list-item.graph-item.graph-on .inner-graph .graph:nth-child(8) .bar{height:52.6%;}
.anywhere-list .list-item.graph-item.graph-on .inner-graph .graph:nth-child(9) .bar{height:64.5%;}
.anywhere-list .list-item.graph-item.graph-on .inner-graph .graph:nth-child(10) .bar{height:78.5%;}
.anywhere-list .list-item.graph-item.graph-on .inner-graph .graph:nth-child(11) .bar{height:85.7%;}
/* .animated .anywhere-list .list-item.graph-item .inner-graph .graph-arrow-img{width:25rem; height:28.1rem; transform-origin: bottom left;} */


/* 우측 지도 wave */
.anywhere-maker-list{position: absolute; inset:0;}
.anywhere-maker-list .maker{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); opacity:0; transition:var(--transition-custom);}
.anywhere-maker-list .maker .dot{display: block; width:7px; height:7px; border-radius:50%; background:rgba(240,65,55,0.8);}
.anywhere-maker-list .maker .wave{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); background:var(--main-color); opacity:0.5; animation: anywhereMaker 2s infinite linear; width: 100%; height: 100%; border-radius:50%;}
.anywhere-maker-list .maker .wave.wave1{animation-delay:0s;}
.anywhere-maker-list .maker .wave.wave2{animation-delay:1s;}
@keyframes anywhereMaker {
	from { transform:translate(-50%, -50%); opacity:0.5;}
	to {transform:translate(-50%, -50%) scale(4); opacity:0;}
}
.anywhere-maker-list .maker.label .dot{position: relative; width:14px; height:14px; z-index:1;}
.anywhere-maker-list .maker.label .dot:before{position: absolute; content:''; bottom:4px; left:-10px; width:43px; height:65px; background:no-repeat center; background-size:cover; background-image:url('/web-static-images/content/event_anywhere_maker.png');}
.anywhere-maker-list .maker.label.big .dot{width:24px; height:24px;}
.anywhere-maker-list .maker.label.big .dot:before{bottom:8px; left:-11px; width:59px; height:80px; background-image:url('/web-static-images/content/event_anywhere_maker_big.png');}

.anywhere-maker-list .maker:nth-child(1){margin-top:-96px; margin-left:-58px; transition-delay:1.3s;}
.anywhere-maker-list .maker:nth-child(2){margin-top:9px; margin-left:-33px; transition-delay:1.4s;}
.anywhere-maker-list .maker:nth-child(3){margin-top:60px; margin-left:66px; transition-delay:1.5s;}
.anywhere-maker-list .maker:nth-child(4){margin-top:127px; margin-left:-60px; transition-delay:1.6s;}
.anywhere-maker-list .maker:nth-child(5){margin-top:125px; margin-left:100px; transition-delay:1.7s;}
.anywhere-maker-list .maker:nth-child(6){margin-top:-150px; margin-left:26px; transition-delay:1.8s;}
.anywhere-maker-list .maker:nth-child(7){margin-top:-143px; margin-left:67px; transition-delay:1.9s;}
.anywhere-maker-list .maker:nth-child(8){margin-top:-101px; margin-left:39px; transition-delay:1.95s;}
.anywhere-maker-list .maker:nth-child(9){margin-top:-47px; margin-left:33px; transition-delay:2s;}
.anywhere-maker-list .maker:nth-child(10){margin-top:-30px; margin-left:0px; transition-delay:2.05s;}
.anywhere-maker-list .maker:nth-child(11){margin-top:-26px; margin-left:-107px; transition-delay:2.1s;}
.anywhere-maker-list .maker:nth-child(12){margin-top:-12px; margin-left:-77px; transition-delay:2.15s;}
.anywhere-maker-list .maker:nth-child(13){margin-top:-15px; margin-left:85px; transition-delay:2.2s;}
.anywhere-maker-list .maker:nth-child(14){margin-top:61px; margin-left:-2px; transition-delay:2.25s;}
.anywhere-maker-list .maker:nth-child(15){margin-top:90px; margin-left:-31px; transition-delay:2.3s;}
.anywhere-maker-list .maker:nth-child(16){margin-top:108px; margin-left:56px; transition-delay:2.35s;}
.anywhere-maker-list .maker:nth-child(17){margin-top:115px; margin-left:26px; transition-delay:2.4s;}
.anywhere-maker-list .maker:nth-child(18){margin-top:165px; margin-left:-10px; transition-delay:2.45s;}
.anywhere-maker-list .maker:nth-child(19){margin-top:176px; margin-left:-100px; transition-delay:2.5s;}
.anywhere-maker-list .maker:nth-child(20){margin-top:162px; margin-left:-228px; transition-delay:2.55s;}

/* animated */
.animated .anywhere-maker-list .maker{opacity:1;}


/* *** 1만 현장의 선택 *** */
.choice-flow-wrap{padding-top:5rem; opacity:0; transform:translateY(50px); transition:all 1.5s ease-in-out;}
.choice-flow-list{display: flex;}
.choice-flow-list .list-item{display: flex; align-items:center; transform:translateX(-100%); animation: choice-flow 30s infinite linear; /* margin:0 -1.5rem; */}
.choice-flow-list .list-item .inner-box{position: relative; padding:5rem; border-radius:2rem; background:#f5f5f5; box-sizing:border-box; width:42rem; height:25rem; margin:0 1.5rem;}
.choice-flow-list .list-item .inner-box:before{position: absolute; content: '\ea0b'; bottom: -4rem; left: 3rem; font-family: 'xeicon'; color: #f5f5f5; font-size: 10rem; transform: rotate(180deg); z-index:-1;}
.choice-flow-list .list-item .inner-box .point{font-size:1.6rem; line-height:1.5; letter-spacing:-0.02em; color:#aaa; font-weight:500;}
.choice-flow-list .list-item .inner-box .tit{font-size:2.4rem; line-height:1.41; letter-spacing:-0.05em; color:#000; font-weight:500; margin-top:1rem;}
.choice-flow-list .list-item .inner-box .txt{font-size:1.6rem; line-height:1.41; letter-spacing:-0.05em; color:#666; font-weight:500; font-family: var(--font-family1); margin-top:0.5rem;}
.choice-flow-list .list-item .inner-box .icon{position: absolute; bottom:-2rem; right:4rem;}
.choice-flow-list .list-item .inner-box .icon img{filter: drop-shadow(2rem 2rem 1rem rgba(42, 42, 42, 0.3));}

.choice-flow-list .list-item .inner-box:nth-child(even){top:-2.5rem;}
.choice-flow-list .list-item .inner-box:nth-child(odd){top:2.5rem;}

@keyframes choice-flow {
	from { transform: translateX(-100%);}
	to {transform: translateX(-200%);}
}

/* animated */
.animated .choice-flow-wrap{opacity:1; transform:translateY(0);}


/* *** 함께한 경험 *** */
#eventExperience{background:#f5f5f5;}
.experience-list{display: flex; margin:0 -1.7rem;}
.experience-list .list-item{width:calc(33.33% - 3.4rem); margin:0 1.7rem; border-radius:2rem; overflow:hidden; background:#fff; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.experience-list .list-item .img-box{position: relative;}
.experience-list .list-item .img-box span{display: block; position: relative; width:100%; height:0; padding-top:55.55%;}
.experience-list .list-item .img-box span img{position: absolute; inset:0; object-fit:cover; width:100%;}
.experience-list .list-item .txt-box{position: relative; padding:8rem 4rem 4rem; box-sizing:border-box;}
.experience-list .list-item .txt-box:before{position: absolute; content:''; top:4rem; left:4rem; width:3.3rem; height:2.8rem; background:no-repeat center; background-size: cover; background-image:url('/web-static-images/content/event_experience_icon.png');}
.experience-list .list-item .txt-box .inner{min-height: 23rem; padding-bottom: 4rem; box-sizing: border-box;}
.experience-list .list-item .txt-box .tit{font-size:2.2rem; line-height:1.5; letter-spacing:-0.05em; color:#000; font-weight:500;}
.experience-list .list-item .txt-box .txt{font-size:1.6rem; line-height:1.75; letter-spacing:-0.05em; color:#666; font-weight:500; font-family: var(--font-family1); margin-top:1.5rem;}
.experience-list .list-item .txt-box .person{display: flex;}
.experience-list .list-item .txt-box .person span{font-size:1.6rem; line-height:1.75; letter-spacing:-0.05em; color:#888; font-weight:500; font-family: var(--font-family1);}
.experience-list .list-item .txt-box .person i{font-size:2.4rem; line-height:1.16; letter-spacing:-0.05em; color:#222; margin-right:0.5rem;}

/* animated */
.experience-list .list-item:nth-child(1){transition-delay:0.4s}
.experience-list .list-item:nth-child(2){transition-delay:0.6s}
.experience-list .list-item:nth-child(3){transition-delay:0.8s}
.animated .experience-list .list-item{opacity:1; transform:translateY(0);}

/* *** 축하 이벤트 *** */
.event-list{display: flex; justify-content: center; margin:0 -2rem;}
.event-list .list-item{position: relative; display: flex ; flex-direction: column; justify-content: space-between; width:calc(50% - 4rem); margin:0 2rem; max-width:50rem; padding:8rem 4rem 4rem; box-sizing:border-box; text-align:center; background:#f5f5f5; border-radius:2rem; height:70rem; opacity:0; transform:translateY(50px); transition:var(--transition-custom2);}
.event-list .list-item .tit-box{position: relative; z-index:9;}
.event-list .list-item .tit-box .category{font-size:1.6rem; line-height:1.5; letter-spacing:-0.02em; color:var(--main-color); font-weight:500;}
.event-list .list-item .tit-box .tit{font-size:4rem; line-height:1.1; letter-spacing:-0.05em; color:#000; font-weight:500; margin-top:2.3rem;}
.event-list .list-item .tit-box .txt{font-size:1.6rem; line-height:1.625; letter-spacing:-0.05em; color:#666; font-weight:500; font-family: var(--font-family1); margin-top:2.3rem;}
.event-list .list-item .img-box{position: absolute; bottom:0; left:0; width:100%;}
.event-list .list-item .img-box img{width:100%;}
.event-list .list-item .cm-event-btn{position: relative; justify-content: center; z-index:9;}

/* animated */
.event-list .list-item:nth-child(1){transition-delay:0.4s}
.event-list .list-item:nth-child(2){transition-delay:0.6s}
.animated .event-list .list-item{opacity:1; transform:translateY(0);}


/* *** 오디오 추가 *** */
.to-audio-btn{position: fixed; width:8rem; height:8rem; right:8rem; bottom:7.5rem; background:#fff; border-radius:50%; display: flex; align-items:center; justify-content:center; flex-direction: column; z-index:999; transition:var(--transition-custom); box-shadow: 3px 4px 5px 0px rgba(0, 0, 0, 0.2);}
.to-audio-btn .sound-line-box{display: flex; align-items:center; height:1.5rem;}
.to-audio-btn .sound-line-box .line{width:2px; height:0.9rem; background:#aaa; margin:0 2px; transition:var(--transition-custom);}
.to-audio-btn .audio-txt{font-size:1.2rem; color:#aaa; font-family: var(--font-family2); margin-top:1rem; transition:var(--transition-custom);}
/* play */
.to-audio-btn.play .sound-line-box .line{animation: audioAnimation 1s cubic-bezier(0.4, 0, 0.2, 1) infinite; background:#000;}
.to-audio-btn.play .sound-line-box .line:nth-child(1){animation-delay:0.5s;}
.to-audio-btn.play .sound-line-box .line:nth-child(2){animation-delay:0.25s;}
.to-audio-btn.play .sound-line-box .line:nth-child(3){animation-delay:0s;}
.to-audio-btn.play .sound-line-box .line:nth-child(4){animation-delay:0.25s;}
.to-audio-btn.play .sound-line-box .line:nth-child(5){animation-delay:0.5s;}
.to-audio-btn.play .audio-txt{color:#000;}

@keyframes audioAnimation {
	0% {height:0.9rem;}
	33% {height:1.5rem;}
	66% {height:0.9rem;}
	100% {height:0.9rem;}
}
/* fixed */
/* .to-audio-btn.bottom-fixed{bottom:14.5rem} */



/* ******************** 
* 만개달성 이벤트 페이지 2025-10-31MJ
******************** */
/* *** 이벤트페이지 헤더 *** */
@media all and (max-width:1280px){
	.header-util-box{padding-right:0 !important;}
	.header-event-link{margin-right:0;}
}

/* *** 이벤트페이지 서브비주얼 *** */
@media all and (max-width:800px){
	#eventVisual .event-visual-txt-box{margin-bottom:3rem;}
	#eventVisual .event-visual-txt-box .visual-top-txt{max-width:calc(100% - (4 * var(--area-padding))); font-size:1.8rem}
	#eventVisual .visual-tit{font-size:4rem; margin-top:2rem;}
	#eventVisual .visual-txt{font-size:1.6rem; margin-top:1rem;}
	
	.visual-scroll-down .scroll-txt{font-size:1.2rem;}
	.visual-scroll-down .scroll-bar{margin-top:0.5rem; height:4rem;}
	.visual-scroll-down .scroll-bar:before{height:0.8rem;}
}

/* *** 이벤트페이지 공통 *** */
@media all and (max-width:800px){
	.event-con{padding:8rem 0;}
	.cm-event-tit-box{margin-bottom:3rem;}
	.cm-event-tit-box .cm-event-tit{font-size:3.6rem;}
	.cm-event-tit-box .cm-event-txt{font-size:1.6rem;}
	
	.cm-event-btn{height:6rem; padding:0 2rem; margin-top:3rem; font-size:1.8rem;}
}

/* *** 숫자로 보는 아이파킹 *** */
@media all and (max-width:800px){
	.number-list{display: block;}
	.number-list .list-item{width:100%; height:auto; margin-bottom:7rem; padding:4rem 0;}
	.number-list .list-item .txt{font-size:4rem;}
	.number-list .list-item .txt02{font-size:1.6rem;}
	.number-list .list-item .inner-icon{width:10rem; height:10rem;}
}

/* *** 함께 달성한 아이파킹의 기록 *** */
@media all and (max-width:800px){
	.record-flow-wrap{margin-top:6rem;}
	.record-flow-list .list-item{height:12rem;}
	.record-flow-list .list-item .flow-txt{font-size:2.4rem; margin:0 2rem;}
}

/* *** 어디서나 아이파킹 *** */
@media all and (max-width:1480px){
	.anywhere-maker-list .maker .dot{width:0.7rem; height:0.7rem;}
	.anywhere-maker-list .maker.label .dot{width:1.4rem; height:1.4rem;}
	.anywhere-maker-list .maker.label.big .dot{width:2.4rem; height:2.4rem;}
	.anywhere-maker-list .maker.label .dot:before{width:4.3rem; height:6.5rem;}
	.anywhere-maker-list .maker.label.big .dot:before{width:5.9rem; height:8rem;}

	.anywhere-maker-list .maker:nth-child(1){margin-top:-9.6rem; margin-left:-5.8rem;}
	.anywhere-maker-list .maker:nth-child(2){margin-top:0.9rem; margin-left:-3.3rem;}
	.anywhere-maker-list .maker:nth-child(3){margin-top:6rem; margin-left:6.6rem;}
	.anywhere-maker-list .maker:nth-child(4){margin-top:12.7rem; margin-left:-6rem;}
	.anywhere-maker-list .maker:nth-child(5){margin-top:12.5rem; margin-left:10rem;}
	.anywhere-maker-list .maker:nth-child(6){margin-top:-15rem; margin-left:2.6rem;}
	.anywhere-maker-list .maker:nth-child(7){margin-top:-14.3rem; margin-left:6.7rem;}
	.anywhere-maker-list .maker:nth-child(8){margin-top:-10.1rem; margin-left:3.9rem;}
	.anywhere-maker-list .maker:nth-child(9){margin-top:-4.7rem; margin-left:3.3rem;}
	.anywhere-maker-list .maker:nth-child(10){margin-top:-3rem; margin-left:0px;}
	.anywhere-maker-list .maker:nth-child(11){margin-top:-2.6rem; margin-left:-10.7rem;}
	.anywhere-maker-list .maker:nth-child(12){margin-top:-1.2rem; margin-left:-7.7rem;}
	.anywhere-maker-list .maker:nth-child(13){margin-top:-1.5rem; margin-left:8.5rem;}
	.anywhere-maker-list .maker:nth-child(14){margin-top:6.1rem; margin-left:-0.2rem;}
	.anywhere-maker-list .maker:nth-child(15){margin-top:9rem; margin-left:-3.1rem;}
	.anywhere-maker-list .maker:nth-child(16){margin-top:10.8rem; margin-left:5.6rem;}
	.anywhere-maker-list .maker:nth-child(17){margin-top:11.5rem; margin-left:2.6rem;}
	.anywhere-maker-list .maker:nth-child(18){margin-top:16.5rem; margin-left:-1rem;}
	.anywhere-maker-list .maker:nth-child(19){margin-top:17.6rem; margin-left:-10rem;}
	.anywhere-maker-list .maker:nth-child(20){margin-top:16.2rem; margin-left:-22.8rem;}
}
@media all and (max-width:1280px){
	.anywhere-list .list-item.img-item{display: flex ; align-items: center;}
	
	.anywhere-list .list-item.graph-item{padding-top:15rem;}
	.anywhere-list .list-item.graph-item .inner-graph{height:25rem;}
	.anywhere-list .list-item.graph-item .inner-graph .graph-arrow-img{left: calc(100% - 12rem);}
	.animated .anywhere-list .list-item.graph-item .inner-graph .graph-arrow-img{width: 12.5rem; height: 14.05rem;}
	
	.anywhere-maker-list .maker:nth-child(1){margin-top:-7rem; margin-left:-4rem;}
	.anywhere-maker-list .maker:nth-child(2){margin-top:0.9rem; margin-left:-2.5rem;}
	.anywhere-maker-list .maker:nth-child(3){margin-top:5rem; margin-left:5.5rem;}
	.anywhere-maker-list .maker:nth-child(4){margin-top:9.5rem; margin-left:-5rem;}
	.anywhere-maker-list .maker:nth-child(5){margin-top:9.5rem; margin-left:8rem;}
	.anywhere-maker-list .maker:nth-child(6){margin-top:-10.5rem; margin-left:2rem;}
	.anywhere-maker-list .maker:nth-child(7){margin-top:-10rem; margin-left:5.5rem;}
	.anywhere-maker-list .maker:nth-child(8){margin-top:-7.8rem; margin-left:3.4rem;}
	.anywhere-maker-list .maker:nth-child(9){margin-top:-3.7rem; margin-left:3rem;}
	.anywhere-maker-list .maker:nth-child(10){margin-top:-2rem; margin-left:0.4rem;}
	.anywhere-maker-list .maker:nth-child(11){margin-top:-2rem; margin-left:-7.7rem;}
	.anywhere-maker-list .maker:nth-child(12){margin-top:-0.7rem; margin-left:-5.5rem;}
	.anywhere-maker-list .maker:nth-child(13){margin-top:-1.7rem; margin-left:7.5rem;}
	.anywhere-maker-list .maker:nth-child(14){margin-top:5.1rem; margin-left:-0.2rem;}
	.anywhere-maker-list .maker:nth-child(15){margin-top:7rem; margin-left:-2.1rem;}
	.anywhere-maker-list .maker:nth-child(16){margin-top:8.5rem; margin-left:4.5rem;}
	.anywhere-maker-list .maker:nth-child(17){margin-top:9rem; margin-left:2.2rem;}
	.anywhere-maker-list .maker:nth-child(18){margin-top:12.5rem; margin-left:-1rem;}
	.anywhere-maker-list .maker:nth-child(19){margin-top:13.6rem; margin-left:-7.7rem;}
	.anywhere-maker-list .maker:nth-child(20){margin-top:12rem; margin-left:-17rem;}
}
@media all and (max-width:800px){
	.anywhere-list{display: block;}
	.anywhere-list .list-item{width:100%; }
	.anywhere-list .list-item + .list-item{margin-top:2rem;}
	
	.anywhere-list .list-item.graph-item{padding:6rem 3rem;}
	.anywhere-list .list-item.graph-item .txt-box{top:3rem; left:3rem;}
	.anywhere-list .list-item.graph-item .txt-box .txt{font-size:1.8rem;}
	.anywhere-list .list-item.graph-item .txt-box .tit{font-size:4rem;}
	.anywhere-list .list-item.graph-item .inner-graph .graph{width: calc((100% - 0.4rem) / 11); margin: 0 0.2rem;}
	.anywhere-list .list-item.graph-item .inner-graph .graph .year{top: calc(100% + 1rem);}
	
	.anywhere-maker-list .maker .dot{width:1.12vw; height:1.12vw;}
	.anywhere-maker-list .maker.label .dot{width:2.24vw; height:2.24vw;}
	.anywhere-maker-list .maker.label.big .dot{width:3.84vw; height:3.84vw;}
	.anywhere-maker-list .maker.label .dot:before{bottom: 0.6vw; left: -1.6vw; width:6.88vw; height:10.4vw;}
	.anywhere-maker-list .maker.label.big .dot:before{bottom: 1.5vw; left: -1.7vw; width:9.44vw; height:12.8vw;}

	.anywhere-maker-list .maker:nth-child(1){margin-top:-11.2vw; margin-left:-6.4vw;}
	.anywhere-maker-list .maker:nth-child(2){margin-top:1.44vw; margin-left:-4vw;}
	.anywhere-maker-list .maker:nth-child(3){margin-top:8vw; margin-left:8.8vw;}
	.anywhere-maker-list .maker:nth-child(4){margin-top:15.2vw; margin-left:-8vw;}
	.anywhere-maker-list .maker:nth-child(5){margin-top:15.2vw; margin-left:12.8vw;}
	.anywhere-maker-list .maker:nth-child(6){margin-top:-16.8vw; margin-left:3.2vw;}
	.anywhere-maker-list .maker:nth-child(7){margin-top:-16vw; margin-left:8.8vw;}
	.anywhere-maker-list .maker:nth-child(8){margin-top:-12.48vw; margin-left:5.44vw;}
	.anywhere-maker-list .maker:nth-child(9){margin-top:-5.92vw; margin-left:4.8vw;}
	.anywhere-maker-list .maker:nth-child(10){margin-top:-3.2vw; margin-left:0.64vw;}
	.anywhere-maker-list .maker:nth-child(11){margin-top:-3.2vw; margin-left:-12.32vw;}
	.anywhere-maker-list .maker:nth-child(12){margin-top:-1.12vw; margin-left:-8.8vw;}
	.anywhere-maker-list .maker:nth-child(13){margin-top:-2.72vw; margin-left:12vw;}
	.anywhere-maker-list .maker:nth-child(14){margin-top:8.16vw; margin-left:-0.32vw;}
	.anywhere-maker-list .maker:nth-child(15){margin-top:11.2vw; margin-left:-3.36vw;}
	.anywhere-maker-list .maker:nth-child(16){margin-top:13.6vw; margin-left:7.2vw;}
	.anywhere-maker-list .maker:nth-child(17){margin-top:14.4vw; margin-left:3.52vw;}
	.anywhere-maker-list .maker:nth-child(18){margin-top:20vw; margin-left:-1.6vw;}
	.anywhere-maker-list .maker:nth-child(19){margin-top:21.76vw; margin-left:-12.32vw;}
	.anywhere-maker-list .maker:nth-child(20){margin-top:21.2vw; margin-left:-29.2vw;}
}
@media all and (max-width:640px){
	.anywhere-list .list-item.graph-item .inner-graph .graph-arrow-img{left: calc(100% - 11.5rem);}
}
@media all and (max-width:480px){
	.anywhere-list .list-item.graph-item .inner-graph .graph{font-size:1.1rem;}
	.anywhere-list .list-item.graph-item .inner-graph .graph.point .bar span{font-size:1.4rem;}
}
/* *** 1만 현장의 선택 *** */
@media all and (max-width:800px){
	#eventChoice.event-con{padding-bottom:13rem;}
	.choice-flow-list .list-item .inner-box{padding:3rem; width:30rem; height:20rem;}
	.choice-flow-list .list-item .inner-box .icon{text-align:right;}
	.choice-flow-list .list-item .inner-box .icon img{width:75%;}
}

/* *** 함께한 경험 *** */
@media all and (max-width:800px){
	.experience-list{display: block; margin:0;}
	.experience-list .list-item{width:100%; margin:0 auto 3rem; /* max-width:450px; */}
	.experience-list .list-item:last-child{margin-bottom:0;}
	.experience-list .list-item .txt-box{padding:8rem 3rem 3rem;}
	.experience-list .list-item .txt-box:before{left:3rem;}
}

/* *** 축하 이벤트 *** */
@media all and (max-width:800px){
	.event-list{display: block; margin:0;}
	.event-list .list-item{width:100%; margin:0 auto 3rem; padding:6rem 3rem 3rem; height:auto; max-width:none;}
	.event-list .list-item .tit-box{margin-bottom:35rem;}
	.event-list .list-item .tit-box .tit{font-size:2.4rem; margin-top:1.5rem;}
	.event-list .list-item .tit-box .txt{margin-top:1.5rem;}
	.event-list .list-item .img-box{left:50%; transform:translateX(-50%); max-width:45rem;}
}
@media all and (max-width:480px){
	.event-list .list-item .tit-box{margin-bottom:28rem;}
}

/* *** 오디오 추가 *** */
@media all and (max-width:1280px){
	.to-audio-btn{right: calc(var(--area-padding) - 1rem);}
}
@media all and (max-width:800px){
	.to-audio-btn{width:6rem; height:6rem; bottom:4rem;}
	.to-audio-btn .audio-txt{margin-top:0.5rem; font-size:1rem;}
	/* fixed */
	.to-audio-btn.bottom-fixed{bottom:9rem}
}