 /* このCSSファイルは編集しないでください。
 
 /* リセットCSS */
 *,
 *::before,
 *::after {
     box-sizing: border-box;
 }
 
 * {
     margin: 0;
 }
 
 body {
     line-height: 1.5;
     -webkit-font-smoothing: antialiased;
 }
 
 img,
 picture,
 video,
 canvas,
 svg {
     display: block;
     max-width: 100%;
 }
 
 input,
 button,
 textarea,
 select {
     font: inherit;
 }
 
 p,
 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
     overflow-wrap: break-word;
 }
 
 ul {
     list-style: none;
     padding: 0;
     margin: 0;
 }
 
 a {
     text-decoration: none;
 }
 
 button {
     background: none;
     border: none;
     padding: 0;
     font: inherit;
     color: inherit;
     cursor: pointer;
 }
 
 
 #root,
 #__next {
     isolation: isolate;
 }

/* LPの基本CSS */

.main {
    position: relative;
}

.content {
    display: flex;
    justify-content: center;
    gap: 120px;
    padding-left: 50px;
    padding-right: 50px;
    margin-left: auto;
    margin-right: auto;
    max-width: 2000px;
}

.content:has(.left):has(.right) {
    max-width: 1940px;
}

.content:not(:has(.left)):not(:has(.right)) {
    max-width: 1000px;
}


.center {
    width: 1000px;
    flex-shrink: 0;
}

.content:not(:has(.left)):not(:has(.right)) .center {
    width: 100%;
}

.left,
.right {
    position: sticky;
    top: 0;
    left: 0;
    width: 460px;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media screen and (max-width: 1600px) {
    .content:has(.left):has(.right) .left, .content:has(.left):has(.right) .right {
        display: none;
    }
}

@media screen and (max-width: 1380px) {
    .left, .right {
        display: none;
    }
}

@media screen and (max-width: 800px) {
    .content {
        display: block;
        padding-left: 0;
        padding-right: 0;
    }
    .center {
        width: 100%;
    }
}


.left-content,
.right-content {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
}


.index {
    display: flex;
    flex-direction: column;
    width: fit-content;
}

.bt_box {
    position: relative;
    .bt_box_btn {
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: fit-content;
    }
    a {
        display: block;
        width: fit-content;
        img {
            width: 100%;
        }
    }
}

#footer {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 50px;
    height: 80px;
    font-size: 12px;
    background-color: #ffea00 !important;
    color: #172c3d!important;

    @media screen and (max-width: 700px) {
        height: 60px;
        font-size: 10px;
    }
}

/* アニメーション */
.animate_pulse {
    animation: pulse 2s ease-in-out infinite;
}

@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
} */
