/*========================================
  Base
========================================*/
:root {
    --vh: 0 !important;
    --rem: 10px !important;
    --header-h: calc(12.1 * var(--rem));
    --header-h-up: calc(7.1 * var(--rem));
}
@media screen and (max-width:1280px) {
    :root{
        --rem:calc(10vw/1280*100) !important;
    }
}
@media screen and (max-width:767px) {
    :root {
        --rem: calc(10vw/750*100) !important;
        /*
        --header-h: 31.2vw;
        --header-h-up: 16.5333333333vw;
        */
        --header-h: calc(22.0 * var(--rem));
        --header-h-up: calc(12.2 * var(--rem));
    }
}

@media screen and (max-width:767px) {
    .display-pc {
        display: none !important;
    }
}
@media screen and (min-width:768px) {
    .display-sp {
        display: none !important;
    }
}

#main {
    color: #1a1a1a;
    font-feature-settings: "palt";
}
body img {
    height: auto;
}
#wrapper {
    min-width: inherit !important;
    overflow-x: hidden;
}
.mfp-figure:after {
    content: none;
}
.scroll-y-lock {
    overflow: hidden;
}


/*========================================
  Button
========================================*/
.normal-button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 2.0em;
    padding: 0 2.0em;
    background-color: #ffffff;
    width: fit-content;
    height: calc(7.0 * var(--rem));
    line-height: calc(7.0 * var(--rem));
    border-radius: calc(3.5 * var(--rem));
    border: 1.5px solid #717171;
    transition: opacity .5s ease;
}
@media screen and (max-width:767px) {
    .normal-button {
        height: calc(12.0 * var(--rem));
        line-height: calc(12.0 * var(--rem));
        border-radius: calc(6.0 * var(--rem));
    }
}
.normal-button:hover {
    opacity: .7;
}
.normal-button .normal-button-inner {
    font-size: calc(2.0 * var(--rem));
}
@media screen and (max-width:767px) {
    .normal-button .normal-button-inner {
        font-size: calc(3.4 * var(--rem));
    }
}


/*========================================
  KV
========================================*/
#main .kv {
    width: 100%;
    position: relative;
}
#main .kv-container {
    width: 100%;
    position: relative;
}
#main .kv-container .kv-bg-image {
    width: 100%;
    max-width: none;
}
#main .kv-container .kv-title {
    position: absolute;
    inset: 0;
    margin: auto;
    width: 25%;
    height: fit-content;
}
@media screen and (max-width:767px) {
    #main .kv-container .kv-title {
        margin-left: calc(5 * var(--rem));
        width: 34%;
    }
}
#main .kv-container .kv-title-image {
    width: 100%;
}


/*========================================
  Nav
========================================*/
#main .anchor-link-wrapper {
    width: 100%;
}
#main .anchor-link-container {
    width: 100%;
    margin: 0 auto;
    max-width: calc(110 * var(--rem));
    padding: calc(8.7 * var(--rem)) 0;
    z-index: 998;
    transform: translateY(0);
    transition: top .3s cubic-bezier(0.165, 0.84, 0.44, 1), transform .3s cubic-bezier(0.165, 0.84, 0.44, 1);
}
@media screen and (max-width:767px) {
    #main .anchor-link-container {
        max-width: none;
    }
}
#main .anchor-link-container.is-fixed {
    position: fixed;
    left: 0;
    top: var(--header-h);
    max-width: none;
    padding: calc(1.6 * var(--rem)) 0;
    background-color: #ffffff;
    overflow-x: auto;
}
@media screen and (max-width:767px) {
    #main .anchor-link-container.is-fixed {
        padding: calc(2.8 * var(--rem)) 0;
    }
}
#main .anchor-link-container.is-fixed.is-fixed-up {
    top: var(--header-h-up);
}
#main .anchor-link-container.is-hide {
    transform: translateY(-100%);
}
#main .anchor-link-description {
    margin: 0 auto;
    text-align: center;
    font-size: calc(1.6 * var(--rem));
    line-height: 1.8;
}
@media screen and (max-width:767px) {
    #main .anchor-link-description {
        width: calc(65 * var(--rem));
        font-size: calc(3.0 * var(--rem));
        line-height: 1.7;
    }
}
#main .anchor-link-container.is-fixed .anchor-link-description {
    display: none;
}
#main .anchor-link-list {
    width: calc(64.2 * var(--rem));
    margin: calc(5.4 * var(--rem)) auto 0;
    display: flex;
    align-items: stretch;
    justify-content: start;
    flex-wrap: wrap;
    gap: calc(1.8 * var(--rem));
}
@media screen and (max-width:767px) {
    #main .anchor-link-list {
        width: calc(65 * var(--rem));
        gap: calc(2.4 * var(--rem));
    }
}
#main .anchor-link-container.is-fixed .anchor-link-list {
    width: 98%;
    margin: 0 auto;
    gap: calc(1.8 * var(--rem)) 1%;
}
@media screen and (max-width:767px) {
    #main .anchor-link-container.is-fixed .anchor-link-list {
        width: max-content;
        margin: 0 calc(2.4 * var(--rem));
        gap: calc(2.4 * var(--rem));
    }
}
#main .anchor-link-item {
    width: calc(11.4 * var(--rem));
}
@media screen and (max-width:767px) {
    #main .anchor-link-item {
        width: calc(14.45 * var(--rem));
    }
}
#main .anchor-link-container.is-fixed .anchor-link-item {
    width: 9.1%;
}
@media screen and (max-width:767px) {
    #main .anchor-link-container.is-fixed .anchor-link-item {
        width: calc(11.5 * var(--rem));
    }
}
#main .anchor-link-item > .anchor-link {
    display: block;
    width: 100%;
    text-align: center;
    height: calc(8 * var(--rem));
    line-height: calc(8 * var(--rem));
    font-size: calc(2.2 * var(--rem));
}
@media screen and (max-width:767px) {
    #main .anchor-link-item > .anchor-link {
        height: calc(10 * var(--rem));
        line-height: calc(9.6 * var(--rem));
        font-size: calc(3.2 * var(--rem));
    }
}
#main .anchor-link-container.is-fixed .anchor-link-item > .anchor-link {
    height: calc(6 * var(--rem));
    line-height: calc(6 * var(--rem));
}
@media screen and (max-width:767px) {
    #main .anchor-link-container.is-fixed .anchor-link-item > .anchor-link {
        height: calc(8 * var(--rem));
        line-height: calc(7.6 * var(--rem));
    }
}

#main .anchor-link-item.anchor-link-item-active > .anchor-link {
    border: 2px solid #ec6c00;
}
#main .anchor-link-item.anchor-link-item-active > a.anchor-link {
    transition: opacity .5s ease;
    opacity: 1;
}
#main .anchor-link-item.anchor-link-item-active > a.anchor-link:hover {
    opacity: .7;
}
#main .anchor-link-item.anchor-link-item-inactive > .anchor-link {
    background-color: #d1d1d1;
}


/*========================================
  Content
========================================*/
#main .section_normal {
    width: 100%;
    margin: 0 auto;
    max-width: calc(110 * var(--rem));
    background-color: #f2f2f2;
}
@media screen and (max-width:767px) {
    #main .section_normal {
        max-width: none;
    }
}
#main .section_normal .section__heading {
    width: 100%;
    text-align: center;
    background-color: #222222;
    color: #ffffff;
    font-size: calc(2.2 * var(--rem));
    padding: calc(1.6 * var(--rem)) 0;
    line-height: 1;
}
@media screen and (max-width:767px) {
    #main .section_normal .section__heading {
        font-size: calc(3.6 * var(--rem));
        padding: calc(2.8 * var(--rem)) 0;
    }
}
#main .section_normal .list-product {
    width: 92%;
    margin: 0 auto;
    padding: calc(4 * var(--rem)) 0 calc(8 * var(--rem));
    display: flex;
    align-items: stretch;
    justify-content: start;
    flex-wrap: wrap;
    gap: calc(2.0 * var(--rem));
}
@media screen and (max-width:767px) {
    #main .section_normal .list-product {
        width: calc(65 * var(--rem));
        padding: calc(5 * var(--rem)) 0 calc(7 * var(--rem));
        gap: calc(2.0 * var(--rem));
    }
}
#main .section_normal .list-product .list-product__item {
    width: calc(25% - calc(1.5 * var(--rem)));
}
@media screen and (max-width:767px) {
    #main .section_normal .list-product .list-product__item {
        width: calc(50% - calc(1.0 * var(--rem)));
    }
}
#main .section_normal .list-product .list-product__item-inner {
    display: block;
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    text-align: center;
    padding: calc(1.6 * var(--rem)) calc(1.4 * var(--rem)) calc(2.0 * var(--rem));
    display: flex;
    flex-direction: column;
    transition: opacity .5s ease;
}
@media screen and (max-width:767px) {
    #main .section_normal .list-product .list-product__item-inner {
        padding: calc(1.0 * var(--rem)) calc(2.0 * var(--rem)) calc(3.0 * var(--rem));
    }
}
#main .section_normal .list-product .list-product__item-inner:hover {
    opacity: .7;
}
#main .section_normal .list-product .list-product__image {
    width: 100%;
}
#main .section_normal .list-product .list-product__heading {
    margin-top: calc(0.4 * var(--rem));
    margin-bottom: calc(1.2 * var(--rem));
    font-size: calc(1.8 * var(--rem));
    line-height: 1.3;
}
@media screen and (max-width:767px) {
    #main .section_normal .list-product .list-product__heading {
        margin-top: calc(0.8 * var(--rem));
        margin-bottom: calc(2.0 * var(--rem));
        font-size: calc(3.0 * var(--rem));
        line-height: 1.5;
    }
}
#main .section_normal .list-product .list-product__button {
    width: 100%;
    text-align: center;
    font-size: calc(1.4 * var(--rem));
    margin-top: auto;
    padding: calc(1.2 * var(--rem)) 0;
    color: #ffffff;
    background-color: #ec6c00;
    line-height: 1;
    border-radius: 9999px;
}
@media screen and (max-width:767px) {
    #main .section_normal .list-product .list-product__button {
        font-size: calc(2.2 * var(--rem));
        padding: calc(1.88 * var(--rem)) 0;
    }
}

#main #btn-back.normal-button {
    width: calc(44 * var(--rem));
    margin: calc(8 * var(--rem)) auto 0;
} 
@media screen and (max-width:767px) {
    #main #btn-back.normal-button {
        width: calc(65 * var(--rem));
        margin: calc(7 * var(--rem)) auto 0;
    } 
}
#main #btn-back.normal-button:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 3em;
    margin: auto 0;
    display: block;
    width: calc(1.2 * var(--rem));
    height: calc(1.2 * var(--rem));
    border-left: 1.5px solid #000000;
    border-top: 1.5px solid #000000;
    transform: rotate(-45deg);
}
@media screen and (max-width:767px) {
    #main #btn-back.normal-button:before {
        width: calc(1.6 * var(--rem));
        height: calc(1.6 * var(--rem));
    }
}


/*========================================
  Modal
========================================*/
.mfp-auto-cursor .mfp-content {
    width: calc(65 * var(--rem));
}
.mfp-content .ems-combined-use-modal {
    max-height: 90vh;
    display: block;
    margin-left: auto;
    margin-right: auto;
    overflow-y: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
    border-radius: calc(0.6 * var(--rem));
}
@media screen and (max-width:767px) {
    .mfp-content .ems-combined-use-modal {
        max-height: 75vh;
        border-radius: calc(1.6 * var(--rem));
    }
}
.mfp-content .ems-combined-use-modal::-webkit-scrollbar {
    display: none;
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__inner {
    padding: calc(7.2 * var(--rem));
    background-color: #ffffff;
}
@media screen and (max-width:767px){
    .mfp-content .ems-combined-use-modal .ems-combined-use-modal__inner {
        padding: calc(5.6 * var(--rem));
    }
}
.mfp-content .ems-combined-use-modal .mfp-close {
    position: absolute;
    top: calc(-1.8 * var(--rem));
    right: calc(-1.8 * var(--rem));
    font-size: 0;
    width: calc(3.6 * var(--rem));
    height: calc(3.6 * var(--rem));
    border-radius: calc(1.8 * var(--rem));
    background-color: #000000;
    border: 1.5px solid #ffffff;
    transition: opacity .5s ease;
    opacity: 1;
}
@media screen and (max-width:767px) {
    .mfp-content .ems-combined-use-modal .mfp-close {
        top: calc(-2.6 * var(--rem));
        right: calc(-2.6 * var(--rem));
        width: calc(5.2 * var(--rem));
        height: calc(5.2 * var(--rem));
        border-radius: calc(2.6 * var(--rem));
    }
}
.mfp-content .ems-combined-use-modal .mfp-close:hover,
.mfp-content .ems-combined-use-modal .mfp-close:focus {
    opacity: .7;
}
.mfp-content .ems-combined-use-modal .mfp-close:before,
.mfp-content .ems-combined-use-modal .mfp-close:after {
    content: "";
    position: absolute;
    display: block;
    width: 46%;
    height: 2px;
    left: 27%;
    top: calc(50% - 1px);
    background-color: #ffffff;
}
.mfp-content .ems-combined-use-modal .mfp-close:before {
    transform: rotate(45deg);
}
.mfp-content .ems-combined-use-modal .mfp-close:after {
    transform: rotate(-45deg);
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-image {
    width: 100%;
    margin: 0 auto;
    text-align: center;
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-image > img {
    width: 54%;
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-heading {
    width: 100%;
    margin: calc(2.0 * var(--rem)) auto 0;
    text-align: center;
    font-size: calc(2.6 * var(--rem));
    font-weight: 600;
}
@media screen and (max-width:767px) {
    .mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-heading {
        font-size: calc(3.0 * var(--rem));
    }
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-list {
    width: 100%;
    margin: calc(4.0 * var(--rem)) auto 0;
    display: flex;
    flex-direction: column;
    gap: calc(1.8 * var(--rem))
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item {
    width: 100%;
    border-radius: calc(0.8 * var(--rem));
    padding: calc(2.4 * var(--rem)) calc(2.7 * var(--rem));
    display: flex;
    align-items: start;
    justify-content: start;
}
@media screen and (max-width:767px) {
    .mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item {
        border-radius: calc(1.6 * var(--rem));
    }
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item.ems-combined-use-modal__content-item-ok {
    border: calc(0.2 * var(--rem)) solid #ec6c00;
}
@media screen and (max-width:767px) {
    .mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item.ems-combined-use-modal__content-item-ok {
        border: calc(0.3 * var(--rem)) solid #ec6c00;
    }
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item.ems-combined-use-modal__content-item-annotated {
    background-color: #fdf1e6;
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item-icon {
    width: calc(2.8 * var(--rem));
}
@media screen and (max-width:767px) {
    .mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item-icon {
        width: calc(3.0 * var(--rem));
        margin-top: calc(0.5 * var(--rem));
    }
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item.ems-combined-use-modal__content-item-ok .ems-combined-use-modal__content-item-icon {
    height: calc(2.8 * var(--rem));
    border-radius: calc(1.4 * var(--rem));
    border: calc(0.25 * var(--rem)) solid #ec6c00;
}
@media screen and (max-width:767px) {
    .mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item.ems-combined-use-modal__content-item-ok .ems-combined-use-modal__content-item-icon {
        height: calc(3.0 * var(--rem));
        border-radius: calc(1.5 * var(--rem));
        border: calc(0.35 * var(--rem)) solid #ec6c00;
    }
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item.ems-combined-use-modal__content-item-annotated .ems-combined-use-modal__content-item-icon {
    position: relative;
    height: calc(2.4 * var(--rem));
    background: #000000;
    clip-path: polygon(0 100%, 50% 0, 100% 100%);
}
@media screen and (max-width:767px) {
    .mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item.ems-combined-use-modal__content-item-annotated .ems-combined-use-modal__content-item-icon {
        height: calc(2.6 * var(--rem));
        clip-path: polygon(0 100%, 50% 0, 100% 100%);
    }
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item.ems-combined-use-modal__content-item-annotated .ems-combined-use-modal__content-item-icon:before {
    content: "";
    display: block;
    position: absolute;
    width: calc(2.1 * var(--rem));
    height: calc(1.8 * var(--rem));
    background: #fdf1e6;
    clip-path: polygon(0 100%, 50% 0, 100% 100%);
    bottom: calc(0.2 * var(--rem));
    left: 50%;
    transform: translateX(-50%);
}
@media screen and (max-width:767px) {
    .mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item.ems-combined-use-modal__content-item-annotated .ems-combined-use-modal__content-item-icon:before {
        width: calc(1.96 * var(--rem));
        height: calc(1.7 * var(--rem));
        bottom: calc(0.3 * var(--rem));
    }
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item-info {
    width: calc(100% - calc(2.8 * var(--rem)));
    padding-left: calc(2.7 * var(--rem));
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item-name {
    font-size: calc(2.2 * var(--rem));
    line-height: 1.3;
}
@media screen and (max-width:767px) {
    .mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item-name {
        font-size: calc(3.2 * var(--rem));
    }
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item-notice {
    font-size: calc(1.8 * var(--rem));
}
@media screen and (max-width:767px) {
    .mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item-notice {
        font-size: calc(2.6 * var(--rem));
    }
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item-notice:has(> p) {
    padding-top: calc(0.6 * var(--rem));
}
.mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item-notice > p {
    font-size: calc(1.8 * var(--rem));
}
@media screen and (max-width:767px) {
    .mfp-content .ems-combined-use-modal .ems-combined-use-modal__content-item-notice > p {
        font-size: calc(2.6 * var(--rem));
    }
}