@charset "UTF-8";
/* normalize.cssに追記 */
*,
*::before,
*::after{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body{
  font-family: "Montserrat", "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  background-color: #ffffff;
  color: #172245;/*文章文字カラー*/
  line-height: 1.6;
  margin: 0;
  padding: 0;
}/* 5/21記述ダブりがあったので下の共通一部消してこちらに移動しました。山口 */
html, body {
  height: 100%;
}

h1{
  margin: 0;
}

a{
  color: var(--font-color);
  text-decoration: none;
}
img{
  vertical-align: bottom;/* 基本浮いているので下の空白をなくし揃える */
  width: 100%;
  height: auto;
}
ol,ul{
  list-style: none;
}

/* 共通部分＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
.inner{/*メイン内容共通の余白*/
  max-width: 1200px;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}

.wrapper {
  display: flex;
  flex-direction: column;
  min-height: 100vh; /* 画面全体の高さに */
}

/*ヘッダー＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
header {
  background-color: #ffffff; /* ベース白 */
  padding: 20px 20px 7px 20px;
  border-bottom: 9px solid #00356e ;
  color: #00356e;/*メインカラー*/
  position: fixed;
  z-index: 10000;/* 5/19 位置修正。山口 */
  width: 100%;
  height: auto;
}

.header-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.header-top ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  font-size: 16px;
  font-weight: bold;
  white-space: nowrap;
}

.nav-text1 {
  padding: 0 2vw;
  border-right:  2px solid #00356e;
}
.nav-text2 {
  padding: 0 2vw;
}

.logo{
  width: 100px;
  bottom: 0;
}

.header-list nav a {
  text-decoration: none;
  color: #00356e;
}

/*下層ページ共通・タイトル＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
.page-image{
  padding-top: 56px;
  position: relative;
  padding-top: 100px;
}/*上部タイトル装飾*/

.fuchidori{
  font-family:sans-serif;
  font-weight: bold;/*太字にしてます5/23*/
  color:rgba(0,0,0,.0);
  text-align:center;
  padding: 40px 0;
  -webkit-text-stroke: 1px #FFF;
  position: absolute;
  left: 10%;
  top: 35%;
  font-size: calc(64/1440*100vw);
  margin-bottom: 10px;
}/*上部タイトル白フチ文字*/

/*文字装飾
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/

/*  m1　見出デザイン　*/
/* m1{
  font-size: calc(64/1440*100vw);
  margin-bottom: 10px;
  margin: 0;
} */


/*  m2　見出デザイン　*/
.m2{
  font-size: calc(48/1440*100vw); 
    line-height: 1;
    width: 100%;
    text-align: center;
    font-weight: normal; 
    left: 0;
    bottom: 0;
}
/* .m2 span{
  display: block;
  text-align: right;
} */ 
/*pcでは改行しない。mobileで改行する*/


/*  m3　見出デザイン　*/

.m3 .en {
  font-size: calc(64/1440*100vw); 
  font-weight: normal; 
  line-height: 0.8;
  text-align: center;
  color: #00356e;
  margin: 60px,0,0,48px ;
  padding: 20px,10px,10px,20px;
}
.m3 .jp {
  font-size: calc(32/1440*100vw); 
  font-weight: normal; 
  color: #00356e;
}
.m3 {
  text-align: center;
}
.m3 span{
  display: block;
}

.m3c .en {
  font-size: calc(64/1440*100vw); 
  font-weight: normal; 
  line-height: 0.8;
  color: #FFF;
  margin: 60px,0,0,48px ;
  padding: 20px,10px,10px,20px;
}
.m3c .jp {
  font-size: calc(32/1440*100vw); 
  font-weight: normal; 
  color: #FFF;
}
/* .m3c {
  text-align: center;
} */
.m3c span{
  display: block;
}

/*  m4　見出デザイン　*/
.m4{
  font-size: calc(32/1440*100vw); 
    line-height: 1;
    font-weight: normal;
}
.m4b{
  font-size: calc(32/1440*100vw); 
  line-height: 1;
  font-weight: bold;  
}
.m4c{
  font-size: calc(32/1440*100vw); 
  line-height: 1;
  color: #FFF; 
}
.m4bc{
  font-size: calc(32/1440*100vw); 
  line-height: 1;
  font-weight: bold;  
  color: #FFF; 
}

/*  m5　見出デザイン　*/
.m5{
  font-size: calc(16 / 1440 * 100vw);
  line-height: 1.2; 
}
.m5 span{
  font-size: calc(16 / 1440 * 100vw);
  display: block;
}

.m5b{
  font-size: calc(16 / 1440 * 100vw);
  line-height: 1.3; 
  font-weight: bold;  
}
.m5b span{
  font-size: calc(16 / 1440 * 100vw);
  display: block;
}

.m5c{
  font-size: calc(16 / 1440 * 100vw);
  line-height: 1.2; 
  color: #FFF; 
}
.m5c span{
  font-size: calc(16 / 1440 * 100vw);
  display: block;
}

.m5bc{
  font-size: calc(16 / 1440 * 100vw);
  line-height: 1.2; 
  font-weight: bold;  
  color: #FFF; 
}
.m5bc span{
  font-size: calc(16 / 1440 * 100vw);
  display: block;
}

/*  m6　見出デザイン　*/
.m6{
  font-size: calc(24/1440*100vw); 
    line-height: 1;
    font-weight: normal;

}
.m6 span{
  display: block;
  line-height: 1.3; 
}

.m6b{
  font-size: calc(24/1440*100vw); 
  line-height: 1;
  font-weight: bold;  
}

.m6b span{
  display: block;
}


/* イベント・活動案内POP＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.calendar-btn{
  position: fixed;
  top: 130px;
  right: 30px;
  z-index: 1100;
  border: none;
  background-color:transparent;
}
.calendar-btn img {
  width: 10vw;
  height: auto;
  object-fit: contain;
}

/* フッター　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* 下部　＝＝＝＝*/
.foot-element {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: flex-end; /* または center, depending on layout */
  height: 200px; /* 必要に応じて調整 */
}
/* インスタ　*/
.insta-link{
  position: absolute;
  width: 100px;
  height: auto;
  display: inline-block;
  bottom: 20%;
  left: 50%;
  transform: translateX(-50%);
}

/* 風見鶏　*/
.kazamidori {
  position: absolute; /* 追加 */
  left: 1rem;          /* 任意で調整。数値を増やすともっと左へ移動 */
  bottom: 0;           /* 必要に応じて上下位置も調整 */
  width: 100px;
  height: auto;
  animation: rotate_anime 2s linear infinite;
}

@keyframes rotate_anime {
  0% {
    transform: rotateY(0deg);
  }
  100% {
    transform: rotateY(360deg);
  }}
  
/* ↑ここまで下部装飾↑　(5/20更新）＝＝＝＝＝＝*/
footer {
  width: 100%;
  height: 474px;
  position: relative;
  overflow: hidden;
  text-align: center;
}

.fotter-back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

.fotter-back img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.footnav,
.copyright {
  position: relative;
  z-index: 1;
  color: white;
  padding: 50px 0;
}
.footnav ul li{
  margin-top: 20px;
  line-height: 3;
  font-size:16px;
}
.copyright {
  margin-top: 50px;
}

/* メディアクエリ（PC用）======================================================
=============================================================================*/
@media screen and (min-width: 1440px) {
  /* ハンバーガー初期非表示（PC用）＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
    .trigger {
      display: none;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      width: 40px;
      height: 30px;
      cursor: pointer;
      z-index: 11001; /* ナビより上に */
      position: relative;
    }
    .trigger .bar {
      width: 100%;
      height: 4px;
      background-color: #00356e;
      margin: 4px 0;
      transition: 0.3s;
    }
    /* ナビはデフォルト表示 */
    nav {
      display: block;
    }
  }
  
  /* レスポンシブデザイン（タブレット向け幅900px以下） ===============================*/
  
  /* モバイル時はnav非表示、ハンバーガー押下時のみ表示 */
  @media screen and (max-width: 900px) {
  /* ハンバーガーメニュー==================================================*/
  .trigger{
    width: 50px;
    height: 50px;
    position: fixed;
    right: 20px;
    top: 20px;
    z-index: 1000;
    cursor: pointer;
  }
  .bar{
    display: block;
    background-color: #00356e;
    width:50px;
    height: 2px;
    position: absolute;
    left: 0;
  }
  .bar1{top: 12px;}
  .bar2{top: 24px;}
  .bar3{top: 36px;}
  /* ナビゲーション */
  .nav{
    width: 100%;
    height: 70vh;
    background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.8)100%);
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    left: 0;
    /*  デフォルトの位置 */
    top: -70vh;
    z-index: 900;
  }
  .nav ul{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4vh;
    text-transform: uppercase;
    font-size: calc( 20rem/16 );
    font-weight: bold;
    letter-spacing: 0.3em;
  }
  .nav-text1 {
    border-right: none;
  }
  /*  triggerをタップした時 */
  body.open{
    overflow: hidden;
  }
  .open .bar1{top: 24px; rotate: 215deg;}
  .open .bar2{opacity: 0;}
  .open .bar3{top: 24px; rotate: -215deg;}
  
  .open .nav{
    top: 0;
  }
  .bar,
  .nav{
    transition: 0.4s ease-in-out;
  }
  /* イベントPOP ==================*/
  .calendar-btn {
    top: 100px;
    right: 10px;
  }
  
  .calendar-btn img {
    width: 15vw !important;
    height: auto;
    object-fit: contain;
  }
  
  #calendarBtn {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    animation: none !important;
    transition: none !important;
  }
  
  #calendarBtn.hidden {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }
    /* フッター ==================*/
    .kazamidori {
      left: 0.5rem;
      width: 60px;
    }

    footer {
      height: 200px; /* モバイル時は少し高さを減らす */
      background-size: cover;
      padding-bottom: 10px;
    }
    .footnav,
    .copyright {
      position: relative;
      z-index: 1;
      color: white;
      padding: 10px;
    }
    .footnav ul li{
      margin-top: 11px;
      line-height: 2;
      font-size:12px;
    }
    .copyright {
      font-size:10px;
      margin-top: 10px;
    }
    
    
/*  m3　見出デザイン　*/

.m3 .en {
  font-size: calc(64/900*100vw); 
  font-weight: normal; 
  line-height: 0.8;
  text-align: center;
  color: #00356e;
  margin: 60px,0,0,48px ;
  padding: 20px,10px,10px,20px;
}
.m3 .jp {
  font-size: calc(32/900*100vw); 
  font-weight: normal; 
  color: #00356e;
}
.m3 {
  text-align: center;
}
.m3 span{
  display: block;
}

.m3c .en {
  font-size: calc(64/900*100vw); 
  font-weight: normal; 
  line-height: 0.8;
  color: #FFF;
  margin: 60px,0,0,48px ;
  padding: 20px,10px,10px,20px;
}
.m3c .jp {
  font-size: calc(32/900*100vw); 
  font-weight: normal; 
  color: #FFF;
}
/* .m3c {
  text-align: center;
} */
.m3c span{
  display: block;
}

/*  m4　見出デザイン　*/
.m4{
  font-size: calc(32/900*100vw); 
    line-height: 1;
    font-weight: normal;
}
.m4b{
  font-size: calc(32/900*100vw); 
  line-height: 1;
  font-weight: bold;  
}
.m4c{
  font-size: calc(32/900*100vw); 
  line-height: 1;
  color: #FFF; 
}
.m4bc{
  font-size: calc(32/900*100vw); 
  line-height: 1;
  font-weight: bold;  
  color: #FFF; 
}

/*  m5　見出デザイン　*/
.m5 {
  font-size: calc(16/900*100vw);
  line-height: 1.2; 
}
.m5 span{
  font-size: calc(16/900*100vw);
  display: block;
}

.m5b{
  font-size: calc(16/900*100vw);
  line-height: 1.3; 
  font-weight: bold;  
}
.m5b span{
  font-size: calc(16/900*100vw);
  display: block;
}

.m5c{
  font-size: calc(16/900*100vw);
  line-height: 1.2; 
  color: #FFF; 
}
.m5c span{
  font-size: calc(16/900*100vw);
  display: block;
}

.m5bc{
  font-size: calc(16/900*100vw);
  line-height: 1.2; 
  font-weight: bold;  
  color: #FFF; 
}
.m5bc span{
  font-size: calc(16/900*100vw);
  display: block;
}

/*  m6　見出デザイン　*/
.m6{
  font-size: calc(24/900*100vw); 
    line-height: 1;
    font-weight: normal;
}
.m6b{
  font-size: calc(24/900*100vw); 
  line-height: 1;
  font-weight: bold;  
}
  }

/* レスポンシブデザイン（スマホ向け幅500px以下） ===============================*/
  @media screen and (max-width: 500px) {
/*  m2　見出デザイン　*/
.m2{
  font-size: calc(20/500*100vw); 
    line-height: 1;
    width: 100%;
    text-align: center;
    font-weight: normal; 
    left: 0;
    bottom: 0;
}
.m2 span{
  display: block;
  text-align: center;

}


/*  m3　見出デザイン　*/

.m3 .en {
  font-size: calc(64/500*100vw); 
  font-weight: normal; 
  line-height: 0.8;
  text-align: center;
  color: #00356e;
  margin: 60px,0,0,48px ;
  padding: 20px,10px,10px,20px;
}
.m3 .jp {
  font-size: calc(32/500*100vw); 
  font-weight: normal; 
  color: #00356e;
}
.m3 {
  text-align: center;
}
.m3 span{
  display: block;
}

.m3c .en {
  font-size: calc(64/500*100vw); 
  font-weight: normal; 
  line-height: 0.8;
  color: #FFF;
  margin: 60px,0,0,48px ;
  padding: 20px,10px,10px,20px;
}
.m3c .jp {
  font-size: calc(32/500*100vw); 
  font-weight: normal; 
  color: #FFF;
}
/* .m3c {
  text-align: center;
} */
.m3c span{
  display: block;
}

/*  m4　見出デザイン　*/
.m4{
  font-size: calc(18/500*100vw); 
    line-height: 1;
    font-weight: normal;
}
.m4b{
  font-size: calc(18/500*100vw); 
  line-height: 1;
  font-weight: bold;  
}
.m4c{
  font-size: calc(18/500*100vw);  
  line-height: 1;
  color: #FFF; 
}
.m4bc{
  font-size: calc(18/500*100vw);  
  line-height: 1;
  font-weight: bold;  
  color: #FFF; 
}
/*  m5　見出デザイン　*/
.m5{
  font-size: calc(14/500*100vw);
  line-height: 1.2; 
}
.m5 span{
  font-size: calc(14/500*100vw);
  display: block;
}

.m5b{
  font-size: calc(14/500*100vw);
  line-height: 1.3; 
  font-weight: bold;  
}
.m5b span{
  font-size: calc(14/500*100vw);
  display: block;
}

.m5c{
  font-size: calc(14/500*100vw);
  line-height: 1.2; 
  color: #FFF; 
}
.m5c span{
  font-size: calc(14/500*100vw);
  display: block;
}

.m5bc{
  font-size: calc(14/500*100vw);
  line-height: 1.2; 
  font-weight: bold;  
  color: #FFF; 
}
.m5bc span{
  font-size: calc(14/500*100vw);
  display: block;
}

/*  m6　見出デザイン　*/
.m6{
  font-size: calc(12/500*100vw); 
    line-height: 1;
    font-weight: normal;
}
.m6b{
  font-size: calc(12/500*100vw); 
  line-height: 1;
  font-weight: bold;  
}
.fuchidori{
  font-family:sans-serif;
  font-weight: 200;
  color: #FFF;
  font-size: calc(24/500*100vw);
  margin-top : 10px;
  left: 5%;
}/*上部タイトル白フチ文字*/
}