@charset "UTF-8";
html {
  font-family: '游ゴシック', YuGothic, Hiragino Sans, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic Pro', Hiragino Kaku Gothic ProN, 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
  font-weight: normal;
  font-size: 16px;
  color: #000;
  line-height: 1.5;
  word-break: break-word;
  -webkit-text-size-adjust: 100%;
}
*,
:after,
:before {
  box-sizing: border-box;
}
body,
div,
blockquote,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
form,
input,
button,
figure,
figcaption,
p,
pre,
a,
time {
  margin: 0;
  padding: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
  color: inherit;
  line-height: inherit;
}
button,
input,
optgroup,
select,
textarea {
  padding: 0;
  color: inherit;
  line-height: inherit;
}
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block;
}
button,
input,
optgroup,
select,
textarea {
  margin: 0;
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
}
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;
}
b,
strong {
  font-weight: bolder;
}
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;
}
.map {
  overflow: hidden;
  padding-top: 50%;
  position: relative;
}
.map iframe {
  width: 100%;
  max-width: initial;
  height: 100%;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
}
.youtube {
  overflow: hidden;
  padding-top: 56.25%;
  position: relative;
}
.youtube-short {
  padding-top: 177.7777%;
}
.youtube iframe {
  width: 100%;
  max-width: initial;
  height: 100%;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
}
.iframe {
  overflow: hidden;
  position: relative;
}
.iframe iframe {
  width: 100%;
  max-width: initial;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
}
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;
  }
}

@layer base {

    *,
    :after,
    :before {
        box-sizing: border-box;
    }

    body,
    div,
    blockquote,
    dl,
    dt,
    dd,
    ul,
    ol,
    li,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    hr,
    form,
    input,
    button,
    figure,
    figcaption,
    p,
    pre,
    a,
    time {
        margin: 0;
        padding: 0;
    }
}

button,
input,
optgroup,
select,
textarea {
    padding: 0;
    color: inherit;
    line-height: inherit;
}

svg,
video,
canvas,
audio,
iframe,
embed,
object {
    display: block;
}

button,
input,
optgroup,
select,
textarea {
    margin: 0;
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
}

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;
}

b,
strong {
    font-weight: bolder;
}

ol,
ul {
    list-style: none;
}

time {
    display: block;
}

button,
[role="button"] {
    cursor: pointer;
}

table {
    border-collapse: collapse;
}

table th {
    font-weight: normal;
}

a {
    color: inherit;
    text-decoration: none;
    transition: 0.4s;
}

/* 全 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.mv {
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

/* 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);
}

/* ##### パンくずリスト breadcrumbs ##### */
.breadcrumbs {
    padding: 30px 0;
    background-color: white;
}

.breadcrumbs-list {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin-left: auto;
    padding-left: 1em;
}

.breadcrumbs-list li {
    display: inline;
    font-size: 14px;
    letter-spacing: 1px;
}

.breadcrumbs-list li.breadcrumbs-home,
.breadcrumbs-list li.breadcrumbs-prevpage {
    font-weight: bold;
    color: #15569d;
}

.breadcrumbs-list li+li::before {
    content: "";
    width: 8px;
    height: 8px;
    display: inline-block;
    margin: 0 10px;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

@media (max-width: 1024px) {
    .breadcrumbs {
        padding: 20px 0;
        font-size: 14px;
    }

    .breadcrumbs-list {
        width: 90%;
        margin-top: 1em;
    }

    .breadcrumbs li {
        font-size: 12px;
    }

    .breadcrumbs li+li::before {
        width: 8px;
        height: 8px;
        margin: 0 5px 1px;
    }
}

@media (max-width: 599px) {
    .breadcrumbs {
        padding: 15px 0;
        font-size: 12px;
    }

    .breadcrumbs li+li::before {
        width: 6px;
        height: 6px;
    }
}

/* ##### パンくずリスト breadcrumbs ここまで ##### */

[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%;
    }
}
