@charset "UTF-8";
/***
    The new CSS reset - version 1.11.3 (last updated 25.08.2024)
    GitHub page: https://github.com/elad2412/the-new-css-reset
***/
/*
    Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property
    - The "symbol *" part is to solve Firefox SVG sprite bug
    - The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36)
 */
*:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) {
  all: unset;
  display: revert;
}

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

html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  -ms-text-size-adjust: none;
      text-size-adjust: none;
}

a, button {
  cursor: revert;
}

ol, ul, menu, summary {
  list-style: none;
}

ol {
  counter-reset: revert;
}

img {
  max-inline-size: 100%;
  max-block-size: 100%;
}

table {
  border-collapse: collapse;
}

input, textarea {
  -webkit-user-select: auto;
}

textarea {
  white-space: revert;
}

meter {
  -webkit-appearance: revert;
  appearance: revert;
}

:where(pre) {
  all: revert;
  box-sizing: border-box;
}

::-webkit-input-placeholder {
  color: unset;
}

:-ms-input-placeholder {
  color: unset;
}

::-ms-input-placeholder {
  color: unset;
}

::placeholder {
  color: unset;
}

:where([hidden]) {
  display: none;
}

:where([contenteditable]:not([contenteditable=false])) {
  -moz-user-modify: read-write;
  -webkit-user-modify: read-write;
  overflow-wrap: break-word;
  -webkit-line-break: after-white-space;
  -webkit-user-select: auto;
}

:where([draggable=true]) {
  -webkit-user-drag: element;
}

:where(dialog:modal) {
  all: revert;
  box-sizing: border-box;
}

::-webkit-details-marker {
  display: none;
}

div#container {
  margin-top: 0;
}

header#gHeader {
  display: none;
}

.floating {
  display: none !important;
}

.sp-hamburger, .sp-menu-overlay {
  display: none;
}

@media screen and (min-width: 768px) {
  #gFooter {
    display: none !important;
  }
}
h1, h2, h3, figure {
  margin: 0;
}

img {
  height: auto;
  max-width: inherit;
  vertical-align: bottom;
  width: 100%;
}

b, strong {
  font-weight: bolder;
}

:root {
  --font-NotoSansJP: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic Medium", YuGothic, sans-serif;
  --font-NotoSerifJP: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", YuMincho, "BiZ UDMincho", "MS Mincho", serif;
}

body {
  background: #fff;
  color: var(--color-font);
  font-family: var(--font-NotoSerifJP);
  font-weight: 400;
  line-height: 1;
  margin-inline: auto;
  overflow-wrap: break-word;
  width: 100%;
}
@media screen and (max-width: 767px) {
  body {
    font-size: 3.733vw;
  }
}
@media screen and (min-width: 768px) {
  body {
    font-size: 28px;
    min-width: 1024px;
  }
}

@media screen and (max-width: 768px) {
  .footer__bnr.sp.bottomList {
    display: none !important;
  }
  .footer__bnr.sp.bottomList.sp-footer {
    display: block !important;
  }
  .footer__bnr.sp.sp-footer span.footer__bnr__radius img {
    margin-bottom: 4px;
  }
  .footer__bnr.bottomList.sp-footer ul li:nth-of-type(1) {
    flex: 0.3;
    background: #fff;
    letter-spacing: 2px;
    line-height: 1.2;
    color: #48322a;
  }
  .footer__bnr.bottomList.sp-footer ul li:nth-of-type(1) a {
    color: #333;
    font-size: 12px;
  }
  .footer__bnr.bottomList.sp-footer ul li:nth-of-type(1) p {
    padding-top: 2px;
  }
  .footer__bnr.bottomList.sp-footer ul li:nth-of-type(1) a:before {
    content: "";
    display: inline-block;
    width: 25px;
    height: 25px;
    background-image: url(/wp-content/themes/arluis/assets/images/fair-cp/index/_nav-book_brown.svg);
    background-size: contain;
    vertical-align: middle;
    background-repeat: no-repeat;
  }
  .footer__bnr.bottomList.sp-footer ul li:nth-of-type(2) {
    background: #deab4e;
    flex: 1;
    font-size: 15px;
    padding-top: 5px;
    font-weight: 700;
    letter-spacing: 1px;
  }
  .footer__bnr.bottomList.sp-footer ul li:nth-of-type(2) a {
    margin-top: -16px;
    color: #fff;
  }
  .footer__bnr.bottomList.sp-footer ul li:nth-of-type(2) a:before {
    content: "今なら割引キャンペーン実施中！";
    background-image: none;
    width: auto;
    height: auto;
    margin-bottom: 0;
  }
}
@media screen and (min-width: 768px) {
  .l-wrapper {
    position: relative;
  }
}

@media screen and (max-width: 767px) {
  .l-pc {
    display: none !important;
  }
}
@media screen and (min-width: 768px) {
  .l-pc {
    height: 100%;
    position: fixed;
    top: 0;
    z-index: 15;
  }
  .l-pc::before {
    background: 50% 50%/cover no-repeat;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
  }
  .l-pc--left {
    align-items: center;
    display: flex;
    justify-content: flex-end;
    left: 0;
    width: calc((100vw - 750px) / 2 + 172px);
  }
  .l-pc--left::before {
    background-image: url(/wp-content/themes/arluis/assets/images/fair-cp/sd_yakusoku/pc_bg_01.webp);
  }
  .l-pc--right {
    right: 0;
    width: calc((100vw - 750px) / 2 - 172px);
  }
  .l-pc--right::before {
    background-image: url(/wp-content/themes/arluis/assets/images/fair-cp/sd_yakusoku/pc_bg_02.webp);
  }
  .l-pc__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    max-width: 300px;
    padding-block: 5%;
    -webkit-padding-end: 50px;
            padding-inline-end: 50px;
    position: relative;
    width: 90%;
    z-index: 5;
  }
  .l-pc-logo {
    margin-inline: auto;
    max-width: 240px;
    width: 100%;
  }
  .l-pc-nav {
    border: solid #fff;
    border-width: 1px 0;
    display: grid;
    gap: 40px;
    grid-template-columns: 1fr;
    -webkit-margin-before: 15px;
            margin-block-start: 15px;
    padding-block: 40px 35px;
  }
  .l-pc-nav__item {
    font-size: 18px;
    letter-spacing: 0.1em;
  }
  .l-pc-nav__about {
    font-size: 18px;
    letter-spacing: 0.1em;
    line-height: 1.667;
    -webkit-margin-before: 45px;
            margin-block-start: 45px;
  }
  .l-pc-nav__link {
    color: #fff !important;
  }
}
@media screen and (min-width: 768px) and (any-hover: hover) {
  .l-pc-nav__link:hover {
    text-decoration: underline;
    -webkit-text-decoration-skip-ink: none;
            text-decoration-skip-ink: none;
  }
}
@media screen and (min-width: 768px) and (max-height: 700px) {
  .l-pc-logo {
    width: 80%;
  }
  .l-pc-nav {
    gap: 1.3em;
  }
  .l-pc-nav__about {
    -webkit-margin-before: 1.5em;
            margin-block-start: 1.5em;
  }
}
.l-contents {
  background: #fff;
}
@media screen and (min-width: 768px) {
  .l-contents {
    margin-inline: auto;
    position: relative;
    -webkit-transform: translateX(172px);
            transform: translateX(172px);
    width: 750px;
    z-index: 10;
  }
}

@media screen and (min-width: 768px) and (max-width: 1099px) {
  .l-pc--left {
    width: calc(100vw - 750px);
  }
  .l-pc--right {
    display: none;
  }
  .l-contents {
    margin-inline: auto 0;
    -webkit-transform: translateX(0);
            transform: translateX(0);
    z-index: 20;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .l-pc--left {
    display: none;
  }
  .l-pc--right {
    display: inherit;
    width: 100%;
  }
  .l-contents {
    margin-inline: auto;
  }
}
.c-button {
  margin-inline: auto;
}

.c-button__link {
  border-radius: 100vw;
  cursor: pointer;
  display: block;
  position: relative;
}

.c-button__arrow {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2030%2030%22%3E%20%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M15%200C6.72%200%200%206.72%200%2015s6.72%2015%2015%2015%2015-6.72%2015-15S23.28%200%2015%200m6.68%2015.73-8.29%208.29-2.35-2.35%206.28-6.28-7.07-7.07%202.35-2.35%209.51%209.51z%22%2F%3E%3C%2Fsvg%3E");
  background-position: 0 0;
  background-size: contain;
  position: absolute;
  top: 50%;
  transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}
@media screen and (max-width: 767px) {
  .c-button__arrow {
    height: 4vw;
    -webkit-margin-before: -2vw;
            margin-block-start: -2vw;
    right: 3.333vw;
    width: 4vw;
  }
}
@media screen and (min-width: 768px) {
  .c-button__arrow {
    height: 30px;
    -webkit-margin-before: -15px;
            margin-block-start: -15px;
    right: 25px;
    width: 30px;
  }
}

@media (any-hover: hover) {
  .c-button__link:hover {
    opacity: 0.8;
  }
  .c-button__link:hover .c-button__arrow {
    -webkit-transform: translateX(20%);
            transform: translateX(20%);
  }
}

.p-kv {
  background: url(/wp-content/themes/arluis/assets/images/fair-cp/sd_yakusoku/kv_bg.webp) 0 0/100% 100% no-repeat;
  position: relative;
}
@media screen and (max-width: 767px) {
  .p-kv {
    height: 173.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-kv {
    height: 1300px;
  }
}

@media screen and (max-width: 767px) {
  .p-kv__lead {
    -webkit-margin-start: 70vw;
            margin-inline-start: 70vw;
    width: 6.133vw;
  }
}
@media screen and (min-width: 768px) {
  .p-kv__lead {
    -webkit-margin-start: 525px;
            margin-inline-start: 525px;
    width: 46px;
  }
}

.p-kv__title {
  position: absolute;
}
@media screen and (max-width: 767px) {
  .p-kv__title {
    left: 16.667vw;
    top: 28vw;
    width: 66.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-kv__title {
    left: 125px;
    top: 210px;
    width: 500px;
  }
}

.p-intro {
  background: #ebf5fa;
}
@media screen and (max-width: 767px) {
  .p-intro {
    padding-block: 11.333vw 20vw;
  }
}
@media screen and (min-width: 768px) {
  .p-intro {
    padding-block: 85px 150px;
  }
}

.p-intro__text {
  color: #738287;
  letter-spacing: 0.2em;
  line-height: 2;
}
@media screen and (max-width: 767px) {
  .p-intro__text {
    font-size: 4.533vw;
  }
}
@media screen and (min-width: 768px) {
  .p-intro__text {
    font-size: 34px;
  }
}

.p-intro__movie {
  aspect-ratio: 9/16;
  overflow: hidden;
  margin-inline: auto;
  position: relative;
}
@media screen and (max-width: 767px) {
  .p-intro__movie {
    border-radius: 5.333vw;
    -webkit-margin-before: 14vw;
            margin-block-start: 14vw;
    width: 84vw;
  }
}
@media screen and (min-width: 768px) {
  .p-intro__movie {
    border-radius: 40px;
    -webkit-margin-before: 105px;
            margin-block-start: 105px;
    width: 630px;
  }
}
.p-intro__movie iframe, .p-intro__movie video {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.p-contents__middle {
  background-color: #ebf5fa;
  background-image: url(/wp-content/themes/arluis/assets/images/fair-cp/sd_yakusoku/bg_01.webp), url(/wp-content/themes/arluis/assets/images/fair-cp/sd_yakusoku/bg_02.webp);
  background-position: 0 0, 0 100%;
  background-repeat: no-repeat;
  background-size: 100% auto;
}

.p-story {
  background: #ebf5fa;
}
@media screen and (max-width: 767px) {
  .p-story {
    padding-block: 12.667vw 8vw;
  }
}
@media screen and (min-width: 768px) {
  .p-story {
    padding-block: 95px 60px;
  }
}

.p-story__catch {
  color: #96825a;
  letter-spacing: 0.1em;
  line-height: 1.476;
}
@media screen and (max-width: 767px) {
  .p-story__catch {
    font-size: 5.6vw;
    -webkit-margin-before: 4vw;
            margin-block-start: 4vw;
  }
}
@media screen and (min-width: 768px) {
  .p-story__catch {
    font-size: 42px;
    -webkit-margin-before: 30px;
            margin-block-start: 30px;
  }
}

.p-story__text {
  color: #96918c;
  letter-spacing: 0.1em;
  line-height: 2.143;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-story__text {
    width: 86.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-story__text {
    width: 650px;
  }
}

@media screen and (max-width: 767px) {
  .p-story__text--top {
    -webkit-margin-before: 4.667vw;
            margin-block-start: 4.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-story__text--top {
    -webkit-margin-before: 35px;
            margin-block-start: 35px;
  }
}

.p-story__image-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
}
@media screen and (max-width: 767px) {
  .p-story__image-list {
    gap: 2.667vw;
    -webkit-margin-before: 10vw;
            margin-block-start: 10vw;
  }
}
@media screen and (min-width: 768px) {
  .p-story__image-list {
    gap: 20px;
    -webkit-margin-before: 75px;
            margin-block-start: 75px;
  }
}

.p-story__image {
  overflow: hidden;
}

.p-story__image--top {
  -webkit-margin-end: auto;
          margin-inline-end: auto;
}
@media screen and (max-width: 767px) {
  .p-story__image--top {
    border-top-right-radius: 4vw;
    width: 89.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-story__image--top {
    border-top-right-radius: 30px;
    width: 670px;
  }
}

@media screen and (max-width: 767px) {
  .p-story__image--left {
    border-bottom-left-radius: 4vw;
    width: 33.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-story__image--left {
    border-bottom-left-radius: 30px;
    width: 250px;
  }
}

@media screen and (max-width: 767px) {
  .p-story__image--right {
    border-bottom-right-radius: 4vw;
    width: 57.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-story__image--right {
    border-bottom-right-radius: 30px;
    width: 430px;
  }
}

@media screen and (max-width: 767px) {
  .p-story__text--bottom {
    -webkit-margin-before: 8vw;
            margin-block-start: 8vw;
  }
}
@media screen and (min-width: 768px) {
  .p-story__text--bottom {
    -webkit-margin-before: 60px;
            margin-block-start: 60px;
  }
}

@media screen and (max-width: 767px) {
  .p-episodes {
    padding-block: 8vw;
  }
}
@media screen and (min-width: 768px) {
  .p-episodes {
    padding-block: 60px;
  }
}

.p-episodes__track-outer {
  background: rgba(255, 255, 255, 0.7);
}
@media screen and (max-width: 767px) {
  .p-episodes__track-outer {
    -webkit-margin-before: -2.4vw;
            margin-block-start: -2.4vw;
    padding-block: 5.6vw 6.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-episodes__track-outer {
    -webkit-margin-before: -18px;
            margin-block-start: -18px;
    padding-block: 42px 50px;
  }
}

.p-episodes__track {
  margin-inline: auto 0;
}
@media screen and (max-width: 767px) {
  .p-episodes__track {
    width: 93.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-episodes__track {
    width: 700px;
  }
}

.p-episodes__images {
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .p-episodes__images {
    border-radius: 2.667vw;
    -webkit-margin-before: 0.8vw;
            margin-block-start: 0.8vw;
  }
}
@media screen and (min-width: 768px) {
  .p-episodes__images {
    border-radius: 20px;
    -webkit-margin-before: 6px;
            margin-block-start: 6px;
  }
}
.p-episodes__images a {
  cursor: pointer;
}
@media (any-hover: hover) {
  .p-episodes__images a:hover {
    opacity: 0.8;
  }
}

@media screen and (max-width: 767px) {
  .p-episodes__pagination {
    -webkit-margin-before: 2vw;
            margin-block-start: 2vw;
  }
}
@media screen and (min-width: 768px) {
  .p-episodes__pagination {
    -webkit-margin-before: 15px;
            margin-block-start: 15px;
  }
}

.p-episodes__pagination__page {
  background: transparent;
  border: 1px solid #738287;
  border-radius: 50%;
}
@media screen and (max-width: 767px) {
  .p-episodes__pagination__page {
    height: 1.867vw;
    margin-inline: 1.067vw;
    width: 1.867vw;
  }
}
@media screen and (min-width: 768px) {
  .p-episodes__pagination__page {
    height: 14px;
    margin-inline: 8px;
    width: 14px;
  }
}
.p-episodes__pagination__page.is-active {
  background: #738287;
}

.p-sns {
  background: #fff;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-sns {
    box-shadow: 1.067vw 1.333vw 0.667vw rgba(140, 130, 116, 0.3);
    -webkit-margin-before: 8.267vw;
            margin-block-start: 8.267vw;
    padding-block: 8.267vw 10vw;
    width: 78.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-sns {
    box-shadow: 8px 10px 5px rgba(140, 130, 116, 0.3);
    -webkit-margin-before: 62px;
            margin-block-start: 62px;
    padding-block: 62px 75px;
    width: 590px;
  }
}

.p-sns__title {
  color: #808080;
  letter-spacing: 0.02em;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .p-sns__title {
    font-size: 4vw;
  }
}
@media screen and (min-width: 768px) {
  .p-sns__title {
    font-size: 30px;
  }
}

.p-sns__list {
  display: grid;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .p-sns__list {
    gap: 2.667vw;
    grid-template-columns: repeat(3, 9.333vw);
    -webkit-margin-before: 4vw;
            margin-block-start: 4vw;
  }
}
@media screen and (min-width: 768px) {
  .p-sns__list {
    gap: 20px;
    grid-template-columns: repeat(3, 70px);
    -webkit-margin-before: 30px;
            margin-block-start: 30px;
  }
}

@media (any-hover: hover) {
  .p-sns__button:hover {
    opacity: 0.8;
  }
}

@media screen and (max-width: 767px) {
  .p-character {
    padding-block: 7.333vw 8vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character {
    padding-block: 55px 60px;
  }
}

.p-character__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .p-character__list {
    gap: 6vw 1.333vw;
    -webkit-margin-before: 4.667vw;
            margin-block-start: 4.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character__list {
    gap: 45px 10px;
    -webkit-margin-before: 35px;
            margin-block-start: 35px;
  }
}

.p-character__item {
  position: relative;
}
@media screen and (max-width: 767px) {
  .p-character__item {
    width: 42.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character__item {
    width: 320px;
  }
}

.p-character__icon {
  align-items: center;
  aspect-ratio: 1/1;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  left: 0;
  position: absolute;
  top: 0;
  z-index: 5;
}
@media screen and (max-width: 767px) {
  .p-character__icon {
    height: 13.333vw;
    width: 13.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character__icon {
    height: 100px;
    width: 100px;
  }
}

.p-character__icon-label {
  color: #fff;
  letter-spacing: 0.04em;
  line-height: 1.208;
}
@media screen and (max-width: 767px) {
  .p-character__icon-label {
    font-size: 3.2vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character__icon-label {
    font-size: 24px;
  }
}

.p-character__pic {
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-character__pic {
    width: 39.2vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character__pic {
    width: 294px;
  }
}

.p-character__name {
  color: #738287;
  letter-spacing: 0.08em;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .p-character__name {
    font-size: 5.6vw;
    -webkit-margin-before: -13.333vw;
            margin-block-start: -13.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character__name {
    font-size: 42px;
    -webkit-margin-before: -100px;
            margin-block-start: -100px;
  }
}
.p-character__name rt {
  color: #fff;
  letter-spacing: 0.3em;
  -webkit-margin-after: 0.2em;
          margin-block-end: 0.2em;
  ruby-align: center;
}
@media screen and (max-width: 767px) {
  .p-character__name rt {
    font-size: 2.4vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character__name rt {
    font-size: 18px;
  }
}

.p-character__actor {
  color: #738287;
  letter-spacing: 0.04em;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .p-character__actor {
    font-size: 2.4vw;
    -webkit-margin-before: 1.333vw;
            margin-block-start: 1.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character__actor {
    font-size: 18px;
    -webkit-margin-before: 10px;
            margin-block-start: 10px;
  }
}

.p-character__text {
  color: #808080;
  letter-spacing: 0.04em;
  line-height: 1.583;
}
@media screen and (max-width: 767px) {
  .p-character__text {
    font-size: 3.2vw;
    -webkit-margin-before: 2.667vw;
            margin-block-start: 2.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character__text {
    font-size: 24px;
    -webkit-margin-before: 20px;
            margin-block-start: 20px;
  }
}

@media screen and (max-width: 767px) {
  .p-character__item--heroine {
    width: 64vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character__item--heroine {
    width: 480px;
  }
}
.p-character__item--heroine .p-character__icon {
  background: #78bec8;
}
@media screen and (max-width: 767px) {
  .p-character__item--heroine .p-character__icon {
    height: 16vw;
    left: 4vw;
    top: 2vw;
    width: 16vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character__item--heroine .p-character__icon {
    height: 120px;
    left: 30px;
    top: 15px;
    width: 120px;
  }
}
@media screen and (max-width: 767px) {
  .p-character__item--heroine .p-character__pic {
    width: 56.533vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character__item--heroine .p-character__pic {
    width: 424px;
  }
}
@media screen and (max-width: 767px) {
  .p-character__item--heroine .p-character__name {
    font-size: 6.4vw;
    -webkit-margin-before: -17.333vw;
            margin-block-start: -17.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character__item--heroine .p-character__name {
    font-size: 48px;
    -webkit-margin-before: -130px;
            margin-block-start: -130px;
  }
}
@media screen and (max-width: 767px) {
  .p-character__item--heroine .p-character__actor {
    font-size: 3.2vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character__item--heroine .p-character__actor {
    font-size: 24px;
  }
}
@media screen and (max-width: 767px) {
  .p-character__item--heroine .p-character__text {
    -webkit-margin-before: 3.333vw;
            margin-block-start: 3.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-character__item--heroine .p-character__text {
    -webkit-margin-before: 25px;
            margin-block-start: 25px;
  }
}

.p-character__item--bride .p-character__icon {
  background: #d7a5aa;
}

.p-character__item--groom .p-character__icon {
  background: #81a5cc;
}

.p-character__item--junior .p-character__icon {
  background: #d7a584;
}

.p-character__item--father .p-character__name rt {
  color: transparent;
}

@media screen and (max-width: 767px) {
  .p-gallary {
    padding-block: 7.333vw 10.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-gallary {
    padding-block: 55px 80px;
  }
}

.p-gallary__track {
  margin-inline: auto 0;
}
@media screen and (max-width: 767px) {
  .p-gallary__track {
    -webkit-margin-before: 3.333vw;
            margin-block-start: 3.333vw;
    width: 93.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-gallary__track {
    -webkit-margin-before: 25px;
            margin-block-start: 25px;
    width: 700px;
  }
}

.p-gallary__slide {
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .p-gallary__slide {
    border-radius: 2.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-gallary__slide {
    border-radius: 20px;
  }
}

@media screen and (max-width: 767px) {
  .p-making {
    padding-block: 2.933vw 15.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-making {
    padding-block: 22px 115px;
  }
}

.p-making__title {
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-making__title {
    width: 78.933vw;
  }
}
@media screen and (min-width: 768px) {
  .p-making__title {
    width: 592px;
  }
}

.p-making__video {
  aspect-ratio: 16/9;
  margin-inline: auto;
  position: relative;
}
@media screen and (max-width: 767px) {
  .p-making__video {
    -webkit-margin-before: 2.933vw;
            margin-block-start: 2.933vw;
    width: 78.933vw;
  }
}
@media screen and (min-width: 768px) {
  .p-making__video {
    -webkit-margin-before: 22px;
            margin-block-start: 22px;
    width: 592px;
  }
}
.p-making__video iframe {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

@media screen and (max-width: 767px) {
  .p-place {
    -webkit-padding-before: 10.667vw;
            padding-block-start: 10.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-place {
    -webkit-padding-before: 80px;
            padding-block-start: 80px;
  }
}

.p-place__lead {
  color: #48322a;
  letter-spacing: 0.16em;
  line-height: 1.471;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-place__lead {
    font-size: 4.533vw;
    width: 86.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-place__lead {
    font-size: 34px;
    width: 650px;
  }
}

.p-place__logo {
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-place__logo {
    -webkit-margin-before: 4vw;
            margin-block-start: 4vw;
    width: 40.8vw;
  }
}
@media screen and (min-width: 768px) {
  .p-place__logo {
    -webkit-margin-before: 30px;
            margin-block-start: 30px;
    width: 306px;
  }
}

.p-place__figure {
  position: relative;
}
@media screen and (max-width: 767px) {
  .p-place__figure {
    -webkit-margin-before: 8vw;
            margin-block-start: 8vw;
  }
}
@media screen and (min-width: 768px) {
  .p-place__figure {
    -webkit-margin-before: 60px;
            margin-block-start: 60px;
  }
}

.p-place__figcaption {
  color: #666;
  letter-spacing: 0.14em;
  line-height: 1.933;
  position: absolute;
}
@media screen and (max-width: 767px) {
  .p-place__figcaption {
    font-size: 4vw;
    left: 6.667vw;
    top: 120vw;
    width: 86.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-place__figcaption {
    font-size: 30px;
    left: 50px;
    top: 900px;
    width: 650px;
  }
}

@media screen and (max-width: 767px) {
  .p-resorts {
    -webkit-margin-before: -13.333vw;
            margin-block-start: -13.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-resorts {
    -webkit-margin-before: -100px;
            margin-block-start: -100px;
  }
}

.p-resorts__overview {
  position: relative;
}

@media screen and (max-width: 767px) {
  .p-resorts__overview-image {
    width: 72vw;
  }
}
@media screen and (min-width: 768px) {
  .p-resorts__overview-image {
    width: 540px;
  }
}

.p-resorts__overview-lead {
  position: absolute;
}
@media screen and (max-width: 767px) {
  .p-resorts__overview-lead {
    right: 7.733vw;
    top: 6.667vw;
    width: 24.267vw;
  }
}
@media screen and (min-width: 768px) {
  .p-resorts__overview-lead {
    right: 58px;
    top: 50px;
    width: 182px;
  }
}

.p-resorts__chandelier {
  position: relative;
  z-index: 5;
}
@media screen and (max-width: 767px) {
  .p-resorts__chandelier {
    -webkit-margin-before: -8vw;
            margin-block-start: -8vw;
  }
}
@media screen and (min-width: 768px) {
  .p-resorts__chandelier {
    -webkit-margin-before: -60px;
            margin-block-start: -60px;
  }
}

.p-resorts__chandelier-image {
  margin-inline: auto 0;
}
@media screen and (max-width: 767px) {
  .p-resorts__chandelier-image {
    width: 53.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-resorts__chandelier-image {
    width: 400px;
  }
}

.p-resorts__chandelier-text {
  color: #808080;
  letter-spacing: 0.04em;
  line-height: 1.792;
  position: absolute;
  text-align: left;
}
@media screen and (max-width: 767px) {
  .p-resorts__chandelier-text {
    font-size: 3.2vw;
    left: 8vw;
    top: 16vw;
    width: 37.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-resorts__chandelier-text {
    font-size: 24px;
    left: 60px;
    top: 120px;
    width: 280px;
  }
}

.p-view {
  background: url(/wp-content/themes/arluis/assets/images/fair-cp/sd_yakusoku/view_bg.webp) 0 100%/100% auto no-repeat;
}
@media screen and (max-width: 767px) {
  .p-view {
    height: 160vw;
    -webkit-margin-before: -29.333vw;
            margin-block-start: -29.333vw;
    -webkit-padding-before: 40.667vw;
            padding-block-start: 40.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-view {
    height: 1200px;
    -webkit-margin-before: -220px;
            margin-block-start: -220px;
    -webkit-padding-before: 305px;
            padding-block-start: 305px;
  }
}

.p-view__text {
  color: #fff;
  letter-spacing: 0.12em;
  line-height: 1.647;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-view__text {
    font-size: 4.533vw;
    width: 86.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-view__text {
    font-size: 34px;
    width: 650px;
  }
}

@media screen and (max-width: 767px) {
  .p-view__button {
    -webkit-margin-before: 68vw;
            margin-block-start: 68vw;
    width: 66.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-view__button {
    -webkit-margin-before: 510px;
            margin-block-start: 510px;
    width: 500px;
  }
}

@media screen and (max-width: 767px) {
  .p-about__contents {
    padding-block: 12vw 16vw;
  }
}
@media screen and (min-width: 768px) {
  .p-about__contents {
    padding-block: 90px 120px;
  }
}

.p-about__text {
  color: #808080;
  letter-spacing: 0.04em;
  line-height: 2.071;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-about__text {
    width: 86.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-about__text {
    width: 650px;
  }
}

@media screen and (max-width: 767px) {
  .p-about__text--bottom {
    -webkit-margin-before: 5.333vw;
            margin-block-start: 5.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-about__text--bottom {
    -webkit-margin-before: 40px;
            margin-block-start: 40px;
  }
}

.p-about__logo {
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-about__logo {
    -webkit-margin-before: 8.667vw;
            margin-block-start: 8.667vw;
    width: 76vw;
  }
}
@media screen and (min-width: 768px) {
  .p-about__logo {
    -webkit-margin-before: 65px;
            margin-block-start: 65px;
    width: 570px;
  }
}

@media screen and (max-width: 767px) {
  .p-about__button {
    -webkit-margin-before: 10.667vw;
            margin-block-start: 10.667vw;
    width: 66.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-about__button {
    -webkit-margin-before: 80px;
            margin-block-start: 80px;
    width: 500px;
  }
}

.p-recruit {
  background: #fff;
  margin-inline: auto;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .p-recruit {
    border-radius: 5.333vw;
    box-shadow: 1.333vw 1.333vw 1.333vw rgba(110, 118, 130, 0.2);
    -webkit-padding-after: 8vw;
            padding-block-end: 8vw;
    width: 86.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-recruit {
    border-radius: 40px;
    box-shadow: 10px 10px 10px rgba(110, 118, 130, 0.2);
    -webkit-padding-after: 60px;
            padding-block-end: 60px;
    width: 650px;
  }
}

.p-recruit__text {
  color: #666;
  letter-spacing: 0.04em;
  line-height: 1.692;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-recruit__text {
    font-size: 3.467vw;
    -webkit-margin-before: 8vw;
            margin-block-start: 8vw;
    width: 73.333vw;
  }
}
@media screen and (min-width: 768px) {
  .p-recruit__text {
    font-size: 26px;
    -webkit-margin-before: 30px;
            margin-block-start: 30px;
    width: 550px;
  }
}

@media screen and (max-width: 767px) {
  .p-recruit__button {
    -webkit-margin-before: 3.333vw;
            margin-block-start: 3.333vw;
    width: 42.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-recruit__button {
    -webkit-margin-before: 25px;
            margin-block-start: 25px;
    width: 320px;
  }
}
.p-recruit__button .c-button__arrow {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2030%2030%22%3E%20%3Cpath%20fill%3D%22%23738287%22%20d%3D%22M15%200C6.72%200%200%206.72%200%2015s6.72%2015%2015%2015%2015-6.72%2015-15S23.28%200%2015%200m6.68%2015.73-8.29%208.29-2.35-2.35%206.28-6.28-7.07-7.07%202.35-2.35%209.51%209.51z%22%2F%3E%3C%2Fsvg%3E");
}
@media (any-hover: hover) {
  .p-recruit__button .c-button__link:hover {
    background-color: #e3e6e7;
  }
}

@media screen and (max-width: 767px) {
  .p-location {
    -webkit-padding-before: 14.667vw;
            padding-block-start: 14.667vw;
  }
}
@media screen and (min-width: 768px) {
  .p-location {
    -webkit-padding-before: 110px;
            padding-block-start: 110px;
  }
}

.p-location__title {
  border-bottom: 1px solid #738287;
  color: #738287;
  letter-spacing: 0.07em;
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-location__title {
    -webkit-margin-before: 7.333vw;
            margin-block-start: 7.333vw;
    -webkit-padding-after: 1.333vw;
            padding-block-end: 1.333vw;
    width: 17.867vw;
  }
}
@media screen and (min-width: 768px) {
  .p-location__title {
    -webkit-margin-before: 55px;
            margin-block-start: 55px;
    -webkit-padding-after: 10px;
            padding-block-end: 10px;
    width: 134px;
  }
}

@media screen and (max-width: 767px) {
  .p-location__contents {
    -webkit-margin-before: 10vw;
            margin-block-start: 10vw;
  }
}
@media screen and (min-width: 768px) {
  .p-location__contents {
    -webkit-margin-before: 75px;
            margin-block-start: 75px;
  }
}

.p-location__logo {
  margin-inline: auto;
}
@media screen and (max-width: 767px) {
  .p-location__logo {
    width: 53.867vw;
  }
}
@media screen and (min-width: 768px) {
  .p-location__logo {
    width: 404px;
  }
}
@media (any-hover: hover) {
  .p-location__logo a:hover {
    opacity: 0.8;
  }
}

@media screen and (max-width: 767px) {
  .p-location__image {
    -webkit-margin-before: 4.267vw;
            margin-block-start: 4.267vw;
  }
}
@media screen and (min-width: 768px) {
  .p-location__image {
    -webkit-margin-before: 32px;
            margin-block-start: 32px;
  }
}

@media screen and (min-width: 768px) {
  .u-only-sp {
    display: none !important;
  }
}
@media screen and (max-width: 767px) {
  .u-only-pc {
    display: none !important;
  }
}
.u-sup {
  font-size: 58.3%;
  vertical-align: super;
}

.u-align-center {
  text-align: center;
}

.u-align-right {
  text-align: right;
}

.u-visibility-hidden {
  visibility: hidden;
}

.u-font-notosans {
  font-family: var(--font-NotoSansJP);
}

.u-fw900 {
  font-weight: 900;
}

.u-fw700 {
  font-weight: 700;
}

.u-fw600 {
  font-weight: 600;
}

.u-fw500 {
  font-weight: 500;
}

.u-fw400 {
  font-weight: 400;
}

.u-fw300 {
  font-weight: 300;
}

.u-visually-hidden {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}/*# sourceMappingURL=style.css.map */

.footGood__img img {
  width: auto;
}