.Anchor-Point-once:before {
            content: "";
            display: block;
            position: absolute;
            background: #fff;
            border-radius: 50px;
            left: 50%;
            top: 50%;
            width: 105%;
            height: 105%;
            transform: translate(-50%, -50%);
            transition: 0.3s all;
            animation: expand 3s ease-in-out infinite;
        }

        .Anchor-Point-once {
            position: absolute;
            top: calc((100% - 30px)* var(--anchor-Point-once-top) / 100);
            left: calc((100% - 30px)* var(--anchor-Point-once-left) / 100);
            width: 30px;
            height: 30px;
            background: #66666669;
            border-radius: 50px;
            transition: 0.5s all;
            border: 2px solid #fff;
        }

        .Anchor-Point-image-div {
            position: relative;
            width: 100%;
            height: 100%;
        }

        img.Anchor-Point-image {
            width: 100%;
            height: 100%;
            object-fit: cover;
            position: absolute;
            top: 0;
            transition: 0.5s ease-in-out;
        }
        img.Anchor-Point-image1{
           opacity: 1; 
        }
        img.Anchor-Point-image0{
           opacity: 0; 
        }
        .Anchor-Point-left-box {
            position: absolute;
            width: 100%;
            height: 100%;
            transition: 0.5s all;
            left: 0;
            z-index: 1;
            transform: translateX(0);
        }

        .Anchor-Point-main-div {
            width: 100%;
            position: relative;
            overflow: hidden;
            height: 900px;
        }

        .Anchor-Ponit-once-title {
            position: relative;
            right: calc(-100% - 20px);
            width: max-content;
            top: 50%;
            transform: translateY(-50%);
            opacity: 0;
            font-family: var(--anchor-Point-main-font-family);
            font-weight: var(--anchor-Point-main-font-weight);
            color: var(--anchor-Point-title-color-p);
            font-size: var(--anchor-Point-title-p-font-size);
            transition: 0.5s all;
            pointer-events: none;
        }

        .Anchor-Point-right-box {
            position: relative;
            top: 0;
            transform: translateX(250%);
            width: 40%;
            height: 100%;
            transition: 0.5s all;
            z-index: 2;
        }

        .Anchor-Point-right-once {
            position: absolute;
            height: 100%;
            background: #000;
            overflow: auto;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        img.Anchor-Point-right-img {
            width: 100%;
            height: 440px;
            display: block;
            object-fit: cover;
        }

        .Anchor-Point-div.page-width {
            max-width: none;
        }

        .Anchor-Point-once:hover {
            /* top: calc((100% - 50px)* var(--anchor-Point-once-top) / 100);
            left: calc((100% - 50px)* var(--anchor-Point-once-left) / 100); */
            /* transform: scale(1.6) !important; */
            background: #fff;
            transition: 0.5s all;
        }

        .Anchor-Point-once:hover::before {
            content: "";
            transform: scale(1.6);
            background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="black"><text x="4" y="15" font-size="20">+</text></svg>');
            background-size: contain;
            background-repeat: no-repeat;
            /* width: 105%; */
            /* height: 105%; */
            background-position: center;
            animation: none;
            top: 0;
            left: 0;
        }

        .Anchor-Point-once:hover .Anchor-Ponit-once-title {
            opacity: 1 !important;
            transform: translateY(-50%) !important;
        }

        .Anchor-Point-once.isClick {
            /* transform: scale(1.6); */
            transform-origin: 50% 50%;
        }

        .Anchor-Point-once.isClick:before {
            content: "";
            /* transform: scale(1.6); */
            background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="black"><text x="4" y="15" font-size="20">+</text></svg>');
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
            transform-origin: 50% 50%;
            transform: scale(1.6) rotate(45deg);
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            animation: none;
        }

        .Anchor-Point-right-title {
            font-family: var(--anchor-Point-main-font-family);
            font-weight: var(--anchor-Point-main-font-weight);
            color: var(--anchor-Point-title-color-p);
            font-size: var(--anchor-Point-title-p-font-size);
        }

        .Anchor-Point-right-text {
            font-family: var(--anchor-Point-main-font-family);
            font-weight: var(--anchor-Point-main-font-weight);
            color: var(--anchor-Point-textarea-color-p);
            font-size: var(--anchor-Point-textarea-pc-font-size);
        }

        .Anchor-Point-right-box {
            background: #000;
        }

        .Anchor-Point-right-once {
            width: 100%;
            padding: 0 64px;
        }

        .Anchor-Point-m-div {
            width: 100%;
            position: relative;
            overflow: hidden;
            height: max-content;
        }

        .Anchor-Point-m-image-div {
            height: 100%;
            width: 100%;
            position: relative;
            background: #02060b;
            padding-bottom: 50px;
        }

        img.Anchor-Point-m-image {
            width: 100%;
            height: 100%;
        }
        .Anchor-Point-left-box-move{
            transform: translateX(-22%);
        }
        @keyframes expand {
            0% {
                width: 0;
                height: 0;
            }

            50% {
                width: 40px;
                height: 40px;
                opacity: 1;
            }

            100% {
                opacity: 0;
            }
        }


        .Anchor-Point-right-title {
            margin-bottom: 32px;
        }

        .Anchor-Point-right-text {
            max-height: max-content;
            min-height: 60px;
            margin-bottom: 32px;
        }

        .Anchor-Point-list {
            width: 760px;
            height: 400px;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
        }

        svg.placeholder {
            width: 100%;
            background: rgb(244, 247, 251);
        }

        .Anchor-Point-once-m {
            width: 2.5rem;
            height: 2.5rem;
            background: #fff;
            position: absolute;
            bottom: 15%;
            left: 50%;
            transform: translateX(-50%);
            border-radius: 50px;
        }
.Anchor-Point-main-div {
    background: #151617;
}
        .Anchor-Point-once-m::before {
            content: "";
            background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="black"><text x="4" y="15" font-size="20">+</text></svg>');
            background-repeat: no-repeat;
            width: 100%;
            height: 100%;
            background-position: center;
            animation: none;
            display: block;
            background-size: cover;
        }

        .Anchor-Ponit-once-title-m {
            position: absolute;
            bottom: auto;
            color: #fff;
            left: 50%;
            transform: translateX(-50%);
            width: max-content;
            font-size: 30px;
        }

        .Anchor-Point-m-main-box {
            position: fixed;
            top: 0;
            left: 0;
            width: 100vw;
            height: 100vh;
            background: #787878;
            z-index: 9999;
            padding: 32px 16px;
            overflow: auto;
            display: none;
        }

        .Anchor-Point-m-list-box {
            background: #fff;
            padding:0 16px 32px;
            border-radius: 24px;
            gap: 32px;
            display: flex;
            flex-wrap: wrap;
        }

        .Anchor-Point-m-once {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
        }

        .Anchor-Point-m-title {
            width: 100%;
            font-weight: 700;
            font-size: 16px;
        }

        img.Anchor-Point-m-img {
            width: 100%;
        }


        .Anchor-Point-m-clock-box {
            height: 60px;
            width: 100%;
            padding: 0 16px;
            display: flex;
            align-items: center;
            justify-content: right;
        }

        .Anchor-Point-m-clock-button {
            width: 40px;
            height: 40px;
            background: #000;
            border-radius: 50px;
            position: relative;
        }

        .Anchor-Point-m-clock-button::before {
            content: "";
            background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="white"><line x1="2" y1="2" x2="18" y2="18" stroke="white" stroke-width="2"/><line x1="2" y1="18" x2="18" y2="2" stroke="white" stroke-width="2"/></svg>');
            background-size: contain;
            background-repeat: no-repeat;
            background-position: center;
            width: 25px;
            height: 25px;
            left: 50%;
            top: 50%;
            position: absolute;
            transform: translate(-50%, -50%);
        }

        @media screen and (max-width:1920px) {
            .Anchor-Point-main-div {
                height: 824px;
            }
        }
        @media screen and (max-width:1800px) {
            .Anchor-Point-list{
                height: 320px;
                width: 608px;
            }
        }

        @media screen and (max-width:1440px) {
            .Anchor-Point-main-div {
                height: 618px;
            }

            .Anchor-Point-right-once {
                padding: 0 32px;
            }

            .Anchor-Point-right-title,
            .Anchor-Point-right-text {
                margin-bottom: 16px;
            }

            img.Anchor-Point-right-img {
                height: 350px;
            }
            img.Anchor-Point-image {
                object-fit: cover;
            }
            .Anchor-Point-list{
                /* transform: translate(-50%, -50%) scale(70%); */
                height: 280px;
                width: 532px;
            }
            .Anchor-Point-once{
                /* transform: scale(70%); */
                height: 21px;
                width: 21px;
            }
            .Anchor-Point-once:before{
                transform: translate(-50%, -50%) scale(70%);
            }
        }
        @media screen and (max-width:1300px) {
            .Anchor-Point-list{
                /* transform: translate(-50%, -50%) scale(65%); */
                height: 260px;
                width: 494px;
            }
            .Anchor-Point-once{
                /* transform: scale(65%); */
                height: 18.6px;
                width: 18.6px;
            }
            .Anchor-Point-once:before{
                transform: translate(-50%, -50%) scale(65%);
            }
        }
        @media screen and (max-width:1200px) {
            .Anchor-Point-list{
                /* transform: translate(-50%, -50%) scale(60%); */
                height: 240px;
                width: 456px;
            }
            .Anchor-Point-once{
                /* transform: scale(60%); */
                height: 18px;
                width: 18px;
            }
            .Anchor-Point-once:before{
                transform: translate(-50%, -50%) scale(60%);
            }
        }
        @media screen and (max-width:960px) {
            .Anchor-Point-main-div {
                height: 412px;
            }

            .Anchor-Point-right-once {
                padding: 0 16px;
            }

            .Anchor-Point-right-title,
            .Anchor-Point-right-text {
                margin-bottom: 8px;
            }

            img.Anchor-Point-right-img {
                height: 200px;
            }
            .Anchor-Point-list{
                /* transform: translate(-50%, -50%) scale(50%); */
                height: 200px;
                width: 380px;
            }
            .Anchor-Point-once{
                /* transform: scale(50%); */
                height: 15px;
                width: 15px;
            }
        }
        @media screen and (max-width:880px) {
            .Anchor-Point-list{
                /* transform: translate(-50%, -50%) scale(45%); */
                height: 180px;
                width: 342px;
            }
            .Anchor-Point-once{
                /* transform: scale(45%); */
                height: 13.5px;
                width: 13.5px;
            }
            .Anchor-Point-once:before{
                transform: translate(-50%, -50%) scale(45%);
            }
        }
        @media screen and (max-width:767px) {
            .Anchor-Point-main-div {
                display: none;
            }

            .Anchor-Point-m-title,
            .Anchor-Ponit-once-title-m {
                font-size: var(--anchor-Point-title-m-font-size);
                font-family: var(--anchor-Point-main-font-family);
            }

            .Anchor-Point-m-title {
                color: var(--anchor-Point-title-color-m);
            }

            .Anchor-Point-m-text {
                width: 100%;
                font-size: var(--anchor-Point-textarea-m-font-size);
                font-weight: var(--anchor-Point-main-font-weight);
                font-family: var(--anchor-Point-main-font-family);
                color: var(--anchor-Point-textarea-color-m);
            }
        }

        @media screen and (min-width:767.1px) {
            .Anchor-Point-m-div {
                display: none;
            }

            .Anchor-Point-m-main-box {
                display: none;
            }
        }

        @media screen and (min-width:1920.1px) {
            .Anchor-Point-div.page-width {
                max-width: none;
                width: 100%;
                background: #000;
            }
        }