@charset "UTF-8";

*,
:after,
:before {
    box-sizing: border-box;
}

svg,
video,
canvas,
audio,
iframe,
embed,
object {
    display: block;
}

img,
video,
iframe {
    max-width: 100%;
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: top;
    border: 0;
    border-style: none;
}

img:not([src*='.']) {
    display: none;
}

ol,
ul {
    list-style: none;
}

time {
    display: block;
}

button,
[role='button'] {
    cursor: pointer;
}

table {
    border-collapse: collapse;
}

table th {
    font-weight: normal;
}

.img img {
    width: 100%;
    text-align: center;
}

a,
button {
    color: inherit;
    text-decoration: none;
    -webkit-transition: 0.4s ease;
    transition: 0.4s ease;
}

a:hover,
button:hover {
    color: inherit;
    text-decoration: none;
    opacity: 0.6;
    cursor: pointer;
}

a[href*='tel'] {
    pointer-events: none;
}

.tel[data-ab-test-conversion-button=""] {
    pointer-events: none;
}

.wrapper {
    min-width: 375px;
    overflow: hidden;
}

@media (max-width: 1024px) {
    a[href*='tel'] {
        pointer-events: initial;
    }

    .tel[data-ab-test-conversion-button=""] {
        pointer-events: auto;
    }
}


.clearfix::after {
    content: "";
    display: block;
    clear: both;
}

/* 全 fead 要素の初期状態 */
[class*="fead-"] {
    opacity: 0;
}

/* fead-blur */
.fead-blur {
    -webkit-filter: blur(6px);
    filter: blur(6px);
    -webkit-transition: opacity 0.8s ease-out, -webkit-filter 0.8s ease-out;
    transition: opacity 0.8s ease-out, filter 0.8s ease-out;
    will-change: opacity, filter;
}

.fead-blur.mv {
    -webkit-filter: blur(0);
    filter: blur(0);
}

.inner500 {
    width: 92%;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}

.inner600 {
    width: 92%;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.inner700 {
    width: 92%;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.inner800 {
    width: 92%;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.inner900 {
    width: 92%;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.inner {
    width: 92%;
    max-width: 1000px;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.inner1100 {
    width: 98%;
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
}

.inner1200 {
    width: 98%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.inner1300 {
    width: 98%;
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
}

.inner1400 {
    width: 98%;
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
}

.inner1500 {
    width: 98%;
    max-width: 1500px;
    margin-left: auto;
    margin-right: auto;
}

.inner1600 {
    width: 98%;
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
}

.inner1700 {
    width: 98%;
    max-width: 1700px;
    margin-left: auto;
    margin-right: auto;
}

.inner1800 {
    width: 98%;
    max-width: 1800px;
    margin-left: auto;
    margin-right: auto;
}

.inner1900 {
    width: 98%;
    max-width: 1900px;
    margin-left: auto;
    margin-right: auto;
}

.inner2000 {
    width: 98%;
    max-width: 2000px;
    margin-left: auto;
    margin-right: auto;
}

@media (max-width: 1024px) {

    .inner500,
    .inner600,
    .inner700,
    .inner800,
    .inner900,
    .inner,
    .inner1100,
    .inner1200,
    .inner1300,
    .inner1400,
    .inner1500,
    .inner1600,
    .inner1700,
    .inner1800,
    .inner1900,
    .inner2000 {
        width: 96%;
        max-width: 768px;
    }
}

/* .mv 基本（全 fead 要素の表示トランジション） */
.mv {
    opacity: 1;
    -webkit-transition: 0.5s ease-out;
    transition: 0.5s ease-out;
}

/* fead-up */
.fead-up {
    -webkit-transform: translateY(50px);
    transform: translateY(50px);

    will-change: opacity, transform;
}

/* fead-up */
.fead-mv {
    opacity:0;
    transition: 0.5s ease-out;
}

.fead-mv.mv {
    opacity:1;
    transition: 0.5s ease-out;
}

[data-element-id].fead-mv{
  opacity:1;
}


.fead-up.mv {
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

[data-element-id].fead-up {
    -webkit-transform: translateY(0);
    transform: translateY(0);
     opacity: 1;
}

[data-element-id].fead-up {
    -webkit-transform: translateY(0);
    transform: translateY(0);
     opacity: 1;
}

/* fead-right */
.fead-right {
    -webkit-transition: 1s;
    transition: 1s;
    -webkit-transform: translateX(-20%);
    transform: translateX(-20%);

    will-change: opacity, transform;
}

.fead-right.mv {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

/* fead-left */
.fead-left {
    -webkit-transition: 1s;
    transition: 1s;
    -webkit-transform: translateX(20%);
    transform: translateX(20%);

    will-change: opacity, transform;
}

.fead-left.mv {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

/* fead-cover */
.fead-cover {
    position: relative;
}

.fead-cover::before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    background-color: #000;
    -webkit-transition: 0.8s;
    transition: 0.8s;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 15;

    will-change: width;
}

.fead-cover.mv::before {
    width: 0;
    -webkit-transition-delay: 0.6s;
    transition-delay: 0.6s;
}

/* fead-order（子要素を順番にアニメーション） */
.fead-order {
    opacity: 1;
}

.fead-order>* {
    opacity: 0;
    -webkit-transition: 0.8s;
    transition: 0.8s;
    -webkit-transform: translateY(50px);
    transform: translateY(50px);

    will-change: opacity, transform;
}

.fead-order>.mv {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

/* fead-text */
.fead-text {
    opacity: 1;
}

.fead-text .str {
    opacity: 0;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

.fead-text .str.textin {
    opacity: 1;
}

/* fead-scale */
.fead-scale {
    -webkit-transition: 0.8s ease-out;
    transition: 0.8s ease-out;
    -webkit-transform: scale(1.05);
    transform: scale(1.05);

    will-change: transform;
}

.fead-scale.mv {
    -webkit-transform: scale(1);
    transform: scale(1);
}

.reader1 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.reader2 {
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.reader3 {
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}


[class*='ofi'] {
    width: 100%;
    display: block;
    position: relative;
}

[class*='ofi'] img {
    width: 100%;
    height: 100% !important;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
}

[class*='ofi-']::after {
    content: '';
    display: block;
}

[class*='ofi-'] img {
    position: absolute;
    top: 0;
    left: 0;
}

.ofi-10::after {
    padding-top: 10%;
}

.ofi-15::after {
    padding-top: 15%;
}

.ofi-20::after {
    padding-top: 20%;
}

.ofi-25::after {
    padding-top: 25%;
}

.ofi-30::after {
    padding-top: 30%;
}

.ofi-35::after {
    padding-top: 35%;
}

.ofi-40::after {
    padding-top: 40%;
}

.ofi-45::after {
    padding-top: 45%;
}

.ofi-50::after {
    padding-top: 50%;
}

.ofi-55::after {
    padding-top: 55%;
}

.ofi-60::after {
    padding-top: 60%;
}

.ofi-65::after {
    padding-top: 65%;
}

.ofi-70::after {
    padding-top: 70%;
}

.ofi-75::after {
    padding-top: 75%;
}

.ofi-80::after {
    padding-top: 80%;
}

.ofi-85::after {
    padding-top: 85%;
}

.ofi-90::after {
    padding-top: 90%;
}

.ofi-95::after {
    padding-top: 95%;
}

.ofi-100::after {
    padding-top: 100%;
}

.ofi-105::after {
    padding-top: 105%;
}

.ofi-110::after {
    padding-top: 110%;
}

.ofi-115::after {
    padding-top: 115%;
}

.ofi-120::after {
    padding-top: 120%;
}

.ofi-125::after {
    padding-top: 125%;
}

.ofi-130::after {
    padding-top: 130%;
}

.ofi-135::after {
    padding-top: 135%;
}

.ofi-140::after {
    padding-top: 140%;
}

.ofi-145::after {
    padding-top: 145%;
}

.ofi-150::after {
    padding-top: 150%;
}

.ofi-155::after {
    padding-top: 155%;
}

.ofi-160::after {
    padding-top: 160%;
}

.ofi-165::after {
    padding-top: 165%;
}

.ofi-170::after {
    padding-top: 170%;
}

.ofi-175::after {
    padding-top: 175%;
}

.ofi-180::after {
    padding-top: 180%;
}

.ofi-185::after {
    padding-top: 185%;
}

.ofi-190::after {
    padding-top: 190%;
}

.ofi-195::after {
    padding-top: 195%;
}

.ofi-200::after {
    padding-top: 200%;
}

@media (max-width: 1024px) {
    .ofi-10\@tb::after {
        padding-top: 10%;
    }

    .ofi-15\@tb::after {
        padding-top: 15%;
    }

    .ofi-20\@tb::after {
        padding-top: 20%;
    }

    .ofi-25\@tb::after {
        padding-top: 25%;
    }

    .ofi-30\@tb::after {
        padding-top: 30%;
    }

    .ofi-35\@tb::after {
        padding-top: 35%;
    }

    .ofi-40\@tb::after {
        padding-top: 40%;
    }

    .ofi-45\@tb::after {
        padding-top: 45%;
    }

    .ofi-50\@tb::after {
        padding-top: 50%;
    }

    .ofi-55\@tb::after {
        padding-top: 55%;
    }

    .ofi-60\@tb::after {
        padding-top: 60%;
    }

    .ofi-65\@tb::after {
        padding-top: 65%;
    }

    .ofi-70\@tb::after {
        padding-top: 70%;
    }

    .ofi-75\@tb::after {
        padding-top: 75%;
    }

    .ofi-80\@tb::after {
        padding-top: 80%;
    }

    .ofi-85\@tb::after {
        padding-top: 85%;
    }

    .ofi-90\@tb::after {
        padding-top: 90%;
    }

    .ofi-95\@tb::after {
        padding-top: 95%;
    }

    .ofi-100\@tb::after {
        padding-top: 100%;
    }

    .ofi-105\@tb::after {
        padding-top: 105%;
    }

    .ofi-110\@tb::after {
        padding-top: 110%;
    }

    .ofi-115\@tb::after {
        padding-top: 115%;
    }

    .ofi-120\@tb::after {
        padding-top: 120%;
    }

    .ofi-125\@tb::after {
        padding-top: 125%;
    }

    .ofi-130\@tb::after {
        padding-top: 130%;
    }

    .ofi-135\@tb::after {
        padding-top: 135%;
    }

    .ofi-140\@tb::after {
        padding-top: 140%;
    }

    .ofi-145\@tb::after {
        padding-top: 145%;
    }

    .ofi-150\@tb::after {
        padding-top: 150%;
    }

    .ofi-155\@tb::after {
        padding-top: 155%;
    }

    .ofi-160\@tb::after {
        padding-top: 160%;
    }

    .ofi-165\@tb::after {
        padding-top: 165%;
    }

    .ofi-170\@tb::after {
        padding-top: 170%;
    }

    .ofi-175\@tb::after {
        padding-top: 175%;
    }

    .ofi-180\@tb::after {
        padding-top: 180%;
    }

    .ofi-185\@tb::after {
        padding-top: 185%;
    }

    .ofi-190\@tb::after {
        padding-top: 190%;
    }

    .ofi-195\@tb::after {
        padding-top: 195%;
    }

    .ofi-200\@tb::after {
        padding-top: 200%;
    }
}

@media (max-width: 599px) {
    .ofi-10\@sp::after {
        padding-top: 10%;
    }

    .ofi-15\@sp::after {
        padding-top: 15%;
    }

    .ofi-20\@sp::after {
        padding-top: 20%;
    }

    .ofi-25\@sp::after {
        padding-top: 25%;
    }

    .ofi-30\@sp::after {
        padding-top: 30%;
    }

    .ofi-35\@sp::after {
        padding-top: 35%;
    }

    .ofi-40\@sp::after {
        padding-top: 40%;
    }

    .ofi-45\@sp::after {
        padding-top: 45%;
    }

    .ofi-50\@sp::after {
        padding-top: 50%;
    }

    .ofi-55\@sp::after {
        padding-top: 55%;
    }

    .ofi-60\@sp::after {
        padding-top: 60%;
    }

    .ofi-65\@sp::after {
        padding-top: 65%;
    }

    .ofi-70\@sp::after {
        padding-top: 70%;
    }

    .ofi-75\@sp::after {
        padding-top: 75%;
    }

    .ofi-80\@sp::after {
        padding-top: 80%;
    }

    .ofi-85\@sp::after {
        padding-top: 85%;
    }

    .ofi-90\@sp::after {
        padding-top: 90%;
    }

    .ofi-95\@sp::after {
        padding-top: 95%;
    }

    .ofi-100\@sp::after {
        padding-top: 100%;
    }

    .ofi-105\@sp::after {
        padding-top: 105%;
    }

    .ofi-110\@sp::after {
        padding-top: 110%;
    }

    .ofi-115\@sp::after {
        padding-top: 115%;
    }

    .ofi-120\@sp::after {
        padding-top: 120%;
    }

    .ofi-125\@sp::after {
        padding-top: 125%;
    }

    .ofi-130\@sp::after {
        padding-top: 130%;
    }

    .ofi-135\@sp::after {
        padding-top: 135%;
    }

    .ofi-140\@sp::after {
        padding-top: 140%;
    }

    .ofi-145\@sp::after {
        padding-top: 145%;
    }

    .ofi-150\@sp::after {
        padding-top: 150%;
    }

    .ofi-155\@sp::after {
        padding-top: 155%;
    }

    .ofi-160\@sp::after {
        padding-top: 160%;
    }

    .ofi-165\@sp::after {
        padding-top: 165%;
    }

    .ofi-170\@sp::after {
        padding-top: 170%;
    }

    .ofi-175\@sp::after {
        padding-top: 175%;
    }

    .ofi-180\@sp::after {
        padding-top: 180%;
    }

    .ofi-185\@sp::after {
        padding-top: 185%;
    }

    .ofi-190\@sp::after {
        padding-top: 190%;
    }

    .ofi-195\@sp::after {
        padding-top: 195%;
    }

    .ofi-200\@sp::after {
        padding-top: 200%;
    }
}

.obf-contain>img {
    object-fit: contain;
}