<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">@charset "UTF-8";

@font-face {
    src: url("https://library.keyence.com/fonts/NotoSansCJKjp-Regular.eot") format("eot"), url("https://library.keyence.com/fonts/NotoSansCJKjp-Regular.woff") format("woff"), url("https://library.keyence.com/fonts/NotoSansCJKjp-Regular.ttf") format("truetype");
    font-display: swap;
    font-family: notosans;
}

@font-face {
    src: url("https://library.keyence.com/fonts/NotoSansCJKjp-Medium.eot") format("eot"), url("https://library.keyence.com/fonts/NotoSansCJKjp-Medium.woff") format("woff"), url("https://library.keyence.com/fonts/NotoSansCJKjp-Medium.ttf") format("truetype");
    font-display: swap;
    font-family: notosans;
    font-weight: 600;
}

@font-face {
    src: url("https://library.keyence.com/fonts/NotoSansCJKjp-Bold.eot") format("eot"), url("https://library.keyence.com/fonts/NotoSansCJKjp-Bold.woff") format("woff"), url("https://library.keyence.com/fonts/NotoSansCJKjp-Bold.ttf") format("truetype");
    font-display: swap;
    font-family: notosans;
    font-weight: bold;
}

body {
    font-size: 1.6rem;
    line-height: 1.5;
}

body.ss-theme-top {
    position: relative;
}

body::before {
    display: block;
    position: absolute;
    background: transparent;
    content: "";
    transition: background 0.3s;
}

.theme-KJ body {
    font-family: notosans, "HiraKakuPro-W3", Meiryo, Osaka, "MS PGothic", sans-serif;
}

body.is-menu-show {
    position: relative;
    background: #fff;
}

@media screen and (max-width: 1024px) {
    body.is-menu-show .ss-layout-main,
    body.is-menu-show .ss-layout-footer {
        visibility: hidden;
        position: fixed;
        height: 0;
    }
}

.ss-layout-header {
    z-index: 1;
    position: absolute;
    top: 0;
    width: 100%;
    background: #fff;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}

@media screen and (max-width: 1024px) {
    .ss-layout-header {
        position: relative;
    }
}

.ss-layout-header.is-fixed {
    position: fixed;
    animation: slideInDown 0.3s forwards ease-out;
}

.ss-layout-header-content {
    display: flex;
    align-items: center;
    max-width: 1224px;
    min-height: 98px;
    margin: 0 auto;
    padding: 21px 24px 22px 24px;
    overflow: hidden;
}

.ss-theme-top .ss-layout-header-content {
    padding: 10px 24px 8px 24px;
}

@media screen and (max-width: 1024px) {
    .ss-theme-top .ss-layout-header-content {
        padding: 12px 16px 12px 20px;
    }
}

@media screen and (min-width: 1025px) {
    body:not(.ss-theme-top) .ss-layout-header-content {
        min-height: 70px;
    }
}

@media screen and (max-width: 1024px) {
    .ss-layout-header-content {
        min-height: 48px;
        padding: 12px 16px 12px 20px;
    }
}

.ss-layout-header-logo {
    line-height: 1;
}

.ss-layout-header-logo img {
    width: 125px;
    height: 22px;
}

.theme-KC .ss-layout-header-logo img {
    width: 229px;
}

@media screen and (max-width: 1024px) {
    .ss-layout-header-logo img {
        width: 91px;
        height: 16px;
    }
    .theme-KC .ss-layout-header-logo img {
        width: 167px;
    }
}

.ss-layout-header-menuButton {
    display: none;
}

@media screen and (max-width: 1024px) {
    [data-script-enabled="true"] .ss-layout-header-menuButton {
        display: block;
        position: absolute;
        top: 14px;
        right: 50%;
        width: 100%;
        max-width: 1200px;
        height: 25px;
        transform: translateX(50%);
        pointer-events: none;
    }
}

@media screen and (max-width: 1024px) {
    [data-script-enabled="true"] .ss-layout-header-menuButtonContent {
        display: block;
        position: absolute;
        top: 0;
        right: 16px;
        width: 22px;
        height: 20px;
        overflow: hidden;
        line-height: 1;
        pointer-events: auto;
    }
    [data-script-enabled="true"] .ss-layout-header-menuButtonContent::before, [data-script-enabled="true"] .ss-layout-header-menuButtonContent::after {
        display: block;
        position: absolute;
        width: 22px;
        height: 2px;
        transform: rotate(0);
        background-color: #b0b6bb;
        content: "";
        transition: all 0.2s;
    }
    [data-script-enabled="true"] .ss-layout-header-menuButtonContent::before {
        top: 0;
    }
    [data-script-enabled="true"] .ss-layout-header-menuButtonContent::after {
        top: 9px;
    }
    [data-script-enabled="true"] .ss-layout-header-menuButtonContent[aria-expanded="true"]::before {
        top: 9px;
        left: 0;
        transform: rotate(45deg);
    }
    [data-script-enabled="true"] .ss-layout-header-menuButtonContent[aria-expanded="true"]::after {
        top: 9px;
        left: 0;
        transform: rotate(-45deg);
    }
    [data-script-enabled="true"] .ss-layout-header-menuButtonContent .ss-layout-header-menuButtonBody {
        display: block;
        width: 22px;
        height: 20px;
    }
    [data-script-enabled="true"] .ss-layout-header-menuButtonContent .ss-layout-header-menuButtonBody::before {
        display: block;
        position: absolute;
        top: 18px;
        width: 22px;
        height: 2px;
        transform: scale(1);
        background-color: #b0b6bb;
        content: "";
        transition: background-color 0.2s ease, transform 0.2s ease;
    }
    [data-script-enabled="true"] .ss-layout-header-menuButtonContent .ss-layout-header-menuButtonText {
        display: block;
        position: absolute;
        left: 100%;
        color: #fff;
        white-space: nowrap;
    }
    [data-script-enabled="true"] .ss-layout-header-menuButtonContent[aria-expanded="true"] .ss-layout-header-menuButtonBody {
        transform: scale(0);
        background-color: transparent;
    }
}

.ss-layout-header-toggleTarget {
    flex: 1;
}

@media screen and (max-width: 1024px) {
    [data-script-enabled="true"] .ss-layout-header-toggleTarget {
        visibility: hidden;
        z-index: 1000;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        height: calc(100vh - 48px);
        background: #fff;
        opacity: 0;
        transition: visibility 0.3s, opacity 0.3s;
    }
}

@media screen and (max-width: 1024px) {
    [data-script-enabled="true"] .is-menu-show .ss-layout-header-toggleTarget {
        visibility: visible;
        opacity: 1;
    }
}

@media screen and (max-width: 1024px) {
    [data-script-enabled="true"].is-resizing .ss-layout-header-toggleTarget {
        transition: none;
    }
}

.ss-layout-header-utilityGroup {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    margin-left: -24px;
    padding-left: 24px;
}

@media screen and (max-width: 1024px) {
    .ss-layout-header-utilityGroup {
        display: block;
        margin-left: 0;
        padding: 20px;
    }
}

.ss-layout-header-list {
    display: flex;
    justify-content: flex-end;
    width: 100%;
    margin-bottom: 10px;
    margin-left: -16px;
    padding-right: 12px;
    padding-left: 24px;
    font-size: 1.4rem;
}

@media screen and (max-width: 1024px) {
    .ss-layout-header-list {
        justify-content: center;
        padding-right: 0;
    }
}

.ss-layout-header-list &gt; li {
    padding-left: 16px;
}

.ss-layout-header-list &gt; li + li {
    position: relative;
    margin-left: 16px;
}

.ss-layout-header-list &gt; li + li::before {
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 1px;
    height: 20px;
    transform: translateY(-50%);
    background: #b0b6bb;
    content: "";
}

.ss-layout-header-list a {
    color: inherit;
    text-decoration: none;
}

.ss-layout-header-list a:hover, .ss-layout-header-list a:active, .ss-layout-header-list a:focus {
    text-decoration: underline;
}

.ss-layout-header-linkList {
    margin-bottom: 16px;
}

@media screen and (min-width: 1025px) {
    .ss-layout-header-linkList {
        margin-bottom: 0;
        font-size: 1.8rem;
    }
}

.ss-theme-top .ss-layout-header-linkList {
    display: none;
}

.ss-theme-top .ss-layout-header-linkList + .ss-layout-header-horizon {
    display: none;
}

.ss-layout-header-linkList &gt; li {
    margin-bottom: 16px;
}

.ss-layout-header-linkList &gt; li:last-child {
    margin-bottom: 0;
}

.ss-layout-header-linkList a {
    display: inline-block;
    position: relative;
    padding-left: 16px;
    color: inherit;
    text-decoration: none;
}

.ss-layout-header-linkList a::before {
    display: block;
    position: absolute;
    top: 0.3em;
    left: -5px;
    width: 12px;
    height: 12px;
    transform: rotate(45deg);
    border-top: 1px solid #b0b6bb;
    border-right: 1px solid #b0b6bb;
    content: "";
}

@media screen and (min-width: 1025px) {
    .ss-layout-header-linkList a::before {
        top: 0.4em;
        transform: rotate(-135deg);
    }
    .theme-KJ .ss-layout-header-linkList a::before {
        top: 0.5em;
    }
}

.ss-layout-header-horizon {
    border: 0;
    border-top: 1px solid #545454;
}

.ss-layout-header-horizon.of-primary {
    margin: 24px 0;
}

.ss-layout-header-horizon.of-secondary {
    margin: 32px 0;
}

.ss-layout-header-navigation {
    display: flex;
    align-items: center;
    margin-left: -24px;
    padding-left: 24px;
}

.ss-layout-header-navigationOuter {
    display: flex;
    position: relative;
    align-items: center;
}

body:not(.ss-theme-top) .ss-layout-header-navigationOuter {
    display: none;
}

.ss-layout-header-navigationBar {
    position: absolute;
    bottom: -10px;
    left: 0;
    width: auto;
    height: 5px;
    background: #1574c1;
}

.ss-layout-header-navigation &gt; li {
    max-width: 240px;
    padding-left: 24px;
}

.ss-layout-header-navigation &gt; li:first-child {
    padding-left: 0;
}

.ss-layout-header-navigation &gt; li &gt; a {
    display: block;
    position: relative;
    padding-left: 14px;
    color: inherit;
    text-decoration: none;
    transition: color 0.3s 0.1s;
}

.ss-layout-header-navigation &gt; li &gt; a::before {
    display: block;
    position: absolute;
    top: 0.5em;
    left: 0;
    width: 5px;
    height: 5px;
    transform: rotate(135deg);
    border-top: 1px solid #b0b6bb;
    border-right: 1px solid #b0b6bb;
    content: "";
}

.ss-layout-header-navigation &gt; li &gt; a &gt; span {
    display: block;
    position: relative;
}

.ss-layout-header-navigation &gt; li &gt; a:hover, .ss-layout-header-navigation &gt; li &gt; a:active, .ss-layout-header-navigation &gt; li &gt; a:focus {
    text-decoration: underline;
}

.ss-layout-header-navigation &gt; li &gt; a.is-current {
    color: #021422;
    transition: none;
}

.ss-layout-header-navigation &gt; li &gt; a.is-current::before {
    left: 0;
    transition: none;
}

.ss-layout-header-buttonList {
    display: flex;
    align-self: center;
    margin-left: -16px;
    padding-left: 24px;
    text-align: center;
}

@media screen and (min-width: 1025px) {
    body:not(.ss-theme-top) .ss-layout-header-buttonList {
        display: none;
    }
}

@media screen and (max-width: 1024px) {
    .ss-layout-header-buttonList {
        display: block;
        max-width: 320px;
        margin: 0 auto 36px;
        padding-left: 0;
    }
}

.ss-layout-header-buttonList &gt; li {
    display: flex;
    padding-left: 16px;
}

@media screen and (max-width: 1024px) {
    .ss-layout-header-buttonList &gt; li {
        display: block;
        margin-bottom: 24px;
        padding-right: 10px;
        padding-left: 10px;
    }
}

.ss-layout-header-buttonList &gt; li:last-child {
    margin-bottom: 0;
}

@media screen and (min-width: 1025px) {
    .ss-layout-header-buttonList &gt; li.ss-smallScreen-show {
        display: none;
    }
}

.ss-layout-header-buttonList &gt; li.of-phone {
    margin-top: 48px;
}

.ss-layout-header-buttonList &gt; li.of-phone .ss-textPhone-numberGroup {
    justify-content: center;
}

@media screen and (max-width: 1024px) {
    .ss-layout-header-buttonList .ss-buttonConversion {
        width: 100%;
    }
}

@media screen and (min-width: 1025px) {
    .ss-layout-header-buttonList .ss-buttonConversion.of-seminar {
        padding: 4px 8px 4px 14px;
    }
}

@media screen and (min-width: 1025px) {
    .ss-layout-header-buttonList .ss-buttonConversion.of-download .ss-buttonConversion-body,
    .ss-layout-header-buttonList .ss-buttonConversion.of-seminar .ss-buttonConversion-body {
        font-size: 1.6rem;
    }
}

.ss-layout-header-buttonList .ss-buttonConversion.of-download .ss-buttonConversion-text,
.ss-layout-header-buttonList .ss-buttonConversion.of-seminar .ss-buttonConversion-text {
    padding-right: 15px;
    font-weight: normal;
}

.ss-layout-header-buttonList .ss-buttonConversion.of-download .ss-buttonConversion-image {
    max-width: 36px;
    margin: 0;
}

@media screen and (min-width: 1025px) {
    .ss-layout-header-buttonList .ss-buttonConversion.of-download .ss-buttonConversion-image {
        display: none;
    }
}

@media screen and (max-width: 1024px) {
    .ss-layout-header-buttonList .ss-buttonConversion.of-download .ss-buttonConversion-image {
        max-width: inherit;
        margin-top: -10px;
        margin-bottom: -10px;
    }
}

.ss-layout-header-buttonList .ss-buttonConversion.of-download .ss-buttonConversion-image img {
    max-height: 46px;
}

@media screen and (max-width: 1024px) {
    .ss-layout-header-buttonList .ss-buttonConversion.of-download .ss-buttonConversion-image img {
        max-height: inherit;
    }
}

.ss-layout-header-buttonList .ss-buttonRequest {
    display: block;
}

.ss-layout-header-buttonList .ss-buttonSupport {
    display: block;
}

.ss-layout-header .ss-listDescription &gt; dt {
    color: #808080;
    font-size: 1.4rem;
}

.ss-layout-header .ss-listLink a::before {
    border-color: #b0b6bb;
}

.ss-layout-main {
    background: #fff;
}

@media screen and (min-width: 1025px) {
    .ss-layout-main {
        padding-top: 98px !important;
    }
}

@media screen and (min-width: 1025px) {
    body:not(.ss-theme-top) .ss-layout-main {
        padding-top: 70px !important;
    }
}

.ss-layout-footer {
    background: #333;
    color: #ccc;
}

@media screen and (max-width: 1366px) {
    .ss-layout-footer {
        margin-left: 0;
    }
}

.ss-layout-footer-content {
    max-width: 1248px;
    margin: 0 auto;
    padding: 16px 24px;
}

@media screen and (max-width: 1024px) {
    .ss-layout-footer-content {
        padding: 16px 20px;
    }
}

.ss-layout-footer-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-left: -10px;
    font-size: 1.2rem;
}

.ss-layout-footer-list &gt; li {
    position: relative;
    margin-left: 10px;
    padding-left: 10px;
}

.ss-layout-footer-list &gt; li:first-child {
    padding-left: 0;
}

.ss-layout-footer-list &gt; li:first-child::before {
    display: none;
}

.ss-layout-footer-list &gt; li::before {
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 1px;
    height: 13px;
    transform: translateY(-50%);
    background: #ccc;
    content: "";
}

.ss-layout-footer-list a {
    color: inherit;
    text-decoration: none;
}

@media screen and (max-width: 1024px) {
    .ss-layout-footer-copyright {
        width: 100%;
        margin-bottom: 8px;
        text-align: center;
    }
    .ss-layout-footer-copyright + li::before {
        display: none;
    }
}

.ss-layout-grid {
    display: flex;
    flex-wrap: wrap;
    margin: -40px 0 36px -80px;
}

@media screen and (max-width: 1200px) {
    .ss-layout-grid {
        margin-left: calc(-80vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-layout-grid {
        margin-top: -32px;
        margin-bottom: 32px;
        margin-left: -24px;
    }
}

.ss-layout-grid.of-column-2 &gt; .ss-layout-grid-column {
    width: 50%;
}

@media screen and (max-width: 767px) {
    .ss-layout-grid.of-column-2 &gt; .ss-layout-grid-column {
        width: 100%;
    }
}

.ss-layout-grid-column {
    width: 100%;
    margin-top: 40px;
    padding-left: 80px;
}

@media screen and (max-width: 1200px) {
    .ss-layout-grid-column {
        padding-left: calc(80vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-layout-grid-column {
        margin-top: 32px;
        padding-left: 24px;
    }
}

.ss-layout-grid-column &gt; *:last-child {
    margin-bottom: 0;
}

.ss-layout-productGrid {
    display: flex;
    flex-wrap: wrap;
    margin: -32px 0 0 -2px;
}

@media screen and (max-width: 767px) {
    .ss-layout-productGrid {
        margin: -24px 0 0 -2px;
    }
}

.ss-layout-productGrid.of-column-2 &gt; .ss-layout-productGrid-column {
    width: 50%;
}

@media screen and (max-width: 767px) {
    .ss-layout-productGrid.of-column-2 &gt; .ss-layout-productGrid-column {
        width: 100%;
    }
}

.ss-layout-productGrid.of-column-3 &gt; .ss-layout-productGrid-column {
    width: 33.3333333%;
}

@media screen and (max-width: 767px) {
    .ss-layout-productGrid.of-column-3 &gt; .ss-layout-productGrid-column {
        width: 100%;
    }
}

.ss-layout-productGrid.of-column-4 &gt; .ss-layout-productGrid-column {
    width: 25%;
}

@media screen and (max-width: 767px) {
    .ss-layout-productGrid.of-column-4 &gt; .ss-layout-productGrid-column {
        width: 100%;
    }
}

.ss-layout-productGrid-column {
    display: flex;
    width: 100%;
    margin-top: 32px;
    padding-left: 2px;
}

@media screen and (max-width: 767px) {
    .ss-layout-productGrid-column {
        margin-top: 24px;
    }
}

.ss-layout-productGrid-column &gt; *:last-child {
    margin-bottom: 0;
}

.ss-horizon {
    margin: 32px 0;
    border: 0;
    border-top: 1px solid #d1d1d1;
}

.ss-jumbotron.of-primary {
    z-index: 0;
    position: relative;
    overflow: hidden;
    background: #f3f3f3;
}

.ss-jumbotron.of-primary .ss-jumbotron-content {
    display: flex;
    flex-direction: row-reverse;
    max-width: 1248px;
    margin: 0 auto;
    padding: 48px 24px 88px;
}

@media screen and (max-width: 1200px) {
    .ss-jumbotron.of-primary .ss-jumbotron-content {
        padding: calc(48vw * 100 / 1200) calc(24vw * 100 / 1200) calc(88vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-jumbotron.of-primary .ss-jumbotron-content {
        flex-direction: column-reverse;
        padding: 24px 20px 48px;
    }
}

.ss-jumbotron.of-primary .ss-jumbotron-body {
    flex: 1;
    max-width: 690px;
}

@media screen and (max-width: 767px) {
    .ss-jumbotron.of-primary .ss-jumbotron-body {
        flex: auto;
        max-width: inherit;
    }
}

.ss-jumbotron.of-primary .ss-jumbotron-body &gt; *:last-child {
    margin-bottom: 0;
}

.ss-jumbotron.of-primary .ss-jumbotron-titleGroup {
    margin-bottom: 16px;
    padding-bottom: 24px;
    border-bottom: 2px solid #e6e6e6;
    font-size: 3.6rem;
    font-weight: bold;
    line-height: 1.25;
}

@media screen and (max-width: 1024px) {
    .ss-jumbotron.of-primary .ss-jumbotron-titleGroup {
        padding-bottom: calc(24vw * 100 / 1024);
        font-size: calc(36vw * 100 / 1024);
    }
}

@media screen and (max-width: 767px) {
    .ss-jumbotron.of-primary .ss-jumbotron-titleGroup {
        margin-bottom: 8px;
        padding-bottom: 8px;
        font-size: 2.4rem;
    }
}

.ss-jumbotron.of-primary .ss-jumbotron-description {
    margin-bottom: 24px;
    font-size: 2rem;
}

@media screen and (max-width: 1024px) {
    .ss-jumbotron.of-primary .ss-jumbotron-description {
        font-size: calc(20vw * 100 / 1024);
    }
}

@media screen and (max-width: 767px) {
    .ss-jumbotron.of-primary .ss-jumbotron-description {
        font-size: 1.8rem;
    }
}

.ss-jumbotron.of-primary .ss-jumbotron-image {
    padding-right: 24px;
}

@media screen and (max-width: 767px) {
    .ss-jumbotron.of-primary .ss-jumbotron-image {
        min-height: 0%;
        padding-right: 0;
        text-align: center;
    }
}

.ss-jumbotron.of-primary .ss-jumbotron-image img {
    max-width: 486px;
}

@media screen and (max-width: 1200px) {
    .ss-jumbotron.of-primary .ss-jumbotron-image img {
        max-width: calc(486vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-jumbotron.of-primary .ss-jumbotron-image img {
        max-width: 260px;
    }
}

.ss-jumbotron.of-primary .ss-jumbotron-button {
    margin-bottom: 38px;
}

@media screen and (max-width: 767px) {
    .ss-jumbotron.of-primary .ss-jumbotron-button {
        margin-bottom: 24px;
    }
}

.ss-jumbotron:not(.of-primary) {
    overflow: hidden;
    background: linear-gradient(to right, #59606a 50%, #fff 50%);
}

@media screen and (max-width: 1024px) {
    .ss-jumbotron:not(.of-primary) {
        background: #59606a;
    }
}

.ss-jumbotron:not(.of-primary) .ss-jumbotron-content {
    display: flex;
    flex-direction: row-reverse;
    align-items: flex-end;
    max-width: 1560px;
    min-height: 620px;
    margin: 0 auto;
}

@media screen and (max-width: 1560px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-content {
        min-height: inherit;
    }
}

@media screen and (max-width: 1024px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-content {
        flex-direction: column;
        align-items: inherit;
    }
}

.ss-jumbotron:not(.of-primary) .ss-jumbotron-inner {
    z-index: 0;
    position: relative;
    flex: 1;
    max-width: 1060px;
    background: #fff;
}

@media screen and (max-width: 1560px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-inner {
        max-width: calc(1000vw * 100 / 1560);
    }
}

@media screen and (max-width: 1024px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-inner {
        flex: inherit;
        width: 100%;
        max-width: 100%;
        padding: 24px 20px;
        background: #59606a;
    }
}

.ss-jumbotron:not(.of-primary) .ss-jumbotron-inner::before {
    display: block;
    z-index: -2;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 500%;
    background: #fff;
    content: "";
}

@media screen and (max-width: 1024px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-inner::before {
        display: none;
    }
}

.ss-jumbotron:not(.of-primary) .ss-jumbotron-inner::after {
    display: block;
    z-index: -1;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 60px;
    height: 500%;
    background: #59606a;
    content: "";
}

@media screen and (max-width: 1560px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-inner::after {
        width: calc(59vw * 100 / 1560);
    }
}

@media screen and (max-width: 1024px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-inner::after {
        display: none;
    }
}

@media screen and (max-width: 1024px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-body {
        display: flex;
        flex-direction: column-reverse;
    }
}

.ss-jumbotron:not(.of-primary) .ss-jumbotron-title {
    display: block;
    margin-bottom: 8px;
}

@media screen and (max-width: 1024px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-title {
        margin-bottom: 16px;
        text-align: center;
    }
}

.ss-jumbotron:not(.of-primary) .ss-jumbotron-titleGroup {
    padding: 80px 80px 0 140px;
    font-size: 4.4rem;
    font-weight: bold;
    line-height: 1.25;
}

@media screen and (max-width: 1560px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-titleGroup {
        padding: calc(80vw * 100 / 1560) calc(80vw * 100 / 1560) 0 calc(140vw * 100 / 1560);
        font-size: calc(44vw * 100 / 1560);
    }
}

@media screen and (max-width: 1024px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-titleGroup {
        padding: 0;
        color: #fff;
        font-size: 2.6rem;
    }
}

.ss-jumbotron:not(.of-primary) .ss-jumbotron-series {
    display: flex;
    align-items: center;
    font-size: 1.6rem;
}

@media screen and (max-width: 1024px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-series {
        justify-content: center;
        font-size: 1.5rem;
    }
}

.ss-jumbotron:not(.of-primary) .ss-jumbotron-seriesBody {
    display: block;
}

.ss-jumbotron:not(.of-primary) .ss-jumbotron-seriesName {
    margin-right: 12px;
}

.ss-jumbotron:not(.of-primary) .ss-jumbotron-seriesText {
    display: inline-block;
    font-weight: normal;
}

.ss-jumbotron:not(.of-primary) .ss-jumbotron-series .ss-iconEmphasis {
    margin-right: 16px;
}

@media screen and (max-width: 1024px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-series .ss-iconEmphasis {
        background: #fff;
    }
}

@media screen and (max-width: 1024px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-series .ss-iconEmphasis-body {
        padding: 6px 8px;
        border: 0;
        font-size: 1.3rem;
    }
    .theme-KJ .ss-jumbotron:not(.of-primary) .ss-jumbotron-series .ss-iconEmphasis-body {
        padding: 6px 8px;
    }
}

.ss-jumbotron:not(.of-primary) .ss-jumbotron-button {
    margin-top: 30px;
}

.ss-jumbotron:not(.of-primary) .ss-jumbotron-image {
    z-index: 0;
    position: relative;
    width: 516px;
    padding: 62px 12px 64px 24px;
    background: #59606a;
}

@media screen and (max-width: 1592px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-image {
        width: calc(511vw * 100 / 1592);
        padding: calc(62vw * 100 / 1592) calc(12vw * 100 / 1592) calc(64vw * 100 / 1592) calc(24vw * 100 / 1592);
    }
}

@media screen and (max-width: 1024px) {
    .ss-jumbotron:not(.of-primary) .ss-jumbotron-image {
        width: auto;
        min-height: 0%;
        padding: 0;
    }
}

.ss-button {
    display: inline-block;
    border: 1px solid #b6b6b6;
    background: #fff;
    color: #333;
    font-weight: bold;
    line-height: 1.25;
    text-decoration: none;
    transition: color 0.3s 0.1s, background 0.3s 0.1s;
}

.ss-button:hover, .ss-button:active, .ss-button:focus {
    background: #333;
    color: #fff;
}

.ss-button:hover .ss-button-body::after, .ss-button:active .ss-button-body::after, .ss-button:focus .ss-button-body::after {
    border-color: #fff;
}

.ss-cardProduct .ss-button::before {
    display: block;
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    content: "";
}

body:not(.ss-theme-top) .ss-cardProduct .ss-button::after {
    display: block;
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    box-shadow: 0;
    content: "";
    transition: box-shadow 0.3s;
}

body:not(.ss-theme-top) .ss-cardProduct .ss-button:hover::after, body:not(.ss-theme-top) .ss-cardProduct .ss-button:active::after, body:not(.ss-theme-top) .ss-cardProduct .ss-button:focus::after {
    box-shadow: 0 0 10px #ccc;
}

.ss-button-body {
    display: flex;
    z-index: 0;
    position: relative;
    align-items: center;
    padding: 12px 32px;
}

.ss-button-body::after {
    display: block;
    width: 8px;
    height: 8px;
    margin-left: 12px;
    transform: rotate(45deg);
    border-top: 2px solid #333;
    border-right: 2px solid #333;
    content: "";
    transition: border-color 0.3s 0.1s;
}

.ss-buttonConversion {
    display: inline-block;
    position: relative;
    padding: 9px 24px 7px 24px;
    background: #f30b19;
    color: #fff;
    line-height: 1.25;
    text-decoration: none;
    transition: color 0.3s 0.1s, background 0.3s 0.1s;
}

.ss-buttonConversion.of-primary {
    background: #3a5199;
}

.ss-buttonConversion.of-primary:hover, .ss-buttonConversion.of-primary:active, .ss-buttonConversion.of-primary:focus {
    background: #3a5199;
}

.ss-buttonConversion.of-primary:hover.is-disabled, .ss-buttonConversion.of-primary:active.is-disabled, .ss-buttonConversion.of-primary:focus.is-disabled {
    background: #a5abb9;
}

.ss-buttonConversion.of-primary .ss-buttonConversion-body {
    font-size: 1.6rem;
}

.ss-buttonConversion:hover, .ss-buttonConversion:active, .ss-buttonConversion:focus {
    background: #cf0010;
}

.ss-buttonConversion-body {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    width: 100%;
    font-size: 2rem;
}

@media screen and (max-width: 1024px) {
    .ss-buttonConversion-body {
        font-size: 1.6rem;
    }
}

@media screen and (max-width: 360px) {
    .ss-buttonConversion-body {
        font-size: calc(16vw * 100 / 360);
    }
}

.ss-buttonConversion-text {
    text-align: center;
}

.ss-buttonConversion-image img {
    max-width: inherit;
    border: 1px solid #707070;
}

.ss-buttonConversion.of-download {
    display: inline-flex;
    align-items: center;
    padding: 4px 8px 4px 14px;
}

.ss-buttonConversion.of-download .ss-buttonConversion-text {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    min-width: 100px;
    padding: 9px 8px 10px 0;
}

.ss-buttonConversion.of-download .ss-buttonConversion-text::before {
    display: block;
    width: 20px;
    min-width: 20px;
    height: 20px;
    margin-right: 8px;
    background: url("../../../../../img/common/icon_textbutton_download_trans_l.png") no-repeat;
    background-size: contain;
    content: "";
    transition: background 0.3s 0.1s;
}

.theme-KJ .ss-buttonConversion.of-download .ss-buttonConversion-text::before {
    background: url("../../../../../img/ss/products/vision/vj/icon_textbutton_download_trans_l.png") no-repeat;
    background-position: 0 2px;
    background-size: contain;
}

.ss-buttonConversion.of-download .ss-buttonConversion-image {
    margin: -10px 0;
    text-align: center;
}

.ss-buttonConversion.of-download.is-disabled::before {
    transform: scale(0, 1);
    transform-origin: right bottom;
}

.ss-buttonConversion.of-download.is-disabled:hover .ss-buttonConversion-text::before, .ss-buttonConversion.of-download.is-disabled:active .ss-buttonConversion-text::before, .ss-buttonConversion.of-download.is-disabled:focus .ss-buttonConversion-text::before {
    background-image: url("../../../../../img/ss/products/vision/vj/icon_textbutton_download_trans_l_gray.png");
}

.ss-buttonConversion.of-download.is-disabled .ss-buttonConversion-text::before {
    background-image: url("../../../../../img/ss/products/vision/vj/icon_textbutton_download_trans_l_gray.png");
    transition: none;
}

.ss-buttonConversion.of-seminar {
    display: inline-flex;
    align-items: center;
    background: #3a5199;
}

.ss-buttonConversion.of-seminar:hover, .ss-buttonConversion.of-seminar:active, .ss-buttonConversion.of-seminar:focus {
    background: #293b71;
}

.ss-buttonConversion.of-seminar .ss-buttonConversion-text {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    min-width: 100px;
    padding: 9px 8px 10px 0;
}

.ss-buttonConversion.of-seminar .ss-buttonConversion-text::before {
    display: block;
    width: 20px;
    min-width: 20px;
    height: 20px;
    margin-right: 8px;
    background: url("../../../../../img/ss/products/vision/vj/ss_vj_icon_seminar.png") no-repeat;
    background-size: contain;
    content: "";
    transition: background 0.3s 0.1s;
}

.ss-buttonConversion.is-disabled {
    background: #a5abb9;
    color: #333;
}

.ss-buttonEmphasis {
    display: inline-block;
    z-index: 0;
    position: relative;
    margin-top: 48px;
    padding: 25px 80px;
    background-color: #021422;
    background-image: linear-gradient(#132ad6, #132ad6);
    color: #fff;
    font-size: 1.8rem;
    font-weight: bold;
    line-height: 1.25;
    text-decoration: none;
}

.ss-buttonEmphasis::before {
    display: block;
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(#021422, #3d3d3d);
    content: "";
    opacity: 1;
    transition: opacity 0.3s;
}

.ss-buttonEmphasis-body {
    display: flex;
    align-items: center;
}

.ss-buttonEmphasis-body::after {
    display: block;
    width: 10px;
    height: 10px;
    margin-left: 12px;
    transform: rotate(45deg);
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    content: "";
}

.ss-buttonEmphasis:hover::before, .ss-buttonEmphasis:active::before, .ss-buttonEmphasis:focus::before {
    opacity: 0;
}

.ss-icon {
    display: inline-block;
    margin-left: 8px;
    vertical-align: middle;
}

.ss-iconEmphasis {
    display: block;
    color: #f00;
    font-size: 1.6rem;
    font-weight: bold;
    line-height: 1;
    white-space: nowrap;
}

.ss-iconEmphasis-body {
    display: inline-block;
    padding: 4px 16px 3px;
    border: 2px solid #f00;
}

.theme-KJ .ss-iconEmphasis-body {
    padding: 3px 16px 4px;
}

.ss-headingLevel2 {
    margin-bottom: 32px;
    font-size: 3rem;
    font-weight: bold;
    line-height: 1.25;
}

@media screen and (max-width: 1200px) {
    .ss-headingLevel2 {
        margin-bottom: calc(32vw * 100 / 1200);
        font-size: calc(30vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-headingLevel2 {
        margin-bottom: 24px;
        font-size: 2.1rem;
    }
}

.ss-headingLevel2.of-primary {
    margin-bottom: 64px;
    font-size: 4rem;
    text-align: center;
}

.ss-section.of-feature .ss-headingLevel2.of-primary {
    margin-bottom: 32px;
}

@media screen and (max-width: 1200px) {
    .ss-section.of-feature .ss-headingLevel2.of-primary {
        margin-bottom: calc(32vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-section.of-feature .ss-headingLevel2.of-primary {
        margin-bottom: 24px;
    }
}

@media screen and (max-width: 1200px) {
    .ss-headingLevel2.of-primary {
        margin-bottom: calc(64vw * 100 / 1200);
        font-size: calc(40vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-headingLevel2.of-primary {
        margin-bottom: 24px;
        font-size: 2.1rem;
    }
}

.ss-headingLevel2.of-secondary {
    margin-top: 64px;
    padding-top: 42px;
    border-top: 1px solid #d1d1d1;
}

@media screen and (max-width: 1200px) {
    .ss-headingLevel2.of-secondary {
        margin-top: calc(64vw * 100 / 1200);
        padding-top: calc(42vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-headingLevel2.of-secondary {
        margin-top: 40px;
        padding-top: 32px;
    }
}

@media screen and (max-width: 1200px) {
    .ss-headingLevel2-logo {
        height: calc(40vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-headingLevel2-logo {
        height: 26px;
        margin-top: 8px;
    }
}

.ss-headingLevel3 {
    margin-bottom: 12px;
    font-size: 2rem;
}

@media screen and (max-width: 767px) {
    .ss-headingLevel3 {
        height: auto !important;
    }
}

.ss-headingLevel3.of-primary {
    position: relative;
    margin-bottom: 24px;
    padding-top: 12px;
}

.ss-headingLevel3.of-primary::before {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100px;
    height: 2px;
    background: #e60012;
    content: "";
}

.ss-headingLevel4 {
    margin-bottom: 18px;
    font-size: 1.6rem;
}

@media screen and (max-width: 767px) {
    .ss-headingLevel4 {
        height: auto !important;
    }
}

.ss-headingLevel4.of-primary {
    position: relative;
    padding-left: 12px;
    font-weight: normal;
}

.ss-headingLevel4.of-primary::before {
    display: block;
    position: absolute;
    top: 0.2em;
    left: 0;
    width: 3px;
    height: 16px;
    background: #000;
    content: "";
}

.theme-KJ .ss-headingLevel4.of-primary::before {
    top: 0.3em;
}

.ss-text {
    margin-bottom: 38px;
}

@media screen and (max-width: 767px) {
    .ss-text {
        margin-bottom: 31px;
    }
}

.ss-textLead {
    position: relative;
    margin-bottom: 12px;
    padding-top: 26px;
    font-size: 2.8rem;
}

.ss-textLead::before {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100px;
    height: 6px;
    background: #f00;
    content: "";
}

.ss-textProduct {
    font-size: 4.8rem;
    font-weight: bold;
    line-height: 1.25;
}

.theme-KJ .ss-textProduct,
.theme-KD .ss-textProduct {
    font-size: 4.2rem;
}

.ss-textProduct-body {
    display: block;
}

* + .ss-textProduct-body {
    margin-top: 12px;
}

.ss-textProduct-series {
    display: block;
    margin-top: 12px;
    font-size: 2.4rem;
    font-weight: normal;
}

.ss-listDescription {
    margin-bottom: 16px;
}

.ss-listDescription &gt; dt {
    margin-bottom: 16px;
}

.ss-listDescription &gt; dd {
    margin-bottom: 16px;
}

.ss-listDescription &gt; *:last-child {
    margin-bottom: 0;
}

.ss-listFeature {
    margin-bottom: 36px;
    font-size: 1.8rem;
}

@media screen and (max-width: 767px) {
    .ss-listFeature {
        margin-bottom: 32px;
        font-size: 1.6rem;
    }
}

.ss-listFeature &gt; li {
    margin-bottom: 16px;
    padding: 16px 24px;
    background: #dde1e4;
}

@media screen and (max-width: 767px) {
    .ss-listFeature &gt; li {
        margin-bottom: 4px;
        padding: 8px 24px;
    }
}

.ss-listFeature &gt; li:last-child {
    margin-bottom: 0;
}

.ss-listUtility {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    max-width: 1248px;
    margin: 0 auto -8px;
    padding-left: 24px;
    font-size: 1.6rem;
    text-align: center;
}

.ss-layout-header .ss-listUtility {
    justify-content: flex-end;
    max-width: inherit;
    margin: 0 0 10px;
    padding: 0 12px 0 24px;
    font-size: 1.4rem;
}

@media screen and (min-width: 1025px) {
    body:not(.ss-theme-top) .ss-layout-header .ss-listUtility {
        display: none;
    }
}

@media screen and (max-width: 1024px) {
    .ss-layout-header .ss-listUtility {
        justify-content: center;
        padding: 0;
    }
}

@media screen and (min-width: 1025px) {
    .ss-layout-header.is-static .ss-listUtility {
        display: none;
    }
}

.ss-layout-footer .ss-listUtility {
    padding-left: 0;
}

.ss-listUtility-outer {
    padding: 16px 24px;
    background: #021422;
}

.ss-listUtility &gt; li {
    margin-bottom: 8px;
}

@media screen and (min-width: 1025px) {
    .ss-layout-header .ss-listUtility &gt; li {
        margin-bottom: 0;
    }
}

.ss-layout-header .ss-listUtility &gt; li.of-seminar {
    display: none;
}

.ss-layout-header .ss-listUtility &gt; li.of-seminar + li {
    margin-left: 0;
    padding-left: 0;
}

.ss-layout-header .ss-listUtility &gt; li.of-seminar + li::before {
    display: none;
}

.ss-listUtility &gt; li + li {
    position: relative;
    margin-left: 16px;
    padding-left: 16px;
}

.ss-listUtility &gt; li + li::before {
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 1px;
    height: 20px;
    transform: translateY(-50%);
    background: #b0b6bb;
    content: "";
}

.ss-listUtility a {
    color: inherit;
    text-decoration: none;
}

.ss-listUtility a:hover, .ss-listUtility a:active, .ss-listUtility a:focus {
    text-decoration: underline;
}

.ss-listLink {
    margin-bottom: 16px;
}

.ss-listLink &gt; li {
    margin-bottom: 16px;
}

.ss-listLink &gt; li:last-child {
    margin-bottom: 0;
}

.ss-listLink a {
    display: inline-block;
    position: relative;
    padding-left: 16px;
    color: inherit;
    text-decoration: none;
}

.ss-listLink a::before {
    display: block;
    position: absolute;
    top: 0.5em;
    left: 0;
    width: 6px;
    height: 6px;
    transform: rotate(45deg);
    border-top: 1px solid #f30b19;
    border-right: 1px solid #f30b19;
    content: "";
}

.ss-listLink a::before .theme-KJ {
    top: 0.6em;
}

.ss-listButton {
    display: flex;
    justify-content: center;
    margin-bottom: 36px;
    margin-left: -16px;
    text-align: center;
}

.ss-listButton.of-direction-column {
    flex-direction: column;
}

.ss-listButton.of-direction-column &gt; li {
    margin-bottom: 24px;
}

.ss-listButton.of-margin-adjust {
    margin-bottom: 0;
}

@media screen and (max-width: 1024px) {
    .ss-listButton {
        display: block;
        margin-left: 0;
        padding-left: 0;
    }
}

.ss-listButton &gt; li {
    padding-left: 16px;
}

@media screen and (max-width: 1024px) {
    .ss-listButton &gt; li {
        margin-bottom: 24px;
        padding-left: 0;
    }
}

.ss-listButton &gt; li:last-child {
    margin-bottom: 0;
}

.ss-listLogo {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px;
    padding: 0 8px 26px;
    border-bottom: 1px solid #b0b6bb;
}

@media screen and (max-width: 1024px) {
    .ss-listLogo {
        width: 220px;
        margin-bottom: 10px;
        padding-bottom: 16px;
    }
}

@media screen and (max-width: 1560px) {
    .ss-listLogo &gt; li:nth-child(1) img {
        width: calc(147vw * 100 / 1560);
    }
}

@media screen and (max-width: 1024px) {
    .ss-listLogo &gt; li:nth-child(1) img {
        width: 73px;
    }
}

.ss-listLogo &gt; li:nth-child(2) {
    margin-top: -6px;
}

@media screen and (max-width: 1560px) {
    .ss-listLogo &gt; li:nth-child(2) img {
        width: calc(273vw * 100 / 1560);
    }
}

@media screen and (max-width: 1024px) {
    .ss-listLogo &gt; li:nth-child(2) img {
        width: 120px;
    }
}

.ss-listLogo &gt; li + li {
    margin-left: 20px;
}

@media screen and (max-width: 1024px) {
    .ss-listLogo &gt; li + li {
        margin-left: 10px;
    }
}

.ss-listTile {
    display: flex;
    flex-wrap: wrap;
    margin: -8px 0 10px -8px;
    font-size: 1.8rem;
    line-height: 1.25;
}

@media screen and (max-width: 767px) {
    .ss-listTile {
        font-size: 1.3rem;
    }
}

@media screen and (max-width: 360px) {
    .ss-listTile {
        font-size: calc(13vw * 100 / 360);
    }
}

.ss-listTile &gt; li {
    display: flex;
    width: 33.33333333%;
    margin-top: 8px;
    padding-left: 8px;
}

.ss-listTile &gt; li.of-columnSize-2 {
    width: 66.66666666%;
}

.ss-listTile &gt; li.of-columnSize-3 {
    width: 100%;
}

.ss-listTile-body {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 4px;
    background: #fff;
    text-align: center;
}

.ss-listNotes {
    color: #6e6e6e;
    font-size: 1.3rem;
}

.ss-listNotes.of-align-right &gt; li {
    justify-content: flex-end;
}

@media screen and (max-width: 767px) {
    .ss-listNotes.of-align-right &gt; li {
        justify-content: center;
    }
}

.ss-listNotes &gt; li {
    display: flex;
    margin-bottom: 16px;
}

.ss-listNotes &gt; li:last-child {
    margin-bottom: 0;
}

.ss-listNotes-mark {
    padding-right: 8px;
}

.ss-listForm &gt; li {
    margin-bottom: 4px;
}

.ss-listForm &gt; li:last-child {
    margin-bottom: 0;
}

.ss-listSlide {
    padding-bottom: 64px;
}

[data-script-enabled="true"] .ss-listSlide {
    display: flex;
    width: 10000px;
    transition: transform 1s;
}

@media screen and (max-width: 1592px) {
    .ss-listSlide {
        width: calc(1440vw * 100 / 1592);
        padding-bottom: calc(64vw * 100 / 1592);
    }
}

.ss-listSlide-outer {
    overflow: hidden;
}

.ss-listSlide &gt; li {
    width: 480px;
    max-width: 480px;
}

@media screen and (max-width: 1592px) {
    .ss-listSlide &gt; li {
        width: calc(468vw * 100 / 1592);
    }
}

.ss-slider {
    position: relative;
}

.ss-indicator {
    width: 30px;
    height: 2px;
    margin-bottom: 16px;
    margin-left: 16px;
    background: #717b8a;
}

.ss-indicator.is-active {
    height: 4px;
    background: #dce1e6;
}

.ss-indicator-outer {
    display: flex;
    position: absolute;
    bottom: 0;
    left: 50%;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-bottom: -16px;
    margin-left: -16px;
    transform: translateX(-50%);
}

.ss-media {
    display: flex;
    margin-bottom: 36px;
}

@media screen and (max-width: 767px) {
    .ss-media {
        flex-direction: column-reverse;
        margin-bottom: 32px;
    }
}

.ss-media.of-row-reverse {
    flex-direction: row-reverse;
}

@media screen and (max-width: 767px) {
    .ss-media.of-row-reverse {
        flex-direction: column-reverse;
    }
}

.ss-media.of-row-reverse .ss-media-image {
    margin-right: 24px;
    margin-left: 0;
}

@media screen and (max-width: 767px) {
    .ss-media.of-row-reverse .ss-media-image {
        margin-right: 0;
    }
}

.ss-step-column .ss-media.of-row-reverse .ss-media-image {
    flex: 1;
}

@media screen and (max-width: 767px) {
    .ss-step-column .ss-media.of-row-reverse .ss-media-image {
        flex: auto;
    }
}

@media screen and (max-width: 1200px) {
    .ss-step-column .ss-media.of-row-reverse .ss-media-image img {
        max-height: calc(114vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-step-column .ss-media.of-row-reverse .ss-media-image img {
        max-height: inherit;
    }
}

.ss-media.of-column-reverse {
    flex-direction: column-reverse;
}

.ss-media.of-column-reverse .ss-media-image {
    min-height: 0%;
    margin-left: 0;
}

.ss-media.of-column-reverse .ss-media-body {
    flex: auto;
    margin-top: 16px;
}

.ss-media-body {
    flex: 1;
}

@media screen and (max-width: 767px) {
    .ss-media-body {
        flex: auto;
        margin-top: 16px;
    }
    .ss-media-body:only-child {
        margin-top: 0;
    }
}

.ss-media-body &gt; *:last-child {
    margin-bottom: 0;
}

.ss-media-image {
    margin-left: 24px;
}

@media screen and (max-width: 767px) {
    .ss-media-image {
        min-height: 0%;
        margin-left: 0;
        text-align: center;
    }
}

@media screen and (max-width: 1200px) {
    .ss-layout-grid-column .ss-media-image.of-small {
        width: 100%;
        max-width: calc(254vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-layout-grid-column .ss-media-image.of-small {
        width: auto;
        max-width: inherit;
    }
}

.ss-mediaAsset {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
}

@media screen and (max-width: 1024px) {
    .ss-mediaAsset {
        flex-direction: column-reverse;
        align-items: center;
    }
}

.ss-mediaAsset-body {
    width: 100%;
    max-width: 935px;
    text-align: center;
}

.theme-KC .ss-mediaAsset-body {
    max-width: 500px;
}

@media screen and (max-width: 1200px) {
    .ss-mediaAsset-body {
        max-width: calc(935vw * 100 / 1200);
    }
    .theme-KC .ss-mediaAsset-body {
        max-width: calc(500vw * 100 / 1200);
    }
}

@media screen and (max-width: 1024px) {
    .ss-mediaAsset-body {
        max-width: inherit;
    }
    .theme-KC .ss-mediaAsset-body {
        max-width: inherit;
    }
}

.ss-mediaAsset-body &gt; *:last-child {
    margin-bottom: 0;
}

.ss-mediaAsset-text {
    margin-bottom: 32px;
    font-size: 4rem;
}

@media screen and (max-width: 1200px) {
    .ss-mediaAsset-text {
        font-size: calc(40vw * 100 / 1200);
    }
}

@media screen and (max-width: 1024px) {
    .ss-mediaAsset-text {
        margin-bottom: 32px;
        font-size: 2.6rem;
        line-height: 1.25;
    }
}

.ss-mediaAsset-image {
    padding-right: 40px;
}

@media screen and (max-width: 1200px) {
    .ss-mediaAsset-image {
        padding-right: calc(40vw * 100 / 1200);
    }
}

@media screen and (max-width: 1024px) {
    .ss-mediaAsset-image {
        min-height: 0%;
        margin-bottom: 16px;
        padding-right: 0;
        text-align: center;
    }
}

@media screen and (max-width: 1024px) {
    .ss-mediaAsset-image img {
        width: calc(105vw * 100 / 360);
        max-width: 155px;
    }
}

.ss-mediaProduct {
    display: flex;
    flex-direction: column;
    width: 100%;
    color: inherit;
    text-decoration: none;
}

.ss-mediaProduct:hover .ss-mediaProduct-body, .ss-mediaProduct:active .ss-mediaProduct-body, .ss-mediaProduct:focus .ss-mediaProduct-body {
    text-decoration: underline;
}

.ss-mediaProduct:hover .ss-mediaProduct-image, .ss-mediaProduct:active .ss-mediaProduct-image, .ss-mediaProduct:focus .ss-mediaProduct-image {
    background: #ccd1d5;
}

.ss-mediaProduct:hover .ss-mediaProduct-image img, .ss-mediaProduct:active .ss-mediaProduct-image img, .ss-mediaProduct:focus .ss-mediaProduct-image img {
    transform: scale(1.05);
}

.ss-mediaProduct:hover .ss-mediaProduct-button, .ss-mediaProduct:active .ss-mediaProduct-button, .ss-mediaProduct:focus .ss-mediaProduct-button {
    background: #021422;
    color: #fff;
}

.ss-mediaProduct.is-current {
    pointer-events: none;
}

.ss-mediaProduct.is-current .ss-mediaProduct-image {
    background: #ccd1d5;
}

.ss-mediaProduct.is-current .ss-mediaProduct-button {
    background: #021422;
    color: #fff;
}

.ss-mediaProduct-body {
    flex: 1 0 auto;
    padding-right: 16px;
}

.ss-mediaProduct-body &gt; *:last-child {
    margin-bottom: 0;
}

.ss-mediaProduct-title {
    color: #666;
    font-size: 1.5rem;
}

@media screen and (max-width: 767px) {
    .ss-mediaProduct-title {
        font-size: 1.3rem;
    }
}

.ss-mediaProduct-description {
    font-size: 2.4rem;
    font-weight: bold;
}

@media screen and (max-width: 1024px) {
    .ss-mediaProduct-description {
        font-size: calc(24vw * 100 / 1024);
    }
}

@media screen and (max-width: 767px) {
    .ss-mediaProduct-description {
        font-size: 1.6rem;
    }
}

.ss-mediaProduct-image {
    min-height: 0%;
    margin-top: 12px;
    overflow: hidden;
    background: #fff;
    text-align: center;
    transition: background 0.3s 0.1s;
}

.ss-mediaProduct-image img {
    transition: transform 0.3s 0.1s;
}

.ss-mediaProduct-button {
    padding: 12px;
    background: #efefef;
    font-size: 2rem;
    line-height: 1.25;
    text-align: center;
    text-decoration: none;
    transition: background 0.3s 0.1s, color 0.3s 0.1s;
}

@media screen and (max-width: 1024px) {
    .ss-mediaProduct-button {
        font-size: calc(20vw * 100 / 1024);
    }
}

@media screen and (max-width: 767px) {
    .ss-mediaProduct-button {
        font-size: 1.6rem;
    }
}

.ss-step {
    margin-bottom: 32px;
}

.ss-step-content {
    display: flex;
    margin-left: -80px;
}

@media screen and (max-width: 1200px) {
    .ss-step-content {
        margin-left: calc(-80vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-step-content {
        margin-left: 0;
    }
}

.ss-layout-grid-column .ss-step-content,
.ss-step-column .ss-step-content {
    margin-left: -53px;
}

@media screen and (max-width: 1200px) {
    .ss-layout-grid-column .ss-step-content,
    .ss-step-column .ss-step-content {
        margin-left: calc(-53vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-layout-grid-column .ss-step-content,
    .ss-step-column .ss-step-content {
        margin-left: 0;
    }
}

@media screen and (max-width: 767px) {
    .ss-step-content {
        flex-direction: column;
        align-items: center;
        margin-left: 0;
    }
}

.ss-step-content + .ss-step-caption {
    margin-top: 16px;
    margin-bottom: 0;
}

.ss-step-column {
    flex: 1;
    padding-left: 80px;
}

@media screen and (max-width: 1200px) {
    .ss-step-column {
        padding-left: calc(80vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-step-column {
        margin-left: 0;
    }
}

.ss-layout-grid-column .ss-step-column,
.ss-step-column .ss-step-column {
    padding-left: 53px;
}

@media screen and (max-width: 1200px) {
    .ss-layout-grid-column .ss-step-column,
    .ss-step-column .ss-step-column {
        padding-left: calc(53vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-layout-grid-column .ss-step-column,
    .ss-step-column .ss-step-column {
        padding-left: 0;
    }
}

@media screen and (max-width: 767px) {
    .ss-step-column {
        flex: auto;
        width: 100%;
        min-height: 0%;
        padding-left: 0;
    }
}

.ss-step-column &gt; *:last-child {
    margin-bottom: 0;
}

.ss-step-column.of-arrow-adjust .ss-step-column:last-child .ss-step-image {
    position: relative;
}

.ss-step-column.of-arrow-adjust .ss-step-column:last-child .ss-step-image::before {
    display: block;
    position: absolute;
    right: -66px;
    bottom: 43px;
    transform: none;
    border-width: 14px 16px;
    border-style: solid;
    border-color: transparent transparent transparent #110f0b;
    content: "";
}

@media screen and (max-width: 1200px) {
    .ss-step-column.of-arrow-adjust .ss-step-column:last-child .ss-step-image::before {
        right: calc(-66vw * 100 / 1200);
        bottom: calc(43vw * 100 / 1200);
        border-width: calc(14vw * 100 / 1200) calc(16vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-step-column.of-arrow-adjust .ss-step-column:last-child .ss-step-image::before {
        display: none;
    }
}

@media screen and (min-width: 768px) {
    .ss-step-column.of-arrow-adjust + .ss-step-column::before {
        display: none;
    }
}

.ss-step-column + .ss-step-column {
    position: relative;
}

@media screen and (max-width: 767px) {
    .ss-step-column + .ss-step-column {
        margin-top: 32px;
    }
}

.ss-step-column + .ss-step-column::before, .ss-step-column + .ss-step-column::after {
    display: block;
    position: absolute;
    content: "";
}

.ss-step-column + .ss-step-column::before {
    top: 50%;
    left: 34px;
    transform: translateY(-50%);
    border-width: 14px 16px;
    border-style: solid;
    border-color: transparent transparent transparent #110f0b;
}

@media screen and (max-width: 1200px) {
    .ss-step-column + .ss-step-column::before {
        left: calc(34vw * 100 / 1200);
        border-width: calc(14vw * 100 / 1200) calc(16vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-step-column + .ss-step-column::before {
        top: -22px;
        left: 50%;
        transform: translateX(-50%);
        border-width: 14px 16px;
        border-color: #110f0b transparent transparent transparent;
    }
}

.ss-layout-grid-column .ss-step-column + .ss-step-column::before {
    left: 21px;
}

@media screen and (max-width: 1200px) {
    .ss-layout-grid-column .ss-step-column + .ss-step-column::before {
        left: calc(21vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-layout-grid-column .ss-step-column + .ss-step-column::before {
        left: 50%;
    }
}

.ss-step-caption {
    margin-bottom: 16px;
    font-size: 1.6rem;
}

.ss-step-image {
    position: relative;
}

@media screen and (max-width: 767px) {
    .ss-step-image {
        min-height: 0%;
        text-align: center;
    }
}

.ss-step-image + .ss-step-caption {
    margin-top: 16px;
    margin-bottom: 0;
}

.ss-step.of-bullet-plus .ss-step-column::before {
    top: 50%;
    left: 14px;
    width: 25px;
    height: 5px;
    transform: translateY(-50%);
    border: 0;
    background: #110f0b;
}

@media screen and (max-width: 1200px) {
    .ss-step.of-bullet-plus .ss-step-column::before {
        left: calc(14vw * 100 / 1200);
        width: calc(25vw * 100 / 1200);
        height: calc(5vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-step.of-bullet-plus .ss-step-column::before {
        top: -19px;
        left: 50%;
        width: 25px;
        height: 5px;
        transform: translateX(-50%);
    }
}

.ss-step.of-bullet-plus .ss-step-column::after {
    top: 50%;
    left: 24px;
    width: 5px;
    height: 25px;
    transform: translateY(-50%);
    background: #110f0b;
}

@media screen and (max-width: 1200px) {
    .ss-step.of-bullet-plus .ss-step-column::after {
        left: calc(24vw * 100 / 1200);
        width: calc(5vw * 100 / 1200);
        height: calc(25vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-step.of-bullet-plus .ss-step-column::after {
        top: -29px;
        left: 50%;
        width: 5px;
        height: 25px;
        transform: translateX(-50%);
    }
}

.ss-step.of-arrow-bottom {
    position: relative;
    margin-bottom: 46px;
}

.ss-step.of-arrow-bottom .ss-step-column::before {
    display: block;
    position: absolute;
    bottom: -44px;
    left: 50%;
    transform: translateX(-50%);
    border-width: 14px 16px;
    border-style: solid;
    border-color: #110f0b transparent transparent transparent;
    content: "";
}

.ss-card {
    margin-bottom: 32px;
    padding: 16px 0 19px;
    background: #c5d1de;
}

@media screen and (max-width: 1024px) {
    .ss-card {
        margin-bottom: 16px;
    }
}

.ss-card-body {
    padding: 0 116px;
}

@media screen and (max-width: 1800px) {
    .ss-card-body {
        padding: 0 calc(80vw * 100 / 1800);
    }
}

@media screen and (max-width: 1200px) {
    .ss-card-body {
        padding: 0 calc(40vw * 100 / 1200);
    }
}

@media screen and (max-width: 1024px) {
    .ss-card-body {
        padding: 0 calc(20vw * 100 / 360);
    }
}

.ss-card-body &gt; *:last-child {
    margin-bottom: 0;
}

.ss-card-title {
    margin-bottom: 16px;
    padding: 0 20px;
    font-size: 2rem;
    font-weight: bold;
    text-align: center;
}

.ss-cardSelection {
    border-top: 3px solid #1574c1;
    background: #dce1e6;
}

.ss-cardSelection-text {
    font-size: 1.8rem;
}

@media screen and (max-width: 1024px) {
    .ss-cardSelection-text {
        font-size: calc(18vw * 100 / 1024);
    }
}

@media screen and (max-width: 767px) {
    .ss-cardSelection-text {
        font-size: 1.6rem;
    }
}

.ss-cardSelection-body {
    padding: 24px 40px;
}

@media screen and (max-width: 1200px) {
    .ss-cardSelection-body {
        padding: calc(24vw * 100 / 1200) calc(40vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-cardSelection-body {
        padding: 16px 24px;
    }
}

.ss-cardSelection-controller {
    display: flex;
    margin-right: 16px;
}

@media screen and (max-width: 1024px) {
    .ss-cardSelection-controller {
        margin-right: 0;
        margin-bottom: 8px;
    }
}

.ss-cardSelection-controllerGroup {
    display: flex;
}

@media screen and (max-width: 1024px) {
    .ss-cardSelection-controllerGroup {
        flex-direction: column;
        align-items: center;
    }
}

.ss-cardSelection-controller .ss-form-select {
    width: 100%;
}

.ss-cardSelection-controller .ss-form-selectOuter {
    display: flex;
}

.ss-cardSelection-button {
    display: flex;
}

@media screen and (max-width: 1024px) {
    .ss-cardSelection-button .ss-buttonConversion {
        width: 100%;
    }
}

.ss-cardLead {
    z-index: 0;
    position: relative;
    max-width: 1296px;
    margin: 0 auto;
    padding: 0 24px;
    text-align: center;
}

@media screen and (max-width: 1296px) {
    .ss-cardLead {
        padding: 0 calc(24vw * 100 / 1296);
    }
}

@media screen and (max-width: 767px) {
    .ss-cardLead {
        padding: 0 20px;
    }
}

.ss-cardLead::before, .ss-cardLead::after {
    display: block;
    z-index: -1;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100vw;
    height: 50%;
    background: #fff;
    content: "";
}

.ss-cardLead::after {
    right: 0;
    left: inherit;
}

.ss-cardLead-body {
    padding: 40px 24px;
    background: #fff;
    font-size: 2.4rem;
}

@media screen and (max-width: 1296px) {
    .ss-cardLead-body {
        padding: calc(40vw * 100 / 1296) calc(24vw * 100 / 1296);
        font-size: calc(24vw * 100 / 1296);
    }
}

@media screen and (max-width: 767px) {
    .ss-cardLead-body {
        padding: 24px 40px;
        font-size: 1.6rem;
    }
}

.ss-cardLead-body &gt; *:last-child {
    margin-bottom: 0;
}

.ss-form-radio {
    position: absolute;
    opacity: 0;
}

.ss-form-radio:checked + span::after {
    display: block;
    position: absolute;
    top: 8px;
    left: 3px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #666;
    content: "";
}

.ss-form-radio:disabled + span {
    color: #666;
}

.ss-form-radio:disabled + span::before {
    background: #e0e0e0;
}

.ss-form-radio:focus + span::before {
    border-width: 2px;
}

.ss-form-radio + span {
    position: relative;
    padding-left: 20px;
}

.ss-form-radio + span::before {
    display: block;
    position: absolute;
    top: 5px;
    left: 0;
    width: 12px;
    height: 12px;
    border: 1px solid #b8b9b9;
    border-radius: 50%;
    background: #fff;
    content: "";
}

.ss-form-select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 8px 32px 8px 16px;
    border: 0;
    border-radius: 4px;
    background: #fff;
    color: #666;
}

.ss-form-select::-ms-expand {
    display: none;
}

.ss-form-selectOuter {
    position: relative;
}

.ss-form-selectOuter::before {
    display: block;
    position: absolute;
    top: 50%;
    right: 16px;
    margin-top: 2px;
    transform: translateY(-50%);
    border-width: 6px 4px;
    border-style: solid;
    border-color: #999 transparent transparent transparent;
    content: "";
}

.ss-figure {
    margin-bottom: 32px;
}

@media screen and (max-width: 767px) {
    .ss-figure {
        margin-bottom: 24px;
    }
}

.ss-figure.of-direction-row {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

@media screen and (max-width: 767px) {
    .ss-figure.of-direction-row {
        max-width: 560px;
        margin: 0 auto 16px;
    }
}

.ss-figure.of-direction-row .ss-figure-image {
    margin-right: 24px;
}

@media screen and (max-width: 1200px) {
    .ss-figure.of-direction-row .ss-figure-image img {
        max-width: calc(254vw * 100 / 1200);
    }
}

@media screen and (max-width: 767px) {
    .ss-figure.of-direction-row .ss-figure-image img {
        max-width: calc(152vw * 100 / 360);
    }
}

.ss-figure.of-direction-row .ss-figure-caption {
    flex: 1;
    margin-top: 0;
    text-align: left;
}

.ss-figure-image &gt; *:last-child {
    margin-bottom: 0;
}

.ss-figure-image + .ss-figure-caption {
    margin-top: 16px;
    margin-bottom: 0;
}

.ss-figure-caption {
    margin-bottom: 16px;
}

.ss-figureUsage {
    z-index: 1;
    position: relative;
    min-width: 1060px;
    min-height: 588px;
}

@media screen and (max-width: 1560px) {
    .ss-figureUsage {
        min-width: calc(1060vw * 100 / 1560);
        min-height: calc(588vw * 100 / 1560);
    }
}

@media screen and (max-width: 1560px) {
    .ss-figureUsage-image {
        max-width: calc(1060vw * 100 / 1560);
    }
}

.ss-figureUsage-slideGroup {
    z-index: 3;
    position: absolute;
    bottom: 236px;
    left: 102px;
    width: 314px;
    height: 232px;
}

@media screen and (max-width: 1560px) {
    .ss-figureUsage-slideGroup {
        bottom: calc(236vw * 100 / 1560);
        left: calc(102vw * 100 / 1560);
        width: calc(314vw * 100 / 1560);
        height: calc(232vw * 100 / 1560);
    }
}

.ss-figureUsage-monitorImage {
    z-index: 3;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    transition: bottom 0.5s ease-in, left 0.5s ease-in, opacity 0.5s ease-in;
}

.is-resizing .ss-figureUsage-monitorImage {
    transition: none;
}

.ss-figureUsage-monitorImage:first-child {
    z-index: 10;
}

.ss-figureUsage-monitorImage.of-base {
    z-index: 2;
    bottom: 156px;
    left: 29px;
    transition: none;
}

@media screen and (max-width: 1560px) {
    .ss-figureUsage-monitorImage.of-base {
        bottom: calc(156vw * 100 / 1560);
        left: calc(29vw * 100 / 1560);
        max-width: calc(452vw * 100 / 1560);
    }
}

.ss-figureUsage-monitorImage.is-hide {
    bottom: -5px;
    left: -5px;
    width: 90%;
    opacity: 0;
    transition: bottom 0s 1.5s, left 0s 1.5s, opacity 0.5s 0s, width 0s 1.5s;
}

.is-resizing .ss-figureUsage-monitorImage.is-hide {
    transition: none;
}

.ss-figureUsage-monitorImage.is-show {
    z-index: 4;
    bottom: 0;
    left: 0;
    width: 100%;
    opacity: 1;
}

.ss-figureProduct {
    text-align: center;
}

.ss-figureProduct-caption {
    margin-top: 8px;
    color: #b0b6bb;
    font-size: 2.4rem;
}

@media screen and (max-width: 1560px) {
    .ss-figureProduct-caption {
        font-size: calc(24vw * 100 / 1560);
    }
}

.ss-table {
    margin-bottom: 32px;
    border-bottom: 1px solid #ccc;
    table-layout: fixed;
}

.ss-table th,
.ss-table td {
    padding: 16px;
    border-top: 1px solid #ccc;
    background: #fff;
    font-weight: normal;
    text-align: left;
}

.theme-KC .ss-table th, .theme-KC
.ss-table td {
    padding: 16px 14px;
}

.ss-table th.of-primary,
.ss-table td.of-primary {
    padding: 8px 16px;
    border-top: 0;
    background: #dce1e6;
    text-align: center;
}

.ss-table th + th,
.ss-table th + td,
.ss-table td + th,
.ss-table td + td {
    border-left: 1px solid #ccc;
}

.ss-table th &gt; *:last-child,
.ss-table td &gt; *:last-child {
    margin-bottom: 0;
}

.ss-table tbody tr:first-child th,
.ss-table tbody tr:first-child td {
    border-top: 0;
}

.ss-table-outer {
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
}

.ss-table-outer .ss-table {
    min-width: 1200px;
}

.ss-table-outer &gt; *:last-child {
    margin-bottom: 0;
}

.ss-section.of-primary {
    background: #dce1e6;
}

.ss-section.of-feature {
    z-index: 0;
    position: relative;
    overflow: hidden;
}

.ss-section.of-feature .ss-section-content {
    max-width: 848px;
    margin: 0 auto;
}

@media screen and (max-width: 1800px) {
    .ss-section.of-feature .ss-section-content {
        max-width: calc(848vw * 100 / 1800);
    }
}

@media screen and (max-width: 1024px) {
    .ss-section.of-feature .ss-section-content {
        max-width: 1248px;
    }
}

.ss-section.of-feature .ss-section-image {
    z-index: -1;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

@media screen and (max-width: 1024px) {
    .ss-section.of-feature .ss-section-image {
        position: static;
        width: 100%;
        transform: none;
    }
}

@media screen and (max-width: 1024px) {
    .ss-section.of-feature .ss-section-imageGroup {
        display: flex;
        justify-content: center;
        margin-top: 32px;
    }
}

.ss-section.of-feature .ss-section-image.of-primary {
    left: -65px;
}

@media screen and (max-width: 1800px) {
    .ss-section.of-feature .ss-section-image.of-primary {
        left: calc(-65vw * 100 / 1800);
        max-width: calc(571vw * 100 / 1800);
    }
}

@media screen and (max-width: 1024px) {
    .ss-section.of-feature .ss-section-image.of-primary {
        max-width: 151px;
    }
}

.ss-section.of-feature .ss-section-image.of-secondary {
    right: 50px;
}

@media screen and (max-width: 1800px) {
    .ss-section.of-feature .ss-section-image.of-secondary {
        right: calc(50vw * 100 / 1800);
        max-width: calc(376vw * 100 / 1800);
    }
}

@media screen and (max-width: 1024px) {
    .ss-section.of-feature .ss-section-image.of-secondary {
        max-width: 98px;
    }
}

.ss-section.of-phone {
    border-top: 1px solid #dce1e6;
    background: #fff;
    color: #333;
}

.ss-section.of-phone .ss-section-content {
    padding: 40px 24px;
}

@media screen and (max-width: 1024px) {
    .ss-section.of-phone .ss-section-content {
        padding: 40px 20px;
    }
}

.ss-section &gt; *:last-child {
    margin-bottom: 0;
}

.ss-section &gt; *:last-child.ss-cardProduct {
    margin-bottom: 10px;
}

.ss-section-content {
    max-width: 1248px;
    margin: 0 auto;
    padding: 80px 24px;
}

@media screen and (max-width: 1024px) {
    .ss-section-content {
        padding: 40px 20px;
    }
}

.ss-section-content &gt; *:last-child {
    margin-bottom: 0;
}

.ss-utility-text-small {
    font-size: 1.3rem;
}

.ss-utility-text-medium {
    font-size: 1.6rem;
}

.ss-utility-text-large {
    font-size: 2rem;
}

.ss-utility-textAlign-right {
    text-align: right;
}

.ss-utility-textAlign-center {
    text-align: center;
}

.ss-utility-lineHeight-small {
    line-height: 1.25;
}

.ss-utility-color-weaken {
    color: #888f99;
}

@media screen and (min-width: 1025px) {
    .ss-smallScreen-show {
        display: none;
    }
}

@media screen and (max-width: 1024px) {
    .ss-smallScreen-hide {
        display: none;
    }
}

@media screen and (max-width: 767px) {
    .ss-extraSmallScreen-hide {
        display: none;
    }
}

.ss-textPhone {
    display: block;
    margin-bottom: 24px;
}

.ss-textPhone &gt; *:last-child {
    margin-bottom: 0;
}

.ss-textPhone-body &gt; *:last-child {
    margin-bottom: 0;
}

.ss-textPhone-number {
    font-size: 3.6rem;
    font-weight: bold;
    line-height: 1;
}

@media screen and (max-width: 1024px) {
    .ss-textPhone-number {
        font-size: 2.4rem;
    }
}

.ss-textPhone-numberGroup {
    display: flex;
    align-items: flex-start;
    margin-top: 0 !important;
    margin-bottom: 8px;
}

.ss-textPhone-note {
    display: block;
    margin-top: 0 !important;
    margin-bottom: 8px;
    font-size: 1.8rem;
    line-height: 1.2;
}

@media screen and (max-width: 1024px) {
    .ss-textPhone-note {
        font-size: 1.2rem;
    }
}

.ss-textPhone-icon {
    width: 54px;
    min-width: 54px;
    height: 30px;
    min-height: 30px;
    margin-top: 0.6rem;
    margin-right: 8px;
}

@media screen and (max-width: 1024px) {
    .ss-textPhone-icon {
        width: 36px;
        min-width: 36px;
        height: 20px;
        min-height: 20px;
        margin-top: 0.2rem;
    }
}

.ss-textPhone-icon .of-iconColor-primary {
    fill: #00a23f;
}

.ss-textPhone-icon .of-iconColor-secondary {
    fill: #fe8800;
}

.ss-textPhone-icon .of-iconColor-tertiary {
    fill: #0086b1;
}

.ss-textPhone-icon .of-iconColor-quaternary {
    fill: #838079;
}

.ss-textPhone-icon .of-iconColor-quinary {
    fill: #1e1c1c;
}

.ss-textPhone-lead {
    margin-right: 40px;
    margin-bottom: 0;
    font-size: 2.4rem;
    line-height: 1.8;
}

@media screen and (max-width: 1024px) {
    .ss-textPhone-lead {
        width: 100%;
        margin-right: 0;
        margin-bottom: 16px;
        font-size: 1.6rem;
        line-height: 1.2;
    }
}

.ss-layout-header-buttonList &gt; li.of-phone .ss-textPhone-lead {
    display: none;
}

.ss-textPhone.of-center {
    text-align: center;
}

.ss-textPhone.of-center .ss-textPhone-numberGroup {
    justify-content: center;
}

a.ss-textPhone-body,
a:hover.ss-textPhone-body {
    display: inline-block;
    color: #333;
    text-decoration: none;
    cursor: default;
    opacity: 1;
}

.ss-textPhone-outer {
    display: flex;
    align-items: center;
    justify-content: center;
}

.ss-textPhone-outer &gt; *:last-child {
    margin-bottom: 0;
}

@media screen and (max-width: 1024px) {
    .ss-textPhone-outer {
        flex-direction: column;
        align-items: center;
        width: 100%;
        margin-bottom: 32px;
    }
}

.ss-textPhoneLink {
    width: 100%;
    margin-bottom: 16px;
    text-align: center;
}

.ss-textPhoneLink &gt; *:last-child {
    margin-bottom: 0;
}

.ss-textPhoneLink-numberGroup {
    display: flex;
    align-items: center;
    max-width: 680px;
    margin: 0 auto;
}

@media screen and (max-width: 1024px) {
    .ss-textPhoneLink-numberGroup {
        flex-direction: column;
        justify-content: center;
    }
}

.ss-textPhoneLink-numberGroup.of-vertical {
    flex-direction: column;
}

.ss-textPhoneLink-number {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    font-size: 3.6rem;
    font-weight: bold;
}

@media screen and (max-width: 1024px) {
    .ss-textPhoneLink-number {
        flex: none;
        width: 100%;
        font-size: 2.4rem;
    }
}

.ss-textPhoneLink-number &gt; .AutoPhoneCall {
    position: relative;
    max-width: 100%;
    padding-left: 5.8rem;
    color: #333;
    text-decoration: none;
    cursor: default;
}

@media screen and (max-width: 1024px) {
    .ss-textPhoneLink-number &gt; .AutoPhoneCall {
        padding-left: 3.8rem;
    }
}

.ss-textPhoneLink-number &gt; .AutoPhoneCall::before {
    position: absolute;
    top: 50%;
    left: 0;
    width: 5.8rem;
    height: 5.8rem;
    transform: translateY(-50%);
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23.8459 18.8048C24.0514 19.0103 24.0514 19.3435 23.8459 19.549L21.9896 21.4052C21.6958 21.699 21.3224 21.9075 20.9094 21.9533C17.7281 22.3057 14.2797 20.6242 11.8263 18.1708C9.37433 15.7188 7.69413 12.2717 8.04673 9.09064C8.09251 8.67763 8.30099 8.30421 8.59482 8.01038L10.4511 6.15412C10.6566 5.94863 10.9897 5.94863 11.1952 6.15412L13.7998 8.75867C14.0053 8.96416 14.0053 9.29733 13.7998 9.50282L11.1583 12.1443C11.1452 13.8391 12.0519 15.3826 13.3347 16.6653C14.6182 17.9489 16.1599 18.8556 17.8557 18.8417L20.5604 16.2479C20.767 16.0497 21.0942 16.0531 21.2967 16.2556L23.8459 18.8048Z' fill='%23333'/%3E%3C/svg%3E");
    content: "";
}

@media screen and (max-width: 1024px) {
    .ss-textPhoneLink-number &gt; .AutoPhoneCall::before {
        width: 3.8rem;
        height: 3.8rem;
    }
}

.ss-textPhoneLink-number &gt; .TelSlsh {
    display: none;
}

.ss-textPhoneLink-notes {
    width: 100%;
    max-width: 320px;
    padding-right: 40px;
    font-size: 2.4rem;
}

@media screen and (max-width: 1024px) {
    .ss-textPhoneLink-notes {
        width: 100%;
        margin-bottom: 4px;
        padding-right: 0;
        font-size: 1.6rem;
    }
}

.ss-layout-header-buttonList &gt; li.of-phone .ss-textPhoneLink-notes {
    display: none;
}

.buttonConversion {
    margin-bottom: 8px;
}

.theme-KJ .buttonConversion.of-download .buttonConversion-body::before {
    background: url("../../../../../img/ss/products/vision/vj/icon_textbutton_download_trans_l.png") no-repeat;
}

.buttonConversion-body {
    padding-top: 12px;
    padding-bottom: 12px;
}

.is-overview-hide {
    visibility: hidden;
}

.lp-navigationSeries {
    margin-bottom: 16px;
}

@media screen and (max-width: 1024px) {
    .lp-navigationSeries {
        padding-bottom: 16px;
        border-bottom: 1px solid #666;
    }
}

.lp-navigationSeries-linkList {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: -8px;
    font-size: 1.2rem;
}

.lp-navigationSeries-linkList &gt; li {
    position: relative;
    margin-top: 8px;
    margin-right: 8px;
    padding-right: 10px;
}

.lp-navigationSeries-linkList &gt; li:last-child {
    margin-right: 0;
    padding-right: 0;
}

.lp-navigationSeries-linkList &gt; li:last-child::before {
    display: none;
}

.lp-navigationSeries-linkList &gt; li::before {
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    width: 1px;
    height: 12px;
    transform: translateY(-50%);
    background: #ccc;
    content: "";
}

.lp-navigationSeries-linkList a {
    color: #ccc;
    text-decoration: none;
}

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

@keyframes scrollLine {
    0% {
        transform: translateY(-100%);
    }
    5% {
        transform: translateY(-100%);
    }
    45% {
        transform: translateY(0);
    }
    55% {
        transform: translateY(0);
    }
    95% {
        transform: translateY(100%);
    }
    100% {
        transform: translateY(100%);
    }
}

@keyframes bounceScrollIcon {
    40% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(10px);
    }
    70% {
        transform: translateY(0);
    }
    80% {
        transform: translateY(10px);
    }
    100% {
        transform: translateY(0);
    }
}

@keyframes fixed {
    0% {
        top: -300px;
    }
    100% {
        top: 0;
    }
}

@keyframes slideInDown {
    0% {
        transform: translate3d(0, -100%, 0);
        opacity: 0;
    }
    to {
        transform: translateZ(0);
        opacity: 1;
    }
}

@keyframes slideInUp {
    0% {
        transform: translateZ(0);
    }
    50% {
        transform: translate3d(0, -100%, 0);
    }
    to {
        position: absolute;
        transform: translate3d(0, 0, 0);
    }
}
</pre></body></html>