@charset "utf-8";

/* CSS Document */

/*===================================
基本設定
===================================*/

/* html */

html {
    font-family: "YuMincho", "Yu Mincho", "游明朝体", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", serif;
    color: #333;
}

dt,
dd {
    font-weight: normal;
}

.tel a:before {
    content: "\f879";
    display: inline-block;
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
    font-size: 90%;
}

.dot {
    margin-left: -3px;
    letter-spacing: -2px;
}



/* main-wrap */

.main-wrap {
    overflow: hidden;
    position: relative;
    z-index: 1;
}



/* inner */

@media (max-width: 1024px) {
    .inner500,
    .inner600,
    .inner700,
    .inner800,
    .inner900,
    .inner,
    .inner1100,
    .inner1200,
    .inner1300,
    .inner1400,
    .inner1500 {
        width: 94%;
    }
}



/* font */

.font-w-600 {
    font-weight: 600;
}

[class*="icon-"] a {
    display: inline-block;
}

[class*="icon-"] a:after {
    display: block;
    font-family: "font awesome 5 brands";
    font-weight: bold;
}

.icon-fb a:after {
    content: "\f082";
}

.icon-insta a:after {
    content: "\e055";
}



/* show hide */

.show\@pc {
    display: block;
}

.hide\@pc {
    display: none;
}

[data-element-id] .show\@tb {
    display: block;
    border: solid 4px green;
    position: relative;
}

[data-element-id] .show\@tb:after {
    content: "モバイル用です。";
    display: block;
    padding: 5px;
    font-weight: 700;
    color: #fff;
    text-align: center;
    background: green;
}

[data-element-id] .show\@sp {
    display: block;
    border: solid 4px green;
    position: relative;
}

[data-element-id] .show\@sp:after {
    content: "モバイル用です。";
    display: block;
    padding: 5px;
    font-weight: 700;
    color: #fff;
    text-align: center;
    background: green;
}

@media (max-width: 1024px) {
    .show\@tb {
        display: block;
    }

    .hide\@tb {
        display: none;
    }
}

@media (max-width: 599px) {
    .show\@sp {
        display: block;
    }

    .hide\@sp {
        display: none;
    }
}



/* fead */

.fead-mv.mv {
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.fead-up.mv {
    -webkit-transition-delay: 0.3s;
    transition-delay: 0.3s;
}

.fead-cover {
    position: relative;
    /* z-index: 0; */
}

[data-element-id] .fead-cover:before {
    display: none;
}

.fead-cover:before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    background: #020709;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
}

.fead-cover.mv:before {
    width: 0;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    -webkit-transition-delay: 0.9s;
    transition-delay: 0.9s;
}



/* loading */

.loading {
    width: 100%;
    height: 100%;
    overflow: hidden;
    -webkit-transition: 1s;
    transition: 1s;
    position: relative;
    z-index: 500;
}

.loading:before,
.loading:after {
    content: "";
    width: 50%;
    height: 200%;
    display: block;
    background: #000;
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    position: fixed;
    top: -50%;
    z-index: 2;
}

.loading:before {
    left: 0;
}

.loading:after {
    right: 0;
}

.loading.loaded:before {
    -webkit-animation: loading1 4s 0.3s forwards;
    animation: loading1 4s 0.3s forwards;
}

.loading.loaded:after {
    -webkit-animation: loading2 4s 0.3s forwards;
    animation: loading2 4s 0.3s forwards;
}

.loading-scissor {
    width: 30px;
    margin-left: -15px;
    opacity: 0;
    position: fixed;
    top: -30px;
    left: 50%;
    z-index: 3;
}

.loading.loaded .loading-scissor {
    -webkit-animation: loading-scissor 4s;
    animation: loading-scissor 4s;
}

[data-element-id] .loading:before,
[data-element-id] .loading:after {
    display: none;
}

@-webkit-keyframes loading1 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }

    20% {
        -webkit-transform: rotate(-1deg);
        transform: rotate(-1deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }

    21% {
        -webkit-transform: rotate(-1deg);
        transform: rotate(-1deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }

    100% {
        -webkit-transform: rotate(-15deg) translateX(-160%);
        transform: rotate(-15deg) translateX(-160%);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }
}

@keyframes loading1 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }

    20% {
        -webkit-transform: rotate(-1deg);
        transform: rotate(-1deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }

    21% {
        -webkit-transform: rotate(-1deg);
        transform: rotate(-1deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }

    100% {
        -webkit-transform: rotate(-15deg) translateX(-160%);
        transform: rotate(-15deg) translateX(-160%);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }
}

@-webkit-keyframes loading2 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }

    20% {
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }

    21% {
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }

    100% {
        -webkit-transform: rotate(15deg) translateX(160%);
        transform: rotate(15deg) translateX(160%);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }
}

@keyframes loading2 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }

    20% {
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }

    21% {
        -webkit-transform: rotate(1deg);
        transform: rotate(1deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }

    100% {
        -webkit-transform: rotate(15deg) translateX(160%);
        transform: rotate(15deg) translateX(160%);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }
}

@-webkit-keyframes loading-scissor {
    0% {
        opacity: 0;
        top: -60px;
    }

    7% {
        opacity: 1;
        top: -60px;
    }

    47% {
        opacity: 1;
        top: 130%;
    }

    100% {
        opacity: 1;
        top: 130%;
    }
}

@keyframes loading-scissor {
    0% {
        opacity: 0;
        top: -60px;
    }

    7% {
        opacity: 1;
        top: -60px;
    }

    47% {
        opacity: 1;
        top: 130%;
    }

    100% {
        opacity: 1;
        top: 130%;
    }
}



/* 画像 */

.img {
    text-align: center;
}

.pic img {
    width: 100%;
}

[class*="up-ofi"] {
    height: 100%;
}



/* color */

.color-black {
    color: #000;
}

.color-white {
    color: #fff;
}



/*背景カラー*/

.bg-black {
    background-color: #000;
}

.bg-white {
    background-color: #fff;
}

.bg-white-thin {
    background: rgba(255, 255, 255, 0.8);
}

.bg-gray {
    background-color: #f9f9f9;
}

.bg-gray-paper {
    background-image: url(/import/tenant_1/160.16.117.87/html/images/common/clean-gray-paper.png);
    background-color: #f5f5f5;
}



/* parallax */

[data-element-id] .parallax {
    height: 50vh;
    position: static;
}

.parallax {
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 0;
}

[data-element-id] .parallax-view {
    background: #999;
}

.parallax-view {
    height: 25vh;
    background: rgba(255, 255, 255, 0.4);
}

.parallax video,
.parallax img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    font-family: "object-fit: cover; object-position: 50% 50%;";
}

@media (max-width: 599px) {
    .parallax video,
    .parallax img {
        -o-object-position: 37% 50%;
        object-position: 37% 50%;
    }
}



/* 共通コンテンツ間隔 */

[class*="section-m"],
[class*="section-p"] {
    --section-xlarge: 150px;
    --section-large: 120px;
    --section-medium: 100px;
    --section-small: 80px;
    --section-xsmall: 60px;
}

.section-my-xlarge {
    margin-top: var(--section-xlarge);
    margin-bottom: var(--section-xlarge);
}

.section-mt-xlarge {
    margin-top: var(--section-xlarge);
}

.section-mb-xlarge {
    margin-bottom: var(--section-xlarge);
}

.section-my-large {
    margin-top: var(--section-large);
    margin-bottom: var(--section-large);
}

.section-mt-large {
    margin-top: var(--section-large);
}

.section-mb-large {
    margin-bottom: var(--section-large);
}

.section-my-medium {
    margin-top: var(--section-medium);
    margin-bottom: var(--section-medium);
}

.section-mt-medium {
    margin-top: var(--section-medium);
}

.section-mb-medium {
    margin-bottom: var(--section-medium);
}

.section-my-small {
    margin-top: var(--section-small);
    margin-bottom: var(--section-small);
}

.section-mt-small {
    margin-top: var(--section-small);
}

.section-mb-small {
    margin-bottom: var(--section-small);
}

.section-my-xsmall {
    margin-top: var(--section-xsmall);
    margin-bottom: var(--section-xsmall);
}

.section-mt-xsmall {
    margin-top: var(--section-xsmall);
}

.section-mb-xsmall {
    margin-bottom: var(--section-xsmall);
}

@media (max-width: 1024px) {
    .section-my-xlarge {
        margin-top: calc(var(--section-xlarge) * 0.8);
        margin-bottom: calc(var(--section-xlarge) * 0.8);
    }

    .section-mt-xlarge {
        margin-top: calc(var(--section-xlarge) * 0.8);
    }

    .section-mb-xlarge {
        margin-bottom: calc(var(--section-xlarge) * 0.8);
    }

    .section-my-large {
        margin-top: calc(var(--section-large) * 0.8);
        margin-bottom: calc(var(--section-large) * 0.8);
    }

    .section-mt-large {
        margin-top: calc(var(--section-large) * 0.8);
    }

    .section-mb-large {
        margin-bottom: calc(var(--section-large) * 0.8);
    }

    .section-my-medium {
        margin-top: calc(var(--section-medium) * 0.8);
        margin-bottom: calc(var(--section-medium) * 0.8);
    }

    .section-mt-medium {
        margin-top: calc(var(--section-medium) * 0.8);
    }

    .section-mb-medium {
        margin-bottom: calc(var(--section-medium) * 0.8);
    }

    .section-my-small {
        margin-top: calc(var(--section-small) * 0.8);
        margin-bottom: calc(var(--section-small) * 0.8);
    }

    .section-mt-small {
        margin-top: calc(var(--section-small) * 0.8);
    }

    .section-mb-small {
        margin-bottom: calc(var(--section-small) * 0.8);
    }

    .section-my-xsmall {
        margin-top: calc(var(--section-xsmall) * 0.8);
        margin-bottom: calc(var(--section-xsmall) * 0.8);
    }

    .section-mt-xsmall {
        margin-top: calc(var(--section-xsmall) * 0.8);
    }

    .section-mb-xsmall {
        margin-bottom: calc(var(--section-xsmall) * 0.8);
    }
}

@media (max-width: 599px) {
    .section-my-xlarge {
        margin-top: calc(var(--section-xlarge) * 0.6);
        margin-bottom: calc(var(--section-xlarge) * 0.6);
    }

    .section-mt-xlarge {
        margin-top: calc(var(--section-xlarge) * 0.6);
    }

    .section-mb-xlarge {
        margin-bottom: calc(var(--section-xlarge) * 0.6);
    }

    .section-my-large {
        margin-top: calc(var(--section-large) * 0.6);
        margin-bottom: calc(var(--section-large) * 0.6);
    }

    .section-mt-large {
        margin-top: calc(var(--section-large) * 0.6);
    }

    .section-mb-large {
        margin-bottom: calc(var(--section-large) * 0.6);
    }

    .section-my-medium {
        margin-top: calc(var(--section-medium) * 0.6);
        margin-bottom: calc(var(--section-medium) * 0.6);
    }

    .section-mt-medium {
        margin-top: calc(var(--section-medium) * 0.6);
    }

    .section-mb-medium {
        margin-bottom: calc(var(--section-medium) * 0.6);
    }

    .section-my-small {
        margin-top: calc(var(--section-small) * 0.6);
        margin-bottom: calc(var(--section-small) * 0.6);
    }

    .section-mt-small {
        margin-top: calc(var(--section-small) * 0.6);
    }

    .section-mb-small {
        margin-bottom: calc(var(--section-small) * 0.6);
    }

    .section-my-xsmall {
        margin-top: calc(var(--section-xsmall) * 0.6);
        margin-bottom: calc(var(--section-xsmall) * 0.6);
    }

    .section-mt-xsmall {
        margin-top: calc(var(--section-xsmall) * 0.6);
    }

    .section-mb-xsmall {
        margin-bottom: calc(var(--section-xsmall) * 0.6);
    }
}

.section-py-xlarge {
    padding-top: var(--section-xlarge);
    padding-bottom: var(--section-xlarge);
}

.section-pt-xlarge {
    padding-top: var(--section-xlarge);
}

.section-pb-xlarge {
    padding-bottom: var(--section-xlarge);
}

.section-py-large {
    padding-top: var(--section-large);
    padding-bottom: var(--section-large);
}

.section-pt-large {
    padding-top: var(--section-large);
}

.section-pb-large {
    padding-bottom: var(--section-large);
}

.section-py-medium {
    padding-top: var(--section-medium);
    padding-bottom: var(--section-medium);
}

.section-pt-medium {
    padding-top: var(--section-medium);
}

.section-pb-medium {
    padding-bottom: var(--section-medium);
}

.section-py-small {
    padding-top: var(--section-small);
    padding-bottom: var(--section-small);
}

.section-pt-small {
    padding-top: var(--section-small);
}

.section-pb-small {
    padding-bottom: var(--section-small);
}

.section-py-xsmall {
    padding-top: var(--section-xsmall);
    padding-bottom: var(--section-xsmall);
}

.section-pt-xsmall {
    padding-top: var(--section-xsmall);
}

.section-pb-xsmall {
    padding-bottom: var(--section-xsmall);
}

@media (max-width: 1024px) {
    .section-py-xlarge {
        padding-top: calc(var(--section-xlarge) * 0.8);
        padding-bottom: calc(var(--section-xlarge) * 0.8);
    }

    .section-pt-xlarge {
        padding-top: calc(var(--section-xlarge) * 0.8);
    }

    .section-pb-xlarge {
        padding-bottom: calc(var(--section-xlarge) * 0.8);
    }

    .section-py-large {
        padding-top: calc(var(--section-large) * 0.8);
        padding-bottom: calc(var(--section-large) * 0.8);
    }

    .section-pt-large {
        padding-top: calc(var(--section-large) * 0.8);
    }

    .section-pb-large {
        padding-bottom: calc(var(--section-large) * 0.8);
    }

    .section-py-medium {
        padding-top: calc(var(--section-medium) * 0.8);
        padding-bottom: calc(var(--section-medium) * 0.8);
    }

    .section-pt-medium {
        padding-top: calc(var(--section-medium) * 0.8);
    }

    .section-pb-medium {
        padding-bottom: calc(var(--section-medium) * 0.8);
    }

    .section-py-small {
        padding-top: calc(var(--section-small) * 0.8);
        padding-bottom: calc(var(--section-small) * 0.8);
    }

    .section-pt-small {
        padding-top: calc(var(--section-small) * 0.8);
    }

    .section-pb-small {
        padding-bottom: calc(var(--section-small) * 0.8);
    }

    .section-py-xsmall {
        padding-top: calc(var(--section-xsmall) * 0.8);
        padding-bottom: calc(var(--section-xsmall) * 0.8);
    }

    .section-pt-xsmall {
        padding-top: calc(var(--section-xsmall) * 0.8);
    }

    .section-pb-xsmall {
        padding-bottom: calc(var(--section-xsmall) * 0.8);
    }
}

@media (max-width: 599px) {
    .section-py-xlarge {
        padding-top: calc(var(--section-xlarge) * 0.6);
        padding-bottom: calc(var(--section-xlarge) * 0.6);
    }

    .section-pt-xlarge {
        padding-top: calc(var(--section-xlarge) * 0.6);
    }

    .section-pb-xlarge {
        padding-bottom: calc(var(--section-xlarge) * 0.6);
    }

    .section-py-large {
        padding-top: calc(var(--section-large) * 0.6);
        padding-bottom: calc(var(--section-large) * 0.6);
    }

    .section-pt-large {
        padding-top: calc(var(--section-large) * 0.6);
    }

    .section-pb-large {
        padding-bottom: calc(var(--section-large) * 0.6);
    }

    .section-py-medium {
        padding-top: calc(var(--section-medium) * 0.6);
        padding-bottom: calc(var(--section-medium) * 0.6);
    }

    .section-pt-medium {
        padding-top: calc(var(--section-medium) * 0.6);
    }

    .section-pb-medium {
        padding-bottom: calc(var(--section-medium) * 0.6);
    }

    .section-py-small {
        padding-top: calc(var(--section-small) * 0.6);
        padding-bottom: calc(var(--section-small) * 0.6);
    }

    .section-pt-small {
        padding-top: calc(var(--section-small) * 0.6);
    }

    .section-pb-small {
        padding-bottom: calc(var(--section-small) * 0.6);
    }

    .section-py-xsmall {
        padding-top: calc(var(--section-xsmall) * 0.6);
        padding-bottom: calc(var(--section-xsmall) * 0.6);
    }

    .section-pt-xsmall {
        padding-top: calc(var(--section-xsmall) * 0.6);
    }

    .section-pb-xsmall {
        padding-bottom: calc(var(--section-xsmall) * 0.6);
    }
}



/*===================================
共通タイトル
===================================*/

[class*="hd-"] {
    --hd-fz-xlarge: 44px;
    --hd-fz-large: 40px;
    --hd-fz-medium: 36px;
    --hd-fz-small: 32px;
    --hd-fz-xsmall: 28px;
    --hd-fz-xxsmall: 24px;
    --hd-mb-xlarge: 70px;
    --hd-mb-large: 60px;
    --hd-mb-medium: 50px;
    --hd-mb-small: 40px;
    --hd-mb-xsmall: 30px;
}

/* hd-pri */

.hd-pri {
    margin-bottom: var(--hd-mb-medium);
    text-align: center;
}

.hd-pri>* {
    display: block;
}

.hd-pri .lead {
    font-size: var(--hd-fz-medium);
    letter-spacing: 3px;
}

.hd-pri .sub {
    margin-top: 10px;
    font-weight: 600;
    font-size: 18px;
}

@media (max-width: 1024px) {
    .hd-pri {
        margin-bottom: calc(var(--hd-mb-medium) * 0.8);
    }

    .hd-pri .lead {
        font-size: calc(var(--hd-fz-medium) * 0.9);
    }
}

@media (max-width: 599px) {
    .hd-pri {
        margin-bottom: calc(var(--hd-mb-medium) * 0.6);
    }

    .hd-pri .lead {
        font-size: calc(var(--hd-fz-medium) * 0.8);
    }

    .hd-pri .sub {
        font-size: 16px;
    }
}



/* hd-sec */

.hd-sec {
    margin-bottom: var(--hd-mb-medium);
}

.hd-sec>* {
    display: block;
}

.hd-sec .lead {
    padding-left: 30px;
    font-size: var(--hd-fz-medium);
    letter-spacing: 3px;
    position: relative;
}

.hd-sec .lead:before {
    content: "";
    width: 20px;
    height: 2px;
    display: block;
    margin-top: -1px;
    background: #000;
    position: absolute;
    top: 0.75em;
    left: 0;
}

.hd-sec .sub {
    margin-top: 10px;
    padding-left: 30px;
    font-size: 16px;
}

@media (max-width: 1024px) {
    .hd-sec {
        margin-bottom: calc(var(--hd-mb-medium) * 0.8);
    }

    .hd-sec .lead {
        font-size: calc(var(--hd-fz-medium) * 0.9);
    }
}

@media (max-width: 599px) {
    .hd-sec {
        margin-bottom: calc(var(--hd-mb-medium) * 0.6);
    }

    .hd-sec .lead {
        font-size: calc(var(--hd-fz-medium) * 0.8);
    }

    .hd-sec .sub {
        font-size: 16px;
    }
}



.hd-fz-xlarge>.lead {
    font-size: var(--hd-fz-xlarge);
}

.hd-fz-large>.lead {
    font-size: var(--hd-fz-large);
}

.hd-fz-medium>.lead {
    font-size: var(--hd-fz-medium);
}

.hd-fz-small>.lead {
    font-size: var(--hd-fz-small);
}

.hd-fz-xsmall>.lead {
    font-size: var(--hd-fz-xsmall);
}

.hd-fz-xxsmall>.lead {
    font-size: var(--hd-fz-xxsmall);
}

@media (max-width: 1024px) {
    .hd-fz-xlarge>.lead {
        font-size: calc(var(--hd-fz-xlarge) * 0.9);
    }

    .hd-fz-large>.lead {
        font-size: calc(var(--hd-fz-large) * 0.9);
    }

    .hd-fz-medium>.lead {
        font-size: calc(var(--hd-fz-medium) * 0.9);
    }

    .hd-fz-small>.lead {
        font-size: calc(var(--hd-fz-small) * 0.9);
    }

    .hd-fz-xsmall>.lead {
        font-size: calc(var(--hd-fz-xsmall) * 0.9);
    }

    .hd-fz-xxsmall>.lead {
        font-size: calc(var(--hd-fz-xxsmall) * 0.9);
    }
}

@media (max-width: 599px) {
    .hd-fz-xlarge>.lead {
        font-size: calc(var(--hd-fz-xlarge) * 0.8);
    }

    .hd-fz-large>.lead {
        font-size: calc(var(--hd-fz-large) * 0.8);
    }

    .hd-fz-medium>.lead {
        font-size: calc(var(--hd-fz-medium) * 0.8);
    }

    .hd-fz-small>.lead {
        font-size: calc(var(--hd-fz-small) * 0.8);
    }

    .hd-fz-xsmall>.lead {
        font-size: calc(var(--hd-fz-xsmall) * 0.8);
    }

    .hd-fz-xxsmall>.lead {
        font-size: calc(var(--hd-fz-xxsmall) * 0.8);
    }
}

.hd-mb-xlarge {
    margin-bottom: var(--hd-mb-xlarge);
}

.hd-mb-large {
    margin-bottom: var(--hd-mb-large);
}

.hd-mb-medium {
    margin-bottom: var(--hd-mb-medium);
}

.hd-mb-small {
    margin-bottom: var(--hd-mb-small);
}

.hd-mb-xsmall {
    margin-bottom: var(--hd-mb-xsmall);
}

.hd-mb-none {
    margin-bottom: 0;
}

@media (max-width: 1024px) {
    .hd-mb-xlarge {
        margin-bottom: calc(var(--hd-mb-xlarge) * 0.8);
    }

    .hd-mb-large {
        margin-bottom: calc(var(--hd-mb-large) * 0.8);
    }

    .hd-mb-medium {
        margin-bottom: calc(var(--hd-mb-medium) * 0.8);
    }

    .hd-mb-small {
        margin-bottom: calc(var(--hd-mb-small) * 0.8);
    }

    .hd-mb-xsmall {
        margin-bottom: calc(var(--hd-mb-xsmall) * 0.8);
    }

    .hd-mb-none {
        margin-bottom: 0;
    }
}

@media (max-width: 599px) {
    .hd-mb-xlarge {
        margin-bottom: calc(var(--hd-mb-xlarge) * 0.6);
    }

    .hd-mb-large {
        margin-bottom: calc(var(--hd-mb-large) * 0.6);
    }

    .hd-mb-medium {
        margin-bottom: calc(var(--hd-mb-medium) * 0.6);
    }

    .hd-mb-small {
        margin-bottom: calc(var(--hd-mb-small) * 0.6);
    }

    .hd-mb-xsmall {
        margin-bottom: calc(var(--hd-mb-xsmall) * 0.6);
    }

    .hd-mb-none {
        margin-bottom: 0;
    }
}

.hd-left {
    text-align: left;
}

.hd-center {
    text-align: center;
}

.hd-right {
    text-align: right;
}



/*===================================
共通ボタン
===================================*/

[class*="btn-"] {
    --btn-mt-xlarge: 70px;
    --btn-mt-large: 60px;
    --btn-mt-medium: 50px;
    --btn-mt-small: 40px;
    --btn-mt-xsmall: 30px;
}

/* btn-pri */

.btn-pri {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: var(--btn-mt-medium);
}

.btn-pri>* {
    width: 220px;
    max-width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: hidden;
    padding: 10px;
    color: #fff;
    text-align: center;
    border: solid 2px #000;
    border-radius: 10px;
    background: #000;
    position: relative;
    z-index: 1;
}

.btn-pri>*:hover {
    letter-spacing: 3px;
    background: #fff;
    opacity: 1;
}

.btn-pri>*:after {
    content: "\f30b";
    display: block;
    margin-left: 10px;
    font-family: "font awesome 5 free";
    font-weight: bold;
    -webkit-transition: -webkit-transform 0.4s;
    transition: -webkit-transform 0.4s;
    transition: transform 0.4s;
    transition: transform 0.4s, -webkit-transform 0.4s;
}

.btn-pri>*:hover:after {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
}

.btn-pri-noArrow>*:after {
    display: none;
}

.btn-pri-reverse>* {
    color: #000;
    border-color: #000;
    background: #fff;
}

.btn-pri-reverse>*:hover {
    color: #fff;
    background: #000;
}

.btn-pri-web>* {
    border-color: #9f1547;
    background: #9f1547;
}

.btn-pri-web>*:before {
    content: "\f073";
    display: block;
    margin-right: 10px;
    font-family: "font awesome 5 free";
    font-weight: bold;
    -webkit-transition: -webkit-transform 0.4s;
    transition: -webkit-transform 0.4s;
    transition: transform 0.4s;
    transition: transform 0.4s, -webkit-transform 0.4s;
}

.btn-pri-web>*:after {
    display: none;
}

.btn-pri-tel>* {
    color: #000;
    background: none;
}

.btn-pri-tel>*:after {
    display: none;
}

.btn-back>*:after {
    display: none;
}

.btn-back>*:before {
    content: "\f30a";
    display: block;
    margin-right: 10px;
    font-family: "font awesome 5 free";
    font-weight: bold;
    -webkit-transition: -webkit-transform 0.4s;
    transition: -webkit-transform 0.4s;
    transition: transform 0.4s;
    transition: transform 0.4s, -webkit-transform 0.4s;
}

.btn-back>*:hover:before {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
}

@media (max-width: 1024px) {
    .btn-pri {
        margin-top: calc(var(--btn-mt-medium) * 0.8);
    }
}

@media (max-width: 599px) {
    .btn-pri {
        margin-top: calc(var(--btn-mt-medium) * 0.6);
    }
}



/* btn-sec */

.btn-sec {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: var(--btn-mt-medium);
}

.btn-sec>* {
    display: inline-block;
    padding: 0 40px 5px 5px;
    color: #000;
    border-bottom: solid 2px;
    position: relative;
}

.btn-sec>*:before {
    content: "\f30b";
    display: block;
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
    opacity: 0;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    position: absolute;
    top: 2px;
    right: 10px;
}

.btn-sec>*:hover:before {
    opacity: 1;
    right: 5px;
}

@media (max-width: 1024px) {
    .btn-sec {
        margin-top: calc(var(--btn-mt-medium) * 0.8);
    }
}

@media (max-width: 599px) {
    .btn-sec {
        margin-top: calc(var(--btn-mt-medium) * 0.6);
    }
}



/* 共通ボタン上書き */

.btn-mt-xlarge {
    margin-top: var(--btn-mt-xlarge);
}

.btn-mt-large {
    margin-top: var(--btn-mt-large);
}

.btn-mt-medium {
    margin-top: var(--btn-mt-medium);
}

.btn-mt-small {
    margin-top: var(--btn-mt-xsmall);
}

.btn-mt-xsmall {
    margin-top: var(--btn-mt-xsmall);
}

.btn-mt-none {
    margin-top: 0;
}

@media (max-width: 1024px) {
    .btn-mt-xlarge {
        margin-top: calc(var(--btn-mt-xlarge) * 0.8);
    }

    .btn-mt-large {
        margin-top: calc(var(--btn-mt-large) * 0.8);
    }

    .btn-mt-medium {
        margin-top: calc(var(--btn-mt-medium) * 0.8);
    }

    .btn-mt-small {
        margin-top: calc(var(--btn-mt-small) * 0.8);
    }

    .btn-mt-xsmall {
        margin-top: calc(var(--btn-mt-xsmall) * 0.8);
    }

    .btn-mt-none {
        margin-top: 0;
    }
}

@media (max-width: 599px) {
    .btn-mt-xlarge {
        margin-top: calc(var(--btn-mt-xlarge) * 0.6);
    }

    .btn-mt-large {
        margin-top: calc(var(--btn-mt-large) * 0.6);
    }

    .btn-mt-medium {
        margin-top: calc(var(--btn-mt-medium) * 0.6);
    }

    .btn-mt-small {
        margin-top: calc(var(--btn-mt-small) * 0.6);
    }

    .btn-mt-xsmall {
        margin-top: calc(var(--btn-mt-xsmall) * 0.6);
    }

    .btn-mt-none {
        margin-top: 0;
    }
}

.btn-w-full>* {
    width: 100%;
}

.btn-w-xlarge>* {
    width: 350px;
}

.btn-w-xlarge>* {
    width: 300px;
}

.btn-w-medium>* {
    width: 250px;
}

.btn-w-small>* {
    width: 200px;
}

.btn-w-xsmall>* {
    width: 150px;
}

.btn-left {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.btn-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.btn-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}



/*===================================
共通ブロック
==================================*/

/* tabWrap */

[data-element-id] .tabWrap .tabItem {
    display: block;
    counter-increment: tab;
    margin-bottom: 30px;
    border: solid 5px blue;
}

[data-element-id] .tabWrap .tabItem:before {
    content: counter(tab)"個目のタブ";
    display: block;
    margin-bottom: 10px;
    font-weight: bold;
    font-size: 16px;
    color: #fff;
    text-align: center;
    background: blue;
}

.tabWrap .tabItem {
    display: none;
}

.tabWrap .tabItem.active {
    display: block;
}



/* txt-type-01 */

.txt-type-01 {
    line-height: 2;
    text-align: center;
}

@media (max-width: 599px) {
    .txt-type-01 {
        text-align: left;
    }
}

.txt-type-02 {
    line-height: 2;
}



/* block-type-01 */

.block-type-01 {
    overflow: hidden;
    background: #000;
    position: relative;
}

.block-type-01 .inner {
    position: relative;
    z-index: 5;
}

.block-type-01 .inner>* {
    color: #fff;
}

.block-type-01 .pic {
    width: 100%;
    height: 100%;
    opacity: 0.4;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
}
[data-element-id] .block-type-01 .pic {
  height: auto;
  position: static;
  opacity: 1;
}

[data-element-id] .block-type-01 .pic .up-d-none {
  display: block;
  position: relative;
  width: 400px;
  margin: 30px auto 0;
}

[data-element-id] .block-type-01 .pic .up-d-none:before {
  content: "SP用画像";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  color: #fff;
  background: #999;
  text-align: center;
  transform: traslate(0, -100%);
}



/* block-type-02 */

.block-type-02 .item {
    padding-top: 20px;
}

.block-type-02 .item:not(:last-of-type) {
    margin-bottom: 80px;
}

.block-type-02 .item .left {
    width: 40%;
}

.block-type-02 .item .left .pic {
    position: relative;
}

.block-type-02 .item .left .label {
    font-weight: 600;
    font-size: 36px;
    color: #c33;
    letter-spacing: 3px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    top: 0;
    left: 10px;
    z-index: 5;
}

.block-type-02 .item .left .label .num {
    margin-left: 5px;
    font-size: 140%;
}

.block-type-02 .item .right {
    width: 55%;
}

.block-type-02 .item .right .tit {
    margin-bottom: 30px;
    font-weight: 600;
    font-size: 24px;
}

@media (max-width: 1024px) {
    .block-type-02 .item:not(:last-of-type) {
        margin-bottom: 60px;
    }
}

@media (max-width: 599px) {
    .block-type-02 .item:not(:last-of-type) {
        margin-bottom: 40px;
    }
    
    .block-type-02 .item .left {
        width: 100%;
    }
    
    .block-type-02 .item .right {
        width: 100%;
        margin-top: 30px;
    }
}



/* block-type-03 */

.block-type-03 .item {
    padding-top: 30px;
    position: relative;
}

.block-type-03 .item .pic .label {
    font-weight: 600;
    font-size: 36px;
    color: #747474;
    letter-spacing: 3px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    top: 0;
    left: 10px;
    z-index: 5;
}

.block-type-03 .item .pic .label .num {
    font-size: 140%;
}

.block-type-03 .item .tit {
    margin-top: 20px;
    font-weight: 600;
    font-size: 20px;
}

.block-type-03 .item .txt {
    margin-top: 20px;
}

@media (max-width: 599px) {
    .block-type-03 .item .tit {
        font-size: 18px;
    }
}



/* list-type-01 */

.list-type-01 li {
    padding-left: 1.5em;
    text-align: left;
    position: relative;
}

.list-type-01 li:not(:last-of-type) {
    margin-bottom: 20px;
}

.list-type-01 li:before {
    content: "\f058";
    display: block;
    font-family: "Font Awesome 5 Free";
    position: absolute;
    top: 0;
    left: 0;
}



/* list-type-02 */

.list-type-02 dl:not(:last-of-type) {
    margin-bottom: 30px;
}

.list-type-02 dt {
    width: 150px;
    font-weight: 600;
}

.list-type-02 dd {
    width: calc(100% - 150px);
}

.list-type-02-short dt {
    width: 100px;
}

.list-type-02-short dd {
    width: calc(100% - 100px);
}

@media (max-width: 599px) {
    .list-type-02 dt {
        width: 100%;
        margin-bottom: 5px;
    }

    .list-type-02 dd {
        width: 100%;
    }
}



/* list-type-03 */

.list-type-03 dt {
    width: 90px;
    font-weight: 600;
    position: relative;
}

.list-type-03 dt:after {
    content: "";
    width: 11px;
    height: 11px;
    display: block;
    border: 2px solid;
    border-radius: 100%;
    background-color: #fff;
    -webkit-transform: translate(50%, -50%);
    transform: translate(50%, -50%);
    position: absolute;
    top: 50%;
    right: 0;
}

.list-type-03 dd {
    width: calc(100% - 90px);
    padding-left: 50px;
    border-left: solid 1px;
}

.list-type-03 dl:not(:last-of-type) dd {
    padding-bottom: 30px;
}



/* list-type-04 */

.list-type-04 dl:not(:last-of-type) {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: solid 1px;
}

.list-type-04 dt {
    width: 150px;
    font-weight: 600;
}

.list-type-04 dd {
    width: calc(100% - 150px);
}

.list-type-04-short dt {
    width: 100px;
}

.list-type-04-short dd {
    width: calc(100% - 100px);
}

@media (max-width: 599px) {
    .list-type-04 dt {
        width: 100%;
        margin-bottom: 5px;
    }

    .list-type-04 dd {
        width: 100%;
    }
}



/* list-type-05 */

.list-type-05 dl:not(:last-of-type) {
    margin-bottom: 30px;
}

.list-type-05 dt {
    margin-bottom: 10px;
    padding-bottom: 10px;
    font-weight: 600;
    font-size: 18px;
    border-bottom: solid 1px;
}



/* list-type-06 */

.list-type-06 dl:not(:last-of-type) {
    margin-bottom: 30px;
}

.list-type-06 dt {
    margin-bottom: 15px;
    font-weight: 600;
    font-size: 18px;
}

.list-type-06 dt:after {
    content: "";
    width: 50px;
    height: 2px;
    display: block;
    margin-top: 5px;
    background: #000;
}



/*===================================
共通要素
===================================*/

/* header */

[data-element-id] #header {
    background: #888;
    position: static;
}

#header {
    width: 100%;
    padding: 10px 20px;
    -webkit-transition: 0.3s;
    transition: 0.3s;
    position: fixed;
    z-index: 150;
}

#header.fixed {
    background: rgba(0, 0, 0, 0.4);
}

#header h1 {
    margin-bottom: 10px;
    font-size: 12px;
    color: #fff;
}

#header .logo img {
    max-width: 200px;
}

@media (max-width: 599px) {
    #header {
        padding: 10px;
    }

    #header h1 {
        width: 125%;
        margin-bottom: 5px;
        font-size: 10px;
        -webkit-transform: translateX(-10%) scale(0.8);
        transform: translateX(-10%) scale(0.8);
    }

    #header .logo img {
        max-width: 140px;
    }
}



/* gnav */

[data-element-id] #gnav {
    width: 100%;
    margin-top: 30px;
}

[data-element-id] #gnav ul {
    align-items: flex-start;
}

#gnav li {
    margin-left: 25px;
}

#gnav li a {
    display: inline-block;
    font-weight: 600;
    color: #fff;
    letter-spacing: 2px;
}

#gnav .contactBtn {
    margin-left: 40px;
}

#gnav .contactBtn a {
    width: 200px;
    padding: 10px;
    text-align: center;
    border-radius: 20px;
    background: #000;
}

#gnav .contactBtn a.type-b {
    color: #000;
    background: #fff;
    border: solid 2px #000;
}

#gnav .dropdown {
    position: relative;
}

#gnav .dropdown>a {
    display: inline-block;
}

[data-element-id] #gnav .dropdown>ul {
    display: block;
    position: static;
}

#gnav .dropdown>ul {
    width: 400px;
    display: none;
    padding: 20px;
    background: rgba(0, 0, 0, 0.6);
    position: absolute;
    top: calc(100% + 5px);
    left: 0;
    z-index: 5;
}

#gnav .dropdown:before {
    display: block;
    content: "";
    width: 100%;
    height: 5px;
    position: absolute;
    top: 100%;
    left: 0;
}

#gnav .dropdown>ul>li {
    margin-left: 0;
}

#gnav .dropdown>ul>li:not(:last-of-type) {
    margin-bottom: 15px;
}

@media (max-width: 1024px) {
    #gnav li {
        width: 100%;
        margin-left: 0;
    }

    #gnav li:not(:last-of-type) {
        margin-bottom: 30px;
    }

    #gnav li a {
        font-size: 14px;
    }

    #gnav .logo {
        margin-bottom: 40px;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }

    #gnav .logo .txt {
        margin-top: 10px;
        font-size: 12px;
    }

    #gnav .contactBtn {
        margin: 0;
        text-align: center;
    }

    #gnav .contactBtn a {
        width: 100%;
        max-width: 250px;
        color: #000;
        background: #fff;
    }
    
    #gnav .dropdown:before {
        display: none;
    }

    #gnav .dropdown:after {
        content: "\f067";
        display: block;
        font-family: "Font Awesome 5 Free";
        font-weight: bold;
        color: #fff;
        position: absolute;
        top: 0;
        right: 0;
    }

    #gnav .dropdown.active:after {
        content: "\f068";
    }

    #gnav .dropdown>ul {
        width: 100%;
        visibility: visible;
        margin-top: 10px;
        padding: 0;
        background: none;
        opacity: 1;
        position: static;
    }

    #gnav .dropdown>ul>li>a {
        display: inline-block;
        font-size: 12px;
        margin-left: 10px;
        padding-left: 20px;
        position: relative;
    }

    #gnav .dropdown>ul>li>a:before {
        content: "∟";
        display: inline-block;
        position: absolute;
        top: 0;
        left: 0;
    }
}



/* barger */

@media (max-width: 1024px) {
    .toggle {
        width: 42px;
        height: 42px;
        opacity: 0.8;
        cursor: pointer;
        position: relative;
        top: 0px;
        right: 0px;
        z-index: 251;
    }

    .toggle .bar {
        width: 28px;
        height: 2px;
        display: block;
        margin-top: -1px;
        padding: 0;
        text-indent: 9999px;
        background: #fff;
        -webkit-transition: ease 0.4s;
        transition: ease 0.4s;
        position: absolute;
        top: 50%;
        left: 7px;
    }

    .toggle .bar:before,
    .toggle .bar:after {
        content: "";
        width: 28px;
        height: 2px;
        display: block;
        background: #fff;
        position: absolute;
        left: 0;
    }

    .toggle .bar:before {
        top: -10px;
    }

    .toggle .bar:after {
        top: 10px;
    }

    .toggle.active .bar {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

    .toggle.active .bar:after,
    .toggle.active .bar:before {
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg);
        top: 0;
        left: 0;
    }

    .barger-body {
        width: 90%;
        max-width: 350px;
        height: 100vh;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        background: #000;
        -webkit-transition: 0.4s;
        transition: 0.4s;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        position: fixed;
        top: 0;
        right: 0;
        z-index: 250;
    }

    .barger-body.active {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    .barger-inner {
        padding: 100px 15px 100px;
    }

    .overlay {
        width: 100%;
        height: 100vh;
        visibility: hidden;
        background: #000;
        opacity: 0;
        -webkit-transform: translate3d(0, 0, 0) !important;
        transform: translate3d(0, 0, 0) !important;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 249;
    }

    .overlay.active {
        visibility: visible;
        opacity: 0.3;
    }
}



/* footer */

[data-element-id] .footmenu {
    display: block;
    margin: 30px 0;
}

.footmenu {
    /* display: none; */
}

[data-element-id] .footmenu .btn {
    position: relative;
    bottom: 0;
    right: 0;
}

.footmenu .btn {
    width: 90px;
    height: 90px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    align-items: flex-end;
    -ms-flex-align: end;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 100%;
    background: #000;
    -webkit-box-shadow: 1px 2px 10px #777;
    box-shadow: 1px 2px 10px #777;
    cursor: pointer;
    position: fixed;
    bottom: 40px;
    right: 20px;
    z-index: 100;
}

.footmenu .btn:before {
    content: "";
    width: 32px;
    height: 32px;
    display: block;
    text-align: center;
    background: url(/import/tenant_1/160.16.117.87/html/images/common/footmenu-open.png) no-repeat;
    background-size: 100%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    position: absolute;
    top: 35%;
    left: 50%;
}

.footmenu .btn.active:before {
    background: url(/import/tenant_1/160.16.117.87/html/images/common/footmenu-close.png) no-repeat;
    background-size: 100%;
}

.footmenu .btn .txt {
    margin-bottom: 10px;
    font-weight: 600;
    font-size: 18px;
    color: #fff;
    line-height: 1.2;
    letter-spacing: 1px;
    text-align: center;
}

[data-element-id] .footmenu .menu-body {
    max-width: 400px;
    visibility: visible;
    opacity: 1;
    position: static;
}

.footmenu .menu-body {
    visibility: hidden;
    padding: 15px;
    text-align: center;
    border-radius: 5px;
    background: #000;
    -webkit-box-shadow: 5px 5px 20px;
    box-shadow: 5px 5px 20px;
    opacity: 0;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    position: fixed;
    bottom: 150px;
    right: 20px;
    z-index: 100;
}

.footmenu .menu-body.active {
    visibility: visible;
    opacity: 1;
}

.footmenu .menu-body li {
    margin-top: 20px;
    color: #fff;
}

.footmenu .menu-body li:first-of-type {
    margin-top: 0;
}

#footer {
    position: relative;
    z-index: 1;
}

.footNav {
    padding: 30px 0;
    background: #000;
}

.footNav li {
    color: #fff;
    margin: 10px;
    text-align: center;
}

.footShop .logo {
    text-align: center;
}

.footShop .item {
    height: 100%;
    padding: 20px;
    border: solid 1px;
    background: rgba(255, 255, 255, 0.8);
}

.footShop .item .shop-logo {
    height: 60px;
    text-align: center;
}

.footShop .item .shop-logo img {
    max-width: 100% !important;
    max-height: 100% !important;
}

.footShop .item .tit {
    margin-top: 20px;
    font-weight: 600;
    text-align: center;
}

.footShop .item .tel {
    margin-top: 20px;
    font-size: 14px;
}

.footShop .item .add {
    margin-top: 10px;
    font-size: 14px;
}

.footCopy {
    padding: 20px 10px;
    background: #000;
}

.footCopy .copy {
    font-size: 12px;
    color: #fff;
    text-align: center;
}

@media (max-width: 1024px) {
    .footmenu {
        display: block;
    }
    
    .footmenu .btn {
        width: 80px;
        height: 80px;
    }
    
    .footmenu .btn:before {
        width: 28px;
        height: 28px;
        top: 35%;
        left: 50%;
    }
    
    .footmenu .btn .txt {
        font-size: 16px;
    }
    
    .footmenu .menu-body {
        padding: 15px;
        bottom: 140px;
    }
    
    .footNav li {
        width: 23%;
        font-size: 14px;
        margin: 10px 1%;
    }

    .footShop .item {
        padding: 15px;
    }

    .footShop .item .tit {
        font-weight: bold;
        font-size: 14px;
    }

    .footShop .item .add {
        font-size: 12px;
    }
}

@media (max-width: 599px) {
    .footmenu .btn {
        width: 70px;
        height: 70px;
    }
    
    .footmenu .btn:before {
        width: 26px;
        height: 26px;
        top: 33%;
        left: 50%;
    }
    
    .footmenu .btn .txt {
        font-size: 14px;
    }
    
    .footmenu .menu-body {
        padding: 10px;
        bottom: 130px;
    }
    
    .footmenu .menu-body li {
        font-size: 14px;
    }
    
    .footNav li {
        width: 48%;
        font-size: 12px;
    }
    
    .footShop .item {
        width: 90%;
        margin: auto;
    }

    .footShop .item .tit {
        font-size: 16px;
    }

    .footShop .item .tel {
        font-size: 16px;
    }

    .footShop .item .add {
        font-size: 14px;
    }
}



/* A-BiSUスライダー用 */

[data-element-id] .mainimg {
    height: auto;
}

.mainimg {
    overflow: hidden;
    position: relative;
}

.mainimg .uk-slidenav-position {
    height: 100% !important;
}

.mainimg .uk-slideshow {
    height: 100% !important;
}

.mainimg .uk-slideshow>li {
    height: 100% !important;
}

.mainimg .uk-slideshow>li>div {
    height: 100% !important;
}

.mainimg .uk-slideshow>li>div>img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    font-family: "object-fit: cover; object-position: 50% 50%;";
}



/*===================================
トップページ・下層ページ
===================================*/

/* mainimg */

.mainimg {
    height: 100vh;
    background: rgba(0, 0, 0, 0.3);
    background-image: url(/import/tenant_1/www.transparenttextures.com/patterns/black-twill.png);
    background-image: url(/import/tenant_1/www.transparenttextures.com/patterns/blu-stripes.png);
}

@media only screen and (max-width: 599px) {
  .mainimg {
    height: 400px;
  }
}



/* indexSkill */

.indexSkill .left .pic {
    padding: 0 40px 40px 0;
    position: relative;
}

.indexSkill .left .pic:after {
    content: "";
    width: calc(100% - 40px);
    height: calc(100% - 40px);
    display: block;
    background: #000;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: -1;
}



/* bannerList */

.bannerList .item {
    display: block;
    position: relative;
}

.bannerList .item .pic {
    height: 150px;
    background: #000;
}

.bannerList .item .pic img {
    opacity: 0.4;
}

.bannerList .item .tit {
    width: 90%;
    color: #fff;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    top: 50%;
    left: 5%;
}

.bannerList .item .tit:before {
    content: "\f35a";
    display: block;
    font-family: "Font Awesome 5 Free";
    font-size: 30px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    top: 50%;
    right: 0;
}

.bannerList .item .tit>span {
    display: block;
}

.bannerList .item .tit .lead {
    font-size: 28px;
}

.bannerList .item .tit .sub {
    margin-top: 5px;
}



/* shopList */

.shopList .item {
    margin-bottom: 100px;
}

.shopList .item:last-of-type {
    margin-bottom: 0;
}

.shopList .item:nth-of-type(2n+2)>* {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

.shopList .item .left {
    width: 55%;
}

.shopList .item .right {
    width: 50%;
    -ms-flex-item-align: end;
    align-self: flex-end;
    margin-top: 50px;
    margin-bottom: -50px;
    margin-left: -5%;
    padding: 50px;
    background: #fff;
    position: relative;
    z-index: 15;
}

.shopList .item:nth-of-type(2n+2) .right {
    margin-left: 0;
    margin-right: -5%;
}

.shopList .item .right:before,
.shopList .item .right:after {
    content: "";
    width: 100px;
    height: 1px;
    display: block;
    background: #000;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    position: absolute;
}

.shopList .item .right:before {
    top: 20px;
    left: -30px;
}

.shopList .item .right:after {
    bottom: 20px;
    right: -30px;
}

.shopList .item .right .logo {
    margin-bottom: 30px;
    text-align: center;
}

.shopList .item .right .name {
    margin-bottom: 20px;
    font-weight: 600;
    font-size: 18px;
    text-align: center;
}

.shopList .item .right .tel {
    margin-top: 10px;
}

@media (max-width: 1024px) {
    .shopList .item .right {
        padding: 40px;
    }
}

@media (max-width: 599px) {
    .shopList .item {
        margin-bottom: 60px;
    }

    .shopList .item .left {
        width: 100%;
    }

    .shopList .item .right {
        width: 100%;
        margin: 0 !important;
        padding: 30px;
    }
}



/* galleryList */

.indexGallery .galleryList .col>*:nth-of-type(2n+2) {
    padding-top: 40px;
}

.galleryList .item {
    display: block;
    overflow: hidden;
    position: relative;
    z-index: 0;
}

.galleryList .item:hover {
    opacity: 1;
}

.galleryList .item .pic {
    background: #000;
}

.galleryList .item .pic img {
    opacity: 0.6;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.galleryList .item:hover .pic img {
    opacity: 1;
}

.galleryList .item .cate {
    width: calc(100% - 20px);
    font-size: 12px;
    color: #fff;
    text-align: right;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 5;
}

.galleryList .item .cate>*:not(:last-of-type) {
    margin-bottom: 5px;
}

.galleryList .item:hover .cate {
    right: -100%;
}

.galleryList .item .cate span {
    min-width: 70px;
    display: inline-block;
    margin: 0 0 5px 5px;
    padding: 2px 5px;
    font-size: 12px;
    color: #fff;
    text-align: center;
    border: solid 1px;
}

.galleryList .item .tit {
    width: calc(100% - 20px);
    font-size: 12px;
    color: #fff;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    position: absolute;
    bottom: 10px;
    left: 10px;
}

.galleryList .item:hover .tit {
    left: -100%;
}



/* menuList */

.menuList .col>*:nth-of-type(2n+2) {
    padding-top: 40px;
}

.menuList .item {
    display: block;
    position: relative;
}

.menuList .item:hover {
    opacity: 1;
}

.menuList .item:before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    background: rgba(0, 0, 0, 0.6);
    opacity: 0;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.menuList .item:hover:before {
    opacity: 1;
}

.menuList .item .tit {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    min-width: 120px;
    padding: 2px 5px;
    font-size: 14px;
    text-align: center;
    background: #fff;
    -webkit-transition: 0.2s;
    transition: 0.2s;
    position: absolute !important;
    bottom: 0;
    left: 0;
    z-index: 5;
}

[data-element-id] .menuList .item:hover .tit {
    color: #000;
    font-size: 14px;
    letter-spacing: 0px;
    background: #fff;
    transform: translate(0%, 0%);
    bottom: 0;
    left: 0;
}

.menuList .item:hover .tit {
    font-size: 16px;
    color: #fff;
    letter-spacing: 2px;
    background: transparent;
    -webkit-transform: translate(-50%, 50%);
    transform: translate(-50%, 50%);
    bottom: 50%;
    left: 50%;
}



/* blogList */

.blogList .item {
    display: block;
    overflow: hidden;
    position: relative;
}

.blogList .item:hover {
    opacity: 1;
}

.blogList .item .pic {
    background: #000;
}

.blogList .item .pic img {
    opacity: 0.6;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.blogList .item:hover .pic img {
    opacity: 1;
}

.blogList .item .cate {
    width: calc(100% - 20px);
    font-size: 12px;
    color: #fff;
    text-align: right;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    position: absolute;
    top: 10px;
    right: 10px;
}

.blogList .item .cate>*:not(:last-of-type) {
    margin-bottom: 5px;
}

.blogList .item:hover .cate {
    right: -100%;
}

.blogList .item .date {
    margin-top: 10px;
    font-size: 12px;
}

.blogList .item .tit {
    margin-top: 10px;
    font-size: 14px;
}



/* subimg */

.subimg {
    position: relative;
}

.subimg .pic {
    height: 45vh;
    background: #000;
}
[data-element-id] .subimg .pic {
  height: auto;
}

.subimg .pic img {
    opacity: 0.6;
}

.subimg .tit {
    color: #fff;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    top: 50%;
    left: calc(50% - 500px);
}

.subimg .tit>* {
    display: block;
}

.subimg .tit .lead {
    font-size: 44px;
    letter-spacing: 5px;
}

.subimg .tit .sub {
    margin-top: 5px;
    font-size: 20px;
}

[data-element-id] .subimg .up-d-none {
  display: block;
  width: 400px;
  margin: 30px auto 0;
  position: relative;
}
[data-element-id] .subimg .up-d-none:before {
  content: "SP用画像";
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(0, -100%);
  width: 100%;
  color: #fff;
  background-color: #999;
  text-align: center;
}

@media (max-width: 1024px) {
    .subimg .tit {
        left: 5%;
    }

    .subimg .tit .lead {
        font-size: 38px;
    }
}

@media (max-width: 599px) {
    .subimg .tit .lead {
        font-size: 32px;
    }

    .subimg .tit .sub {
        font-size: 18px;
    }
    .subimg .pic {
      height: 60vh;
    }
}



/* bread */

.bread li {
    margin-right: 15px;
}

.bread li:not(:first-of-type):before {
    content: "\f054";
    display: inline-block;
    margin-right: 10px;
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
}



/* conceptList */

.conceptList .item {
    position: relative;
}

.conceptList .item:not(:last-of-type) {
    margin-bottom: 120px;
}

.conceptList .item:nth-of-type(2n+2) .flex {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

.conceptList .item .left {
    width: 50%;
}

.conceptList .item .right {
    width: 40%;
    max-width: 550px;
}

.conceptList .item:nth-of-type(2n+1) .right {
    margin-left: 5%;
    margin-right: auto;
}

.conceptList .item:nth-of-type(2n+2) .right {
    margin-left: auto;
    margin-right: 5%;
}

.conceptList .item .right .pic {
    display: none;
}

.conceptList-bg .item {
    margin-top: 170px;
    padding: 50px 0;
}

.conceptList-bg .item>* {
    position: relative;
    z-index: 5;
}

.conceptList-bg .item:before {
    content: "";
    width: 80%;
    height: 100%;
    display: block;
    background: #f5f5f5;
    position: absolute;
    top: 0;
    left: 0;
}

.conceptList-bg .item:nth-of-type(2n+1) .flex {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

.conceptList-bg .item:nth-of-type(2n+2) .flex {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

.conceptList-bg .item .left {
    margin-top: -150px;
}

.conceptList-bg .item .left .pic {
    height: 85%;
}

.conceptList-bg .item:nth-of-type(2n+1) .right {
    margin-left: auto;
    margin-right: 5%;
}

.conceptList-bg .item:nth-of-type(2n+2) .right {
    margin-left: 5%;
    margin-right: auto;
}

@media (max-width: 1024px) {
    .conceptList .item:not(:last-of-type) {
        margin-bottom: 90px;
    }
}

@media (max-width: 599px) {
    .conceptList .item:not(:last-of-type) {
        margin-bottom: 60px;
    }

    .conceptList .item .left {
        width: 100%;
    }
    
    .conceptList .item .left .pic {
        display: none;
    }

    .conceptList .item .right {
        width: 94%;
        margin: 0 auto 0 !important;
    }
    
    .conceptList .item .right .pic {
        display: block;
        margin-bottom: 20px;
    }

    .conceptList-bg .item {
        margin-top: 0;
    }

    .conceptList-bg .item:before {
        width: 90%;
    }

    .conceptList .item:nth-of-type(2n+1):before {
        left: auto;
        right: 0;
    }

    .conceptList-bg .item .left {
        margin-top: 0;
    }
    
    .conceptList-bg .item .left .pic {
        height: 100%;
    }
}



/* commitList */

.commitBtn li.active a {
    color: #fff;
    background: #000;
}

.commitBtn li a:hover {
    letter-spacing: 0;
}

.commitList .item .left {
    width: 40%;
}

.commitList .item .right {
    width: 55%;
}

@media (max-width: 599px) {
    .commitList .item .left {
        width: 70%;
        margin: auto;
    }

    .commitList .item .right {
        width: 100%;
        margin-top: 30px;
    }
}



/* priceList */

.priceList .box:not(:last-of-type) {
    margin-bottom: 50px;
    padding-bottom: 100px;
    position: relative;
}

.priceList .box:not(:last-of-type):after {
    content: "";
    width: 2px;
    height: 50px;
    display: block;
    margin-left: -1px;
    background: #000;
    position: absolute;
    bottom: 0;
    left: 50%;
}

.priceList .item dl {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: solid 1px;
}

.priceList .item dt {
    font-weight: 600;
}

.priceList .item .desc {
    width: 100%;
    margin-top: 5px;
    font-size: 14px;
}

@media (max-width: 599px) {
    .priceList .item dt {
        width: 100%;
        margin-bottom: 5px;
    }

    .priceList .item dd:not(.desc) {
        width: 100%;
        text-align: right;
    }
}



/* productList */

.productList .item .pic {
    height: 300px;
}

.productList .item .pic img {
    width: auto;
    max-width: 100% !important;
    height: auto;
    max-height: 100% !important;
}

.productList .item .tit {
    margin-top: 10px;
    font-weight: 600;
    font-size: 20px;
    text-align: center;
}

.productList .item .name {
    margin-top: 15px;
    text-align: center;
}

.productList .item .nut {
    margin-top: 10px;
    text-align: right;
}

.productList .item .pri {
    margin-top: 10px;
    text-align: right;
}

.productList .item .btn {
    margin-top: 20px;
}

@media (max-width: 599px) {
    .productList .item .pic {
        height: 250px;
    }
}



/* qaList */

.qaList dl:not(:last-of-type) {
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: solid 1px;
}

.qaList dl>* {
    min-height: 50px;
    padding-left: 70px;
    position: relative;
}

.qaList .label {
    width: 50px;
    height: 50px;
    display: block;
    font-size: 20px;
    color: #fff;
    line-height: 48px;
    text-align: center;
    border: solid 1px #000;
    background: #000;
    position: absolute;
    top: 0;
    left: 0;
}

.qaList dt {
    margin-bottom: 20px;
    padding-top: 14px;
    font-weight: 600;
    font-size: 18px;
}

.qaList dd {
    margin-left: 20px;
    padding-top: 15px;
}

.qaList dd .label {
    color: #000;
    background: #fff;
}

@media (max-width: 599px) {
    .qaList dl:not(:last-of-type) {
        margin-bottom: 20px;
        padding-bottom: 20px;
    }

    .qaList dl>* {
        min-height: 40px;
        padding-left: 50px;
    }

    .qaList .label {
        width: 40px;
        height: 40px;
        font-size: 18px;
        line-height: 38px;
    }

    .qaList dt {
        padding-top: 8px;
    }

    .qaList dd {
        padding-top: 8px;
    }
}



/* column2 */

.column2-main {
    width: calc(100% - 360px);
}

.column2-side {
    width: 320px;
}

.column2-side dl {
    width: 100%;
}

.column2-side dl:not(:last-of-type) {
    margin-bottom: 30px;
}

.column2-side dt {
    margin-bottom: 15px;
    padding-bottom: 10px;
    font-size: 24px;
    border-bottom: solid 2px;
}

.column2-side dd:not(:last-of-type) {
    margin-bottom: 10px;
}

.column2-side dd a {
    display: inline-block;
    padding-left: 1em;
    position: relative;
}

.column2-side dd a:before {
    content: "・";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}

@media (max-width: 1024px) {
    .column2-main {
        width: 100%;
    }

    .column2-side {
        width: 100%;
        margin-top: 80px;
    }

    .column2-side dl {
        width: 31.333%;
    }
}

@media (max-width: 599px) {
    .column2-side {
        margin-top: 60px;
    }

    .column2-side dl {
        width: 100%;
    }
}



/* pagenav */

.pagenav li {
    margin: 0 15px;
    font-size: 20px;
    text-align: center;
}

.pagenav .active {
    width: 30px;
    color: #fff;
    line-height: 30px;
    background: #000;
}

.pagenav .prev a:before,
.pagenav .next a:before {
    content: "";
    display: block;
    font-family: "font awesome 5 free";
    font-weight: bold;
    font-size: 18px;
}

.pagenav .prev a:before {
    content: "\f053";
}

.pagenav .next a:before {
    content: "\f054";
}



/* gallerySingle */

.gallerySingle .left {
    width: 40%;
}

.gallerySingle .right {
    width: 55%;
}

.gallerySingle .right .tit {
    margin-bottom: 30px;
    padding-bottom: 15px;
    font-size: 22px;
    border-bottom: solid 2px;
}

.gallerySingle .right .info dl:not(:last-of-type) {
    margin-bottom: 30px;
}

.gallerySingle .right .info dt {
    margin-bottom: 15px;
    font-weight: 600;
    font-size: 18px;
}

.gallerySingle .right .info dt:after {
    content: "";
    width: 50px;
    height: 2px;
    display: block;
    margin-top: 5px;
    background: #000;
}

@media (max-width: 599px) {
    .gallerySingle .left {
        width: 80%;
        margin: auto;
    }

    .gallerySingle .right {
        width: 100%;
        margin-top: 30px;
    }
}



/* blogSingle */

.blogSingle .info {
    margin-bottom: 30px;
}

.blogSingle .info dt {
    margin-bottom: 10px;
}

.blogSingle .tit {
    margin-bottom: 20px;
    padding-bottom: 15px;
    font-size: 24px;
    border-bottom: solid 2px;
}



/* newsList */

.newsList .item {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: solid 1px;
}

.newsList .item .info {
    margin-bottom: 5px;
}

.newsList .item .info>* {
    margin-bottom: 5px;
    margin-right: 10px;
}

.newsList .item .info .date {
    font-size: 14px;
}

.newsList .item .info>*:not(.date) {
    padding: 2px 5px;
    font-size: 12px;
    color: #fff;
    background: #000;
}



/* formList */

.formList dl:not(:last-of-type) {
    margin-bottom: 30px;
}

.formList .label {
    margin-left: 10px;
    color: #df3e3e;
}

.formList dt {
    width: 250px;
    font-weight: 600;
}

.formList dd {
    width: calc(100% - 250px);
}

.formList dd li {
    margin-bottom: 5px;
    margin-right: 15px;
}

.formList input[type="text"],
.formList textarea {
    width: 100%;
    padding: 10px;
    border: none;
    background: #f5f5f5;
}

.formList input[type="radio"],
.formList input[type="checkbox"] {
    margin-right: 5px;
}

.formList textarea {
    height: 200px;
}

@media (max-width: 599px) {
    .formList dt {
        width: 100%;
        margin-bottom: 10px;
    }

    .formList dd {
        width: 100%;
    }

    .formList dd li {
        width: 50%;
        margin-right: 0;
    }
}



/* staffList */

.staffList .item {
    display: block;
    position: relative;
}

.staffList .item:hover {
    opacity: 1;
}

.staffList .item:before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    background: #000;
    opacity: 0;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.staffList .item:hover:before {
    opacity: 0.6;
}

.staffList .item dl {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 10px;
    color: #fff;
    text-align: center;
    opacity: 0;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
}

.staffList .item:hover dl {
    opacity: 1;
}

.staffList .item dd {
    margin-top: 10px;
    font-size: 12px;
}



/* voiceList */

.voiceList .item:not(:last-of-type) {
    margin-bottom: 80px;
}

.voiceList .item .left {
    width: 55%;
    margin-bottom: 50px;
}

.voiceList .item .right {
    width: 50%;
    margin-left: -5%;
    padding: 40px;
    border: solid 1px;
    background: #747474;
    position: relative;
    z-index: 15;
}

.voiceList .item:nth-of-type(2n+2)>* {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

.voiceList .item:nth-of-type(2n+2) .right {
    margin-left: 0;
    margin-right: -5%;
}

.voiceList .item .right>* {
    color: #fff;
}

.voiceList .item .right .tit {
    margin-bottom: 20px;
    font-size: 24px;
}

.voiceList .item .right dl {
    margin-top: 20px;
    text-align: right;
}

.voiceList .item .right dt {
    font-size: 14px;
}

.voiceList .item .right dd {
    font-weight: 600;
}

@media (max-width: 1024px) {
    .voiceList .item:not(:last-of-type) {
        margin-bottom: 60px;
    }

    .voiceList .item .right {
        padding: 30px;
    }

    .voiceList .item .right .tit {
        font-size: 22px;
    }
}

@media (max-width: 599px) {
    .voiceList .item:not(:last-of-type) {
        margin-bottom: 40px;
    }

    .voiceList .item .left {
        width: 100%;
        margin-bottom: 0;
    }

    .voiceList .item .right {
        width: 100%;
        margin: 0 !important;
        padding: 20px;
    }

    .voiceList .item .right .tit {
        font-size: 20px;
    }
}



/* recruitList */

.recruitList .item {
    height: 100%;
    padding: 20px;
    border: solid 1px;
    background: #fff;
}

.recruitList .item .tit {
    margin-bottom: 15px;
    padding-left: 10px;
    font-weight: 600;
    font-size: 18px;
    border-left: solid 5px #c33;
}

.recruitList .item .info {
    margin-bottom: 20px;
}

.recruitList .item .info li {
    font-size: 14px;
}

.recruitList .item .info li:not(:last-of-type) {
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: solid 1px;
}



/* product(organic) */
.mark {
    background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, rgba(0, 0, 0, 0.1)));
    background-image: linear-gradient(to right, transparent 50%, rgba(0, 0, 0, 0.1) 50%);
    background-size: 200% 1.3em;
    background-repeat: repeat-x;
    background-position: 0 0.9em;
    -webkit-transition: all 2s cubic-bezier(1, 1, 1, 1);
    transition: all 2s cubic-bezier(1, 1, 1, 1);
}

.mark.move {
    background-position: -100% 0.9em;
}

.box01 {
    padding: 50px 30px;
    border-radius: 5px;
    background-color: white;
    -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.2);
}

.box01+.box01 {
    margin-top: 80px;
}

.box-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.title-box-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    margin-bottom: 30px;
}

.title-box {
    min-width: 200px;
    display: inline-block;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-bottom: 30px;
    padding: 10px 20px;
    font-size: 22px;
    letter-spacing: 4px;
    text-align: center;
    position: relative;
}

.title-box::before,
.title-box::after {
    content: "";
    width: 10px;
    height: 100%;
    display: inline-block;
    border-top: 2px dotted #000;
    border-bottom: 2px dotted #000;
    position: absolute;
    top: 0;
}

.title-box::before {
    border-left: 2px dotted #000;
    left: 0;
}

.title-box::after {
    border-right: 2px dotted #000;
    right: 0;
}

.title-box-sub {
    margin-left: 30px;
    font-size: 20px;
}

.title-box-wrap .title-box {
    margin-bottom: 0;
}

.product-name-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    align-items: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.product-name {
    width: 30%;
    margin: 15px;
    padding: 10px 20px;
    font-size: 24px;
    letter-spacing: 2px;
    text-align: center;
    background-color: #f5f5f5;
}

.list-box-wrap .list-box+.list-box {
    margin-top: 20px;
}

.list-box dt {
    display: inline-block;
    margin-bottom: 5px;
    padding: 0 5px;
    font-family: "Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-weight: bold;
}

.list-box dd {
    padding-left: 1em;
}

.list-box02 {
    width: 48%;
    margin: 1%;
}

.list-box02 dt {
    display: inline-block;
    margin-bottom: 10px;
    padding: 0 5px;
    font-family: "Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-weight: bold;
}

.list-box02 dd {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.list-box02 dd .icon-grow {
    max-width: 100px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.list-box02 dd .text {
    margin-left: 10px;
    font-size: 12px;
}

.list-ingre {
    width: 90%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 auto 30px;
}

.list-ingre li {
    width: 48%;
    margin: 1% 1% 0;
    padding-left: 1.5em;
    font-size: 14px;
    position: relative;
}

.list-ingre li::before {
    content: "";
    width: 1em;
    height: 1px;
    display: inline-block;
    background-color: black;
    position: absolute;
    top: 9px;
    left: 0;
}

.list-ordered {
    list-style-type: decimal;
    margin: 30px 0;
    padding-left: 30px;
}

.list-ordered li {
    padding-left: 5px;
}

.list-ordered li+li {
    margin-top: 5px;
}

@media (max-width: 1024px) {
    .box01+.box01 {
        margin-top: 50px;
    }

    .product-name {
        width: 45%;
        margin: 2.5%;
        font-size: 22px;
    }

    .title-box-wrap {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        align-items: flex-start;
        -ms-flex-align: start;
    }

    .title-box {
        min-width: 180px;
        padding: 5px 15px;
        font-size: 20px;
        letter-spacing: 2px;
    }

    .title-box-sub {
        margin-top: 10px;
        margin-left: 0;
        font-size: 18px;
    }
}

@media (max-width: 599px) {
    .box01 {
        padding: 30px 15px;
    }

    .box01+.box01 {
        margin-top: 30px;
    }

    .product-name-box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .product-name {
        width: 70%;
    }

    .title-box {
        min-width: 150px;
        padding: 5px 10px;
        font-size: 18px;
    }

    .title-box-sub {
        font-size: 16px;
    }

    .list-ingre li {
        width: 100%;
        margin: 10px 0 0;
    }

    .list-box02 {
        width: 100%;
        margin: 0;
    }

    .list-box02+.list-box02 {
        margin-top: 20px;
    }
}

.list-wrap {
    position: relative;
}

.list-wrap .list-check {
    position: relative;
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
}

.list-wrap .list-check li:first-child {
    font-weight: bold;
}

.list-wrap .list-check + .list-check {
    margin-top: 10px;
}

.list-wrap .list-check li .sub {
    display: block;
    font-weight: normal;
    padding-left: 1rem;
    position: relative;
}

.list-wrap .list-check li .sub:before {
    content: "-";
    position: absolute;
    top: 0;
    left: 5px;
}


.list-wrap .list-check li {
    width: 20%;
    flex-grow: 1;
}

.list-wrap .list-check li:nth-child(2), .list-wrap .list-check li:nth-child(3) {
    margin-left: 10px;
}

@media (max-width: 599px) {
  .list-wrap .list-check li:first-child {
      width: 100%;
  }

}

/* 2024/02/15 */
.blog_detail_txt ol, .blog_detail_txt ul {
  margin-left: 1em;
  list-style: revert;
}

@media (max-width:599px) {
  .blog_detail_txt ol, .blog_detail_txt ul {
    margin-left: 1.5em;
  }
}

.mask-box{
  background: #d3ccbe;
    padding: 80px 0 40px 0;
}

.mask-box span{
  font-size: 30px;
  font-weight: bold;
}

.mask0601{
  font-size: 20px !important;
  font-weight: normal !important;
}

.plasticbag{
  margin-top: 70px;
  font-size: 16px;
}

@media (max-width: 599px) {
  .mask-box {
    background: #d3ccbe;
    padding: 60px 12px 20px 12px;
}

.mask-box span {
    font-size: 28px;
}
}

/**2025/01/30 アコーディオン**/
.accordion-001 {
    width: 100%;
    background-color: #f5f5f5;
}

.accordion-001:not([open]) {
    margin-bottom: 7px;
}

.accordion-001 summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding: 1em 2em;
    border-radius: 5px;
    background-color: #000000;
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    font-size: 22px;
}

.accordion-001 summary::-webkit-details-marker {
    display: none;
}

.accordion-001 summary::after {
    transform: translateY(-25%) rotate(45deg);
    width: 7px;
    height: 7px;
    margin-left: 10px;
    border-bottom: 3px solid #fff;
    border-right: 3px solid #fff;
    content: '';
    transition: transform .3s;
}

.accordion-001[open] summary::after {
    transform: rotate(225deg);
}

.accordion-001 .accordion-inner {
    transform: translateY(-10px);
    opacity: 0;
    margin: 0;
    padding: 1em 2em 2em 2em;
    color: #333333;
    transition: transform .5s, opacity .5s;
}

.accordion-001[open] .accordion-inner {
    transform: none;
    opacity: 1;
}

.map-box iframe {
  width:100%;
  aspect-ratio: 16/17;
}

@media (max-width: 1024px){
  .accordion-001 summary {
    font-size: 20px;
  }
}

@media (max-width: 599px){
  .accordion-001 summary {
    font-size: 18px;
  }
  .address-box .up-mt-50 {
    flex-direction: column-reverse;
  }
  .map-box iframe {
    aspect-ratio: 16/13;
  }
}
