main {
    --Color-navy-50: #577789;
    --Color-navy-85: #D2DBE0;
    --Color-navy-90: #DDE4E7;
    --Color-navy-100: #FFF;

    --Accent-Blue: #7DA0BE;
    --Bright-Yellow: #FF0;
    --Dandelion-Yellow: #EEE93A;
    --Darker-Grayish-Blue: #526770;
    --MZV-Blue: #14415A;
    --Light-Blue: #E5EAEC;
    --Pink: #B63580;
    --White: #FFF;

    --onPrimary: #14415A;

    --Secondary: #14415A;
    --onSecondary: #fff;

    --Surface: #F2F2F3;
    --surfaceBright: #FFF;
    --surfaceVariant: #E5EAEC;
    --onSurfaceVariant: #365C72;
}

.mobile-only {
    display: none !important;
}

.oi-title {
    display: flex;
    min-width: 601px;
    max-width: 800px;
    padding: 120px 40px 16px 40px;
    flex-direction: column;
    align-items: center;
    gap: 32px;
}

.en-subtitle {
    align-self: center;
    padding-bottom: 4px;
    border-bottom: 4px solid var(--Dandelion-Yellow);
    color: var(--onSurfaceVariant);
    text-align: center;
    font-family: "Avenir Next" !important;
    font-size: 26px !important;
    font-style: normal !important;
    font-weight: 600 !important;
    line-height: 26px !important;
    letter-spacing: 0.8px !important;
}

h2.oi-h2 {
    padding-bottom: 16px;
    color: var(--MZV-Blue);
    text-align: center;
    /* JP/Desktop/H2 */
    font-family: "Noto Sans JP" !important;
    font-size: 34px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 44px !important;
    letter-spacing: 0.8px !important;
}

h3.oi-h3 {
    display: flex;
    padding: 48px 0 16px 0;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: var(--MZV-Blue);
    text-align: center;
    /* JP/Desktop/H3 */
    font-family: "Noto Sans JP" !important;
    font-size: 27px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 36px !important;
    letter-spacing: 0.8px !important;
}

p.oi-p {
    /* display: flex; */
    min-width: 480px;
    max-width: 880px;
    padding: 0 40px;
    /* flex-direction: column;
    justify-content: center; */
    align-items: center;
    /* align-self: stretch; */

    color: var(--MZV-Blue);
    /* JP/Desktop/P 16 - Main */
    font-family: "Noto Sans JP" !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 500 !important;
    line-height: 28.8px !important;
    letter-spacing: 0.8px !important;
}

section#oi-challenges {
    background: var(--Color-navy-90);
    display: flex;
    padding-bottom: 120px;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    align-self: stretch;
    width: 100%;
}

ul.onayami-container {
    display: flex;
    padding: 0 24px 0 16px;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    /* align-self: stretch; */
}

li.onayami-child {
    display: flex;
    max-width: 800px;
    padding: 32px 40px 32px 48px;
    align-items: center;
    gap: 40px;
    align-self: stretch;

    border-radius: 1000px 60px 60px 1000px;
    background: white;
    box-shadow: 8px 8px 32px 5px rgba(85, 124, 170, 0.12);
}

.onayami-left {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.onayami-onayami {
    color: var(--Color-navy-50);
    font-family: "Noto Sans JP" !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 18px !important;
    letter-spacing: 0 !important
}

.onayami-num {
    padding-left: 2px;
    color: var(--Color-navy-50);
    font-family: "Noto Sans JP" !important;
    font-size: 50px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 50px !important;
    letter-spacing: 0 !important;
}

.onayami-right {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    flex: 1 0 0;
}

strong.onayami-title {
    color: var(--MZV-Blue);
    /* JP/Desktop/H3 */
    font-family: "Noto Sans JP" !important;
    font-size: 27px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 32.4px !important;
    letter-spacing: 0.8px !important;
}

p.onayami-p {
    color: var(--MZV-Blue);
    /* JP/Desktop/P 16 - Main */
    font-family: "Noto Sans JP" !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 500 !important;
    line-height: 28.8px !important;
    letter-spacing: 0.8px !important;
}

section#oi-acceleration {
    display: flex;
    padding-bottom: 120px;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    align-self: stretch;
    background-color: var(--Surface);
}

section#oi-acceleration .diagram-container {
    display: flex;
    width: 1000px;
    max-width: 1000px;
    padding: 80px 40px 70px 40px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 24px;
    background: var(--Color-navy-100);
}

.services-graph-container {
    display: flex;
    max-width: 920px;
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
}

.services-l {
    display: flex;
    width: 136px;
    min-width: 136px;
    padding-bottom: 32px;
    justify-content: center;
    align-items: center;
}

.service-white-circle-l {
    display: flex;
    width: 136px;
    height: 136px;
    max-width: 136px;
    max-height: 136px;
    padding-bottom: 8px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    aspect-ratio: 1/1;
    border-radius: 1000px;
    background: var(--Surface);
}

.circle-text {
    color: var(--Secondary);
    text-align: center;
    font-family: "Noto Sans JP" !important;
    font-size: 12.5px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 12.5px !important;
}

.arrow-padding-box-l {
    display: flex;
    padding: 0 8px 48px 12px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex: 1 0 0;
}

.services-m {
    display: flex;
    width: 358px;
    min-width: 280px;
    max-width: 358px;
    padding: 0 8px;
    flex-direction: column;
    align-items: center;
}

.services-m-top {
    display: flex;
    min-width: 280px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: -10px;
    align-self: stretch;
}

.services-m-t-title {
    display: flex;
    min-width: 220px;
    max-width: 320px;
    padding: 6px 8px 7px 8px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 1000px;
    background: var(--Secondary);
    color: var(--onSecondary);
    text-align: center;
    font-family: "Noto Sans JP" !important;
    font-size: 12px !important;
    font-style: normal !important;
    font-weight: 600 !important;
    line-height: 12.5px !important;
    letter-spacing: 0 !important;
    /* 104.167% */
    margin-bottom: -10px;
    z-index: 1;
}

.services-m-t-ul {
    display: flex;
    min-width: 280px;
    max-width: 340px;
    padding: 45px 48px 35px 48px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 8px;
    background: var(--surfaceVariant);
}

.services-m-t-li {
    display: flex;
    min-width: 230px;
    padding: 6px 12px 7px 12px;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    border-radius: 1000px;
    border: 1.5px solid var(--Accent-Blue);
    background: var(--surfaceBright);
    color: var(--Secondary);
    text-align: center;

    /* JP/Desktop/P 16 - Main */
    font-family: "Noto Sans JP" !important;
    font-size: 12.5px !important;
    font-style: normal !important;
    font-weight: 600 !important;
    line-height: 12.5px !important;
}

.services-m-bottom {
    display: flex;
    height: 95px;
    justify-content: center;
    align-items: flex-start;
    gap: 16px;
}

.services-m-b-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    align-self: stretch;
    gap: 10px;
}

.services-m-b-container-l {
    width: 150px;
}

.services-m-b-child {
    display: flex;
    min-width: 60px;
    max-width: 150px;
    padding: 12px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex: 1 0 0;
    align-self: stretch;
    border-radius: 6px;
    border: 1.5px solid var(--Pink);
    background: var(--surfaceBright);
    color: var(--Secondary);
    text-align: center;
    font-family: "Noto Sans JP" !important;
    font-size: 12.5px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 12.5px !important;
    /* 100% */
    letter-spacing: 0 !important;
}

.services-m-b-child-s {
    display: flex;
    width: 60px;
    min-width: 60px;
    max-width: 150px;
    padding: 12px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    flex: 1 0 0;
    border-radius: 6px;
    border: 1.5px solid var(--Pink);
    background: var(--surfaceBright);
    color: var(--Secondary);
    text-align: center;
    font-family: "Noto Sans JP" !important;
    font-size: 12.5px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 12.5px !important;
    letter-spacing: 0 !important;
}

.arrow-padding-box-r {
    display: flex;
    padding: 0 12px 48px 8px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex: 1 0 0;
}

.services-r {
    display: flex;
    width: 260px;
    min-width: 260px;
    padding-bottom: 24px;
    flex-direction: column;
    align-items: flex-start;
    /* gap: -50px; */
}

.service-white-circle-r-1 {
    display: flex;
    width: 136px;
    height: 136px;
    max-width: 136px;
    max-height: 136px;
    padding-bottom: 8px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    aspect-ratio: 1/1;
    border-radius: 1000px;
    background: var(--Surface);
}

.service-white-circle-padding-r {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    align-self: stretch;
    margin-top: -50px;
    /* Because we cannot do gap: -50px; */
}

.service-white-circle-r-2 {
    display: flex;
    width: 136px;
    height: 136px;
    max-width: 136px;
    max-height: 136px;
    padding-bottom: 14px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    aspect-ratio: 1/1;
    border-radius: 1000px;
    background: var(--Surface);
}

section#oi-model {
    display: flex;
    padding-bottom: 120px;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    align-self: stretch;
    background: var(--surfaceVariant);
}

p.oi-p b {
    color: var(--MZV-Blue);
    font-family: "Noto Sans JP" !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 800 !important;
    line-height: 30px !important;
    letter-spacing: 0.8px !important;
}

table.oi-table {
    display: flex;
    min-width: 542px;
    padding: 0 16px;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    align-self: stretch;
}

table.oi-table thead,
table.oi-table tbody {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    min-width: 542px;
    max-width: 800px;
    width: 100%;
}

table.oi-table thead tr {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    align-self: stretch;
}

table.oi-table thead tr th {
    display: flex;
    height: 48px;
    justify-content: center;
    align-items: center;
    flex: 1 0 0;
    border-radius: 24px;

    text-align: center;
    font-family: "Noto Sans JP" !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 30px !important;
    letter-spacing: 0 !important;
}

table.oi-table thead tr th.t-origin {
    min-width: 105px;
    max-width: 120px;
    width: 160px;
    background: var(--Secondary);
    color: var(--onSecondary);
}

table.oi-table thead tr th.col-th {
    min-width: 200px;
    max-width: 320px;
    width: 288px;
    background: var(--Color-navy-85);
    color: var(--Secondary);
}

table.oi-table tbody tr {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    align-self: stretch;
}

table.oi-table tbody tr th,
table.oi-table tbody tr td {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1 0 0;
    background: var(--surfaceBright);
    text-align: center;
    font-family: "Noto Sans JP" !important;
    font-style: normal !important;
}

table.oi-table tbody tr th {
    height: 100px;
    min-width: 105px;
    max-width: 120px;
    padding: 0 8px;
    border-radius: 80px;
    color: var(--onPrimary);
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 16px !important;
    letter-spacing: 0 !important;
}

table.oi-table tbody tr td {
    border-radius: 24px;
    min-width: 200px;
    max-width: 320px;
    min-height: 80px;
    padding: 16px 24px;
    align-self: stretch;
    color: var(--Secondary);
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 21px !important;
    letter-spacing: 0 !important;
    /* 157.143% */
}

.model-diagram-container {
    display: flex;
    max-width: 1000px;
    width: 100%;
    padding: 80px 16px;
    justify-content: center;
    align-items: center;
    gap: 56px;
    /* align-self: stretch; */
    border-radius: 24px;
    background: var(--Color-navy-85);
}

.model-diagram {
    display: flex;
    min-width: 570px;
    max-width: 832px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 24px;
    flex: 1 0 0;
}

.model-diagram-t {
    display: flex;
    align-items: center;
    gap: 16px;
    align-self: stretch;
}

.model-diagram-child {
    display: flex;
    min-width: 270px;
    max-width: 408px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /* gap: 16px; */
    flex: 1 0 0;
}

.model-diagram .model-title {
    z-index: 2;
    margin-bottom: -24px;
    display: flex;
    max-width: 300px;
    /* flex-direction: column; */
    /* align-items: flex-start; */
    /* align-self: stretch; */
    padding: 8px 23px 14px 23px;
    /* justify-content: center; */
    /* gap: 10px; */
    border-radius: 80px;
    background: var(--MZV-Blue);

    color: var(--White);
    font-family: "Noto Sans JP" !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 800 !important;
    line-height: normal !important;
    letter-spacing: 0 !important;
}

.model-diagram .model-title span {
    text-wrap: nowrap;
    color: var(--White);
    font-family: "Noto Sans JP" !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 800 !important;
    line-height: normal !important;
    letter-spacing: 0 !important;
}

.model-diagram .model-title span.underline {
    text-decoration-line: underline;
    text-decoration-style: dotted;
    text-decoration-skip-ink: auto;
    text-decoration-thickness: 15.5%;
    text-underline-offset: 25%;
    text-underline-position: from-font;
    font-family: "Noto Sans JP" !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 800 !important;
    line-height: normal !important;
    letter-spacing: 0 !important;
}

.model-diagram .model-body {
    display: flex;
    width: 100%;
    max-width: 408px;
    padding: 40px 28px 32px 28px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    border-radius: 16px;
    background: var(--Color-navy-100);
    box-shadow: 0 4px 20px 0 rgba(188, 199, 208, 0.40);
}

.model-body-child {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    align-content: flex-start;
    gap: 4px;
    flex-wrap: wrap;
    width: max-content;
    max-width: fit-content;

    color: var(--MZV-Blue);
    text-align: center;
    font-family: "Noto Sans JP" !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 900 !important;
    line-height: 21.6px !important;
    letter-spacing: 0.36px !important;
}

.model-diagram-b {
    display: flex;
    padding: 16px 24px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    border-radius: 16px;
    background: var(--Color-navy-100);
    box-shadow: 0 4px 20px 0 rgba(188, 199, 208, 0.40);

    color: var(--Pink);
    text-align: center;
    font-family: "Noto Sans JP" !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 900 !important;
    line-height: normal !important;
    letter-spacing: 0.36px !important;
}

ul.kyoso-container {
    display: flex;
    padding: 0 40px;
    flex-direction: column;
    align-items: center;
    /* align-self: stretch; */
    max-width: 880px;
    width: 100%;
}

ul.kyoso-container li {
    display: flex;

    padding: 16px 0;
    /* justify-content: center; */
    align-items: center;
    align-self: stretch;
    border-bottom: 2px solid var(--Accent-Blue);
    color: var(--MZV-Blue);

    /* JP/Desktop/P 18 - L */
    font-family: "Noto Sans JP" !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 28px !important;
    letter-spacing: 0.8px !important;
}

ul.feature-container {
    display: flex;
    min-width: 601px;
    max-width: 660px;
    padding-left: 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 11px;
    /* align-self: stretch; */
}

ul.feature-container li {
    display: flex;
    align-items: center;
    gap: 8px;
    align-self: stretch;
}

ul.feature-container .feature-icon {
    display: flex;
    width: 80px;
    height: 80px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    aspect-ratio: 1/1;
    border-radius: 1000px;
    background: var(--surfaceBright);
}

ul.feature-container .feature-content {
    display: flex;
    min-height: 60px;
    padding: 8px 32px;
    align-items: center;
    gap: 10px;
    flex: 1 0 0;
    border-radius: 1000px 8px 8px 1000px;
    background: var(--surfaceBright);
    color: var(--MZV-Blue);
    font-family: "Noto Sans JP" !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 18px !important;
    letter-spacing: 0.8px !important;
}

section#oi-capabilities {
    display: flex;
    padding-bottom: 120px;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    align-self: stretch;
    background: var(--Color-navy-85);
}

ul.capa-cards {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    align-content: flex-start;
    gap: 24px;
    align-self: stretch;
    flex-wrap: wrap;
}

ul.capa-cards li {
    display: flex;
    width: 348px;
    flex-direction: column;
    align-items: center;
    /* gap: -24px; */
}

ul.capa-cards li .capa-icon {
    display: flex;
    padding: 32px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 1000px;
    background: var(--surfaceBright);
    z-index: 2;
}

ul.capa-cards li .capa-text {
    margin-top: -24px;
    display: flex;
    padding: 40px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 16px;
    align-self: stretch;
    border-radius: 24px;
    background: var(--surfaceVariant);
}

ul.capa-cards li .capa-title {
    align-self: stretch;
    color: var(--MZV-Blue);
    text-align: center;
    font-family: "Noto Sans JP" !important;
    font-size: 24px !important;
    font-style: normal !important;
    font-weight: 800 !important;
    line-height: 32px !important;
    letter-spacing: 0.8px !important;
}

ul.capa-cards li .capa-body {
    display: flex;
    padding: 0 16px 0 24px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    align-self: stretch;
    flex: 1 0 0;
    color: var(--MZV-Blue);

    /* JP/Desktop/P 18 - L */
    font-family: "Noto Sans JP" !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 28px !important;
    letter-spacing: 0.8px !important;
}

.mil-services-container {
    display: flex;
    padding: 0 20px;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    align-self: stretch;
}

.mil-service-card {
    display: flex;
    min-width: 580px;
    max-width: 1000px;
    padding: 48px 48px 48px 24px;
    justify-content: center;
    align-items: flex-start;
    align-content: flex-start;
    gap: 24px 0;
    /* align-self: stretch; */
    flex-wrap: wrap;
    border-radius: 24px;
    background: var(--surfaceBright, #FFF);

    /* Soft Shadow */
    box-shadow: 8px 8px 32px 5px rgba(85, 124, 170, 0.12);
}

.mil-service-l {
    display: flex;
    height: 455px;
    min-width: 240px;
    max-width: 400px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex: 1 0 0;
}

.hero-image {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex: 1 0 0;
    align-self: stretch;
    border-radius: 8px;
    /* background: lightgray 50% / contain no-repeat; */
}

.mil-service-r {
    display: flex;
    min-width: 280px;
    padding-left: 40px;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    flex: 1 0 0;
}

.mil-service-body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    align-self: stretch;
}

h4.oi-h4 {
    align-self: stretch;
    color: var(--MZV-Blue);

    /* JP/Desktop/H3 */
    font-family: "Noto Sans JP" !important;
    font-size: 27px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 36px !important;
    letter-spacing: 0.8px !important;
}

.mil-service-body .mil-m {
    color: var(--MZV-Blue);
    font-family: "Noto Sans JP" !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 500 !important;
    line-height: 30px !important;
    letter-spacing: 0.8px !important;
}

.mil-service-body .mil-m li {
    list-style: decimal;
    margin-left: 24px;
}

.mil-service-body .mil-b {
    color: var(--MZV-Blue);
    font-family: "Noto Sans JP" !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 500 !important;
    line-height: 28.8px !important;
    letter-spacing: 0.8px !important;
}

.mil-product-card {
    width: 100%;
    display: flex;
    min-width: 580px;
    max-width: 1000px;
    padding: 48px 48px 16px 48px;
    justify-content: space-between;
    align-items: flex-start;
    /* align-self: stretch; */
    border-radius: 24px;
    background: var(--surfaceBright, #FFF);

    /* Soft Shadow */
    box-shadow: 8px 8px 32px 5px rgba(85, 124, 170, 0.12);
}

.mil-product-card-l {
    display: flex;
    max-width: 360px;
    flex-direction: column;
    align-items: flex-start;
    flex: 1 0 0;
}

.mil-product-card-l .mil-product-img {
    display: flex;
    margin-bottom: 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    height: 200px;
    min-height: 160px;
    max-height: 200px;
    align-self: stretch;
    border-radius: 8px;
    /* background: url(<path-to-image>) lightgray 50% / cover no-repeat; */
}

.mil-product-detail-l {
    color: var(--MZV-Blue);
    font-family: "Noto Sans JP" !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 14px !important;
    letter-spacing: 0 !important;
}

.mil-product-detail-l ul {
    margin-top: 4px;
    margin-bottom: 16px
}

.mil-product-detail-l li {
    color: var(--MZV-Blue);
    font-family: "Noto Sans JP" !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 500 !important;
    line-height: 20.8px !important;
    letter-spacing: 0.8px !important;
    align-self: stretch;
    list-style: disc;
    margin-left: 24px;
}

.mil-product-card-r {
    display: flex;
    max-width: 512px;
    padding-left: 32px;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    flex: 1 0 0;
}

.mil-product-card-r .mil-tag-group {
    display: flex;
    align-items: flex-start;
    align-content: flex-start;
    gap: 16px;
    align-self: stretch;
    flex-wrap: wrap;
}

.mil-product-card-r .mil-tag {
    display: flex;
    padding: 6px 16px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 1000px;
    background: var(--Light-Blue);
    color: var(--MZV-Blue);
    text-align: center;
    font-family: "Noto Sans JP" !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 14px !important;
    letter-spacing: 0.6px !important;
}

.mil-product-card-r p {
    align-self: stretch;
    color: var(--MZV-Blue);

    /* JP/Desktop/P 16 - Main */
    font-family: "Noto Sans JP" !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 500 !important;
    line-height: 28.8px !important;
    letter-spacing: 0.8px !important;
}

a.mil-product-link {
    display: flex;
    align-items: center;
}

a.mil-product-link span.link-text {
    display: flex;
    height: 48px;
    padding-bottom: 4px;
    justify-content: center;
    align-items: center;
    color: var(--Pink, #B63580);
    /* JP/Desktop/Link */
    font-family: "Noto Sans JP" !important;
    font-size: 16.5px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 16.5px !important;
    /* 100% */
    letter-spacing: 0.8px !important;
    text-decoration-line: underline !important;
    text-decoration-style: solid !important;
    text-decoration-skip-ink: none !important;
    text-decoration-thickness: auto !important;
    text-underline-offset: auto !important;
    text-underline-position: from-font !important;
}

a.mil-product-link span.arrow {
    display: flex;
    width: 24px;
    height: 24px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    aspect-ratio: 1/1;
}

section#oi-partner {
    display: flex;
    padding-bottom: 120px;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    align-self: stretch;
    background: var(--Surface);
}

.partner-container {
    display: flex;
    padding: 0 24px;
    justify-content: center;
    align-items: center;
    align-content: center;
    gap: 48px;
    align-self: stretch;
    flex-wrap: wrap;
}

.partner-card {
    display: flex;
    width: 248px;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.partner-content {
    display: flex;
    padding: 0 16px;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
}

.partner-logo-container {
    display: flex;
    padding: 40px 32px;
    align-items: center;
    gap: 10px;
    align-self: stretch;
    border-radius: 8px;
    background: #FFF;
}

.partner-logo {
    background: no-repeat;
    background-size: contain;
    height: 100px;
    flex: 1 0 0;
}

a.partner-link {
    display: flex;
    align-items: center;
    gap: 4px;
    text-wrap: nowrap;
}

a.partner-link span.link-text {
    display: flex;
    height: 48px;
    padding-bottom: 4px;
    align-items: center;
    gap: 4px;
    color: var(--Pink);

    /* JP/Desktop/Link */
    font-family: "Noto Sans JP" !important;
    font-size: 16.5px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 16.5px !important;
    letter-spacing: 0.8px !important;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;
}

a.partner-link span.arrow {
    height: 24px;
}

.partner-title {
    color: var(--Darker-Grayish-Blue);
    margin-top: -12px;
    /* JP/Desktop/P 16 - Main */
    font-family: "Noto Sans JP" !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 500 !important;
    line-height: 28.8px !important;
    letter-spacing: 0.8px !important;
}

section#oi-contact {
    display: flex;
    padding-bottom: 100px;
    flex-direction: column;
    align-items: center;
    align-self: stretch;
    background: var(--Secondary);
}

a.contact-pdf {
    display: flex;
    padding-bottom: 32px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-self: stretch;

    color: var(--Bright-Yellow);

    text-align: center;

    /* JP/Desktop/Link */
    font-family: "Noto Sans JP" !important;
    font-size: 16.5px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 16.5px !important;
    /* 100% */
    letter-spacing: 0.8px !important;
    text-decoration-line: underline !important;
    text-decoration-style: solid !important;
    text-decoration-skip-ink: none !important;
    text-decoration-thickness: auto !important;
    text-underline-offset: auto !important;
    text-underline-position: from-font !important;
}

a.contact-us {
    display: flex;
    padding: 14px 28px;
    justify-content: center;
    align-items: center;
    border-radius: 27px;
    background: var(--Bright-Yellow);
    color: var(--MZV-Blue);
    text-align: center;

    /* General/EN - Button Text */
    font-family: "Noto Sans JP" !important;
    font-size: 18px !important;
    font-style: normal !important;
    font-weight: 500 !important;
    line-height: 26px !important;
    /* 144.444% */
    letter-spacing: 0.6px !important;
}

/* MOBILE STYLE */
@media (max-width: 600px) {
    .mobile-only {
        display: block !important;
    }

    .desktop-only {
        display: none !important;
    }

    .oi-title {
        min-width: 320px;
        max-width: 400px;
        padding: 0px 16px;
        gap: 0px;
    }

    .en-subtitle {
        /* align-self: center; */
        font-size: 20px !important;
        line-height: 24px !important;
        letter-spacing: 0.2px !important;
        margin: 48px 0 16px 0;
    }

    h2.oi-h2 {
        padding-bottom: 16px;
        text-align: center;
        /* JP/Desktop/H2 */
        font-size: 16px !important;
        line-height: 24px !important;
    }

    h3.oi-h3 {
        min-width: 320px;
        max-width: 400px;
        padding: 16px;
        font-size: 16px !important;
        line-height: 24px !important;
    }

    p.oi-p {
        min-width: 320px;
        max-width: 480px;
        padding: 0 16px;
        font-size: 14px !important;
        font-weight: 400 !important;
        line-height: 24px !important;
        letter-spacing: 0.6px !important;
    }

    section#oi-challenges {
        min-width: 320px;
        padding-bottom: 80px;
        gap: 24px;
    }

    ul.onayami-container {
        gap: 24px;
        padding: 0;
    }

    li.onayami-child {
        flex-direction: column;
        max-width: 320px;
        min-width: 300px;
        padding: 32px 40px;
        gap: 16px;
        border-radius: 1000px 1000px 60px 60px;
        box-shadow: 8px 8px 32px 5px rgba(85, 124, 170, 0.12);
    }

    .onayami-left {
        width: 60.194px;
    }

    .onayami-onayami {
        font-size: 14px !important;
        line-height: 14px !important;
    }

    .onayami-num {
        padding-left: 0px;
        color: var(--Color-navy-50);
        font-size: 40px !important;
        line-height: 40px !important;
    }

    .onayami-right {}

    strong.onayami-title {
        font-size: 20px !important;
        line-height: 25px !important;
    }

    p.onayami-p {
        font-size: 14px !important;
        font-weight: 400 !important;
        line-height: 24px !important;
        letter-spacing: 0.6px !important;
    }

    section#oi-acceleration {
        min-width: 280px;
        padding-bottom: 48px;
        gap: 24px;
    }

    section#oi-acceleration .diagram-container {
        max-width: 580px;
        padding: 32px 8px 24px 8px;
        gap: 10px;
    }

    .services-graph-container {
        width: 550px;
        height: 289px;
        max-width: 550px;
        max-height: 289px;
        aspect-ratio: 491/258;
        align-self: auto;
    }

    .services-l {
        width: 90px;
        min-width: 90px;
        padding-bottom: 56px;
    }

    .service-white-circle-l {
        width: 90px;
        height: 90px;
        max-width: 90px;
        max-height: 90px;
    }

    .service-white-circle-l svg,
    .services-r svg {
        width: 40px !important;
        height: 40px !important;
    }

    .circle-text {
        font-size: 12px !important;
    }

    .arrow-padding-box-l {
        padding: 0;
        margin: 0 -16px 48px 4px;
    }

    .services-m {
        width: 260px;
        min-width: 260px;
        max-width: 300px;
        padding: 0 0 0 0px;
        align-items: flex-end;
    }

    .services-m-top {
        width: 240px;
        min-width: 240px;
        align-self: auto;
    }

    .services-m-t-title {
        min-width: 190px;
        width: 190px;
    }

    .services-m-t-ul {
        width: 240px;
        min-width: 240px;
        padding: 36px 0 24px;
    }

    .services-m-t-li {
        width: 200px;
        min-width: 200px;
        font-size: 12px !important;
        align-self: auto;
        letter-spacing: 0 !important;
    }

    .services-m-bottom {
        /* padding-right: 8px; */
        gap: 6px;
    }

    .services-m-b-container {}

    .services-m-b-container-l {
        width: 120px;
    }

    .services-m-b-child {
        width: 120px;
        padding: 12px 0;
        font-size: 12px !important;
    }

    .services-m-b-child-s {
        padding: 12px 8px;
        font-size: 12px !important;
    }

    .arrow-padding-box-r {
        margin: 0 -12px 48px 4px;
        padding: 0;
    }

    .services-r {
        width: 150px;
        min-width: 150px;
        padding-bottom: 80px;
    }

    .service-white-circle-r-1 {
        width: 90px;
        height: 90px;
        max-width: 90px;
        max-height: 90px;
        gap: 0px;
    }

    .service-white-circle-padding-r {
        margin-top: -16px;
    }

    .service-white-circle-r-2 {
        width: 90px;
        height: 90px;
        max-width: 90px;
        max-height: 90px;
    }

    section#oi-model {
        display: flex;
        padding-bottom: 80px;
        flex-direction: column;
        align-items: center;
        gap: 40px;
        align-self: stretch;
        background: var(--surfaceVariant);
    }

    p.oi-p b {
        font-size: 14px !important;
        line-height: 24px !important;
    }

    table.oi-table {
        display: flex;
        min-width: 0px;
        gap: 10px;
    }

    table.oi-table.mobile-only {
        display: flex !important;
    }

    table.oi-table thead,
    table.oi-table tbody {
        width: 258px;
        min-width: 0px;
    }

    table.oi-table thead tr {
        width: 258px;
        height: 48px;
    }

    table.oi-table thead tr th {
        height: 40px;
        border-radius: 1000px;

        font-size: 14px !important;
        line-height: 14px !important;
    }

    table.oi-table thead tr th.t-origin {
        width: 72px;
        min-width: 72px;
    }

    table.oi-table thead tr th.col-th {
        width: 180px;
        min-width: 180px;
    }

    table.oi-table tbody tr {}

    table.oi-table tbody tr th,
    table.oi-table tbody tr td {}

    table.oi-table tbody tr th {
        border-radius: 80px;
        width: 72px;
        min-width: 40px;
        padding: 0px;
        font-size: 12px !important;
        font-weight: 700 !important;
        line-height: 14px !important;
    }

    table.oi-table tbody tr td {
        border-radius: 16px 16px 0 16px;
        width: 180px;
        min-width: 180px;
        padding: 16px 8px;
        font-size: 12px !important;
        line-height: 16px !important;
    }

    .model-diagram-container {
        padding: 48px 0 32px 0;
    }

    .model-diagram {
        min-width: 200px;
        max-width: 350px;
    }

    .model-diagram-t {}

    .model-diagram-child {
        width: 174px;
        min-width: 0px;
    }

    .model-diagram .model-title {
        flex-direction: column;
        align-items: center;
        z-index: 2;
        margin-bottom: -32px;
        padding: 8px 16px 10px 16px;

        font-size: 12px !important;
        line-height: 24px !important;
    }

    .model-diagram .model-title span {
        font-size: 12px !important;
        line-height: 24px !important;
    }

    .model-diagram .model-title span.underline {
        font-size: 12px !important;
        line-height: 24px !important;
    }

    .model-diagram .model-body {
        height: 200px;
        padding: 40px 8px 32px 8px;
    }

    .model-body-child {
        font-size: 12px !important;
        line-height: 20px !important;
        letter-spacing: 0px !important;
    }

    .model-diagram-b {}

    ul.kyoso-container {
        padding: 0 16px;
        max-width: 480px;
        min-width: 320px;
        width: 100%;
    }

    ul.kyoso-container li {
        font-size: 16px !important;
        font-weight: 600 !important;
        line-height: 24px !important;
        letter-spacing: 0.6px !important;
    }

    ul.feature-container {
        min-width: 280px;
        max-width: 660px;
        align-items: flex-start;
    }

    ul.feature-container li {
        gap: 4px;
        min-width: 240px;
        max-width: 520px;
    }

    ul.feature-container .feature-icon {
        display: flex;
        width: 80px;
        height: 80px;
        justify-content: center;
        align-items: center;
        gap: 10px;
        aspect-ratio: 1/1;
    }

    ul.feature-container .feature-content {
        padding: 8px 16px 8px 24px;
        font-size: 14px !important;
        font-weight: 600 !important;
        line-height: 20px !important;
        letter-spacing: 0.6px !important;
    }

    section#oi-capabilities {
        padding-bottom: 80px;
        gap: 24px;
    }

    ul.capa-cards {
        align-items: center;
        min-width: 280px;
        padding: 0 70px;
    }

    ul.capa-cards li {
        width: auto;
        align-self: stretch;
    }

    ul.capa-cards li .capa-icon {
        padding: 16px;
    }

    ul.capa-cards li .capa-icon svg {
        width: 40px;
        height: 40px;
    }

    ul.capa-cards li .capa-text {
        padding: 32px 16px 24px 16px;
    }

    ul.capa-cards li .capa-title {
        font-size: 16px !important;
        line-height: 20px !important;
        letter-spacing: 0px !important;
    }

    ul.capa-cards li .capa-body {
        padding: 0 8px;
        font-size: 14px !important;
        font-weight: 500 !important;
        line-height: 20px !important;
        letter-spacing: 0.6px !important;
    }

    .mil-services-container {
        padding: 0 16px;
        gap: 24px;
    }

    .mil-service-card {
        width: 100%;
        min-width: 300px;
        max-width: 500px;
        padding: 32px 24px 24px 24px;
        align-items: center;
        align-content: center;
        gap: 16px;
    }

    .mil-service-l {}

    .hero-image {}

    .mil-service-r {
        max-width: 480px;
        padding-left: 0px;
        gap: 16px;
        align-items: center;
    }

    .mil-service-body {}

    h4.oi-h4 {
        font-size: 26px !important;
        line-height: 25px !important;
    }

    .mil-service-body .mil-m,
    .mil-service-body .mil-m li,
    .mil-service-body .mil-b {
        font-size: 14px !important;
        font-weight: 400 !important;
        line-height: 24px !important;
        letter-spacing: 0.6px !important;
    }

    .mil-service-body .mil-m li {
        list-style: decimal;
        margin-left: 24px;
    }

    .mil-product-card {
        width: 100%;
        min-width: 300px;
        max-width: 500px;
        padding: 32px 24px 24px 24px;
        border-radius: 16px;
    }

    .mil-product-card-l {}

    .mil-product-card-l .mil-product-img {}

    .mil-product-detail-l {
        line-height: 18px !important;
        letter-spacing: 0.6px !important;
    }

    .mil-product-detail-l ul {
        margin-top: 2px;
        margin-bottom: 0px
    }

    .mil-product-detail-l li {
        font-size: 14px !important;
        font-weight: 400 !important;
        line-height: 20px !important;
        letter-spacing: 0.6px !important;
    }

    .mil-product-card-r {
        max-width: 480px;
        padding-left: 0px;
        gap: 16px;
    }

    .mil-product-detail-r {
        gap: 16px;
        display: flex;
        flex-direction: column;
    }

    .mil-product-card-r .mil-tag-group {}

    .mil-product-card-r .mil-tag {
        padding: 0 10px;
        border-radius: 12px;
        font-weight: 800 !important;
        line-height: 24px !important;
    }

    .mil-product-card-r p {
        font-size: 14px !important;
        font-weight: 400 !important;
        line-height: 24px !important;
        letter-spacing: 0.6px !important;
    }

    a.mil-product-link {}

    a.mil-product-link span.link-text {
        font-size: 14px !important;
        line-height: 20px !important;
    }

    a.mil-product-link span.arrow {}

    section#oi-partner {
        display: flex;
        padding-bottom: 80px;
        flex-direction: column;
        align-items: center;
        gap: 40px;
        align-self: stretch;
        background: var(--Surface);
    }

    .partner-container {
        display: flex;
        padding: 0 24px;
        justify-content: center;
        align-items: center;
        align-content: center;
        gap: 48px;
        align-self: stretch;
        flex-wrap: wrap;
    }

    .partner-card {
        display: flex;
        width: 248px;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .partner-content {
        display: flex;
        padding: 0 16px;
        flex-direction: column;
        align-items: flex-start;
        align-self: stretch;
    }

    .partner-logo-container {
        display: flex;
        padding: 40px 32px;
        align-items: center;
        gap: 10px;
        align-self: stretch;
        border-radius: 8px;
        background: #FFF;
    }

    .partner-logo {}

    a.partner-link {
        display: flex;
        align-items: center;
        gap: 4px;
        text-wrap: nowrap;
    }

    a.partner-link span.link-text {
        display: flex;
        height: 48px;
        padding-bottom: 4px;
        align-items: center;
        gap: 4px;
        color: var(--Pink);

        /* JP/Desktop/Link */
        font-family: "Noto Sans JP" !important;
        font-size: 16.5px !important;
        font-style: normal !important;
        font-weight: 700 !important;
        line-height: 16.5px !important;
        letter-spacing: 0.8px !important;
        text-decoration-line: underline;
        text-decoration-style: solid;
        text-decoration-skip-ink: none;
        text-decoration-thickness: auto;
        text-underline-offset: auto;
        text-underline-position: from-font;
    }

    .partner-title {
        color: var(--Darker-Grayish-Blue);
        margin-top: -12px;
        /* JP/Desktop/P 16 - Main */
        font-family: "Noto Sans JP" !important;
        font-size: 16px !important;
        font-style: normal !important;
        font-weight: 500 !important;
        line-height: 28.8px !important;
        letter-spacing: 0.8px !important;
    }

    section#oi-contact {
        display: flex;
        padding-bottom: 48px;
        flex-direction: column;
        align-items: center;
        align-self: stretch;
        background: var(--Secondary);
    }

    a.contact-pdf {
        max-width: 480px;
        padding: 0 24px 24px 24px;
        font-size: 14px !important;
        line-height: 28px !important;
    }

    a.contact-us {
        padding: 18px 24px;
        font-size: 16px !important;
        font-weight: 700 !important;
        line-height: 18px !important;
    }
}