/* NO CSS*/
/* componenet*/
html[lang='en'] .section-title {
    display: flex;
    justify-content: space-between;
}
html[lang='en'] .section-contents {
    margin-top: 0 !important;
}
@media (max-width: 1023px) {
    html[lang='en'] .section-container {
        flex-direction: column;
        gap: 4.8rem;
    }
}
#main { box-sizing: border-box;}

.pi-popup {
	opacity : 1 !important;
}

.section {
    position: relative;
}
.section-container {
    display: flex;
    gap: 4rem;
}
.section-title-topic {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.section-title.flex {
    display: flex;
    align-items: center;
}
.section-title .h3 {
    color: #111;
    font-size: 5.6rem;
    font-weight: 800;
    line-height: 130%; /* 7.28rem */
    letter-spacing: -0.112rem;
}
.section-title-sub em {
    display: block;
    text-align: center;
    color: #a77722;
    font-family: 'Red Hat Display';
    font-size: 4rem;
    line-height: 110%;
    letter-spacing: 1.2rem;
    margin-right: -2.2rem;
}
@media (max-width: 1024px) {
    .section-title .h3 {
        font-size: 4.8rem;
    }
}
@media (max-width: 768px) {
    .section .h3 {
        font-size: 32px;
    }
    .section-title-sub em {
        font-size: 24px;
    }
}

.swiper * {
    box-sizing: border-box !important;
}

.slider-controller-item {
    display: flex;
    align-items: center;
    gap: 8px;
}
.slider-controller-pagination {
    display: flex;
    align-items: center;
    gap: 8px;
    width: -moz-fit-content;
    width: fit-content;
}
.slider-controller-pagination.swiper-pagination-lock + button {
    display: none;
}
.slider-controller-pagination .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background: #d9d9d9;
    border-radius: 50%;
    opacity: 1;
    margin: 0 !important;
    transition: background 0.1s ease;
}
.slider-controller-pagination .swiper-pagination-bullet-active {
    background: #a77722;
}
.slider-controller-pagination .swiper-pagination-bullets {
    width: -moz-fit-content !important;
    width: fit-content !important;
}
.slider-controller-play,
.slider-controller-pause {
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
}
.slider-controller-pause {
    background: url(/public/images/layout/ico_slider-pause.svg) no-repeat center/contain;
}
.slider-controller-play {
    display: none;
    background: #999;
    -webkit-mask: url(/public/images/layout/ico_slider-play.svg) no-repeat center/100%;
    mask: url(/public/images/layout/ico_slider-play.svg) no-repeat center/100%;
}
.slider-controller-prev,
.slider-controller-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 2rem;
    height: 4rem;
    -webkit-mask-size: 100%;
    mask-size: 100%;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background: #222;
}
.slider-controller-prev.swiper-button-disabled,
.slider-controller-next.swiper-button-disabled {
    background: #bdbdbd;
}
.slider-controller-prev {
    left: -5.6rem;
    -webkit-mask-image: url(/public/images/layout/ico_slider-prev.svg);
    mask-image: url(/public/images/layout/ico_slider-prev.svg);
}
.slider-controller-next {
    right: -5.6rem;
    -webkit-mask-image: url(/public/images/layout/ico_slider-next.svg);
    mask-image: url(/public/images/layout/ico_slider-next.svg);
}
@media (max-width: 1520px) {
    .slider-controller-prev,
    .slider-controller-next {
        display: none;
    }
}

strong.title {
    color: #fff;
    text-align: center;
    font-family: 'Red Hat Display';
    font-size: 7.5rem;
    font-weight: 900;
    line-height: 110%;
}
@media (max-width: 1280px) {
    strong.title {
        font-size: 6.3rem;
    }
   
}
@media (max-width: 768px) {
    strong.title {
        font-size: 38px;
    }
}

p.desc {
    color: #fff;
    text-align: center;
    /*font-size: 2.8rem;*/font-size: 2.4rem;
    font-weight: 500;
    line-height: 160%;
    letter-spacing: -0.056rem;
}
@media (max-width: 1280px) {
    p.desc {
        font-size: 2.4rem;
    }
}
@media (max-width: 768px) {
    p.desc {
        font-size: 18px;
    }
}

#section01 .visual {
    position: relative;
    height: 100dvh;
}
#section01 .visual-overlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    opacity: 0;
    z-index: 1;
}
#section01 .visual-video {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 100%;
    z-index: 0;
}
#section01 .visual-video:before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    transform: translate(-50%, -50%);
    background: rgba(0, 0, 0, 0.45);
    z-index: 1;
}
#section01 .visual-video video {
    position: relative;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
#section01 .visual-video .swiper {
    width: 100%;
    height: 100%;
}
#section01 .visual-video .swiper-slide {
    overflow: hidden;
}
#section01 .visual-video .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}
#section01 .visual-video-controller {
    position: absolute;
    bottom: 5.6rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
}
#section01 .visual-video-pagination {
    display: flex;
    align-items: center;
    gap: 2rem;
}
#section01 .visual-video-pagination .swiper-pagination-bullet {
    position: relative;
    display: flex;
    align-items: center;
    gap: 2rem;
    width: -moz-fit-content;
    width: fit-content;
    height: auto;
    border-radius: 0;
    margin: 0;
    background: transparent;
    opacity: 1;
}
#section01 .visual-video-pagination .swiper-pagination-bullet .num {
    color: rgba(255, 255, 255, 0.8) !important;
    font-family: 'Red Hat Display';
    font-size: 2rem;
    font-weight: 700;
}
#section01 .visual-video-pagination .swiper-pagination-bullet-active .num {
    color: #fff !important;
}
#section01 .visual-video-pagination .swiper-pagination-bullet-active .progress {
    display: flex;
    align-items: center;
}
#section01 .visual-video-pagination .progress {
    position: relative;
    display: none;
    width: 8rem;
    height: 0.2rem;
    background: rgba(255, 255, 255, 0.3);
}
#section01 .visual-video-pagination .progress-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 100%;
    background: #fff;
    transition: width 0.5s;
}
#section01 .visual-contents {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}
#section01 .visual-contents-title {
    position: relative;
    overflow: hidden;
}
#section01 .visual-contents-title .h2 {
    display: block;
    color: #fff;
    text-align: center;
    font-size: 8rem;
    font-weight: 700;
    line-height: 134%;
    /*letter-spacing: -0.176rem;*/
    overflow: hidden;
    margin-bottom: 10px
}
#section01 .visual-scroll {
    position: absolute;
    bottom: 5rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    z-index: 1;
}
#section01 .visual-scroll em {
    display: block;
    color: #fff;
    font-family: 'Red Hat Display';
    font-size: 1.6rem;
    font-weight: 500;
    text-align: center;
    text-transform: uppercase;
}
#section01 .visual-scroll img {
    display: block;
    width: 24px;
    height: 24px;
    animation: pulse 2s ease-out;
    animation-iteration-count: infinite;
}
@media (max-width: 768px) {
    #section01 .visual-contents {
        padding: 0 20px;
    }
    #section01 .visual-contents-title .h2 {
        font-size: 40px; margin-bottom: 10px
        /*letter-spacing: -0.128rem;*/
    }
    #section01 .visual-scroll em {
        font-size: 14px;
    }
}
#section02 {
    position: relative;
    width: 100%;
    height: 120dvh;
    /*background: url(/main_files/section02_bg.webp) no-repeat center/cover;*/
    background: url(/main_files/section02_bg.png) no-repeat center/cover;
    overflow: hidden;
}
#section02:before {
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
}
#section02 .layout {
    height: 100%;
}
#section02 .about {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}
#section02 .about-item {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4rem;
    height: 40%;
    z-index: 3;
}
#section02 .about-desc > p br.mobile {
    display: none;
}
#section02 .about-arrow {
    margin-top: auto;
}
#section02 .about-arrow .icon {
    display: flex;
    width: 6.4rem;
    height: 6.4rem;
    padding: 1rem;
    justify-content: center;
    align-items: center;
    border-radius: 5rem;
    border: 2px solid #fff;
}
#section02 .about-mountains {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
}
#section02 .about-mountains:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 40rem;
    background: linear-gradient(180deg, rgba(8, 30, 55, 0) 0%, #372608 100%);
    z-index: 3;
}
#section02 .about-mountains-images {
    position: relative;
}
#section02 .about-mountains .front,
#section02 .about-mountains .back {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
}
#section02 .about-mountains .front {
    aspect-ratio: 1920/608;
    z-index: 2;
}
#section02 .about-mountains .back {
    aspect-ratio: 1920/415;
    z-index: 1;
}
#section02 .about-mountains .mobile {
    display: none;
}
@media (max-width: 768px) {
    #section02 {
        height: 100dvh;
    }
    #section02 .about-item {
        gap: 20px;
        height: 25.5555%;
        padding: 0 20px;
    }
    #section02 .about-title > strong {
        font-size: 38px;
    }
    #section02 .about-desc p {
        font-size: 18px;
    }
    #section02 .about-desc p br.pc {
        display: none;
    }
    #section02 .about-desc p br.mobile {
        display: inline-block;
    }
    #section02 .about-arrow {
        display: none;
    }
    #section02 .about-mountains {
        width: -moz-max-content;
        width: max-content;
    }
    #section02 .about-mountains:after {
        height: 200px;
    }
    #section02 .about-mountains .front,
    #section02 .about-mountains .back {
        display: none;
    }
    #section02 .about-mountains .mobile {
        display: block;
        width: 94.7368rem;
        aspect-ratio: 947.37/300;
    }
}

#section03 {
    position: relative;
    background: #372608;
}
#section03 .layout {
    height: 100%;
}
#section03 .sticky {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    height: 100%;
}
#section03 .sticky-container {
    position: relative;
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 3.2rem;
    height: 100%;
}
#section03 .sticky-title {
    position: sticky;
    top: calc(100dvh - 100%);
    display: flex;
    flex-direction: column;
    gap: 6rem;
    overflow: visible;
    transform: translateY(18rem);
    margin-bottom: 18rem;
}
#section03 .sticky-title .title,
#section03 .sticky-title .desc {
    text-align: left;
    max-width: 44.6rem;
}
#section03 .sticky-title .mobile {
    display: none;
}
#section03 .sticky-title .hover {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.8rem;
    width: 28.7rem;
    height: 6.1rem;
    padding: 0.3rem;
    border-radius: 4rem;
    z-index: 1;
    /*background-image: linear-gradient(#372608, #372608), linear-gradient(to right, #a77722, #a77722);*/
    background-image: linear-gradient(#372608, #372608), linear-gradient(to right, #f6e37c, #a77722);
    background-origin: border-box;
    background-clip: content-box, border-box;
}
#section03 .sticky-title .hover:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 4rem;
    background: rgba(255, 255, 255, 0.08);
}
#section03 .sticky-title .hover .icon {
    display: block;
    width: 24px;
}
#section03 .sticky-title .hover em {
    color: #fff;
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 160%;
    letter-spacing: -0.036rem;
}
#section03 .sticky-contents {
    flex-shrink: 0;
    width: 69rem;
}
#section03 .card-pagination {
    display: none;
}
#section03 .card-item {
    width: calc(50% - 2.5rem);
}
#section03 .card-item-box {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 3rem 5rem;
}
#section03 .card-item:first-child {
    padding-top: 7rem;
}
#section03 .card-item:last-child {
    transform: translateY(-7rem);
}
#section03 .card-flip {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    width: 100%;
    height: 100%;
}
#section03 .card-flip-inner {
    overflow: hidden;
    border-radius: 4rem;
}
#section03 .card-flip-inner:hover .card-info {
    transform: rotateY(180deg);
}
#section03 .card-flip-inner:hover + .card-title .card-link {
    opacity: 0.2;
}
#section03 .card-info {
    position: relative;
    width: 100%;
    height: 100%;
    aspect-ratio: 320/400;
    transform-style: preserve-3d;
    transition: transform 0.24s ease-in-out;
    will-change: transform;
}
#section03 .card-link {
    display: flex;
    align-items: center;
    gap: 8px;
    width: -moz-fit-content;
    width: fit-content;
    transition: opacity 0.3s;
}
#section03 .card-link .desc {
    font-weight: 700;
}
#section03 .card-link .icon {
    display: none;
    width: 24px;
    height: 24px;
    background: #fff;
    transition: background 0.3s;
    -webkit-mask: url(/public/images/layout/ico_add-line.svg) no-repeat center/contain;
    mask: url(/public/images/layout/ico_add-line.svg) no-repeat center/contain;
}
#section03 .card-link:hover {
    opacity: 0.2;
}
#section03 .card-front img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 320/400;
    -o-object-fit: cover;
    object-fit: cover;
}
#section03 .card-front,
#section03 .card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    overflow: hidden;
}
#section03 .card-back {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4rem;
    width: 100%;
    height: 100%;
    padding: 1rem 3rem;
    transform: rotateY(180deg);
    will-change: transform;
    background: linear-gradient(180deg, #f6e37c 0%, #a77722 45%);
}
#section03 .card-back-item {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
}
#section03 .card-back-title {
    color: #fff;
    text-align: center;
    font-size: 3.2rem;
    font-weight: 800;
    line-height: 130%;
    letter-spacing: -0.064rem;
}
#section03 .card-back-desc {
    color: #fff;
    text-align: center;
    font-size: 2rem;
    font-weight: 500;
    line-height: 150%;
    letter-spacing: -0.04rem;
}
@media (max-width: 1280px) {
    #section03 .sticky-contents {
        width: 64rem;
    }
}
@media (max-width: 1024px) {
    #section03 {
        padding: 60px 0 64px;
    }
    #section03 .sticky-container {
        flex-direction: column;
        align-items: center;
        gap: 40px;
    }
    #section03 .sticky-title {
        position: static;
        transform: translateY(0);
        gap: 24px;
        margin-bottom: 0;
    }
    #section03 .sticky-title .title,
    #section03 .sticky-title .desc {
        text-align: center;
    }
    #section03 .sticky-title .pc,
    #section03 .sticky-title .hover {
        display: none;
    }
    #section03 .sticky-title .mobile {
        display: block;
    }
    #section03 .sticky-contents {
        width: 100%;
        padding: 0 35px;
    }
    #section03 .card-slider {
        overflow: visible;
    }
    #section03 .card-pagination {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        /*gap: 4px 8px;*/
        gap: 4px 5px;
        width: 100%;
        overflow: hidden;
        z-index: 1;
    }
    #section03 .card-pagination li {
        display: flex;
        width: -moz-fit-content;
        width: fit-content;
        height: 40px;
        padding: 0rem 7px;
        justify-content: center;
        align-items: center;
        gap: 10px;
        border-radius: 8px;
        margin: 0;
        opacity: 1;
        background: rgba(255, 255, 255, 0.1);
    }
    #section03 .card-pagination li strong {
        color: #fff;
        font-size: 16px;
        font-weight: 700;
        line-height: 160%;
        letter-spacing: -0.032rem;
    }
    #section03 .card-pagination li.swiper-pagination-bullet-active {
        background: linear-gradient(0deg, #f6e37c 0%, #a77722 100%),
            linear-gradient(90deg, #f6e37c 0%, #a77722 100%);
    }
    #section03 .card-item {
        width: auto;
        opacity: 0.2 !important;
        transform: translateY(0) !important;
    }
    #section03 .card-item.swiper-slide-active {
        opacity: 1 !important;
    }
    #section03 .card-item:first-child {
        padding-top: 0;
    }
    #section03 .card-item:last-child {
        transform: translateY(0);
    }
    #section03 .card-item-box {
        flex-wrap: nowrap;
        align-items: baseline;
        gap: 0;
    }
    #section03 .card-flip-inner {
        overflow: visible;
    }
    #section03 .card-flip-inner:hover .card-info {
        transform: rotateY(0);
    }
    #section03 .card-flip-inner:hover + .card-title .card-link {
        opacity: 1;
    }
    #section03 .card-info {
        aspect-ratio: auto;
        display: flex;
        flex-direction: column;
        gap: 30px;
        overflow: visible;
        will-change: auto;
        transform-style: initial;
    }
    #section03 .card-back,
    #section03 .card-front {
        position: static;
        overflow: visible;
    }
    #section03 .card-front {
        border-radius: 12px;
        overflow: hidden;
    }
    #section03 .card-back {
        align-items: baseline;
        gap: 12px;
        transform: rotateY(0);
        background: transparent;
        padding: 0;
    }
    #section03 .card-back-item {
        align-items: baseline;
    }
    #section03 .card-back-title {
        display: block;
        width: 100%;
        color: transparent;
        font-size: 28px;
        background: linear-gradient(90deg, #f6e37c 0%, #a77722 100%);
        background-clip: text;
        -webkit-background-clip: text;
        text-align: left;
    }
    #section03 .card-back-desc {
        color: rgba(255, 255, 255, 0.8);
        font-size: 16px;
        font-weight: 400;
        line-height: 160%;
        text-align: left;
        letter-spacing: -0.032rem;
    }
    #section03 .card-link {
        display: none;
    }
}
@media (max-width: 768px) {
    #section03 .sticky-title {
        font-size: 40px;
    }
    #section03 .sticky-title .pc {
        display: none;
    }
    #section03 .sticky-title .mobile {
        display: block;
    }
    #section03 .card-front {
        overflow: hidden;
        border-radius: 16px;
    }
    #section03 .card-front img {
        aspect-ratio: 280/220;
    }
}
#section04 {
    position: relative;
    background: #372608;
}
#section04 .section-container {
    position: relative;
}
#section04 .section-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8rem;
    width: 100%;
    padding-top: 21.3rem;
}
#section04 .section-title-sub {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    width: 100%;
}
#section04 .section-title p.desc {
    font-size: 2.4rem;
    font-weight: 400;
    line-height: 160%; /* 3.84rem */
    letter-spacing: -0.048rem;
}
#section04 .grow {
    margin-top: 7.2rem;
}
#section04 .grow-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6rem;
}
#section04 .grow-container .grow-arrow {opacity: 0.5}
#section04 .grow-image {
    position: relative;
    width: 54rem;
    height: 54rem;
}
#section04 .grow-image img {
    display: block;
    width: 48.8rem;
}
#section04 .grow-image .strong {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
    color: #a77722;
    text-align: center;
    font-family: 'Red Hat Display';
    font-size: 3.2rem;
    font-weight: 900;
    line-height: 130%;
    z-index: 1;
}
#section04 .grow-image .strong p{font-size: 2rem; font-weight: 500;line-height: 2.8rem;margin-top: 10px;}

#section04 .grow-image .text {
    position: absolute;
    display: block;
    color: #fff;
    text-align: center;
    font-size: 2rem;
    font-weight: 700;
    line-height: 140%;
    letter-spacing: -0.04rem;
}
#section04 .grow-image .text1 {
    top: -1.1rem;
    left: 50%;
    transform: translateX(-50%);     color: #fff9dc;
}
#section04 .grow-image .text2 {
    left: 1.6rem;
    bottom: 7.7rem;    color: #fff9dc;
}
#section04 .grow-image .text3 {
    right: 1rem;
    bottom: 7.7rem;    color: #fff9dc;
}
#section04 .grow-title > strong {
    display: block;
    color: #fff;
    font-size: 4.8rem;
    font-weight: 700;
    line-height: 140%;
    text-align: center;
    letter-spacing: -0.096rem;
}
#section04 .grow-title .green {
    color: #a77722;
    font-weight: 700;
}
#section04 .point {
    margin-top: 12rem;
}
#section04 .point-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6rem;
    width: 100%;
}
#section04 .point-title {
    color: rgba(255, 255, 255, 0.2);
    text-align: center;
    font-family: 'Red Hat Display';
    font-size: 3.2rem;
    font-weight: 900;
    line-height: 130%;
}
#section04 .point-list {
    display: flex;
    flex-direction: column;
    gap: 8rem;
    width: 100%;
}
#section04 .point-list.mobile {
    display: none;
}
#section04 .point-line {
    display: flex;
    flex-wrap: wrap;
    gap: 4rem;          justify-content: center;
}
#section04 .point-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.2rem;
    width: calc(33.3333333333% - 2.6666666667rem);
}
#section04 .point-item-info {
    display: flex;
    flex-direction: column;
    align-items: center;
}
#section04 .point-item-title {
    color: #fff;
    text-align: center;
    font-size: 2rem;
    font-weight: 400;
    text-align: center;
    line-height: 150%;
    letter-spacing: -0.04rem;
}
#section04 .point-item-strength {
    color: #a77722;
    text-align: center;
    font-size: 6rem;
    font-weight: 700;
    text-align: center;
    line-height: 130%;
}
#section04 .point-item-desc {
    color: rgba(255, 255, 255, 0.6);
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    line-height: 160%;
    letter-spacing: -0.032rem;
}
#section04 .point-more {
    margin-top: 2rem;
}
#section04 .point-more-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40.7rem;
    height: 7.2rem;
    padding: 0rem 4rem;
    align-items: center;
    gap: 0.2rem;
    border-radius: 1.6rem;
    background: rgba(255, 255, 255, 0.05);
}
#section04 .point-more-btn span {
    color: #fff;
    font-size: 2rem;
    font-weight: 700;
}
#section04 .svg-container {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 21rem);
    margin: 0 auto;
}
#section04 .svg-container svg {
    width: 100%;
    overflow: visible;
}
#section04 .svg-group {
    transform-origin: center;
}
#section04 .ticker {
    overflow: hidden;
    margin-top: 12rem;  height: 220px;
}
@media (max-width:1280px) {
    #section04 .ticker {height:198px }

}
@media (max-width:1024px) {
    #section04 .ticker {height:176px }

} 
@media (max-width:460px) {
    #section04 .ticker {height:110px }

} 


#section04 .ticker-slider {
    display: flex;
    gap: 4rem;
    -webkit-mask-image: linear-gradient(
        to right,
        rgba(0, 0, 0, 0) 0%,
        rgb(0, 0, 0) 12.5%,
        rgb(0, 0, 0) 87.5%,
        rgba(0, 0, 0, 0) 100%
    );
    mask-image: linear-gradient(
        to right,
        rgba(0, 0, 0, 0) 0%,
        rgb(0, 0, 0) 12.5%,
        rgb(0, 0, 0) 87.5%,
        rgba(0, 0, 0, 0) 100%
    );
}
#section04 .ticker-slider-container,
#section04 .ticker-slider .js-marquee {
    display: flex;
    align-items: center;
    gap: 4rem;
}
#section04 .ticker-list {
    display: flex;
    align-items: center;
    gap: 4rem;
}
#section04 .ticker-list-box {
    display: flex;
    align-items: center;
    gap: 4rem;
}
#section04 .ticker-link {
    display: block;
}
#section04 .ticker-item {
    position: relative;
    flex-shrink: 0;
    width: 22rem;
    height: 22rem;
}
@media (min-width: 768px) {
    #section04 .ticker-item:hover .ticker-image {
        opacity: 0.2;
    }
    #section04 .ticker-item:hover .ticker-title {
        display: flex;
    }
}
#section04 .ticker-image {
    transition: opcity 0.5s;
}
#section04 .ticker-image img {
    display: block;
    width: 22rem;
}
#section04 .ticker-title {
    display: none;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
    padding: 15px
}
#section04 .ticker-title p {
    color: #fff;
    text-align: center;
    font-size: 2rem;
    font-weight: 700;
    line-height: 120%;
}
#section04 .ticker-title p span {
    font-size: 15px;
    font-weight: 500;
    line-height: 147%;
    display: block;
    margin-top: 15px;letter-spacing: 0
}

@media (max-width: 1760px) {
    #section04 .svg-container {
        width: 100%;
    }
}
@media (max-width: 1024px) {
    #section04 .section-title {
        position: static;
        transform: translateX(0);
        padding-top: 60px;
        gap: 24px;
    }
    #section04 .svg-container {
        display: none;
    }
}
@media (max-width: 768px) {
    #section04 .section-container {
        padding: 0 20px;
    }
    #section04 .section-title p.desc br {
        display: none;
    }
    #section04 .point {
        margin-top: 40px;
    }
    #section04 .point-container {
        gap: 30px;
    }
    #section04 .point-line {
        gap: 0;
    }
    #section04 .point-list {
        gap: 40px 0;
    }
    #section04 .point-list.pc {
        display: none;
    }
    #section04 .point-list.mobile {
        display: flex;
    }
    #section04 .point-item {width: 47%;gap: 8px;    margin: 10px 5px;border-radius: 20px;padding: 10px 5px;border: 1px solid #8c5d13;background: #a77722;justify-content: center;}
    /*#section04 div.point-item:nth-child(1),#section04 div.point-item:nth-child(2) {border-bottom:1px solid rgba(255, 255, 255, 0.3); }*/
    #section04 .point-item-desc {line-height: 130%;        margin-top: 5px;}
    #section04 .point-item-title {font-size: 16px;min-height: 48px;word-break: keep-all;line-height: 20px;  }
    #section04 .point-item-strength {font-size: 30px;color: #f6e37c;}
    #section04 .point-more {
        margin-top: 10px;
    }
    #section04 .grow-container {
        gap: 40px;
    }
    #section04 .grow-title > strong {
        font-size: 24px;
    }
    #section04 .grow-image img {
        width: 313.2px;
    }
    #section04 .pointer-area {
        padding: 0 0 80px;
    }
    #section04 .ticker-list-box {
        gap: 12px;
    }
    #section04 .ticker-slider .js-marquee {
        gap: 12px;
        margin-right: 12px !important;
    }
}
@media (max-width: 460px) {
    #section04 .grow-image {
        width: calc(288px + 6rem);
        height: calc(288px + 2.2rem + 3rem);
    }
    #section04 .grow-image .strong {
        transform: translate(calc(-50% + 3px), calc(-50% - 2px));
        font-size: 20px;
        line-height: 130%;
    }
    #section04 .grow-image .text {
        font-size: 16px;
        line-height: 140%;
        letter-spacing: -0.032rem;
    }
    #section04 .grow-image .text1 {
        top: -12px;
    }
    #section04 .grow-image .text2 {
        left: -0.9px;
        bottom: 35px;
    }
    #section04 .grow-image .text3 {
        right: -1.62px;
        bottom: 35px;
    }
    #section04 .ticker {
        margin-top: 60px;
    }
    #section04 .ticker-item {
        width: 110px;
        height: 110px;
    }
}
@media (max-width: 390px) {
    #section04 .point-more {
        width: 100%;
    }
    #section04 .point-more-btn {
        width: 100%;
    }
}

#section05 {
    padding: 14rem 0;
}
#section05 .section-contents {
    margin-top: 6rem;
}
#section05 .swiper {
    width: 100%;
}


#section045 {
    padding: 14rem 0;
}
#section045 .section-contents {
    margin-top: 6rem;
}
#section045 .swiper {
    width: 100%;
}


@media (max-width: 768px) {
    #section05 {
        padding: 60px 0 120px;
    }
    #section05 .section-contents {
        margin-top: 40px;
    }
    #section05 .slider-controller-buttons {
        position: absolute;
        right: 0;
    }
}

.tab-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 4rem;
}
.tab-container .board-tab-list {
    flex-grow: 1;
}
.tab-container .board-tab-list + .btn-more {
    position: relative;
}
.tab-container .board-tab-list + .btn-more:before {
    content: '';
    position: absolute;
    right: calc(100% + 2rem);
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 2rem;
    background: #bdbdbd;
}
.tab-container .board-tab-list + .btn-more:focus,
.tab-container .board-tab-list + .btn-more:focus-visible {
    outline: 2px solid #12c5a3;
}
.tab-container .board-tab-list + .btn-more:focus:before,
.tab-container .board-tab-list + .btn-more:focus-visible:before {
    outline: none;
    border: none;
}
@media (max-width: 768px) {
    .tab-container {
        gap: 2.4rem;
        justify-content: start;
    }
    .tab-container .board-tab-list {
        flex-grow: 0;
    }
    .tab-container .board-tab-list + .btn-more {
        position: relative;
        margin-left: 0;
    }
    .tab-container .board-tab-list + .btn-more:before {
        right: calc(100% + 1.1rem);
        height: 1.6rem;
    }
}

.notice-tab {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    width: 16rem;
    height: 4.8rem;
    position: relative;
    color: #7a7a7a;
    font-size: 2rem;
    font-weight: 700;
    white-space: nowrap;
    border-radius: 4rem;
    background: #ededed;
    padding: 0.4rem 1.2rem;
}
.notice-tab:hover {
    background: #919191;color: #fff;
    transition: background 0.2s;transition: all 0.5s;
}
.notice-tab span{width:calc(100% - 24px)}
.notice-tab.active {
    color: #fff;
    font-weight: 700;
    background: linear-gradient(314deg, #f6e37c 0%, #a77722 77%), #f6e37c;
}
.notice-tab .more{width: 24px;opacity: 0.5;transition: all 0.5s; margin-left: 5px;  margin-left: auto;}
.notice-tab .more:hover{width: 24px;opacity: 1}
.notice-tab-list {
    display: none;
}
.notice-list {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4rem 0.8rem;
}
.notice-item {
    display: none;
    width: 100%;
}
.notice-item.active {
    display: flex;
    flex-direction: column;
    gap: 4rem;
    order: 999;
}
.notice-item-info {
    display: flex;
    flex-direction: column;
    gap: 1.3rem;
    height: 100%;
}
.media_thum {
    width: 100%;
    height: auto;
    overflow: hidden;
    border-radius: 10px;
   border: 1px solid #ddd
}

.notice-item-info img {
       position: relative;
    top: 0;
    left: 50%;
    width: 100%;
    height: auto;       max-height: 300px;
    object-fit: cover;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    cursor: pointer;
    overflow: hidden;
    
}

.notice-item-box {
    position: relative;
    display: flex;
    flex-direction: column;
}
.notice-item-box:has(.notice-item-nodata) .slider-controller-prev,
.notice-item-box:has(.notice-item-nodata) .slider-controller-next {
    display: none;
}
.notice-item .slider-controller {
    display: flex;
    justify-content: center;
}
.notice-item-nodata {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.6rem;
    width: 100%;
    padding: 12.65rem 0 12.5725rem;
    border-radius: 2.8rem;
    background: linear-gradient(90deg, #fff 0%, #f4f4f8 50%, #f4f4f8 75%, #fff 100%);
}
.notice-item-nodata img {
    display: block;
    width: 8rem;
}
.notice-item-nodata .h5 {
    font-size: 2.4rem;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    letter-spacing: -0.024rem;
}
.notice-link {
    display: block;
    /*height: 38rem;*/
    height: 50rem;
    
    background: #fff;
    outline: 1px solid #e0e0e0;
    outline-offset: -2px;
    border-radius: 3rem;
    padding: 4rem 3.6rem;
}
.notice-link:hover .board-title {
    text-decoration: underline;
    text-underline-offset: 3px;
}
.notice-link:focus,
.notice-link:focus-visible {
    outline: 2px solid #12c5a3;
}
.notice-category {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}
.notice-topic {
    width: -moz-fit-content;
    width: fit-content;
    color: var(--color-main);
    font-size: 1.6rem;
    font-weight: 600;
}
.notice-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 2;
    color: #222;
    font-size: 2.8rem;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: -0.028rem;
    word-break: break-all;
    white-space:nowrap; text-overflow:ellipsis; height: 50px;
}
.notice-desc {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    /*overflow: hidden;*/
    -webkit-line-clamp: 3;
    color: #757575;
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 145%;
    word-break: break-all;
}
.notice-date {
    position: relative;
    display: block;
    color: #757575;
    font-size: 1.6rem;
    font-weight: 400;
    margin-top: auto;
}
@media (max-width: 1024px) {
    .notice-item-nodata .h5 {
        font-size: 20px;
        letter-spacing: -0.02rem;
    }
}
@media (max-width: 768px) {
    .notice-list {
        gap: 20px 8px;
    }
    .notice-link {
        /*height: 230px;*/
        height: 370px;
        padding: 20px 16px;
    }
    .notice-title {
        align-self: stretch;
        -webkit-line-clamp: 3;
    }
    .notice-item.active {
        gap: 20px;
    }
    .notice-item-info {
        gap: 12px;
    }
    
    
    .notice-item-nodata .h5 {
        font-size: 18px;
        letter-spacing: -0.018rem;
    }
    .notice-tab {
        width: 113.3333px;
        height: 40px;
        padding: 0.4rem 1.6rem;
    }
    .notice-tab-list {
        display: flex;
        justify-content: center;
        gap: 8px;
        margin-right: 0;
        overflow-x: auto;
    }
    .notice-topic {
        font-size: 13px;
    }
    .notice-title {
        font-size: 18px;
    }
    .notice-date {
        font-size: 14px;
    }
}

.pointer {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    border-radius: 50%;
    background: rgba(39, 228, 192, 0.14);
    filter: blur(10rem);
    pointer-events: none;
    z-index: 13;
    width: 50rem;
    height: 50rem;
    cursor: none !important;
}
.pointer-area {
    position: relative;
    height: auto;
    padding: 0 0 14rem;
    overflow-x: hidden;
    overflow-y: visible;
}
@media (max-width: 768px) {
    .pointer {
        display: none;
    }
}