@charset "UTF-8";
* {
    color: #000000;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-size: 10px; /* rem 단위 계산 기준을 10px로 설정 */
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    text-size-adjust: 100%;
    font-weight: 400;
}

/* common.css reset */
body {
    min-width: auto;
}

div,
p,
span {
    letter-spacing: -0.5px;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
textarea,
p,
blockquote,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
}

img {
    border: 0;
    border-style: none;
}

button {
    border: 0;
    background: none;
    padding: 0;
    cursor: pointer;
}

button,
input,
select,
optgroup,
textarea {
    margin: 0;
    font-size: 100%;
    font-family: inherit;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

fieldset {
    border: 0;
}

legend {
    color: #000000;
}

address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
    font-style: normal;
    font-weight: normal;
}

ol,
ul {
    list-style: none;
}

caption,
th {
    text-align: left;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: 100%;
    font-weight: normal;
    line-height: 1;
}

caption,
hr,
legend {
    width: 0;
    height: 0;
    font-size: 1px;
    text-indent: -9999em;
    line-height: 0;
}

a {
    color: inherit;
    text-decoration: none;
    background-color: transparent;
}

a:visited span {
    border: inherit;
}

main {
    display: block;
}

abbr[title] {
    border-bottom: none; /* 1 */
    text-decoration: underline; /* 2 */
}

@supports (text-decoration-style: dotted) {
    abbr[title] {
        -webkit-text-decoration: underline dotted;
        text-decoration: underline dotted; /* 점선 밑줄을 지원하는 브라우저에서만 적용 */
    }
}
small {
    font-size: 80%;
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

button,
input {
    /* 1 */
    overflow: visible;
}

input[type=number] {
    -webkit-appearance: none;
    -moz-appearance: textfield;
    appearance: none;
}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox의 스핀 버튼 제거 */
input[type=number] {
    -moz-appearance: textfield;
}

/* 포커스 상태 초기화 */
input[type=number]:focus {
    outline: none;
    box-shadow: none;
}

/*
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
    /* 1 */
    text-transform: none;
}

/*
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
    border-style: none;
    padding: 0;
}

/*
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
    outline: 1px dotted ButtonText;
}

/*
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
    vertical-align: baseline;
}

/*
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
    overflow: auto;
}

/*
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
    height: auto;
}

/*
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type=search] {
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield; /* 1 */
    outline-offset: -2px; /* 2 */
}

/*
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type=search]::-webkit-search-decoration {
    -webkit-appearance: none;
    appearance: none;
}

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
    display: block;
}

/*
 * Add the correct display in IE 10+.
 */
template {
    display: none;
}

/*
 * Add the correct display in IE 10.
 */
[hidden] {
    display: none;
}

.hide-txt {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    font-size: 1px;
    line-height: 0;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    margin: -1px;
    padding: 0;
    border: 0;
}

@font-face {
    font-family: "Pretendard";
    src: url(https://cdn.gni.kr/assets/font/Pretendard/Pretendard-Light.woff2) format("woff2"), url(https://cdn.gni.kr/assets/font/Pretendard/Pretendard-Light.woff) format("woff"), url(https://cdn.gni.kr/assets/font/Pretendard/Pretendard-Light.otf) format("opentype");
    font-weight: 300;
}
@font-face {
    font-family: "Pretendard";
    src: url(https://cdn.gni.kr/assets/font/Pretendard/Pretendard-Regular.woff2) format("woff2"), url(https://cdn.gni.kr/assets/font/Pretendard/Pretendard-Regular.woff) format("woff"), url(https://cdn.gni.kr/assets/font/Pretendard/Pretendard-Regular.otf) format("opentype");
    font-weight: 400;
}
@font-face {
    font-family: "Pretendard";
    src: url(https://cdn.gni.kr/assets/font/Pretendard/Pretendard-Medium.woff2) format("woff2"), url(https://cdn.gni.kr/assets/font/Pretendard/Pretendard-Medium.woff) format("woff"), url(https://cdn.gni.kr/assets/font/Pretendard/Pretendard-Medium.otf) format("opentype");
    font-weight: 500;
}
@font-face {
    font-family: "Pretendard";
    src: url(https://cdn.gni.kr/assets/font/Pretendard/Pretendard-Bold.woff2) format("woff2"), url(https://cdn.gni.kr/assets/font/Pretendard/Pretendard-Bold.woff) format("woff"), url(https://cdn.gni.kr/assets/font/Pretendard/Pretendard-Bold.otf) format("opentype");
    font-weight: 600;
}
@font-face {
    font-family: "HsSantoki";
    src: url("https://gcore.jsdelivr.net/gh/projectnoonnu/noonfonts_2201-2@1.0/HS-Regular.woff") format("woff");
    font-weight: normal;
    font-display: swap;
}
@font-face {
    font-family: "SokchoSeaDotum";
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2402_1@1.0/SokchoBadaDotum.woff2") format("woff2");
    font-weight: normal;
    font-display: swap;
}
@font-face {
    font-family: "IsYun";
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2202-2@1.0/LeeSeoyun.woff") format("woff");
    font-weight: normal;
    font-display: swap;
}
@font-face {
    font-family: "GapyeongHanseokbongBigBrush";
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2312-1@1.1/GapyeongHanseokbong-Light.woff2") format("woff2");
    font-weight: 300;
    font-display: swap;
}
@font-face {
    font-family: "GapyeongHanseokbongBigBrush";
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2312-1@1.1/GapyeongHanseokbong-Regular.woff2") format("woff2");
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: "GapyeongHanseokbongBigBrush";
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2312-1@1.1/GapyeongHanseokbong-Bold.woff2") format("woff2");
    font-weight: 700;
    font-display: swap;
}
:root {
    --pre: "Pretendard";
    --san: "HsSantoki";
    --sok: "SokchoSeaDotum";
    --han: "GapyeongHanseokbongBigBrush";
}

body {
    min-width: auto;
}

[class^=ico-] {
    display: inline-block;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.santa2025-wrap {
    width: 100%;
    min-width: 1400px;
    max-width: 1920px;
    margin: auto;
    position: relative;
    overflow: hidden;
}
.santa2025-wrap div,
.santa2025-wrap span,
.santa2025-wrap p,
.santa2025-wrap em {
    font-family: var(--pre) !important;
    letter-spacing: -0.5px;
}
.santa2025-wrap img {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
}
.santa2025-wrap .inner {
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
    position: relative;
}
.santa2025-wrap .h-center {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
}
.santa2025-wrap .logo {
    display: flex;
    width: 182px;
    height: 34px;
    position: absolute;
    right: 30px;
    top: 30px;
    z-index: 4;
}
.santa2025-wrap .section {
    position: relative;
}
.santa2025-wrap .section .content-area {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.santa2025-wrap .section .msg-area {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    line-height: 1.5;
}
.santa2025-wrap .section .msg-area p,
.santa2025-wrap .section .msg-area strong {
    font-size: 38px;
}
.santa2025-wrap .section .msg-area strong {
    font-weight: 600;
}
.santa2025-wrap .section .msg-area .udline {
    position: relative;
    display: inline-block;
    padding-bottom: 6px; /* 선과 텍스트 사이 간격 */
}
.santa2025-wrap .section .msg-area .udline::after {
    content: "";
    position: absolute;
    left: -6px;
    right: 0;
    bottom: 2px;
    height: 2px;
    width: 104%;
    background-image: repeating-linear-gradient(90deg, #1c4566 0 12px, transparent 10px 20px);
    background-size: 100% 2px;
    background-repeat: repeat-x;
    pointer-events: none;
}
.santa2025-wrap .section .msg-area.color1 p,
.santa2025-wrap .section .msg-area.color1 strong {
    color: #1c4566;
}
.santa2025-wrap .section .msg-area.color1 .udline::after {
    background-image: repeating-linear-gradient(90deg, #1c4566 0 12px, transparent 10px 20px);
}
.santa2025-wrap .section .tit {
    text-align: center;
}
.santa2025-wrap .section .tit p {
    font-family: var(--san) !important;
    font-size: 84px;
    color: #fff;
}
.santa2025-wrap .section .tit p.flex {
    display: flex;
    justify-content: center;
}
.santa2025-wrap .section.section1 {
    background: url("https://cdn.gni.kr/assets/images/event/2025/santa/bg1.png") no-repeat center/cover;
    z-index: 3;
}
.santa2025-wrap .section.section1 .inner::after {
    content: "";
    display: block;
    padding-top: 110%;
}
.santa2025-wrap .section.section1 .tit-area {
    position: relative;
    height: 366px;
    margin-top: 60px;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.santa2025-wrap .section.section1 .small {
    margin-top: 50px;
    position: relative;
    padding-left: 120px;
}
.santa2025-wrap .section.section1 .small img {
    -webkit-clip-path: inset(0 100% 0 0);
    clip-path: inset(0 100% 0 0);
    animation: reveal-left-to-right 1.2s ease-out forwards;
}
.santa2025-wrap .section.section1 .small::before {
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    display: block;
    background: url("https://cdn.gni.kr/assets/images/event/2025/santa/hat.png") no-repeat center/contain;
    width: 117px;
    height: 100px;
    transform-origin: top center;
    animation: hat-sway 2s linear infinite;
}
.santa2025-wrap .section.section1 .top-santa {
    width: 90%;
    margin: -4% auto 0;
    display: flex;
    justify-content: center;
}
.santa2025-wrap .section.section1 .top-santa img {
    width: 100%;
}
.santa2025-wrap .section.section1 .ico-snowflo {
    background-image: url("https://cdn.gni.kr/assets/images/event/2025/santa/snow_flo.png");
    position: absolute;
    z-index: 2;
}
.santa2025-wrap .section.section1 .snow-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    z-index: -1;
}
.santa2025-wrap .section.section1 .snowflake-wrapper {
    position: absolute;
    pointer-events: none;
    animation: snowfall linear infinite;
}
.santa2025-wrap .section.section1 .snowflake {
    background-color: #fff;
    border-radius: 50%;
    pointer-events: none;
    animation: snowfall-sway1 ease-in-out infinite;
}
.santa2025-wrap .section.section1 .ico-snowflo-falling {
    display: inline-block;
    background-image: url("https://cdn.gni.kr/assets/images/event/2025/santa/snow_flo.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    pointer-events: none;
}
.santa2025-wrap .section.section2 {
    background: url("https://cdn.gni.kr/assets/images/event/2025/santa/bg2.png") no-repeat center/cover;
    perspective: 1500px;
}
.santa2025-wrap .section.section2 .inner::after {
    content: "";
    display: block;
    padding-top: 240%;
}
.santa2025-wrap .section.section2 .letter-area {
    position: relative;
    top: 17%;
    left: 50%;
    transform: translateX(-50%);
    perspective: 2000px;
}
.santa2025-wrap .section.section2 .letter-area .letter-cover {
    z-index: 4;
    position: absolute;
    left: 50%;
    top: 0%;
    transform-origin: top center;
    transform: translateX(-50%) rotateX(0deg);
    transform-style: preserve-3d;
}
.santa2025-wrap .section.section2 .letter-area .letter-body {
    display: flex;
    position: relative;
    z-index: 3;
    width: 758px;
    height: 502px;
    margin: 0 auto;
}
.santa2025-wrap .section.section2 .letter-area .letter-paper {
    z-index: 2;
    position: absolute;
    left: 50%;
    bottom: 0%;
    transform: translateX(-50%);
}
.santa2025-wrap .section.section2 .letter-area .letter-paper .point {
    width: 100%;
    position: absolute;
    bottom: 27%;
    left: 20%;
    font-family: var(--han) !important;
    font-size: 28px;
}
.santa2025-wrap .section.section2 .letter-area .letter-paper .point.color1 {
    color: #000;
    bottom: 60%;
    left: 17%;
}
.santa2025-wrap .section.section2 .letter-area .letter-paper .point.color2 {
    color: #a6670d;
}
.santa2025-wrap .section.section2 .letter-area .letter-back {
    z-index: 1;
    background: #213932;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 755px;
    height: 490px;
}
.santa2025-wrap .section.section2 .ico {
    position: absolute;
}
.santa2025-wrap .section.section2 .ico.ico-santa {
    background-image: url("https://cdn.gni.kr/assets/images/event/2025/santa/santa.png");
    width: 385px;
    height: 432px;
    top: 13%;
    left: -20%;
}
.santa2025-wrap .section.section2 .ico.ico-rudolf {
    background-image: url("https://cdn.gni.kr/assets/images/event/2025/santa/letter_rodolf.png");
    width: 254px;
    height: 308px;
    top: 43%;
    left: 16%;
    z-index: 3;
}
.santa2025-wrap .section.section2 .ico.ico-giftcar {
    background-image: url("https://cdn.gni.kr/assets/images/event/2025/santa/giftcar.png");
    width: 316px;
    height: 323px;
    right: -3%;
    top: 40%;
    z-index: 3;
}
.santa2025-wrap .section.section2 .tit {
    margin-top: 80px;
}
.santa2025-wrap .section.section2 .tit.type1 {
    width: 1600px;
    max-width: 1600px;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}
.santa2025-wrap .section.section2 .tit .name {
    display: inline-flex;
    font-family: var(--san) !important;
    color: rgba(0, 0, 0, 0.1);
    background: linear-gradient(to right, rgb(255, 240, 188) 0%, rgb(255, 240, 188) 0%, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.1) 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 100% 100%;
    background-position: 0 0;
}
.santa2025-wrap .section.section2 .ico-star-curtain {
    z-index: -1;
    background-image: url("https://cdn.gni.kr/assets/images/event/2025/santa/star_curtain.png");
    width: 85px;
    height: 846px;
    position: absolute;
    transform-style: preserve-3d;
}
.santa2025-wrap .section.section2 .ico-star-curtain.curtain1 {
    left: -36%;
    top: -390px;
}
.santa2025-wrap .section.section2 .ico-star-curtain.curtain2 {
    left: -20%;
    top: -630px;
}
.santa2025-wrap .section.section2 .ico-star-curtain.curtain3 {
    left: -5%;
    top: -520px;
}
.santa2025-wrap .section.section2 .ico-star-curtain.curtain4 {
    right: -5%;
    top: -390px;
}
.santa2025-wrap .section.section2 .ico-star-curtain.curtain5 {
    right: -20%;
    top: -630px;
}
.santa2025-wrap .section.section2 .ico-star-curtain.curtain6 {
    right: -36%;
    top: -390px;
}
.santa2025-wrap .section.section2 .msg-area {
    margin-top: 46%;
}
.santa2025-wrap .section.section2 .msg-area p,
.santa2025-wrap .section.section2 .msg-area strong {
    color: #1c4566;
}
.santa2025-wrap .section.section2 .msg-area .red {
    color: #bc1d3f;
}
.santa2025-wrap .section.section2 .step-area {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 10%;
}
.santa2025-wrap .section.section2 .step-area .step {
    display: flex;
    gap: 1%;
}
.santa2025-wrap .section.section2 .step-area .step li:nth-child(odd) {
    margin-top: -10%;
}
.santa2025-wrap .section.section2 .step-area .step li:nth-child(even) {
    margin-top: -2%;
}
.santa2025-wrap .section.section3 {
    cursor: url("https://cdn.gni.kr/assets/images/event/2025/santa/hand08_01.png") 0 0, pointer;
    background: url("https://cdn.gni.kr/assets/images/event/2025/santa/bg3.png") no-repeat center/cover;
}
.santa2025-wrap .section.section3 .inner::after {
    content: "";
    display: block;
    padding-top: 130%;
}
.santa2025-wrap .section.section3 .tit {
    margin-top: 100px;
    line-height: 1;
}
.santa2025-wrap .section.section3 .tit p {
    font-size: 63px;
}
.santa2025-wrap .section.section3 .tit .large {
    font-size: 83px;
    color: #ffee5f;
}
.santa2025-wrap .section.section3 .child-area {
    margin-top: 14%;
}
.santa2025-wrap .section.section3 .child-area .child-tag {
    display: flex;
    justify-content: center;
    gap: 14%;
}
.santa2025-wrap .section.section3 .child-area .child {
    position: relative;
    z-index: 2;
}
.santa2025-wrap .section.section3 .child-area .child .ico {
    position: absolute;
    width: 169px;
    height: 149px;
    top: -47%;
    left: 13%;
    z-index: -1;
}
.santa2025-wrap .section.section3 .child-area .child .ico.ico-tag1 {
    background-image: url("https://cdn.gni.kr/assets/images/event/2025/santa/tag1.png");
}
.santa2025-wrap .section.section3 .child-area .child .ico.ico-tag2 {
    background-image: url("https://cdn.gni.kr/assets/images/event/2025/santa/tag2.png");
}
.santa2025-wrap .section.section3 .child-area .child .ico.ico-tag3 {
    background-image: url("https://cdn.gni.kr/assets/images/event/2025/santa/tag3.png");
}
.santa2025-wrap .section.section3 .child-area .child-item {
    display: flex;
}
.santa2025-wrap .section.section3 .child-area .child-item .item-row {
    display: flex;
    width: 331px;
    height: 486px;
    position: relative;
}
.santa2025-wrap .section.section3 .child-area .child-item .item-el {
    position: absolute;
    top: 15%;
    left: 0;
    width: 100%;
    height: 100%;
}
.santa2025-wrap .section.section3 .child-area .child-item .item-el.before {
    /*cursor: url("https://cdn.gni.kr/assets/images/event/2025/santa/hand08_01.png") 0 0, pointer;*/
    z-index: 2;
}
.santa2025-wrap .section.section3 .child-area .child-item .item-el.before:hover .ico-cover {
    animation: cover-swing 0.6s ease-in-out infinite;
}
.santa2025-wrap .section.section3 .child-area .child-item .item-el.el1 {
    left: 20%;
}
.santa2025-wrap .section.section3 .child-area .child-item .item-el.el1.after {
    top: 0%;
    left: 0%;
}
.santa2025-wrap .section.section3 .child-area .child-item .item-el.el2 {
    left: 21%;
}
.santa2025-wrap .section.section3 .child-area .child-item .item-el.el2.after {
    top: 0%;
    left: 0%;
}
.santa2025-wrap .section.section3 .child-area .child-item .item-el.el3 {
    left: 18%;
}
.santa2025-wrap .section.section3 .child-area .child-item .item-el.el3.after {
    top: 0%;
    left: 0%;
}
.santa2025-wrap .section.section3 .child-area .child-item .item-el [class^=ico-] {
    position: absolute;
}
.santa2025-wrap .section.section3 .child-area .child-item .item-el [class^=ico-].ico-cover {
    z-index: 2;
    top: -14%;
    left: -9%;
    transform: rotate(-15deg);
}
.santa2025-wrap .section.section3 .child-area .child-item .item-el [class^=ico-].ico-box {
    top: 20%;
    left: 1%;
}
.santa2025-wrap .section.section3 .child-area .child-item .item-el.after {
    display: none;
}
.santa2025-wrap .section.section3 .child-area .ico-cover {
    background-image: url("https://cdn.gni.kr/assets/images/event/2025/santa/box_cover.png");
    width: 256px;
    height: 198px;
}
.santa2025-wrap .section.section3 .child-area .ico-box {
    background-image: url("https://cdn.gni.kr/assets/images/event/2025/santa/box_item.png");
    width: 203px;
    height: 131px;
}
.santa2025-wrap .section.section4 {
    background: url("https://cdn.gni.kr/assets/images/event/2025/santa/bg4.png") no-repeat center/cover;
}
.santa2025-wrap .section.section4 .particle-back {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}
.santa2025-wrap .section.section4 .content-area {
    z-index: 2;
}
.santa2025-wrap .section.section4 .inner::after {
    content: "";
    display: block;
    padding-top: 160%;
}
.santa2025-wrap .section.section4 .tit {
    margin-top: 100px;
    line-height: 1;
}
.santa2025-wrap .section.section4 .tit p {
    font-size: 50px;
}
.santa2025-wrap .section.section4 .tit .large {
    font-size: 63px;
    color: #ffd2f2;
}
.santa2025-wrap .section.section4 .input-area {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.santa2025-wrap .section.section4 .input-area .cover {
    position: absolute;
    top: 28%;
}
.santa2025-wrap .section.section4 .input-area .box {
    position: absolute;
    top: 45%;
}
.santa2025-wrap .section.section4 .input-area .input {
    background: url("https://cdn.gni.kr/assets/images/event/2025/santa/gift_letter.png") no-repeat center/contain;
    width: 581px;
    height: 422px;
    position: relative;
    display: none;
    z-index: 2;
}
.santa2025-wrap .section.section4 .input-area textarea {
    font-weight: 500;
    resize: none;
    position: absolute;
    left: 17%;
    top: 25%;
    width: 68%;
    height: 52%;
    background: none;
    text-align: center;
    font-size: 30px;
    line-height: 53px;
    font-family: var(--pre) !important;
}
.santa2025-wrap .section.section4 .input-area .back-effect {
    position: absolute;
    width: 30%;
}
.santa2025-wrap .section.section4 .input-area .back-effect img {
    width: 100%;
}
.santa2025-wrap .section.section4 .input-area .snowman {
    left: -7%;
    top: 42%;
}
.santa2025-wrap .section.section4 .input-area .cookie {
    top: 43%;
    left: 78%;
}
.santa2025-wrap .section.section4 .input-area .btn-down {
    z-index: 2;
    display: block;
    position: absolute;
    left: 18%;
    top: 68%;
}
.santa2025-wrap .section.section4 .input-area .btn-down.on::before {
    animation: floatGift 3s ease-out;
    transform-origin: bottom center;
}
.santa2025-wrap .section.section4 .input-area .btn-down::before {
    position: absolute;
    left: 7%;
    top: 36%;
    content: "";
    display: block;
    background: url("https://cdn.gni.kr/assets/images/event/2025/santa/bell.png") no-repeat center/contain;
    width: 85px;
    height: 94px;
}
.santa2025-wrap .section.section4 .msg-area {
    visibility: hidden;
    margin-top: 64%;
}
.santa2025-wrap .section.section4 .msg-area p,
.santa2025-wrap .section.section4 .msg-area strong {
    font-size: 35px;
    color: #1c4566;
}
.santa2025-wrap .section.section5 {
    background: url("https://cdn.gni.kr/assets/images/event/2025/santa/bg5.png") no-repeat center/cover;
    position: relative;
    z-index: 2;
}
.santa2025-wrap .section.section5 .inner::after {
    content: "";
    display: block;
    padding-top: 204%;
}
.santa2025-wrap .section.section5 .ico-click {
    position: absolute;
    top: 23%;
    left: 3%;
    background-image: url("https://cdn.gni.kr/assets/images/event/2025/santa/slide_click.png");
    width: 257px;
    height: 139px;
}
.santa2025-wrap .section.section5 .tit {
    margin-top: 8%;
}
.santa2025-wrap .section.section5 .tit p,
.santa2025-wrap .section.section5 .tit span {
    font-size: 59px;
    font-family: var(--san) !important;
}
.santa2025-wrap .section.section5 .tit .large {
    font-size: 79px;
}
.santa2025-wrap .section.section5 .tit .large span {
    font-size: 79px;
}
.santa2025-wrap .section.section5 .tit .num {
    color: #fcdb7e;
}
.santa2025-wrap .section.section5 .tit .grn {
    color: #45ff5e;
}
.santa2025-wrap .section.section5 .tit .num {
    color: #fcdb7e;
}
.santa2025-wrap .section.section5 .msg-area {
    margin-top: 2%;
}
.santa2025-wrap .section.section5 .msg-area p,
.santa2025-wrap .section.section5 .msg-area strong {
    font-size: 35px;
    color: #fff;
}
.santa2025-wrap .section.section5 .msg-area .udline::after {
    background-image: repeating-linear-gradient(90deg, #fff 0 12px, transparent 10px 20px);
}
.santa2025-wrap .section.section5 .slide-area {
    margin-left: -17%;
    margin-top: 27%;
    position: relative;
}
.santa2025-wrap .section.section5 .slide-area .slide-base {
    position: relative;
}
.santa2025-wrap .section.section5 .slide-area .bottom-slide {
    width: 557px;
    height: 253px;
    position: absolute;
    bottom: 0%;
    right: -3%;
    z-index: 2;
    pointer-events: none;
}
.santa2025-wrap .section.section5 .slide-content .swiper {
    position: absolute;
    top: -61%;
    left: 43%;
    width: 700px;
    height: 545px;
    z-index: 2;
    padding-top: 26%;
    box-sizing: content-box;
}
.santa2025-wrap .section.section5 .slide-content .swiper-controls {
    position: absolute;
    z-index: 3;
    top: 81%;
    left: 70%;
    display: flex;
    align-items: center;
}
.santa2025-wrap .section.section5 .slide-content .swiper-controls [class^=swiper-button-] {
    pointer-events: auto;
    position: static;
    margin-top: 0;
    width: 50px;
    height: 50px;
    background: url("https://cdn.gni.kr/assets/images/event/2025/santa/slide_arrow.png") no-repeat center/contain;
}
.santa2025-wrap .section.section5 .slide-content .swiper-controls [class^=swiper-button-]::after {
    display: none;
}
.santa2025-wrap .section.section5 .slide-content .swiper-controls [class^=swiper-button-].swiper-button-next {
    transform: rotate(180deg);
}
.santa2025-wrap .section.section5 .slide-content .swiper-controls .swiper-pagination {
    pointer-events: auto;
    position: static;
    color: #fff;
    font-size: 34px;
}
.santa2025-wrap .section.section5 .slide-content .swiper-controls .swiper-pagination span {
    color: #fff;
}
.santa2025-wrap .section.section5 .slide-content .gift-item {
    position: absolute;
    cursor: pointer;
}
.santa2025-wrap .section.section5 .slide-content .gift-item .item-inner {
    position: relative;
}
.santa2025-wrap .section.section5 .slide-content .gift-item .name-tag {
    width: 150px;
    text-align: center;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-weight: 700;
    color: #000;
    font-size: 17px;
    -webkit-text-stroke: 3px #fff; /* 두께, 색 지정 */
    paint-order: stroke fill;
}
.santa2025-wrap .section.section5 .slide-content .gift-item.item1 {
    bottom: 0%;
    left: 32%;
    z-index: 3;
}
.santa2025-wrap .section.section5 .slide-content .gift-item.item2 {
    bottom: 12%;
    left: 66%;
}
.santa2025-wrap .section.section5 .slide-content .gift-item.item3 {
    top: 39%;
    left: 38%;
    z-index: 2;
}
.santa2025-wrap .section.section5 .slide-content .gift-item.item4 {
    top: 46%;
    left: 13%;
    z-index: 4;
}
.santa2025-wrap .section.section5 .slide-content .gift-item.item5 {
    left: 58%;
    top: 14%;
    z-index: 1;
}
.santa2025-wrap .section.section5 .slide-content .gift-item.item6 {
    left: 18%;
    top: 27%;
    z-index: 1;
}
.santa2025-wrap .section.section5 .slide-content .gift-item.item7 {
    top: 4%;
    left: 35%;
}
.santa2025-wrap .section.section5 .slide-content .gift-item.item8 {
    left: 0%;
    top: -15%;
}
.santa2025-wrap .section.section5 .slide-content .gift-item.item9 {
    left: 53%;
    top: -29%;
}
.santa2025-wrap .section.section5 .quick-area {
    border-radius: 50px;
    overflow: hidden;
    margin-top: 5%;
    position: absolute;
    left: 57.5%;
    transform: translateX(-50%);
}
.santa2025-wrap .section.section5 .quick-area .box-santa {
    position: absolute;
    bottom: -25%;
    left: -18%;
}
.santa2025-wrap .section.section5 .quick-area .box-txt {
    position: absolute;
    top: 6%;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    color: #fff;
    font-size: 46px;
    font-family: var(--san) !important;
}
.santa2025-wrap .section.section5 .quick-area .box-txt .point {
    color: #ff4440;
    font-size: 46px;
    font-family: var(--san) !important;
}
.santa2025-wrap .section.section5 .quick-area .btn-quick {
    display: block;
    position: absolute;
    bottom: 6%;
    left: 50%;
    transform: translateX(-50%);
}
.santa2025-wrap .section.section5 .quick-area .btn-quick::before {
    position: absolute;
    left: -16%;
    top: -11%;
    content: "";
    display: block;
    background: url("https://cdn.gni.kr/assets/images/event/2025/santa/bloom.png") no-repeat center/contain;
    width: 187px;
    height: 188px;
    animation: bloom-rotate 1.5s linear infinite;
}
.santa2025-wrap .section.section6 {
    background: url("https://cdn.gni.kr/assets/images/event/2025/santa/bg6.png") no-repeat center/cover;
}
.santa2025-wrap .section.section6 .inner::after {
    content: "";
    display: block;
    padding-top: 100%;
}
.santa2025-wrap .section.section6 .tit p,
.santa2025-wrap .section.section6 .tit span {
    font-family: var(--san) !important;
    font-size: 52px;
    color: #515151;
}
.santa2025-wrap .section.section6 .tit .large {
    font-size: 70px;
}
.santa2025-wrap .section.section6 .tit .pur {
    color: #981ca9;
}
.santa2025-wrap .section.section6 .tit .blue {
    color: #18306b;
    font-size: 70px;
}
.santa2025-wrap .section.section6 .reward-list {
    margin-top: 5%;
}
.santa2025-wrap .pop {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    display: none;
}
.santa2025-wrap .pop button {
    display: block;
}
.santa2025-wrap .pop.on {
    display: block;
}
.santa2025-wrap .pop.complete .btn-close {
    width: 66px;
    height: 66px;
    position: absolute;
    top: 0;
    right: 0;
}
.santa2025-wrap .pop.letter-content .btn-close {
    position: absolute;
    right: 4%;
    top: 4%;
}
.santa2025-wrap .pop.letter-content .pop-letter {
    position: relative;
}
.santa2025-wrap .pop.letter-content .letter-txt {
    position: absolute;
    top: 35%;
    left: 50%;
    transform: translateX(-61%);
    font-size: 28px;
    line-height: 52px;
    text-align: center;
    font-weight: 600;
    width: 355px;
}
.santa2025-wrap .pop .btn-close {
    z-index: 1001;
}
.santa2025-wrap .pop .btn-ok {
    width: 269px;
    height: 125px;
    position: absolute;
    top: 47%;
    left: 46%;
}
.santa2025-wrap .pop-dim {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999;
    display: none;
}
.santa2025-wrap .pop-dim.active {
    display: block;
}

@keyframes snowfall {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(calc(100vh + 50px));
    }
}
@keyframes snowfall-sway1 {
    0%, 100% {
        transform: translateX(0);
    }
    50% {
        transform: translateX(30px);
    }
}
@keyframes snowfall-sway2 {
    0%, 100% {
        transform: translateX(0);
    }
    50% {
        transform: translateX(-30px);
    }
}
@keyframes snowfall-rotate {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
@keyframes snowfall-rotate-reverse {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(-360deg);
    }
}
@keyframes hat-sway {
    0% {
        transform: rotate(0deg);
    }
    12.5% {
        transform: rotate(4deg);
    }
    25% {
        transform: rotate(6deg);
    }
    37.5% {
        transform: rotate(4deg);
    }
    50% {
        transform: rotate(0deg);
    }
    62.5% {
        transform: rotate(-4deg);
    }
    75% {
        transform: rotate(-6deg);
    }
    87.5% {
        transform: rotate(-4deg);
    }
    100% {
        transform: rotate(0deg);
    }
}
@keyframes reveal-left-to-right {
    0% {
        -webkit-clip-path: inset(0 100% 0 0);
        clip-path: inset(0 100% 0 0);
    }
    100% {
        -webkit-clip-path: inset(0 0 0 0);
        clip-path: inset(0 0 0 0);
    }
}
@keyframes cover-swing {
    0%, 100% {
        transform: rotate(-15deg);
    }
    50% {
        transform: rotate(0deg);
    }
}
@keyframes floatGift {
    0%, 30%, 100% {
        transform: rotate(0deg);
    }
    3% {
        transform: rotate(15deg);
    }
    6% {
        transform: rotate(-15deg);
    }
    9% {
        transform: rotate(10deg);
    }
    12% {
        transform: rotate(-10deg);
    }
    15% {
        transform: rotate(10deg);
    }
    18% {
        transform: rotate(-10deg);
    }
    21% {
        transform: rotate(5deg);
    }
    24% {
        transform: rotate(-5deg);
    }
    27% {
        transform: rotate(0);
    }
}
.snow-container-section5 {
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    overflow: hidden;
}

.section5-snowflake-wrapper {
    position: absolute;
    animation: section5-snowfall linear infinite;
}

.section5-snowflake-round {
    background: white;
    border-radius: 50%;
    animation-timing-function: ease-in-out;
}

.section5-snowflake-hexagon {
    position: relative;
    background: white;
    -webkit-clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    animation-timing-function: ease-in-out;
}

@keyframes section5-snowfall {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(100vh);
    }
}
@keyframes section5-snowfall-sway1 {
    0%, 100% {
        transform: translateX(0);
    }
    25% {
        transform: translateX(15px);
    }
    75% {
        transform: translateX(-15px);
    }
}
@keyframes section5-snowfall-sway2 {
    0%, 100% {
        transform: translateX(0);
    }
    33% {
        transform: translateX(-20px);
    }
    66% {
        transform: translateX(20px);
    }
}
@keyframes section5-snowfall-rotate {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
@keyframes bloom-rotate {
    0%, 100% {
        transform: rotate(0deg);
    }
    25% {
        transform: rotate(-10deg);
    }
    50% {
        transform: rotate(0deg);
    }
    75% {
        transform: rotate(10deg);
    }
}