@charset "UTF-8";
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html {
  color: #333;
  height: 100%;
  font-size: 62.5%;
}

body {
  font-family: "Noto Sans JP", sans-serif;
}

/*デバイス毎の出し分け-----------------------------------------------*/
.pc {
  display: block !important;
}

.pc-only {
  display: block !important;
}

.tablet-only {
  display: none !important;
}

.sp {
  display: none !important;
}

@media screen and (max-width: 1080px) and (min-width: 481px) {
  .pc {
    display: block !important;
  }

  .pc-only {
    display: none !important;
  }

  .tablet-only {
    display: block !important;
  }
}
@media screen and (max-width: 480px) {
  .pc {
    display: none !important;
  }

  .tablet-only {
    display: none !important;
  }

  .sp {
    display: block !important;
  }
}
/*共通パーツ-----------------------------------------------*/
.inner {
  max-width: 1080px;
  margin: 0 auto;
  padding: 70px 0;
}
@media screen and (max-width: 480px) {
  .inner {
    padding: 50px 0;
    width: 92%;
  }
}

.cta-inner {
  max-width: 1080px;
  padding: 50px 0;
  margin: 0 auto;
}
@media screen and (max-width: 480px) {
  .cta-inner {
    padding: 30px 0;
  }
}

.wide-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 70px 0;
}
@media screen and (max-width: 480px) {
  .wide-inner {
    padding: 50px 0;
  }
}

.generic__sub {
  color: #737373;
  font-size: 2.6rem;
  opacity: 0.2;
  font-family: "Cormorant Garamond", serif;
}
@media screen and (max-width: 480px) {
  .generic__sub {
    font-size: 1.5rem;
  }
}

.generic__sub::after {
  content: url(../images/line.png);
  display: inline-block;
  vertical-align: 6px;
  padding-left: 20px;
}
@media screen and (max-width: 480px) {
  .generic__sub::after {
    content: none;
  }
}

.generic__title {
  color: #CAA470;
  font-size: 3.8rem;
  margin: 10px 0 20px;
  font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 480px) {
  .generic__title {
    font-size: 2.8rem;
    line-height: 1.5;
  }
}

p {
  font-size: 1.8rem;
  line-height: 2;
}
@media screen and (max-width: 480px) {
  p {
    font-size: 1.4rem;
  }
}

img {
  width: 100%;
}

a {
  text-decoration: none;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}

a:hover {
  opacity: 0.8;
}

/* header -----------------------------------------------*/
header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 70px;
  padding: 0 20px;
}
@media screen and (max-width: 480px) {
  header {
    padding: 0 5%;
    height: 50px;
  }
}
header .logo {
  width: 180px;
}
@media screen and (max-width: 480px) {
  header .logo {
    width: 35%;
  }
}
@media screen and (max-width: 480px) {
  header .header-right {
    width: 40%;
  }
}

/* mv -----------------------------------------------*/
.main {
  background: url(../images/mv-bg.jpg) no-repeat center/cover;
}
@media screen and (max-width: 480px) {
  .main {
    background: url(../images/sp/mv-bg.jpg) no-repeat center/cover;
  }
}
.main__catch {
  padding: 300px 0 150px;
  color: #fff;
  text-align: center;
}
.main__catch__title {
  font-size: 9rem;
  letter-spacing: 1rem;
  font-family: "Cormorant Garamond", serif;
  margin-bottom: 30px;
}
.main__catch__title p {
  font-size: 9rem;
  display: inline;
}
@media screen and (max-width: 480px) {
  .main__catch__title p {
    font-size: 5.4rem;
  }
}
@media screen and (max-width: 480px) {
  .main__catch__title {
    font-size: 4.2rem;
    letter-spacing: 0.3rem;
  }
}
.main__catch__sub {
  font-size: 3rem;
  letter-spacing: 0.5rem;
  font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 480px) {
  .main__catch__sub {
    font-size: 1.8rem;
    line-height: 1.3;
  }
}

/*=== 光りながら出現させるためのCSS ===*/
.glowAnime span {
  opacity: 0;
}

/*アニメーションで透過を0から1に変化させtext-shadowをつける*/
.glowAnime.glow span {
  -webkit-animation: glow_anime_on 2s ease-out forwards;
          animation: glow_anime_on 2s ease-out forwards;
}

@-webkit-keyframes glow_anime_on {
  0% {
    opacity: 0;
    text-shadow: 0 0 0 #fff, 0 0 0 #fff;
  }
  20% {
    opacity: 0;
    text-shadow: 0 0 0 #fff, 0 0 0 #fff;
  }
  35% {
    opacity: 1;
    text-shadow: 0 0 10px #fff, 0 0 15px #fff;
  }
  50% {
    opacity: 1;
    text-shadow: 0 0 0 #fff, 0 0 0 #fff;
  }
  100% {
    opacity: 1;
    text-shadow: 0px 5px 10px #333;
  }
}

@keyframes glow_anime_on {
  0% {
    opacity: 0;
    text-shadow: 0 0 0 #fff, 0 0 0 #fff;
  }
  20% {
    opacity: 0;
    text-shadow: 0 0 0 #fff, 0 0 0 #fff;
  }
  35% {
    opacity: 1;
    text-shadow: 0 0 10px #fff, 0 0 15px #fff;
  }
  50% {
    opacity: 1;
    text-shadow: 0 0 0 #fff, 0 0 0 #fff;
  }
  100% {
    opacity: 1;
    text-shadow: 0px 5px 10px #333;
  }
}
/* concept -----------------------------------------------*/
.concept {
  background-color: #FDFBFB;
  text-align: center;
}
.concept__headding {
  font-size: 11rem;
  color: #737373;
  opacity: 0.2;
  font-family: "Cormorant Garamond", serif;
  margin-top: -30px;
}
@media screen and (max-width: 480px) {
  .concept__headding {
    font-size: 7rem;
  }
}
@media screen and (max-width: 320px) {
  .concept__headding {
    font-size: 6rem;
  }
}
.concept__title {
  color: #CAA470;
  font-size: 4.8rem;
  letter-spacing: 1rem;
  font-family: "Noto Serif JP", serif;
  margin: -75px 0 20px;
}
@media screen and (max-width: 480px) {
  .concept__title {
    font-size: 2.9rem;
    letter-spacing: 5px;
    margin-top: -30px;
  }
}
@media screen and (max-width: 320px) {
  .concept__title {
    font-size: 2.3rem;
  }
}
.concept__sub {
  color: #CAA470;
  font-size: 2rem;
  position: relative;
  font-family: "Noto Serif JP", serif;
  margin-bottom: 70px;
}
@media screen and (max-width: 480px) {
  .concept__sub {
    font-size: 1.4rem;
    margin-bottom: 30px;
  }
}
.concept__sub::before, .concept__sub::after {
  content: "";
  display: block;
  width: 180px;
  height: 2px;
  background-color: #CAA470;
  position: absolute;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .concept__sub::before, .concept__sub::after {
    width: 0;
  }
}
@media screen and (max-width: 480px) {
  .concept__sub::before, .concept__sub::after {
    width: 0;
  }
}
.concept__sub::before {
  top: 10px;
  left: 140px;
}
.concept__sub::after {
  top: 10px;
  right: 140px;
}
.concept__desc {
  margin-bottom: 50px;
}
@media screen and (max-width: 480px) {
  .concept__desc {
    margin-bottom: 10px;
  }
}

/* cta -----------------------------------------------*/
.cta {
  background: url(../images/cta-bg.jpg) no-repeat center/cover;
  color: #fff;
  text-align: center;
}
.cta__title {
  font-size: 3.8rem;
  position: relative;
  font-family: "Noto Serif JP", serif;
  margin-bottom: 15px;
}
@media screen and (max-width: 480px) {
  .cta__title {
    font-size: 2.3rem;
  }
}
.cta__title::before, .cta__title::after {
  content: "";
  display: block;
  width: 180px;
  height: 2px;
  background-color: #fff;
  position: absolute;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .cta__title::before, .cta__title::after {
    width: 0;
  }
}
@media screen and (max-width: 480px) {
  .cta__title::before, .cta__title::after {
    width: 0;
  }
}
.cta__title::before {
  top: 20px;
  left: 130px;
}
.cta__title::after {
  top: 20px;
  right: 130px;
}
.cta__sub {
  font-family: "Cormorant Garamond", serif;
  font-size: 2.6rem;
  margin-bottom: 30px;
}
@media screen and (max-width: 480px) {
  .cta__sub {
    font-size: 1.5rem;
    margin-bottom: 20px;
  }
}
.cta__wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 80%;
  margin: 0 auto;
}
@media screen and (max-width: 480px) {
  .cta__wrap {
    display: block;
  }
}
.cta__wrap__img {
  width: 42%;
}
@media screen and (max-width: 480px) {
  .cta__wrap__img {
    width: 100%;
  }
}
.cta__wrap__detail {
  width: 58%;
  padding: 20px 30px;
  background-color: #fff;
}
@media screen and (max-width: 480px) {
  .cta__wrap__detail {
    width: 100%;
    padding: 20px;
  }
}
.cta__wrap__detail__img {
  margin-bottom: 30px;
}
@media screen and (max-width: 480px) {
  .cta__wrap__detail__img {
    margin-bottom: 20px;
  }
}

/* point -----------------------------------------------*/
.points .generic__sub, .points .generic__title {
  padding-left: 100px;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .points .generic__sub, .points .generic__title {
    padding-left: 10px;
  }
}
@media screen and (max-width: 480px) {
  .points .generic__sub, .points .generic__title {
    padding-left: 5%;
  }
}
.points .generic__title {
  padding-bottom: 70px;
}
@media screen and (max-width: 480px) {
  .points .generic__title {
    padding-bottom: 30px;
  }
}
.points__wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
@media screen and (max-width: 480px) {
  .points__wrap {
    display: block;
  }
}
.points__wrap__detail {
  width: 50%;
  padding: 50px 0 0 100px;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .points__wrap__detail {
    padding: 0 0 0 10px;
  }
}
@media screen and (max-width: 480px) {
  .points__wrap__detail {
    width: 95%;
    padding: 20px 2% 30px 5%;
  }
}
.points__wrap__detail__num {
  width: 125px;
  margin-bottom: 20px;
}
.points__wrap__detail__title {
  color: #CAA470;
  font-size: 3rem;
  font-family: "Noto Serif JP", serif;
  margin-bottom: 40px;
}
@media screen and (max-width: 480px) {
  .points__wrap__detail__title {
    font-size: 2rem;
    margin-bottom: 20px;
  }
}
.points__wrap__detail__list li {
  padding: 10px 0 10px 40px;
  position: relative;
  font-size: 1.8rem;
  position: relative;
}
@media screen and (max-width: 480px) {
  .points__wrap__detail__list li {
    line-height: 1.3;
    font-size: 1.4rem;
  }
}
.points__wrap__detail__list li::before {
  content: url(../images/checked.png);
  display: inline-block;
  width: 10px;
  height: 10px;
  position: absolute;
  top: 8px;
  left: 0px;
}
.points__wrap__img {
  width: 50%;
}
@media screen and (max-width: 480px) {
  .points__wrap__img {
    width: 100%;
  }
}
.points__wrap-rr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}
@media screen and (max-width: 480px) {
  .points__wrap-rr {
    display: block;
  }
}

/* voice -----------------------------------------------*/
.voice {
  background-color: #F5F4F2;
}
.voice__wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 100px;
}
@media screen and (max-width: 480px) {
  .voice__wrap {
    display: block;
    margin-top: 50px;
  }
}
.voice__wrap__item {
  width: 30%;
  padding: 10px;
  position: relative;
}
@media screen and (max-width: 480px) {
  .voice__wrap__item {
    width: 80%;
    margin: 0 auto;
  }
}
@media screen and (max-width: 480px) {
  .voice__wrap__item__img {
    width: 60%;
    margin: 0 auto;
  }
}
.voice__wrap__item__title {
  background-color: #fff;
  color: #CAA470;
  font-size: 2.4rem;
  text-align: center;
  padding: 25px;
  position: absolute;
  top: 280px;
  width: calc(100% - 20px);
  font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 480px) {
  .voice__wrap__item__title {
    font-size: 2rem;
    padding: 15px;
    width: 70%;
    left: 15%;
    top: 38%;
  }
}
.voice__wrap__item__desc {
  padding-top: 50px;
  width: 70%;
  margin: 0 auto;
}
.voice__wrap__item__more-btn {
  padding: 30px;
}
@media screen and (max-width: 480px) {
  .voice__wrap__item__more-btn {
    padding: 20px;
    width: 65%;
    margin: 0 auto;
  }
}

/* モーダルウィンドウ */
.modal {
  display: none;
  height: 100vh;
  position: fixed;
  top: 0;
  width: 100%;
}

.modal__bg {
  height: 100vh;
  position: absolute;
  width: 100%;
}

.modal__content {
  background: #fff;
  opacity: 0.9;
  left: 540px;
  padding: 40px 80px;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 1080px;
  height: 670px;
  z-index: 999;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .modal__content {
    width: 100%;
    left: 50%;
  }
}
@media screen and (max-width: 480px) {
  .modal__content {
    width: 90%;
    left: 45%;
    padding: 20px;
    height: auto;
  }
}
.modal__content__title {
  font-size: 2.4rem;
  color: #CAA470;
  font-family: "Noto Serif JP", serif;
  margin-bottom: 20px;
}
.modal__content__imgs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 50px 0;
}
.modal__content__btn img {
  width: 230px;
  margin: 0 auto;
  display: block;
}

/* スライダーのボタン */
.slide-arrow {
  width: 10%;
  position: absolute;
  top: 50%;
  z-index: 20;
}

.prev-arrow {
  left: -3%;
}

.next-arrow {
  right: -3%;
}

/* recommend -----------------------------------------------*/
.recommend .inner {
  padding: 70px 0 30px;
}
@media screen and (max-width: 480px) {
  .recommend .inner {
    padding: 50px 0 30px;
  }
}
.recommend__wrap {
  text-align: center;
}
.recommend__wrap__title {
  font-size: 8rem;
  color: #737373;
  opacity: 0.2;
  font-family: "Cormorant Garamond", serif;
}
@media screen and (max-width: 480px) {
  .recommend__wrap__title {
    font-size: 4.8rem;
  }
}
.recommend__wrap__sub {
  font-size: 3.6rem;
  color: #CAA470;
  font-family: "Noto Serif JP", serif;
  margin: -20px 0 50px;
}
@media screen and (max-width: 480px) {
  .recommend__wrap__sub {
    font-size: 2.1rem;
    margin: -10px 0 30px;
  }
}
.recommend__wrap__detail {
  background-color: #F5F4F2;
  padding: 20px 8px 8px 8px;
}
.recommend__wrap__detail__inner {
  border: 1px solid #CAA470;
  position: relative;
  padding: 30px;
}
@media screen and (max-width: 480px) {
  .recommend__wrap__detail__inner {
    padding: 10px;
  }
}
.recommend__wrap__detail__inner__title {
  position: absolute;
  top: -15px;
  color: #CAA470;
  font-size: 3rem;
  background-color: #F5F4F2;
  font-family: "Noto Serif JP", serif;
}
@media screen and (max-width: 480px) {
  .recommend__wrap__detail__inner__title {
    font-size: 1.8rem;
    line-height: 1.5;
  }
}
.recommend__wrap__detail__inner p {
  margin-top: 30px;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .recommend__wrap__detail__inner p {
    font-size: 1.6rem;
  }
}
.recommend .wd-wrap {
  background: url(../images/recommend-wrap-bg1.jpg) no-repeat top/cover;
}
.recommend .wd-wrap .inner {
  padding: 50px 0;
}
@media screen and (max-width: 480px) {
  .recommend .wd-wrap .inner {
    padding: 30px 0;
  }
}
.recommend .wd-wrap .recommend__wrap__detail__inner__title {
  left: 234px;
  text-align: left;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .recommend .wd-wrap .recommend__wrap__detail__inner__title {
    left: 84px;
  }
}
@media screen and (max-width: 480px) {
  .recommend .wd-wrap .recommend__wrap__detail__inner__title {
    left: 22%;
  }
}
@media screen and (max-width: 320px) {
  .recommend .wd-wrap .recommend__wrap__detail__inner__title {
    left: 19%;
  }
}
.recommend .wd-wrap__imgs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media screen and (max-width: 480px) {
  .recommend .wd-wrap__imgs {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}
.recommend .wd-wrap__imgs__img {
  width: 24%;
}
@media screen and (max-width: 480px) {
  .recommend .wd-wrap__imgs__img {
    width: 48%;
    margin-bottom: 3%;
  }
}
.recommend .wd-wrap__detail {
  margin-top: 70px;
}
@media screen and (max-width: 480px) {
  .recommend .wd-wrap__detail {
    margin-top: 30px;
  }
}
.recommend .cuisine-wrap {
  background: url(../images/recommend-wrap-bg2.jpg) no-repeat top/cover;
}
.recommend .cuisine-wrap .recommend__wrap__detail__inner__title {
  left: 163px;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .recommend .cuisine-wrap .recommend__wrap__detail__inner__title {
    left: 58px;
  }
}
@media screen and (max-width: 480px) {
  .recommend .cuisine-wrap .recommend__wrap__detail__inner__title {
    left: 25%;
  }
}
@media screen and (max-width: 320px) {
  .recommend .cuisine-wrap .recommend__wrap__detail__inner__title {
    left: 21%;
  }
}
.recommend .cuisine-wrap .wide-inner {
  position: relative;
  padding: 50px 0;
}
@media screen and (max-width: 480px) {
  .recommend .cuisine-wrap .wide-inner {
    padding: 30px 0;
  }
}
.recommend .cuisine-wrap__img {
  width: 100%;
}
.recommend .cuisine-wrap__chef {
  width: 50%;
  margin: 50px 0 200px;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .recommend .cuisine-wrap__chef {
    margin: 50px 0 300px;
  }
}
@media screen and (max-width: 480px) {
  .recommend .cuisine-wrap__chef {
    width: 88%;
    margin: 20px 0 120%;
  }
}
@media screen and (max-width: 320px) {
  .recommend .cuisine-wrap__chef {
    margin-bottom: 150%;
  }
}
.recommend .cuisine-wrap__detail {
  position: absolute;
  width: 50%;
  top: 620px;
  left: 40%;
  text-align: left;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .recommend .cuisine-wrap__detail {
    top: 460px;
  }
}
@media screen and (max-width: 480px) {
  .recommend .cuisine-wrap__detail {
    width: 90%;
    left: 5%;
    top: 50%;
  }
}
@media screen and (max-width: 320px) {
  .recommend .cuisine-wrap__detail {
    top: 46%;
  }
}
.recommend .cuisine-wrap__detail__name {
  font-size: 2.6rem;
  color: #CAA470;
  font-family: "Noto Serif JP", serif;
  margin-top: 20px;
}
@media screen and (max-width: 480px) {
  .recommend .cuisine-wrap__detail__name {
    font-size: 2rem;
  }
}
.recommend .cuisine-wrap__detail__name span {
  font-size: 2rem;
  color: #737373;
  opacity: 0.2;
  font-family: "Cormorant Garamond", serif;
  margin-left: 10px;
}
@media screen and (max-width: 480px) {
  .recommend .cuisine-wrap__detail__name span {
    font-size: 1.8rem;
  }
}
.recommend .facility-wrap {
  background: url(../images/recommend-wrap-bg3.jpg) no-repeat top/cover;
}
.recommend .facility-wrap .inner {
  padding: 50px 0 100px;
}
@media screen and (max-width: 480px) {
  .recommend .facility-wrap .inner {
    padding: 30px 0 50px;
  }
}
.recommend .facility-wrap .recommend__wrap__detail__inner__title {
  left: 261px;
  text-align: center;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .recommend .facility-wrap .recommend__wrap__detail__inner__title {
    left: 100px;
  }
}
@media screen and (max-width: 480px) {
  .recommend .facility-wrap .recommend__wrap__detail__inner__title {
    left: 17%;
  }
}
@media screen and (max-width: 320px) {
  .recommend .facility-wrap .recommend__wrap__detail__inner__title {
    left: 11%;
  }
}
.recommend .facility-wrap__imgs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media screen and (max-width: 480px) {
  .recommend .facility-wrap__imgs {
    display: block;
  }
}
.recommend .facility-wrap__imgs--left, .recommend .facility-wrap__imgs--right {
  width: 49%;
}
@media screen and (max-width: 480px) {
  .recommend .facility-wrap__imgs--left, .recommend .facility-wrap__imgs--right {
    width: 100%;
    margin-bottom: 3%;
  }
}
.recommend .facility-wrap__imgs--left--bottom, .recommend .facility-wrap__imgs--right--bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 10px;
}
.recommend .facility-wrap__imgs--left--bottom__item, .recommend .facility-wrap__imgs--right--bottom__item {
  width: 49%;
}
.recommend .facility-wrap__detail {
  margin-top: 70px;
}
@media screen and (max-width: 480px) {
  .recommend .facility-wrap__detail {
    margin-top: 30px;
  }
}

/* cost -----------------------------------------------*/
.cost {
  text-align: center;
  background-color: #F5F4F2;
}
.cost .generic__sub, .cost .generic__title {
  -moz-text-align-last: left;
       text-align-last: left;
}
.cost--top {
  margin-top: 100px;
  letter-spacing: 0.3rem;
}
@media screen and (max-width: 480px) {
  .cost--top {
    margin-top: 50px;
  }
}
.cost__message {
  font-size: 3.6rem;
  font-family: "Noto Serif JP", serif;
  letter-spacing: 0.3rem;
  margin-top: -40px;
}
@media screen and (max-width: 480px) {
  .cost__message {
    font-size: 2.6rem;
    margin-top: 0px;
    line-height: 1.1;
  }
}
.cost__message span {
  font-size: 7.8rem;
  color: #CAA470;
}
@media screen and (max-width: 480px) {
  .cost__message span {
    font-size: 4.8rem;
  }
}
.cost__detail {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 70px 0 50px;
}
@media screen and (max-width: 480px) {
  .cost__detail {
    margin: 30px 0 0;
  }
}
.cost__detail__item {
  width: 23%;
  background-color: #fff;
  border: 1px solid #CAA470;
  position: relative;
  padding: 50px 10px 20px;
}
@media screen and (max-width: 480px) {
  .cost__detail__item {
    width: 48%;
    margin: 25px 0;
    padding-top: 35px;
  }
}
.cost__detail__item__num {
  width: 25%;
  position: absolute;
  top: -43px;
  left: 39%;
}
@media screen and (max-width: 480px) {
  .cost__detail__item__num {
    top: -12%;
  }
}
.cost__detail__item__title {
  font-size: 2.8rem;
  font-family: "Noto Serif JP", serif;
  color: #CAA470;
  margin-bottom: 30px;
}
@media screen and (max-width: 480px) {
  .cost__detail__item__title {
    font-size: 2.3rem;
    margin-bottom: 20px;
  }
}
.cost__detail__item__desc p {
  line-height: 1.5;
}

/* plan -----------------------------------------------*/
.plan .plan-first {
  margin-bottom: 30px;
}
.plan--top, .plan--bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.plan--top__content, .plan--bottom__content {
  width: 48%;
  padding: 20px;
  -webkit-box-shadow: 0px 3px 7px lightgray;
          box-shadow: 0px 3px 7px lightgray;
}
@media screen and (max-width: 480px) {
  .plan--top__content, .plan--bottom__content {
    width: 100%;
    margin-bottom: 30px;
  }
}
.plan--top__content__title, .plan--bottom__content__title {
  font-size: 3rem;
  font-family: "Noto Serif JP", serif;
  color: #CAA470;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  margin-bottom: 15px;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .plan--top__content__title, .plan--bottom__content__title {
    font-size: 2.5rem;
  }
}
@media screen and (max-width: 480px) {
  .plan--top__content__title, .plan--bottom__content__title {
    font-size: 2.5rem;
  }
}
.plan--top__content__title img, .plan--bottom__content__title img {
  width: 30px;
}
.plan--top__content__title .num, .plan--bottom__content__title .num {
  font-size: 5rem;
  margin: 0 10px 0 5px;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .plan--top__content__title .num, .plan--bottom__content__title .num {
    font-size: 4rem;
  }
}
@media screen and (max-width: 480px) {
  .plan--top__content__title .num, .plan--bottom__content__title .num {
    font-size: 4rem;
  }
}
.plan--top__content__desc, .plan--bottom__content__desc {
  margin-top: 10px;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .plan--top__content__desc p, .plan--bottom__content__desc p {
    font-size: 1.6rem;
  }
}
.plan--top {
  margin-top: 100px;
}
@media screen and (max-width: 480px) {
  .plan--top {
    margin-top: 50px;
  }
}
.plan--bottom__content {
  width: 31%;
  margin-top: 30px;
}
@media screen and (max-width: 480px) {
  .plan--bottom__content {
    width: 48%;
    margin-top: 0;
    padding: 20px 5px;
  }
}
.plan--bottom__content__title {
  font-size: 2.6rem;
  font-family: "Noto Serif JP", serif;
  padding-bottom: 10px;
  border-bottom: 1px solid #CAA470;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .plan--bottom__content__title {
    font-size: 2rem;
  }
}
@media screen and (max-width: 480px) {
  .plan--bottom__content__title {
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 320px) {
  .plan--bottom__content__title {
    font-size: 1.3rem;
  }
}
.plan--bottom__content__title .num {
  font-size: 4.8rem;
}
@media screen and (max-width: 1080px) and (min-width: 481px) {
  .plan--bottom__content__title .num {
    font-size: 2.8rem;
  }
}
@media screen and (max-width: 480px) {
  .plan--bottom__content__title .num {
    font-size: 2.8rem;
  }
}
.plan--bottom__content__desc {
  text-align: center;
}

/* chapel -----------------------------------------------*/
.chapel {
  background-color: #F5F4F2;
}
.chapel p {
  margin: 50px 0;
}
@media screen and (max-width: 480px) {
  .chapel p {
    margin: 30px 0;
  }
}
.chapel table {
  font-size: 1.8rem;
}
.chapel table th {
  padding-right: 50px;
}
@media screen and (max-width: 480px) {
  .chapel table th {
    font-size: 1.4rem;
    width: 13%;
    padding-right: 10px;
  }
}
.chapel table td {
  padding: 20px;
}
@media screen and (max-width: 480px) {
  .chapel table td {
    font-size: 1.3rem;
    padding: 10px;
  }
}
.chapel table a {
  font-size: 1.8rem;
  color: #000;
}
@media screen and (max-width: 480px) {
  .chapel table a {
    font-size: 1.3rem;
    line-height: 1.8;
  }
}

/* footer -----------------------------------------------*/
footer {
  text-align: center;
  padding: 10px;
  font-size: 1.6rem;
  color: #CAA470;
}

/* SP用 フッター追従CTA -----------------------------------------------*/
.following {
  z-index: 999;
  width: 100%;
  position: fixed;
  opacity: 0;
  -webkit-transform: translateY(112px);
          transform: translateY(112px);
}
.following__wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.following__img {
  width: 50%;
  background: url(../images/sp/cta-wrap-img.jpg) no-repeat center/cover;
}
.following__detail {
  width: 50%;
  background-color: #E38383;
  opacity: 0.8;
  padding: 15px;
}
@media screen and (max-width: 320px) {
  .following__detail {
    padding: 5px;
  }
}
.following__detail__title {
  font-size: 1.3rem;
  color: #fff;
  letter-spacing: 0.1rem;
}
.following__detail__title span {
  font-size: 2rem;
}
@media screen and (max-width: 320px) {
  .following__detail__title span {
    font-size: 1.8rem;
  }
}
.following__detail__btn {
  background-color: #fff;
  font-size: 1.8rem;
  text-align: center;
  padding: 17px 0 22px;
  margin-top: 5px;
}
.following__detail__btn a {
  color: #E38383;
  font-size: 1.3rem;
}

/*　上に上がる動き　*/
#following.UpMove {
  -webkit-animation: UpAnime 0.5s forwards;
          animation: UpAnime 0.5s forwards;
}

@-webkit-keyframes UpAnime {
  from {
    opacity: 0;
    -webkit-transform: translateY(112px);
            transform: translateY(112px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}

@keyframes UpAnime {
  from {
    opacity: 0;
    -webkit-transform: translateY(112px);
            transform: translateY(112px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
/*　下に下がる動き　*/
#following.DownMove {
  -webkit-animation: DownAnime 0.5s forwards;
          animation: DownAnime 0.5s forwards;
}

@-webkit-keyframes DownAnime {
  from {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(112px);
            transform: translateY(112px);
  }
}

@keyframes DownAnime {
  from {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(112px);
            transform: translateY(112px);
  }
}
/* 2022/1追加 */
.adding-wrap {
  margin-bottom: 70px;
}

.adding-message {
  color: #CAA470;
  font-size: 2rem;
  text-align: center;
}

.adding-btns-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 50px 0;
}

.adding-bridal-fair-btn {
  background: #ea9090;
  background: -webkit-linear-gradient(30deg, #ea9090 0%, #d66c6c 100%);
  background: linear-gradient(60deg, #ea9090 0%, #d66c6c 100%);
  color: #FFFFFF;
  border: none;
  width: 266px;
  height: 50px;
  margin-right: 20px;
}

.adding-bridal-fair-btn a {
  color: #fff;
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
  line-height: 50px;
  font-size: 1.2rem;
  position: relative;
}

.adding-bridal-fair-btn a::after {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f138";
  position: absolute;
  color: mistyrose;
  font-size: 1.6rem;
  right: 11px;
  top: 1px;
}

@media screen and (max-width: 480px) {
  .adding-wrap {
    margin-bottom: 50px;
  }

  .adding-btns-wrap {
    display: block;
  }

  .adding-bridal-fair-btn {
    width: 100%;
    margin-bottom: 10px;
  }
}
.cost-plans-wrap .adding-message {
  margin: 70px 0 30px;
}

.cost-plans-items {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.cost-plans-item {
  background-color: #fff;
  width: 35%;
  margin: 0 1% 25px;
  padding: 10px;
}

.cost-plans-item-price {
  border-top: 1px solid #ccc;
  margin-top: 10px;
}

.cost-plans-item-price span {
  font-size: 3rem;
  color: #CAA470;
}

@media screen and (max-width: 480px) {
  .cost-plans-item {
    width: 100%;
    margin: 0 0 10px;
    padding: 10px 4% 0;
  }

  .cost-plans-item-price span {
    font-size: 2.5rem;
  }
}
/* 追加したプラン（料金）欄 */
.plan-wrap {
  background-color: #F5F4F2;
}
.plan-wrap__title-sub {
  margin: 50px 0;
}
@media screen and (max-width: 480px) {
  .plan-wrap__title-sub {
    margin: 30px 0;
  }
}
.plan-wrap__item {
  background-color: #fff;
  padding: 30px;
  margin-top: 30px;
}
@media screen and (max-width: 480px) {
  .plan-wrap__item {
    padding: 15px;
    margin-top: 15px;
  }
}
.plan-wrap__item__name {
  color: #CBA470;
  font-size: 2.2rem;
  padding-bottom: 20px;
  border-bottom: 1px solid lightgray;
  margin-bottom: 20px;
  line-height: 1.5;
}
@media screen and (max-width: 480px) {
  .plan-wrap__item__name {
    font-size: 1.8rem;
  }
}
.plan-wrap__item__sub {
  font-size: 1.8em;
  line-height: 1.5;
}
@media screen and (max-width: 480px) {
  .plan-wrap__item__sub {
    font-size: 1.6rem;
  }
}
.plan-wrap__item__detail {
  font-size: 1.4rem;
  margin: 20px 0;
}
.plan-wrap__item__price {
  font-size: 2.5rem;
  color: #C6746D;
}
@media screen and (max-width: 480px) {
  .plan-wrap__item__price {
    font-size: 2rem;
  }
}
.plan-wrap__caution {
  margin-top: 20px;
}/*# sourceMappingURL=style.css.map */