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

目次 
1.ベース
2.ヘッダー
3.フッター
4.トップページ

*****************************************/
/*レスポンシブ*/
/*フォントサイズ*/
/*Webフォント*/
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP:100,300,400,500,700,900&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-style: normal;
  margin: 0;
  outline: 0 none;
  padding: 0;
  vertical-align: top;
  font-family: 'Noto Serif JP', '游明朝', 'Yu Mincho', 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'MS P明朝', 'MS PMincho', serif;
  text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
  text-rendering: auto;
  font-size: clamp(14px, 1.4vw, 14px);
  color: #FFF;
  -webkit-text-size-adjust: none; }

body {
  overflow-x: hidden;
  background: #000; }

.inner {
  width: 85%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box; }
  @media all and (max-width: 1280px) {
    .inner {
      width: 90%; } }
  @media all and (max-width: 768px) {
    .inner {
      width: 100%;
      padding-left: clamp(20px, 6vw, 32px);
      padding-right: clamp(20px, 6vw, 32px); } }

.innerS {
  width: 70%;
  max-width: 1000px;
  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: 768px) {
    .innerS {
      width: 100%;
      max-width: 100%;
      padding-left: clamp(20px, 6vw, 32px);
      padding-right: clamp(20px, 6vw, 32px); } }

.innerL {
  width: 100%;
  padding-left: 80px;
  padding-right: 80px;
  box-sizing: border-box; }
  @media all and (max-width: 1280px) {
    .innerL {
      padding-left: 50px;
      padding-right: 50px; } }
  @media all and (max-width: 768px) {
    .innerL {
      padding-left: clamp(20px, 5vw, 32px);
      padding-right: clamp(20px, 5vw, 32px); } }

/*ボタン速度関係*/
a,
input[type=submit],
button {
  transition: all .5s ease-in; }
  a:before, a:after,
  input[type=submit]:before,
  input[type=submit]:after,
  button:before,
  button:after {
    transition: inherit; }
  a *,
  input[type=submit] *,
  button * {
    transition: inherit; }
    a *:before, a *:after,
    input[type=submit] *:before,
    input[type=submit] *:after,
    button *:before,
    button *:after {
      transition: inherit; }

.pc {
  display: block; }
  @media all and (max-width: 1024px) {
    .pc {
      display: none !important; } }

.sp {
  display: none !important; }
  @media all and (max-width: 1024px) {
    .sp {
      display: block !important; } }

/*インビュー関連*/
.inview {
  opacity: 0;
  transition: all 3000ms 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; }
  .inview.left {
    transform: translateX(-30px); }
  .inview.right {
    transform: translateX(30px); }
  .inview.bottom {
    transform: translateY(20px); }
  .inview.action {
    opacity: 1;
    transform: translate(0px); }

/*テキスト関連*/
.center {
  text-align: center; }

.under {
  text-decoration: underline; }

b, stlong, .bold {
  font-weight: bold; }

.postCn {
  font-size: clamp(16px, 1.6vw, 16px);
  line-height: 2; }
  .postCn * {
    font-size: clamp(16px, 1.6vw, 16px);
    line-height: 2; }
  .postCn h1 {
    font-size: 2em;
    line-height: 1.2;
    font-weight: bold;
    margin: 0 0 .75rem; }
  .postCn h2 {
    font-size: 1.5em;
    font-weight: bold;
    line-height: 1.6;
    margin: 0 0 .66rem 0; }
  .postCn h3 {
    font-size: 1.17em;
    line-height: 1.8;
    font-weight: bold;
    margin: 0 0 .66rem 0; }
  .postCn h4 {
    font-size: 0.83em;
    line-height: 2;
    font-weight: bold;
    margin: 0 0 .66rem 0; }
  .postCn h5 {
    font-size: 0.83em;
    line-height: 2;
    font-weight: bold;
    margin: 0 0 .66rem 0; }
  .postCn h6 {
    font-size: 0.67em;
    line-height: 2;
    font-weight: bold;
    margin: 0 0 .66rem 0; }
  .postCn p {
    margin-bottom: 20px; }
  .postCn strong {
    font-weight: bold; }
    .postCn strong * {
      font-weight: bold; }
  .postCn em {
    font-style: italic; }
    .postCn em * {
      font-style: italic; }
  .postCn a {
    color: #e94b4b;
    display: inline;
    transition: 0.5s; }
    .postCn a * {
      color: #e94b4b; }
    .postCn a:hover {
      color: #e94b4b;
      text-decoration: underline; }
  .postCn img {
    margin-bottom: 20px; }
  .postCn iframe {
    margin-bottom: 20px; }
  .postCn ul {
    margin-bottom: 20px; }
    .postCn ul li {
      list-style: circle;
      list-style-position: inside; }
  .postCn ol {
    margin-bottom: 20px; }
    .postCn ol li {
      list-style-type: decimal;
      list-style-position: inside; }
  .postCn table {
    margin-bottom: 20px; }

/*フォント*/
.en1 {
  font-family: "warbler-banner", sans-serif;
  font-weight: 400;
  font-style: normal; }

.en2 {
  font-family: "Times New Roman", Times, serif;
  font-weight: bold;
  font-style: normal; }

/*ボタン*/
.circleBtn {
  display: inline-block;
  padding: 10px 20px 10px 15px;
  border: 1px solid #FFF;
  border-radius: 9999px; }
  .circleBtn span {
    display: flex;
    align-items: center;
    font-size: clamp(16px, 1.6vw, 16px);
    font-weight: bold;
    letter-spacing: 0.025em;
    line-height: 1.2; }
    .circleBtn span::after {
      content: "";
      display: block;
      width: 6px;
      height: 6px;
      border-top: 1.5px solid currentColor;
      border-right: 1.5px solid currentColor;
      transform: rotate(45deg);
      margin-left: 15px; }
  .circleBtn:hover {
    border: 1px solid #000;
    background: #FFF; }
    .circleBtn:hover span {
      color: #000; }

/*トップへ戻る*/
.toTop {
  background-image: url("img/iconToTop.svg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  width: 73px;
  height: 73px;
  position: fixed;
  bottom: 25px;
  right: 50px;
  z-index: 999; }
  @media all and (max-width: 1024px) {
    .toTop {
      width: 53px;
      height: 53px;
      bottom: 120px;
      right: 20px; } }
  .toTop:hover {
    opacity: 0.8; }
    @media all and (max-width: 1024px) {
      .toTop:hover {
        opacity: 1; } }

/*WEDDING FAIRボタン*/
.fairBtn {
  background: #F7AD02;
  border: 1px solid #000;
  border-radius: 5px;
  width: 237px;
  height: auto;
  padding: 3px;
  box-sizing: border-box;
  display: inline-block;
  position: fixed;
  bottom: 25px;
  left: 50px;
  z-index: 999; }
  @media all and (max-width: 1024px) {
    .fairBtn {
      width: 90%;
      bottom: 20px;
      left: 50%;
      transform: translateX(-50%); } }
  .fairBtn span {
    color: #000; }
  .fairBtn .bnrInner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: 1px solid #000;
    border-radius: 5px;
    padding: 10px 20px 15px;
    box-sizing: border-box; }
    .fairBtn .bnrInner .en {
      font-family: "warbler-banner", sans-serif;
      font-size: clamp(26px, 2.6vw, 26px);
      line-height: 1;
      margin-bottom: 5px; }
    .fairBtn .bnrInner .ja {
      font-weight: bold;
      letter-spacing: 0.2em; }
  .fairBtn:hover {
    opacity: 0.8; }
    @media all and (max-width: 1024px) {
      .fairBtn:hover {
        opacity: 1; } }

.fairBtn,
.toTop {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity 0.3s ease, visibility 0.3s ease; }

.fairBtn.is-hidden,
.toTop.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none; }

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


2.ヘッダー


*****************************************/
header {
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 999;
  display: flex;
  gap: 60px; }
  @media all and (max-width: 1024px) {
    header {
      background: rgba(0, 0, 0, 0.8);
      height: 0; } }
  header .innerL {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding-top: 30px;
    padding-bottom: 30px;
    box-sizing: border-box; }
    @media all and (max-width: 1024px) {
      header .innerL {
        flex-direction: column;
        justify-content: flex-start;
        padding: 0; } }
  header .navBtn {
    position: absolute;
    right: 6vw;
    top: 20px;
    z-index: 1001;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    display: none; }
    @media all and (max-width: 1024px) {
      header .navBtn {
        display: inline-flex; } }
    header .navBtn span {
      position: absolute;
      left: 0;
      right: 0;
      height: 1px;
      background: #FFF;
      transition: transform .6s, opacity .6s;
      transform-origin: center; }
      header .navBtn span:nth-child(1) {
        transform: translateY(-10px); }
      header .navBtn span:nth-child(2) {
        transform: translateY(0); }
      header .navBtn span:nth-child(3) {
        transform: translateY(10px); }
    header .navBtn.open {
      background: rgba(0, 0, 0, 0);
      border: none; }
      header .navBtn.open span {
        background: #FFF;
        left: 0;
        right: 0;
        height: 2px; }
        header .navBtn.open span:nth-child(1) {
          transform: translateY(0) rotate(32deg); }
        header .navBtn.open span:nth-child(2) {
          opacity: 0; }
        header .navBtn.open span:nth-child(3) {
          transform: translateY(0) rotate(-32deg); }
  header nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px; }
    @media all and (max-width: 1024px) {
      header nav {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity .25s, visibility .25s;
        padding: 70px 0 0 0;
        flex-direction: column;
        gap: 30px; } }
    header nav ul {
      display: flex;
      align-items: center;
      gap: 45px; }
      @media all and (max-width: 1024px) {
        header nav ul {
          flex-direction: column;
          gap: 0; } }
      header nav ul li a {
        font-size: clamp(15px, 1.5vw, 15px);
        color: #FFF;
        line-height: 0;
        vertical-align: baseline; }
        @media all and (max-width: 1024px) {
          header nav ul li a {
            font-size: clamp(24px, 2.4vw, 24px);
            letter-spacing: 0.05em;
            line-height: 1.9;
            display: flex;
            align-items: center; } }
        header nav ul li a.en1 {
          font-weight: bold; }
        header nav ul li a:hover {
          opacity: 0.7; }
    header nav ul:nth-child(1) {
      background-color: rgba(67, 21, 21, 0.5);
      padding: 15px 35px;
      box-sizing: border-box;
      border-radius: 10px; }
      @media all and (max-width: 1024px) {
        header nav ul:nth-child(1) {
          background-color: rgba(67, 21, 21, 0); } }
    header nav ul:nth-child(2) {
      gap: 10px; }
      @media all and (max-width: 1024px) {
        header nav ul:nth-child(2) {
          flex-direction: column-reverse;
          gap: 20px; } }
      header nav ul:nth-child(2) li {
        background-color: rgba(67, 21, 21, 0.5);
        padding: 13px;
        box-sizing: border-box;
        border-radius: 10px;
        display: flex;
        justify-content: center;
        align-items: center; }
        @media all and (max-width: 1024px) {
          header nav ul:nth-child(2) li {
            background-color: rgba(67, 21, 21, 0);
            padding: 0; } }
      header nav ul:nth-child(2) a {
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        width: 23px;
        height: 23px; }
        @media all and (max-width: 1024px) {
          header nav ul:nth-child(2) a {
            width: 100%;
            height: 18px;
            background-position: left;
            padding-left: 27px; } }
        @media all and (max-width: 1024px) {
          header nav ul:nth-child(2) a span {
            font-size: clamp(18px, 1.8vw, 18px);
            font-weight: bold; } }
        header nav ul:nth-child(2) a.telIcon {
          background-image: url("img/iconTel.svg"); }
        header nav ul:nth-child(2) a.instaIcon {
          background-image: url("img/iconInstagram.svg"); }
  @media all and (max-width: 1024px) {
    header.open {
      width: 100%;
      height: 100vh; } }
  @media all and (max-width: 1024px) {
    header.open nav {
      opacity: 1;
      visibility: visible;
      pointer-events: auto; } }
  @media all and (max-width: 1024px) {
    header.open .headSns {
      opacity: 1; } }

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


3.フッター


*****************************************/
footer {
  background-color: #F7AD00;
  padding: 60px; }
  @media all and (max-width: 1024px) {
    footer {
      padding: 90px 0 70px; } }
  footer .wrap {
    display: flex;
    justify-content: space-between;
    align-items: center; }
    @media all and (max-width: 1024px) {
      footer .wrap {
        flex-direction: column;
        justify-content: center; } }
    @media all and (max-width: 1024px) {
      footer .wrap .footerLogo {
        width: 50%;
        margin-bottom: 50px; } }
    @media all and (max-width: 1024px) {
      footer .wrap .footerSub {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center; } }
    footer .wrap .footerSub .actions {
      margin-bottom: 30px; }
      @media all and (max-width: 1024px) {
        footer .wrap .footerSub .actions {
          margin-bottom: 40px;
          display: flex;
          flex-direction: column;
          align-items: center; } }
      footer .wrap .footerSub .actions .actionsBtn {
        display: flex;
        align-items: center;
        margin-bottom: 10px; }
        footer .wrap .footerSub .actions .actionsBtn::before {
          content: "";
          width: 14px;
          height: 14px;
          background-position: center;
          background-repeat: no-repeat;
          background-size: 100%; }
          @media all and (max-width: 1024px) {
            footer .wrap .footerSub .actions .actionsBtn::before {
              width: 17px;
              height: 17px; } }
        footer .wrap .footerSub .actions .actionsBtn span {
          font-size: clamp(16px, 1.6vw, 16px);
          letter-spacing: 0.05em;
          line-height: 1.4;
          padding-left: 15px; }
          @media all and (max-width: 1024px) {
            footer .wrap .footerSub .actions .actionsBtn span {
              font-size: clamp(18px, 1.8vw, 18px); } }
        footer .wrap .footerSub .actions .actionsBtn.insta::before {
          background-image: url("img/iconInstagram.svg"); }
        footer .wrap .footerSub .actions .actionsBtn.tel::before {
          background-image: url("img/iconTel.svg"); }
    footer .wrap .footerSub .weddingCircusLogo {
      margin-bottom: 15px; }
    footer .wrap .footerSub .copy {
      line-height: 1;
      color: #FFF;
      font-size: clamp(11px, 1.1vw, 11px); }

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


4.トップページ


*****************************************/
.tit {
  display: flex;
  justify-content: center;
  align-items: center; }
  .tit span {
    font-family: "warbler-banner", sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #F7AD02;
    font-size: clamp(36px, 3.6vw, 60px);
    line-height: 0.9;
    letter-spacing: 0.025em; }

.swiper-container {
  position: relative; }

.defaultSlide {
  background: #f7ad02;
  padding: 13px 0; }
  @media all and (max-width: 1024px) {
    .defaultSlide {
      padding: 9px 0; } }

.swiper-button-prev,
.swiper-button-next {
  width: 24px;
  height: 24px;
  background-color: #FFF;
  border-radius: 99px;
  border: 1px solid #000;
  transition: 0.8s; }
  .swiper-button-prev span,
  .swiper-button-next span {
    width: 20px;
    height: 20px;
    display: block;
    position: relative; }
    .swiper-button-prev span::after,
    .swiper-button-next span::after {
      content: "";
      display: block;
      width: 6px;
      height: 6px;
      border-top: 1.5px solid #000;
      border-right: 1.5px solid #000;
      position: absolute;
      top: 35%;
      transition: 0.8s; }
  .swiper-button-prev:hover,
  .swiper-button-next:hover {
    background-color: #000;
    border: 1px solid #FFF;
    transition: 0.8s; }
    .swiper-button-prev:hover span::after,
    .swiper-button-next:hover span::after {
      border-color: #FFF;
      transition: 0.8s; }
  .swiper-button-prev::after,
  .swiper-button-next::after {
    display: none; }

.swiper-button-prev {
  left: 3%; }
  .swiper-button-prev span::after {
    transform: rotate(-140deg);
    left: 35%; }

.swiper-button-next {
  right: 3%; }
  .swiper-button-next span::after {
    transform: rotate(45deg);
    right: 35%; }

.mainImg {
  width: 100%;
  height: 100vh;
  background-image: url("img/mainImg.webp");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative; }
  @media all and (max-width: 768px) {
    .mainImg {
      background-image: url("img/mainImgSp.webp"); } }
  .mainImg .mainLogo {
    position: absolute;
    bottom: 130px;
    left: 50%;
    transform: translateX(-50%); }
    @media all and (max-width: 1024px) {
      .mainImg .mainLogo {
        bottom: auto;
        top: 170px; } }
    @media all and (max-width: 768px) {
      .mainImg .mainLogo {
        bottom: auto;
        top: 130px; } }

.cn {
  padding-top: clamp(40px, 10.5vw, 80px);
  padding-bottom: clamp(35px, 5.5vw, 70px); }

.cn1 .wrap {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-bottom: clamp(30px, 6.5vw, 80px);
  position: relative; }
  .cn1 .wrap .img {
    width: 85%; }
    @media all and (max-width: 1024px) {
      .cn1 .wrap .img {
        width: 75%; } }
    .cn1 .wrap .img img {
      width: 100%;
      height: 100%; }
  .cn1 .wrap .cn1Tit {
    display: flex;
    flex-direction: column;
    position: absolute;
    bottom: 50%;
    left: 8%;
    transform: translateY(50%); }
    .cn1 .wrap .cn1Tit span {
      color: #F7AD02;
      display: inline-flex; }
    .cn1 .wrap .cn1Tit .en {
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      margin-bottom: 55px; }
      @media all and (max-width: 1024px) {
        .cn1 .wrap .cn1Tit .en {
          align-items: flex-start; } }
      .cn1 .wrap .cn1Tit .en .en1 {
        font-size: clamp(50px, 10vw, 120px);
        letter-spacing: 0.025em;
        line-height: 0.9;
        text-align: end; }
      .cn1 .wrap .cn1Tit .en span:nth-child(2) {
        transform: translateX(-32px); }
        @media all and (max-width: 1024px) {
          .cn1 .wrap .cn1Tit .en span:nth-child(2) {
            transform: translateX(80px); } }
    .cn1 .wrap .cn1Tit .ja {
      font-size: clamp(14px, 4vw, 20px);
      font-weight: bold;
      letter-spacing: 0.05em;
      line-height: 1.6;
      color: #FFF; }
@media all and (max-width: 1024px) {
  .cn1 .inner.box {
    padding: 0; } }
.cn1 .box {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 150px; }
  @media all and (max-width: 1024px) {
    .cn1 .box {
      flex-direction: column;
      align-items: normal;
      gap: 30px; } }
  .cn1 .box .img {
    width: 40%; }
    @media all and (max-width: 1024px) {
      .cn1 .box .img {
        width: 65%; } }
  .cn1 .box .txt {
    width: calc( 60% - 150px );
    text-align: end; }
    @media all and (max-width: 1024px) {
      .cn1 .box .txt {
        width: 100%;
        padding: 0 5%;
        box-sizing: border-box; } }
    .cn1 .box .txt p {
      letter-spacing: 0.05em;
      line-height: 1.8; }
    @media all and (max-width: 1024px) {
      .cn1 .box .txt .more {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.8s ease; } }
    @media all and (max-width: 1024px) {
      .cn1 .box .txt.is-open .more {
        max-height: 2000px; } }
    .cn1 .box .txt.is-open .moreBtn span::after {
      transform: rotate(-135deg); }
    .cn1 .box .txt .moreBtn {
      display: none; }
      @media all and (max-width: 1024px) {
        .cn1 .box .txt .moreBtn {
          display: inline-flex;
          align-items: center;
          justify-content: center;
          margin: 25px auto 0;
          padding: 10px 22px;
          border: 1px solid #FFF;
          border-radius: 9999px;
          background: #000;
          cursor: pointer; } }
      .cn1 .box .txt .moreBtn span {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        color: #FFF;
        font-weight: bold;
        letter-spacing: 0.03em;
        line-height: 1;
        font-size: 12px; }
      .cn1 .box .txt .moreBtn span::after {
        content: "";
        display: inline-block;
        width: 7px;
        height: 7px;
        border-top: 2px solid currentColor;
        border-right: 2px solid currentColor;
        transform: translateY(-1px) rotate(135deg);
        transition: transform 0.8s ease; }
      .cn1 .box .txt .moreBtn[aria-expanded="true"] span::after {
        transform: translateY(3px) rotate(-45deg); }
      .cn1 .box .txt .moreBtn:hover {
        opacity: 0.85; }

.cn2 .wrap {
  display: grid;
  grid-template-columns: 1fr 65%;
  grid-template-rows: auto 1fr;
  column-gap: 60px;
  row-gap: 50px;
  align-items: center;
  padding-left: 10%;
  box-sizing: border-box;
  margin-left: auto;
  margin-bottom: 45px;
  position: relative; }
  @media all and (max-width: 1024px) {
    .cn2 .wrap {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      padding-left: 0;
      width: 100%;
      row-gap: 0; } }
.cn2 .tit {
  flex-direction: column;
  align-items: flex-end;
  grid-column: 1;
  grid-row: 1;
  margin: 0;
  position: relative;
  z-index: 2;
  transform: translate3d(68px, 40px, 0); }
  @media all and (max-width: 1024px) {
    .cn2 .tit {
      order: 1;
      transform: translate3d(20px, 20px, 0); } }
  .cn2 .tit span {
    font-size: clamp(46px, 7.5vw, 72px); }
    .cn2 .tit span:nth-child(2) {
      transform: translateX(50px); }
      @media all and (max-width: 1024px) {
        .cn2 .tit span:nth-child(2) {
          transform: translateX(12px); } }
.cn2 .img {
  grid-column: 2;
  grid-row: 1 / span 2;
  margin: 0;
  position: relative;
  z-index: 1; }
  @media all and (max-width: 1024px) {
    .cn2 .img {
      order: 2;
      width: 90%;
      margin-left: auto;
      margin-bottom: 40px; } }
  .cn2 .img img {
    width: 100%;
    height: 100%;
    object-fit: cover; }
.cn2 .txt {
  grid-column: 1;
  grid-row: 2;
  color: #fff;
  line-height: 2.1;
  letter-spacing: 0.05em; }
  @media all and (max-width: 1024px) {
    .cn2 .txt {
      order: 3;
      width: 100%; } }
  @media all and (max-width: 1024px) {
    .cn2 .txt p {
      text-align: center;
      padding: 0 5%;
      box-sizing: border-box; } }

@media all and (max-width: 1024px) {
  .cn3 {
    padding-top: 120px; } }
.cn3 .wrap {
  display: grid;
  grid-template-columns: 65% 1fr;
  grid-template-rows: auto 1fr;
  column-gap: 130px;
  row-gap: 50px;
  align-items: center;
  padding-right: 10%;
  box-sizing: border-box;
  margin-right: auto;
  margin-bottom: 45px;
  position: relative; }
  @media all and (max-width: 1024px) {
    .cn3 .wrap {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      width: 100%;
      padding-right: 0;
      margin-bottom: 40px;
      row-gap: 0; } }
.cn3 .tit {
  flex-direction: column;
  align-items: flex-start;
  grid-column: 2;
  grid-row: 1;
  margin: 0;
  position: relative;
  z-index: 2;
  transform: translate3d(-192px, 40px, 0); }
  @media all and (max-width: 1024px) {
    .cn3 .tit {
      order: 1;
      transform: none;
      position: absolute;
      top: -65px;
      right: 50px; } }
  .cn3 .tit span {
    font-size: clamp(46px, 7.5vw, 72px); }
    .cn3 .tit span:nth-child(2) {
      transform: translateX(63px); }
      @media all and (max-width: 1024px) {
        .cn3 .tit span:nth-child(2) {
          transform: translateX(40px); } }
.cn3 .img {
  grid-column: 1;
  grid-row: 1 / span 2;
  margin: 0;
  position: relative;
  z-index: 1; }
  @media all and (max-width: 1024px) {
    .cn3 .img {
      order: 2;
      width: 90%;
      margin-bottom: 40px; } }
  .cn3 .img img {
    width: 100%;
    height: 100%;
    object-fit: cover; }
.cn3 .txt {
  grid-column: 2;
  grid-row: 2;
  color: #fff;
  line-height: 2.1;
  letter-spacing: 0.05em; }
  @media all and (max-width: 1024px) {
    .cn3 .txt {
      order: 3;
      width: 100%; } }
  @media all and (max-width: 1024px) {
    .cn3 .txt p {
      text-align: center;
      padding: 0 5%;
      box-sizing: border-box; } }

.cn4 {
  padding-bottom: clamp(60px, 7.5vw, 100px); }
  .cn4 .tit {
    margin-bottom: 25px; }
  .cn4 p {
    text-align: center;
    letter-spacing: 0.05em;
    line-height: 2.2;
    margin-bottom: clamp(40px, 5.2vw, 95px); }

.cn5 {
  position: relative; }
  .cn5 .tit {
    margin-bottom: 40px; }
  .cn5 p {
    text-align: center;
    letter-spacing: 0.05em;
    line-height: 2.2;
    margin-bottom: clamp(20px, 4.2vw, 95px); }
  .cn5 .wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 50px; }
    @media all and (max-width: 1024px) {
      .cn5 .wrap {
        flex-direction: column; } }
    .cn5 .wrap .img {
      width: auto; }
    .cn5 .wrap .facilitySlide {
      width: calc( 55% - 50px );
      overflow: hidden; }
      @media all and (max-width: 1024px) {
        .cn5 .wrap .facilitySlide {
          width: 100%; } }
      .cn5 .wrap .facilitySlide .swiper-pagination span {
        background: #F7AD02; }

@media all and (max-width: 1024px) {
  .cn6 {
    padding-top: 100px; } }
.cn6 .tit {
  margin-bottom: clamp(30px, 4.2vw, 80px); }
.cn6 .gallerySlide .swiper-slide {
  transform: scale(0.8); }
.cn6 .gallerySlide .swiper-slide-active {
  transform: scale(1);
  transition: 0.3s; }
.cn6 .gallerySlide .swiper-slide-prev {
  transform: translateX(10%) scale(0.8);
  transition: 0.3s; }
  @media all and (max-width: 1024px) {
    .cn6 .gallerySlide .swiper-slide-prev {
      transform: translateX(30px) scale(0.8); } }
.cn6 .gallerySlide .swiper-slide-prev-prev {
  transform: translateX(30%) scale(0.8);
  transition: 0.3s; }
  @media all and (max-width: 1024px) {
    .cn6 .gallerySlide .swiper-slide-prev-prev {
      transform: translateX(30px) scale(0.8); } }
.cn6 .gallerySlide .swiper-slide-next {
  transform: translateX(-10%) scale(0.8);
  transition: 0.3s; }
  @media all and (max-width: 1024px) {
    .cn6 .gallerySlide .swiper-slide-next {
      transform: translateX(-30px) scale(0.8); } }
.cn6 .gallerySlide .swiper-slide-next-next {
  transform: translateX(-30%) scale(0.8);
  transition: 0.3s; }
  @media all and (max-width: 1024px) {
    .cn6 .gallerySlide .swiper-slide-next-next {
      transform: translateX(-30px) scale(0.8); } }
.cn6 .gallerySlide .swiper-button-next {
  right: 10%;
  left: auto;
  bottom: -5px;
  top: auto;
  transform: translateX(10px); }
  @media all and (max-width: 1024px) {
    .cn6 .gallerySlide .swiper-button-next {
      right: 50%;
      transform: translateX(55px);
      bottom: -50px; } }
.cn6 .gallerySlide .swiper-button-prev {
  right: 11%;
  left: auto;
  bottom: -5px;
  top: auto;
  transform: translateX(-45px); }
  @media all and (max-width: 1024px) {
    .cn6 .gallerySlide .swiper-button-prev {
      right: 50%;
      transform: translateX(-15px);
      bottom: -50px; } }
.cn6 .gallerySlide .swiper-button-prev,
.cn6 .gallerySlide .swiper-button-next {
  width: 37px;
  height: 37px; }
  .cn6 .gallerySlide .swiper-button-prev span::after,
  .cn6 .gallerySlide .swiper-button-next span::after {
    width: 10px;
    height: 10px;
    top: 25%; }

@media all and (max-width: 1024px) {
  .cn7 {
    padding-top: 130px; } }
.cn7 .cn7bg {
  background-image: url("img/fairImg.webp");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 25px 30px;
  box-sizing: border-box; }
  @media all and (max-width: 1024px) {
    .cn7 .cn7bg {
      background-image: url("img/fairImgSp.webp");
      padding: 13px; } }
  .cn7 .cn7bg .txt {
    border: 3px solid #F7AD02;
    padding: 130px 0 100px;
    display: flex;
    flex-direction: column;
    align-items: center; }
    @media all and (max-width: 1024px) {
      .cn7 .cn7bg .txt {
        padding: 53px 40px 50px;
        border: 3px solid #F7AD02; } }
    .cn7 .cn7bg .txt .tit {
      text-align: center;
      margin-bottom: 50px; }
      .cn7 .cn7bg .txt .tit span {
        font-size: clamp(56px, 5.6vw, 102px); }
    .cn7 .cn7bg .txt p {
      font-weight: bold;
      letter-spacing: 0.05em;
      line-height: 1.8;
      text-align: center;
      margin-bottom: 80px; }

.cn8 {
  padding-bottom: clamp(100px, 12.5vw, 150px); }
  .cn8 .wrap {
    display: flex;
    align-items: center;
    gap: 115px; }
    @media all and (max-width: 1024px) {
      .cn8 .wrap {
        flex-direction: column;
        gap: 40px; } }
  .cn8 .txtWrap {
    width: 30%; }
    @media all and (max-width: 1024px) {
      .cn8 .txtWrap {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center; } }
    .cn8 .txtWrap .tit {
      justify-content: flex-start;
      margin-bottom: 30px; }
      @media all and (max-width: 1024px) {
        .cn8 .txtWrap .tit {
          justify-content: center; } }
      .cn8 .txtWrap .tit span {
        font-size: clamp(26px, 3vw, 30px); }
    @media all and (max-width: 1024px) {
      .cn8 .txtWrap .txt {
        display: flex;
        flex-direction: column;
        align-items: center; } }
    .cn8 .txtWrap .txt h3 {
      display: flex;
      flex-direction: column;
      margin-bottom: 15px; }
      @media all and (max-width: 1024px) {
        .cn8 .txtWrap .txt h3 {
          justify-content: center;
          text-align: center; } }
      .cn8 .txtWrap .txt h3 span {
        font-family: "Times New Roman", Times, serif;
        font-weight: bold;
        letter-spacing: 0.03em;
        line-height: 1.3; }
    .cn8 .txtWrap .txt address, .cn8 .txtWrap .txt p {
      letter-spacing: 0.1em;
      line-height: 1.8; }
      @media all and (max-width: 1024px) {
        .cn8 .txtWrap .txt address, .cn8 .txtWrap .txt p {
          text-align: center; } }
    .cn8 .txtWrap .txt address {
      margin-bottom: 15px; }
    .cn8 .txtWrap .txt.txt1 {
      margin-bottom: 40px; }
      @media all and (max-width: 1024px) {
        .cn8 .txtWrap .txt.txt1 {
          margin-bottom: 60px; } }
      .cn8 .txtWrap .txt.txt1::after {
        content: "";
        display: inline-block;
        width: 106px;
        height: 1px;
        border-bottom: 1px solid #FFF;
        transform: translateY(15px); }
        @media all and (max-width: 1024px) {
          .cn8 .txtWrap .txt.txt1::after {
            transform: translateY(30px); } }
      .cn8 .txtWrap .txt.txt1 h3 span:nth-child(1) {
        font-size: clamp(28px, 3.2vw, 35px); }
      .cn8 .txtWrap .txt.txt1 h3 span:nth-child(2) {
        font-size: clamp(18px, 2vw, 22px); }
    .cn8 .txtWrap .txt.txt2 h3 {
      margin-bottom: 0; }
      .cn8 .txtWrap .txt.txt2 h3 span:nth-child(1) {
        font-size: clamp(22px, 2.6vw, 26px);
        padding-bottom: 10px; }
      .cn8 .txtWrap .txt.txt2 h3 span:nth-child(2) {
        font-size: clamp(18px, 1.8vw, 18px); }
  .cn8 .map {
    width: calc(70% - 115px);
    aspect-ratio: 582 / 385; }
    @media all and (max-width: 1024px) {
      .cn8 .map {
        width: 100%; } }
    .cn8 .map iframe {
      width: 100%;
      height: 100%; }

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