
:root {
  /* 黒 */
  --black: #333333;
  --black-sub: #333333;
  --white: #FFFFFF;
  --gray-dark: #A5A5A5;
  --gray: #DCDCDC;
  --gold: #c32414;
  --gold-sub: #C49B4B;
  --red: #C32414;
  /*フォントファミリー*/
  /* --font-family: "Yu Mincho", "Zen Old Mincho", serif;
  @media not all and (min-resolution:.001dpcm) { @supports (-webkit-appearance:none) {
    :root { --font-family: "游明朝体", "Yu Mincho", "Zen Old Mincho", serif; }
  }} */
  --font-family: "Yu Mincho", "YuMincho", "游明朝", "游明朝体", "Zen Old Mincho", serif;
}

html {
  scroll-behavior: smooth;
  font-size:62.5%;
  img{
    width: 100%;
  }
  .caption{
    text-align: center;
    margin: calc(20 / 1363 * 100%) auto calc(30 / 1363 * 100%) ;
  
  }
  .sp{
    display: block;
    @media screen and (min-width: 769px) {
      display: none;
    }
  }
  .pc{
    display: none;
    @media screen and (min-width: 769px) {
      display: block;
    }
  }
  .no-scroll {
    overflow: hidden;
    position: relative;
    .wrapper{
      padding-top:0;
    .wrapper-inner{
      border-top: 6px solid var(--white);
    }
}
  }
  /* マージン */
.mt5{margin-top: calc(5 / 1363 * 100%);}
.mt10{margin-top: calc(10 / 1363 * 100%);}
.mt20{margin-top: calc(20 / 1363 * 100%);}
.mt30{margin-top: calc(30 / 1363 * 100%);}
.mt40{margin-top: calc(40 / 1363 * 100%);}
.mt50{margin-top: calc(50 / 1363 * 100%);}
.mt60{margin-top: calc(60 / 1363 * 100%);}
.mt70{margin-top: calc(70 / 1363 * 100%);}
.mt80{margin-top: calc(80 / 1363 * 100%);}
.mt90{margin-top: calc(90 / 1363 * 100%);}
.mt100{margin-top: calc(100 / 1363 * 100%);}

.mb5{margin-bottom: calc(5 / 1363 * 100%);} 
.mb10{margin-bottom: calc(10 / 1363 * 100%);}
.mb20{margin-bottom: calc(20 / 1363 * 100%);}
.mb30{margin-bottom: calc(30 / 1363 * 100%);}
.mb40{margin-bottom: calc(40 / 1363 * 100%);}
.mb50{margin-bottom: calc(50 / 1363 * 100%);}
.mb60{margin-bottom: calc(60 / 1363 * 100%);}
.mb70{margin-bottom: calc(70 / 1363 * 100%);}
.mb80{margin-bottom: calc(80 / 1363 * 100%);}
.mb90{margin-bottom: calc(90 / 1363 * 100%);}
.mb100{margin-bottom: calc(100 / 1363 * 100%);}

.pt5{padding-top: calc(5 / 1363 * 100%);}
.pt10{padding-top: calc(10 / 1363 * 100%);}
.pt20{padding-top: calc(20 / 1363 * 100%);}
.pt30{padding-top: calc(30 / 1363 * 100%);}
.pt40{padding-top: calc(40 / 1363 * 100%);}
.pt50{padding-top: calc(50 / 1363 * 100%);}
.pt60{padding-top: calc(60 / 1363 * 100%);}
.pt70{padding-top: calc(70 / 1363 * 100%);}
.pt80{padding-top: calc(80 / 1363 * 100%);}
.pt90{padding-top: calc(90 / 1363 * 100%);}
.pt100{padding-top: calc(100 / 1363 * 100%);}

.pb5{padding-bottom: calc(5 / 1363 * 100%);}
.pb10{padding-bottom: calc(10 / 1363 * 100%);}
.pb20{padding-bottom: calc(20 / 1363 * 100%);}
.pb30{padding-bottom: calc(30 / 1363 * 100%);}
.pb40{padding-bottom: calc(40 / 1363 * 100%);}
.pb50{padding-bottom: calc(50 / 1363 * 100%);}
.pb60{padding-bottom: calc(60 / 1363 * 100%);}
.pb70{padding-bottom: calc(70 / 1363 * 100%);}
.pb80{padding-bottom: calc(80 / 1363 * 100%);}
.pb90{padding-bottom: calc(90 / 1363 * 100%);}
.pb100{padding-bottom: calc(100 / 1363 * 100%);}

.center{
  text-align: center !important;
}
.left{
  text-align: left !important;
}
.right{
  text-align: right !important;
}
main{

.news-item-text{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
  flex-direction: row-reverse;
  padding: calc(40 / 1363 * 100%) 0;
}
  .news{
    padding-bottom: calc(25 / 1363 * 100%);
    @media screen and (min-width: 769px) {
      padding-bottom: calc(50 / 1363 * 100%);
    }
    .news-inner{
      text-align: left;
      width: 100%;
      
      margin: 0 auto;
      padding: calc(240 / 1363 * 100%) 0 calc(50 / 1363 * 100%);
      @media screen and (min-width: 769px) {
        max-width:calc(1030 / 1363 * 100%);
          padding: calc(100 / 1363 * 100%) 0 calc(50 / 1363 * 100%);
      }

     .news-list{
         margin-top: calc(50 / 1363 * 100%);
         padding-bottom: calc(50 / 1363 * 100%);
         @media screen and (max-width: 768px) {
          li:nth-child(n + 7) {
            display: none;
          }
         }
         @media screen and (min-width: 769px) {
           display: grid;
          grid-template-columns:repeat(3, 1fr);
             gap:calc(25 / 768 * 100%);
          padding-left:15px;
          padding-right:15px;
         }
         @media screen and (min-width: 1024px) {
            margin-top: calc(80 / 1363 * 100%);
             gap:calc(50 / 1363 * 100%);
             padding-left:0;
          padding-right:0;
             padding-bottom:0;
         }
          
        li{
          position: relative;
          padding-bottom: calc(50 / 768 * 100%);
          @media screen and (min-width: 769px) {
            padding-bottom: 0;
          }
/* .cat01,
.cat02,
.cat03,
.cat04{
  padding: .3rem .8rem;
  width: calc(150 / 300 * 100%);
  position: absolute;
  top: 15px;
  left: -8px;
  z-index: 1;
} */
.news-category,
.cat01,
.cat02,
.cat03,
.cat04,
.cat05{
  width: calc(140 / 300 * 100%);
  padding: .1rem .8rem;
   color: var(--white);
   text-align: center;
   display: inline-block;
   border-radius: 5px;
   font-size: clamp(12px, 0.4vw + 12.2px, 14px);
   color: #fff;
}
.encat1,
.cat01{
  background-color: #39804a;
}
.encat2,
.cat02{
  background-color: #c2525c;
}
.encat3,
.cat03{
  background-color: #846056;
}
.encat4,
.cat04{
  background-color: #a87cc4;
}
.encat5,
.cat05{
  background-color: #33699c;
}

          img{
            aspect-ratio: 600 / 450;
            width: 100%;
            object-fit: cover;
            object-position: top;
          }
         
          .news-time{
            font-size: clamp(12px, 0.4vw + 12.2px, 14px);
            font-weight: 700;
            line-height: 1.5;
            color: var(--gray-dark);
            padding-bottom: .5rem;
            display: inline-block;
          }
          .news-title{
            font-size: clamp(14px, 0.4vw + 12.2px, 16px);
          }
        }

      }
     .eventcalendar-list{
       margin-top: calc(50 / 1363 * 100%);
       max-width: 640px;
       margin-left: auto;
       margin-right: auto;
     }
     .eventcalendar-select-wrap{
       position: relative;
                    width: 100%;
                    margin: 0 auto;
                    @media screen and (min-width: 769px) {
                  max-width: 300px;
                    }
       &::after{
         content:url(../img/front/icon-arrow.svg);
         position: absolute;
         top: 30%;
         right: 24px;
         pointer-events: none;
       transform: rotate(90deg);
  
       }
     }
     .eventcalendar-select{
       width: 100%;
       appearance: none;
       -webkit-appearance: none;
       -moz-appearance: none;
       border: 1px solid #ccc;
       background-color: var(--white);
       padding: 14px 48px;
       font-size: clamp(14px, 0.4vw + 12.2px, 16px);
       line-height: 1.5;
       text-align: center;
       text-align-last: center;
       color: var(--black);
       cursor: pointer;
     }
     .eventcalendar-content{
       display: none;
       &.is-active{
         display: block;
       }
     }
     .eventcalendar-content .js-eventcalendar-swiper,
     .news.news2 .js-eventcalendar-swiper{
         margin-top: calc(50 / 1363 * 100%);
         padding-bottom: calc(50 / 1363 * 100%);
         overflow: hidden;
         position: relative;
         @media screen and (min-width: 769px) {
           display: grid;
           grid-template-columns: repeat(3, 1fr);
           gap: calc(25 / 768 * 100%);
           padding-left: 15px;
           padding-right: 15px;
           overflow: visible;
         }
         @media screen and (min-width: 1024px) {
           margin-top: calc(80 / 1363 * 100%);
           gap: calc(50 / 1363 * 100%);
           padding-left: 0;
           padding-right: 0;
           padding-bottom: 0;
         }
         .swiper-wrapper{
           @media screen and (min-width: 769px) {
             display: contents;
           }
         }
         .news-item{
           position: relative;
           height: auto;
           padding-bottom: calc(50 / 768 * 100%);
           @media screen and (min-width: 769px) {
             padding-bottom: 0;
           }
           img{
             aspect-ratio: 600 / 450;
             width: 100%;
             object-fit: cover;
             object-position: top;
           }
           .time{
             font-size: clamp(12px, 0.4vw + 12.2px, 14px);
             font-weight: 700;
             line-height: 1.5;
             color: var(--gray-dark);
             padding-bottom: .5rem;
           }
           .news-title{
             font-size: clamp(14px, 0.4vw + 12.2px, 16px);
           }
         }
       }

         .eventcalendar-swiper-prev,
         .eventcalendar-swiper-next{
           display: none;
           position: absolute;
           top: 50%;
           z-index: 2;
           border: none;
           background: none;
           padding: 0;
           cursor: pointer;
           transform: translateY(-50%);
           line-height: 0;
           @media screen and (max-width: 768px) {
             display: block;
           }
           img{
             width: 48px;
             height: 48px;
           }
         }
         .eventcalendar-swiper-prev{
           left: -10px;
           img{
            opacity: 0.8;
           }
         }
         .eventcalendar-swiper-next{
           right: -10px;
           img{
            opacity: 0.8;
           }
         }
         .swiper-wrapper{
           @media screen and (min-width: 769px) {
             display: contents;
           }
         }
     }
    }
     .btn-sub{
              width: 100%;
              display: table;
              background: #c49b4b;
              height: 54px;
              line-height: 54px;
              text-align: center;
              font-size: clamp(14px, 0.2vw + 13.24px, 16px);
              font-weight: 700;
              color: var(--black);
              position: relative;
              color: var(--white);
              max-width: 254px;
              margin: 0 auto;
              @media screen and (min-width: 769px) {
                margin: calc(200 / 1363 * 100%) auto 0;
              }
              &::after{
                content: "";
                position: absolute;
                right: 6%;
                top: 50%;
                transform: translateY(-50%);
                width: 10px;
                height: 10px;
                background: url(../img/icon-arrow--white.svg) no-repeat center center;
                background-size: 10px 10px;
              }
            }
  }
}

table{
  border-spacing: 0;
            border-collapse: collapse;
}
body{
  font-family: var(--font-family);
  font-size:clamp(14px, 0.2vw + 13.24px, 16px);
  position: relative;
   @media screen and (min-width: 1200px) {
    font-size: 1.6rem;
   }
   color: var(--black);
   p{
    text-align: justify;
   }
   a{
    color: var(--black);
    text-decoration: none;
    word-wrap:break-word;
    
   }
    a{
    color: var(--black);
    text-decoration: none;
    &:hover{
      opacity: 0.8;
      transition: opacity 0.6s ease;
    }
   }
   .img-left{
           text-align: left;
        position: relative;
        z-index: 999;
    img{
    width: calc(926 / 1363 * 100%);
    height: auto;
     transform: translateX(-3.1rem); 
     @media screen and (min-width: 769px) {
  width: calc(626 / 1363 * 100%);
     }
    }
   }
   .img-right{
    text-align: right;
         position: relative;
     z-index: 999;
    img{
    width: calc(1216 / 1363 * 100%);
   transform: translateX(3.1rem); /* margin-rightの代わり */
   @media screen and (min-width: 769px) {
    width: calc(916 / 1363 * 100%);
   }
   }
  }
  .img-bothends{
    position: relative;
     text-align: left;
    transform: translateX(-3.1rem); 
        z-index: 999;
    .ill-left{
      width: calc(854 / 1363 * 100%);
 
    }
    .cloud-right{
      width: calc(539 / 1363 * 100%);
      position: absolute;
       z-index: 999;
      top: 0;
      left:74%;
       transform: translateX(3.1rem); 
      
    }
  }
  .img-building{
    text-align: right;
     position: relative;
     z-index: 999;
    img{
      width: calc(1143 / 1363 * 100%);
        transform: translateX(3.1rem); 
    }
  }

  /* スタイル */
  .disc{
    li{
      font-size:clamp(16px, 0.4vw + 14.48px, 18px);
      line-height: 2;
          list-style: disc;
    }
  }
    .underline{
    &:after{
                        content: "";
                        display: block;
                        width: 80px;
                        height: 2px;
                        background-color: var(--gold);
                        margin: calc(100 / 1363 * 100%) auto;
                        @media screen and (min-width: 769px) {
                        height: 4px;
                        }
    }
  }

  /* ボタン */
 
   .btn-box{
     background: url(../img/bg-btn.png) repeat center center;
   background-size: cover;
   padding: 1rem;
   width: 100%;
   height: 54px;
   max-width: 384px;
   line-height:34px;
   margin: calc(100 / 1363 * 100%) auto;
   text-align: center;
   @media screen and (min-width: 769px) {
    height: 74px;
  line-height:54px;
   }
   }
   .btn{
  border-left: 4px solid var(--black) !important;     /* 左の内側枠 */
  border-right: 4px solid var(--black) !important;
  position: relative;
   font-size: clamp(16px, 0.81vw + 12.96px, 24px);
  display: flex;
        width: 100%;
        height: 100%;
        justify-content: center;
        align-items: center;
   &:hover{
    text-decoration: none;
   }
  
  &:before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -7px;
  right: -7px;
  border-left: 1px solid var(--black);   /* 左の外枠 */
  border-right: 1px solid var(--black);  /* 右の外枠 */
  pointer-events: none;
   }
  
}

/* バーガーメニューのスタイル */
.toggle {
  position: fixed;
              top: 4.5rem;
            right: 3rem;
  width: 42px;
  height: 42px;
  z-index: 9996;
  cursor: pointer;
 background-color: var(--black);
 padding: .7rem;

 @media screen and (min-width: 769px) {
   top: 7.5rem;
  right: 6rem;
   padding: 1.5rem;
width: 70px;
  height: 70px;
 }
 .toggle-inner{
  @media screen and (min-width: 769px) {
  padding-top: .5rem;
  }
 }
}
.toggle span {
  display: block;
  width: 100%;
  height: 1.5px;
  background-color: var(--white);
  margin: 6px 0;
  transition: 0.3s;
  border-radius: 2px;
  @media screen and (min-width: 769px) {
 height: 2px;
  }
}
.toggle.active{
  top: 2.5rem;
   background-color: var(--white);
   border: 1px solid var(--black);
   @media screen and (min-width: 769px) {
   top: 4.5rem;
   }
   span{
    background-color: var(--black);
   }
}


.toggle.active span:nth-child(1) {
  transform: rotate(-45deg) translate(-8.5px, 3px);
  margin-left: .25rem;
  @media screen and (min-width: 769px) {
    transform: rotate(-45deg) translate(-8.5px, 3px);
  }
}

.toggle.active span:nth-child(2) {
  opacity: 0;
}

.toggle.active span:nth-child(3) {
  transform: rotate(45deg) translate(-8px, -3px);
  margin-left: .25rem;
  @media screen and (min-width: 769px) {
    transform: rotate(45deg) translate(-8px, -4px);
  }
}

/* ナビゲーションメニューのスタイル */
.header-common{
  display: none;
}
.header-common.active{
display: block;
height: 100vh !important;
background: white !important;
position: fixed;
width: 100%;
height: 100vh;
overflow-y: auto;
z-index: 9994;
padding: 5rem 0;
.header-nav{
 
  width: 100%;
  max-width: 1140px;
  padding: 0 3rem 3rem;
  margin: 0 auto;
  @media screen and (min-width: 769px) {
 display: grid;
  grid-template-columns:repeat(3, 1fr);
  align-items: flex-start;
  }
  &:last-child{
    padding-bottom: 0;
  }
}
.header-logo{
  img{
    max-width: 88px;
  }
}
.header-link{
  .header-link-lang{
    padding-top: 3rem;
  display: flex;
  img{
    width: 100%;
    max-width: 60px;
  }
  }
  .header-link-text{
    li{
      margin-top: 2rem;
    }
  }
  .header-link-sns{
    padding-top: 3rem;
  display: flex;
  gap:3rem;
    img{
      height: 27px;
    }
  }
}
 .header-nav-inner{
    h3{
      font-size: clamp(18px, 0.81vw + 12.96px, 20px);
      font-weight: 700;
      line-height: 2;
      margin-bottom: 3rem;
      position: relative;
      &::before{
        content: "";
        position: absolute;
                        bottom: -15px;
                        left: 0;
                        width: 60px;
                        background: var(--gold-sub);
                        height: 1px;
      }
    }
    .header-nav-list{
      li{
        line-height: 2;
      }
    }
  }
  }
}
}
.header-nav {
  transition: 0.3s;

}

.title{
  font-size:clamp(20px, 0.81vw + 19.45px, 22px);
  font-weight: 700;
  line-height: 1.5;
  margin: calc(100 / 1363 * 100%) auto;
  @media screen and (min-width: 769px) {
 font-size:clamp(24px, 1.21vw + 25.45px, 36px);
  }
}

.hr{
 border: none;                /* デフォルトの線を消す */
  border-top: 1px solid var(--black);
  width: 98%;
  margin: 1rem auto 0;
}


  .wrapper{
    text-align: center;
  width: 100%; 
   section{
    .inner{
      max-width:calc(1150 / 1363 * 100%);
      margin: 0 auto;
      @media screen and (min-width: 769px) {
        max-width:60.3081vw;
      }
    }
  }
  }

.wrapper-top{
  margin-top: 3rem;
}

  .wrapper-top{
    padding: 0 1.5rem;
    @media screen and (min-width: 769px) {
      padding: 0 3rem;
    }
  .wrapper-inner-top {
position: relative;
  border-top: 6px solid var(--black);
  width: 100%;
}

.wrapper-inner-top::before,
.wrapper-inner-top::after {
  content: "";
  position: absolute;
  top: 10px;           /* 上から10px空ける */
 bottom:0;     /* 下から10px空ける */
  width: 1px;
  background: var(--black);
}
.wrapper-inner-top::before {
  left: 0;             /* 左側の線 */
}

.wrapper-inner-top::after {
  right: 0;            /* 右側の線 */
}

}
.wrapper{
  padding: 1.5rem 1.5rem 0;
  /* overflow: hidden; */
  @media screen and (min-width: 769px) {
    padding: 1.5rem 3rem 0;
  }
  
  .wrapper-inner{
    position: relative;
  border-top: 6px solid var(--black);
  width: 100%;
  .logo-wrapper{
    position: relative;
   width: 98%;
    border-top: 1px solid var(--black);
    margin: 9px auto;
  .logo{
    position: fixed;
    top: 4rem;
    left: 3rem;
    z-index: 999;
    @media screen and (min-width: 769px) {
      top: 5rem;
      left: 5rem;
    }
    img{
     max-width: 52px;
    @media screen and (min-width: 769px) {
     max-width: 132px;
    }
  }
  }
  }
  }

.wrapper-inner::before,
.wrapper-inner::after {
  content: "";
  position: absolute;
  top: 10px;           /* 上から10px空ける */
 bottom: -500px;       /* 下から10px空ける */
  width: 1px;
  background: var(--black);
}

.wrapper-inner::before {
  left: 0;             /* 左側の線 */
}

.wrapper-inner::after {
  right: 0;            /* 右側の線 */
}
}
.footer{
    background: url(../img/bg-footer.png) repeat-x left top;
  background-size: cover;
  padding: 0 1.5rem 3rem;
  margin-bottom: -25px;
  overflow: hidden;
  @media screen and (min-width: 769px) {
    padding: 0 3rem 3rem;
  }
  .footer-inner{
    position: relative;
  border-bottom: 6px solid var(--black);
  padding-top: calc(200 / 1424 * 100%);
    width: 100%;
    margin: 0 auto;
    .footer-inner-top::before,
    .footer-inner-top::after {
      content: "";
      position: absolute;
      top: 0;           /* 上から10px空ける */
      bottom:10px;        /* 下から10px空ける */
      width: 1px;
      background: var(--black);
    }

    .footer-inner-top::before {
      left: 0;             /* 左側の線 */
    }

    .footer-inner-top::after {
      right: 0;            /* 右側の線 */
    }
    .footer-inner-top{
    max-width: 1040px;
    margin: 0 auto;
    }
    .footer-nav{
        margin-bottom: calc(50 / 1363 * 100%);
      @media screen and (min-width: 769px) {
      
        padding-left: 50%;
        display: flex;
        justify-content: center;
       margin-top: calc(-50 / 1363 * 100%);
        }

     .footer-nav-sns{
      display: flex;
      justify-content: center;
      align-items: center;
  gap: calc(100 / (1363 / 2) * 100%);
  margin-bottom: calc(50 / 1363 * 100%);
      @media screen and (min-width: 769px) {
  justify-content: flex-start;
      }
     img{
      width: 100%;
     max-width: 42px;
      height: auto;
      @media screen and (min-width: 769px) {
     
            max-width: 62px;
      }
     }
     }
     .footer-nav-list{
      margin: calc(120 / 1363 * 100%) auto;
      display: table;
      @media screen and (min-width: 769px) {
        margin: 0;
       display: grid;
grid-template-columns: 50% 50%;
      gap: calc(20 / 1363 * 100%);
      }
      
      ul{
        &:first-child{
            li{
              position: relative;
              padding-left: 2rem;
              &::before{
                content:"";
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                left: 0;
                width: 14px;
                height: 14px;
                background: url(../img/ic-spacer.svg) no-repeat left center;
                background-size: 14px 14px;
                
              }
          a{
            font-size: clamp(17px, 0.2vw + 19.24px, 18px);
            font-weight: 600;
            line-height: 1.8;
            span{
              font-size: clamp(15px, 0.2vw + 15.24px, 17px);
              font-weight: 400;
            }
          }
        }
        
        }&:last-child{
          li{
            position: relative;
              padding-left: 2rem;
              &::before{
                content:"";
                position: absolute;
                top: 15px;
                left: 0;
                width: 10px;
                height: 10px;
                background: url(../img/ic-spacer.svg) no-repeat left center;
                background-size: 10px 10px;
                
              }
              .footer-nav-sublist{
        li{
          padding-left: 0;
          &:before{
            content:none;
          }
        }
      }
            a{
              font-size:clamp(16px, 0.2vw + 15.24px, 18px);
             line-height: 2;
            }
          }
        }
      }
     }
     .footer-nav-other{
      text-align: center;
      @media screen and (min-width: 769px) {
        text-align: justify;
      }
     }
    }
    .footer-logo{
      padding: calc(840 / 1363 * 100%) 0 calc(60 / 1363 * 100%);
      text-align: center;
      @media screen and (min-width: 769px) {
        padding: calc(110 / 1363 * 100%) 0 0;
      }
      img{
        width: 100%;
        max-width:125px;
        height: auto;
        @media screen and (min-width: 769px) {
        max-width:145px;
        }
      }
    }
  }
  .footer-text-notes{
    font-size: clamp(8px, 0.2vw + 11.24px, 10px);
    @media screen and (min-width: 769px) {
      font-size: clamp(12px, 0.2vw + 11.24px, 14px);
    }
    text-align: center;
  width: 85%;
    margin: 0 auto;
    padding:0 0 calc(30 / 1363 * 100%);
  }
  .footer-copyright{
    font-size: clamp(12px, 0.2vw + 11.24px, 14px);
    text-align: center;
    width: 98%;
    margin: 0 auto;
    border-top: 1px solid var(--black);
    padding: calc(10 / 1363 * 100%) 0;
  }
}

/* formrun-embed */

@media (max-width: 554px) {
    .layout-nocover .nocover-body .center-wrap .center-body {
      display: block;
        margin: 0 auto;
        max-width: 100% !important;
        width: 100%;
        padding: 0 0 16px !important;
    }
}
    .layout-nocover .nocover-body .center-wrap .center-body {
        display: block;
        margin: 0 auto;
        max-width: 100% !important;
        width: 100%;
        padding: 0 0 16px !important;
    }
.event-end{
  .event-end--text{
    font-size:clamp(18px, 0.61vw + 17.72px, 22px);
    font-weight: 700;
    line-height: 1.4;
    border: solid 2px #c32414;
    padding: calc(20 / 700 * 100%) ;
    width: 100%;
    max-width: 800px;
    margin: 0 auto calc(80 / 1363 * 100%);
    color: #c32414;
    @media screen and (min-width: 769px) {
      border: solid 4px #c32414;
     font-size:clamp(24px, 0.61vw + 17.72px, 28px);
    }
    .small{
      font-size:clamp(16px, 0.61vw + 17.72px, 19px);
      @media screen and (min-width: 769px) {
        font-size:clamp(19px, 0.61vw + 17.72px, 20px);
    }
    }
  }
}

.btn_link{
	background: #fff;
	border: var(--black) solid 1px;
	display: block;
	padding: 1rem;
	width: 100%;
	max-width: 300px;
	margin: 0 auto;
	text-align: center;
  position: relative;
  border-radius: .5rem;
  transition: .3s;
}
.btn_link:hover{
  background: var(--black);
  color:#fff;
}

.img_clip{
	position: relative;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: #ccc;
}
.img_clip img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: 1s;
}

.page_nav{
  display: flex;
  justify-content: space-between;
  margin: 3rem 0;
  flex-wrap: wrap;
}
.page_nav li{
  width: 50%;
  margin: .5rem 0;
  padding: 0 .5rem;
}
.page_nav li .btn_link{
  font-size: 1.2rem;
  word-break: auto-phrase;
  line-height: 1.4;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 5.5rem;
}
.page_nav li.current .btn_link{
  background: var(--black);
  color: #fff;
}

.hover_up{
  transition: .3s !important;
}
.hover_up img{
  vertical-align: bottom;
}
.hover_up:hover{
  transform: translateY(-5px);
  box-shadow: 0 12px 10px -6px rgba(0,0,0,.3);
  opacity: 1;
}


.page_links{
  text-align: center;
  display: flex;
  justify-content: center;
  margin: 3rem 0;
}
.page_links a, 
.page_links span{
  text-decoration: none;
	font-size: 1.4rem;
	margin: 0 .2rem;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  border: var(--black) solid 1px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.page_links span.current{
	color: #fff;
  background: var(--black);
}
.page_links a:hover{
	background: var(--black);
  color: #fff;
}
.page_links a.next{
  margin-left: 1rem;
}
.page_links a.prev{
  margin-right: 1rem;
}

@media screen and (min-width: 768px){
  .page_nav li{
    width: 25%;
    flex: 1;
  }
}

@media screen and (min-width: 1024px){
  .page_nav li .btn_link{
    font-size: 1.6rem;
    height: 7rem;
  }
}