@charset "UTF-8";
/* Document
 * ========================================================================== 
  ボタンやタイトル等の共通パーツCSS
  以下の基本CSSを読み込み */
@import url(reset.css);
@import url(variable.css);
@import url(module.css);

/* ==================================================
  レイアウト
================================================== */
/* --------------------------------------
  ボディ、メイン
-------------------------------------- */
.body-wrapper {
	position: relative;
  padding: var(--header-height) 0 0 0;
  overflow: clip;
  visibility: hidden;
  opacity: 0;
  transition: opacity .4s ease-in-out, visibility .4s ease-in-out;
  font-family: var(--font-family-sans-sefif);
  font-size: var(--font-size-small);
}
@media print, screen and (min-width: 768px) {
	.body-wrapper {
		min-width: 1024px;
    font-size: var(--font-size-base);
    padding: 0 0 0 0;
	}
}

html.is-loaded .body-wrapper {
  visibility: visible;
  opacity: 1;
}

/* --------------------------------------
  ヘッダー
-------------------------------------- */
.header {
  z-index: var(--zindex-header);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
	height: var(--header-height);
	background-color: white;
}
@media print, screen and (min-width: 768px) {
  .header {
    background-color: transparent;
  }
}

.header.is-fixed {
	position: fixed;
  transform: translate(0, -105%);
}

.header-is-fixed .header.is-fixed {
  transition: all .3s ease;
}

.site-scroll-up .header.is-fixed,
.gnav-is-active .header.is-fixed {
  transition: .48s ease;
  transform: translate(0, 0);
}

/* ヘッダーコンテンツの大枠 */
.header__container {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  padding: 0 0 0 4vw;
}

/* ロゴ部分 */
.header__logo {
  max-width: 240px;
  display: block;
  position: relative;
  z-index: var(--zindex-headerLogo);
}

.header__logo img {
  display: block;
  width: 100%;
}

/* --------------------------------------
  フッター
-------------------------------------- */
.footer {
	position: relative;
  padding: 2rem var(--content-side-gutter-medium) 3.5rem;
}
@media print, screen and (min-width: 768px) {
	.footer {
		padding: 4rem var(--content-side-gutter-medium) 1rem;
	}
}

/* コンテンツ上部 */
.footer__top-container {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 20px;
  margin-bottom: 2rem;
}
@media print, screen and (min-width: 768px) {
  .footer__top-container {
    grid-template-columns: 1fr 1fr;
    align-items: center;
    margin-bottom: 3rem;
  }
}

/* ロゴ */
.footer__logo {
  max-width: 400px;
  display: block;
}

.footer__logo img {
  display: block;
  width: 100%;
}

/* 連絡先 */
.footer__contact {
  width: 100%;
  background-color: #FFF583;
  border-radius: 9px;
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 3px;
  padding: 16px 5%;
}
@media print, screen and (min-width: 768px) {
  .footer__contact {
    grid-template-columns: 1fr 1fr;
  }
}

.footer__contact a,
.footer__contact p {
  color: var(--color-dark);
  display: block;
  font-weight: 500;
  font-size: 20px!important;
}
@media print, screen and (min-width: 768px) {
  .footer__contact a,
  .footer__contact p {
    text-align: center;
  }
  .footer__contact a {
    border-right: 1px solid var(--color-dark);
  }
}


/* 下部 コピーライト */
.footer__copy {
  border-top: 1px solid var(--color-gray-light);
  padding: 10px 0;
  margin-top: 30px;
}
@media print, screen and (min-width: 768px){
  .footer__copy {
    text-align: center;
  }
}

/* --------------------------------------
  セクション
-------------------------------------- */
.container {
  position: relative;
}

.section.section--0 {
  padding-top: 0;
  padding-bottom: 0;
}

.section.section--small {
  padding-top: var(--section-gutter-small);
  padding-bottom: var(--section-gutter-small);
}

.section.section--large {
  padding-top: var(--section-gutter-large);
  padding-bottom: var(--section-gutter-large);
}

/* 上 */
.section.section--top-large {
  padding-top: var(--section-gutter-large);
}

.section.section--top-small {
  padding-top: var(--section-gutter-small);
}

.section.section--top-0 {
  padding-top: 0;
}

/* 下 */
.section.section--bottom-large {
  padding-bottom: var(--section-gutter-large);
}

.section.section--bottom-small {
  padding-bottom: var(--section-gutter-small);
}

.section.section--bottom-0 {
  padding-bottom: 0;
}

/* 0 */
.section.section--full {
  padding: 0;
}

/* --------------------------------------
  コンテナ
-------------------------------------- */
.container {
	padding: 0 var(--content-side-gutter-medium) 0;
}

.container.container--full {
	padding: 0;
}

/* ==================================================
  プロジェクト
================================================== */
/* --------------------------------------
  ローディング
-------------------------------------- */
.loading {
  z-index: var(--zindex-loading);
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 100vw;
  height: 100%;
  overflow: hidden;
  text-align: center;
  visibility: visible;
  background-color: white;
  opacity: 1;
  transition: transform 500ms cubic-bezier(.165, .84, .44, 1) 300ms;
}

.loading.is-hidden {
	transform: scaleX(0);
  transform-origin: right;
}

.loading__logo {
  z-index: 2;
	width: 10rem;
}
@media print, screen and (min-width: 768px) {
  .loading__logo {
    width: 14rem;
  }
}

.loading__progress {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  display: block;
  width: 0;
  height: 100%;
  background: var(--color-beige);
}

/* --------------------------------------
  ハンバーガーボタン
-------------------------------------- */
.hamburger {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--header-height);
  aspect-ratio: 1/1;
  padding: 0;
  cursor: pointer;
  background-color: var(--color-dark);
  z-index: var(--zindex-headerLogo);
}
@media print, screen and (min-width: 768px) {
  .hamburger {
    display: none;
  }
}

.hamburger__container {
  position: relative;
  display: block;
  width: 27px;
  height: 23px;
  margin: auto;
}

.hamburger__item {
  position: absolute;
  left: 0;
  display: block;
  width: 100%;
  height: 2px;
  margin: auto;
  background-color: white;
  transition: all .3s ease;
}

.hamburger__container > :nth-child(1) {
  top: 0;
}

.hamburger__container > :nth-child(2) {
  top: 0;
  bottom: 0;
  width: 100%;
}

.hamburger__container > :nth-child(3) {
  bottom: 0;
}

.hamburger.is-active .hamburger__container > :nth-child(1) {
  top: 48%;
  transform: rotate(45deg);
}

.hamburger.is-active .hamburger__container > :nth-child(2) {
  opacity: 0;
}

.hamburger.is-active .hamburger__container > :nth-child(3) {
  bottom: 44%;
  transform: rotate(-45deg);
}

/* --------------------------------------
  ハンバーガー内ナビ
-------------------------------------- */
.hamburger-nav {
  position: fixed;
  top: 0;
  right: 0;
  display: block;
  width: 100%;
  height: 100vh;
  padding: var(--header-height) 0 1.8rem;
  overflow-y: auto;
  background-color: white;
  transition: transform .1s;
  transform: translateX(100%);
  -webkit-overflow-scrolling: touch;
  z-index: var(--zindex-gnav);
}

.hamburger-nav.is-active {
  transition: transform 500ms cubic-bezier(.165, .84, .44, 1) 300ms;
  transform: translateX(0);
}

/* ナビ コンテンツ */
.hamburger-nav__container {
  display: flex;
  flex-direction: column-reverse;
  row-gap: 20px;
}
@media print, screen and (min-width: 1320px) {
  .hamburger-nav__container {
    flex-direction: column;
    row-gap: initial;
    align-items: end;
    justify-content: space-between;
    height: 100%;
  }
}

/* ナビ ナビゲーションアイテムエリア */
.hamburger-nav__list {
  display: block;
}
@media print, screen and (min-width: 1320px) {
  .hamburger-nav__list {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    justify-content: end;
    column-gap: 4px;
  }
}

.hamburger-nav__divider {
  display: block;
}

.hamburger-nav__item {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: .3rem;
  font-weight: 500;
  color: var(--color-text);
  border-bottom: 1px solid var(--color-gray-light);
  padding: 12px var(--content-side-gutter-medium);
}
@media print, screen and (min-width: 1320px) {
  .hamburger-nav__item {
    padding: .3rem .3rem 1.2rem .3rem;
  }
}

.hamburger-nav__item .arrow {
  display: block;
  width: 7px;
  height: 7px;
  border-top: 2px solid var(--color-green);
  border-right: 2px solid var(--color-green);
  transform: rotate(45deg);
}

.hamburger-nav__item .toggle {
  display: block;
  position: relative;
  width: 10px;
  height: 10px;
}
.hamburger-nav__item .toggle::before {
  content: "";
  width: 2px;
  height: 100%;
  background-color: #3BB399;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.hamburger-nav__item .toggle::after {
  content: "";
  width: 100%;
  height: 2px;
  background-color: #3BB399;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.hamburger-nav__item > a.js-gnav__item {
  display: block;
  color: var(--color-dark);
  width: calc(100% - 12px);
}

/* 子ページナビ（SP） */

.hamburger-nav__item__child {
  display: flex;
  flex-direction: column;
}
@media print, screen and (min-width: 768px){
  .hamburger-nav__item__child {
    display: none;
  }
}

.hamburger-nav__item__child .hamburger-nav__item {
  background-color: #3BB399;
  color: white;
}

.hamburger-nav__item__child .hamburger-nav__item .arrow {
  border-top: 2px solid white;
  border-right: 2px solid white;
}

/* --------------------------------------
  ナビゲーション
-------------------------------------- */
.navigation {
  position: relative;
  z-index: 1;
}

.navigation__list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}
@media print, screen and (min-width: 768px) {
  .navigation__list {
    grid-template-columns: repeat(6, 1fr);
  }
}

.navigation__list > li {
  padding: 8px 2px;
  position: relative;
}
@media print, screen and (min-width: 768px) {
  .navigation__list > li {
    padding: 10px 8px;
  }
}

/* border */
.navigation__list > li:nth-child(1),
.navigation__list > li:nth-child(2),
.navigation__list > li:nth-child(3){
  border-bottom: 1px solid var(--color-gray-light);
}
.navigation__list > li:nth-child(2),
.navigation__list > li:nth-child(5){
  border-left: 1px solid var(--color-gray-light);
  border-right: 1px solid var(--color-gray-light);
}
@media print, screen and (min-width: 768px) {
  .navigation__list > li:nth-child(1),
  .navigation__list > li:nth-child(2),
  .navigation__list > li:nth-child(3){
    border-bottom: none;
  }
  .navigation__list > li:nth-child(3) {
    border-right: 1px solid var(--color-gray-light);
  }
}

.navigation__list > li a {
  display: block;
}

/* アイコン */
.navigation__list > li a img {
  display: block;
  height: 26px;
  margin-bottom: 3px;
}
@media print, screen and (min-width: 768px) {
  .navigation__list > li a img {
    height: 38px;
    margin-bottom: 8px;
  }
}

.navigation__list > li p {
  text-align: center;
  color: var(--color-dark);
  font-size: 10px;
  font-weight: 500;
}
@media print, screen and (min-width: 768px) {
  .navigation__list > li p {
    font-size: 14px;
  }
}

/* サブページ アコーディオン */
.navigation__list > li a.js-hasChildNav::before {
  content: "";
  width: 100%;
  height: 3px;
  background-color: #3BB399;
  position: absolute;
  left: 0;
  bottom: -22px;
  opacity: 0;
  transition: opacity .3s ease, top 0s ease .3s;
}
.navigation__list > li a.js-hasChildNav::after {
  content: "";
  width: 0;
  height: 0;
  border-top: 14px solid #3BB399;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  position: absolute;
  left: 50%;
  bottom: -20px;
  transform: translate(-50%, 100%);
  opacity: 0;
  transition: opacity .3s ease, top 0s ease .3s;
}

.navigation__list > li a.js-hasChildNav.is-mousover::before,
.navigation__list > li a.js-hasChildNav.is-mousover::after {
  opacity: 1;
}

.navigation__list__child-wrapper {
  opacity: 0;
  position: absolute;
  top: -500%;
  left: 50%;
  transform: translate(-50%);
  z-index: 1;
  transition: opacity .3s ease, top 0s ease .3s;
  width: 110%;
  padding-top: 40px;
}

.navigation__list__child-wrapper.is-mousover {
  opacity: 1;
  z-index: 10;
  top: calc(100% - 1px);
  transition: opacity .3s ease;
}

.navigation__list__child-wrapper > ul {
  background-color: #3CB298;
  border-radius: 8px;
}

.navigation__list__child-wrapper > ul > li {
  border-bottom: 1px solid white;
}

.navigation__list__child-wrapper > ul > li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 5%;
  color: white;
  font-weight: 400;
  font-size: 14px;
}
.navigation__list__child-wrapper > ul > li a::after{
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-top: 2px solid white;
  border-right: 2px solid white;
  transform: rotate(45deg);
}

/* -------------------------------------------------
  サブページ PC Gnav
------------------------------------------------- */
.subpage-nav-pc {
	display: none;
}
@media print, screen and (min-width: 768px) {
  .subpage-nav-pc {
    display: block;
    position: relative;
    z-index: 2;
    padding: calc(var(--header-height) + 20px) var(--content-side-gutter-medium) 20px;
  }
}

/* -------------------------------------------------
  サブページ ヒーロー
------------------------------------------------- */
.subpage-hero {
  position: relative;
  aspect-ratio: 750/770;
}
.subpage-hero.subpage-hero--noimage {
  aspect-ratio: 376/282;
}
@media print, screen and (min-width: 768px) {
  .subpage-hero,
  .subpage-hero.subpage-hero--noimage {
    aspect-ratio: 144/52;
  }
}

/* 画像 */
.subpage-hero__image {
  position: relative;
  width: 100%;
  aspect-ratio: 740/520;
}
@media print, screen and (min-width: 768px) {
  .subpage-hero__image {
    width: 50%;
    margin-left: auto;
  }
}

.subpage-hero__image > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.subpage-hero__image > img + img {
  display: block;
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
}

/* カバー */
.subpage-hero__cover {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.subpage-hero--noimage .subpage-hero__cover {
  position: relative;
}

.subpage-hero__cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left top;
}

/* タイトル */
.subpage-hero__title {
  position: relative;
  z-index: 1;
  padding: 0 var(--content-side-gutter-medium);
}
.subpage-hero--noimage .subpage-hero__title {
  position: absolute;
  top: 38%;
  left: 4%;
}
@media print, screen and (min-width: 768px) {
  .subpage-hero__title {
    width: 100%;
    position: absolute;
    top: 35%;
    left: 8%;
  }
}

.subpage-hero__title h1 {
  font-size: 28px;
  font-weight: 500;
}
@media print, screen and (min-width: 768px) {
  .subpage-hero__title h1 {
    font-size: 40px;
  }
}

.subpage-hero__title h1 span {
  display: block;
  font-size: 19px;
  margin-top: 5px;
}
@media print, screen and (min-width: 768px) {
  .subpage-hero__title h1 span {
    font-size: 26px;
    margin-top: 8px;
  }
}

/* パンくずリスト */
.subpage-hero__breadcrumbs {
  display: flex;
  position: absolute;
  top: 10px;
  left: 4%;
  background-color: white;
  border-radius: 100px;
  padding: 6px 16px;
}
@media print, screen and (min-width: 768px) {
  .subpage-hero__breadcrumbs {
    top: 20px;
    padding: 8px 24px;
  }
}

.subpage-hero__breadcrumbs a,
.subpage-hero__breadcrumbs span {
  font-size: 10px;
  color: var(--color-dark);
  vertical-align: middle;
}
@media print, screen and (min-width: 768px) {
  .subpage-hero__breadcrumbs a,
  .subpage-hero__breadcrumbs span {
    font-size: 14px;
  }
}

.subpage-hero__breadcrumbs a::after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  border-top: 2px solid var(--color-green);
  border-right: 2px solid var(--color-green);
  transform: rotate(45deg);
  margin: 0 5px 0 4px;
}
@media print, screen and (min-width: 768px) {
  .subpage-hero__breadcrumbs a::after {
    margin: 0 7px 0 6px;
  }
}

/* --------------------------------------
  サイトマップ
-------------------------------------- */
.sitemap__list {
  display: grid;
  grid-template-columns: 1fr;
}
@media print, screen and (min-width: 768px) {
  .sitemap__list {
    grid-template-columns: repeat(4, 1fr);
    column-gap: 4%;
  }
}

.sitemap__list a {
  color: var(--color-dark);
}

.sitemap__list .title-h5 {
  margin-bottom: 20px !important;
}
@media print, screen and (min-width: 768px) {
  .sitemap__list .title-h5 {
    margin-bottom: 16px !important;
    font-size: 16px;
  }
}

.sitemap__child-list {
  display: flex;
  flex-direction: column;
  row-gap: 3px;
}

.sitemap__child-list a {
  font-weight: 400;
  font-size: 14px;
}

/* --------------------------------------
  記事
-------------------------------------- */
.article-box {
  max-width: 768px;
  position: relative;
}

.article-box__thumb {
  display: block;
  width: 100%;
  margin-bottom: 16px;
}

.article-box__thumb img {
  display: block;
  width: 100%;
}

.article-box__head {
  margin-bottom: 18px;
}
@media print, screen and (min-width: 768px){
  .article-box__head {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    margin-bottom: 24px;
  }
}

/* 日付・カテゴリwrapper */
.article-box__head div {
  display: flex;
  align-items: center;
  column-gap: 10px;
  margin-bottom: 14px;
}
@media print, screen and (min-width: 768px) {
  .article-box__head div {
    column-gap: 16px;
    margin-bottom: 0;
  }
}

/* --------------------------------------
  記事 2カラムwrapper
-------------------------------------- */
.divided-article-wrapper {
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: 30px;
}
@media print, screen and (min-width: 768px) {
  .divided-article-wrapper {
    flex-direction: row;
    justify-content: space-between;
  }
}

.divided-article-wrapper .article-box {
  width: 100%;
}
@media print, screen and (min-width: 768px) {
  .divided-article-wrapper .article-box {
    width: 70%;
  }
}

.divided-article-wrapper aside {
  width: 100%;
  background-color: #FAFAFA;
  padding: 20px 4%;
}
@media print, screen and (min-width: 768px) {
  .divided-article-wrapper aside {
    width: 30%;
    transform: translateX(var(--content-side-gutter-medium));
    padding: 20px 3%;
  }
}

/* --------------------------------------
  ニュース記事リスト
-------------------------------------- */
ul.js-newsList {
	height: 100%;
	width: 100%;
}

/* ニュースアイテム */
ul.js-newsList li {
	border-bottom: 1px solid var(--color-gray);
}

ul.js-newsList li a {
	display: block;
	color: var(--color-dark);
	font-weight: 400;
	padding-top: 10px;
	padding-bottom: 10px;
}

ul.js-newsList li a .news-item-head {
	display: flex;
	column-gap: 10px;
	margin-bottom: 6px;
}

ul.js-newsList li a .news-item-head__cate {
	border-radius: 4px;
	font-size: 12px;
	padding: 1px 10px;
}
@media print, screen and (min-width: 768px) {
	ul.js-newsList li a .news-item-head__cate {
		font-size: 14px;
	}
}

ul.js-newsList li a .news-item-head__cate.candidates {
	border: 1px solid var(--color-cate-candidates);
}
ul.js-newsList li a .news-item-head__cate.event {
	border: 1px solid var(--color-cate-event);
}
ul.js-newsList li a .news-item-head__cate.news {
	border: 1px solid var(--color-cate-news);
}
ul.js-newsList li a .news-item-head__cate.report {
	border: 1px solid var(--color-cate-report);
}

ul.js-newsList li a .news-item-title {
	vertical-align: middle;
	text-indent: -14px;
	padding-left: 14px;
}
ul.js-newsList li a .news-item-title::before {
	content: "";
	display: inline-block;
	width: 8px;
	height: 8px;
	border-top: 2px solid var(--color-green);
	border-right: 2px solid var(--color-green);
	transform: rotate(45deg) translateY(-3px);
	margin-right: 8px;
}
/* --------------------------------------
  固定ボタン (PCヘッダー、SP下部)
-------------------------------------- */
@media print, screen and (max-width: 767px){
  .fixed-btn.pc-header {
    display: none;
  }
}
@media print, screen and (min-width: 768px) {
  .fixed-btn.sp-bottom {
    display: none;
  }
}

.fixed-btn {
  position: fixed;
  z-index: 2;
  bottom: 0;
  left: 0;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}
@media print, screen and (min-width: 768px) {
  .fixed-btn {
    position: relative;
    max-width: 560px;
    margin-left: auto;
  }
}

.fixed-btn__item {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px 10px;
  column-gap: 6px;
}
@media print, screen and (min-width: 768px) {
  .fixed-btn__item {
    justify-content: start;
    padding: 12px 10%;
    column-gap: 10px;
  }
}

/* アイコン */
.fixed-btn__item img {
  height: 20px;
  width: auto;
  display: block;
}
@media print, screen and (min-width: 768px) {
  .fixed-btn__item img {
    height: 32px;
  }
}

.fixed-btn__item span {
  font-weight: bold;
  color: white;
}

/* --------------------------------------
  下層ページ ヒーロー
------------------------------------------ */
.inner-kv {
  width: 100%;
  height: auto;
  aspect-ratio: 393/358;
  position: relative;
}

/*  下層ページ ヒーロー （写真無タイプ） */

/* 画像 */

/* タイトル */

/* パンくずリスト */


/* ==================================================
  コンポーネント（パーツ）
================================================== */
/* --------------------------------------
  タイトル
-------------------------------------- */
/*  H1
---------------------- */
.title-h1 {
  position: relative;
  color: var(--color-dark);
  font-weight: 600;
  text-align: center;
  font-size: 25px;
  padding-bottom: 10px;
}
@media print, screen and (min-width: 768px) {
  .title-h1 {
    font-size: 32px;
  }
}

.title-h1::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 50%;
  max-width: 200px;
  height: 3px;
  background-color: var(--color-yellow);
}

/* 左寄せ */
.title-h1.title-h1--left {
  text-align: left;
}
.title-h1.title-h1--left::after {
  left: 0;
  transform: translateX(0);
}

/* 下部マージンがある時 */
.title-h1.title-h1--mb {
  margin-bottom: var(--title-margin-bottom-l);
}

/*  H2
---------------------- */
.title-h2 {
  font-size: 22px;
  font-weight: 600;
  position: relative;
  padding-bottom: 9px;
}
@media print, screen and (min-width: 768px) {
  .title-h2 {
    font-size: 28px;
    padding-bottom: 12px;
  }
}

.title-h2::before {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 120px;
  height: 2px;
  background-color: var(--color-green);
}

.title-h2::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 60px;
  width: 60px;
  height: 2px;
  z-index: 1;
  background-color: var(--color-dark);
}

.title-h2.title-h2--mb {
  margin-bottom: var(--title-margin-bottom-m);
}

/*  H3
---------------------- */
h3 {
  font-size: 20px;
  font-weight: 600;
}
@media print, screen and (min-width: 768px) {
  h3 {
    font-size: 22px;
  }
}

h3 {
  margin-bottom: var(--title-margin-bottom-s);
}

/*  H3
---------------------- */
h4 {
  font-size: 22px;
  font-weight: 600;
  position: relative;
  padding-bottom: 9px;
}
@media print, screen and (min-width: 768px) {
  h4 {
    font-size: 28px;
    padding-bottom: 12px;
  }
}

h4::before {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 120px;
  height: 2px;
  background-color: var(--color-green);
}

h4::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 60px;
  width: 60px;
  height: 2px;
  z-index: 1;
  background-color: var(--color-dark);
}

h4 {
  margin-bottom: var(--title-margin-bottom-m);
}

.facility h4::before,
.facility h4::after{
  display: none;
}


/*  H4
---------------------- */
.cal h4 {
  font-size: 22px;
  font-weight: 600;
  position: relative;
  padding-bottom: 9px;
}
@media print, screen and (min-width: 768px) {
  .cal h4 {
    font-size: 28px;
    padding-bottom: 12px;
  }
}

.cal h4::before {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 120px;
  height: 2px;
  background-color: var(--color-green);
}

.cal h4::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 60px;
  width: 60px;
  height: 2px;
  z-index: 1;
  background-color: var(--color-dark);
}

.cal h4 {
  margin-bottom: var(--title-margin-bottom-m);
}


/*  H4
---------------------- */
.title-h4 {
  font-size: 18px;
  font-weight: 500;
}
@media print, screen and (min-width: 768px) {
  .title-h4 {
    font-size: 20px;
  }
}

.title-h4.title-h4--mb {
  margin-bottom: var(--title-margin-bottom-s);
}

/*  H5
---------------------- */
.title-h5 {
  font-size: 17px;
  font-weight: 500;
  position: relative;
  padding-left: 10px;
}
@media print, screen and (min-width: 768px) {
  .title-h5 {
    font-size: 18px;
  }
}

.title-h5::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 2px;
  height: 80%;
  background-color: var(--color-green);
}

.title-h5.title-h5--mb {
  margin-bottom: 10px;
}

/*  H6
---------------------- */
.title-h6 {
  font-size: 16px;
  font-weight: 500;
}
@media print, screen and (min-width: 768px) {
  .title-h6 {
    font-size: 18px;
  }
}

.title-h6::before {
  content: "-";
  color: var(--color-green);
  margin-right: 6px;
  font-size: 1.5em;
  line-height: 16px;
}
@media print, screen and (min-width: 768px) {
  .title-h6::before {
    line-height: 18px;
  }
}

.title-h6.title-h6--mb {
  margin-bottom: 10px;
}

/* --------------------------------------
  テキスト
-------------------------------------- */
/*  センテンス
---------------------- */
p,li{
  font-size: 14px;
  line-height: 1.7;
  font-weight: 400;
}
@media print, screen and (min-width: 768px) {
  p,li{
    font-size: 16px;
  }
}

/*  リンク(インライン)
---------------------- */
.text-link {
  font-weight: bolder;
  text-decoration: underline;
  text-decoration-color: var(--color-link);
}

/*  太字(インライン)
---------------------- */
.text-bold {
  font-weight: 600;
}

/*  色(インライン)
---------------------- */
.text-red {
  color: var(--color-red);
}
.text-white {
  color: white;
}

/*  1文字目を赤字
---------------------- */
.first-letter-red::first-letter {
  color: var(--color-red);
}

/* --------------------------------------
  マスコット画像
-------------------------------------- */
.mascot-image {
  height: 50px;
  width: fit-content;
}
@media print, screen and (min-width: 768px) {
  .mascot-image {
    height: 68px;
  }
}

.mascot-image img {
  display: block;
  height: 100%;
  width: auto;
}

/* --------------------------------------
  ボタン
-------------------------------------- */
/* ノーマルボタン
---------------------- */
.btn {
  display: block;
  width: 100%;
  border: 2px solid var(--color-green);
  border-radius: 3px;
  text-align: center;
  color: var(--color-dark);
  font-weight: 400;
  font-size: 16px;
  padding: 9px 5%;
  position: relative;
  background-color: white;
}
@media print, screen and (min-width: 768px) {
  .btn {
    max-width: 400px;
  }
}

.btn::after {
  content: "";
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--color-green);
  border-right: 2px solid var(--color-green);
  position: absolute;
  top: 50%;
  right: 4%;
  transform: translate(0, -50%) rotate(45deg);
}
@media print, screen and (min-width: 768px) {
  .btn::after {
    right: 5%;
    width: 9px;
    height: 9px;
  }
}

/*   リーフ型ボタン
-------------------------------- */
.btn-leaf {
  display: flex;
  border-radius: 0 12px 0 12px;
  color: white;
  font-weight: 500;
  justify-content: center;
  align-items: center;
  column-gap: 3.5%;
  padding: 16px 0;
  font-size: 20px;
}
@media print, screen and (min-width: 768px) {
  .btn-leaf {
    padding: 20px 0;
  }
}

/* アイコン */
.btn-leaf img {
  height: 40px;
  width: auto;
  display: block;
}
@media print, screen and (min-width: 768px) {
  .btn-leaf img {
    height: 44px;
  }
}

/*   スライドボタン
-------------------------------- */
.btn-slider {
  display: block;
  position: relative;
  height: 100%;
  min-height: 45px;
  aspect-ratio: 1/1;
  align-self: stretch;
  border-radius: 6px;
  border: 2px solid var(--color-green);
}

.btn-slider::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--color-green);
  border-right: 2px solid var(--color-green);
  transform: translate(-50%, -50%) rotate(45deg);
}

.btn-slider.btn-slider--next::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.btn-slider.btn-slider--prev::before {
  transform: translate(-50%, -50%) rotate(-135deg);
}

.btn-slider.swiper-button-disabled {
  border: 2px solid var(--color-gray);
}
.btn-slider.swiper-button-disabled::before {
  border-top: 2px solid var(--color-gray);
  border-right: 2px solid var(--color-gray);
}

/*   カテゴリボタン
-------------------------------- */
.btn-category-l,
.btn-category-s {
  display: block;
  text-align: center;
  color: var(--color-dark);
  border-radius: 5px;
}
.btn-category-l.is-active,
.btn-category-s.is-active {
  color: white;
}

.btn-category-l {
  width: 110px;
  padding: 9px 2px;
}

.btn-category-s {
  width: 120px;
  font-weight: 400;
  padding: 2px 2px;
  font-size: 12px;
}
@media print, screen and (min-width: 768px) {
  .btn-category-s {
    font-size: 14px;
  }
}

.btn-category-l.all,
.btn-category-s.all {
  border: 1px solid var(--color-cate-all);
}
.btn-category-l.all.is-active,
.btn-category-s.all.is-active {
  background-color:#3BB399;
}
.btn-category-l.candidates,
.btn-category-s.candidates {
  border: 1px solid #F38769;
}
.btn-category-l.candidates.is-active,
.btn-category-s.candidates.is-active {
  background-color:#F38769;
}
.btn-category-l.event,
.btn-category-s.event {
  border: 1px solid #629ACC;
}
.btn-category-l.event.is-active,
.btn-category-s.event.is-active {
  background-color: #629ACC;
}
.btn-category-l.news,
.btn-category-s.news {
  border: 1px solid #BF6FB6;
}
.btn-category-l.news.is-active,
.btn-category-s.news.is-active {
  background-color: #BF6FB6;
}
.btn-category-l.report,
.btn-category-s.report {
  border: 1px solid #B2B0B0;
}
.btn-category-l.report.is-active,
.btn-category-s.report.is-active {
  background-color: #B2B0B0;
}

/*   ファイルボタン
-------------------------------- */
.btn-file {
  display: flex;
  align-items: center;
  width: 100%;
  border: 1px solid var(--color-gray);
  padding: 12px 5%;
  column-gap: 5%;
}
@media print, screen and (min-width: 768px){
  .btn-file {
    max-width: 40vw;
    padding: 20px;
    column-gap: 4%;
  }
}

.btn-file.btn-file--mark-red {
  background-image: linear-gradient(-45deg, var(--color-red) 0,var(--color-red) 10px, #fff 10px);
  background-repeat: no-repeat;
}
.btn-file.btn-file--mark-blue {
  background-image: linear-gradient(-45deg, var(--color-blue) 0,var(--color-blue) 10px, #fff 10px);
  background-repeat: no-repeat;
}

.btn-file > img {
  height: 30px;
  width: auto;
}
@media print, screen and (min-width: 768px){
  .btn-file > img {
    height: 37px;
  }
}

.btn-file > span {
  color: var(--color-dark);
  font-weight: 500;
}

/*   カードボタン
-------------------------------- */
.btn-card {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  color: var(--color-dark);
  border: 1px solid var(--color-gray);
}
@media print, screen and (min-width: 768px){
  .btn-card {
    grid-template-columns: 1fr 1fr;
    max-width: 40vw;
  }
}

.btn-card.btn-card--mark-red {
  background-image: linear-gradient(-45deg, var(--color-red) 0,var(--color-red) 10px, #fff 10px);
  background-repeat: no-repeat;
}
.btn-card.btn-card--mark-blue {
  background-image: linear-gradient(-45deg, var(--color-blue) 0,var(--color-blue) 10px, #fff 10px);
  background-repeat: no-repeat;
}
.btn-card.btn-card--mark-green {
  background-image: linear-gradient(-45deg, var(--color-green) 0,var(--color-green) 10px, #fff 10px);
  background-repeat: no-repeat;
}
.btn-card.btn-card--mark-pink {
  background-image: linear-gradient(-45deg, var(--color-pink) 0,var(--color-pink) 10px, #fff 10px);
  background-repeat: no-repeat;
}

.btn-card__thumb {
  aspect-ratio: 28/20 ;
  overflow: hidden;
}

.btn-card__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.btn-card__body {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 6px;
  font-weight: 500;
}
@media print, screen and (min-width: 768px) {
  .btn-card__body {
    font-size: 18px;
  }
}

/* --------------------------------------
  表組 (テーブル)
-------------------------------------- */
.table-responsive {
  display: block;
  width: 100%;
  overflow-x: auto;
}

.table {
  display: table;
  min-width: 100%;
}

.table th,
.table td {
  font-weight: 400;
  font-size: 14px;
  text-align: left;
  padding: 8px 12px;
  display: table-cell;
}
@media print, screen and (min-width: 768px) {
  .table th,
  .table td {
    font-size: 16px;
    padding: 12px 14px;
  }
}

/* 左辺th */
.table tr > th {
  min-width: 30vw;
}
@media print, screen and (min-width: 768px) {
  .table tr > th {
    min-width: 0;
  }
}

.table tr {
  border-bottom: 1px solid var(--color-gray-dark);
}

.table th{
    background-color: var(--color-green);
}

/* --------------------------------------
  リスト
-------------------------------------- */
/*  大きなリスト
---------------------- */
.main-list {
  display: flex;
  flex-direction: column;
  row-gap: 1rem;
}
@media print, screen and (min-width: 768px) {
  .main-list {
    row-gap: 1.2rem;
  }
}

.main-list__item {
  display: flex;
  align-items: baseline;
  column-gap: 6px;
}
@media print, screen and (min-width: 768px) {
  .main-list__item {
    column-gap: 12px;
  }
}

.main-list__item::before {
  content: '';
  display: block;
  width: 1rem;
  height: 1rem;
  border-radius: 50px;
  background-color: var(--color-yellow);
  flex-shrink: 0;
  transform: translateY(2px);
}
@media print, screen and (min-width: 768px) {
  .main-list__item::before {
    width: 1.4rem;
    height: 1.4rem;
    transform: translateY(4px);
  }
}

.main-list__item-head {
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 5px;
}
@media print, screen and (min-width: 768px) {
  .main-list__item-head {
    font-size: 22px;
  }
}

/*  小さなリスト
---------------------- */
.sub-list {
  display: flex;
  flex-direction: column;
  row-gap: 4px;
}
@media print, screen and (min-width: 768px){
  .sub-list {
    row-gap: 6px;
  }
}

.sub-list__item {
  color: var(--color-dark);
  text-indent: -16px;
  padding-left: 16px;
}

.sub-list__item::before {
  content: '・';
  margin-right: 3px;
}

/* 黒丸 */
.sub-list.sub-list--dark .sub-list__item::before {
  content: '●';
  margin-right: 5px;
}

/* 白丸 */
.sub-list.sub-list--white .sub-list__item::before {
  content: '○';
  margin-right: 5px;
}

/* 米印 */
.sub-list.sub-list--kome .sub-list__item::before {
  content: '※';
  margin-right: 5px;
}

/* アスタリスク */
.sub-list.sub-list--asterisk .sub-list__item::before {
  content: '＊';
  margin-right: 5px;
}

/* リンク */
.sub-list.sub-list--link .sub-list__item a {
  color: var(--color-link);
  text-decoration: underline;
  text-underline-offset: 4px;
}
.sub-list.sub-list--link .sub-list__item::before {
  content: '';
  display: inline-block;
  border-top: 2px solid var(--color-link);
  border-right: 2px solid var(--color-link);
  width: 8px;
  height: 8px;
  transform: rotate(45deg);
  margin-right: 6px;
}

/*  大きな番号リスト
---------------------- */
.main-list-order {
  display: flex;
  flex-direction: column;
  row-gap: .5rem;
  counter-reset: listnum;
}

.main-list-order__item {
  display: flex;
  align-items: baseline;
  column-gap: 6px;
}
@media print, screen and (min-width: 768px) {
  .main-list-order__item {
    column-gap: 12px;
  }
}

.main-list-order__item::before {
  counter-increment: listnum;
	content: '0' counter(listnum);
  display: block;
  color: var(--color-green);
  flex-shrink: 0;
  font-size: 22px;
}
@media print, screen and (min-width: 768px) {
  .main-list-order__item::before {
    font-size: 24px;
  }
}

.main-list-order__item-head {
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 5px;
}
@media print, screen and (min-width: 768px) {
  .main-list-order__item-head {
    font-size: 22px;
  }
}

/*  小さな番号リスト
---------------------- */
.sub-list-order {
  display: flex;
  flex-direction: column;
  row-gap: .8rem;
  counter-reset: listnum;
}

.sub-list-order__item {
  display: flex;
  align-items: baseline;
  column-gap: 2px;
}
@media print, screen and (min-width: 768px) {
  .sub-list-order__item {
    column-gap: 5px;
  }
}

.sub-list-order__item::before {
  counter-increment: listnum;
	content: '0' counter(listnum);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 400;
  line-height: 1;
  flex-shrink: 0;
  aspect-ratio: 1/1;
}

/*  色付き番号リスト
---------------------- */
.color-list-order {
  counter-reset: listnum;
  display: flex;
  flex-direction: column;
  row-gap: 14px;
}
@media print, screen and (min-width: 768px) {
  .color-list-order {
    row-gap: 1.7rem;
  }
}

.color-list-order__item {
  line-height: 1.8;
  display: flex;
  align-items: baseline;
  column-gap: .6rem;
}
@media print, screen and (min-width: 768px) {
  .color-list-order__item {
    align-items: flex-start;
    column-gap: 1.1rem;
  }
}

.color-list-order__item::before {
  counter-increment: listnum;
	content: '0' counter(listnum);
  display: block;
  flex-shrink: 0;
  font-size: 22px;
  line-height: 1;
  font-family: var(--font-family-serif);
  color: var(--color-pink);
}
@media print, screen and (min-width: 768px) {
  .color-list-order__item::before {
    font-size: 30px;
  }
}

.color-list-order__item:nth-child(2n)::before {
  color: var(--color-purple);
}
.color-list-order__item:nth-child(3n)::before {
  color: var(--color-green);
}
.color-list-order__item:nth-child(4n)::before {
  color: #64C0AB;
}

/* --------------------------------------
  dl (定義リスト)
-------------------------------------- */
.dl-list {
  display: grid;
  grid-template-columns: 95px 1fr;
  align-items: baseline;
  row-gap: 8px;
  column-gap: 8px;
}
@media print, screen and (min-width: 768px) {
  .dl-list {
    grid-template-columns: 105px 1fr;
    row-gap: 10px;
    column-gap: 10px;
  }
}

.dl-list dt {
  border: 1px solid var(--color-blue);
  border-radius: 5px;
  font-size: 12px;
  text-align: center;
  padding: 2px 2%;
}
@media print, screen and (min-width: 768px) {
  .dl-list dt {
    font-size: 14px;
  }
}

/* .dl-list dd {} */

/* --------------------------------------
  写真+テキストのカード (ノーマル)
-------------------------------------- */
.thumb-card {
  position: relative;
}

.thumb-card__thumb {
  display: block;
  width: 100%;
  /* 画像のサイズを揃える場合 */
  /* aspect-ratio: 356/268;
  overflow: hidden; */
}

.thumb-card__thumb img {
  display: block;
  width: 100%;
  /* 画像のサイズを揃える場合 */
  /* height: 100%;
  object-fit: cover;
  object-position: center; */
}

.thumb-card__body {
  padding: 12px 0 10px;
}
@media print, screen and (min-width: 768px){
  .thumb-card__body {
    padding: 18px 0 10px;
  }
}

.thumb-card__body-head {
  display: flex;
  align-items: center;
  column-gap: 10px;
  margin-bottom: 8px;
}
@media print, screen and (min-width: 768px){
  .thumb-card__body-head {
    column-gap: 14px;
    margin-bottom: 9px;
  }
}

.thumb-card__body-text {
  font-weight: 400;
  line-height: 1.75;
}

/* --------------------------------------
  写真+テキストのカード (幅広)
-------------------------------------- */
.thumb-card-wide {
  display: block;
  width: 100%;
  border-radius: 0 10px 0 10px;
  box-shadow: 0px 0px 15px -5px var(--color-gray-light);
  background-color: white;
  background-repeat: no-repeat;
  background-image: linear-gradient(135deg,rgba(255,235,7,1) 0,rgba(255,235,7,1) 30px,rgba(255,235,7,0) 48px), linear-gradient(-45deg, #F38769 0,#F38769 10px, #fff 10px);
  padding: 14px;
  color: var(--color-dark);
}
@media print, screen and (min-width: 768px){
  .thumb-card-wide {
    display: flex;
    justify-content: space-between;
    padding: 25px;
  }
}

.thumb-card-wide__thumb {
  width: 100%;
}
@media print, screen and (min-width: 768px){
  .thumb-card-wide__thumb {
    width: 40%;
  }
}

.thumb-card-wide__thumb.thumb-card-wide__thumb--s {
  aspect-ratio: 1/1;
  overflow: hidden;
  border-radius: 8px;
}
.thumb-card-wide__thumb.thumb-card-wide__thumb--s img {
  height: 100%;
  object-fit: cover;
  object-position: center;
}
@media print, screen and (min-width: 768px) {
  .thumb-card-wide__thumb.thumb-card-wide__thumb--s {
    
  }
}

.thumb-card-wide__body {
  width: 100%;
  margin-top: 20px;
}
@media print, screen and (min-width: 768px){
  .thumb-card-wide__body {
    width: 55%;
    margin-top: initial;
  }
}

.thumb-card-wide__head {
  border-bottom: 1px solid var(--color-gray);
}

.thumb-card-wide__head h3 {
  font-weight: bold;
  font-size: 18px;
  color: var(--color-dark);
  padding-bottom: 8px;
}
@media print, screen and (min-width: 768px){
  .thumb-card-wide__head h3 {
    font-size: 22px;
    padding-bottom: 10px;
  }
}

.thumb-card-wide__content {
  margin-top: 16px;
}
@media print, screen and (min-width: 768px) {
  .thumb-card-wide__content {
    margin-top: 24px;
  }
}

/* --------------------------------------
  ボイスカード
-------------------------------------- */
.voice-card {
  display: grid;
  grid-template-columns: 1fr 2.4fr;
  column-gap: 4%;
}

.voice-card__thumb {
  width: 100%;
}

.voice-card__thumb img {
  display: block;
  width: 100%;
}

.voice-card__content {
  border: 2px solid var(--color-gray);
  border-radius: 8px;
  padding: 16px 5%;
  position: relative;
}
@media print, screen and (min-width: 768px) {
  .voice-card__content {
    padding: 22px 4%;
  }
}

.voice-card__content::before {
  content: "";
  display: block;
  width: 8px;
  height: 14px;
  background-color: var(--color-gray);
  clip-path: polygon(0 50%, 100% 100%, 100% 0);
  position: absolute;
  top: 10vw;
  right: 100%;
}
@media print, screen and (min-width: 768px) {
  .voice-card__content::before {
    width: 16px;
    height: 24px;
  }
}

.voice-card__content.voice-card__content--red {
  border: 2px solid var(--color-red);
}
.voice-card__content.voice-card__content--red::before {
  background-color: var(--color-red);
}
.voice-card__content.voice-card__content--green {
  border: 2px solid var(--color-green);
}
.voice-card__content.voice-card__content--green::before {
  background-color: var(--color-green);
}
.voice-card__content.voice-card__content--pink {
  border: 2px solid var(--color-pink);
}
.voice-card__content.voice-card__content--pink::before {
  background-color: var(--color-pink);
}
.voice-card__content.voice-card__content--blue {
  border: 2px solid var(--color-blue);
}
.voice-card__content.voice-card__content--blue::before {
  background-color: var(--color-blue);
}

.voice-card__content__head {
  font-size: 18px;
  font-weight: 500;
  border-bottom: 1px solid var(--color-gray);
  padding-bottom: 8px;
  margin-bottom: 8px;
}
@media print, screen and (min-width: 768px) {
  .voice-card__content__head {
    font-size: 22px;
    padding-bottom: 10px;
    margin-bottom: 16px;
  }
}

/* .voice-card__content__body {} */

/* --------------------------------------
  アコーディオンボックス
------------------------------------------
  アコーディオンの動きを制御するクラスは別で付与する必要有
  module.cssで定義しています。 
-------------------------------------- */
.accordion-box {
  background-color: var(--color-gray-light);
  transition: all .3s ease;
}


.accordion-box__head {
  padding: .9rem 2.3rem .9rem 1rem;
  font-weight: 500;
}
@media print, screen and (min-width: 768px) {
  .accordion-box__head {
    padding: 1.8rem 4.5rem 1.8rem 2rem ;
  }
}

.accordion-box__cont {
  padding: 1.4rem 1rem;
  position: relative;
}
@media print, screen and (min-width: 768px) {
  .accordion-box__cont {
    padding: 2rem 2rem;
  }
}

.accordion-box__cont::before {
  content: '';
  width: calc(100% - 2rem);
  height: 1px;
  background-color: #000;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
@media print, screen and (min-width: 768px) {
  .accordion-box__cont::before {
    width: calc(100% - 4rem);
  }
}

/* --------------------------------------
  グリッドコンテナ
-------------------------------------- */
.grid-container {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 8px;
}
@media print, screen and (min-width: 768px) {
  .grid-container {
    grid-template-columns: repeat(12, 1fr);
    gap: 12px;
  }
}

/* ギャップ 広 */
.grid-container.grid-container--gap-l {
  gap: 18px;
}
@media print, screen and (min-width: 768px) {
  .grid-container.grid-container--gap-l {
    gap: 34px;
  }
}

/* グリッドアイテム ※PCとSPで個別に設定 */
/* デフォルト 1カラム */
.grid-container__item {
  display: block;
  width: 100%;
  grid-column: span 6;
}
@media print, screen and (min-width: 768px) {
  .grid-container__item {
    grid-column: span 12;
  }
}

/* 2カラム */
@media print, screen and (max-width: 767px) {
  .grid-container__item-sp-2 {
    grid-column: span 3;
  }
}
@media print, screen and (min-width: 768px) {
  .grid-container__item-pc-2 {
    grid-column: span 6;
  }
}

/* 3カラム */
@media print, screen and (max-width: 767px) {
  .grid-container__item-sp-3 {
    grid-column: span 2;
  }
}
@media print, screen and (min-width: 768px) {
  .grid-container__item-pc-3 {
    grid-column: span 4;
  }
}

/* 3カラム 1:2 */
@media print, screen and (max-width: 767px) {
  .grid-container__item-sp-1of3 {
    grid-column: span 2;
  }
  .grid-container__item-sp-2of3 {
    grid-column: span 4;
  }
}
@media print, screen and (min-width: 768px) {
  .grid-container__item-pc-1of3 {
    grid-column: span 4;
  }
  .grid-container__item-pc-2of3 {
    grid-column: span 8;
  }
}

/* 4カラム SPで4列はキツいのでPCのみ */
@media print, screen and (min-width: 768px) {
  .grid-container__item-pc-4 {
    grid-column: span 3;
  }
}

/* PCで4カラム 1：3 */
@media print, screen and (min-width: 768px) {
  .grid-container__item-pc-1of4 {
    grid-column: span 3;
  }
  .grid-container__item-pc-3of4 {
    grid-column: span 9;
  }
}

/* グリッドアイテムの中身が一枚画像の場合。
  このクラスはなくてもいいし、個別にcssを書いてもいい */
.grid-container__item-img {
  display: block;
  width: 100%;
}

.section {
    padding-top: var(--section-gutter-medium);
    padding-bottom: var(--section-gutter-medium);
    position: relative;
}

/*left right */
.content{
  overflow: hidden;
}
.left{
  float: left;
}
.right{
  float: right;
}
@media print, screen and (max-width: 768px) {
.right,
.left{
  float: none;
}
}

/* --------------------------------------
  タイトル
-------------------------------------- */
/*  H3
---------------------- */
h3 {
  position: relative;
  color: var(--color-dark);
  font-weight: 600;
  text-align: center;
  font-size: 25px;
  padding-bottom: 10px;
}
@media print, screen and (min-width: 768px) {
  h3 {
    font-size: 32px;
  }
}

h3::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 50%;
  max-width: 200px;
  height: 3px;
  background-color: var(--color-yellow);
}


/* 下部マージンがある時 */
h3 {
  margin-bottom: var(--title-margin-bottom-l);
}

.page-content-wrap{
  margin-top:var(--title-margin-bottom-l);
  margin-bottom:var(--title-margin-bottom-l);
}

/* --------------------------------------
  グリッドコンテナ
-------------------------------------- */
.archive-news-list{
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 8px;
}
@media print, screen and (min-width: 768px) {
  .archive-news-list{
    grid-template-columns: repeat(12, 1fr);
    gap: 12px;
  }
}

/* ギャップ 広 */
.archive-news-list{
  gap: 18px;
}
@media print, screen and (min-width: 768px) {
  .archive-news-list{
    gap: 34px;
  }
}


/* 3カラム */
@media print, screen and (max-width: 767px) {
  .archive-news-list .entry{
    grid-column: span 2;
  }
}
@media print, screen and (min-width: 768px) {
  .archive-news-list .entry{
    grid-column: span 4;
  }
}


/* --------------------------------------
  写真+テキストのカード (ノーマル)
-------------------------------------- */
.archive-news-list .entry .thumb {
  position: relative;
}

.archive-news-list .entry .thumb img {
  display: block;
  width: 100%;
  /* 画像のサイズを揃える場合 */
  /* aspect-ratio: 356/268;
  overflow: hidden; */
}

.archive-news-list .entry{
  padding: 12px 0 10px;
}
@media print, screen and (min-width: 768px){
.archive-news-list .entry{
    padding: 18px 0 10px;
  }
}

.archive-news-list .entry .title{
  display: flex;
  align-items: center;
  column-gap: 10px;
  margin-bottom: 8px;
}
@media print, screen and (min-width: 768px){
.archive-news-list .entry .title{
    column-gap: 14px;
    margin-bottom: 9px;
  }
}

.archive-news-list .entry .content{
  font-weight: 400;
  line-height: 1.75;
}

.archive-news-list .entry a{
  display: block;
  width: 100%;
  border: 2px solid var(--color-green);
  border-radius: 3px;
  text-align: center;
  color: var(--color-dark);
  font-weight: 400;
  font-size: 16px;
  padding: 9px 5%;
  position: relative;
  background-color: white;
  margin-top: 20px;
}

.archive-news-list .entry .right,
.archive-news-list .entry .left{
  float: none;
}

.archive-news-list .entry a::after {
  content: "";
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--color-green);
  border-right: 2px solid var(--color-green);
  position: absolute;
  top: 50%;
  right: 4%;
  transform: translate(0, -50%) rotate(45deg);
}
@media print, screen and (min-width: 768px) {
  .archive-news-list .entry a::after {
    right: 5%;
    width: 9px;
    height: 9px;
  }
}

.btn a{
  color:var(--color-green);
}

/*  H4
---------------------- */
h4 {
  font-size: 18px;
  font-weight: 500;
}
@media print, screen and (min-width: 768px) {
  h4 {
    font-size: 20px;
  }
}

h4 {
  margin-bottom: var(--title-margin-bottom-s);
}

.btn-basic p{
  margin: auto;
  margin-bottom: 20px;
}

a {
    color: var(--color-green);
}

main p{
  margin-bottom: 10px;
}

.guideBody .content{
  display: flex;
  margin-bottom: 60px;
  justify-content: space-between;
}

.guideBody .content .left{
  width: 40%;
  float:none;
}
.guideBody .content .left.w20p{
  width: 20%;
  float:none;
}

.guideBody .content .right{
  width: 55%;
  float:none;
}

@media print, screen and (max-width: 767px) {
.guideBody .content{
  display: block;
}

.guideBody .content .left,
.guideBody .content .left.w20p{
  width: 100%;
}

.guideBody .content .right{
  width: 100%;
}
}

/*  H5
---------------------- */
h5{
  font-size: 17px;
  font-weight: 500;
  position: relative;
  padding-left: 10px;
}
@media print, screen and (min-width: 768px) {
  h5{
    font-size: 18px;
  }
}

h5::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 2px;
  height: 80%;
  background-color: var(--color-green);
}

h5 {
  margin-bottom: 10px;
}



/*  大きな番号リスト
---------------------- */
ol.maru {
  display: flex;
  flex-direction: column;
  row-gap: .5rem;
  counter-reset: listnum;
  line-height: 1.75em;
}

ol.maru > li {
  align-items: baseline;
  column-gap: 6px;
}
@media print, screen and (min-width: 768px) {
  ol.maru > li {
    column-gap: 12px;
  }
}

ol.maru > li::before {
  counter-increment: listnum;
	content: '0' counter(listnum);
  display: block;
  color: var(--color-green);
  flex-shrink: 0;
  font-size: 22px;
}
@media print, screen and (min-width: 768px) {
  ol.maru > li::before {
    font-size: 24px;
  }
}

.main-list-order__item-head {
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 5px;
  display: block;
}
@media print, screen and (min-width: 768px) {
  .main-list-order__item-head {
    font-size: 22px;
  }
}

.page h5{
  margin-bottom: 30px;
  margin-top: 30px;
}

.page ol{
  line-height: 1.75em;
}

/*  H6
---------------------- */
h6{
  font-size: 16px;
  font-weight: 500;
}
@media print, screen and (min-width: 768px) {
  h6{
    font-size: 18px;
  }
}

.img100 img{
  width: 100%;
}

/* ==================== */
/* FAQ */
/* ==================== */
dl.faq {
  margin-bottom: 70px; }

dl.faq > dt {
  margin-bottom: 30px; }

dl.faq .faq-tit-q {
  color: #ff6fa2;
  padding: 15px 0 15px 0;
  border-bottom: solid 1px #ccc;
  padding-left: 35px;
  text-indent: -35px; }

dl.faq .faq-tit-q:before {
  content: "";
  display: inline-block;
  width: 26px;
  height: 20px;
  background: url(../img/question/ico-faq-q.png) no-repeat;
  background-size: contain;
  margin-right: 10px; }

dl.faq > dd {
  padding-left: 40px;
  margin-bottom: 30px; }

dl.faq .faq-tit-a {
  padding: 0;
  margin-bottom: 15px;
  padding-left: 35px;
  text-indent: -35px;
  font-weight: normal;
  font-size: 16px;
}

dl.faq .faq-tit-a:before {
  content: "";
  display: inline-block;
  width: 26px;
  height: 20px;
  background: url(../img/question/ico-faq-a.png) no-repeat;
  background-size: contain;
  margin-right: 10px; }

dl.faq > dd > p {
  padding-left: 35px;
  margin-bottom: 30px; }

@media screen and (max-width: 768px) {
  dl.faq {
    margin-bottom: 30px; }
  dl.faq > dd {
    padding-left: 0;
    margin-bottom: 30px; } }


/*  H2
---------------------- */
.cal h4 {
  font-size: 22px;
  font-weight: 600;
  position: relative;
  padding-bottom: 9px;
}
@media print, screen and (min-width: 768px) {
  .cal h4 {
    font-size: 28px;
    padding-bottom: 12px;
  }
}

.cal h4::before {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 120px;
  height: 2px;
  background-color: var(--color-green);
}

.cal h4::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 60px;
  width: 60px;
  height: 2px;
  z-index: 1;
  background-color: var(--color-dark);
}

.cal h4 {
  margin-bottom: var(--title-margin-bottom-m);
}

.w1200 .content{
  margin: auto;
  max-width: 900px;
  margin-bottom: 60px;
}

@media print, screen and (max-width: 767px) {
.archive-news-list .entry{
    display: block;
    width: 100%;
    grid-column: span 6;
}
  
}

.alnC{
  text-align: center;
}

p{
  font-size: 16px !important;
}

.tc{
  text-align: center;
}

.pdf_dl i{
  display: none;
}

.btn-basic{
  margin-top: 20px;
}

.mb60{
  margin-bottom: 60px;
}

.time{
  font-size: 20px;
font-weight: bold;}

.thumb{
  margin-bottom: 20px;
}

.img_w100 img{
  width: 100%;
}

.btn.pt02{
  max-width: 580px;
  color:var(--color-green);
}

.numNone{
  padding-left: 0;
}

.numNone:before{
  display: none;
}

/*   ファイルボタン
-------------------------------- */
.pdfBtn .pdf_dl {
  display: flex;
  align-items: center;
  width: 100%;
  border: 1px solid var(--color-gray);
  padding: 12px 5%;
  column-gap: 5%;
}
@media print, screen and (min-width: 768px){
  .pdfBtn .pdf_dl{
    max-width: 40vw;
    padding: 20px;
    column-gap: 4%;
  }
}

.pdfBtn .pdf_dl {
  background-image: linear-gradient(-45deg, var(--color-red) 0,var(--color-red) 10px, #fff 10px);
  background-repeat: no-repeat;
}

.pdfBtn .pdf_dl:before {
  content:url("../img/parts/ico_file-pdf.svg");
  height: 30px;
  width: auto;
}
@media print, screen and (min-width: 768px){
  .pdfBtn .pdf_dl:before {
    height: 37px;
  }
}

.pdfBtn .pdf_dl {
  color: var(--color-dark);
  font-weight: 500;
}

@media print, screen and (min-width: 768px) {
  .btn-2col{
    display: flex;
    flex-wrap: wrap;
    margin-top: 0;
  }
  
  .btn-2col .btn{
    max-width: 100%;
    width: 48%;
    margin: 0.5%;

  }

  .btn-3col{
    display: flex;
    flex-wrap: wrap;
    margin-top: 0;
  }
  .btn-3col .btn{
    max-width: 100%;
    width: 32%;
    margin: 0.5%;
  }
  
  .guideBody.open .col2img div{
    width: 49%;
  }
  
  
  .guideBody.open .col2img {
    margin-bottom: 20px;
}
  
  .guideBody .w20_75 .right {
    width: 25%;
}
  
  .guideBody .w20_75 .left {
    width: 70%;
}  
  
  .guideBody .w75_20 .left {
    width: 25%;
}
  
  .guideBody .w75_20 .right {
    width: 70%;
}  
  
  .eventImg{
    width: 52%;
  }  
  
  .eventImg img{
    width: 100% !important;
  }
  
  .cal_col{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
  }  
  
  .cal_col_in{
    margin-right: 40px;
    margin-bottom: 40px;
    width: calc((100% - 120px) / 4);
  }
  
  .cal_col_in:nth-child(4n + 4){
    margin-right: 0;
  } 
  
  .contentWtap{
    max-width: 1150px;
    margin: auto;
  }  
  
}

.contact-question-head p{
  margin-bottom: 0;
}

a {
    color: #D200D2;
}

/* -------------------------------------------------
  Q & A アコーディオンアイテムのヘッド
------------------------------------------------- */
.contact-question-head {
  display: flex;
  column-gap: 1rem;
}
@media print, screen and (min-width: 768px){
  .contact-question-head {
    align-items: center;
  }
}

.contact-question-head span.q {
  font-family: var(--font-family-serif);
  color: var(--color-pink);
  font-size: 25px;
  font-weight: bold;
  flex-shrink: 0;
  line-height: 1;
}

@media print, screen and (min-width: 768px) {
  .contact-question-head span.q {
    font-size: 34px;
  }
}

/* --------------------------------------
  よくあるご質問
-------------------------------------- */
dl.qa-list {
  position: relative;
}

dl.qa-list > dt {
  position: relative;
  display: flex;
  align-items: baseline;
  column-gap: 8px;
  font-size: 15px;
  font-weight: 600;
  background-color: var(--color-gray-light);
}
@media print, screen and (min-width: 768px) {
  dl.qa-list > dt {
    column-gap: 12px;
    font-size: 17px;
  }
}

dl.qa-list > dt {
  padding: 3px 3% 7px;
}
@media print, screen and (min-width: 768px) {
  dl.qa-list > dt {
    padding: 7px 14px 12px;
  }
}

dl.qa-list > dd {
  padding-top: 14px;
  padding-bottom: 24px;
}
dl.qa-list > dd:last-child {
  border-bottom: none;
}
@media print, screen and (min-width: 768px) {
  dl.qa-list > dd {
    padding-top: 20px;
    padding-bottom: 32px;
  }
}

dl.qa-list > dt::before {
  content: "Q";
  color: var(--color-blue);
}

dl.qa-list > dt::before {
  display: block;
  flex: 0 0 fit-content;
  font-size: 24px;
  font-weight: bold;
  line-height: 1;
}
@media print, screen and (min-width: 768px) {
  dl.qa-list > dt::before {
    font-size: 32px;
  }
}

/* Document
 * ========================================================================== 
  お知らせ一覧、お知らせ記事のCSS */
.pagenavi {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 30px;
}
.pagenavi .wp-pagenavi .pages {
  display: none;
}
.pagenavi .wp-pagenavi .page, .pagenavi .wp-pagenavi .current, .pagenavi .wp-pagenavi .nextpostslink, .pagenavi .wp-pagenavi .previouspostslink {
  color: var(--color-pink);
  font-weight: bold;
  padding: 5px 10px;
  border: 1px solid var(--color-pink);
}
.pagenavi .wp-pagenavi .current {
  color: #fff;
  background: var(--color-pink);
}

.top-school-news ul li img {
    aspect-ratio: 16 / 9;
    height: 100%;
    object-fit: cover;
    object-position: center;
}


/* お知らせのページネーション */
.news-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
  padding: 10px;
  flex-wrap: wrap; /* ボタンが収まらない場合に折り返す */
}

.pagination-button {
  background-color: white;
  color: #333;
  border: 1px solid #B0D391;
  padding: 8px 12px;
  margin: 5px; /* マージンを少し小さく */
  cursor: pointer;
  border-radius: 4px;
  font-size: 14px;
  transition: background-color 0.3s ease;
}

.pagination-button:hover {
  background-color: #B0D391;
}

.pagination-button.is-active {
  background-color: #B0D391;
  color: white;
  border-color: #B0D391;
}

.pagination-button:disabled {
  background-color: #B0D391;
  color: #333;
  border-color: #9CC37A;
  cursor: not-allowed;
}

/* 画面幅が狭い場合の調整 */
@media screen and (max-width: 600px) {
  .pagination-button {
    padding: 6px 10px;
    font-size: 12px;
    margin: 3px;
  }
}

@media screen and (max-width: 480px) {
  .pagination-button {
    padding: 4px 8px;
    font-size: 10px;
    margin: 2px;
  }
}

/*--- text-align adjust ---*/
.alnL{
  text-align: left !important;
}
.alnC{
  text-align: center !important;
}
.alnR{
  text-align: right !important;
}
.valM{
  vertical-align: middle !important;;
}

.w00{ width:00%; }
.w05{ width:05%; }
.w10{ width:10%; }
.w15{ width:15%; }
.w20{ width:20%; }
.w25{ width:25%; }
.w30{ width:30%; }
.w35{ width:35%; }
.w40{ width:40%; }
.w45{ width:45%; }
.w50{ width:50%; }
.w55{ width:55%; }
.w60{ width:60%; }
.w65{ width:65%; }
.w70{ width:70%; }
.w75{ width:75%; }
.w80{ width:80%; }
.w85{ width:85%; }
.w90{ width:90%; }
.w95{ width:95%; }
.w100{ width:100%; }

.mt00{margin-top: 0 !important;}
.mt05{margin-top: 5px !important;}
.mt10{margin-top: 10px !important;}
.mt15{margin-top: 15px !important;}
.mt20{margin-top: 20px !important;}
.mt25{margin-top: 25px !important;}
.mt30{margin-top: 30px !important;}
.mt35{margin-top: 35px !important;}
.mt40{margin-top: 40px !important;}
.mt45{margin-top: 45px !important;}
.mt50{margin-top: 50px !important;}
.mt55{margin-top: 55px !important;}
.mt60{margin-top: 60px !important;}
.mt65{margin-top: 65px !important;}
.mt70{margin-top: 70px !important;}

.mb00{margin-bottom: 0 !important;}
.mb05{margin-bottom: 5px !important;}
.mb10{margin-bottom: 10px !important;}
.mb15{margin-bottom: 15px !important;}
.mb20{margin-bottom: 20px !important;}
.mb25{margin-bottom: 25px !important;}
.mb30{margin-bottom: 30px !important;}
.mb35{margin-bottom: 35px !important;}
.mb40{margin-bottom: 40px !important;}
.mb45{margin-bottom: 45px !important;}
.mb50{margin-bottom: 50px !important;}
.mb55{margin-bottom: 55px !important;}
.mb60{margin-bottom: 60px !important;}
.mb65{margin-bottom: 65px !important;}
.mb70{margin-bottom: 70px !important;}

.ml00{margin-left: 0 !important;}
.ml05{margin-left: 5px !important;}
.ml10{margin-left: 10px !important;}
.ml15{margin-left: 15px !important;}
.ml20{margin-left: 20px !important;}
.ml25{margin-left: 25px !important;}
.ml30{margin-left: 30px !important;}
.ml35{margin-left: 35px !important;}
.ml40{margin-left: 40px !important;}
.ml45{margin-left: 45px !important;}
.ml50{margin-left: 50px !important;}
.ml55{margin-left: 55px !important;}
.ml60{margin-left: 60px !important;}
.ml65{margin-left: 65px !important;}
.ml70{margin-left: 70px !important;}

.mr00{margin-right: 0 !important;}
.mr05{margin-right: 5px !important;}
.mr10{margin-right: 10px !important;}
.mr15{margin-right: 15px !important;}
.mr20{margin-right: 20px !important;}
.mr25{margin-right: 25px !important;}
.mr30{margin-right: 30px !important;}
.mr35{margin-right: 35px !important;}
.mr40{margin-right: 40px !important;}
.mr45{margin-right: 45px !important;}
.mr50{margin-right: 50px !important;}
.mr55{margin-right: 55px !important;}
.mr60{margin-right: 60px !important;}
.mr65{margin-right: 65px !important;}
.mr70{margin-right: 70px !important;}


/* span.red */
span.red {
  color: red;
}