html,
body,
h1,
h2,
h3,
h4,
ul,
ol,
dl,
li,
dt,
dd,
p,
div,
span,
img,
a,
table,
tr,
th,
td,
menu,
section,
article,
button,
input,
fieldset,
legend {
    background-color: rgba(0, 0, 0, 0);
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
    box-sizing: border-box
}

article,
header,
footer,
aside,
figure,
figcaption,
nav,
section {
    display: block
}

body {
    line-height: 1;
    text-size-adjust: 100%
}

ol,
ul {
    list-style: none;
    list-style-type: none
}

em,
address {
    font-style: normal
}

figure {
    margin: 0
}

html {
    -webkit-text-size-adjust: 100%
}

html,
body {
    height: 100%
}

body {
    font-family: Roboto, "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
    line-height: 200%;
    color: #333;
    font-size: clamp(1rem, .063rem + 1.04vw, 1.313rem);
    font-weight: 300;
    overflow-wrap: anywhere;
    word-break: normal;
    line-break: strict;
    background: #0B0B2F;
    position: relative;
    word-break: break-word;
    overflow-wrap: break-word;
    word-wrap: break-word;
    accent-color: #1a2792
}

html,
body {
    height: 100%;
}

/* ラジアルグラデーション */
body {
    min-height: 100vh;
    background: radial-gradient(circle, #153448 0%, #0B0B2F 100%);
    background-attachment: fixed;
    background-size: cover;
    margin: 0;
    padding: 0;
}

a {
    color: #333;
    text-decoration: none;
    cursor: pointer;
    transition: all .3s ease-in-out
}

a:not([class*=c-btn]) {
    border-bottom: solid 1px rgba(0, 0, 0, 0)
}

a img {
    transition: all .3s ease-in-out
}

a:hover img,
a:hover svg {
    opacity: .8
}

@media(hover: hover)and (pointer: fine) {
    a:not([class*=c-btn]):hover {
        border-color: #333
    }

    a:not([class*=c-btn]).u-fc--w:hover {
        border-color: #fff
    }
}

p {
    line-height: 200%
}

p+p {
    /* margin-top: .85em */
}

p:last-child {
    margin-bottom: 0
}

img,
svg {
    max-width: 100%;
    height: auto
}

img {
    opacity: 1;
    vertical-align: bottom
}

img[data-src] {
    opacity: 0
}

video {
    max-width: 100%
}

[type=reset],
[type=submit],
button,
html [type=button] {
    -webkit-appearance: button;
    color: #333;
    font-family: Roboto, "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
    font-size: 100%;
    transition: all .3s ease-in-out
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: 100%;
    font-weight: 600
}

em,
strong {
    font-weight: bold
}

area {
    cursor: pointer
}

section,
main,
footer,
aside {
    display: block
}

time {
    display: inline-block
}

* {
    -webkit-font-smoothing: antialiased
}

*:focus-visible {
    outline: 1px solid #1a2792;
    outline-offset: 0px
}

@media only screen and (max-width:1279px) {
    body {
        line-height: 1.4;
        font-size: 14px;
        background: radial-gradient(circle, #051E2D 0%, #0B0B2F 50%);
    }
}

@media only screen and (max-width:440px) {
    body {
        line-height: 200%;
        font-size: clamp(1rem, .063rem + 1.04vw, 1.313rem);
        background: radial-gradient(circle, #051E2D 0%, #0B0B2F 50%);
    }
}

@media print {
    @page {
        size: A4 portrait;
        margin: 15mm 10mm
    }

    html,
    body,
    #l-wrap {
        height: auto
    }

    .is-page-break-avoid {
        break-before: avoid-page !important
    }
}

.l-inner {
    margin: auto clamp(10.25rem, 2.75rem + 8.33vw, 12.75rem) auto calc((8.3333333333% - clamp(2rem, .125rem + 2.08vw, 2.625rem))*2 + 50px + clamp(2rem, .125rem + 2.08vw, 2.625rem)*2);
    /* margin: auto 7.5rem; */
    container-type: inline-size
}

@media only screen and (max-width:1279px) {
    .l-inner {
        width: 100%;
        padding: 0 16px 80px;
        margin: auto
    }
}

.l-header {
    background-color: hsla(0, 0%, 100%, .65);
    border-radius: 8px;
    backdrop-filter: blur(8px);
    padding: clamp(.75rem, -.15rem + 1vw, 1.05rem) clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    display: grid;
    grid-template-columns: minmax(180px, auto) 1fr clamp(22rem, 2.313rem + 21.88vw, 28.563rem);
    align-items: center;
    /* gap: 4px clamp(.75rem, -.15rem + 1vw, 1.05rem); */
    grid-template-areas: "a b c";
    position: fixed;
    top: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    left: 50px;
    right: 50px;
    z-index: 3
}

.l-header__title {
    display: flex;
    text-transform: uppercase;
    color: #1a2792;
    letter-spacing: 4px;
    grid-area: a
}

.l-header__title a[target="_blank"]:after {
    display: none;
    content: none;
}

.l-header__title a {
    border-width: 0
}

.l-header__menu {
    display: flex;
    justify-content: flex-end;
    margin-left: auto;
    gap: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    width: 100%;
    grid-area: b
}

.l-header__menu>li {
    position: relative;
    display: flex;
    align-items: center
}

.l-header__menu>li:last-child {
    margin-right: 20px;
}

.l-header__menu-btn {
    display: none
}

.l-header__menu-icon {
    display: none
}

.l-header__tools {
    grid-area: c;
    display: flex;
    gap: clamp(.75rem, -.15rem + 1vw, 1.05rem);
    justify-content: flex-end
}

.l-header__tools [class*=c-btn] {
    white-space: nowrap
}


.l-header__menu li a[target="_blank"]::after {
    content: none;
    background-image: none;
}

.l-header__menu li a[href*="youtube.com"][target="_blank"]::after,
.l-header__menu li a[href*="tech.scsk.jp"][target="_blank"]::after {
    content: "";
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin-left: 0.3em;
    width: 1em;
    height: 1em;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M18%2019H6C5.45%2019%205%2018.55%205%2018V6C5%205.45%205.45%205%206%205H11C11.55%205%2012%204.55%2012%204C12%203.45%2011.55%203%2011%203H5C3.89%203%203%203.9%203%205V19C3%2020.1%203.9%2021%205%2021H19C20.1%2021%2021%2020.1%2021%2019V13C21%2012.45%2020.55%2012%2020%2012C19.45%2012%2019%2012.45%2019%2013V18C19%2018.55%2018.55%2019%2018%2019ZM14%204C14%204.55%2014.45%205%2015%205H17.59L8.46%2014.13C8.07%2014.52%208.07%2015.15%208.46%2015.54C8.85%2015.93%209.48%2015.93%209.87%2015.54L19%206.41V9C19%209.55%2019.45%2010%2020%2010C20.55%2010%2021%209.55%2021%209V4C21%203.45%2020.55%203%2020%203H15C14.45%203%2014%203.45%2014%204Z%22%2F%3E%3C%2Fsvg%3E");
}

@media only screen and (min-width:1280px) {
    .l-header__title--sp {
        display: none
    }

    .l-header__menu-icon-wrap {
        display: none
    }
}

@media only screen and (max-width:1279px) {
    .l-header {
        border-radius: 8px;
        background-color: initial;
        backdrop-filter: initial;
        padding: 0;
        top: initial;
        left: 16px;
        right: 16px;
        bottom: 68px;
        display: flex;
        flex-direction: column;
        gap: 16px;
        width: calc(100% - 32px - 24px);
        padding: 32px 12px
    }

    .l-header__title,
    .l-header__menu,
    .l-header__tools {
        display: none
    }

    .l-header__title {
        align-self: flex-start
    }

    .l-header__title img {
        width: 87px
    }

    .l-header__title--sp {
        position: absolute;
        padding: 20px 16px;
        z-index: 10;
    }

    .l-header__title--sp img {
        width: 80px
    }

    .l-header__title--sp a[target="_blank"]:after {
        display: none;
        content: none;
    }

    .l-header__menu {
        margin-left: initial;
        width: 100%
    }

    .l-header__menu li {
        border-bottom: 1px solid #ebebeb;
        padding: 9px 4px
    }

    .l-header__menu li:last-child {
        border-bottom-width: 0
    }

    .l-header__menu li a {
        display: block;
        width: 100%;
        padding: 9px 4px;
        margin: -9px -4px;
        width: calc(100% + 8px)
    }

    .l-header__menu li a:hover {
        border-bottom-color: rgba(0, 0, 0, 0)
    }

    .l-header__menu-icon {
        background-color: #333;
        opacity: .9;
        border-radius: 0 8px 8px 0;
        box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, .25);
        display: flex;
        position: fixed;
        bottom: 16px;
        width: 40px;
        left: calc(50% + 154px);
        transform: translateX(-50%);
        height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        margin: 0;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
        transition: all .3s ease-in-out
    }

    .l-header__menu-icon:after {
        content: "";
        content: "";
        position: relative;
        display: inline-block;
        top: 0;
        vertical-align: middle;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: contain;
        z-index: 0;
        width: 1em;
        height: 1em;
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2214%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M1%2C0C.45%2C0%2C0%2C.45%2C0%2C1s.45%2C1%2C1%2C1h18c.55%2C0%2C1-.45%2C1-1s-.45-1-1-1H1ZM1%2C6c-.55%2C0-1%2C.45-1%2C1s.45%2C1%2C1%2C1h18c.55%2C0%2C1-.45%2C1-1s-.45-1-1-1H1ZM1%2C12c-.55%2C0-1%2C.45-1%2C1s.45%2C1%2C1%2C1h18c.55%2C0%2C1-.45%2C1-1s-.45-1-1-1H1Z%22%2F%3E%3C%2Fsvg%3E")
    }

    .l-header__menu__navicon-tit {
        display: none
    }

    .l-header:has(.l-header__menu-btn:checked) {
        background: #fff;
        box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, .15)
    }

    .l-header:has(.l-header__menu-btn:checked) .l-header__title,
    .l-header:has(.l-header__menu-btn:checked) .l-header__menu,
    .l-header:has(.l-header__menu-btn:checked) .l-header__tools {
        transition: all .3s ease-in-out;
        opacity: 1;
        display: block;
        transform: scale(1, 1);
        transform-origin: top
    }

    @starting-style {

        .l-header:has(.l-header__menu-btn:checked) .l-header__title,
        .l-header:has(.l-header__menu-btn:checked) .l-header__menu,
        .l-header:has(.l-header__menu-btn:checked) .l-header__tools {
            opacity: 0;
            translate: 0 -10px
        }
    }

    .l-header:has(.l-header__menu-btn:checked) .l-header__menu a,
    .l-header:has(.l-header__menu-btn:checked) .l-header__menu li {
        opacity: 1;
        transition: all .3s ease-in-out
    }

    .l-header:has(.l-header__menu-btn:checked) .l-header__menu-icon::after {
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2222%22%20height%3D%2222%22%3E%3Cpolygon%20fill%3D%22%23fff%22%20points%3D%2222%201.45%2020.55%200%2011%209.55%201.45%200%200%201.45%209.55%2011%200%2020.55%201.45%2022%2011%2012.45%2020.55%2022%2022%2020.55%2012.45%2011%2022%201.45%22%2F%3E%3C%2Fsvg%3E")
    }

    .l-header:has(.l-header__menu-btn:checked) .l-header__tools {
        display: flex;
        flex-direction: column;
        gap: 12px
    }

    .l-header:has(.l-header__menu-btn:checked)+.l-main::before {
        z-index: 1
    }

    body:not(:has(.p-ai)) .l-header__menu-icon {
        background-color: rgba(0, 0, 0, 0);
        box-shadow: initial;
        opacity: initial;
        position: absolute;
        top: 0;
        right: 0;
        bottom: initial;
        left: initial;
        transform: none
    }

    body:not(:has(.p-ai)) .l-header__menu-icon-wrap {
        background-color: #333;
        opacity: .9;
        border-radius: 8px;
        box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, .25);
        display: flex;
        position: fixed;
        bottom: 16px;
        width: calc(100% - 32px);
        left: 16px;
        height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        margin: 0;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
    }

    body:not(:has(.p-ai)) .l-header__menu__navicon-tit {
        color: #fff;
        display: initial
    }

    body:not(:has(.p-ai)) .l-header__menu__navicon-tit.is-open {
        display: none
    }

    body:not(:has(.p-ai)) .l-header:has(.l-header__menu-btn:checked) .l-header__menu__navicon-tit.is-open {
        display: inline
    }

    body:not(:has(.p-ai)) .l-header:has(.l-header__menu-btn:checked) .l-header__menu__navicon-tit.is-close {
        display: none
    }

    body:has(.p-top) .l-header__title--sp {
        display: none
    }
}

#l-wrap {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 100vh
}

#l-wrap>* {
    flex: 1 0 auto
}

.l-main {
    position: relative;
    padding-top: clamp(0, -1.5rem + 10vw, 10.5rem);
    overflow: clip
}

.l-sec {
    padding: clamp(5rem, -0.063rem + 5.63vw, 6.688rem) 0;
    position: relative
}

.l-sec:first-child {
    padding-top: 0
}

.l-sec--l {
    padding: clamp(7.5rem, 8.33vw, 10rem) 0;
    background-color: #0B0B2F;
}

.l-sec__bg img {
    position: absolute;
    z-index: 0;
    opacity: .8
}

@media only screen and (max-width:1279px) {
    .l-main {
        padding-top: 0;
        position: relative
    }

    .l-main::before {
        content: "";
        background-color: hsla(0, 0%, 100%, .2);
        backdrop-filter: blur(6px);
        position: fixed;
        display: block;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1
    }

    .l-sec {
        padding: 56px 0 0 0
    }
}

footer {
    padding: 55px 40px 48px;
    background-color: #0b0b2F;
    line-height: 1.5
}

@media screen and (max-width: 767px) {
    footer {
        padding: 40px 16px 90px
    }
}

footer .ftr_block {
    max-width: 1480px;
    margin: 0 auto
}

footer .ftr_fb {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: clamp(20px, 10%, 26px)
}

@media screen and (max-width: 767px) {
    footer .ftr_fb {
        display: block
    }
}

footer .ftr_main {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

@media screen and (max-width: 767px) {
    footer .ftr_main {
        padding-bottom: 50px
    }
}

footer .ftr_logo {
    width: 25%;
    max-width: 310px
}

@media screen and (max-width: 767px) {
    footer .ftr_logo {
        width: 55%;
        max-width: 200px;
        padding-bottom: 10px
    }
}

@media(hover: hover)and (pointer: fine) {
    footer .ftr_logo a:hover {
        border-bottom: solid 1px rgba(0, 0, 0, 0)
    }
}

footer .ftr_logo img {
    width: 100%
}

footer .ftr_ttl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 50px
}

@media screen and (max-width: 767px) {
    footer .ftr_ttl {
        display: block
    }
}

footer .ftr_ttl p {
    font-family: "Manrope", sans-serif;
    font-weight: 800;
    color: #fff;
    -webkit-transform: skew(-8deg);
    transform: skew(-8deg);
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    font-size: min(4vw, 35px)
}

@media screen and (max-width: 767px) {
    footer .ftr_ttl p {
        font-size: max(5vw, 20px)
    }
}

footer .ftr_youtube {
    display: inline-block
}

@media screen and (max-width: 767px) {
    footer .ftr_youtube {
        padding-top: 15px
    }
}

footer .ftr_youtube a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    font-style: italic;
    font-weight: bold;
    color: #fff;
    text-decoration: none
}

footer .ftr_youtube a .ftr_youtube_icon {
    display: block;
    padding-top: 5px
}

footer .ftr_list {
    padding-top: 25px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 50%;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

@media screen and (max-width: 767px) {
    footer .ftr_list {
        flex-direction: column;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
}

@media screen and (max-width: 767px) {
    footer .ftr_list li {
        width: 60%;
        padding: 10px 0
    }
}

@media screen and (max-width: 480px) {
    footer .ftr_list li {
        width: 100%;
        padding: 10px 0
    }
}

footer .ftr_list li:after {
    content: "/";
    font-size: 12px;
    color: #fff;
    opacity: .3;
    padding: 0 9px
}

@media screen and (max-width: 767px) {
    footer .ftr_list li:after {
        content: "";
        padding: 0
    }
}

footer .ftr_list li:last-child:after {
    content: ""
}

footer .ftr_list a {
    font-size: 13px;
    letter-spacing: .04em;
    color: #fff
}

footer .ftr_cr {
    font-size: 12px;
    color: #fff;
    opacity: .5;
    padding-top: 10px
}

@-webkit-keyframes action1 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(50px);
        transform: translateY(50px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes action1 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(50px);
        transform: translateY(50px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes action2 {
    0% {
        opacity: 0;
        -webkit-transform: scale(1.5);
        transform: scale(1.5)
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes action2 {
    0% {
        opacity: 0;
        -webkit-transform: scale(1.5);
        transform: scale(1.5)
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@-webkit-keyframes action3 {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.9);
        transform: scale(0.9)
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes action3 {
    0% {
        opacity: 0;
        -webkit-transform: scale(0.9);
        transform: scale(0.9)
    }

    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@-webkit-keyframes action4 {
    0% {
        opacity: 0;
        -webkit-transform-origin: right top;
        transform-origin: right top;
        -webkit-transform: rotate(-20deg) translateY(120px);
        transform: rotate(-20deg) translateY(120px)
    }

    100% {
        opacity: 1;
        -webkit-transform: rotate(0deg) translateY(0px);
        transform: rotate(0deg) translateY(0px)
    }
}

@keyframes action4 {
    0% {
        opacity: 0;
        -webkit-transform-origin: right top;
        transform-origin: right top;
        -webkit-transform: rotate(-20deg) translateY(120px);
        transform: rotate(-20deg) translateY(120px)
    }

    100% {
        opacity: 1;
        -webkit-transform: rotate(0deg) translateY(0px);
        transform: rotate(0deg) translateY(0px)
    }
}

@-webkit-keyframes action5 {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100px);
        transform: translateX(-100px)
    }

    100% {
        opacity: 1
    }
}

@keyframes action5 {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-100px);
        transform: translateX(-100px)
    }

    100% {
        opacity: 1
    }
}

footer a[target=_blank]:after,
footer a[href*=".pdf"]:after {
    content: none
}

footer a:not([class*=c-btn]):hover {
    border-color: #fff
}

footer a:hover img,
footer a:hover svg {
    opacity: initial
}

footer .ftr_logo a {
    border-width: 0
}

footer .ftr_logo a:hover {
    border-width: 0
}

footer .ftr_logo a:hover img,
footer .ftr_logo a:hover svg {
    opacity: initial
}

[class*=c-badge-] {
    color: #0B0B2F;
    font-size: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 1px;
    border: 1px solid #0B0B2F;
    border-radius: 4px;
    background: #fff;
    display: inline-flex;
    padding: clamp(.25rem, -.05rem + .3333333333vw, .35rem) clamp(.75rem, -.15rem + 1vw, 1.05rem);
    justify-content: center;
    align-items: center;
    gap: 10px
}

.c-btn [class*=c-badge-] {
    position: relative;
    top: -1px
}

a[class*=c-badge-]:hover,
a[class*=c-badge-]:foucus {
    text-decoration: none;
    cursor: pointer
}

.c-badge--secondary {
    color: #333;
    font-feature-settings: "palt" on;
    font-size: clamp(.875rem, -.175rem + 1.1666666667vw, 1.225rem);
    font-weight: 600;
    line-height: 150%;
    letter-spacing: .7px;
    background-color: #e6f6fa;
    border-width: 0;
    padding: 3px clamp(.75rem, -.15rem + 1vw, 1.05rem);
    gap: 10px
}

.c-badge--lb {
    color: #1A2940;
    font-size: clamp(1rem, -.175rem + 1.1666666667vw, 1.225rem);
    font-weight: 600;
    line-height: 180%;
    letter-spacing: .42px;
    border-width: 0;
    background-color: #89FF9B;
}

.c-badge--lb.no-radius {
    border-radius: 0 !important;
}

.c-badge--base,
.c-badge--base--circle {
    color: #fff;
    background-color: #1a2792;
    border-width: 0;
    font-weight: 300;
    font-size: clamp(.75rem, -.15rem + 1vw, 1.05rem);
    border-radius: 4px;
    padding: clamp(.125rem, -.025rem + .1666666667vw, .175rem) clamp(.5rem, -.1rem + .6666666667vw, .7rem)
}

.c-badge--base--circle,
.c-badge--base--circle--circle {
    border-radius: 1em
}

.c-badge--outline {
    font-size: clamp(.625rem, -0.125rem + .8333333333vw, .875rem);
    font-weight: 600;
    color: #1a2792;
    border: 1px solid #1a2792;
    border-radius: 4px;
    background-color: rgba(0, 0, 0, 0);
    line-height: 1.5;
    padding: 0 clamp(.25rem, -.05rem + .3333333333vw, .35rem)
}

[class*=c-box--],
.c-box {
    background-color: #fff;
    border-radius: 8px;
    padding: clamp(1.5rem, -.3rem + 2vw, 2.1rem) clamp(1.5rem, -.3rem + 2vw, 2.1rem);
    margin: clamp(3rem, -.6rem + 4vw, 4.2rem) 0
}

.c-box.no-radius {
    border-radius: 0;
}

[class*=c-box--]:last-child,
.c-box:last-child {
    margin-bottom: 0
}

[class*=c-box--]:first-child,
.c-box:first-child {
    margin-top: 0
}

[class*=c-box--] p:last-child,
.c-box p:last-child {
    margin-bottom: 0
}

[class*=c-box--]:has(.c-box__tit),
.c-box:has(.c-box__tit) {
    padding-top: 0
}

.u-gridlist>[class*=c-box--],
.u-gridlist .c-box {
    margin: 0
}

.c-box__tit {
    color: #fff;
    font-weight: 600;
    letter-spacing: .8px;
    line-height: 200%;
    background-color: #0B0B2F;
    padding: clamp(.75rem, -.15rem + 1vw, 1.05rem) clamp(1.5rem, -.3rem + 2vw, 2.1rem);
    margin: 0 calc(clamp(1.5rem, 1.67vw, 2rem)*-1) clamp(1.5rem, -.3rem + 2vw, 2.1rem) calc(clamp(1.5rem, 1.67vw, 2rem)*-1);
    position: relative
}

.c-box__desc {
    letter-spacing: -1px;
}

.c-box__tit__tit {
    font-size: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem);
    line-height: 125%;
    font-weight: 600;
    position: relative;
    z-index: 1
}

.c-box__tit__tit:not(:first-child) {
    margin-top: 8px
}

.c-box__tit__img {
    position: absolute;
    right: clamp(1.5rem, -.3rem + 2vw, 2.1rem);
    top: clamp(.75rem, -.15rem + 1vw, 1.05rem);
    height: calc(100% - clamp(1.5rem, -.3rem + 2vw, 2.1rem)*1);
    width: clamp(5rem, -1rem + 6.6666666667vw, 7rem);
    z-index: 0
}

.c-box__tit__img img {
    max-height: 100%;
    width: 100%
}

.c-box.no-radius p {
    padding-left: 1em;
    text-indent: -1em;
    letter-spacing: -1px;
}

@media only screen and (max-width:1279px) {

    [class*=c-box--],
    .c-box {
        padding: clamp(1.5rem, -.3rem + 2vw, 2.1rem) 12px;
        margin: 32px 0
    }

    .c-box__tit {
        padding: clamp(.75rem, -.15rem + 1vw, 1.05rem) 12px;
        margin: 0 -12px clamp(1.5rem, -.3rem + 2vw, 2.1rem) -12px
    }

    .c-box__tit__tit {
        font-size: 24px
    }

    .c-box__tit__img {
        right: 6px;
        width: 100px;
        height: 100px
    }
}

@media (max-width: 560px) {
    .c-box__tit__img img {
        display: none;
    }
}

@media only screen and (max-width:440px) {
    .c-box__tit span {
        font-size: 1rem;
    }

    .c-box__tit h3 {
        font-size: 1.1rem;
    }
}

[class*=c-btn] {
    color: #fff;
    background: #1a2792 linear-gradient(90deg, #0b103d 0%, #1a2792 50%, #1a2792 100%);
    background-position: 99% 100%;
    background-size: 200%;
    font-weight: 600;
    border-radius: 28px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
    vertical-align: baseline;
    user-select: none;
    text-decoration: none;
    position: relative;
    inline-size: fit-content;
    touch-action: manipulation;
    cursor: pointer;
    padding: clamp(.375rem, -.075rem + .5vw, .525rem) clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem);
    width: clamp(18.5rem, .125rem + 20.42vw, 24.625rem);
    max-width: 100%;
    transition: all .3s ease-in-out
}

[class*=c-btn] [class*=c-badge-] {
    transition: all .3s ease-in-out
}

a[class*=c-btn]:hover {
    color: #fff;
    text-decoration: none
}

.c-btn:active,
.c-btn:hover {
    background-position: 0 50%
}

.c-btn:disabled,
.c-btn--disabled {
    cursor: not-allowed;
    opacity: .5
}

.c-btn--size {
    width: clamp(18.5rem, .125rem + 20.42vw, 24.625rem)
}

.c-btn--next {
    gap: clamp(.25rem, -.05rem + .3333333333vw, .35rem);
    padding-left: clamp(2.75rem, -.55rem + 3.6666666667vw, 3.85rem);
    padding-right: clamp(2.75rem, -.55rem + 3.6666666667vw, 3.85rem);
    position: relative
}

.c-btn--next:active,
.c-btn--next:hover {
    background-position: 0 50%
}

.c-btn--next:after {
    content: "";
    position: relative;
    display: inline-block;
    top: 0;
    vertical-align: middle;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 0;
    width: 1em;
    height: 1em;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226.59%22%20height%3D%2211.17%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M.29.29C-.1.68-.1%2C1.31.29%2C1.7l3.88%2C3.88L.29%2C9.46c-.39.39-.39%2C1.02%2C0%2C1.41.39.39%2C1.02.39%2C1.41%2C0l4.59-4.59c.39-.39.39-1.02%2C0-1.41L1.7.28c-.38-.38-1.02-.38-1.41.01Z%22%2F%3E%3C%2Fsvg%3E");
    transition: all .3s ease-in-out;
    width: clamp(.75rem, -.15rem + 1vw, 1.05rem);
    height: clamp(.75rem, -.15rem + 1vw, 1.05rem);
    position: absolute;
    right: clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem);
    top: 50%;
    transform: translateY(-50%)
}

.c-btn--next.c-btn--secondary:after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226.59%22%20height%3D%2211.17%22%3E%3Cpath%20fill%3D%22%231a2792%22%20d%3D%22M.29.29C-.1.68-.1%2C1.31.29%2C1.7l3.88%2C3.88L.29%2C9.46c-.39.39-.39%2C1.02%2C0%2C1.41.39.39%2C1.02.39%2C1.41%2C0l4.59-4.59c.39-.39.39-1.02%2C0-1.41L1.7.28c-.38-.38-1.02-.38-1.41.01Z%22%2F%3E%3C%2Fsvg%3E")
}

.c-btn--next.c-btn--secondary:hover:after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226.59%22%20height%3D%2211.17%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M.29.29C-.1.68-.1%2C1.31.29%2C1.7l3.88%2C3.88L.29%2C9.46c-.39.39-.39%2C1.02%2C0%2C1.41.39.39%2C1.02.39%2C1.41%2C0l4.59-4.59c.39-.39.39-1.02%2C0-1.41L1.7.28c-.38-.38-1.02-.38-1.41.01Z%22%2F%3E%3C%2Fsvg%3E")
}

.c-btn--secondary {
    color: #1A2792;
    background: #fff;
    outline: 2px solid #1A2792;
}

.c-btn--secondary:hover {
    color: #fff;
    background-color: #1a2792;
    outline: 1px solid #1a2792;
}

.is-contact-btn.c-btn--secondary {
    color: #1A2940;
    outline: 2px solid #fff;
}

.is-contact-btn.c-btn--secondary:hover {
    color: #fff;
    background-color: #0B0B2F;
    outline: 1px solid #fff;
}

.c-btn--secondary--grd {
    color: #1a2792;
    background: #fff;
    outline: 2px solid #1a2792
}

.c-btn--secondary--grd:hover {
    outline: 0;
    background-color: initial;
    background: #1a2792 linear-gradient(90deg, #0b103d 0%, #1a2792 50%, #1a2792 100%);
    background-position: 0 50%
}

.c-btn--secondary--grd:hover [class*=c-badge-] {
    color: #1a2792;
    background: #fff
}

.c-btn--secondary--grd [class*=c-badge-] {
    transition: all .3s ease-in-out
}

@media only screen and (max-width:1279px) {
    [class*=c-btn] {
        min-height: 44px
    }
}

.sns-tit {
    color: #fff;
    font-size: 43px;
    margin-top: 1rem;
}

@media only screen and (max-width:440px) {
    .sns-tit {
        font-size: 32px;
    }
}

.c-card {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: min-content;
    grid-auto-rows: auto;
    gap: clamp(2rem, .125rem + 2.08vw, 2.625rem);
    position: relative;
    position: relative
}

.c-card>* {
    background-color: #fff;
    overflow: auto;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: clamp(.75rem, -.15rem + 1vw, 1.05rem) 0;
    padding-bottom: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    overflow: visible
}

.c-card__tit {
    color: #0b103d;
    font-size: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    font-weight: 600;
    letter-spacing: .05em
}

.c-card__tit__read {
    color: #333;
    font-size: clamp(.8125rem, -.1625rem + 1.0833333333vw, 1.1375rem);
    font-weight: 600;
    line-height: 150%;
    display: block
}

.c-card__img {
    aspect-ratio: 31/21;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    margin-bottom: 20px;
}

.c-card__img:not(:has(img)) {
    border-width: 0;
    padding: 0
}

.c-card__title {
    color: #fff;

}

.c-card__txt {
    color: #fff;
    padding: 20px 0;
    font-weight: 300;
    letter-spacing: -1px
}

.c-card__link {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem)
}

.c-card__link [class*=c-btn] {
    width: 100%
}

.c-card__link a {
    font-weight: 600
}

a.c-btn--secondary[target="_blank"] {
    position: relative;
}

.c-card--bdr {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: min-content;
    grid-auto-rows: auto;
    gap: clamp(8rem, .125rem + 2.08vw, 2.625rem);
    position: relative;
    grid-template-columns: repeat(2, 1fr)
}


.c-card--bdr article:first-child {
    position: relative;
}

.c-card--bdr article:first-child::after {
    content: '';
    position: absolute;
    top: 0px;
    right: -65px;
    width: 1px;
    height: 100%;
    background: #BAFFC5;
}

.c-card--bdr .c-card__tit {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: clamp(.5rem, -.1rem + .6666666667vw, .7rem)
}

.c-card--bdr .c-card__img {
    aspect-ratio: 16/9;
    border-width: 0
}

.c-card--bdr .c-card__link {
    align-items: flex-end;
    margin-top: auto
}

.c-card--bdr--thin {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: min-content;
    grid-auto-rows: auto;
    gap: clamp(2rem, .125rem + 2.08vw, 2.625rem);
    position: relative;
    grid-template-columns: repeat(auto-fit, minmax(clamp(21.75rem, -4.35rem + 29vw, 30.45rem), 1fr))
}

.c-card--bdr--thin>* {
    background-color: #fff;
    overflow: auto;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: clamp(.75rem, -.15rem + 1vw, 1.05rem) 0;
    padding-bottom: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    overflow: visible;
    border-radius: 8px;
    border: 1px solid #ebebeb
}

.c-card--bdr--thin__link {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 0;
    color: rgba(0, 0, 0, 0);
    overflow: hidden;
    text-indent: -100%;
    white-space: nowrap;
    display: table-column;
    border-bottom-width: 0 !important;
    z-index: 1
}

.c-card--bdr--thin__link:hover {
    border-bottom-width: 0 !important;
    background-color: hsla(0, 0%, 100%, .2)
}

.c-card--bdr--thin__link::after {
    content: none !important
}

.c-card--bdr--thin__img {
    border-radius: 8px 8px 0 0;
    aspect-ratio: 9/4;
    overflow: hidden;
    display: flex
}

.c-card--bdr--thin__img img {
    object-fit: cover;
    min-height: 100%;
    min-width: 100%;
    max-width: initial
}

.c-card--bdr--thin__txt {
    padding: clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem) clamp(.75rem, -.15rem + 1vw, 1.05rem)
}

.c-card--bdr--thin__tit {
    font-size: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem)
}

.c-card--bdr--thin:has(a[target=_blank]) .c-card--bdr--thin__tit {
    display: inline-flex;
    align-items: center;
    gap: 4px
}

.c-card--bdr--thin:has(a[target=_blank]) .c-card--bdr--thin__tit:after {
    content: "";
    position: relative;
    display: inline-block;
    top: 0;
    vertical-align: middle;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 0;
    width: 1em;
    height: 1em;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M18%2019H6C5.45%2019%205%2018.55%205%2018V6C5%205.45%205.45%205%206%205H11C11.55%205%2012%204.55%2012%204C12%203.45%2011.55%203%2011%203H5C3.89%203%203%203.9%203%205V19C3%2020.1%203.9%2021%205%2021H19C20.1%2021%2021%2020.1%2021%2019V13C21%2012.45%2020.55%2012%2020%2012C19.45%2012%2019%2012.45%2019%2013V18C19%2018.55%2018.55%2019%2018%2019ZM14%204C14%204.55%2014.45%205%2015%205H17.59L8.46%2014.13C8.07%2014.52%208.07%2015.15%208.46%2015.54C8.85%2015.93%209.48%2015.93%209.87%2015.54L19%206.41V9C19%209.55%2019.45%2010%2020%2010C20.55%2010%2021%209.55%2021%209V4C21%203.45%2020.55%203%2020%203H15C14.45%203%2014%203.45%2014%204Z%22%2F%3E%3C%2Fsvg%3E");
    width: .8em;
    height: .8em
}

.c-card--flame {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: min-content;
    grid-auto-rows: auto;
    gap: clamp(2rem, .125rem + 2.08vw, 2.625rem);
    position: relative;
    grid-template-columns: repeat(auto-fit, minmax(clamp(21.75rem, -4.35rem + 29vw, 30.45rem), 1fr));
    grid-template-rows: 1fr;
    grid-auto-rows: 1fr
}

.c-card--flame>* {
    transition: all .3s ease-in-out;
    filter: drop-shadow(0px 4px 16px rgba(11, 16, 61, 0.1));
    display: grid;
    gap: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem);
    grid-template-columns: 1fr clamp(3.75rem, -0.75rem + 5vw, 5.25rem);
    grid-template-rows: clamp(3.75rem, -0.75rem + 5vw, 5.25rem) 1fr;
    grid-template-areas: "a b" "c c" "d d";
    background-color: initial;
    position: relative;
    padding: clamp(2.375rem, -.475rem + 3.1666666667vw, 3.325rem) clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    filter: drop-shadow(0px 4px 16px rgba(11, 16, 61, 0.1))
}

.c-card--flame>*::before {
    background-color: #fff;
    clip-path: polygon(0 0, calc(100% - 28px) 0, 100% 28px, 100% 100%, 28px 100%, 0 calc(100% - 28px));
    content: "";
    display: block;
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 0;
    left: 0;
    top: 0
}

.c-card--flame>*::before {
    transition: all .3s ease-in-out
}

.c-card--flame>*:hover {
    /* color: #fff */
}

.c-card--flame>*:hover .c-card--flame__tit {
    /* color: #fff */
}

.c-card--flame>*:hover .c-btn--next {
    /* background: #fff;
    color: #1a2792 */
}

.c-card--flame>*:hover .c-btn--next::after {
    /* background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226.59%22%20height%3D%2211.17%22%3E%3Cpath%20fill%3D%22%231a2792%22%20d%3D%22M.29.29C-.1.68-.1%2C1.31.29%2C1.7l3.88%2C3.88L.29%2C9.46c-.39.39-.39%2C1.02%2C0%2C1.41.39.39%2C1.02.39%2C1.41%2C0l4.59-4.59c.39-.39.39-1.02%2C0-1.41L1.7.28c-.38-.38-1.02-.38-1.41.01Z%22%2F%3E%3C%2Fsvg%3E") */
}

.c-card--flame>*:hover::before {
    /* background-color: #1a2792 */
}

.c-card--flame>*>* {
    position: relative;
    z-index: 1
}

.c-card--flame__tit {
    color: #00a6cb;
    font-size: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    align-self: center;
    grid-area: a;
    transition: all .3s ease-in-out
}

.c-card--flame__img {
    grid-area: b;
    display: flex
}

.c-card--flame__img img {
    height: 100%
}

.c-card--flame__txt {
    grid-area: c
}

.c-card--flame__footer {
    text-align: center;
    grid-area: d
}

.c-card--slide {
    display: flex;
    gap: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem);
    position: absolute;
    top: 0;
    left: 0;
}

.c-card--slide-wrap {
    position: relative;
    display: flex;
    flex-direction: column;
    /* タッチで横スクロール可能にする */
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflscrolling: touch;
    scroll-behavior: smooth;

}

.c-card--slide>* {
    border-radius: 8px;
    flex: 0 0 clamp(21.75rem, -4.35rem + 29vw, 30.45rem);
    background-color: #fff;
    overflow: auto;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: clamp(.75rem, -.15rem + 1vw, 1.05rem) 0;
    padding-bottom: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    overflow: visible;
    padding-bottom: 0
}

.c-card--slide__link {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 0;
    color: rgba(0, 0, 0, 0);
    overflow: hidden;
    text-indent: -100%;
    white-space: nowrap;
    display: table-column;
    border-bottom-width: 0 !important
}

.c-card--slide__link:hover {
    border-bottom-width: 0 !important;
    background-color: hsla(0, 0%, 100%, .2)
}

.c-card--slide__img {
    border-radius: 8px 8px 0 0;
    aspect-ratio: 87/65;
    overflow: hidden
}

.c-card--slide__img img {
    object-fit: cover;
    min-height: 100%;
    min-width: 100%;
    max-width: initial
}

.c-card--slide__badge {
    font-size: clamp(.875rem, -.175rem + 1.1666666667vw, 1.225rem);
    color: #fff;
    background-color: #1a2792;
    border-radius: 8px 0 8px 0;
    padding: clamp(.5rem, -.1rem + .6666666667vw, .7rem) clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem);
    position: absolute;
    top: 0;
    left: 0
}

.c-card--slide__txt {
    display: flex;
    flex-direction: column;
    align-items: baseline;
    flex: 1;
    gap: clamp(.5rem, -.1rem + .6666666667vw, .7rem);
    padding: clamp(.75rem, -.15rem + 1vw, 1.05rem)
}

.c-card--slide__txt__footer-link {
    font-size: clamp(.875rem, -.175rem + 1.1666666667vw, 1.225rem);
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 1em;
    width: 100%;
    margin-top: auto
}

.c-card--slide__txt__footer-link::after {
    content: "";
    position: relative;
    display: inline-block;
    top: 0;
    vertical-align: middle;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 0;
    width: 1em;
    height: 1em;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226.59%22%20height%3D%2211.17%22%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M.29.29C-.1.68-.1%2C1.31.29%2C1.7l3.88%2C3.88L.29%2C9.46c-.39.39-.39%2C1.02%2C0%2C1.41.39.39%2C1.02.39%2C1.41%2C0l4.59-4.59c.39-.39.39-1.02%2C0-1.41L1.7.28c-.38-.38-1.02-.38-1.41.01Z%22%2F%3E%3C%2Fsvg%3E");
    width: .7em;
    height: .4em
}

.c-card--slide__btn {
    display: flex;
    justify-content: flex-end;
    gap: clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem);
    padding-top: clamp(1.5rem, -.3rem + 2vw, 2.1rem)
}

.c-card--slide__btn__next,
.c-card--slide__btn__prev {
    cursor: pointer;
    border-radius: 100%;
    background-color: #1a2792;
    width: clamp(2.75rem, -.55rem + 3.6666666667vw, 3.85rem);
    height: clamp(2.75rem, -.55rem + 3.6666666667vw, 3.85rem);
    color: rgba(0, 0, 0, 0);
    overflow: hidden;
    text-indent: -100%;
    white-space: nowrap;
    display: table-column;
    position: relative
}

.c-card--slide__btn__next::after,
.c-card--slide__btn__prev::after {
    content: "";
    position: relative;
    display: inline-block;
    top: 0;
    vertical-align: middle;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 0;
    width: 1em;
    height: 1em;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226.59%22%20height%3D%2211.17%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M.29.29C-.1.68-.1%2C1.31.29%2C1.7l3.88%2C3.88L.29%2C9.46c-.39.39-.39%2C1.02%2C0%2C1.41.39.39%2C1.02.39%2C1.41%2C0l4.59-4.59c.39-.39.39-1.02%2C0-1.41L1.7.28c-.38-.38-1.02-.38-1.41.01Z%22%2F%3E%3C%2Fsvg%3E");
    width: .5em;
    height: .5em;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.c-card--slide__btn__prev::after {
    transform: translate(-50%, -50%) rotate(180deg)
}

.c-card-item--rss {
    background: #fff;
    border: silver solid 1px;
    border-radius: 4px;
    max-width: clamp(30.625rem, -6.125rem + 40.8333333333vw, 42.875rem);
    word-wrap: break-word;
    overflow: hidden;
    padding: clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem);
    position: relative;
    display: grid;
    gap: clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem);
    grid-template-columns: 1fr clamp(8.75rem, -1.75rem + 11.6666666667vw, 12.25rem);
    grid-template-areas: "b a" "c c" "d e"
}

.c-card-item--rss__link {
    border-bottom-width: 0 !important;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 0;
    color: rgba(0, 0, 0, 0);
    overflow: hidden;
    text-indent: -100%;
    white-space: nowrap;
    display: table-column;
    z-index: 1
}

.c-card-item--rss__link:after {
    transition: all .3s ease-in-out
}

@starting-style {
    .c-card-item--rss__link:after {
        content: none;
        opacity: 0;
        background-color: rgba(0, 0, 0, 0)
    }
}

.c-card-item--rss__link:hover:after {
    content: "";
    background-color: hsla(0, 0%, 100%, .2);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 0;
    opacity: 1
}

.c-card-item--rss__link:hover {
    border-bottom-width: 0;
    background-color: hsla(0, 0%, 100%, .2)
}

.c-card-item--rss__img {
    text-align: right;
    grid-area: a
}

.c-card-item--rss__img img {
    width: 120px
}

.c-card-item--rss h2 {
    letter-spacing: .04em;
    word-break: break-all;
    font-size: 18px;
    line-height: 1.5;
    font-weight: bold;
    display: -webkit-box;
    overflow: hidden;
    height: 3em;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    align-self: center;
    grid-area: b
}

.c-card-item--rss__description {
    word-break: break-all;
    font-size: 12px;
    line-height: 1.5;
    color: #787c7b;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    grid-area: c
}

.c-card-item--rss__description a {
    display: none
}

.c-card-item--rss__note {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    grid-area: e
}

.c-card-item--rss__note a {
    border-bottom-width: 0
}

.c-card-item--rss__note a::after {
    content: none !important
}

.c-card-item--rss__note img {
    width: clamp(3.875rem, -.775rem + 5.1666666667vw, 5.425rem)
}

.c-card-item--rss__footer {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 0 clamp(.5rem, -.1rem + .6666666667vw, .7rem);
    grid-template-columns: clamp(2.5rem, -0.5rem + 3.3333333333vw, 3.5rem) 1fr;
    grid-template-areas: "a b" "a c";
    grid-area: d
}

.c-card-item--rss__footer a {
    border-bottom-width: 0;
    display: block;
    width: 100%
}

.c-card-item--rss__footer a[target=_blank]::after {
    content: none;
    display: block
}

.c-card-item--rss__clogo,
.c-card-item--rss__cname,
.c-card-item--rss__date {
    line-height: 1;
    display: flex;
    align-self: center
}

.c-card-item--rss__clogo {
    grid-area: a
}

.c-card-item--rss__cname {
    font-size: 12px;
    grid-area: b
}

.c-card-item--rss__date {
    grid-area: c
}

.c-card-item--rss time {
    color: #787c7b;
    font-size: 12px;
    line-height: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

@media only screen and (max-width:1279px) {
    .c-card {
        grid-template-columns: repeat(2, 1fr);
        gap: 32px
    }

    .c-card>* {
        gap: 16px;
        padding-bottom: 0
    }

    .c-card__tit,
    .c-card__txt,
    .c-card__footer {
        padding-left: 10px;
        padding-right: 10px
    }

    .c-card__img {
        aspect-ratio: 8/5
    }

    .c-card__txt {
        -webkit-line-clamp: 3
    }

    .c-card__link {
        padding-top: 12px
    }

    .c-card--bdr>* {
        padding: 16px 12px
    }

    .c-card--bdr .c-card__tit,
    .c-card--bdr .c-card__txt,
    .c-card--bdr .c-card__footer {
        padding-left: 0;
        padding-right: 0
    }

    .c-card--bdr .c-card__link {
        align-items: center
    }

    .c-card--bdr .c-card__img {
        aspect-ratio: 16/9
    }

    .c-card--bdr--thin__img img {
        max-width: 100%
    }

    .c-card--sp-column--1 {
        grid-template-columns: repeat(1, 1fr)
    }

    .c-card--sp-column--2 {
        grid-template-columns: repeat(2, 1fr)
    }

    .c-card--sp-column--3 {
        grid-template-columns: repeat(3, 1fr)
    }

    .c-card--sp-column--4 {
        grid-template-columns: repeat(4, 1fr)
    }

    .c-card--sp-column--5 {
        grid-template-columns: repeat(5, 1fr)
    }
}

@media only screen and (max-width:480px) {
    .c-card--flame {
        grid-auto-rows: auto;
        gap: 48px
    }

    .c-card-item--rss {
        width: calc(100% - 32px);
        grid-template-columns: 1fr 100px
    }

    .c-card-item--rss h2 {
        font-size: 1rem
    }

    .c-card-item--rss__description {
        -webkit-line-clamp: 2
    }

    .c-card-item--rss__footer {
        grid-template-columns: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem) 1fr
    }
}

@media only screen and (max-width:440px) {
    .c-card {
        grid-template-columns: repeat(1, 1fr)
    }

    .c-card--bdr {
        grid-template-columns: repeat(1, 1fr);
        gap: 80px;
    }

    .c-card--bdr .c-card__img:not(:has(iframe)) {
        aspect-ratio: initial
    }

    .c-card--bdr--thin {
        grid-template-columns: repeat(1, 1fr);
        gap: 1rem
    }
}

@container (max-width: 679px) {
    .c-card--flame {
        grid-auto-rows: auto
    }
}

[class*=c-icon] {
    color: rgba(0, 0, 0, 0);
    overflow: hidden;
    text-indent: -100%;
    white-space: nowrap;
    display: table-column;
    display: inline-grid;
    grid-template-columns: 1em;
    grid-template-rows: 1em;
    line-height: 0;
    vertical-align: middle
}

[class*=c-icon]:after {
    content: "";
    position: relative;
    display: inline-block;
    top: 0;
    vertical-align: middle;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 0;
    width: 1em;
    height: 1em;
    grid-column: 1/2;
    grid-row: 1/2
}

[class*=c-icon--arrow]:after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226.59%22%20height%3D%2211.17%22%3E%3Cpath%20fill%3D%22%231a2792%22%20d%3D%22M.29.29C-.1.68-.1%2C1.31.29%2C1.7l3.88%2C3.88L.29%2C9.46c-.39.39-.39%2C1.02%2C0%2C1.41.39.39%2C1.02.39%2C1.41%2C0l4.59-4.59c.39-.39.39-1.02%2C0-1.41L1.7.28c-.38-.38-1.02-.38-1.41.01Z%22%2F%3E%3C%2Fsvg%3E")
}

.c-icon--step {
    background-color: #0B0B2F;
    width: clamp(4rem, .063rem + 4.38vw, 5.313rem);
    height: clamp(2.75rem, -.55rem + 3.6666666667vw, 3.85rem);
    border-radius: 24px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center
}

.c-icon--step:after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2236%22%20height%3D%2218%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M36%209L21%200.339746V17.6603L36%209ZM0%2010.5H22.5V7.5H0V10.5Z%22%2F%3E%3C%2Fsvg%3E");
    margin-left: -1.5em;
    width: clamp(2.25rem, 2.5vw, 3rem)
}

@media only screen and (max-width:440px) {
    .c-icon--step {
        border: 1px solid #fff;
    }

    .c-card--bdr article:first-child::after {
        top: 605px;
        right: 0;
        width: 100%;
        height: 1px;
    }
}

.c-img--full a,
.c-img--full span,
.c-img--bdr a,
.c-img--bdr span {
    display: block;
    width: 100%;
    height: 100%
}

.c-img--full img,
.c-img--bdr img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

.c-img--full a[target=_blank]::after,
.c-img--bdr a[target=_blank]::after {
    content: none !important
}

.c-img--bdr {
    border-radius: 8px;
    border: 1px solid #f4f4f4
}

.c-imgtxt {
    display: grid;
    grid-template-rows: auto 1fr;
    grid-template-columns: clamp(22%, 224px, 25%) 1fr;
    gap: 16px;
    grid-template-areas: "a b" "a c" "d d"
}


@media (max-width: 440px) {
    .c-imgtxt {
        margin: 34px 0 0 0;
    }
}

.c-imgtxt__service {
    position: relative;
    display: inline-block;
}

.c-imgtxt__service::before {
    content: "";
    display: block;
    width: 60px;
    height: 2px;
    margin-bottom: 8px;
    background: linear-gradient(to left, #24708C, #89FF9B);
    opacity: 0.8;
    position: absolute;
    left: 0;
    top: -12px;
}

.c-imgtxt__tit {
    grid-area: b;
    font-size: clamp(.875rem, -.175rem + 1.1666666667vw, 1.225rem);
    font-weight: 300;
    line-height: 200%;
    letter-spacing: .7px;
    border-left: 4px solid #00a6cb;
    display: flex;
    padding-left: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    flex-direction: column;
    align-items: flex-start;
    gap: clamp(.25rem, -.05rem + .3333333333vw, .35rem);
    align-self: stretch
}

.c-imgtxt__tit__tit {
    color: #0B0B2F;
    font-size: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 1px
}

.c-imgtxt__txt {
    grid-area: c
}

.c-imgtxt__footer {
    grid-area: d;
    font-weight: 600;
    line-height: 200%;
    letter-spacing: .8px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem)
}

.c-imgtxt__footer a {
    font-weight: 600
}

.c-imgtxt+.c-imgtxt {
    margin-top: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem)
}

.c-imgtxt:not(:has(.c-imgtxt__img)) {
    grid-template-areas: "b" "c" "d";
    grid-template-columns: 1fr;
    padding: 0 0 0 16px;
}

.c-imgtxt__footer-dl {
    display: flex;
    font-weight: 600;
    letter-spacing: .8px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem);
    margin-top: 16px;
}

.c-imgtxt__footer-dl a:first-child::after {
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    background: url('../img/cloudnative/dl_icon.svg') no-repeat center center;
    background-size: contain;
    vertical-align: middle;
}

.c-imgtxt__footer-dl a:last-child::after {
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    background: url('../img/cloudnative/right_arrow_icon.svg') no-repeat center center;
    background-size: contain;
    vertical-align: middle;
}

.nebulashift-txt-sp {
    display: none;
}

@media only screen and (max-width:1279px) {
    .c-imgtxt__txt {
        font-size: 14px;
        font-weight: 300;
        line-height: 180%;
        letter-spacing: .42px
    }

    .c-imgtxt__footer {
        flex-direction: column;
        gap: 8px;
        align-items: flex-end
    }
}

@media only screen and (max-width:440px) {
    [class*=c-imgtxt]:not(.c-imgtxt-sp) {
        display: flex;
        flex-direction: column;
        row-gap: 1rem
    }

    [class*=c-imgtxt]:not(.c-imgtxt-sp) .c-imgtxt__img,
    [class*=c-imgtxt]:not(.c-imgtxt-sp) .c-imgtxt__tit,
    [class*=c-imgtxt]:not(.c-imgtxt-sp) .c-imgtxt__txt {
        grid-column: initial !important;
        grid-row: initial !important
    }

    [class*=c-imgtxt]:not(.c-imgtxt-sp) .c-imgtxt__img {
        order: 1;
        align-self: center;
        max-width: 224px
    }

    [class*=c-imgtxt]:not(.c-imgtxt-sp) .c-imgtxt__tit {
        order: 2;
        row-gap: 4px
    }

    [class*=c-imgtxt]:not(.c-imgtxt-sp) .c-imgtxt__txt {
        order: 3
    }

    [class*=c-imgtxt]:not(.c-imgtxt-sp) .c-imgtxt__footer {
        order: 4;
        gap: 8px
    }

    .c-imgtxt__footer {
        width: 100%;
        align-items: center;
    }

    .c-imgtxt__footer-dl {
        align-items: flex-end;
    }

    .c-imgtxt__footer .c-link--arrow {
        width: 95%;
        padding: 4px 62px 4px 65px;
    }

    .nebulashift-txt {
        display: none;
    }

    .nebulashift-txt-sp {
        display: block;
    }
}

@media only screen and (max-width:375px) {
    .c-imgtxt__footer .c-link--arrow {
        padding: 4px 42px 4px 45px;
    }
}

[class*=c-indent--],
[class*=c-indent--]>li {
    margin: 1em 0
}

[class*=c-indent--]>li,
[class*=c-indent--]>li>li {
    margin-bottom: .5em
}

[class*=c-indent--]>li:last-op-type,
[class*=c-indent--]>li>li:last-op-type {
    margin-bottom: 0
}

p.c-indent--1em,
ul.c-indent--1em li {
    text-indent: -1em;
    margin-left: 1em;
    margin-bottom: .5em
}

p.c-indent--2em,
ul.c-indent--2em li {
    text-indent: -2em;
    margin-left: 2em;
    margin-bottom: .5em
}

.c-kv {
    min-height: 200svh;
    view-timeline-name: --hero;
    view-timeline-axis: block;
}

.c-kv__tit {
    text-align: center;
    background: var(--gradatino-button-hover, linear-gradient(90deg, #0B103D 0%, #1A2792 100%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: rgba(0, 0, 0, 0);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation: kvTit 1s cubic-bezier(0.55, 0.085, 0.68, 0.53) both;
    display: flex;
    flex-direction: column;
    gap: clamp(.25rem, -.05rem + .3333333333vw, .35rem)
}

.c-kv__tit__lv1 {
    text-align: center;
    font-feature-settings: "palt" on;
    font-family: "Noto Serif", serif;
    font-size: clamp(7.125rem, 4.125rem + 3.33vw, 8.125rem);
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    letter-spacing: 9.6px;
    display: block;
    white-space: nowrap
}

.c-kv__tit__lv1 em {
    font-size: clamp(10.5rem, 6.188rem + 4.79vw, 11.938rem)
}

.c-kv__tit__lv2 {
    font-size: clamp(2.25rem, 1.313rem + 1.04vw, 2.563rem);
    font-weight: 600
}

.c-kv__img--line {
    position: absolute;
    top: -15%;
    animation: kvLine .6s ease-in;
    overflow: hidden;
    left: 0;
    height: 130%;
    width: 100%
}

.c-kv__img--line img {
    width: 100vw;
    max-width: initial
}

.c-kv__img--bg {
    margin: 0 50px
}

.c-kv__img--bg img {
    width: 100%
}

.c-kv-video {
    position: fixed;
    inset: 0;
    z-index: -1;
}

.c-kv-video video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

@keyframes fadeOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

.c-kv-video {
    animation: fadeOut linear both;
    animation-timeline: --hero;
    animation-range: exit 0% exit 100%;
}

.c-kv_extraspace {
    height: 100svh;
}

.c-kv__catch {
    position: absolute;
    inset: 70svh 0 0 0;
    width: 100%;
    z-index: 2;
    color: #fff;
    font-size: clamp(24px, 5vw, 54px);
    line-height: 1.5;
    margin: 1rem 0rem 0rem 10.0625rem;
    pointer-events: none;
}

@keyframes kvTit {
    from {
        opacity: 0;
        filter: blur(12px)
    }

    to {
        opacity: 1;
        filter: blur(0px)
    }
}

@keyframes kvLine {
    from {
        width: 0%
    }

    to {
        width: 100%
    }
}

body.is-firefox .c-kv__tit {
    color: #121c68;
    -webkit-text-fill-color: initial
}

@media only screen and (max-width:1279px) {
    .c-kv__catch {
        margin: 0;
        position: absolute;
        inset: 72svh auto 0 11vh;
    }

    .c-kv__tit {
        width: 100%
    }

    .c-kv__tit__lv1 {
        font-size: 80px
    }

    .c-kv__tit__lv1 em {
        font-size: 128px
    }

    .c-kv__tit__lv2 {
        font-size: 32px
    }

    .c-kv__img--bg {
        margin: 0 16px
    }
}

@media only screen and (max-width:440px) {
    .c-kv {
        min-height: 40svh;
    }

    .c-kv__catch {
        text-align: center;
        margin: 0;
        inset: 76svh auto 0 auto;
    }

    .c-kv-video video {
        display: block;
        margin: 0 0 0 0;
    }

    .c-kv__tit__lv1 {
        font-size: 56px
    }

    .c-kv__tit__lv1 em {
        font-size: 80px
    }

    .c-kv__tit__lv2 {
        font-size: 24px
    }

    .c-kv__img--bg {
        aspect-ratio: 343/480;
        border-radius: 20px;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .c-kv__img--bg img {
        max-width: initial;
        height: 100%;
        width: initial
    }

    .c-kv__img--line {
        height: 100%
    }

    .c-kv__img--line img {
        position: absolute;
        transform: rotate(-10deg);
        width: 200%;
        top: 20%;
        left: -80%
    }
}

.scroll-down {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    position: relative;
    top: -1000px;
    right: 95px;
}

.scroll-down__text {
    color: #BAFFC5;
    font-size: 1rem;
    margin-bottom: 33px;

}

.scroll-down::after {
    animation: scroll-down 2s infinite;
    background-color: #BAFFC5;
    bottom: -240px;
    content: "";
    height: 240px;
    margin: auto;
    position: absolute;
    right: 17px;
    width: 1px;
}

@media only screen and (max-width: 346px) {
    .c-kv__catch {
        font-size: 1.25rem;
    }
}

@keyframes scroll-down {
    0% {
        transform: scale(1, 0);
        transform-origin: 0 0;
    }

    50% {
        transform: scale(1, 1);
        transform-origin: 0 0;
    }

    51% {
        transform: scale(1, 1);
        transform-origin: 0 100%;
    }

    100% {
        transform: scale(1, 0);
        transform-origin: 0 100%;
    }
}

@media (min-width: 441px) and (max-width: 670px) {
    .scroll-down {
        top: -875px;
    }

}

@media only screen and (max-width: 440px) {
    .scroll-down {
        margin-top: 55px;
        align-items: center;
        top: -200px;
        right: auto;
        left: 50%;
        transform: translateX(-50%);
    }

    .scroll-down::after {
        right: auto;
        left: 50%;
        transform: translateX(-50%);
    }
}

a[target=_blank]:where(:not([class^=c-btn]):not([class^=c-link--]):not(.cloudnative-card)) {
    display: inline-flex;
    align-items: center;
    gap: 4px
}

a[target=_blank]:where(:not([class^=c-btn]):not([class^=c-link--]):not(.cloudnative-card):not(.c-no-icon)):after {
    content: "";
    position: relative;
    display: inline-block;
    top: 0;
    vertical-align: middle;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 0;
    width: 1em;
    height: 1em;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M18%2019H6C5.45%2019%205%2018.55%205%2018V6C5%205.45%205.45%205%206%205H11C11.55%205%2012%204.55%2012%204C12%203.45%2011.55%203%2011%203H5C3.89%203%203%203.9%203%205V19C3%2020.1%203.9%2021%205%2021H19C20.1%2021%2021%2020.1%2021%2019V13C21%2012.45%2020.55%2012%2020%2012C19.45%2012%2019%2012.45%2019%2013V18C19%2018.55%2018.55%2019%2018%2019ZM14%204C14%204.55%2014.45%205%2015%205H17.59L8.46%2014.13C8.07%2014.52%208.07%2015.15%208.46%2015.54C8.85%2015.93%209.48%2015.93%209.87%2015.54L19%206.41V9C19%209.55%2019.45%2010%2020%2010C20.55%2010%2021%209.55%2021%209V4C21%203.45%2020.55%203%2020%203H15C14.45%203%2014%203.45%2014%204Z%22%2F%3E%3C%2Fsvg%3E")
}

.c-link--icon-none:after {
    content: none;
}

.c-link--arrow,
.c-link--download {
    display: inline-flex;
    align-items: center;
    gap: 28px
}

.c-link--arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5em 1.25em 0.5em 2.5em;
    background: #fff;
    border: 2px solid #fff;
    border-radius: 2em;
    color: #0B0B2F;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.04);
    transition: background 0.15s, color 0.15s;
}

.c-link--arrow:hover,
.c-link--arrow:focus {
    background: #0B0B2F;
    color: #fff;
    border-color: #0B0B2F;
}

.c-link--arrow:after,
.c-link--download:after {
    content: "";
    position: relative;
    display: inline-block;
    top: 0;
    vertical-align: middle;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 0;
    width: .8em;
    height: .8em
}

.c-link--arrow::after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226.59%22%20height%3D%2211.17%22%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M.29.29C-.1.68-.1%2C1.31.29%2C1.7l3.88%2C3.88L.29%2C9.46c-.39.39-.39%2C1.02%2C0%2C1.41.39.39%2C1.02.39%2C1.41%2C0l4.59-4.59c.39-.39.39-1.02%2C0-1.41L1.7.28c-.38-.38-1.02-.38-1.41.01Z%22%2F%3E%3C%2Fsvg%3E")
}

.c-link--arrow:hover:after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226.59%22%20height%3D%2211.17%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M.29.29C-.1.68-.1%2C1.31.29%2C1.7l3.88%2C3.88L.29%2C9.46c-.39.39-.39%2C1.02%2C0%2C1.41.39.39%2C1.02.39%2C1.41%2C0l4.59-4.59c.39-.39.39-1.02%2C0-1.41L1.7.28c-.38-.38-1.02-.38-1.41.01Z%22%2F%3E%3C%2Fsvg%3E")
}

.c-link--arrow.u-fc--w:after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226.59%22%20height%3D%2211.17%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M.29.29C-.1.68-.1%2C1.31.29%2C1.7l3.88%2C3.88L.29%2C9.46c-.39.39-.39%2C1.02%2C0%2C1.41.39.39%2C1.02.39%2C1.41%2C0l4.59-4.59c.39-.39.39-1.02%2C0-1.41L1.7.28c-.38-.38-1.02-.38-1.41.01Z%22%2F%3E%3C%2Fsvg%3E")
}

.c-link--download::after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M2%2C16c-.55%2C0-1.02-.2-1.41-.59-.39-.39-.59-.86-.59-1.41v-2c0-.55.45-1%2C1-1s1%2C.45%2C1%2C1v2h12v-2c0-.55.45-1%2C1-1s1%2C.45%2C1%2C1v2c0%2C.55-.2%2C1.02-.59%2C1.41-.39.39-.86.59-1.41.59H2ZM8.92%2C11.08c-.51.51-1.34.51-1.84%2C0l-3.38-3.38c-.39-.39-.39-1.02-.01-1.41.39-.41%2C1.04-.41%2C1.44-.01l1.87%2C1.87V1c0-.55.45-1%2C1-1s1%2C.45%2C1%2C1v7.15l1.87-1.87c.4-.4%2C1.05-.39%2C1.44.01.38.4.38%2C1.02-.01%2C1.41l-3.38%2C3.38Z%22%2F%3E%3C%2Fsvg%3E")
}

.c-list--disc {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.c-list--disc li {
    display: flex;
    gap: 8px;
    align-items: flex-start
}

.c-list--disc li::before {
    content: "";
    background-color: #00a6cb;
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    margin-top: calc(.5em + 4px);
    flex: 0 0 8px
}

.c-list--inline--sl {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(.25rem, -.05rem + .3333333333vw, .35rem) clamp(.5rem, -.1rem + .6666666667vw, .7rem)
}

.c-list--inline--sl>li {
    display: flex;
    align-items: center
}

.c-list--inline--sl>li:after {
    content: "/";
    font-size: .6em;
    opacity: .3;
    line-height: 1em;
    padding: 0 clamp(.5rem, -.1rem + .6666666667vw, .7rem)
}

.c-list--inline--sl>li:last-child:after {
    content: none
}

@media only screen and (max-width:1279px) {
    .c-list--disc>li::before {
        margin-top: calc(.5em - 2px)
    }


}

@media only screen and (max-width:440px) {
    .c-list--disc>li::before {
        margin-top: calc(.5em + 2px)
    }

    .c-link--arrow:after,
    .c-link--download:after {
        left: 34px;
    }
}

.c-menu--sidebar {
    font-size: clamp(.8125rem, -.1625rem + 1.0833333333vw, 1.1375rem);
    font-weight: 600;
    line-height: 150%;
    letter-spacing: .65px;
    position: fixed;
    width: calc((8.3333333333% - clamp(2rem, .125rem + 2.08vw, 2.625rem))*2 + 50px);
    left: 50px;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0;
    z-index: 3
}

.c-menu--sidebar ul {
    display: flex;
    flex-direction: column;
    gap: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem)
}

.c-menu--sidebar a {
    color: #4f4747;
}

.c-menu--sidebar a.is-current {
    color: #45FF61;
    display: inline-flex;
    align-items: center;
    gap: clamp(.25rem, -.05rem + .3333333333vw, .35rem);
    white-space: nowrap
}

.c-menu--sidebar a.is-current::before {
    content: "";
    background-color: #45FF61;
    display: block;
    width: 8px;
    height: 8px;
    flex: 0 0 8px
}

.c-menu--sidebar.is-show {
    animation: fadeIn .7s cubic-bezier(0.33, 1, 0.68, 1) forwards
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@media only screen and (max-width:1279px) {
    .c-menu--sidebar {
        font-size: 10px;
        border-radius: 8px 0 0 8px;
        backdrop-filter: blur(8px);
        background-color: hsla(0, 0%, 100%, .6);
        width: 308px;
        height: 44px;
        top: initial;
        left: calc(50% - 20px);
        bottom: 16px;
        transform: translateX(-50%);
        opacity: initial;
        box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, .25)
    }

    .c-menu--sidebar ul,
    .c-menu--sidebar li,
    .c-menu--sidebar a {
        flex-direction: row;
        align-items: center;
        justify-content: center;
        height: 100%;
        width: 100%
    }

    .c-menu--sidebar ul {
        gap: 0
    }

    .c-menu--sidebar a {
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 5px
    }

    .c-menu--sidebar a.is-current {
        color: #fff;
        background-color: #1a2792;
        white-space: inherit
    }

    .c-menu--sidebar a.is-current::before {
        content: none
    }

    .c-menu--sidebar a:hover {
        border-width: 0
    }

    .c-menu--sidebar li:has([href="#sec-contact"], [href="#sec-sns"]) {
        display: none
    }

    .c-menu--sidebar li:first-child a {
        border-radius: 8px 0 0 8px
    }
}

.c-movie {
    width: 100%;
    aspect-ratio: 16/9
}

.c-movie iframe {
    width: 100%;
    height: 100%
}

.c-note {
    width: 100%;
    aspect-ratio: 16/9
}

.c-note img {
    width: 480px;
    height: auto;
}

.c-news-list {
    border-bottom: 1px solid silver
}

.c-news-list>li {
    border-top: 1px solid silver;
    padding: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem) 0
}

.c-news-list>li a {
    border-width: 0;
    display: flex;
    align-items: flex-start;
    gap: clamp(.5rem, -.1rem + .6666666667vw, .7rem)
}

.c-news-list>li a:after {
    background-color: #1a2792;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    content: "";
    position: relative;
    display: inline-block;
    top: 0;
    vertical-align: middle;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 0;
    width: 1em;
    height: 1em;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226.59%22%20height%3D%2211.17%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M.29.29C-.1.68-.1%2C1.31.29%2C1.7l3.88%2C3.88L.29%2C9.46c-.39.39-.39%2C1.02%2C0%2C1.41.39.39%2C1.02.39%2C1.41%2C0l4.59-4.59c.39-.39.39-1.02%2C0-1.41L1.7.28c-.38-.38-1.02-.38-1.41.01Z%22%2F%3E%3C%2Fsvg%3E");
    width: clamp(1.5rem, -.3rem + 2vw, 2.1rem);
    height: clamp(1.5rem, -.3rem + 2vw, 2.1rem);
    background-size: clamp(.375rem, -.075rem + .5vw, .525rem) clamp(.75rem, -.15rem + 1vw, 1.05rem);
    flex: 0 0 clamp(1.5rem, -.3rem + 2vw, 2.1rem);
    margin-left: auto;
    align-self: center
}

.c-news-list>li a:hover {
    padding-left: clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem)
}

.c-news-list>li a:hover .c-news-list__text {
    padding-right: clamp(2.5rem, -0.5rem + 3.3333333333vw, 3.5rem)
}

.c-news-list>li time {
    flex: 0 0 5em
}

.c-news-list>li span {
    border-width: 0;
    display: flex;
    align-items: flex-start;
    gap: clamp(.5rem, -.1rem + .6666666667vw, .7rem);
    /* white-space: nowrap; */
}

.c-news-list>li [class*=c-badge-] {
    flex: 0 0 9em;
    margin-top: clamp(.25rem, -.05rem + .3333333333vw, .35rem)
}

.c-news-list__text {
    flex: 1 1 auto;
    overflow: hidden;
    display: -webkit-box;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    padding: 0 clamp(3.5rem, -.7rem + 4.6666666667vw, 4.9rem) 0 1em;
    transition: all .3s ease-in-out
}

@media only screen and (max-width:1279px) {
    .c-news-list>li a {
        flex-wrap: wrap;
        align-items: center;
        gap: 1rem 4px
    }

    .c-news-list>li a:after {
        order: 3
    }

    .c-news-list>li a:hover {
        padding-left: 0
    }

    .c-news-list>li a:hover .c-news-list__text {
        font-weight: 300;
        padding-right: 0
    }

    .c-news-list>li span {
        flex-wrap: wrap;
        align-items: center;
        gap: 1rem 4px
    }

    .c-news-list>li time {
        order: 1
    }

    .c-news-list>li [class*=c-badge-] {
        order: 2;
        margin: 0
    }

    .c-news-list__text {
        font-weight: 600;
        flex: 0 0 100%;
        padding: 0;
        order: 4
    }
}

.js-preload * {
    transition: none !important
}

.js-show-sec {
    opacity: 0
}

.js-show-sec.is-show {
    animation: action1 .8s ease .1s both
}

@keyframes action1 {
    0% {
        opacity: 0;
        transform: translateY(50px)
    }

    100% {
        opacity: 1;
        transform: translateY(0)
    }
}

.c-carousel {
    display: flex;
    gap: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem);
    animation: scroll 35s infinite linear 1s both
}

.c-carousel-wrap {
    display: flex;
    align-items: center;
    overflow: hidden;
    gap: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem)
}

.c-carousel>* {
    border-radius: 8px;
    display: flex;
    align-items: center;
    width: clamp(18.75rem, -3.75rem + 25vw, 26.25rem);
    aspect-ratio: 3/2;
    overflow: hidden
}

.c-carousel>* img {
    object-fit: cover;
    width: 100%;
    height: 100%
}

@keyframes scroll {
    from {
        transform: translateX(0)
    }

    to {
        transform: translateX(-100%)
    }
}

@media only screen and (max-width:1279px) {
    .c-carousel>* {
        flex: 0 0 300px
    }
}

@media only screen and (max-width:440px) {
    .c-carousel {
        gap: 16px
    }

    .c-carousel>* {
        flex: 0 0 120px;
        width: 120px
    }
}

.c-tit--lv02 {
    color: #0b103d;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: baseline;
    gap: clamp(.5rem, -.1rem + .6666666667vw, .7rem);
    line-height: 150%;
    margin-bottom: clamp(3rem, -.6rem + 4vw, 4.2rem)
}

.c-tit--lv02__tit {
    font-size: clamp(3rem, -.5375rem + 3.5833333333vw, 3.7625rem);
    letter-spacing: 2.15px;
    line-height: 150%
}

.c-tit--lv02__tit--grd {
    font-size: 2.25rem;
    letter-spacing: 2.4px;
    line-height: 150%;
    background: #fff;
    -webkit-background-clip: text;
    -webkit-text-fill-color: rgba(0, 0, 0, 0);
    display: inline-block
}

.c-tit--lv02__tit--note {
    color: #0B103D;
    font-size: clamp(1.5rem, -.225rem + 1.5vw, 1.575rem);
    font-weight: 600;
    line-height: 150%;
    letter-spacing: .9px;
    display: block
}

#sec-statement .c-tit--lv02__tit--note,
#sec-strength .c-tit--lv02__tit--note {
    color: #fff;
}

.c-tit--lv02__read {
    color: #333;
    font-weight: 300;
    text-align: left;
    letter-spacing: .8px;
    margin-top: clamp(.25rem, -.05rem + .3333333333vw, .35rem)
}

.c-tit--lv02::before {
    content: "";
    background: linear-gradient(to left, #24708C, #89FF9B);
    opacity: .8;
    width: 140px;
    height: 4px;
    display: block;
}

.c-tit--lv02::after {
    background-color: #0097b9;
    opacity: .8;
    position: absolute;
    top: 0;
    left: 2px
}

.c-tit--lv02.u-fc--w .c-tit--lv02__tit--note,
.c-tit--lv02.u-fc--w .c-tit--lv02__read {
    color: #fff
}

.c-tit--lv03__read {
    font-size: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    letter-spacing: 1px;
    display: block
}

.c-tit--lv03--w {
    font-size: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem);
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 1.6px;
    color: #fff;
    border-bottom: 1px solid #fff;
    padding-bottom: clamp(.25rem, -.05rem + .3333333333vw, .35rem);
    margin-bottom: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem)
}

.c-tit--lv03--bl {
    color: #0b103d;
    font-size: clamp(1.5rem, -.3rem + 2vw, 2.1rem);
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 1.2px;
    border-bottom: 1px solid #0b103d;
    padding-bottom: clamp(.75rem, -.15rem + 1vw, 1.05rem);
    margin-bottom: clamp(3.5rem, -.7rem + 4.6666666667vw, 4.9rem)
}

.c-tit--lv04 {
    color: #0b103d;
    font-size: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 1px;
    margin-bottom: clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem);
    margin-top: 2.5rem;
}

.c-tit--lv04--lb {
    color: #00a6cb;
    color: var(--lightBlue-lightblue-500, #00a6cb);
    font-size: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    font-weight: 600;
    line-height: 200%;
    letter-spacing: 1px;
    margin-bottom: clamp(.25rem, -.05rem + .3333333333vw, .35rem)
}

.c-tit--lv04--w {
    color: #fff;
    font-size: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 1px;
    margin-bottom: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem)
}

.c-tit--lv05 {
    font-size: clamp(1.125rem, -.225rem + 1.5vw, 1.575rem);
    font-weight: 600;
    letter-spacing: .9px;
    margin: clamp(1.5rem, -.3rem + 2vw, 2.1rem) 0 clamp(.25rem, -.05rem + .3333333333vw, .35rem) 0
}

.c-tit--lv05:first-child {
    margin-top: 0
}

.c-tit--top--lv02 {
    color: #1a2792;
    font-size: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem);
    line-height: 1.5;
    margin-bottom: clamp(4rem, -.8rem + 5.3333333333vw, 5.6rem)
}

.c-tit--lv06 {
    color: #333333;
    font-size: clamp(1.75rem, -.4rem + 2.6666666667vw, 1.75rem);
    font-weight: bold;
    line-height: 1.5;
    margin-top: 86px;
    margin-bottom: clamp(4rem, -.8rem + 5.3333333333vw, 5.6rem);
    position: relative;
}

.c-tit--lv06::before {
    content: "";
    display: block;
    width: 140px;
    height: 2px;
    background: linear-gradient(to left, #24708C, #89FF9B);
    opacity: 0.8;
    position: absolute;
    left: 0;
    top: -12px;
}

@media only screen and (max-width:1279px) {
    .c-tit--lv02__tit {
        font-size: 32px
    }

    .c-tit--lv02__tit--grd {
        font-size: 32px
    }

    .c-tit--lv02__read {
        font-size: 16px
    }

    .c-tit--lv03 {
        margin-bottom: 24px
    }

    .c-tit--lv03--bl {
        display: none;
    }

    .c-tit--lv03--w {
        font-size: 24px;
        padding-bottom: 8px
    }

    .c-tit--lv04--w {
        margin-bottom: 16px
    }
}

@media only screen and (max-width:440px) {
    .c-tit--lv02::before {
        width: 100px;
    }

    .c-tit--lv02__tit--grd {
        font-size: 20px;
        letter-spacing: .05em
    }

    .c-tit--lv02__tit--note {
        font-size: 18px
    }

    .c-tit--lv02__read {
        letter-spacing: 0
    }

    .c-tit--lv02:has(.c-tit--lv02__tit--grd) .c-tit--lv02__tit--note {
        font-size: 20px
    }
}

.c-boost {
    padding: 3rem 1rem 2.25rem;
    border-radius: 1.125rem;
    box-shadow: 0 0.125rem 2rem rgba(20, 40, 80, 0.08);
}

.c-boost__title {
    color: #fff;
    font-size: 2rem;
    font-weight: 600;
    margin: 8.5rem 0rem 0.5rem 0rem;
    letter-spacing: .03em;
}

.c-boost__title::before {
    content: "";
    display: block;
    width: 78px;
    height: 2px;
    background: linear-gradient(to left, #24708C, #89FF9B);
    opacity: 0.8;
    margin-bottom: 1rem;
}

.c-boost__title .sp-br {
    display: none;
}

.c-boost__lead {
    color: #fff;
    font-size: 1rem;
    margin-bottom: 4.9375rem;
    font-weight: 600;
}

.c-boost__list {
    display: flex;
    gap: 18px;
    justify-content: center;
    padding: 0;
    list-style: none;
}

.c-boost__item {
    flex: 1 1 0;
    background: rgba(255, 255, 255, 0.07);
    background-image: url('../img/cloudnative/card_back01.webp');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 0.625rem;
    padding: 51px 50px 62px 50px;
    min-width: 13.75rem;
    position: relative;
    color: #fff;
}

.c-boost__item:nth-child(2) {
    background-image: url('../img/cloudnative/card_back02.webp');
}

.c-boost__item:nth-child(3) {
    background-image: url('../img/cloudnative/card_back03.webp');
}

.c-boost__item-title {
    font-size: 1.375rem;
    color: #fff;
    font-weight: 600;
    margin-bottom: 1.5rem;
    text-align: center;
}

.c-boost__desc {
    font-size: 1rem;
    color: #fff;
    font-weight: 400;
    line-height: 1.8;
    margin: 0;
}

@media (max-width: 900px) {
    .c-boost__list {
        flex-direction: column;
        gap: 1.5rem;
    }

    .c-boost__item {
        margin: 0 auto;
        max-width: 640px;
    }
}

@media (min-width: 901px) and (max-width: 1424px) {
    .boost-break {
        display: block;
    }

    .c-boost__item {
        background-image: url('../img/cloudnative/card_back01_tab.webp');
    }

    .c-boost__item:nth-child(2) {
        background-image: url('../img/cloudnative/card_back02_tab.webp');
    }

    .c-boost__item:nth-child(3) {
        background-image: url('../img/cloudnative/card_back03_tab.webp');
    }
}

@media only screen and (max-width: 440px) {
    .c-boost__title {
        font-size: 1.5rem;
    }

    .c-boost__lead {
        margin-top: 1.5rem;
    }

    .c-boost__title .sp-br {
        display: block;
    }
}

/* STRENGRHセクション */
#sec-strength {
    background-image: url('../img/cloudnative/strength_back_img.webp');
    background-position: right top;
    background-repeat: no-repeat;
    background-size: contain;
}

.p-strength__img {
    width: clamp(637px, 44.86vw, 646px);
}

.p-strength__img--sp {
    display: none;
}

.p-strength__journey-tit {
    color: #fff;
    font-size: 1.75rem;
    text-align: center;
}

.p-strength__journey-tit::before {
    content: "";
    background: linear-gradient(to left, #24708C, #89FF9B);
    width: 78px;
    height: 2px;
    display: block;
    margin-bottom: 1rem;
    margin-left: auto;
    margin-right: auto;
}

.p-strength__journey-tit::after {
    content: "";
    display: block;
    width: 846px;
    height: 138px;
    background-image: url('../img/cloudnative/cn_journey_map.webp');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    margin: 0 auto;
    margin-top: 40px;
}

.p-strength__journey-tit .sp-br {
    display: none;
}

.phase-wrap {
    display: none;
}

@media only screen and (max-width: 1279px) {
    #sec-strength {
        background-image: url('../img/cloudnative/strength_back_img_tab.webp');
        padding: 120px 0 0 0;
        background-position: right top 2%;
    }
}

@media only screen and (max-width: 700px) {
    .p-strength__journey-tit {
        line-height: 1.5;
    }

    .p-strength__journey-tit::after {
        display: none;
    }

    #sec-strength {
        background-image: url('../img/cloudnative/strength_back_img_sp.webp');
        background-position: right top 4%;
    }

    .phase-wrap {
        max-width: 400px;
        margin: 40px auto;
        display: flex;
        flex-direction: column;
        gap: 18px;
        box-sizing: border-box;
    }

    .phase {
        padding: 12px 18px;
        border-radius: 4px;
        background: rgba(255, 255, 255, .1);
        border: 2px dashed rgba(255, 255, 255, .4);
        color: #BAFFC5;
        position: relative;
    }

    .phase--support {
        background: rgba(137, 255, 155, 0.2);
        border: 2px dashed #BAFFC5;
        padding-bottom: 24px;
    }

    .phase-tit {
        font-size: 1rem;
        font-weight: 600;
        text-align: center;
        margin-bottom: 1rem;
        letter-spacing: 1px;
        color: #fff;
    }

    .phase--support .phase-title {
        color: #fff;
    }

    .phase-steps {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 14px;
    }

    .step-card {
        width: 100%;
        min-width: 215px;
        background: #23294B;
        border-radius: 4px;
        padding: 10px 0 10px 0;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
    }

    .phase--support .step-card {
        background: rgba(11, 11, 47, 0.5);
    }

    .step-label {
        color: #BAFFC5;
        background: transparent;
        font-size: 1rem;
        font-weight: 600;
        margin-right: 12px;
        letter-spacing: 0.1em;
    }

    .step-nam {
        font-size: 1rem;
        font-weight: 600;
    }

    .step-tit {
        font-size: 1rem;
        font-weight: 600;
    }

    .step-arrow {
        color: #fff;
        text-align: center;
        font-size: 1.3em;
        height: 24px;
    }

    .decision-label {
        margin: 0 auto;
        padding: 5px 0px;
        background: transparent;
        border: 2px solid #BAFFC5;
        border-radius: 3px;
        text-align: center;
        color: #BAFFC5;
        font-weight: 600;
        width: 100%;
        letter-spacing: 1px;
        font-size: 1rem;
    }
}

.p-strength__journey-sub {
    color: #fff;
    font-size: 22px;
    text-align: left;
    font-weight: 600;
    line-height: 1.5;
}

.p-strength__journey-sub::before {
    content: "";
    background: linear-gradient(to left, #24708C, #89FF9B);
    width: 78px;
    height: 2px;
    display: block;
    margin-top: 80px;
    margin-bottom: 1rem;
}

.p-strength__journey-sub .sp-br {
    display: none;
}

.p-strength__lead {
    font-size: 1.875rem;
    color: #fff;
    font-weight: 600;
    margin-top: 3rem;
    line-height: 1.5;
}

.p-strength__body {
    font-size: 1.125rem;
    color: #fff;
    line-height: 2;
    margin-top: 3.75rem;
    text-align: left;
    font-weight: 600;
}

.p-strength__journey {
    margin: 210px auto 0;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 0.625rem;
    padding: 60px 53px 100px 53px;
    max-width: 996px;
}

.p-strength__journey-wrap {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    margin-top: 80px;
    gap: 44px;
}

.p-strength__journey-imgcol {
    width: 320px;
    height: 360px;
    /* background-image: url('../img/cloudnative/step01.webp'); */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
}

.p-strength__journey-imglabel {
    color: #BAFFC5;
    font-size: 1rem;
    text-align: left;
}

.is_sp {
    display: none !important;
}

.p-strength__journey-imgframe {
    width: 320px;
    height: 360px;
    overflow: hidden;
    position: relative;
    border-radius: 8px;
    margin-top: 80px;
}

.p-strength__journey-imgstack {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.p-strength__journey-img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

.p-strength__journey-img__sp {
    display: none;
}

.p-strength__journey-steps {
    color: #fff;
    text-align: left;
}

.p-strength__journey-steps .p-strength__journey-step-tit {
    padding: 4px 1em;
    border-radius: 2em;
    color: #89FF9B;
    font-weight: 400;
    display: inline-flex;
    margin-top: 60px;
    min-width: 200px;
    justify-content: center;
    outline: 1px solid #89FF9B;
    transform-origin: left center;
}

.p-strength__journey-step:first-child .p-strength__journey-step-tit {
    margin-top: 0;
}

.p-strength__journey-step-tit .step-num {
    font-size: 14px;
}

.p-strength__journey-step-tit .step-title {
    font-size: 20px;
    margin-left: 1rem;
}

.p-strength__journey-step-item {
    font-size: 1rem;
}

.p-strength__journey-step-list {
    line-height: 1.5;
    margin: 30px 0 0 26px;
    padding: 0 0 0 50px;
    border-left: 2px solid #89ff9b;
    max-width: 456px;
    position: relative;
    overflow: hidden;
}

.p-strength__journey-step-ul {
    margin: 0;
    padding: 0;
    list-style: none;
    padding-bottom: 16px;
    height: auto;
    border-radius: 0.3rem;
    padding: 16px 28px;
    background: rgba(255, 255, 255, 0.07);
}

.p-strength__journey-step-label {
    color: #89FF9B;
    text-align: center;
    margin-top: 160px;
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.5;
}

.p-strength__journey-imgcol-sp {
    display: none;
}

@media (max-width: 1141px) {
    .p-strength__journey-img .is_sp {
        display: none;
    }

    .p-strength__journey-img__sp {
        display: block;
        width: 60%;
        margin: 20px auto 0;
    }

    .p-strength__journey {
        width: 100%;
    }

    .p-strength__journey-steps {
        text-align: center;
        width: 100%;
        margin: 0 auto;
    }

    .p-strength__journey-step-tit {
        opacity: 1 !important;
        transform: none !important;
        width: 100%;
    }

    .p-strength__journey-tit::after {
        width: 100%;
        background-image: url(../img/cloudnative/cn_journey_map_tab.webp);
    }

    .p-strength__journey-step-ul {
        transform: none !important;
    }

    .p-strength__journey-step-list {
        margin: 20px 0 0 0;
        padding: 0;
        max-width: inherit;
        text-align: left;
        border-left: none;
    }

    .p-strength__journey-imgstack {
        position: relative;
    }

    .p-strength__journey-img:first-child {
        display: block;
        position: relative;
        height: auto;
    }

    .p-strength__journey-imgframe {
        width: 100%;
        height: auto;
    }

    .p-strength__journey-wrap {
        display: block;
    }

    .p-strength__journey-imgcol {
        display: none;
    }

    .p-strength__journey-step-label {
        margin-top: 60px;
    }
}


@media only screen and (max-width:440px) {
    .p-strength__img--sp {
        display: block;
        width: 100%;
    }

    .p-strength__journey-img__sp {
        display: block;
        width: 100%;
    }

    .p-strength__img {
        display: none;
    }

    .p-strength__lead {
        font-size: 1.5rem;
    }

    .p-strength__body .pc-txt {
        display: none;
    }

    .p-strength__journey {
        width: 100%;
        padding: 60px 17px 100px 12px;
    }

    .p-strength__journey-tit {
        font-size: 22px;
        text-align: left;
        line-height: 1.7;
    }

    .p-strength__journey-tit::before {
        margin: 0 0 16px 0;
    }

    .p-strength__journey-tit::after {
        display: none;
    }

    .p-strength__journey-tit .sp-br {
        display: block;
    }

    .p-strength__journey-wrap {
        display: block;
        align-items: center;
        margin-top: 40px;
        gap: 44px;
    }

    .p-strength__journey-imgcol {
        width: 0;
        height: 0;
        background-image: none;
    }

    .p-strength__journey-step-list {
        margin: 0 auto;
    }

    .p-strength__journey-step-list::before {
        display: none;
    }

    .p-strength__journey-step-tit {
        width: 100%;
    }

    .p-strength__journey-movie-card {
        font-size: 22px;
        padding: 40px 10.5px;
        width: 100%;
        margin-top: 4rem;
        background-size: 200px auto;
        background-image: none;
    }

    .p-strength__journey-movie {
        font-size: 22px;
        text-align: center;
    }

    .p-strength__journey-movie::before {
        margin: 0 auto 1rem auto;
    }

    .p-strength__journey-movie-main {
        flex-direction: column;
        gap: 16px;
        align-items: center;
    }

    .p-strength__journey-movie-thumb {
        max-width: 100%;
        height: auto;
        margin: 0;
    }

    .p-strength__journey-movie {
        font-size: 1.2rem;
        text-align: center;
    }

    .p-strength__journey-movie-info h4 {
        font-size: 1.1rem;
        text-align: center;
    }

    .p-strength__journey-movie-info p {
        padding: 0;
    }
}



/* CASE STUDYセクション */
.p-case-study__card {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: min-content;
    grid-auto-rows: auto;
    margin-bottom: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem)
}

.p-case-study__card article {
    padding: clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem)
}

.p-case-study__card__btn {
    display: flex;
    flex-direction: column;
    gap: clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem);
    width: 100%
}

.p-case-study__card__btn>* {
    text-align: left;
    width: 100%
}

.p-case-study__card__img {
    background-color: #00a6cb;
    border-radius: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: clamp(3.5rem, -.7rem + 4.6666666667vw, 4.9rem);
    height: clamp(3.5rem, -.7rem + 4.6666666667vw, 4.9rem)
}

.p-case-study__card__img img {
    width: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem)
}

.p-case-study__card__tit {
    color: #00a6cb;
    font-weight: 600;
    line-height: 150%;
    letter-spacing: .8px;
    margin: clamp(.75rem, -.15rem + 1vw, 1.05rem) 0 clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem) 0
}

.p-case-study__card__tit em {
    font-size: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem)
}

.p-case-study__card__read {
    font-weight: 300;
    letter-spacing: .8px
}

.p-case-study__card__footer {
    font-size: clamp(.875rem, -.175rem + 1.1666666667vw, 1.225rem);
    font-style: normal;
    font-weight: 300;
    line-height: 180%;
    letter-spacing: .42px;
    margin-top: auto;
    padding-top: clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem)
}

.p-case-study__column {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: min-content;
    grid-auto-rows: auto;
    gap: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem);
    position: relative
}

.p-case-study__column .c-box {
    margin: 0
}

.p-case-study__column img {
    width: 100%
}

@media only screen and (max-width:1279px) {
    .p-case-study__column {
        gap: 16px
    }

    .p-case-study__column:has(.c-icon--step) {
        gap: 32px
    }

    .p-case-study__column .c-box {
        padding: 20px
    }

    .p-case-study__column .c-box__tit {
        padding: 10px 20px;
        margin: 0 -20px 20px -20px
    }

    .p-case-study__column .c-box:has(.c-box__tit) {
        padding: 0 20px 20px 20px
    }

    .p-case-study__card article {
        padding: 8px
    }
}

@media only screen and (max-width:440px) {
    .p-case-study__card {
        display: flex;
        flex-direction: column
    }

    .p-case-study__card article {
        border-bottom: 1px solid #ebebeb;
        padding: 20px 0
    }

    .p-case-study__card article:has(.is-open) .p-case-study__card__read,
    .p-case-study__card article:has(.is-open) .p-case-study__card__footer {
        display: block;
        opacity: 1;
        translate: 0 0
    }

    @starting-style {

        .p-case-study__card article:has(.is-open) .p-case-study__card__read,
        .p-case-study__card article:has(.is-open) .p-case-study__card__footer {
            opacity: 0;
            translate: 0 -10px
        }
    }

    .p-case-study__card article:last-child {
        border-bottom-width: 0
    }

    .p-case-study__card .c-badge--secondary {
        background-color: #e6f6fa !important
    }

    .p-case-study__card__tit {
        font-size: 16px;
        margin: 4px 0 0 0
    }

    .p-case-study__card__tit span {
        font-size: 14px
    }

    .p-case-study__card__tit em {
        font-size: 20px
    }

    .p-case-study__card__btn {
        flex-direction: row;
        gap: 12px;
        width: 100%
    }

    .p-case-study__card__btn::after {
        content: "";
        position: relative;
        display: inline-block;
        top: 0;
        vertical-align: middle;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: contain;
        z-index: 0;
        width: 1em;
        height: 1em;
        background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%226.59%22%20height%3D%2211.17%22%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M.29.29C-.1.68-.1%2C1.31.29%2C1.7l3.88%2C3.88L.29%2C9.46c-.39.39-.39%2C1.02%2C0%2C1.41.39.39%2C1.02.39%2C1.41%2C0l4.59-4.59c.39-.39.39-1.02%2C0-1.41L1.7.28c-.38-.38-1.02-.38-1.41.01Z%22%2F%3E%3C%2Fsvg%3E");
        transform: rotate(90deg);
        transition: all .3s ease-in-out;
        margin-left: auto;
        flex: 0 0 1em;
        align-self: center;
        width: .72rem;
        height: .72rem
    }

    .p-case-study__card__btn.is-open::after {
        transform: rotate(-90deg)
    }

    .p-case-study__card__img {
        width: 40px;
        height: 40px;
        align-self: center;
        flex: 0 0 40px
    }

    .p-case-study__card__img img {
        width: 24px
    }

    .p-case-study__card__read,
    .p-case-study__card__footer {
        display: none;
        opacity: 0;
        translate: 0 -10px;
        transition: all .3s ease-in-out
    }

    .p-case-study__card__read {
        margin-top: 16px
    }

    .p-case-study__column {
        grid-template-columns: repeat(1, 1fr);
        gap: 24px
    }

    .p-case-study__column:has(.c-icon--step) {
        grid-template-rows: 1fr 1fr;
        gap: 32px
    }

    .p-case-study__column .c-icon--step {
        transform: translate(-50%, -50%) rotate(90deg)
    }

    .p-case-study__column .u-bgc--lb-50 .c-tit--lv05 {
        color: #00a6cb
    }
}

.p-contact {
    display: flex;
    gap: clamp(56px, 10%, 76px)
}

.p-contact>* {
    flex: 1
}

.p-contact__box {
    flex: 0 0 56%;
    display: flex;
    flex-direction: column;
    gap: 24px
}

.p-contact__box__tit {
    font-size: clamp(1.5rem, -.3rem + 2vw, 2.1rem);
    font-weight: 600;
    line-height: 150%;
    letter-spacing: 1.2px;
    margin-bottom: clamp(.5rem, -.1rem + .6666666667vw, .7rem)
}

.p-contact__box__txt {
    font-size: clamp(.875rem, -.175rem + 1.1666666667vw, 1.225rem);
    font-style: normal;
    font-weight: 300;
    line-height: 180%;
    letter-spacing: .42px;
    margin-bottom: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem)
}

.p-contact__box .c-box {
    margin: 0
}

.p-contact [class*=c-btn]:hover {
    outline: 1px solid #fff
}

@media only screen and (max-width:1279px) {
    .p-contact {
        flex-direction: column;
        gap: 0
    }

    .p-contact__box {
        gap: 20px
    }
}

@media only screen and (max-width:440px) {
    .p-contact__box {
        flex-direction: column;
    }
}

.p-offering__img {
    text-align: center;
    margin: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem) 0 clamp(4.75rem, -.95rem + 6.3333333333vw, 6.65rem) 0
}

.p-offering__img img {
    width: 100%
}

.p-statement {
    /* display: flex; */
    gap: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem);
    position: relative;
    padding-top: clamp(8.75rem, -1.75rem + 11.6666666667vw, 12.25rem)
}

.p-statement__read {
    color: #fff;
    font-weight: 600;
    flex: 0 1 53%;
    margin-top: 6.25rem;
}

.p-statement__read--sp {
    display: none;
}

.js-typeing--1,
.js-typeing--3 {
    margin-bottom: 2rem;
}

/* .p-statement .c-tit--lv02 {
    align-items: center;
} */

@media only screen and (max-width:1279px) {
    .p-statement {
        flex-direction: column;
        padding-top: 0
    }

    .p-statement__read {
        padding-top: 0
    }

    .p-statement .c-tit--lv02 {
        position: relative;
        margin-bottom: 0;
        top: initial;
        flex: initial
    }

    #sec-statement+.u-bgc--grd-gray {
        padding: 40px 0
    }

    .p-offering__img {
        display: none;
    }

}

@media only screen and (max-width:440px) {

    .p-statement .c-tit--lv02 {
        margin-top: 78px;
    }

    .p-statement__read {
        display: none;
    }

    .p-statement__read--sp {
        display: block;
        color: #fff;
        font-weight: 600;
        margin-top: 20px;
    }

    .sp-txt {
        margin-top: 20px;
    }


    .sp-txt:first-child {
        margin-top: 0;
    }

}

.p-top {
    width: 100%;
    padding-top: 0
}

.p-top .l-inner {
    margin: auto;
    max-width: clamp(69.5rem, -13.9rem + 92.6666666667vw, 97.3rem)
}

.p-top__tit {
    position: relative;
    padding: clamp(15.625rem, -3.125rem + 20.8333333333vw, 21.875rem) 0 clamp(21rem, -4.2rem + 28vw, 29.4rem) 0
}

.p-top__tit .l-inner {
    margin: auto;
    width: calc(100% - clamp(4rem, -.8rem + 5.3333333333vw, 5.6rem) - clamp(4rem, -.8rem + 5.3333333333vw, 5.6rem))
}

.p-top__tit__bg {
    border-radius: 100%;
    width: 65vw;
    height: 65vw;
    position: absolute;
    bottom: 34px;
    left: 40%;
    overflow: hidden;
    z-index: -1;
    background-size: cover;
    background-position: center center;
    background-image: url("../img/top/kv_01.webp");
    box-shadow: 0px 4px 34px rgba(0, 0, 0, .2)
}

.p-top__tit__bg__img {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    opacity: 0;
    animation: image-switch-animation 16s infinite;
    overflow: hidden;
    display: flex
}

.p-top__tit__bg__img img {
    max-width: initial;
    object-fit: cover;
    min-width: 100%
}

.p-top__tit__bg__img:nth-of-type(1) {
    animation-delay: 0s
}

.p-top__tit__bg__img:nth-of-type(2) {
    animation-delay: 4s
}

.p-top__tit__bg__img:nth-of-type(3) {
    animation-delay: 8s
}

.p-top__tit__bg-img {
    position: absolute;
    top: 0;
    width: 100%;
    left: 0;
    opacity: 80%;
    z-index: -2
}

.p-top__tit__bg-img img {
    width: 100%
}

.p-top__tit__tit {
    font-weight: 600;
    font-size: clamp(3rem, -.6rem + 4vw, 4.2rem);
    line-height: 1.5;
    color: #1a2792;
    background-color: #fff;
    border-top: 6px solid #fff;
    border-bottom: 6px solid #fff;
    padding: 4px 20px;
    box-shadow: 10px 14px 0px 0px #1a2792, 0px 4px 4px 0px rgba(0, 0, 0, .25);
    display: inline;
    box-decoration-break: clone
}

.p-top__tit__tit .subtitle {
    font-size: clamp(3rem, -.6rem + 4vw, 4.2rem);
}

.p-top__tit .l-sec__bg img {
    top: calc(100% - 100px);
    right: clamp(-6.25rem, 1.25rem - 8.3333333333vw, -8.75rem)
}

.p-top .c-card-item--rss {
    position: absolute;
    bottom: 0;
    right: 8px;
    width: clamp(31.25rem, -6.25rem + 41.6666666667vw, 43.75rem);
    max-width: calc(100% - 32px)
}

.p-top .c-card-item--rss~.c-card-item--rss {
    display: none
}

@keyframes image-switch-animation {
    0% {
        opacity: 0
    }

    5% {
        opacity: 1
    }

    25% {
        opacity: 1
    }

    50% {
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

@media only screen and (max-width:1279px) {
    .p-top .l-inner {
        width: 100%
    }

    .p-top .l-sec {
        padding: 80px 0
    }

    .p-top__tit {
        padding-top: 84px;
        padding-bottom: 55vw;
        overflow: hidden
    }

    .p-top__tit .l-inner {
        width: 100%;
        padding: 0 1rem;
        margin: auto
    }

    .p-top__tit__tit {
        font-size: 32px;
        /* font-size: clamp(2rem, 2vw + 1rem, 3rem); */
        line-height: 1.8
    }

    .p-top__tit__tit .subtitle {
        font-size: clamp(2rem, 2vw + 1rem, 3rem);
        line-height: 1.8
    }

    .p-top__tit__bg {
        border-radius: 50%/100% 100% 0 0;
        width: 110vw;
        height: 55vw;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%)
    }

    .p-top__tit__bg-img {
        overflow: hidden;
        width: 100%;
        height: 100%
    }

    body:has(.p-top) .l-main:before {
        content: none
    }
}

@media only screen and (max-width:461px) {
    .p-top__tit__tit {
        font-size: 26px;
        line-height: 1.8
    }
}

@media only screen and (max-width:480px) {
    .p-top .c-card-item--rss {
        right: initial;
        left: 50%;
        transform: translateX(-50%);
        width: calc(100% - 32px)
    }
}

.p-top__info .l-sec__bg img {
    top: clamp(2.75rem, -.55rem + 3.6666666667vw, 3.85rem);
    right: clamp(-0.625rem, .125rem - .8333333333vw, -0.875rem)
}

.p-top__info__tit {
    display: flex;
    flex-wrap: wrap
}

.p-top__info__link {
    font-size: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    font-weight: 700;
    margin-left: auto
}

@media only screen and (max-width:1279px) {
    .p-top__info .c-tit--top--lv02 {
        margin-bottom: 12px
    }

    .p-top__info__tit {
        display: block;
        margin-bottom: clamp(4rem, -.8rem + 5.3333333333vw, 5.6rem)
    }
}

.p-top__tec {
    position: relative
}

.p-top__tec::before {
    content: "";
    display: block;
    background-color: #f4f4f4;
    border-top-left-radius: 50%;
    border-top-right-radius: 50%;
    height: clamp(7rem, -1.4rem + 9.3333333333vw, 9.8rem);
    margin-left: clamp(-3.5rem, .7rem - 4.6666666667vw, -4.9rem);
    margin-right: clamp(-3.5rem, .7rem - 4.6666666667vw, -4.9rem);
    padding-left: clamp(3.5rem, -.7rem + 4.6666666667vw, 4.9rem);
    padding-right: clamp(3.5rem, -.7rem + 4.6666666667vw, 4.9rem)
}

.p-top__tec__inner {
    text-align: center;
    background-color: #f4f4f4;
    padding-bottom: clamp(2.5rem, -0.5rem + 3.3333333333vw, 3.5rem)
}

.p-top__tec__tit-read {
    font-size: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    font-weight: 700;
    display: block;
    margin-bottom: clamp(.5rem, -.1rem + .6666666667vw, .7rem)
}

.p-top__tec__read {
    font-size: clamp(1.125rem, -.225rem + 1.5vw, 1.575rem);
    margin-bottom: clamp(4rem, -.8rem + 5.3333333333vw, 5.6rem)
}

.p-top__tec__read__txt {
    text-align: center;
}

.p-top-txt--sp {
    font-size: 18px;
    display: block;
    white-space: normal;
}

.p-top__tec .l-sec__bg img:nth-child(1) {
    left: clamp(5.625rem, -1.125rem + 7.5vw, 7.875rem);
    top: clamp(-0.75rem, .15rem - 1vw, -1.05rem)
}

.p-top__tec .l-sec__bg img:nth-child(2) {
    top: clamp(8.75rem, -1.75rem + 11.6666666667vw, 12.25rem);
    left: clamp(2.5rem, -0.5rem + 3.3333333333vw, 3.5rem)
}

.p-top__tec .l-sec__bg img:nth-child(3) {
    top: clamp(11.8125rem, -2.3625rem + 15.75vw, 16.5375rem);
    right: clamp(6.5rem, -1.3rem + 8.6666666667vw, 9.1rem)
}

.p-top__tec .l-sec__bg img:nth-child(4) {
    bottom: 0;
    left: clamp(2.5rem, -0.5rem + 3.3333333333vw, 3.5rem)
}

@media only screen and (max-width:1279px) {
    .p-top__tec .l-sec__bg img:nth-child(1) {
        width: 113.26px
    }

    .p-top__tec .l-sec__bg img:nth-child(2) {
        display: none
    }

    .p-top__tec .l-sec__bg img:nth-child(3) {
        width: 89.8px;
        right: -10px;
        bottom: -10px;
        top: initial
    }

    .p-top__tec .l-sec__bg img:nth-child(4) {
        width: 94.99px;
        left: -10px
    }
}

@media only screen and (max-width:520px) {
    .p-top__tec__read__txt {
        text-align: left;
    }

    .p-top-txt--sp {
        display: inline;
    }
}

.p-top__digital {
    background-color: #f4f4f4
}

.p-top__digital .l-sec__bg img:nth-child(1) {
    top: 0;
    right: 0
}

.p-top__digital .l-sec__bg img:nth-child(2) {
    left: 0;
    bottom: clamp(-5rem, 1rem - 6.6666666667vw, -7rem)
}

@media only screen and (max-width:1279px) {
    .p-top__digital .l-sec__bg img:nth-child(1) {
        right: -80px
    }
}

.p-top__case {
    position: relative
}

.p-top__case::after {
    content: "";
    display: block;
    background-color: #f4f4f4;
    border-bottom-left-radius: 50%;
    border-bottom-right-radius: 50%;
    height: clamp(7rem, -1.4rem + 9.3333333333vw, 9.8rem);
    margin-left: clamp(-3.5rem, .7rem - 4.6666666667vw, -4.9rem);
    margin-right: clamp(-3.5rem, .7rem - 4.6666666667vw, -4.9rem);
    padding-left: clamp(3.5rem, -.7rem + 4.6666666667vw, 4.9rem);
    padding-right: clamp(3.5rem, -.7rem + 4.6666666667vw, 4.9rem)
}

.p-top__case__inner {
    background-color: #f4f4f4;
    padding-top: clamp(2.5rem, -0.5rem + 3.3333333333vw, 3.5rem)
}

.p-top__case .l-sec__bg img {
    left: clamp(5rem, -1rem + 6.6666666667vw, 7rem);
    bottom: clamp(-3.125rem, .625rem - 4.1666666667vw, -4.375rem)
}

@media only screen and (max-width:1279px) {
    .p-top__case .l-sec__bg img {
        display: none
    }
}

.p-top__sns__recruit {
    text-align: center;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background-color: #121c68;
    margin-top: clamp(5.5rem, -1.1rem + 7.3333333333vw, 7.7rem);
    position: relative;
    overflow: hidden;
    transition: all .3s ease-in-out
}

.p-top__sns__recruit:has(a:hover) {
    opacity: .8
}

.p-top__sns__recruit__tit {
    font-size: clamp(3.5rem, -.7rem + 4.6666666667vw, 4.9rem);
    line-height: clamp(5.25rem, -1.05rem + 7vw, 7.35rem)
}

.p-top__sns__recruit__img {
    position: absolute;
    opacity: .5;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 0;
    object-fit: cover;
    max-width: initial;
    min-width: 100%;
}

.p-top__sns__recruit a {
    border-width: 0;
    color: #fff;
    position: relative;
    z-index: 1;
    display: block;
    height: 100%;
    width: 100%;
    padding: clamp(4rem, -.8rem + 5.3333333333vw, 5.6rem);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.p-top__sns .l-sec__bg img:nth-child(1) {
    top: clamp(-5rem, 1rem - 6.6666666667vw, -7rem);
    left: clamp(-5rem, 1rem - 6.6666666667vw, -7rem)
}

.p-top__sns .l-sec__bg img:nth-child(2) {
    bottom: clamp(-5rem, 1rem - 6.6666666667vw, -7rem);
    right: clamp(-5rem, 1rem - 6.6666666667vw, -7rem)
}

@media only screen and (max-width:1279px) {
    .p-top__sns .l-sec__bg img:nth-child(1) {
        top: -200px;
        z-index: -1
    }

    .p-top__sns__recruit a {
        padding: 1rem;
        min-height: 224px
    }

    .p-top__sns__recruit__tit {
        font-size: 52px;
        letter-spacing: .05em
    }

}

@media only screen and (max-width:1279px) and (min-width: 441px) {
    .p-top__sns__recruit__img {
        left: -5%;
        min-width: 110%;
        transform: translateY(-50%)
    }
}

@media only screen and (max-width:440px) {
    .p-top__sns__recruit__img {
        left: 130%;
    }
}

.p-top__more {
    color: #fff;
    background-color: #333;
    border-radius: 40px 40px 0 0;
    padding: clamp(4rem, -.8rem + 5.3333333333vw, 5.6rem) 0
}

.p-top__more__tit {
    font-size: clamp(3rem, -.6rem + 4vw, 4.2rem);
    line-height: 1.2
}

.p-top__more .l-inner {
    display: flex;
    gap: clamp(4rem, -.8rem + 5.3333333333vw, 5.6rem);
    position: relative
}

.p-top__more .l-inner::before {
    content: "";
    background-color: #fff;
    display: block;
    width: 1px;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.p-top__more article {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem)
}

.p-top__more [class*=c-btn] {
    width: clamp(27.5rem, -5.5rem + 36.6666666667vw, 38.5rem)
}

@media only screen and (max-width:1279px) {
    .p-top__more .l-inner {
        flex-direction: column
    }

    .p-top__more .l-inner::before {
        width: calc(100% - 32px);
        height: 1px
    }
}

.p-tec .l-inner {
    margin: auto;
    width: calc(100% - clamp(10.25rem, -2.05rem + 13.6666666667vw, 14.35rem) - clamp(10.25rem, -2.05rem + 13.6666666667vw, 14.35rem))
}

.p-tec__kv {
    color: #fff;
    background: url(../img/kv.webp) top left no-repeat;
    background-size: auto clamp(40rem, -8rem + 53.3333333333vw, 56rem);
    position: relative;
    display: flex;
    justify-content: flex-end
}

.p-tec__kv::before {
    content: "";
    background: linear-gradient(90deg, #0b103d 3.17%, #1a2792 100%);
    clip-path: polygon(30% 0, 100% 0, 100% 100%, 0 100%);
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 75%;
    height: 100%
}

.p-tec__kv__inner {
    font-weight: 600;
    text-align: center;
    padding: clamp(14.25rem, -2.85rem + 19vw, 19.95rem) clamp(5.625rem, -1.125rem + 7.5vw, 7.875rem) clamp(6.75rem, -1.35rem + 9vw, 9.45rem) clamp(15.625rem, -3.125rem + 20.8333333333vw, 21.875rem);
    position: relative
}

.p-tec__kv__tit {
    font-size: clamp(5rem, -1.3rem + 8.6666666667vw, 9.1rem);
    line-height: 1.2;
    text-shadow: #4a5dff 0px 0px 24px, #003 0px 0px 4px;
    margin-bottom: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem);
    white-space: nowrap;
}

.p-tec__kv__tit--sub {
    font-size: clamp(2.5rem, -0.5rem + 3.3333333333vw, 3.5rem);
    margin-bottom: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    display: block
}

.p-tec__kv__read {
    font-size: clamp(1.5rem, -.3rem + 2vw, 2.1rem)
}

.p-tec__kv .l-sec__bg img {
    transform: rotate(60deg);
    left: -50%
}

body:has(.p-tec) .l-main {
    padding-top: 0
}

@media only screen and (max-width:1023px) {
    .p-tec .l-inner {
        width: 100%
    }

    .p-tec__kv {
        background: url(../img/kv_sp.webp) top left no-repeat;
        background-size: contain;
        display: block;
    }

    .p-tec__kv::before {
        clip-path: polygon(0 10%, 100% 0, 100% 100%, 0 100%);
        width: 100%;
        height: calc(100% - 112px);
        top: 112px
    }

    .p-tec__kv__inner {
        padding: 214px 16px 2rem 16px
    }

    .p-tec__kv__tit {
        font-size: clamp(3rem, -1rem + 8.666667vw, 9rem)
    }

    .p-tec__kv__tit--sub {
        font-size: 24px
    }

    .p-tec__kv__read {
        font-size: 20px
    }

    .p-tec__kv .l-sec__bg img {
        top: 80%
    }

    body:has(.p-tec) .l-header__title--sp {
        display: none
    }

    body:has(.p-tec) .l-main:before {
        content: none
    }
}

.p-tec__read__tit {
    color: #fff;
    background-color: #1a2792;
    font-weight: 600;
    font-size: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem);
    display: inline-flex;
    align-items: flex-end;
    gap: clamp(.625rem, -0.125rem + .8333333333vw, .875rem);
    padding: clamp(.5rem, -.1rem + .6666666667vw, .7rem) clamp(1.5rem, -.3rem + 2vw, 2.1rem);
    margin-bottom: clamp(4rem, -.8rem + 5.3333333333vw, 5.6rem)
}

.p-tec__read__tit span {
    line-height: 1.8
}

.p-tec__read__tit span.p-tec__read__tit__bold {
    line-height: 1.5
}

.p-tec__read__tit__bold {
    font-size: clamp(3rem, -.6rem + 4vw, 4.2rem)
}

.p-tec__read__article {
    display: flex;
    gap: clamp(3rem, -.6rem + 4vw, 4.2rem)
}

.p-tec__read__article__tit {
    color: #0b103d;
    font-size: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem);
    font-weight: 600;
    line-height: 1.5;
    margin-bottom: clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem)
}

.p-tec__read__article__tit--lv2 {
    font-size: clamp(1.5rem, -.3rem + 2vw, 2.1rem);
    font-weight: 700;
    margin-bottom: clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem)
}

.p-tec__read__article__list {
    color: #1a2792;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: min-content;
    grid-auto-rows: auto;
    gap: clamp(2rem, .125rem + 2.08vw, 2.625rem);
    position: relative
}

.p-tec__read__article__list>li {
    font-weight: 600;
    text-align: center;
    background-color: initial;
    position: relative;
    padding: clamp(2.375rem, -.475rem + 3.1666666667vw, 3.325rem) clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    filter: drop-shadow(0px 4px 16px rgba(11, 16, 61, 0.1));
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap
}

.p-tec__read__article__list>li::before {
    background-color: #fff;
    clip-path: polygon(0 0, calc(100% - 28px) 0, 100% 28px, 100% 100%, 28px 100%, 0 calc(100% - 28px));
    content: "";
    display: block;
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 0;
    left: 0;
    top: 0
}

.p-tec__read__article__list>li::before {
    clip-path: polygon(0 calc(100% - 28px), 0 0, calc(100% - 28px) 0, 100% 28px, 100% 100%, 28px 100%)
}

.p-tec__read__article__list>li::before {
    z-index: -1
}

.p-tec__read__article__list>li>li {
    line-height: 1.2;
    position: relative
}

.p-tec__read__article__list>li em {
    position: relative
}

.p-tec__read__article__list>li em::before {
    content: "";
    background-color: #ffd220;
    width: 100%;
    height: clamp(.75rem, -.15rem + 1vw, 1.05rem);
    position: absolute;
    bottom: .2em;
    left: 0;
    z-index: -1
}

.p-tec__read__article__list>li span {
    font-size: clamp(1.5rem, -.3rem + 2vw, 2.1rem)
}

.p-tec__read__article__list>li br {
    flex: 0 0 100%
}

.p-tec__read__article--lv2 {
    margin: clamp(4rem, -.8rem + 5.3333333333vw, 5.6rem) 0 clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem) 0
}

.p-tec__read__article>div {
    flex: 0 1 50%
}

@media only screen and (max-width:1279px) {
    .p-tec__read__tit {
        font-size: 24px;
        display: inline-block
    }

    .p-tec__read__tit__bold {
        font-size: 32px
    }

    .p-tec__read__article {
        flex-direction: column
    }

    .p-tec__read__article__tit {
        font-size: 20px
    }

    .p-tec__read__article__tit--lv2 {
        font-size: 24px
    }

    .p-tec__read__article__list {
        grid-template-columns: repeat(1, 1fr)
    }
}

.p-tec__content__tit {
    overflow: hidden;
    paint-order: stroke;
    display: flex;
    width: max-content;
}

.p-tec__content__tit img {
    flex-shrink: 0;
    width: auto;
    margin-right: 40px;
    display: inline-block;
    animation: scroll 35s infinite linear 1s both;
    margin-top: 100px;
    height: 140px;
}

@keyframes p-tec__content__tit {
    0% {
        transform: translate(0);
    }

    100% {
        transform: translate(-100%);
    }
}

@media only screen and (max-width:440px) {
    .p-tec__content__tit img {
        height: 120px;
        margin-top: 94px;
    }
}

.p-tec__content__main {
    color: #fff;
    background: linear-gradient(180deg, #0b103d 0%, #1D2BA3 100%);
    border-radius: 80px;
    margin: auto clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    padding: clamp(5rem, -1rem + 6.6666666667vw, 7rem) clamp(9rem, -1.8rem + 12vw, 12.6rem);
    overflow: hidden;
    position: relative
}

.p-tec__content__main__read {
    font-size: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: clamp(.5rem, -.1rem + .6666666667vw, .7rem);
    margin-bottom: clamp(4rem, -.8rem + 5.3333333333vw, 5.6rem)
}

.p-tec__content__main__read::before {
    content: "";
    background-color: #fff;
    border-radius: 100%;
    display: block;
    width: clamp(.75rem, -.15rem + 1vw, 1.05rem);
    height: clamp(.75rem, -.15rem + 1vw, 1.05rem)
}

.p-tec__content__main__article {
    margin-bottom: clamp(10rem, -2rem + 13.3333333333vw, 14rem);
    display: flex;
    flex-wrap: wrap;
    gap: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem);
    align-items: center
}

.p-tec__content__main__article__txt,
.p-tec__content__main__article__img {
    flex: 0 1 calc(50% - clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem))
}

.p-tec__content__main__article__tit {
    border-bottom: 1px solid #fff;
    display: flex;
    flex-direction: column;
    margin-bottom: clamp(2.75rem, -.55rem + 3.6666666667vw, 3.85rem);
    padding-bottom: clamp(.25rem, -.05rem + .3333333333vw, .35rem)
}

.p-tec__content__main__article__tit__num {
    font-family: Roboto;
    font-weight: 700;
    font-size: clamp(4rem, -.8rem + 5.3333333333vw, 5.6rem);
    line-height: 1;
    color: rgba(0, 0, 0, 0);
    -webkit-text-stroke: 2px #fff;
    transform: skewX(-12deg)
}

.p-tec__content__main__article__tit__bold {
    font-weight: 600;
    font-size: clamp(2rem, -.7rem + 4.6666666667vw, 4.9rem);
    text-shadow: 0px 0px 4px rgba(0, 0, 0, .2), 0px 0px 24px #4a5dff;
    line-height: 1.5;
    white-space: nowrap
}

.p-tec__content__main__article__tit__bold--sub {
    font-weight: 600;
    font-size: clamp(1.2rem, -.7rem + 4.6666666667vw, 2rem);
    text-shadow: 0px 0px 4px rgba(0, 0, 0, .2), 0px 0px 24px #4a5dff;
    line-height: 1.5;
    white-space: nowrap
}

.p-tec__content__main__article__tit--lv2 {
    font-size: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem);
    font-weight: 600;
    line-height: 1.5;
    margin-bottom: clamp(1rem, -.2rem + 1.3333333333vw, 1.4rem)
}

.p-tec__content__main__article__img img {
    width: 100%
}

.p-tec__content__main .c-card--flame {
    grid-template-columns: repeat(auto-fit, minmax(clamp(18.75rem, -3.75rem + 25vw, 26.25rem), 1fr))
}

.p-tec__content__main .c-card--flame p {
    color: initial;
    transition: all .3s ease-in-out
}

.p-tec__content__main .c-card--flame>*:hover p {
    /* color: #fff  説明文の色を変更する */
}

.p-tec__content__main__movie {
    display: flex;
    justify-content: center;
    width: clamp(42.5rem, -8.5rem + 56.6666666667vw, 59.5rem);
    aspect-ratio: 16/9;
    margin: clamp(5rem, -1rem + 6.6666666667vw, 7rem) auto;
    position: relative
}

.p-tec__content__main__movie iframe {
    border-radius: 32px;
    border: clamp(1.25rem, -0.25rem + 1.6666666667vw, 1.75rem) solid hsla(0, 0%, 100%, .2);
    width: 100%;
    height: 100%;
    overflow: hidden
}

.p-tec__content__main__movie:before,
.p-tec__content__main__movie:after {
    content: "";
    background: url(../img/tec/bg_movie.svg) center 0 no-repeat;
    background-size: contain;
    display: block;
    width: 100%;
    aspect-ratio: 78/5;
    position: absolute;
    left: 0
}

.p-tec__content__main__movie::before {
    top: clamp(-3.625rem, .725rem - 4.8333333333vw, -5.075rem)
}

.p-tec__content__main__movie:after {
    bottom: clamp(-3.625rem, .725rem - 4.8333333333vw, -5.075rem)
}

.p-tec__content .l-sec__bg img {
    opacity: .5
}

.p-tec__content .l-sec__bg img:nth-child(1) {
    right: -40%;
    top: -20%
}

.p-tec__content .l-sec__bg img:nth-child(2) {
    left: -50%;
    top: 20%
}

.p-tec__content .l-sec__bg img:nth-child(3) {
    left: -50%;
    bottom: -12%
}

@media only screen and (max-width:1279px) {
    .p-tec__content__main {
        border-radius: 32px;
        padding: 80px 16px;
        margin: auto 16px
    }

    .p-tec__content__main__article {
        flex-direction: column
    }

    /* .p-tec__content__main__article__tit__bold {
        font-size: 48px
    }

    .p-tec__content__main__article__tit__bold--sub {
        font-size: 24px
    } */

    .p-tec__content__main__article__tit--lv2 {
        font-size: 24px
    }

    .p-tec__content__main__movie {
        width: 100%;
        margin: 5.3vw 0
    }

    .p-tec__content__main__movie iframe {
        border-width: 12px
    }

    .p-tec__content__main__movie::before {
        top: -2rem
    }

    .p-tec__content__main__movie::after {
        bottom: -2rem
    }

    .p-tec__content .l-sec__bg img {
        opacity: 1
    }

    .p-tec__content .l-sec__bg img:nth-child(1) {
        top: -3%
    }

    .p-tec__content .l-sec__bg img:nth-child(2) {
        left: 0
    }
}

.p-tec__sns {
    overflow: hidden
}

.p-tec__sns .l-sec__bg img {
    right: -50%;
    top: -10%
}

.p-tec__floatbtn {
    border-radius: 100%;
    background: linear-gradient(0deg, #ffffff 0%, #caceeb 100%);
    box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, .15);
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(6.75rem, -1.35rem + 9vw, 9.45rem);
    height: clamp(6.75rem, -1.35rem + 9vw, 9.45rem);
    position: fixed;
    bottom: clamp(1.5rem, -.3rem + 2vw, 2.1rem);
    right: clamp(2rem, -.4rem + 2.6666666667vw, 2.8rem);
    transition: all .3s ease-in-out
}

.p-tec__floatbtn::before {
    content: "";
    background: url(../img/doc.webp) no-repeat;
    background-size: contain;
    display: block;
    width: clamp(3.75rem, -0.75rem + 5vw, 5.25rem);
    height: clamp(4.1875rem, -.8375rem + 5.5833333333vw, 5.8625rem);
    transform: rotate(-25deg);
    transform-origin: center bottom;
    position: absolute;
    top: -40%;
    left: 10%;
    z-index: -2
}

.p-tec__floatbtn__inner {
    font-size: clamp(.75rem, -.15rem + 1vw, 1.05rem);
    color: #1a2792;
    font-weight: 600;
    border-radius: 100%;
    border-bottom-width: 0;
    background: linear-gradient(121.2deg, #f2f6ff 16.24%, #d4d8f5 85.21%);
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, .12), -5px -5px 4px 0px rgba(26, 39, 146, .15) inset, 5px 5px 4px 0px rgba(26, 39, 146, .2) inset;
    width: clamp(6.25rem, -1.25rem + 8.3333333333vw, 8.75rem);
    height: clamp(6.25rem, -1.25rem + 8.3333333333vw, 8.75rem);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: clamp(.25rem, -.05rem + .3333333333vw, .35rem);
    position: relative;
    z-index: 0;
    transition: all .3s ease-in-out
}

.p-tec__floatbtn a {
    border-bottom-width: 0;
    z-index: 2;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 0;
    color: rgba(0, 0, 0, 0);
    overflow: hidden;
    text-indent: -100%;
    white-space: nowrap;
    display: table-column;
    z-index: 1
}

.p-tec__floatbtn a::after {
    content: none !important
}

.p-tec__floatbtn a:after {
    transition: all .3s ease-in-out
}

@starting-style {
    .p-tec__floatbtn a:after {
        content: none;
        opacity: 0;
        background-color: rgba(0, 0, 0, 0)
    }
}

.p-tec__floatbtn a:hover:after {
    content: "";
    background-color: hsla(0, 0%, 100%, .2);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 0;
    opacity: 1
}

.p-tec__floatbtn span {
    text-align: center;
    line-height: 1.5
}

.p-tec__floatbtn:has(a:hover) {
    bottom: clamp(1.375rem, -.275rem + 1.8333333333vw, 1.925rem);
    box-shadow: none
}

.p-tec__floatbtn:has(a:hover) .p-tec__floatbtn__inner {
    box-shadow: none
}


@media only screen and (max-width:1279px) {
    .p-tec__floatbtn {
        display: none
    }
}

.u-ta--c {
    text-align: center !important
}

.u-ta--r {
    text-align: right !important
}

.u-ta--l {
    text-align: left !important
}

.u-ta--c--area {
    margin-left: auto;
    margin-right: auto
}

.u-va--t {
    vertical-align: top !important
}

.u-va--m {
    vertical-align: middle !important
}

.u-va--b {
    vertical-align: bottom !important
}

.u-flex--dir-clm {
    flex-direction: column
}

@media only screen and (max-width:440px) {
    .u-sp-ta--c {
        text-align: center !important
    }

    .u-sp-ta--r {
        text-align: right !important
    }

    .u-sp-ta--l {
        text-align: left !important
    }

    .u-sp-ta--c__area {
        margin-left: auto;
        margin-right: auto
    }

    .u-sp-va--t {
        vertical-align: top !important
    }

    .u-sp-va--m {
        vertical-align: middle !important
    }

    .u-sp-va--b {
        vertical-align: bottom !important
    }
}

.u-fc--primary {
    color: #1a2792 !important
}

.u-fill--primary {
    fill: #1a2792 !important
}

.u-bdc--primary {
    border-color: #1a2792 !important
}

.u-fc--secondary {
    color: #00a6cb !important
}

.u-fill--secondary {
    fill: #00a6cb !important
}

.u-bdc--secondary {
    border-color: #00a6cb !important
}

.u-fc--bk-200 {
    color: #a1a1a1 !important
}

.u-fill--bk-200 {
    fill: #a1a1a1 !important
}

.u-bdc--bk-200 {
    border-color: #a1a1a1 !important
}

.u-fc--w {
    color: #fff !important
}

.u-fill--w {
    fill: #fff !important
}

.u-bdc--w {
    border-color: #fff !important
}

.u-fc--txt {
    color: #333 !important
}

.u-fill--txt {
    fill: #333 !important
}

.u-bdc--txt {
    border-color: #333 !important
}

.u-bgc--primary {
    background-color: #0B0B2F !important
}

.u-bgc--secondary {
    background-color: #00a6cb !important
}

.u-bgc--gray-bg {
    background-color: #EEF0EC !important
}

.u-bgc--bk-50 {
    background-color: #ebebeb !important
}

.u-bgc--bk-300 {
    background-color: #767676 !important
}

.u-bgc--lb-50 {
    background-color: #E6ECF3 !important
}

.u-bgc--lb-400 {
    background-color: #33b8d5 !important
}

.u-bgc--lb-600 {
    background-color: #0097b9 !important
}

.u-bgc--w {
    background-color: #fff !important
}

.u-bgc--grd {
    background: #EEF0EC
}

.u-op--80 {
    opacity: .8
}

@media only screen and (max-width:440px) {
    .u-sp-fc--primary {
        color: #1a2792 !important
    }

    .u-sp-fill--primary {
        fill: #1a2792 !important
    }

    .u-sp-bdc--primary {
        border-color: #1a2792 !important
    }

    .u-sp-fc--secondary {
        color: #00a6cb !important
    }

    .u-sp-fill--secondary {
        fill: #00a6cb !important
    }

    .u-sp-bdc--secondary {
        border-color: #00a6cb !important
    }

    .u-sp-fc--bk-200 {
        color: #a1a1a1 !important
    }

    .u-sp-fill--bk-200 {
        fill: #a1a1a1 !important
    }

    .u-sp-bdc--bk-200 {
        border-color: #a1a1a1 !important
    }

    .u-sp-fc--w {
        color: #fff !important
    }

    .u-sp-fill--w {
        fill: #fff !important
    }

    .u-sp-bdc--w {
        border-color: #fff !important
    }

    .u-sp-fc--txt {
        color: #333 !important
    }

    .u-sp-fill--txt {
        fill: #333 !important
    }

    .u-sp-bdc--txt {
        border-color: #333 !important
    }

    .u-sp-bgc--primary {
        background-color: #1a2792 !important
    }

    .u-sp-bgc--secondary {
        background-color: #00a6cb !important
    }

    .u-sp-bgc--gray-bg {
        background-color: #f4f4f4 !important
    }

    .u-sp-bgc--bk-50 {
        background-color: #ebebeb !important
    }

    .u-sp-bgc--bk-300 {
        background-color: #767676 !important
    }

    .u-sp-bgc--lb-50 {
        background-color: #e6f6fa !important
    }

    .u-sp-bgc--lb-400 {
        background-color: #33b8d5 !important
    }

    .u-sp-bgc--lb-600 {
        background-color: #0097b9 !important
    }

    .u-sp-bgc--w {
        background-color: #fff !important
    }
}

.u-dis--in {
    display: inline !important
}

.u-dis--inbk {
    display: inline-block !important
}

.u-dis--bk {
    display: block !important
}

.u-dis--none {
    display: none !important
}

.u-dis--flex {
    display: flex !important
}

.u-dis--inflex {
    display: inline-flex !important
}

.is-hidden {
    visibility: hidden
}

.u-img--areafull {
    overflow: hidden;
    position: relative;
    z-index: 0
}

.u-img--areafull img {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    position: absolute;
    max-width: none;
    min-width: inherit;
    height: 100%
}

@media only screen and (min-width:1280px) {

    .is-sp-s,
    .is-sp-s--inbk,
    .is-sp-s--flex,
    .is-sp-s--ingrid,
    .is-sp,
    .is-sp--inbk,
    .is-sp--flex,
    .is-sp--ingrid {
        display: none !important;
        transition: all .3s ease-in-out
    }

    .is-pc,
    .is-pc--inbk,
    .is-pc--flex {
        transition: all .3s ease-in-out
    }

    .is-pc {
        display: block !important
    }

    .is-pc--inbk {
        display: inline-block !important
    }

    .is-pc--flex {
        display: flex !important
    }

    .is-pc--inflex {
        display: inline-flex !important
    }

    .is-pc--in {
        display: inline !important
    }

    .is-pc[class*=c-icon] {
        display: inline-grid !important
    }
}

@media only screen and (max-width:1279px) {
    .is-pc {
        display: none !important;
        transition: all .3s ease-in-out
    }

    .is-pc--inbk,
    .is-pc--flex,
    .is-pc--inflex,
    .is-pc--in {
        display: none !important
    }

    .is-sp,
    .is-sp--inbk,
    .is-sp--flex,
    .is-sp--ingrid {
        transition: all .3s ease-in-out
    }

    .is-sp-s,
    .is-sp-s--inbk,
    .is-sp-s--flex,
    .is-sp-s--ingrid {
        display: none !important
    }

    .is-sp {
        display: block !important
    }

    .is-sp--inbk {
        display: inline-block !important
    }

    .is-sp--flex {
        display: flex !important
    }

    .is-sp--ingrid {
        display: inline-grid !important
    }

    .u-sp-dis--in {
        display: inline !important
    }

    .u-sp-dis--inbk {
        display: inline-block !important
    }

    .u-sp-dis--bk {
        display: block !important
    }

    .u-sp-dis--none {
        display: none !important
    }

    .u-sp-dis--flex {
        display: flex !important
    }

    .u-sp-dis--inflex {
        display: inline-flex !important
    }

    .u-sp-dis--no {
        display: none !important;
        transition: all .2s ease
    }

    .u-sp-img--areafull {
        overflow: hidden;
        position: relative;
        z-index: 0
    }

    .u-sp-img--areafull img {
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        position: absolute;
        max-width: none;
        min-width: inherit;
        height: 100%
    }
}

@media only screen and (max-width:440px) {

    .is-sp-s,
    .is-sp-s--inbk,
    .is-sp-s--flex,
    .is-sp-s--ingrid {
        transition: all .3s ease-in-out
    }

    .is-sp-s {
        display: block !important
    }

    .is-sp-s--inbk {
        display: inline-block !important
    }

    .is-sp-s--flex {
        display: flex !important
    }

    .is-sp-s--ingrid {
        display: inline-grid !important
    }

    .is-sp-s--none {
        display: none !important
    }
}

.u-fz--14 {
    font-size: clamp(.875rem, -.175rem + 1.1666666667vw, 1.225rem)
}

.u-mt--xl {
    margin-top: clamp(2.5rem, .063rem + 2.71vw, 3.313rem)
}

.u-mb--xl {
    margin-bottom: clamp(2.5rem, .063rem + 2.71vw, 3.313rem)
}

.u-w--100per {
    width: 100% !important
}

.c-txt-block {
    display: inline-block;
    white-space: nowrap
}

@media only screen and (max-width:1279px) {
    .u-mt--xl {
        margin-top: 32px
    }

    .u-mb--xl {
        margin-bottom: 32px
    }

    .u-sp-gap--xs {
        gap: 32px
    }

    .c-txt-block--sp {
        display: inline-block;
        white-space: nowrap
    }

}

/* クラウドネイティブのカード */
.cloudnative-list {
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0;
}

.cloudnative-card {
    display: flex;
    align-items: stretch;
    border: 1px solid #DBDBDB;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.04);
    padding: 0;
    overflow: hidden;
    max-width: 560px;
    min-height: 160px;
}

.cloudnative-card::after {
    content: none !important;
    display: none !important;
}

.cloudnative-card__thumb {
    width: 320px;
    height: 160px;
    object-fit: cover;
    flex-shrink: 0;
    display: block;
}

.cloudnative-card__body {
    flex: 1;
    padding: 0 0 0 8px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.cloudnative-card__title {
    text-decoration: underline;
    font-weight: bold;
    font-size: 1em;
    color: #333333;
}

.cloudnative-card__meta {
    color: #333333;
    font-size: 0.75em;
    font-weight: bold;
}

@media screen and (max-width: 440px) {
    .cloudnative-card {
        display: block;
        width: 100%;
        max-width: none;
        min-height: auto;
        padding: 0;
    }

    .cloudnative-card__thumb {
        width: 100%;
        height: auto;
        display: block;
    }

    .cloudnative-card__body {
        padding: 12px;
        border: 1px solid #DBDBDB;
    }

    .cloudnative-card__title {
        font-size: 1rem;
        margin-bottom: 8px;
    }

    .cloudnative-card__meta {
        font-size: 0.85rem;
        color: #333;
    }

    .no-icon::after {
        content: none !important;
    }
}


/*# sourceMappingURL=style_ai.css.map */