@charset "UTF-8";
/** for header & footer overwidth color */
/** source code Jun.24.2023
  1: ( mediumaquamarine, white ),
  2: ( #a1b8ca, white ),
  3: ( v.$lightgrn, v.$yellow ),
  4: ( #cbb7a5, white ),
  5: ( #f3c261, v.$gray ),
  6: ( #f48989, white ),
  7: ( paleturquoise, white ),
  8: ( #ece368, v.$gray ),
  9: ( cadetblue, white ),
  10: ( #88eeaa, v.$lightyellow ),
  11: ( #a0d4f4, white ),
  12: ( #dad74a, v.$gray ),
  13: ( #ffb6ca, white ),
  14: ( #d288aa, white ),
  */
/* botton color */
/* Saimaru  */
/* Sansai Station */
/* Admin Update button */
/* Inquiry Confirm Page */
/* Inquiry Page */
/* Inquiry Page , Admin Create Page */
/* Inquiry Page */
/* for Calendar Color - Sunday, Saturday, Holiday */
/* Top Logo in Navigation =========================== */
.logonavi {
  padding-left: 1em;
  padding-top: 5px;
  text-align: left;
  /* background:#f4faf8;
     background color */
  width: 100%;
}

.logonavi span.remark {
  display: none;
}

.logonavi:hover span.remark {
  text-align: left;
  /* bellow for popup remark */
  /* display: block;
  line-height: 1.2em;
  margin: 0.5em;
  padding: 0.5em;
  position: absolute;
  top: 45px;
  background-color: #ddffdd22;
  color: #555; */
  /* width: 20em; */
  /* color: #9bdd9f; */
}

.orverwidth {
  margin: 0 -200%;
  padding: 0 200%;
  background-color: #fefffe;
  text-align: center;
}

.logonavi-l {
  display: inline-block;
  /* margin-left: 1em; */
  margin-top: 0px;
  /* position: fixed; */
}
@media screen and (max-width: 767px) {
  .logonavi-l {
    margin-right: 0.1em;
  }
}
@media screen and (min-width: 768px) {
  .logonavi-l {
    margin-right: 0.1em;
  }
}
@media screen and (min-width: 1024px) {
  .logonavi-l {
    margin-right: 0.1em;
  }
}

.logonavi-r {
  margin-top: 1em;
  float: right;
  text-align: left;
  /* display: inline-block; */
  margin-right: 1em;
  vertical-align: middle;
  color: #555;
}

.logopi {
  display: inline-block;
  /* margin-top: 15px; */
  vertical-align: bottom;
  margin-bottom: 0px;
  /* position: fixed; */
}
@media screen and (max-width: 767px) {
  .logopi {
    font-size: 70%;
  }
}
@media screen and (min-width: 768px) {
  .logopi {
    font-size: 100%;
  }
}
@media screen and (min-width: 1024px) {
  .logopi {
    font-size: 100%;
  }
}

/** ul,liの設定をし直す。vertical positionを揃えるため。 **/
.logopi ul, li {
  margin-bottom: 0em !important;
  list-style-type: none;
}

/*********************************************/
/* メニューの設定 =========================== */
.menu {
  margin-top: 0px;
  height: 50px;
  width: 100%;
  /* position: fixed; */
  /* background:#f4faf8;   background color */
}

.menu-admin {
  margin-top: 0px;
  height: 50px;
  width: 100%;
}

/*********************************************/
/* メニューの表示設定 ======================== */
/* スマートフォン */
@media screen and (max-width: 767px) {
  .menu {
    display: none;
  }
  .acc {
    display: none;
  }
  /* change setup for top page slide show */
  .slider {
    display: block;
    max-width: 700px;
    width: 95%;
  }
  .bargmenu {
    display: block;
  }
  .aside {
    display: none;
  }
}
/* タブレット */
@media screen and (min-width: 768px) {
  .acc {
    display: block;
  }
  .bargmenu {
    display: none;
  }
}
/* パーソナルコンピューター デスクトップ */
@media screen and (min-width: 1024px) {
  .acc {
    display: block;
  }
  .bargmenu {
    display: none;
  }
}
/* ここまで */
/*========= ナビゲーションドロップダウンのためのCSS ===============*/
/*==ナビゲーション全体の設定*/
nav {
  /* background:#f4faf8;   background color */
  color: #777;
  text-align: center;
  clear: both;
}

/*ナビゲーションを横並びに*/
nav ul {
  list-style: none;
  display: flex;
  justify-content: center;
}

/*2階層目以降は横並びにしない*/
nav ul ul {
  display: block;
}

/*下の階層のulや矢印の基点にするためliにrelativeを指定*/
nav ul li {
  position: relative;
}

/*ナビゲーションのリンク設定*/
nav ul li a {
  display: block;
  text-decoration: none;
  color: #555;
  /* sp */
  transition: all 0.3s;
}
@media screen and (max-width: 767px) {
  nav ul li a {
    padding: 5px 10px;
  }
}
@media screen and (min-width: 768px) {
  nav ul li a {
    padding: 14px 24px;
  }
}
@media screen and (min-width: 1024px) {
  nav ul li a {
    padding: 14px 24px;
  }
}

nav ul li li a {
  padding: 6px 16px;
}

nav ul li a:hover {
  color: #6a6;
}

/*==矢印の設定*/
/*2階層目を持つliの矢印の設定*/
nav ul li.has-child::before {
  content: "";
  position: absolute;
  left: 15px;
  top: 25px;
  width: 6px;
  height: 6px;
  border-top: 2px solid #999;
  border-right: 2px solid #999;
  transform: rotate(135deg);
}

/*3階層目を持つliの矢印の設定*/
nav ul ul li.has-child::before {
  content: "";
  position: absolute;
  left: 6px;
  top: 17px;
  width: 6px;
  height: 6px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
}

/*== 2・3階層目の共通設定 */
/*下の階層を持っているulの指定*/
nav li.has-child ul {
  /*絶対配置で位置を指定*/
  position: absolute;
  left: 0;
  top: 62px;
  z-index: 4;
  /*形状を指定*/
  background: #71e2ad;
  width: 180px;
  /*はじめは非表示*/
  visibility: hidden;
  opacity: 0;
  /*アニメーション設定*/
  transition: all 0.3s;
}

/*hoverしたら表示*/
nav li.has-child:hover > ul,
nav li.has-child ul li:hover > ul,
nav li.has-child:active > ul,
nav li.has-child ul li:active > ul {
  visibility: visible;
  opacity: 1;
}

/*ナビゲーションaタグの形状*/
nav li.has-child ul li a {
  color: #fff;
  border-bottom: solid 1px rgba(255, 255, 255, 0.6);
}

nav li.has-child ul li:last-child a {
  border-bottom: none;
}

nav li.has-child ul li a:hover,
nav li.has-child ul li a:active {
  background: #53ca93;
}

/*==3階層目*/ /*3階層目の位置*/
nav li.has-child ul ul {
  top: 0;
  left: 182px;
  background: #53ca93;
}

nav li.has-child ul ul li a:hover,
nav li.has-child ul ul li a:active {
  background: #34ad75;
}

/*==768px以下の形状*/
@media screen and (max-width: 767px) {
  nav {
    padding: 0;
  }
  nav ul {
    display: block;
  }
  nav li.has-child ul,
  nav li.has-child ul ul {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    visibility: visible; /*JSで制御するため一旦表示*/
    opacity: 1; /*JSで制御するため一旦表示*/
    display: none; /*JSのslidetoggleで表示させるため非表示に*/
    transition: none; /*JSで制御するためCSSのアニメーションを切る*/
  }
  nav ul li a {
    border-bottom: 1px solid #ccc;
  }
  /*矢印の位置と向き*/
  nav ul li.has-child::before {
    left: 20px;
  }
  nav ul ul li.has-child::before {
    transform: rotate(135deg);
    left: 20px;
  }
  nav ul li.has-child.active::before {
    transform: rotate(-45deg);
  }
}
/* ハンバーガーメニュー =================================*/
/* ハンバーガーメニュー */
.gnav-toggle {
  position: relative;
  margin-top: 12px;
}

/*チェックボックス等は非表示に*/
.gnav-hidden {
  display: none;
}

/*アイコンのスペース*/
#gnav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
}

/*ハンバーガーの形をCSSで表現*/
#gnav-open span,
#gnav-open span::before,
#gnav-open span::after {
  content: "";
  position: absolute;
  height: 3px;
  /*線の太さ*/
  width: 25px;
  /*長さ*/
  border-radius: 3px;
  background: #555;
  display: block;
  cursor: pointer;
}

#gnav-open span::before {
  bottom: -8px;
}

#gnav-open span::after {
  bottom: -16px;
}

/*閉じる用の薄黒箇所*/
#gnav-close {
  display: none;
  position: fixed;
  z-index: 90;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0;
  transition: 0.3s ease-in-out;
}

/*チェックがついたら表示させる*/
#gnav-input:checked ~ #gnav-close {
  display: block;
  opacity: 0.5;
}

#gnav-input:checked ~ #gnav-content {
  transform: translateX(0%);
  box-shadow: 6px 0 25px rgba(0, 0, 0, 0.15);
}

/* メニューの中身 */
#gnav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 300;
  width: 70%;
  max-width: 300px;
  height: 100%;
  background: rgba(8, 67, 8, 0.88);
  transition: 0.3s ease-in-out;
  transform: translateX(-105%);
}

.gnav-menu {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 30px;
  text-transform: uppercase;
}

.gnav-item {
  margin: 10px;
  padding-bottom: 20px;
  color: #aaa;
}

.gnav-item a {
  color: #fff;
  font-size: 12px;
  display: block;
  width: 200px;
  text-align: left;
}

.gnav-item a::first-line {
  font-size: 14px;
  font-weight: bold;
}

/* ハンバーガーメニュー、表示 ここまで ========= *//*# sourceMappingURL=navstyle.css.map */