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

目次 
1.ベース
2.ヘッダー
3.フッター
4.トップページ
5.CONCEPT
6.FACILITY
7.MOVIE
8.GALLERY
9.ACCESS
10.OTHER VENUE

*****************************************/
@import url("https://fonts.googleapis.com/css2?family=Bodoni+Moda:wght@400;500;600;700;800&family=Roboto&display=swap");
/****************************************


1.ベース


*****************************************/
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, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, figure {
  border: 0 none;
  font-size: 18px;
  font-style: normal;
  margin: 0;
  outline: 0 none;
  padding: 0;
  vertical-align: top;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
  font-weight: 500;
  text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
  text-rendering: auto;
  color: #2d3718;
  -webkit-text-size-adjust: none; }

html {
  width: 100%;
  height: 100%; }

body {
  overflow-x: hidden; }

.inner {
  width: 900px;
  margin-left: auto;
  margin-right: auto; }
  @media all and (max-width: 768px) {
    .inner {
      width: 90%; } }

.innerWide {
  width: 80%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto; }
  @media all and (max-width: 768px) {
    .innerWide {
      width: 90%; } }

.innerS {
  width: 80%;
  max-width: 1300px;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box; }
  @media all and (max-width: 1280px) {
    .innerS {
      width: 90%;
      max-width: 90%; } }
  @media all and (max-width: 1024px) {
    .innerS {
      width: 100%;
      max-width: 100%;
      padding-left: 8%;
      padding-right: 8%; } }

.innerL {
  width: 95%;
  margin: 0 auto; }
  @media all and (max-width: 1024px) {
    .innerL {
      width: 82%; } }

@media all and (max-width: 768px) {
  .spBr {
    display: none; } }

.tit h3 {
  font-family: 'Bodoni Moda', serif;
  font-size: 36px;
  line-height: 63px;
  letter-spacing: 3.6px;
  color: #972D15;
  text-align: center;
  margin-bottom: 1em;
  position: relative; }
  @media all and (max-width: 768px) {
    .tit h3 {
      font-size: 24px;
      line-height: 50px;
      letter-spacing: 2px; } }

.tit h3::before {
  content: "";
  border-bottom: 2px solid #972D15;
  width: 100px;
  height: 2px;
  display: inline-block;
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%); }
  @media all and (max-width: 768px) {
    .tit h3::before {
      width: 70px; } }

/*ウェデングフェア*/
.weddingFair {
  position: fixed;
  bottom: 79px;
  right: 10px;
  z-index: 99;
  transition: all 0.8s; }
  @media all and (max-width: 768px) {
    .weddingFair {
      width: 100%;
      bottom: 0;
      right: 0; } }

.weddingFair.action {
  bottom: 5px; }
  @media all and (max-width: 768px) {
    .weddingFair.action {
      bottom: 0; } }

.weddingFair img {
  max-width: 100%;
  height: auto; }

.weddingFair .pc {
  display: block; }
  @media all and (max-width: 768px) {
    .weddingFair .pc {
      display: none; } }

.weddingFair .sp {
  display: none; }
  @media all and (max-width: 768px) {
    .weddingFair .sp {
      display: block; } }

/*インビュー関係*/
.inview {
  transition: all 5000ms cubic-bezier(0.165, 0.84, 0.44, 1);
  transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
  transition-property: transform,opacity;
  opacity: 0; }
  .inview.left {
    transform: translateX(-30px); }
  .inview.right {
    transform: translateX(30px); }
  .inview.bottom {
    transform: translateY(20px); }
  .inview.delay {
    transition-delay: 350ms; }
  .inview.action {
    opacity: 1;
    transform: translate(0px); }

/****************************************


2.ヘッダー


*****************************************/
header {
  width: 100%;
  position: absolute;
  top: calc( 100vh - 70px );
  left: 0;
  z-index: 4;
  /***ナビボタン***/
  /**javascript**/ }
  @media all and (max-width: 1024px) {
    header {
      position: absolute;
      top: 0;
      left: 0; } }
  header nav {
    position: relative; }
  header.fixed {
    position: fixed;
    top: 0; }
  header .nav.open {
    height: 100%;
    z-index: 99;
    opacity: 1; }
  header .nav {
    background: #972d15;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    list-style: none;
    padding-top: 16px;
    padding-bottom: 15px;
    height: 69px; }
    @media all and (max-width: 1024px) {
      header .nav {
        background: rgba(255, 192, 0, 0.92);
        display: block;
        width: 100%;
        height: 0;
        padding-top: 95px;
        padding-bottom: 0;
        overflow: auto;
        position: fixed;
        top: 0;
        left: 0;
        opacity: 0;
        transition: all .5s ease-in-out; } }
    header .nav li {
      line-height: 14px;
      margin-right: 40px; }
      @media all and (max-width: 1024px) {
        header .nav li {
          width: 60%;
          line-height: 1;
          margin-left: auto;
          margin-right: auto;
          margin-bottom: 30px; } }
      @media all and (max-width: 768px) {
        header .nav li {
          width: 70%; } }
    header .nav li a:hover {
      opacity: 0.7; }
    header .nav li a {
      color: #FFC000;
      font-family: 'Bodoni Moda', serif;
      letter-spacing: 0.9px; }
      @media all and (max-width: 1024px) {
        header .nav li a {
          font-size: 20px;
          font-weight: bold; } }
    header .nav li a span {
      color: #FFC000;
      font-family: 'Bodoni Moda', serif;
      letter-spacing: 0.9px;
      font-weight: bold; }
      @media all and (max-width: 1024px) {
        header .nav li a span {
          font-size: 20px;
          color: #972d15; } }
    header .nav .flex {
      display: flex;
      align-items: center; }
      @media all and (max-width: 1024px) {
        header .nav .flex {
          display: none; } }
    header .nav .flex li:nth-child(1) {
      margin-right: 20px; }
      @media all and (max-width: 1024px) {
        header .nav .flex li:nth-child(1) {
          margin-right: auto; } }
    header .nav .flex .instagram {
      margin-right: 5px; }
    header .nav .flex .mail {
      background-color: inherit; }
    header .nav .spTelInsta {
      display: none; }
      @media all and (max-width: 1024px) {
        header .nav .spTelInsta {
          display: block; } }
    header .nav .spTelInsta li:nth-child(1) {
      border-top: 1px solid #972D15;
      padding-top: 40px;
      margin-bottom: 10px; }
    @media all and (max-width: 1024px) {
      header .nav .spTel {
        background-image: url(img/iconTelRed.svg);
        background-repeat: no-repeat;
        background-position: top 0px left 5px;
        background-size: 11%;
        padding-left: 40px;
        padding-top: 1px;
        padding-bottom: 1px; } }
    @media all and (max-width: 1024px) {
      header .nav .spInstagram {
        background-image: url("img/iconInstaRed.svg");
        background-repeat: no-repeat;
        background-position: top 0px left 5px;
        background-size: 7%;
        padding-left: 40px;
        padding-top: 1px;
        padding-bottom: 1px; } }
    @media all and (max-width: 1024px) {
      header .nav .spTel span, header .nav .spInstagram span {
        font-size: 18px; } }
    header .nav .headerContact {
      padding: 0 20px;
      background: #FFC000;
      border-radius: 20px;
      transition: all 0.8s; }
      @media all and (max-width: 1024px) {
        header .nav .headerContact {
          padding: 0 30px;
          background: #972D15;
          border-radius: 50px; } }
    header .nav .headerContact span {
      color: #972D15;
      letter-spacing: 1px;
      line-height: 39px; }
      @media all and (max-width: 1024px) {
        header .nav .headerContact span {
          color: #FFC000;
          font-size: 24px;
          line-height: 50px; } }
  header .navBtnBg {
    display: none; }
    @media all and (max-width: 1024px) {
      header .navBtnBg {
        background-color: #972D15;
        width: 78px;
        height: 78px;
        border-radius: 80px; } }
  header .navBtn {
    display: none; }
    @media all and (max-width: 1024px) {
      header .navBtn {
        display: block;
        width: 25px;
        position: fixed;
        top: 25px;
        right: 25px;
        cursor: pointer;
        z-index: 999;
        background-color: #972D15;
        padding: 15px 13px;
        border-radius: 40px; } }
  @media all and (max-width: 1024px) {
    header .navBtn span {
      display: block;
      height: 3px;
      width: 100%;
      background: #FFC000;
      border-radius: 2px;
      transition: all .5s ease-in-out; } }
  @media all and (max-width: 1024px) {
    header .navBtn span:nth-child(1) {
      margin-bottom: 5px; } }
  @media all and (max-width: 1024px) {
    header .navBtn span:nth-child(2) {
      margin-bottom: 5px; } }
  @media all and (max-width: 1024px) {
    header .navBtn.active span:nth-child(1) {
      -webkit-transform: translateY(8px) translateX(0) rotate(45deg);
      -ms-transform: translateY(8px) translateX(0) rotate(45deg);
      transform: translateY(8px) translateX(0) rotate(45deg);
      background: #FFC000; } }
  @media all and (max-width: 1024px) {
    header .navBtn.active span:nth-child(2) {
      margin-top: 5px;
      opacity: 0;
      -webkit-transform: translateY(8px);
      -ms-transform: translateY(8px);
      transform: translateY(8px); } }
  @media all and (max-width: 1024px) {
    header .navBtn.active span:nth-child(3) {
      -webkit-transform: translateY(-8px) translateX(0) rotate(-45deg);
      -ms-transform: translateY(-8px) translateX(0) rotate(-45deg);
      transform: translateY(-8px) translateX(0) rotate(-45deg);
      background: #FFC000; } }
  header .img {
    position: absolute;
    top: 10px;
    left: 35px; }
    @media all and (max-width: 768px) {
      header .img {
        width: 55px;
        top: 20px;
        left: 25px; } }
  @media all and (max-width: 768px) {
    header .img img {
      width: 100%; } }

/****************************************


3.フッター


*****************************************/
.totop {
  position: fixed;
  bottom: 115px;
  right: 10px;
  z-index: 999; }
  @media all and (max-width: 768px) {
    .totop {
      bottom: 160px;
      right: 0; } }
  @media all and (max-width: 576px) {
    .totop {
      bottom: 90px; } }
  .totop a img {
    width: 100%;
    transform: rotate(-90deg); }
    @media all and (max-width: 768px) {
      .totop a img {
        width: 70%; } }

/****************************************


4.トップページ


*****************************************/
.topImg {
  width: 100%;
  height: calc( 100vh - 70px );
  background-image: url("img/topimg.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  position: relative; }
  @media all and (max-width: 1024px) {
    .topImg {
      height: calc( 100vh - 50px );
      border-bottom: 50px solid #972D15; } }

.logo h1 {
  font-family: 'Bodoni Moda', serif;
  font-size: 97.85px;
  text-align: center;
  color: #ffc000;
  line-height: 1;
  padding-top: 60px; }
  @media all and (max-width: 768px) {
    .logo h1 {
      font-size: 56px; } }

/****************************************


5.CONCEPT


*****************************************/
.concept {
  padding-top: 69px; }
  @media all and (max-width: 1024px) {
    .concept {
      padding-top: 0; } }
  .concept .img img {
    width: 100%; }
  .concept .tit {
    margin-left: 125px;
    margin-bottom: 175px; }
    @media all and (max-width: 1024px) {
      .concept .tit {
        margin-left: 0;
        margin-bottom: 10px; } }
  .concept .tit h2 {
    font-family: 'Bodoni Moda', serif;
    font-size: 96px;
    color: #972D15;
    line-height: 1;
    margin-bottom: 30px; }
    @media all and (max-width: 768px) {
      .concept .tit h2 {
        font-size: 54px; } }
  .concept .tit p {
    font-size: 26px;
    color: #972D15; }
    @media all and (max-width: 768px) {
      .concept .tit p {
        font-size: 16px; } }
  .concept .conceptTop {
    background-color: #FFC000;
    padding-top: 200px; }
    @media all and (max-width: 1024px) {
      .concept .conceptTop {
        padding: 50px 0; } }
  .concept .conceptTop .inner {
    width: auto;
    display: flex;
    justify-content: space-between; }
    @media all and (max-width: 1024px) {
      .concept .conceptTop .inner {
        width: 90%;
        display: block; } }
  .concept .imgTwo img {
    border-radius: 10px 0 0 10px; }
    @media all and (max-width: 1024px) {
      .concept .imgTwo img {
        border-radius: 0; } }
  .concept .conceptBottom {
    background-color: #6F987C;
    padding: 200px 0 100px;
    position: relative; }
    @media all and (max-width: 1024px) {
      .concept .conceptBottom {
        padding: 60px 0; } }
  .concept .conceptBottom .inner {
    width: auto;
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse; }
    @media all and (max-width: 1024px) {
      .concept .conceptBottom .inner {
        width: 80%;
        display: block; } }
  .concept .conceptBottom .txt {
    margin-right: 70px; }
    @media all and (max-width: 1024px) {
      .concept .conceptBottom .txt {
        margin-right: 0; } }
  .concept .conceptBottom .txt p {
    line-height: 36px;
    letter-spacing: 2.1px;
    color: #FFC000;
    margin-bottom: 30px; }
    @media all and (max-width: 1024px) {
      .concept .conceptBottom .txt p {
        line-height: 2;
        font-size: 18px; } }
    @media all and (max-width: 768px) {
      .concept .conceptBottom .txt p {
        line-height: 2;
        letter-spacing: 0;
        font-size: 11px; } }
  .concept .imgTree {
    position: absolute;
    top: -155px;
    left: 0; }
    @media all and (max-width: 1024px) {
      .concept .imgTree {
        position: static; } }
  .concept .imgTree img {
    border-radius: 0 10px 10px 0; }
    @media all and (max-width: 1024px) {
      .concept .imgTree img {
        border-radius: 0; } }
  .concept .imgFour {
    position: absolute;
    bottom: -85px;
    left: 387px; }
    @media all and (max-width: 1024px) {
      .concept .imgFour {
        bottom: -180px;
        left: 55px;
        width: 40%; } }
    @media all and (max-width: 768px) {
      .concept .imgFour {
        bottom: -135px;
        left: 20px; } }
  @media all and (max-width: 768px) {
    .concept .pcImg.imgA {
      background-image: url("img/conceptImg01.jpg");
      background-position: center center;
      background-size: cover;
      padding: 175px 0; } }
  @media all and (max-width: 768px) {
    .concept .pcImg.imgB {
      background-image: url("img/conceptImg05.jpg");
      background-position: center center;
      background-size: cover;
      padding: 175px 0; } }
  @media all and (max-width: 768px) {
    .concept .pcImg img {
      display: none; } }

/****************************************


6.FACILITY


*****************************************/
.facility {
  background-color: #FFC000;
  padding: 140px 0;
  /* swiperボタン */
  /* swiper青矢印消す */
  /* swiper大きさ調整 */ }
  @media all and (max-width: 768px) {
    .facility {
      padding: 70px 0; } }
  .facility p {
    text-align: center;
    margin-bottom: 90px; }
    @media all and (max-width: 768px) {
      .facility p {
        font-size: 16px; } }
  .facility .img {
    display: flex;
    justify-content: center;
    margin-bottom: 170px; }
    @media all and (max-width: 768px) {
      .facility .img {
        margin-bottom: 100px; } }
  @media all and (max-width: 768px) {
    .facility .img img {
      padding-right: 20px;
      overflow: hidden; } }
  @media all and (max-width: 1024px) {
    .facility .inner {
      width: 80%; } }
  @media all and (max-width: 768px) {
    .facility .inner {
      width: 90%; } }
  .facility .swiper-button-prev,
  .facility .swiper-button-next {
    width: 68px;
    height: 68px;
    background-size: 68px 68px;
    margin-top: -24px; }
    @media all and (max-width: 768px) {
      .facility .swiper-button-prev,
      .facility .swiper-button-next {
        width: 40px;
        height: 40px;
        background-size: 40px 40px; } }
  .facility .swiper-button-next {
    background-image: url("img/slideBtn.svg");
    background-repeat: no-repeat;
    right: 13.3%; }
    @media all and (max-width: 768px) {
      .facility .swiper-button-next {
        right: 7%; } }
  .facility .swiper-button-prev {
    background-image: url("img/slideBtn.svg");
    background-repeat: no-repeat;
    transform: scale(-1, 1);
    left: 13.3%; }
    @media all and (max-width: 768px) {
      .facility .swiper-button-prev {
        left: 7%; } }
  .facility .swiper-button-prev:after,
  .facility .swiper-button-next:after {
    display: none; }
  .facility .swiper-container {
    width: 100%;
    padding: 70px 0; }
    @media all and (max-width: 768px) {
      .facility .swiper-container {
        padding: 10px 0; } }
  .facility .swiper-slide {
    opacity: 0.8;
    overflow: hidden;
    transition: .7s; }
  .facility .swiper-slide img {
    width: 100%; }
  .facility .swiper-slide-active {
    opacity: 1;
    z-index: 1;
    transform: scale(1.1);
    /* スライドの大きさ調整 */ }
    @media all and (max-width: 768px) {
      .facility .swiper-slide-active {
        transform: scale(1.3); } }
  .facility .swiper-scrollbar {
    background: none; }

/****************************************


7.MOVIE


*****************************************/
.movie {
  background-color: #6F987C;
  padding: 120px 0; }
  @media all and (max-width: 768px) {
    .movie {
      padding: 40px 0; } }
  .movie .iframe {
    position: relative;
    padding-top: 45.25%;
    overflow: hidden; }
  .movie .iframe iframe {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%; }

/****************************************


8.GALLERY


*****************************************/
.gallery {
  background-color: #FFC000;
  padding: 200px 0 100px;
  /* swiperボタン */
  /* swiper青矢印消す */
  /* swiper大きさ調整 */ }
  @media all and (max-width: 768px) {
    .gallery {
      padding-top: 100px; } }
  .gallery .gallerySlide {
    margin-top: 100px;
    margin-bottom: 80px; }
    @media all and (max-width: 768px) {
      .gallery .gallerySlide {
        margin-top: 70px;
        margin-bottom: 50px; } }
  .gallery .swiper-button-prev,
  .gallery .swiper-button-next {
    width: 68px;
    height: 68px;
    background-size: 68px 68px;
    margin-top: -24px; }
    @media all and (max-width: 768px) {
      .gallery .swiper-button-prev,
      .gallery .swiper-button-next {
        width: 40px;
        height: 40px;
        background-size: 40px 40px; } }
  .gallery .swiper-button-next {
    background-image: url("img/slideBtn.svg");
    background-repeat: no-repeat;
    right: 30.3%; }
    @media all and (max-width: 768px) {
      .gallery .swiper-button-next {
        right: 14%; } }
  .gallery .swiper-button-prev {
    background-image: url("img/slideBtn.svg");
    background-repeat: no-repeat;
    transform: scale(-1, 1);
    left: 30.3%; }
    @media all and (max-width: 768px) {
      .gallery .swiper-button-prev {
        left: 14%; } }
  .gallery .swiper-button-prev:after,
  .gallery .swiper-button-next:after {
    display: none; }
  .gallery .swiper-container {
    width: 100%; }
  .gallery .swiper-slide img {
    width: 100%;
    border-radius: 10px; }
  .gallery .swiper-scrollbar {
    background: none; }
  .gallery a {
    display: flex;
    justify-content: center; }
  .gallery a span {
    font-family: 'Bodoni Moda', serif;
    font-size: 36px; }
    @media all and (max-width: 768px) {
      .gallery a span {
        font-size: 22px; } }
  .gallery a span::before {
    content: "";
    background-image: url("img/iconInstaGray.svg");
    background-repeat: no-repeat;
    padding: 0 60px 0 20px;
    vertical-align: sub; }
    @media all and (max-width: 768px) {
      .gallery a span::before {
        padding: 0 45px 0 20px;
        background-size: 45%; } }

/****************************************


9.ACCESS


*****************************************/
.access {
  background-color: #FFC000;
  padding: 100px 0 200px 0; }
  @media all and (max-width: 768px) {
    .access {
      padding: 90px 0 150px 0; } }
  .access .txtWrap {
    text-align: center;
    margin-top: 30px;
    margin-bottom: 50px; }
    .access .txtWrap p {
      font-size: 24px;
      margin-bottom: 10px; }
      @media all and (max-width: 768px) {
        .access .txtWrap p {
          font-size: 18px; } }
    .access .txtWrap a {
      font-size: 24px;
      display: block; }
      @media all and (max-width: 768px) {
        .access .txtWrap a {
          font-size: 18px; } }
  .access .googleMap {
    width: 225px;
    background-color: #972D15;
    font-size: 24px;
    color: #FFD800;
    padding: 10px 0;
    border-radius: 10px;
    margin-left: auto;
    margin-right: auto;
    display: block;
    text-align: center; }
    @media all and (max-width: 768px) {
      .access .googleMap {
        width: 160px;
        font-size: 18px;
        padding: 5px 0; } }

/****************************************


10.OTHER VENUE


*****************************************/
@media all and (max-width: 768px) {
  .othervenue .pcImg {
    background-image: url("img/venueImg01.jpg");
    background-position: center center;
    background-size: cover;
    padding: 175px 0; } }
@media all and (max-width: 768px) {
  .othervenue .pcImg img {
    display: none; } }
.othervenue .img img {
  width: 100%; }
.othervenue .bg {
  background-color: #6F987C;
  padding: 200px 0;
  text-align: center; }
  @media all and (max-width: 768px) {
    .othervenue .bg {
      padding: 120px 0; } }
.othervenue h4 {
  font-family: 'Bodoni Moda', serif;
  font-size: 48px;
  color: #FFC000;
  line-height: 84px;
  letter-spacing: 2.4px;
  margin-bottom: 55px; }
  @media all and (max-width: 768px) {
    .othervenue h4 {
      font-size: 22px;
      line-height: 2;
      margin-bottom: 35px; } }
.othervenue .btnWrap {
  display: flex;
  justify-content: center;
  align-items: center; }
  @media all and (max-width: 768px) {
    .othervenue .btnWrap {
      display: block; } }
.othervenue .btn {
  width: 250px;
  background-color: #972D15;
  font-size: 30px;
  color: #FFD800;
  line-height: 52.5px;
  letter-spacing: 1.5px;
  text-align: center;
  padding: 10px 0;
  border-radius: 10px;
  display: block;
  margin-right: 35px;
  position: relative; }
  @media all and (max-width: 768px) {
    .othervenue .btn {
      width: 150px;
      font-size: 18px;
      line-height: 35px;
      padding: 7px 0 2px;
      margin-bottom: 20px;
      margin-left: auto;
      margin-right: auto; } }
.othervenue .btn:before {
  background-color: #581D10;
  border-radius: 10px;
  position: absolute;
  content: "";
  top: 3px;
  left: 3px;
  width: 100%;
  height: 100%;
  z-index: -1; }
.othervenue .btn:hover {
  opacity: 1;
  left: 2px;
  top: 2px; }
.othervenue .btn:hover:before {
  left: 0px;
  top: 0px; }

/*# sourceMappingURL=style.css.map */