@charset "UTF-8";
/* ========================================

  nariwai
  https://nariwai-nagoya.jp

======================================== */
/* ========================================
  [common style]
======================================== */
/* ------------------------------
  html, body
------------------------------ */
@import url("https://fonts.googleapis.com/css2?family=Baskervville:ital@0;1&display=swap");
html {
  font-size: 0.625em;
}

body {
  padding-top: 5em;
  background: url(../images/common/body_bg.jpg) center center;
  font-family: "Yu Mincho", "YuMincho", serif;
  letter-spacing: 0.1em;
  color: #595757;
}
@media screen and (min-width: 1367px) {
  body {
    font-size: 1.4em;
  }
}
@media screen and (max-width: 1366px) {
  body {
    font-size: 1.2em;
  }
}
body::after {
  content: "";
  position: fixed;
  z-index: 9999;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  pointer-events: none;
  opacity: 1;
  visibility: visible;
  transition: 0.5s;
}
body.visible::after {
  opacity: 0;
  visibility: hidden;
}

img {
  max-width: 100%;
}

em {
  font-style: normal;
}

dt {
  font-weight: 400;
}

a.-close {
  pointer-events: none;
  opacity: 0.5;
}

/* ------------------------------
  header
------------------------------ */
.header {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
}
.headerInner {
  width: min(96%, 1780px);
  height: 5em;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .headerInner {
    width: 100%;
  }
}

.headerLogo {
  width: min(40%, 200px);
}
@media screen and (max-width: 767px) {
  .headerLogo {
    margin-left: min(4%, 2em);
  }
}

.headerCart a {
  position: relative;
  display: block;
  padding-left: 2.75em;
  line-height: 1.2;
  font-size: 0.8em;
}
.headerCart a::before {
  content: "";
  position: absolute;
  top: calc(50% - 1em);
  left: 0;
  width: 2em;
  height: 2em;
  background: url(/assets/images/common/icon_cart__black.svg) center center/contain no-repeat;
}
.headerCart a span {
  display: block;
}
.headerCart a span:first-child {
  font-size: 1.2em;
}
@media screen and (min-width: 768px) {
  .headerCart {
    order: 4;
    margin-left: 1em;
  }
}
@media screen and (max-width: 767px) {
  .headerCart {
    margin-left: auto;
  }
}

.navBtn {
  display: none;
}
@media screen and (max-width: 767px) {
  .navBtn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 5em;
    height: 5em;
    cursor: pointer;
  }
  .navBtn span {
    position: relative;
    display: block;
    width: 2em;
    height: 0.2em;
    background-color: currentColor;
  }
  .navBtn span::before, .navBtn span::after {
    content: "";
    position: absolute;
    display: block;
    left: 0;
    width: 2em;
    height: 0.2em;
    background-color: currentColor;
  }
  .navBtn span::before {
    top: -0.5em;
  }
  .navBtn span::after {
    bottom: -0.5em;
  }
}

/* ------------------------------
  g_nav
------------------------------ */
.g_nav {
  display: flex;
  margin-left: auto;
}
.g_nav > ul {
  display: flex;
}
.g_nav > ul > li {
  position: relative;
  margin-right: 2em;
  line-height: 2;
}
.g_nav > ul > li > * {
  font-family: "Baskervville", serif;
  font-style: italic;
  font-size: 1.142em;
  transition: 0.2s;
}
.g_nav > ul > li > *.hover {
  color: #18b7cd;
}
@media screen and (min-width: 768px) {
  .g_nav > ul > li > span.forsp {
    display: none;
  }
  .g_nav > ul > li ul {
    position: absolute;
    top: 2em;
    right: -8em;
    padding: 0.5em 0;
    background-color: #fff;
    font-size: 1em;
    white-space: nowrap;
    visibility: hidden;
    opacity: 0;
    transition: 0.3s;
  }
  .g_nav > ul > li ul li a {
    display: block;
    padding: 0.25em 1.5em;
    transition: 0.2s;
  }
  .g_nav > ul > li ul li a.hover {
    color: #18b7cd;
  }
  .g_nav > ul > li:hover ul {
    right: -7em;
    visibility: visible;
    opacity: 1;
  }
}
.g_nav > p {
  width: 1.428em;
}
@media screen and (max-width: 767px) {
  .g_nav {
    display: block;
    position: fixed;
    top: 5em;
    left: 100vw;
    width: 100%;
    height: calc(100vh - 5em);
    padding: min(10%, 5em) 0;
    background-color: #eee;
    opacity: 0;
    transition: opacity 0.3s 0s, left 0s 0.3s;
  }
  .g_nav.opened {
    left: 0;
    opacity: 1;
    transition: opacity 0.3s 0s, left 0s 0s;
  }
  .g_nav > ul {
    display: block;
    width: 80%;
    margin: 0 auto;
  }
  .g_nav > ul a {
    display: block;
  }
  .g_nav > ul > li {
    margin: 0;
    padding-bottom: 1em;
    font-size: 1.4em;
  }
  .g_nav > ul > li > * {
    display: block;
  }
  .g_nav > ul > li > span.forpc {
    display: none;
  }
  .g_nav > ul > li ul {
    display: none;
    margin-left: 1em;
    padding-top: 0.5em;
    font-size: 0.9em;
    transition: none;
  }
  .g_nav > ul > li ul li {
    margin: 0;
  }
}

/* ------------------------------
  footer
------------------------------ */
.footer {
  border-top: solid 1px #b2b2b2;
  background-color: #fff;
}
.footerInner {
  display: flex;
  align-items: stretch;
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 2.6041666667% 0;
}
@media screen and (min-width: 768px) {
  .footerInner.-forSp {
    display: none !important;
  }
}
@media screen and (max-width: 767px) {
  .footerInner {
    display: block;
    max-width: 400px;
  }
}
.footerBox01 {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-right: 10%;
}
@media screen and (max-width: 767px) {
  .footerBox01 {
    width: min(60%, 300px);
    margin: 0 auto;
    padding: 2em 0;
  }
}
.footerContact {
  margin-top: 2em;
  text-align: center;
}
.footerContact a {
  display: inline-block;
  width: 70%;
  padding: 0.2em 1em 0.35em;
  border-radius: 0.4em;
  background-color: #595757;
  text-align: center;
  font-family: "Baskervville", serif;
  font-size: 1.428em;
  color: #fff;
}
.footerContact a.hover {
  opacity: 0.8;
}
@media screen and (max-width: 767px) {
  .footerContact a {
    width: 100%;
  }
}
.footerBox02 > ul {
  display: flex;
  flex-wrap: wrap;
  width: 20em;
  font-family: "Baskervville", serif;
  font-style: italic;
  font-size: 1.285em;
}
@media screen and (max-width: 767px) {
  .footerBox02 > ul {
    width: 90%;
    margin: 0 auto 2em;
    font-size: 1em;
  }
}
.footerBox02 > ul > li:nth-child(odd) {
  width: 7em;
}
.footerBox02 > ul > li:nth-child(even) {
  width: calc(100% - 7em);
}
.footerBox02 > ul > li:not(:nth-last-child(-n+2)) {
  margin-bottom: 1em;
}
.footerBox02 > ul > li > span {
  cursor: pointer;
}
.footerBox02 > ul > li ul {
  margin-left: 1em;
  font-size: 0.8em;
  white-space: nowrap;
  display: none;
  opacity: 0;
  transition: opacity 0.3s 0.3s;
}
.footerBox02 > ul > li ul.visible {
  opacity: 1;
}
.footerBox02 > ul > li ul li {
  padding-top: 1em;
}
.footerBox02 > ul > li ul li small {
  font-size: 0.7em;
}
.footerBox02 a.hover {
  text-decoration: underline;
}
.footerCopyright {
  font-size: 0.857em;
}
@media screen and (max-width: 767px) {
  .footerCopyright {
    width: 75%;
    margin-bottom: 3%;
    line-height: 1.6;
  }
  .footerCopyright.-forPc {
    display: none !important;
  }
}

.pagetop {
  position: fixed;
  bottom: 5vw;
  right: 5vw;
}
.pagetop a {
  padding-right: 1.5em;
  font-family: "Baskervville", serif;
  font-style: italic;
  font-size: 0.857em;
  transition: 0.3s;
}
.pagetop a::before {
  content: "";
  position: absolute;
  display: block;
  bottom: 0;
  right: 0;
  width: 0;
  height: 8em;
  border-right: solid 1px #ccc;
}
.pagetop a::after {
  content: "";
  position: absolute;
  display: block;
  bottom: 0;
  right: 0;
  width: 0;
  height: 2.5em;
  border-right: solid 2px currentColor;
  transition: 0.3s;
}
.pagetop a.hover {
  color: #18b7cd;
}
.pagetop a.hover::after {
  border-color: #18b7cd;
}

/* ------------------------------
  layout
------------------------------ */
.secInner {
  margin: 0 auto;
}
.secInner.-small {
  width: min(90%, 1200px);
}
.secInner.-middle {
  width: min(96%, 1500px);
}
.secInner.-large {
  width: 100%;
}

.ancPoint {
  position: absolute;
  top: -5em;
  left: 0;
}

/* ========================================
  Top
  /index.html
======================================== */
/* [ common ]
------------------------------ */
.topSec {
  position: relative;
}
.topSec--heading {
  margin-bottom: min(3em, 15%);
  text-align: center;
  font-family: "Baskervville", serif;
  font-style: italic;
  font-size: 2em;
}

/* mainvisual
------------------------------ */
.mainvisual {
  position: relative;
  width: 100%;
  height: calc(100vh - 5em);
}
.mainvisual picture img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
.mainvisual .scroll {
  position: absolute;
  bottom: 5vw;
  left: 5vw;
  width: 2.642em;
}

/* topConcept
------------------------------ */
.topConcept {
  position: relative;
}
.topConcept .secInner {
  padding: min(15%, 14.285em) 0;
  text-align: center;
}
.topConcept--copy {
  margin-bottom: 1em;
  font-size: 1.714em;
}
.topConcept--text {
  line-height: 2.533;
  font-size: 1.071em;
}
.topConcept--text span {
  display: inline-block;
}

/* topContent
------------------------------ */
.topContent {
  position: relative;
  width: 100%;
  height: clamp(460px, 36vw, 800px);
  margin-bottom: 0.714em;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}
@media screen and (max-width: 767px) {
  .topContent {
    display: none;
  }
}
.topContent::before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  background-color: #808080;
  mix-blend-mode: multiply;
}
.topContent--logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 180px;
}
@media screen and (max-width: 767px) {
  .topContent--logo {
    width: min(36%, 180px);
  }
}
.topContent--base {
  position: relative;
  display: flex;
  align-items: stretch;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transition: 0.5s ease-in-out;
}
.topContent--base::after {
  content: "";
  display: block;
  width: min(70%, 100% - 560px);
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  transition: 0.5s ease-in-out;
}
.topContent--body {
  position: relative;
  width: max(30%, 560px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.topContent--body::before {
  content: "";
  position: absolute;
  display: block;
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
  background-color: #fff;
  opacity: 0;
  transition: width 0.5s ease-out, opacity 1.5s;
}
.topContent--bodyInner {
  position: relative;
  width: min(71.42%, 400px);
  margin: 0 12% 0 auto;
}
.topContent--bodyInner > * {
  transform: translateX(2em);
  opacity: 0;
  transition: 0.5s;
}
.topContent--catch {
  margin-bottom: 1em;
  font-size: 1.071em;
}
.topContent--heading {
  margin-bottom: 3em;
}
.topContent--heading::after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  margin-top: 2em;
  border-top: solid 1px currentColor;
  transition: width 0.5s;
}
.topContent--heading em {
  font-size: 1.714em;
  letter-spacing: 0.3em;
}
.topContent--heading span {
  margin-left: 1.5em;
  font-family: "Baskervville", serif;
  font-style: italic;
}
.topContent--copy dt {
  margin-bottom: 1em;
  line-height: 1.6;
  font-size: 1.285em;
}
.topContent--copy dd {
  line-height: 1.785;
  text-align: justify;
}
.topContent--keywords {
  margin-top: 3em;
}
.topContent--keywords li {
  display: inline-block;
  min-width: 8em;
  margin: 0 0.5em 0.75em 0;
  padding: 0.25em 1em 0.2em;
  border: solid 1px currentColor;
  border-radius: 2em;
  text-align: center;
}
.topContent--button {
  margin-top: 3em;
}
.topContent--button a {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  padding: 0.35em;
  border-radius: 0.4em;
  background-color: #595757;
  line-height: 1;
  color: #fff;
  transition: background-color 0.3s ease-out;
}
.topContent--button a.hover {
  background-color: #18b7cd;
}
.topContent--button a.btn--store {
  font-family: "Baskervville", serif;
  font-style: italic;
  font-size: 1.285em;
}
.topContent--button a.btn--store::before {
  content: "";
  display: block;
  width: 1.222em;
  height: 1.111em;
  margin-right: 0.5em;
  background: url(../images/common/icon_cart.svg) center center/contain no-repeat;
}
.topContent--more {
  margin-top: 3em;
}
.topContent--more a {
  display: flex;
  align-items: center;
  line-height: 1;
  font-family: "Baskervville", serif;
  font-style: italic;
  font-size: 1.428em;
  letter-spacing: 0.2em;
  transition: 0.3s;
}
.topContent--more a::after {
  content: "";
  display: block;
  width: 2em;
  height: 0;
  margin-left: 1em;
  border-top: solid 1px currentColor;
  transition: width 0.5s ease-out;
}
.topContent--more a.hover {
  color: #18b7cd;
}
.topContent--more a.hover::after {
  width: 5em;
}
.topContent:hover .topContent--base, .topContent.tb_hover .topContent--base {
  opacity: 1;
  visibility: visible;
}
.topContent:hover .topContent--body::before, .topContent.tb_hover .topContent--body::before {
  width: 100%;
  opacity: 100;
}
.topContent:hover .topContent--bodyInner > *, .topContent.tb_hover .topContent--bodyInner > * {
  transform: translateX(0);
  opacity: 1;
  transition-delay: 0.5s;
}
.topContent:hover .topContent--heading::after, .topContent.tb_hover .topContent--heading::after {
  width: 2em;
  transition-delay: 0.75s;
}
.topContent__sp {
  display: none;
}
@media screen and (max-width: 767px) {
  .topContent__sp {
    display: block;
    margin-top: 0.5em;
    background-position: center;
    background-size: cover;
  }
  .topContent__sp a {
    position: relative;
    display: block;
    width: 100%;
    height: min(100vw, 400px);
  }
  .topContent__sp a::before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    background-color: #808080;
    mix-blend-mode: multiply;
  }
}

.topTsugite {
  background-image: url(../images/index/tsugite_img01.webp);
}
.topTsugite .topContent--base::after {
  background-image: url(../images/index/tsugite_img02.webp);
}

.topAoi {
  background-image: url(../images/index/aoi_img01.webp);
}
.topAoi .topContent--base::after {
  background-image: url(../images/index/aoi_img02.webp);
}

.topAoinohako {
  background-image: url(../images/index/aoinohako_img01.webp);
}
.topAoinohako .topContent--base::after {
  background-image: url(../images/index/aoinohako_img02.webp);
}

.topAoiacl {
  background-image: url(../images/index/aoiacl_img01.webp);
}
.topAoiacl .topContent--base::after {
  background-image: url(../images/index/aoiacl_img02.webp);
}

/* topSisei
------------------------------ */
.topSisei a {
  display: block;
  max-width: 800px;
  margin: min(10%, 7.142em) auto;
  background-color: #fff;
  transition: background-color 0.3s ease-out;
}
.topSisei a.hover {
  background-color: rgba(24, 183, 205, 0.2);
}
.topSisei--bnr {
  padding: 1em;
  display: flex;
  align-items: center;
  border: solid 1px #999;
}
@media screen and (max-width: 580px) {
  .topSisei--bnr {
    padding: 0.75em;
  }
}
.topSisei--text {
  flex: 1;
  text-align: center;
}
.topSisei--copy {
  margin-bottom: 1.25em;
  padding-left: 0.3em;
  font-size: 1.214em;
  font-weight: 700;
  letter-spacing: 0.3em;
}
@media screen and (max-width: 580px) {
  .topSisei--copy {
    margin-bottom: 0.5em;
    padding-left: 0;
    font-size: 1em;
    letter-spacing: 0;
  }
}
.topSisei--name dt img {
  height: 2.142em;
}
@media screen and (max-width: 580px) {
  .topSisei--name dt img {
    height: 1.6em;
  }
}
.topSisei--name dd {
  margin-top: 1.25em;
}
@media screen and (max-width: 580px) {
  .topSisei--name dd {
    margin-top: 0.75em;
  }
}
.topSisei--name dd span {
  display: inline-block;
  padding: 0.3em 1em 0.25em;
  border: solid 1px #808080;
  border-radius: 0.4em;
  line-height: 1;
  font-size: 0.928em;
}
.topSisei--img {
  width: 35%;
}

/* topAreamap
------------------------------ */
.topAreamap {
  background-color: #7d7d7d;
}
.topAreamap .secInner {
  padding: min(10%, 7.142em) 0;
}
.topAreamap .topSec--heading {
  color: #fff;
}
.topAreamap--map {
  position: relative;
}
.topAreamap--pin {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 767px) {
  .topAreamap--pin {
    display: none;
  }
}
.topAreamap--pin li {
  position: absolute;
  width: 2%;
  cursor: pointer;
  transition: 0.3s ease-in-out;
}
.topAreamap--pin li.current {
  transform: scale(1.3, 1.3);
}
.topAreamap--pin li#pin01 {
  top: 43.8914027149%;
  left: 20.5557415467%;
}
.topAreamap--pin li#pin02 {
  top: 8.7481146305%;
  left: 28.322731838%;
}
.topAreamap--pin li#pin03 {
  top: 20.814479638%;
  left: 41.9149648477%;
}
.topAreamap--pin li#pin06a {
  top: 40.874811463%;
  left: 50.1841312354%;
}
.topAreamap--pin li#pin04 {
  top: 9.0497737557%;
  left: 72.9494476063%;
}
.topAreamap--pin li#pin05 {
  top: 9.0497737557%;
  left: 81.8547037161%;
}
.topAreamap--pin li#pin06b {
  top: 24.7360482655%;
  left: 92.1325744895%;
}
.topAreamap--pin li::before {
  content: "";
  display: block;
  width: 100%;
  height: 0;
  padding-top: 133.3333333333%;
  background: url(../images/index/areamap_pin.svg) center center/contain no-repeat;
}
@media screen and (max-width: 767px) {
  .topAreamap--parkingIcon {
    display: none;
  }
}
.topAreamap--parkingIcon li {
  position: absolute;
  width: 3.5955808504%;
  height: 27.3604826546%;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}
.topAreamap--parkingIcon li#parking01 {
  top: 58.7028657617%;
  left: 35.6076330767%;
}
.topAreamap--parkingIcon li#parking02 {
  top: 58.7028657617%;
  left: 39.203213927%;
}
.topAreamap--parkingIcon li#parking03 {
  top: 58.7028657617%;
  left: 42.8724472715%;
}
.topAreamap--parkingIcon li#parking04 {
  top: 47.9034690799%;
  left: 44.994978239%;
  height: 0;
  cursor: default;
  justify-content: flex-start;
  align-items: flex-start;
}
.topAreamap--parkingIcon li::before {
  content: "";
  display: block;
  width: 40%;
  height: 0;
  padding-top: 100%;
  background: url(../images/index/areamap_parking.svg) center center/contain no-repeat;
  transition: 0.3s ease-in-out;
}
.topAreamap--parkingIcon li.current::before {
  transform: scale(1.3, 1.3);
}
@media screen and (max-width: 767px) {
  .topAreamap--parkingImg {
    display: none;
  }
}
.topAreamap--parkingImg li {
  position: absolute;
  top: -37.5263951735%;
  left: 36.8262470706%;
  width: 26.6666666667%;
  opacity: 0;
  visibility: hidden;
  transition: 0.5s;
}
.topAreamap--parkingImg li.current {
  opacity: 1;
  visibility: visible;
}
.topAreamap--parkingImg li.pimg-bicycle {
  top: 34.5701357466%;
  left: 39.953130231%;
  width: 20%;
}

/* topShoplist
------------------------------ */
@media screen and (min-width: 768px) {
  .topShoplist {
    background-color: rgba(255, 255, 255, 0.1);
  }
  .topShoplist ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .topShoplist ul li {
    position: relative;
    width: 44.6666666667%;
    background-color: #fff;
  }
  .topShoplist ul li:not(:nth-last-child(-n+2)) {
    margin-bottom: 4.6666666667%;
  }
  .topShoplist ul li::before {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(24, 183, 205, 0.2);
    opacity: 0;
    transition: 0.3s ease-in-out;
  }
  .topShoplist ul li.current::before {
    opacity: 1;
  }
  .topShoplist ul li a {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: 0.3s ease-in-out;
  }
  .topShoplist ul li a figure {
    width: 32.8358208955%;
  }
  .topShoplist ul li a p {
    flex: 1;
    padding: 1em;
    text-align: center;
    font-size: 1.2857142857em;
  }
  .topShoplist ul li a p.p_num {
    display: none;
  }
  .topShoplist ul li a p .num {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .topShoplist {
    background-color: #fff;
  }
  .topShoplist .secInner {
    width: 100%;
    margin: 0;
    padding: 0;
  }
  .topShoplist ul li a {
    position: relative;
    display: block;
    padding: 2.5em 5%;
    border-bottom: solid 1px #999;
  }
  .topShoplist ul li a p {
    display: flex;
    align-items: center;
  }
  .topShoplist ul li a p:first-child {
    font-size: 4vw;
  }
  .topShoplist ul li a p .num {
    width: 1.2em;
    height: 1.2em;
    margin-right: 0.5em;
    padding-top: 0.1em;
    border-radius: 50%;
    background-color: #ff5854;
    text-align: center;
    color: #fff;
  }
  .topShoplist ul li a p.p_num {
    position: absolute;
    bottom: 1em;
    left: calc(5% + 0.25em);
    display: flex;
    align-items: center;
  }
  .topShoplist ul li a p.p_num::before {
    content: "";
    width: 1.2em;
    height: 1.2em;
    margin-right: 0.5em;
    background: url(/assets/images/index/areamap_parking.svg) center center/contain no-repeat;
  }
  .topShoplist figure {
    display: none;
  }
}

/* topAccess
------------------------------ */
.topAccess .secInner {
  padding: min(15%, 7.142em) 0;
}
.topAccess--gmap {
  border: solid 1px #999;
}
.topAccess--gmap iframe {
  width: 100%;
}
.topAccess--address {
  text-align: center;
}
.topAccess--address dt {
  margin-top: 2em;
  font-size: 1.2em;
}
.topAccess--address dd {
  margin-top: 1em;
  font-size: 0.9333333333em;
}
.topAccess--outline {
  margin-top: 10%;
}
.topAccess--outline dt {
  margin: 2em 0 0.5em;
  padding-bottom: 0.5em;
  font-size: 1.2142857143em;
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 0.5em;
}
.topAccess--outline dd {
  font-size: 1.0714285714em;
}
.topAccess--outline dd span {
  display: inline-block;
  margin-right: 1em;
}
@media screen and (max-width: 767px) {
  .topAccess--outline dd span {
    display: block;
    line-height: 1.4;
  }
}
.topAccess--outline dd a {
  text-decoration: underline;
  color: #18b7cd;
}
.topAccess--outline dd a.hover {
  text-decoration: none;
}

/* ========================================
  Pages Common
======================================== */
.pageSec.-bg_white {
  background-color: #fff;
}

.pageHeader {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: clamp(400px, 30.2083333333vw, 580px);
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}
@media screen and (max-width: 767px) {
  .pageHeader {
    height: min(60vw, 300px);
  }
}
.-tsugite .pageHeader {
  background-image: url(/assets/images/index/tsugite_title.webp);
}
.-aoinohako .pageHeader {
  background-image: url(/assets/images/pages/aoinohako_title.webp);
}
.-aoiacl .pageHeader {
  background-image: url(/assets/images/pages/aoiacl_title.webp);
}
.-aoi .pageHeader {
  background-image: url(/assets/images/pages/aoi_title.webp);
}

.pageTitle {
  width: 9.375%;
}
@media screen and (max-width: 767px) {
  .pageTitle {
    width: min(30%, 160px);
  }
}

.pageContent .secInner {
  padding: clamp(3em, 4.9479166667vw, 8em) 0;
}
@media screen and (max-width: 767px) {
  .pageContent .secInner {
    padding: 12% 0;
  }
}
.pageContent .secHeading {
  margin-bottom: clamp(3em, 4.9479166667vw, 8em);
  line-height: 1.4;
  text-align: center;
  letter-spacing: 0.2em;
}
.pageContent .secHeading > em {
  display: block;
  font-size: 1.7142857143em;
}
.pageContent .secHeading > em.-f_italic {
  font-style: italic;
}
.pageContent .secHeading > em span {
  display: inline-block;
  padding: 0 0.25em;
}
.pageContent .secHeading > span {
  display: block;
  margin-top: 1em;
  font-size: 0.7857142857em;
}
.pageContent .secCatch {
  margin: 1em 0;
  line-height: 1.6;
  text-align: center;
  font-size: 1.7142857143em;
}
.pageContent .secCatch span {
  display: inline-block;
}
.pageContent .secCopy {
  margin: 1.5em 0;
  line-height: 2.5;
  text-align: center;
  font-size: 1.0714285714em;
}
.pageContent .link--instagram {
  margin: clamp(4em, 10%, 100px) 0 min(5%, 50px);
  text-align: center;
}
.pageContent .link--instagram a {
  transition: opacity 0.3s;
}
.pageContent .link--instagram a:hover {
  opacity: 0.7;
}
.pageContent .link--instagram img {
  width: 150px;
}
.pageContent #sb_instagram.sbi_col_3 #sbi_images {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.pageContent #sb_instagram.sbi_col_3 #sbi_images .sbi_item {
  width: 28%;
  margin-bottom: 8% !important;
}
@media screen and (max-width: 767px) {
  .pageContent #sb_instagram.sbi_col_3 #sbi_images .sbi_item {
    width: 48%;
    margin-bottom: 4% !important;
  }
  .pageContent #sb_instagram.sbi_col_3 #sbi_images .sbi_item:last-child {
    display: none;
  }
}

.pageBlock {
  display: flex;
  background-color: #fff;
}
.pageBlock--txt > * {
  width: min(80%, 480px);
  margin: 0 auto;
}
.pageBlock--catch {
  margin-bottom: 1em;
  line-height: 1.6;
  font-size: 1.2857142857em;
}
.pageBlock--copy {
  line-height: 1.7857142857;
  text-align: justify;
}
.pageBlock--img img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
@media screen and (min-width: 768px) {
  .pageBlock {
    align-items: stretch;
  }
  .-blockType_a .pageBlock:nth-child(even) {
    flex-direction: row-reverse;
  }
  .-blockType_b .pageBlock:nth-child(odd) {
    flex-direction: row-reverse;
  }
  .pageBlock > * {
    width: 50%;
  }
  .pageBlock--txt {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 5% 0;
  }
}
@media screen and (max-width: 767px) {
  .pageBlock {
    flex-direction: column-reverse;
  }
  .pageBlock--txt {
    padding: min(10%, 5em) 0;
  }
}

.pageBnr {
  width: min(80%, 670px);
  margin: 0 auto;
}
.pageBnr a {
  position: relative;
  display: flex;
  align-items: center;
  background-color: #124f6e;
  color: #fff;
}
.pageBnr a::before {
  content: "";
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(18, 79, 110, 0.3);
  mix-blend-mode: multiply;
  opacity: 0;
  transition: 0.3s ease-in-out;
}
.pageBnr a.hover::before {
  opacity: 1;
}
.pageBnr p {
  position: relative;
  flex: 1;
  text-align: center;
  line-height: 1.6;
  font-size: 128.5714285714%;
  letter-spacing: 0.3em;
}
.pageBnr p em {
  font-size: 1.2em;
}
.pageBnr p span {
  margin-top: 0.5em;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: "Baskervville", serif;
  font-style: italic;
  font-size: 0.9em;
  letter-spacing: 0.1em;
}
.pageBnr p span::before {
  content: "";
  display: inline-block;
  width: 1.2em;
  height: 1.2em;
  margin-right: 0.25em;
  background: url(/assets/images/common/icon_cart.svg) center center/contain no-repeat;
}
.pageBnr figure {
  width: 32.8358208955%;
}
@media screen and (max-width: 767px) {
  .pageBnr {
    width: min(100%, 400px);
  }
  .pageBnr p {
    font-size: 1em;
  }
}

.pageLink {
  margin-top: 2em;
  text-align: center;
}
.pageLink a.linkPdf {
  display: inline-block;
  transition: color 0.3s;
}
.pageLink a.linkPdf::after {
  content: "";
  display: inline-block;
  vertical-align: -0.1em;
  width: 1.2em;
  height: 1.2em;
  line-height: 0;
  margin-left: 0.5em;
  background: url(/assets/images/common/icon_instagram.svg) center center/contain no-repeat;
}
.pageLink a.linkPdf:hover {
  color: #18b7cd;
}

.pageFooter .pfBnr {
  display: flex;
  align-items: stretch;
}
@media screen and (max-width: 767px) {
  .pageFooter .pfBnr {
    display: block;
  }
}
.pageFooter .pfBnr li {
  width: 33.3333333333%;
}
@media screen and (max-width: 767px) {
  .pageFooter .pfBnr li {
    width: 100%;
  }
}
.pageFooter .pfBnr li a {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  height: 100%;
  padding: clamp(5em, 6vw, 20em) 1em;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}
.pageFooter .pfBnr li a.link-tsugite {
  background-image: url(/assets/images/index/footerBnr_tsugite.webp?v20231030);
}
.pageFooter .pfBnr li a.link-aoi {
  background-image: url(/assets/images/index/footerBnr_aoi.webp?v20231030);
}
.pageFooter .pfBnr li a.link-aoiacl {
  background-image: url(/assets/images/index/footerBnr_aoiacl.webp?v20231030);
}
.pageFooter .pfBnr li a.link-aoinohako {
  background-image: url(/assets/images/index/footerBnr_aoinohako.webp?v20231030);
}
.pageFooter .pfBnr li a::before {
  content: "";
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(128, 128, 128, 0.7);
  mix-blend-mode: multiply;
  transition: background-color 0.3s;
}
@media screen and (min-width: 768px) {
  .pageFooter .pfBnr li a:hover::before {
    background-color: gray;
  }
}
.pageFooter .pfBnr li a span {
  position: relative;
  margin: 0 0.25em;
  white-space: nowrap;
  line-height: 1.8;
  font-size: 128.5714285714%;
  letter-spacing: 0.2em;
  color: #fff;
}

/* calendar
------------------------------ */
.calWrap {
  position: relative;
  margin-bottom: 2em;
}

.calSlides {
  position: static;
  width: min(100%, 1080px);
  margin: 0 auto;
}
.calSlides .slide {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .calSlides .slide {
    height: auto;
  }
}
.calSlides .slide img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: calc(80vh - 5em);
  -o-object-fit: contain;
     object-fit: contain;
}
.calSlides .slick-arrow {
  position: absolute;
  z-index: 1;
  top: 0;
  width: 6em;
  height: 100%;
  display: flex;
  align-items: center;
  outline: none;
}
.calSlides .slick-arrow.slick-disabled {
  opacity: 0.5;
  cursor: default;
}
.calSlides .slick-arrow::before {
  content: "";
  width: 2em;
  height: 0;
  padding-top: 100%;
  background: url(/assets/images/index/slick-arrow.svg) center center/contain no-repeat;
}
@media screen and (max-width: 767px) {
  .calSlides .slick-arrow::before {
    width: 1em;
  }
}
.calSlides .slick-arrow::after {
  font-family: "Yu Gothic", "YuGothic", sans-serif;
  font-size: 0.8em;
  white-space: nowrap;
}
.calSlides .slick-prev {
  left: 5%;
}
@media screen and (max-width: 767px) {
  .calSlides .slick-prev {
    left: 1%;
  }
}
.calSlides .slick-prev::after {
  content: "前の月";
}
@media screen and (min-width: 768px) {
  .calSlides .slick-prev::after {
    padding-left: 1em;
  }
}
.calSlides .slick-next {
  right: 5%;
  flex-direction: row-reverse;
}
@media screen and (max-width: 767px) {
  .calSlides .slick-next {
    right: 1%;
  }
}
.calSlides .slick-next::before {
  transform: rotateY(180deg);
}
.calSlides .slick-next::after {
  content: "次の月";
}
@media screen and (min-width: 768px) {
  .calSlides .slick-next::after {
    margin-right: 1em;
  }
}
.calSlides .slick-dots {
  position: absolute;
  bottom: -2em;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  justify-content: center;
  align-items: center;
}
.calSlides .slick-dots li {
  margin: 0 0.5em;
  opacity: 0.5;
}
.calSlides .slick-dots li.slick-active {
  opacity: 1;
}
.calSlides .slick-dots li button {
  width: 0.8em;
  height: 0;
  padding-top: 100%;
  overflow: hidden;
  background-color: #ccc;
  border-radius: 50%;
  outline: none;
}

/* information
------------------------------ */
.infoWrap {
  width: 100%;
  max-width: 980px;
  margin: 0 auto;
}

.infoBox:not(:first-child) {
  margin-top: 10%;
  padding-top: 10%;
  border-top: solid 1px #b2b2b2;
}
@media screen and (max-width: 767px) {
  .infoBox:not(:first-child) {
    margin-top: 10%;
  }
}
.infoBox .infoImage img {
  display: block;
  max-width: 100%;
  max-height: 80vh;
  margin: 0 auto;
}
.infoBox .infoImage + .infoImage {
  margin-top: 5%;
}

.infoText {
  margin-top: 2em;
  text-align: center;
  font-family: sans-serif;
}
.infoText > * {
  margin-top: 0.5em;
  line-height: 1.8;
  font-size: 1.2857142857em;
}
.infoText a {
  text-decoration: underline;
  color: #009FE8;
}
.infoText a:hover {
  text-decoration: none;
}/*# sourceMappingURL=style.css.map */