/* BASIC css start */
/* scrolling gently */
html,
body { overflow: hidden-x; }

/* reset css */
.stylelog__container ul,
.stylelog__container li { list-style: none; margin: 0; padding: 0; }
.stylelog__container a,
.stylelog__container span { display: block; }
.stylelog__container main,
.stylelog__container section,
.stylelog__container div { position: relative; }
.stylelog__container a { text-decoration: none; cursor: pointer; color: inherit; }
/* STYLELOG CONTAINER */
.stylelog__container {
    display: flex; flex-direction: column; justify-content: flex-start;
    width: 100%; height: 100%;
    font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
}
.stylelog__wrap,
.product__wrap { margin: 0 auto; max-width: 800px; width: 100%; }
.stylelog__wrap img { width: 100%; display: block; }

/* SWIPER */
.stylelog__wrap .swiper,
.stylelog__wrap .marquee { position: absolute; left: 0; width: 100%; overflow: hidden; }
.stylelog__wrap .swiper .swiper-slide { display: flex; justify-content: center; align-items: center; transform: translateZ(0); will-change: opacity; }
.stylelog__wrap .swiper .swiper-slide img { object-fit: cover; }
.stylelog__wrap .fadeSwiper { top: 21.51%; }
/* 전광판 효과 */
.stylelog__wrap .marquee { top: 70.71%; }
.stylelog__wrap .marquee__inner { display: flex; gap: 0; animation: marquee 20s linear infinite; width: max-content; }
.stylelog__wrap .marquee__inner .marquee__content { display: flex; gap: 0; }
.stylelog__wrap .marquee__inner img { width: 39.13%; }
@keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* 커브2 섹션 */
.stylelog__wrap .curve2 { position: relative; visibility: visible; }
.stylelog__wrap .curve2 .figure--up { position: absolute; top: 2.09%; left: 34.13%; width: 31.75%; height: 23.87%; }
.stylelog__wrap .curve2 .img--left1,
.stylelog__wrap .curve2 .img--left2,
.stylelog__wrap .curve2 .img--right1 { position: absolute; width: 66.63%; }
.stylelog__wrap .curve2 .img--left1,
.stylelog__wrap .curve2 .img--left2 { left: 0; }
.stylelog__wrap .curve2 .img--right1 { right: 0; top: 52.91%; }
.stylelog__wrap .curve2 .img--left1 { top: 35.85%; }
.stylelog__wrap .curve2 .img--left2 { top: 70%; }
.stylelog__wrap .curve2 .btn.btn--youtube { width: 75.13%; position: absolute; top: 88.9%; left: 12.5%; }

/* 커브3 섹션 */
.stylelog__wrap .curve3 .img--left1,
.stylelog__wrap .curve3 .img--left2,
.stylelog__wrap .curve3 .img--right1, 
.stylelog__wrap .curve3 .img--right2,
.stylelog__wrap .curve3 .img--right3 { position: absolute; width: 48.75%; }
.stylelog__wrap .curve3 .img--left1,
.stylelog__wrap .curve3 .img--left2 { left: 0; }
.stylelog__wrap .curve3 .img--right1, 
.stylelog__wrap .curve3 .img--right2,
.stylelog__wrap .curve3 .img--right3 { right: 0; }
.stylelog__wrap .curve3 .img--right3 { width: 72%; top: 77.76%; }
.stylelog__wrap .curve3 .img--right2 { top: 50.39%; }
.stylelog__wrap .curve3 .img--right1 { top: 24.37%; }
.stylelog__wrap .curve3 .img--left2 { top: 48.73%; }
.stylelog__wrap .curve3 .img--left1 { top: 23.02%; }

/* 유의사항 */
.notice__wrap .notice__btn { position: relative; cursor: pointer; }
.notice__wrap .notice__btn img { margin-top: 0; }
.notice__wrap .notice__content {
    overflow: hidden;
    height: 0;
    transition: height 0.2s linear;
    z-index: -99;
}
.notice__wrap .notice__content.active { height: 100%; }



/* BASIC css end */