/* main.css - 모바일 카드 슬라이드 스와이프 적용 (메인 페이지) */
.main-v-1-0-250812,
.main-v-1-0-250812 * {
    box-sizing: border-box;
}

.main-v-1-0-250812 {
    background: var(--fff, #ffffff);
    display: flex;
    flex-direction: column;
    gap: 0px;
    align-items: center;
    justify-content: flex-start;
    position: relative;
    overflow: hidden;
}

.mainbanner {
    display: flex;
    flex-direction: row;
    gap: 0px;
    align-items: flex-start;
    justify-content: flex-start;
    flex-shrink: 0;
    width: 100%;
    max-width: 1920px;
    height: 960px;
    position: relative;
    overflow: hidden;
    margin: 0 auto;
    z-index: 1;
}

.slider-controls {
    display: flex;
    flex-direction: row;
    gap: 12px;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: 150px;
    left: 50%;
    transform: translateX(-50%);
    right: auto;
    z-index: 10;
    pointer-events: none;
    width: auto;
    max-width: calc(100% - 40px);
}

.slider-btn {
    padding: 10px 24px;
    border-radius: 50px;
    border: 1px solid #ffffff;
    background: transparent;
    color: #ffffff;
    font-family: var(--font-family-suit);
    font-weight: 600;
    font-size: 15px;
    line-height: 1.5;
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap;
    outline: none;
    position: relative;
    pointer-events: auto;
}

.slider-btn.active {
    background: #ffffff;
    color: #000000;
    border: 1px solid #ffffff;
}

.slider-btn:not(.active):hover {
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
}

.mainbanner-01,
.mainbanner-02,
.mainbanner-03 {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    overflow: hidden;
    opacity: 0;
    transition: opacity 1s ease-in-out;
}

.mainbanner-01.active,
.mainbanner-02.active,
.mainbanner-03.active {
    opacity: 1;
    z-index: 1;
}

.mainbanner-01 video,
.mainbanner-02 video,
.mainbanner-03 video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    perspective: 1000px;
    -webkit-perspective: 1000px;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}

.mainbanner-01 video,
.mainbanner-02 video,
.mainbanner-03 video {
    preload: auto;
}

.mainbanner-01 video.ready,
.mainbanner-02 video.ready,
.mainbanner-03 video.ready {
    opacity: 1;
}

.mainbanner-01 video.canplay,
.mainbanner-02 video.canplay,
.mainbanner-03 video.canplay {
    opacity: 1;
}

.mainbanner-01 .banner-text,
.mainbanner-02 .banner-text,
.mainbanner-03 .banner-text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    padding-top: 100px;
    pointer-events: none;
}

.mainbanner-01 .banner-text-content,
.mainbanner-02 .banner-text-content,
.mainbanner-03 .banner-text-content {
    color: #ffffff;
    text-align: center;
    font-family: var(--font-family-suit);
    font-weight: 600;
    font-size: 48px;
    line-height: 1.5;
    font-weight: 600;
    position: relative;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s ease 0.2s, transform 0.8s ease 0.2s;
    max-width: 90%;
    word-break: keep-all;
}

.mainbanner-01.active .banner-text-content,
.mainbanner-02.active .banner-text-content,
.mainbanner-03.active .banner-text-content {
    opacity: 1;
    transform: translateY(0);
}

.mainbanner-03 .banner-text-content {
    font-size: 56px;
    line-height: 1.6;
    letter-spacing: 2px;
}

.mainbanner-01 .p,
.mainbanner-02 .p,
.mainbanner-03 .p {
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: flex-start;
    justify-content: flex-start;
    position: absolute;
    left: 240px;
    top: 640px;
    z-index: 2;
}

.mainbanner-02 .vision,
.mainbanner-03 .brewzen2 {
    color: var(--fff, #ffffff);
    text-align: left;
    font-family: var(--title-48-font-family);
    font-weight: var(--font-weight-extrabold);
    font-size: 80px;
    line-height: 80px;
    font-weight: 800;
    position: relative;
}

.mainbanner-02 .div,
.mainbanner-03 .div {
    color: var(--fff, #ffffff);
    text-align: left;
    font-family: var(--p-20-r-font-family, "Suit-Regular", sans-serif);
    font-size: var(--p-20-r-font-size, 20px);
    line-height: var(--p-20-r-line-height, 30px);
    font-weight: var(--p-20-r-font-weight, 400);
    position: relative;
}

.mainbanner-02 .txt,
.mainbanner-03 .txt {
    border-style: solid;
    border-color: rgba(255, 255, 255, 0.2);
    border-width: 0px 0px 0px 1px;
    display: flex;
    flex-direction: column;
    gap: 0px;
    align-items: flex-start;
    justify-content: center;
    width: 460px;
    height: 1080px;
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 2;
}

.mainbanner-02 .p2,
.mainbanner-03 .p2 {
    border-style: solid;
    border-color: rgba(255, 255, 255, 0.2);
    border-width: 0px 0px 1px 0px;
    padding: 60px 0px 0px 60px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: flex-start;
    justify-content: flex-start;
    align-self: stretch;
    flex-shrink: 0;
    height: 360px;
    position: relative;
}

.mainbanner-02 .p3 {
    background: rgba(0, 0, 0, 0.2);
    border-style: solid;
    border-color: rgba(255, 255, 255, 0.2);
    border-width: 0px 0px 1px 0px;
    padding: 60px 0px 0px 60px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: flex-start;
    justify-content: flex-start;
    align-self: stretch;
    flex-shrink: 0;
    height: 360px;
    position: relative;
    backdrop-filter: blur(10px);
}

.mainbanner-02 .p4,
.mainbanner-03 .p5 {
    padding: 60px 0px 0px 60px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: flex-start;
    justify-content: flex-start;
    align-self: stretch;
    flex-shrink: 0;
    height: 360px;
    position: relative;
}

.mainbanner-03 .p5 {
    background: rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(10px);
}

.mainbanner-02 ._01,
.mainbanner-02 ._02,
.mainbanner-02 ._03,
.mainbanner-03 ._01,
.mainbanner-03 ._022,
.mainbanner-03 ._032 {
    color: var(--fff, #ffffff);
    text-align: left;
    font-family: var(--p-18-r-font-family, "Suit-Regular", sans-serif);
    font-size: var(--p-18-r-font-size, 18px);
    line-height: var(--p-18-r-line-height, 26px);
    font-weight: var(--p-18-r-font-weight, 400);
    opacity: 0.5;
    position: relative;
}

.mainbanner-02 ._02,
.mainbanner-03 ._032 {
    color: var(--main, #8dc63f);
    opacity: 1;
}

.mainbanner-02 .mission,
.mainbanner-02 .vision2,
.mainbanner-02 .brewzen,
.mainbanner-03 .mission,
.mainbanner-03 .vision3,
.mainbanner-03 .brewzen3 {
    color: var(--fff, #ffffff);
    text-align: left;
    font-family: var(--title-32-font-family, "Suit-Bold", sans-serif);
    font-size: var(--title-32-font-size, 32px);
    line-height: var(--title-32-line-height, 40px);
    font-weight: var(--title-32-font-weight, 700);
    opacity: 0.5;
    position: relative;
}

.mainbanner-02 .vision2,
.mainbanner-03 .brewzen3 {
    color: var(--main, #8dc63f);
    opacity: 1;
}

.main-v-1-0-250812 .section-01 {
    padding: 160px 0px 160px 0px;
    display: flex;
    flex-direction: column;
    gap: 80px;
    align-items: center;
    justify-content: flex-start;
    flex-shrink: 0;
    width: 100%;
    position: relative;
}

.main-v-1-0-250812 .section-01 .technology {
    color: var(--000, #000000);
    text-align: left;
    font-family: var(--font-family-suit);
    font-weight: 700;
    font-size: 64px;
    line-height: 64px;
    font-weight: 700;
    position: relative;
    width: 100%;
    max-width: 1440px;
    padding: 0 240px;
    box-sizing: border-box;
    align-self: flex-start;
}

.main-v-1-0-250812 .section-01 .main-tech-slider-wrap {
    position: relative;
    width: 100%;
    max-width: 1440px;
    padding: 0 240px;
    box-sizing: border-box;
    align-self: flex-start;
}

.main-v-1-0-250812 .section-01 .main-tech-nav {
    display: none;
}

.main-v-1-0-250812 .section-01 .box-wrap {
    display: flex;
    flex-direction: row;
    gap: 24px;
    align-items: center;
    justify-content: flex-start;
    flex-shrink: 0;
    position: relative;
    width: 100%;
    max-width: 100%;
    padding: 0;
    box-sizing: border-box;
    align-self: flex-start;
}

.main-v-1-0-250812 .section-01 .box-01,
.main-v-1-0-250812 .section-01 .box-02,
.main-v-1-0-250812 .section-01 .box-03 {
    border-radius: 16px;
    flex-shrink: 0;
    width: 448px;
    height: 500px;
    position: relative;
    overflow: hidden;
    transition: width 0.5s ease, border-radius 0.5s ease;
    cursor: pointer;
    text-decoration: none;
    display: block;
    color: inherit;
}

.main-v-1-0-250812 .section-01 .box-wrap:has(.box-01:hover) .box-02,
.main-v-1-0-250812 .section-01 .box-wrap:has(.box-01:hover) .box-03,
.main-v-1-0-250812 .section-01 .box-wrap:has(.box-02:hover) .box-01,
.main-v-1-0-250812 .section-01 .box-wrap:has(.box-02:hover) .box-03,
.main-v-1-0-250812 .section-01 .box-wrap:has(.box-03:hover) .box-01,
.main-v-1-0-250812 .section-01 .box-wrap:has(.box-03:hover) .box-02 {
    width: 342px;
}

.main-v-1-0-250812 .section-01 .box-01 {
    background: var(--main, #8dc63f);
}

.main-v-1-0-250812 .section-01 .box-02 {
    background: var(--point-01, #f5821f);
}

.main-v-1-0-250812 .section-01 .box-03 {
    background: var(--point-02, #00aeef);
}

.main-v-1-0-250812 .section-01 .box-01:hover,
.main-v-1-0-250812 .section-01 .box-02:hover,
.main-v-1-0-250812 .section-01 .box-03:hover {
    width: 708px;
    border-radius: 32px;
}

/* ★ 클릭 힌트 로직 수정 시작 (기존 layout 코드 대체) ★ */
.main-v-1-0-250812 .section-01 .click-hint,
.main-v-1-0-250812 .section-02 .click-hint,
.main-v-1-0-250812 .section-03 .click-hint {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 140px;
    height: 140px;
    transform: translate(-50%, -50%);
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
}

.main-v-1-0-250812 .section-01 .box-01:hover .click-hint,
.main-v-1-0-250812 .section-01 .box-02:hover .click-hint,
.main-v-1-0-250812 .section-01 .box-03:hover .click-hint,
.main-v-1-0-250812 .section-02 .box:hover .click-hint,
.main-v-1-0-250812 .section-02 .box2:hover .click-hint,
.main-v-1-0-250812 .section-03 .box:hover .click-hint {
    opacity: 1;
}

.main-v-1-0-250812 .click-text-ring {
    position: absolute;
    width: 100%;
    height: 100%;
    animation: click-ring-rotate 8s linear infinite;
}

@keyframes click-ring-rotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.main-v-1-0-250812 .click-ring-svg {
    width: 100%;
    height: 100%;
    overflow: visible;
}

.main-v-1-0-250812 .click-ring-svg text {
    fill: #ffffff;
    font-family: var(--font-family-suit), sans-serif;
    font-weight: 500;
    font-size: 14px;
    letter-spacing: 0.12em;
}

.main-v-1-0-250812 .click-dot {
    position: relative;
    width: 14px;
    height: 14px;
    background: #8dc63f;
    border-radius: 50%;
    box-shadow: 0 0 15px rgba(141, 198, 63, 1), 0 0 30px rgba(141, 198, 63, 0.6);
    z-index: 11;
}
/* ★ 클릭 힌트 로직 수정 끝 ★ */

.main-v-1-0-250812 .section-01 a.box-01:hover,
.main-v-1-0-250812 .section-01 a.box-02:hover,
.main-v-1-0-250812 .section-01 a.box-03:hover,
.main-v-1-0-250812 .section-03 a.box:hover {
    opacity: 1;
}

.main-v-1-0-250812 .section-01 .box-01:hover {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 1) 100%), url('../img/main/main_tech1.jpg') center, #0d0d0d;
    background-size: cover;
    background-repeat: no-repeat;
}

.main-v-1-0-250812 .section-01 .box-02:hover {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 1) 100%), url('../img/main/main_tech2.jpg') center, #0d0d0d;
    background-size: cover;
    background-repeat: no-repeat;
}

.main-v-1-0-250812 .section-01 .box-03:hover {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 1) 100%), url('../img/main/main_tech3.png') center, #0d0d0d;
    background-size: cover;
    background-repeat: no-repeat;
}

.main-v-1-0-250812 .section-01 .txt {
    padding: 0px 48px 60px 48px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: flex-start;
    justify-content: flex-start;
    width: 448px;
    position: absolute;
    left: 0px;
    bottom: 0px;
    z-index: 2;
    opacity: 1;
    transition: opacity 0.3s ease, width 0.5s ease;
}

.main-v-1-0-250812 .section-01 .box-wrap:has(.box-01:hover) .box-02 .txt,
.main-v-1-0-250812 .section-01 .box-wrap:has(.box-01:hover) .box-03 .txt,
.main-v-1-0-250812 .section-01 .box-wrap:has(.box-02:hover) .box-01 .txt,
.main-v-1-0-250812 .section-01 .box-wrap:has(.box-02:hover) .box-03 .txt,
.main-v-1-0-250812 .section-01 .box-wrap:has(.box-03:hover) .box-01 .txt,
.main-v-1-0-250812 .section-01 .box-wrap:has(.box-03:hover) .box-02 .txt {
    width: 342px;
    padding: 0px 24px 60px 24px;
}

.main-v-1-0-250812 .section-01 .txt-expanded {
    padding: 0px 48px 60px 48px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: flex-start;
    justify-content: flex-start;
    width: 708px;
    position: absolute;
    left: 0px;
    bottom: 0px;
    z-index: 2;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.main-v-1-0-250812 .section-01 .txt-expanded .div {
    color: var(--fff, #ffffff);
    text-align: left;
    font-family: var(--title-32-font-family, "Suit-Bold", sans-serif);
    font-size: var(--title-32-font-size, 32px);
    line-height: var(--title-32-line-height, 40px);
    font-weight: var(--title-32-font-weight, 700);
    position: relative;
    margin-bottom: 0;
}

.main-v-1-0-250812 .section-01 .txt-expanded .union,
.main-v-1-0-250812 .section-01 .txt-expanded .union2,
.main-v-1-0-250812 .section-01 .txt-expanded .union3 {
    filter: brightness(0) invert(1);
    opacity: 1;
}

.main-v-1-0-250812 .section-01 .box-01:hover .txt,
.main-v-1-0-250812 .section-01 .box-02:hover .txt,
.main-v-1-0-250812 .section-01 .box-03:hover .txt {
    opacity: 0;
    pointer-events: none;
}

.main-v-1-0-250812 .section-01 .box-01:hover .txt-expanded,
.main-v-1-0-250812 .section-01 .box-02:hover .txt-expanded,
.main-v-1-0-250812 .section-01 .box-03:hover .txt-expanded {
    opacity: 1;
    pointer-events: auto;
}

.main-v-1-0-250812 .section-01 .txt-expanded .union,
.main-v-1-0-250812 .section-01 .txt-expanded .union2,
.main-v-1-0-250812 .section-01 .txt-expanded .union3 {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.4s ease 0.1s, transform 0.4s ease 0.1s;
}

.main-v-1-0-250812 .section-01 .txt-expanded .p {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.4s ease 0.2s, transform 0.4s ease 0.2s;
}

.main-v-1-0-250812 .section-01 .txt-expanded .div3 {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.4s ease 0.3s, transform 0.4s ease 0.3s;
}

.main-v-1-0-250812 .section-01 .box-01:hover .txt-expanded .union,
.main-v-1-0-250812 .section-01 .box-02:hover .txt-expanded .union2,
.main-v-1-0-250812 .section-01 .box-03:hover .txt-expanded .union3,
.main-v-1-0-250812 .section-01 .box-01:hover .txt-expanded .p,
.main-v-1-0-250812 .section-01 .box-02:hover .txt-expanded .p,
.main-v-1-0-250812 .section-01 .box-03:hover .txt-expanded .p,
.main-v-1-0-250812 .section-01 .box-01:hover .txt-expanded .div3,
.main-v-1-0-250812 .section-01 .box-02:hover .txt-expanded .div3,
.main-v-1-0-250812 .section-01 .box-03:hover .txt-expanded .div3 {
    opacity: 1;
    transform: translateY(0);
}

.main-v-1-0-250812 .section-01 .txt-expanded .btn-01 {
    transition: transform 0.3s ease;
}

.main-v-1-0-250812 .section-01 .txt-expanded .btn-01:hover {
    transform: translateX(4px);
}

.main-v-1-0-250812 .section-01 .txt-expanded .btn-01:hover .div2 {
    transform: translateX(4px);
}

.main-v-1-0-250812 .section-01 .txt-expanded .btn-01:hover .more-view {
    color: var(--main, #8dc63f);
}

.main-v-1-0-250812 .section-01 .txt2 {
    padding: 0px 48px 60px 48px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: flex-start;
    justify-content: flex-start;
    width: 342px;
    position: absolute;
    left: 0px;
    bottom: 0px;
}

.main-v-1-0-250812 .section-01 .union {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    position: relative;
    overflow: visible;
}

.main-v-1-0-250812 .section-01 .union2 {
    flex-shrink: 0;
    width: 42px;
    height: 60px;
    position: relative;
    overflow: visible;
}

.main-v-1-0-250812 .section-01 .union3 {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    position: relative;
    overflow: visible;
}

.main-v-1-0-250812 .section-01 .p {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    align-self: stretch;
    flex-shrink: 0;
    position: relative;
}

.main-v-1-0-250812 .section-01 .div {
    color: var(--fff, #ffffff);
    text-align: left;
    font-family: var(--title-32-font-family, "Suit-Bold", sans-serif);
    font-size: var(--title-32-font-size, 32px);
    line-height: var(--title-32-line-height, 40px);
    font-weight: var(--title-32-font-weight, 700);
    position: relative;
}

.main-v-1-0-250812 .section-01 .btn-01 {
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: center;
    justify-content: flex-start;
    flex-shrink: 0;
    position: relative;
    text-decoration: none;
    transition: all 0.3s ease;
    padding: 8px 0;
}

.main-v-1-0-250812 .section-01 .div2 {
    flex-shrink: 0;
    width: 14px;
    height: 4px;
    position: relative;
    overflow: visible;
    transition: transform 0.3s ease;
}

.main-v-1-0-250812 .section-01 .txt .div3 {
    color: var(--gray-02, #dfdfdf);
    text-align: left;
    font-family: var(--p-18-r-font-family, "Suit-Regular", sans-serif);
    font-size: var(--p-18-r-font-size, 18px);
    line-height: var(--p-18-r-line-height, 26px);
    font-weight: var(--p-18-r-font-weight, 400);
    position: relative;
}

.main-v-1-0-250812 .section-01 .txt-expanded .div3 {
    color: var(--fff, #ffffff);
    text-align: left;
    font-family: var(--p-18-r-font-family, "Suit-Regular", sans-serif);
    font-size: var(--p-18-r-font-size, 18px);
    line-height: var(--p-18-r-line-height, 26px);
    font-weight: var(--p-18-r-font-weight, 400);
    position: relative;
    opacity: 0.9;
}

.main-v-1-0-250812 .section-01 .more-view {
    color: var(--main, #8dc63f);
    text-align: left;
    font-family: var(--p-14-m-font-family, "Suit-Medium", sans-serif);
    font-size: var(--p-14-m-font-size, 14px);
    line-height: var(--p-14-m-line-height, 20px);
    font-weight: var(--p-14-m-font-weight, 500);
    position: relative;
    transition: color 0.3s ease;
}

.main-v-1-0-250812 .section-01 .hpp {
    color: var(--fff, #ffffff);
    text-align: left;
    font-family: var(--title-32-font-family, "Suit-Bold", sans-serif);
    font-size: var(--title-32-font-size, 32px);
    line-height: var(--title-32-line-height, 40px);
    font-weight: var(--title-32-font-weight, 700);
    position: relative;
}

.main-v-1-0-250812 .section-01 .union5,
.main-v-1-0-250812 .section-01 .union6,
.main-v-1-0-250812 .section-01 .union7 {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    position: relative;
    overflow: visible;
}

.main-v-1-0-250812 .section-01 .union6 {
    width: 42px;
}

.main-v-1-0-250812 .section-01 .hpp {
    color: var(--fff, #ffffff);
    text-align: left;
    font-family: var(--title-32-font-family, "Suit-Bold", sans-serif);
    font-size: var(--title-32-font-size, 32px);
    line-height: var(--title-32-line-height, 40px);
    font-weight: var(--title-32-font-weight, 700);
    position: relative;
}

.main-v-1-0-250812 .section-01 .txt-expanded .hpp {
    color: var(--fff, #ffffff);
    text-align: left;
    font-family: var(--title-32-font-family, "Suit-Bold", sans-serif);
    font-size: var(--title-32-font-size, 32px);
    line-height: var(--title-32-line-height, 40px);
    font-weight: var(--title-32-font-weight, 700);
    position: relative;
}

/* section-02 Manufacturing */
.main-v-1-0-250812 .section-02 {
    background: url('../img/main/manufacturing_bg.png') center;
    background-size: cover;
    background-repeat: no-repeat;
    align-self: stretch;
    flex-shrink: 0;
    height: 1080px;
    position: relative;
    width: 100%;
    box-sizing: border-box;
}

.main-v-1-0-250812 .section-02 .box-wrap {
    display: flex;
    flex-direction: row;
    gap: 0px;
    align-items: center;
    justify-content: flex-start;
    position: absolute;
    left: 240px;
    top: 0px;
}

.main-v-1-0-250812 .section-02 .box,
.main-v-1-0-250812 .section-02 .box2 {
    border-style: solid;
    border-color: rgba(255, 255, 255, 0.2);
    border-width: 0px 1px 0px 0px;
    padding: 200px 0px 0px 0px;
    display: flex;
    flex-direction: column;
    gap: 48px;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 480px;
    height: 1080px;
    position: relative;
}

.main-v-1-0-250812 .section-02 .box {
    border-width: 0px 1px 0px 1px;
}

.main-v-1-0-250812 .section-02 .union8,
.main-v-1-0-250812 .section-02 .union9,
.main-v-1-0-250812 .section-02 .union10 {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    position: relative;
    overflow: visible;
    object-fit: contain;
}

.main-v-1-0-250812 .section-02 .union10 {
    width: 64px;
    height: 80px;
}

.main-v-1-0-250812 .section-02 .p6 {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
    justify-content: flex-start;
    flex-shrink: 0;
    position: relative;
}

.main-v-1-0-250812 .section-02 .div4 {
    color: var(--fff, #ffffff);
    text-align: center;
    font-family: var(--title-32-font-family, "Suit-Bold", sans-serif);
    font-size: 32px;
    line-height: 40px;
    font-weight: var(--title-32-font-weight, 700);
    position: relative;
}

.main-v-1-0-250812 .section-02 ._24-capacity-1-000-kg-hr,
.main-v-1-0-250812 .section-02 ._20-brix-1-30,
.main-v-1-0-250812 .section-02 .hpp-uht {
    color: var(--fff, #ffffff);
    text-align: center;
    font-family: var(--p-18-r-font-family, "Suit-Regular", sans-serif);
    font-size: 18px;
    line-height: 26px;
    font-weight: var(--p-18-r-font-weight, 400);
    position: relative;
}

.main-v-1-0-250812 .section-02 .p2 {
    padding: 0px 24px 0px 24px;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    width: 1440px;
    position: absolute;
    left: 240px;
    top: 200px;
}

.main-v-1-0-250812 .section-02 .manufacturing {
    color: var(--fff, #ffffff);
    text-align: left;
    font-family: var(--font-family-suit);
    font-weight: 700;
    font-size: 64px;
    line-height: 64px;
    position: relative;
}

.main-v-1-0-250812 .section-02 ._24-20-brix-900-1-800 {
    color: var(--fff, #ffffff);
    text-align: left;
    font-family: var(--p-20-r-font-family, "Suit-Regular", sans-serif);
    font-size: 20px;
    line-height: 30px;
    font-weight: var(--p-20-r-font-weight, 400);
    position: relative;
}

.main-v-1-0-250812 .section-03 {
    background: var(--sub, #f4faec);
    padding: 160px 0px 160px 0px;
    display: flex;
    flex-direction: row;
    gap: 48px;
    align-items: flex-start;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
}

.main-v-1-0-250812 .section-03 .box {
    border-radius: 32px;
    padding: 48px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    flex-shrink: 0;
    width: 448px;
    height: 500px;
    position: relative;
    overflow: hidden;
    transition: transform 0.3s ease, filter 0.3s ease;
    cursor: pointer;
    text-decoration: none;
    color: inherit;
    background-color: #0d0d0d;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.main-v-1-0-250812 .section-03 .box.box-card1 { background-image: url('../img/main/card1.png'); }
.main-v-1-0-250812 .section-03 .box.box-card2 { background-image: url('../img/main/card2.png'); }
.main-v-1-0-250812 .section-03 .box.box-card3 { background-image: url('../img/main/card3.png'); }

.main-v-1-0-250812 .section-03 .box::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: transparent;
    transition: background 0.3s ease;
    z-index: 1;
    pointer-events: none;
}

.main-v-1-0-250812 .section-03 .box:hover::before {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 1) 100%);
}

.main-v-1-0-250812 .section-03 .box > * { position: relative; z-index: 2; }

.main-v-1-0-250812 .section-03 .ham-menu-li {
    opacity: 1;
    display: flex;
    flex-direction: row;
    gap: 10px;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
}

.main-v-1-0-250812 .section-03 .menu-li {
    color: var(--fff, #ffffff);
    text-align: left;
    font-family: var(--title-32-font-family, "Suit-Bold", sans-serif);
    font-size: var(--title-32-font-size, 32px);
    line-height: var(--title-32-line-height, 40px);
    font-weight: var(--title-32-font-weight, 700);
    position: relative;
}

.main-v-1-0-250812 .section-03 .btn-01 {
    opacity: 1;
    display: flex;
    flex-direction: row;
    gap: 8px;
    align-items: center;
    justify-content: flex-start;
    flex-shrink: 0;
    position: relative;
    text-decoration: none;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.main-v-1-0-250812 .section-03 .more-view {
    color: var(--fff, #ffffff);
    text-align: left;
    font-family: var(--p-14-m-font-family, "Suit-Medium", sans-serif);
    font-size: var(--p-14-m-font-size, 14px);
    line-height: var(--p-14-m-line-height, 20px);
    font-weight: var(--p-14-m-font-weight, 500);
    position: relative;
    transition: color 0.3s ease;
}

.main-v-1-0-250812 .section-03 .box:hover .more-view { color: var(--main, #8dc63f); }

.main-v-1-0-250812 .section-03 .btn-arrow {
    flex-shrink: 0;
    width: 14px;
    height: 4px;
    color: var(--fff, #ffffff);
    transition: color 0.3s ease;
}

.main-v-1-0-250812 .section-03 .box:hover .btn-arrow { color: var(--main, #8dc63f); }

.main-v-1-0-250812 .section-03 .logo {
    opacity: 0.1;
    flex-shrink: 0;
    width: 29.44%;
    height: 17.07%;
    position: absolute;
    right: 0; left: auto; bottom: 71.34%; top: 11.59%;
    transform: translate(0, 0);
    overflow: visible;
}

.main-v-1-0-250812 .section-03 .main-cards-slider-wrap {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: center;
    position: relative;
    flex-shrink: 0;
}

.main-v-1-0-250812 .section-03 .main-cards-slider {
    display: flex;
    flex-direction: row;
    gap: 48px;
    align-items: flex-start;
    justify-content: center;
    flex-shrink: 0;
}

/* section-04 News */
.main-v-1-0-250812 .section-04 {
    padding: 160px 0px 160px 0px;
    display: flex;
    flex-direction: column;
    gap: 80px;
    align-items: center;
    justify-content: flex-start;
    flex-shrink: 0;
    width: 100%;
    position: relative;
}

/* PC: 슬라이더 버튼 숨김 (모바일 전용 요소) */
.main-v-1-0-250812 .section-03 .main-slider-nav,
.main-v-1-0-250812 .section-04 .main-news-nav {
    display: none !important;
}

/* PC: 카드 슬라이더 버튼 (section-01만 표시) */
.main-v-1-0-250812 .section-01 .main-tech-nav {
    gap: 12px;
    align-items: center;
    margin-top: 20px;
}
.main-v-1-0-250812 .section-01 .main-tech-nav .main-slider-nav-btn {
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    border-radius: 50%;
    background: #e5e5e5;
    color: #555;
    border: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    line-height: 1;
    padding: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}
.main-v-1-0-250812 .section-01 .main-tech-nav .main-slider-nav-btn:hover {
    background: #d8d8d8;
    color: #333;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
}
.main-v-1-0-250812 .section-01 .main-tech-nav .main-slider-nav-btn span {
    display: block;
    font-weight: 600;
    line-height: 1;
}

.main-v-1-0-250812 .section-04 .p {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: flex-start;
    width: 100%;
    max-width: 1440px;
    padding: 0 240px;
    box-sizing: border-box;
    align-self: stretch;
    flex-shrink: 0;
    position: relative;
}

.main-v-1-0-250812 .section-04 .nextbio-news {
    color: var(--000, #000000);
    text-align: left;
    font-family: var(--font-family-suit);
    font-weight: 700;
    font-size: 64px;
    line-height: 64px;
    position: relative;
    flex-shrink: 0;
}

.main-v-1-0-250812 .section-04 .btn-01 {
    display: flex;
    flex-direction: row;
    gap: 0;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    text-decoration: none;
    padding: 10px 32px;
    border-radius: 50px;
    border: 1px solid #e0e0e0;
    background: #f5f5f5;
    transition: all 0.3s ease;
}

.main-v-1-0-250812 .section-04 .txt-wrap {
    display: flex;
    flex-direction: row;
    gap: 24px;
    align-items: flex-start;
    justify-content: flex-start;
    flex-shrink: 0;
    position: relative;
    width: 100%;
    max-width: 1440px;
    padding: 0 240px;
    box-sizing: border-box;
    align-self: flex-start;
}

.main-v-1-0-250812 .section-04 .main-news-slider-wrap {
    width: 100%;
    max-width: 1440px;
    padding: 0 240px;
    box-sizing: border-box;
    position: relative;
}

.main-v-1-0-250812 .section-04 .main-news-slider-wrap .txt-wrap {
    padding: 0;
    justify-content: center;
}

.main-v-1-0-250812 .section-04 .news-item {
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    width: 448px;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    transition: box-shadow 0.3s ease, border-color 0.3s ease;
    cursor: pointer;
    height: 450px;
    text-decoration: none;
    color: inherit;
}

.main-v-1-0-250812 .section-04 .news-item:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    border-color: #d0d0d0;
}

.main-v-1-0-250812 .section-04 .news-image {
    width: 100%;
    height: 300px;
    background: #e0e0e0;
    background-size: cover;
    background-position: center;
    border-radius: 12px 12px 0 0;
}

.main-v-1-0-250812 .section-04 .news-content {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
    flex: 1;
}

.main-v-1-0-250812 .section-04 .news-title {
    color: var(--000, #000000);
    font-family: var(--p-24-font-family, "Suit-Bold", sans-serif);
    font-size: 24px;
    line-height: 32px;
    font-weight: 700;
}

.main-v-1-0-250812 .section-04 .news-date {
    color: #808284;
    font-size: 14px;
    margin-top: 8px;
}

/* section-05 Partners */
.main-v-1-0-250812 .section-05 {
    background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.7) 100%), url('../img/main/main_partners.png') center;
    background-size: cover;
    padding: 160px 0px 200px 0px;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.main-v-1-0-250812 .section-05-content {
    display: flex;
    flex-direction: column;
    gap: 80px;
    align-items: center;
    width: 100%;
    max-width: 1440px;
    padding: 0 240px;
    box-sizing: border-box;
}

.main-v-1-0-250812 .section-05-content .div12 {
    color: #000;
    font-size: 40px;
    line-height: 52px;
    font-weight: 800;
    text-align: center;
}

.main-v-1-0-250812 .section-05-content .logo-slider-wrapper {
    width: 100vw;
    overflow: hidden;
    margin: 0 -240px;
}

.main-v-1-0-250812 .section-05-content .logo-slider-track {
    display: flex;
    gap: 24px;
    animation: logo-slide 50s linear infinite;
    width: max-content;
}

.main-v-1-0-250812 .section-05-content .logo-slide-item {
    flex-shrink: 0;
    width: 220px;
    height: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.main-v-1-0-250812 .section-05-content .logo-slide-item img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

@keyframes logo-slide {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* ★ 하단 Media Queries 원본 유지 ★ */
@media (max-width: 1440px) {
    .main-v-1-0-250812 .section-01 .technology, .main-v-1-0-250812 .section-01 .box-wrap { padding: 0 120px; }
    .main-v-1-0-250812 .section-04 .p { padding: 0 120px; }
    .main-v-1-0-250812 .section-04 .main-news-slider-wrap { padding: 0 120px; }
    .main-v-1-0-250812 .section-05-content { padding: 0 120px; }
    .main-v-1-0-250812 .section-05-content .logo-slider-wrapper { margin: 0 -120px; }
}

/* 태블릿: 뉴스 섹션 기준 왼쪽 40px, 카드 슬라이드·스와이프·버튼·글씨 크기 통일 */
@media (max-width: 1024px) {
    .mainbanner { height: auto; padding-bottom: 75%; }
    .slider-controls { bottom: 80px; left: 50%; transform: translateX(-50%); right: auto; }
    .slider-btn { padding: 8px 20px; font-size: 14px; }
    .mainbanner-01 .banner-text-content,
    .mainbanner-02 .banner-text-content { font-size: 36px; line-height: 1.5; }
    .mainbanner-03 .banner-text-content { font-size: 40px; line-height: 1.5; letter-spacing: 1px; }
    .mainbanner-02 .vision, .mainbanner-03 .brewzen2 { font-size: 48px; line-height: 56px; }
    .mainbanner-02 .div, .mainbanner-03 .div { font-size: 18px; line-height: 28px; }
    .mainbanner-02 .mission, .mainbanner-02 .vision2, .mainbanner-02 .brewzen,
    .mainbanner-03 .mission, .mainbanner-03 .vision3, .mainbanner-03 .brewzen3 { font-size: 28px; line-height: 36px; }
    .main-v-1-0-250812 .section-01 .technology,
    .main-v-1-0-250812 .section-02 .manufacturing,
    .main-v-1-0-250812 .section-04 .nextbio-news { font-size: 38px; line-height: 46px; }
    .main-v-1-0-250812 .section-05-content .div12 { font-size: 32px; line-height: 42px; }
    .main-v-1-0-250812 .section-04 .main-news-nav { display: flex !important; }
    
    /* 태블릿: 슬라이더 버튼 크기·여백 (모바일 전용) */
    .main-v-1-0-250812 .section-01 .main-tech-nav,
    .main-v-1-0-250812 .section-03 .main-slider-nav,
    .main-v-1-0-250812 .section-04 .main-news-nav {
        gap: 10px; margin-top: 24px;
    }
    .main-v-1-0-250812 .section-01 .main-tech-nav .main-slider-nav-btn,
    .main-v-1-0-250812 .section-03 .main-slider-nav .main-slider-nav-btn,
    .main-v-1-0-250812 .section-04 .main-news-nav .main-slider-nav-btn {
        width: 34px; height: 34px; min-width: 34px; min-height: 34px;
        border-radius: 50%; background: #e5e5e5; color: #555; border: none; cursor: pointer;
        display: inline-flex; align-items: center; justify-content: center;
        font-size: 16px; line-height: 1; padding: 0;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
        transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
    }
    .main-v-1-0-250812 .section-01 .main-tech-nav .main-slider-nav-btn:hover,
    .main-v-1-0-250812 .section-03 .main-slider-nav .main-slider-nav-btn:hover,
    .main-v-1-0-250812 .section-04 .main-news-nav .main-slider-nav-btn:hover {
        background: #d8d8d8; color: #333; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
    }
    .main-v-1-0-250812 .section-01 .main-tech-nav .main-slider-nav-btn span,
    .main-v-1-0-250812 .section-03 .main-slider-nav .main-slider-nav-btn span,
    .main-v-1-0-250812 .section-04 .main-news-nav .main-slider-nav-btn span {
        display: block; font-weight: 600; line-height: 1;
    }
    
    /* section-01 Technology: 슬라이드 + 버튼 */
    .main-v-1-0-250812 .section-01 { padding: 80px 0; }
    .main-v-1-0-250812 .section-01 .technology { padding: 0 40px; }
    .main-v-1-0-250812 .section-01 .main-tech-slider-wrap { padding: 0 0 56px 40px; overflow: hidden; }
    .main-v-1-0-250812 .section-01 .main-tech-nav { display: flex !important; position: absolute; left: 40px; bottom: 0; z-index: 10; }
    .main-v-1-0-250812 .section-01 .box-wrap.main-tech-slider {
        flex-direction: row; gap: 16px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 0; margin: 0;
    }
    .main-v-1-0-250812 .section-01 .box-wrap.main-tech-slider::-webkit-scrollbar { display: none; }
    .main-v-1-0-250812 .section-01 .box-wrap.main-tech-slider .box-01,
    .main-v-1-0-250812 .section-01 .box-wrap.main-tech-slider .box-02,
    .main-v-1-0-250812 .section-01 .box-wrap.main-tech-slider .box-03 {
        flex: 0 0 calc((100vw - 40px - 16px) / 1.5); width: calc((100vw - 40px - 16px) / 1.5);
        min-width: 220px; max-width: 360px; height: 320px; min-height: 320px; scroll-snap-align: start; scroll-snap-stop: always;
    }
    .main-v-1-0-250812 .section-01 .box-wrap.main-tech-slider .box-01:hover,
    .main-v-1-0-250812 .section-01 .box-wrap.main-tech-slider .box-02:hover,
    .main-v-1-0-250812 .section-01 .box-wrap.main-tech-slider .box-03:hover { width: calc((100vw - 40px - 16px) / 1.5); }
    .main-v-1-0-250812 .section-01 .box-wrap { flex-direction: column; align-items: center; }
    .main-v-1-0-250812 .section-01 .box-01, .main-v-1-0-250812 .section-01 .box-02, .main-v-1-0-250812 .section-01 .box-03 { width: 100%; max-width: 448px; }
    .main-v-1-0-250812 .section-01 .box-01:hover, .main-v-1-0-250812 .section-01 .box-02:hover, .main-v-1-0-250812 .section-01 .box-03:hover { width: 100%; border-radius: 16px; }
    .main-v-1-0-250812 .section-01 .box-01:hover .txt-expanded, .main-v-1-0-250812 .section-01 .box-02:hover .txt-expanded, .main-v-1-0-250812 .section-01 .box-03:hover .txt-expanded { opacity: 0; }
    .main-v-1-0-250812 .section-01 .box-01:hover .txt, .main-v-1-0-250812 .section-01 .box-02:hover .txt, .main-v-1-0-250812 .section-01 .box-03:hover .txt { opacity: 1; pointer-events: auto; }
    
    /* section-02 Manufacturing: 슬라이드 + 하단 여백 축소 */
    .main-v-1-0-250812 .section-02 { height: auto; min-height: 0; display: flex; flex-direction: column; overflow: visible; }
    .main-v-1-0-250812 .section-02 .p2 { order: -1; position: relative; left: 0; top: 0; width: 100%; padding: 40px 0 8px 40px; flex-direction: column; gap: 12px; align-items: flex-start; box-sizing: border-box; }
    .main-v-1-0-250812 .section-02 .p2 .manufacturing, .main-v-1-0-250812 .section-02 .p2 ._24-20-brix-900-1-800 { margin-bottom: 0; }
    .main-v-1-0-250812 .section-02 .p2 ._24-20-brix-900-1-800 { font-size: 14px; line-height: 1.4; }
    .main-v-1-0-250812 .section-02 .box-wrap {
        flex-direction: row; position: relative; left: 0; width: 100%; overflow-x: auto; overflow-y: visible;
        scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none;
        gap: 16px; padding-left: 40px; padding-right: 0; padding-bottom: 12px; margin: 0; align-items: flex-start;
    }
    .main-v-1-0-250812 .section-02 .box-wrap::-webkit-scrollbar { display: none; }
    .main-v-1-0-250812 .section-02 .box, .main-v-1-0-250812 .section-02 .box2 {
        flex: 0 0 calc((100vw - 40px - 16px) / 1.5); width: calc((100vw - 40px - 16px) / 1.5);
        min-width: 220px; max-width: 360px; height: auto; min-height: 420px; padding: 22px 16px 26px; gap: 12px;
        scroll-snap-align: start; scroll-snap-stop: always; overflow: visible; border-width: 0; box-sizing: border-box;
    }
    .main-v-1-0-250812 .section-02 .box .union8, .main-v-1-0-250812 .section-02 .box .union9, .main-v-1-0-250812 .section-02 .box .union10,
    .main-v-1-0-250812 .section-02 .box2 .union8, .main-v-1-0-250812 .section-02 .box2 .union9, .main-v-1-0-250812 .section-02 .box2 .union10 {
        width: 40px; height: 40px; flex-shrink: 0; object-fit: contain;
    }
    .main-v-1-0-250812 .section-02 .box .union10, .main-v-1-0-250812 .section-02 .box2 .union10 { width: 34px; height: 34px; }
    .main-v-1-0-250812 .section-02 .box .div4, .main-v-1-0-250812 .section-02 .box2 .div4 { font-size: 15px; line-height: 22px; }
    .main-v-1-0-250812 .section-02 .box ._24-capacity-1-000-kg-hr, .main-v-1-0-250812 .section-02 .box ._20-brix-1-30, .main-v-1-0-250812 .section-02 .box .hpp-uht,
    .main-v-1-0-250812 .section-02 .box2 ._24-capacity-1-000-kg-hr, .main-v-1-0-250812 .section-02 .box2 ._20-brix-1-30, .main-v-1-0-250812 .section-02 .box2 .hpp-uht {
        font-size: 12px; line-height: 18px;
    }
    
    /* section-03 OEM: 왼쪽 로고 노출, 1.5개 카드 (section-01/04와 동일 구조) */
    .main-v-1-0-250812 .section-03 { flex-direction: column; padding: 80px 0 80px 40px; max-width: 100%; align-items: stretch; }
    .main-v-1-0-250812 .section-03 .logo {
        position: relative; order: -1; align-self: flex-start; margin: 0 0 24px 0; opacity: 0.35;
        width: 120px; height: auto; max-height: 48px; object-fit: contain; flex-shrink: 0;
    }
    .main-v-1-0-250812 .section-03 .main-cards-slider-wrap { display: block; width: 100%; overflow: hidden; padding: 0 0 56px 40px; position: relative; margin-top: 0; }
    .main-v-1-0-250812 .section-03 .main-cards-slider {
        display: flex; flex-direction: row; gap: 16px; overflow-x: auto; overflow-y: hidden;
        scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 0; margin: 0;
        touch-action: pan-x;
    }
    .main-v-1-0-250812 .section-03 .main-cards-slider::-webkit-scrollbar { display: none; }
    .main-v-1-0-250812 .section-03 .main-cards-slider .box {
        flex: 0 0 calc((100vw - 40px - 16px) / 1.5); width: calc((100vw - 40px - 16px) / 1.5);
        min-width: 200px; max-width: none; height: 320px; min-height: 320px; max-height: 320px;
        scroll-snap-align: start; scroll-snap-stop: always; box-sizing: border-box;
    }
    .main-v-1-0-250812 .section-03 .main-slider-nav { display: flex !important; position: absolute; left: 40px; bottom: 0; z-index: 10; pointer-events: auto; margin-top: 24px; }
    
    /* section-04 News: 슬라이드 + 버튼 */
    .main-v-1-0-250812 .section-04 { padding: 80px 0 80px 40px; }
    .main-v-1-0-250812 .section-04 .p { padding: 0 0 0 40px; flex-direction: column; align-items: flex-start; gap: 24px; }
    .main-v-1-0-250812 .section-04 .main-news-slider-wrap { padding: 0 0 56px 40px; overflow: hidden; width: 100%; }
    .main-v-1-0-250812 .section-04 .txt-wrap.main-news-slider {
        flex-direction: row; gap: 16px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 0; margin: 0;
    }
    .main-v-1-0-250812 .section-04 .txt-wrap.main-news-slider::-webkit-scrollbar { display: none; }
    .main-v-1-0-250812 .section-04 .txt-wrap.main-news-slider .news-item {
        flex: 0 0 calc((100vw - 40px - 16px) / 1.5); width: calc((100vw - 40px - 16px) / 1.5);
        min-width: 220px; max-width: 360px; height: 320px; min-height: 320px; max-height: 320px;
        scroll-snap-align: start; scroll-snap-stop: always;
    }
    .main-v-1-0-250812 .section-04 .txt-wrap.main-news-slider .news-item .news-image { height: 180px; }
    .main-v-1-0-250812 .section-04 .main-news-slider-wrap .txt-wrap { justify-content: flex-start; }
    
    .main-v-1-0-250812 .section-05-content { padding: 0 40px; }
}

/* 모바일: 뉴스 섹션 기준 왼쪽 20px, 카드 슬라이드·버튼·Manufacturing 3열·글씨 크기 통일 */
@media (max-width: 768px) {
    .mainbanner { padding-bottom: 85%; }
    .slider-controls { bottom: 60px; left: 50%; transform: translateX(-50%); right: auto; gap: 8px; }
    .slider-btn { padding: 6px 16px; font-size: 12px; }
    .mainbanner-01 .banner-text, .mainbanner-02 .banner-text, .mainbanner-03 .banner-text { padding-top: 40px; padding-left: 20px; padding-right: 20px; }
    .mainbanner-01 .banner-text-content, .mainbanner-02 .banner-text-content { font-size: 22px; line-height: 1.5; max-width: 95%; }
    .mainbanner-03 .banner-text-content { font-size: 26px; line-height: 1.5; letter-spacing: 0.5px; max-width: 95%; }
    .mainbanner-02 .vision, .mainbanner-03 .brewzen2 { font-size: 28px; line-height: 36px; }
    .mainbanner-02 .div, .mainbanner-03 .div { font-size: 16px; line-height: 24px; }
    .mainbanner-02 .mission, .mainbanner-02 .vision2, .mainbanner-02 .brewzen,
    .mainbanner-03 .mission, .mainbanner-03 .vision3, .mainbanner-03 .brewzen3 { font-size: 22px; line-height: 30px; }
    .main-v-1-0-250812 .section-01 .technology,
    .main-v-1-0-250812 .section-02 .manufacturing,
    .main-v-1-0-250812 .section-04 .nextbio-news { font-size: 24px; line-height: 32px; }
    .main-v-1-0-250812 .section-05-content .div12 { font-size: 22px; line-height: 30px; word-break: keep-all; }
    
    /* section-01 Technology: 슬라이드 + 버튼 20px */
    .main-v-1-0-250812 .section-01 { padding: 60px 0 60px 20px; gap: 40px; }
    .main-v-1-0-250812 .section-01 .technology { padding: 0 20px; }
    .main-v-1-0-250812 .section-01 .main-tech-slider-wrap { padding: 0 0 56px 20px; }
    .main-v-1-0-250812 .section-01 .main-tech-nav { left: 20px; }
    .main-v-1-0-250812 .section-01 .box-wrap.main-tech-slider .box-01,
    .main-v-1-0-250812 .section-01 .box-wrap.main-tech-slider .box-02,
    .main-v-1-0-250812 .section-01 .box-wrap.main-tech-slider .box-03 {
        flex: 0 0 calc((100vw - 20px - 16px) / 1.5); width: calc((100vw - 20px - 16px) / 1.5);
        min-width: 200px; max-width: 320px; height: 300px; min-height: 300px; max-height: 300px;
    }
    .main-v-1-0-250812 .section-01 .box-wrap.main-tech-slider .box-01:hover,
    .main-v-1-0-250812 .section-01 .box-wrap.main-tech-slider .box-02:hover,
    .main-v-1-0-250812 .section-01 .box-wrap.main-tech-slider .box-03:hover { width: calc((100vw - 20px - 16px) / 1.5); }
    
    /* section-02 Manufacturing: 3카드 한 줄, 하단 여백 축소 */
    .main-v-1-0-250812 .section-02 { height: auto; min-height: 0; overflow: visible; }
    .main-v-1-0-250812 .section-02 .p2 { padding: 40px 20px 6px; gap: 12px; align-items: center; text-align: center; }
    .main-v-1-0-250812 .section-02 .p2 .manufacturing { text-align: center; }
    .main-v-1-0-250812 .section-02 .p2 ._24-20-brix-900-1-800 { text-align: center; margin-bottom: 0; line-height: 1.4; }
    .main-v-1-0-250812 .section-02 .box-wrap {
        flex-direction: row; overflow-x: visible; overflow-y: visible; scroll-snap-type: none;
        gap: 8px; padding: 0 20px 8px; margin: 0; align-items: stretch; justify-content: center; flex-wrap: nowrap;
    }
    .main-v-1-0-250812 .section-02 .box, .main-v-1-0-250812 .section-02 .box2 {
        flex: 1 1 0; min-width: 0; width: auto; max-width: none; height: auto; min-height: 260px;
        padding: 16px 8px 20px; gap: 6px; scroll-snap-align: none; scroll-snap-stop: auto;
        overflow: visible; border-width: 0; box-sizing: border-box;
    }
    .main-v-1-0-250812 .section-02 .box .union8, .main-v-1-0-250812 .section-02 .box .union9, .main-v-1-0-250812 .section-02 .box .union10,
    .main-v-1-0-250812 .section-02 .box2 .union8, .main-v-1-0-250812 .section-02 .box2 .union9, .main-v-1-0-250812 .section-02 .box2 .union10 {
        width: 32px; height: 32px; flex-shrink: 0; object-fit: contain;
    }
    .main-v-1-0-250812 .section-02 .box .union10, .main-v-1-0-250812 .section-02 .box2 .union10 { width: 28px; height: 28px; }
    .main-v-1-0-250812 .section-02 .box .div4, .main-v-1-0-250812 .section-02 .box2 .div4 { font-size: 13px; line-height: 18px; }
    .main-v-1-0-250812 .section-02 .box ._24-capacity-1-000-kg-hr, .main-v-1-0-250812 .section-02 .box ._20-brix-1-30, .main-v-1-0-250812 .section-02 .box .hpp-uht,
    .main-v-1-0-250812 .section-02 .box2 ._24-capacity-1-000-kg-hr, .main-v-1-0-250812 .section-02 .box2 ._20-brix-1-30, .main-v-1-0-250812 .section-02 .box2 .hpp-uht {
        font-size: 10px; line-height: 14px;
    }
    
    /* section-03 OEM: 다른 카드 섹션(section-01/04)과 동일 레이아웃 */
    .main-v-1-0-250812 .section-03 { flex-direction: column; padding: 60px 0 60px 20px; max-width: 100%; }
    .main-v-1-0-250812 .section-03 .logo { margin-bottom: 20px; width: 100px; max-height: 40px; opacity: 0.35; }
    .main-v-1-0-250812 .section-03 .main-cards-slider-wrap { padding: 0 0 56px 20px; }
    .main-v-1-0-250812 .section-03 .main-slider-nav { left: 20px; margin-top: 24px; }
    .main-v-1-0-250812 .section-03 .main-cards-slider .box {
        flex: 0 0 calc((100vw - 20px - 16px) / 1.5); width: calc((100vw - 20px - 16px) / 1.5);
        min-width: 180px; max-width: none; height: 300px; min-height: 300px; max-height: 300px;
        scroll-snap-align: start; scroll-snap-stop: always; box-sizing: border-box;
    }
    
    /* section-04 News: 슬라이드 + 버튼 20px */
    .main-v-1-0-250812 .section-04 { padding: 60px 0 60px 20px; gap: 32px; }
    .main-v-1-0-250812 .section-04 .p { padding: 0 0 0 20px; flex-direction: column; align-items: flex-start; margin-bottom: 0; }
    .main-v-1-0-250812 .section-04 .main-news-slider-wrap { padding: 0 0 56px 20px; width: 100%; max-width: 100%; }
    .main-v-1-0-250812 .section-04 .main-news-slider-wrap .txt-wrap { padding: 0; justify-content: flex-start; }
    .main-v-1-0-250812 .section-04 .txt-wrap.main-news-slider .news-item {
        flex: 0 0 calc((100vw - 20px - 16px) / 1.5); width: calc((100vw - 20px - 16px) / 1.5);
        min-width: 200px; max-width: 320px; height: 300px; min-height: 300px; max-height: 300px;
    }
    .main-v-1-0-250812 .section-04 .news-item { border-radius: 12px; }
    .main-v-1-0-250812 .section-04 .news-image { height: 200px; border-radius: 12px 12px 0 0; }
    .main-v-1-0-250812 .section-04 .news-content { padding: 16px; }
    .main-v-1-0-250812 .section-04 .news-title { font-size: 18px; line-height: 26px; }
    .main-v-1-0-250812 .section-04 .news-date { font-size: 12px; margin-top: 6px; }
    
    .main-v-1-0-250812 .section-05-content { padding: 0 20px; }
    .main-v-1-0-250812 .section-05-content .logo-slider-wrapper { margin: 0 -20px; }
}