@charset "UTF-8";

/*==========================================
 PC  1366px-1024px
 Tab 1024px-768px
 SP  768px-
===========================================*/

/*-----------
共通
-----------*/
:root {
  /* z-index */
  --z-index-minus: -1;
  --z-index-default: 1;
  --z-index-nav: 10;
  --z-index-hamburger: 15;
  --z-index-header: 50;
  --z-index-modal: 100;
  --z-index-max: 999;

  /* color */
  --red: #B53838;
  --white: #fff;
  --lt-gray: #DADADA;
  --m-gray: #ccc;
  --gray: #777777;
  --black: #222;

  /* transition */
  --transition-default: 0.5s;

  /* width */
  --whole-width: min(100%, 1536px);
  --whole-width-minus: min(100% - 40px, 1536px - 40px);
  --contents-width: min(100%, 1240px);
  --contents-width-minus: min(100% - 40px, 1240px - 40px);
  --contents-min-width: min(100%, 1040px);
  --box-min-width: min(100%, 760px);

  /* font */
  --base-font-family: "Zen Maru Gothic", sans-serif;
  --base-font-size: 1rem;
}

/* keyframes フェードイン */
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/*-----------
共通（color,テキスト,ボタン,inner,共通boxなど）
-----------*/
html {
  font-size: var(--base-font-size, 1rem);
  /*scroll-behavior: smooth;
  scroll-padding-top: 100px;*/
  /*--scroll-offset: 0px;
  scroll-padding-top: var(--scroll-offset);*/
}

body {
  position: relative;
  width: 100%;
  margin: 0;
  color: var(--black);
  font-family: var(--base-font-family);
  font-size: clamp(0.875rem, 0.815rem + 0.25vw, 1rem);
  /* 14-16px 幅390〜1200px */
  font-weight: 400;
  font-style: normal;
  line-height: 2;
  letter-spacing: 0.02em;
  word-break: normal;
  overflow-wrap: anywhere;
  line-break: strict;
  -webkit-text-size-adjust: 100%;
  -webkit-animation: fadeIn 1.5s ease 0s 1 normal;
  animation: fadeIn 1.5s ease 0s 1 normal;
}

/* オレンジ */
body.orange {
  --main-color: #C45300;
  --dk-main-color: #A84700;
  --sf-main-color: #F7C098;
  --lt-main-color: #FFF3E2;
  --ltg-main-color: #F7F4F0;
}

/* グリーン */
body.green {
  --main-color: #007509;
  --dk-main-color: #005307;
  --sf-main-color: #86BE8A;
  --lt-main-color: #F2FAE8;
  --ltg-main-color: #EFF4ED;
}

/* ブルー */
body.blue {
  --main-color: #0065AF;
  --dk-main-color: #004d84;
  --sf-main-color: #79ACD1;
  --lt-main-color: #E8F4FA;
  --ltg-main-color: #EDF3F4;
}

/* ブロック */
main {
  position: relative;
  overflow: clip;
}

.wrap {
  width: var(--contents-width);
  margin-inline: auto;
}

.box-min {
  width: var(--box-min-width);
  margin-inline: auto;
}

.wrap:not(.mvNotes):not(.mvMenu):not(.mvManagement):not(article) {
  padding: 3.75rem 20px;
}

article.wrap {
  padding: 0 20px 3.75rem;
}

.pc-on {
  display: none;
}

.tab-on,
.sp-on {
  display: block;
}

.pt-none {
  padding-top: 0 !important;
}

.mb-none {
  margin-bottom: 0;
}

.mb-1 {
  margin-bottom: 1em;
}

.mainBody {
  padding: 0 20px 3.75rem;
  margin-inline: auto;
}

.mainBody:not(.min) {
  width: var(--contents-min-width);
}

.mainBody.min {
  width: var(--contents-min-width);
}

.group {
  margin: 2.5rem 0;
}

.group-min {
  margin: 1.5rem 0;
}

.space {
  padding-right: 1em;
}

/* 背景色 */
.bgGray {
  background-color: var(--ltg-main-color);
}

/* 背景色ボックス */
.bgColor {
  padding: 1em;
  background-color: var(--ltg-main-color);
  border-radius: 10px;
}

/* カラム */
[class^=column] {
  margin-bottom: 1em;
}

[class^=column] a {
  display: block;
}

.column2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px;
}

.column3 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px;
}

.column4 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px;
}

.column2pc {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 15px;
}

.column3pc {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 15px;
}

.column4pc {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 15px;
}

.flexcolumn2 {
  display: flex;
  justify-content: center;
  gap: 15px;
}

.textImageBox {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 15px;
}

.textImageBox {
  margin-bottom: 2em;
}

/* サイズ */
.w10 {
  width: 10%;
}
.w15 {
  width: 15%;
}
.w18 {
  width: 18%;
}
.w20 {
  width: 20%;
}
.w25 {
  width: 25%;
}
.w30 {
  width: 30%;
}
.w33 {
  width: 33.3%;
}
.w35 {
  width: 35%;
}
.w40 {
  width: 40%;
}
.w45 {
  width: 45%;
}
.w50 {
  width: 50%;
}

/* 見出し・テキスト */
.mainHeadline {
  position: relative;
  width: var(--whole-width-minus);
  padding: 2rem 1rem;
  margin-inline: auto;
  margin-bottom: 2.5rem;
  background-color: var(--lt-main-color);
  border-radius: 20px;
}

.mainHeadline::before,
.mainHeadline::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1.25rem;
  height: 1.25rem;
  margin: auto;
  background-color: var(--white);
}

.mainHeadline::before {
  left: 0;
  clip-path: circle(50% at left);
}

.mainHeadline::after {
  right: 0;
  clip-path: circle(50% at right);
}

.mainHeadline h1 {
  font-size: clamp(1.75rem, 1.148rem + 2.47vw, 3rem);
  /* 28-48px */
  margin-block: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 700;
  line-height: 1.4;
}

h2 {
  font-size: clamp(1.25rem, 0.648rem + 2.47vw, 2.5rem);
  /* 20-40px */
}

.mainBody h2 {
  position: relative;
  padding-bottom: 0.5em;
  margin-bottom: 0.75em;
}

.mainBody h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 4px; /* ドットのサイズに合わせる */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle fill='%23000' cx='10' cy='10' r='10'/%3E%3C/svg%3E");
  background-repeat: repeat-x;
  background-position: bottom left;
  background-size: 8px 4px;
}

/* h2 カラー変更　※fill='%23の後に色コードを入力 */
body.orange .mainBody h2::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle fill='%23C45300' cx='10' cy='10' r='10'/%3E%3C/svg%3E");
}

body.green .mainBody h2::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle fill='%23007509' cx='10' cy='10' r='10'/%3E%3C/svg%3E");
}

body.blue .mainBody h2::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle fill='%230065AF' cx='10' cy='10' r='10'/%3E%3C/svg%3E");
}

h3 {
  font-size: clamp(1.125rem, 0.644rem + 1.98vw, 2.125rem);
  /* 18-34px */
}

.mainBody h3 {
  position: relative;
  padding: 0.25em 0.5em 0.25em 0.75em;
  margin-bottom: 0.75em;
  background-color: var(--ltg-main-color);
  border-radius: 10px;
}

.mainBody h3::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 5px;
  height: 1em;
  margin: auto;
  background-color: var(--main-color);
  border-radius: 4px;
}

h4 {
  font-size: clamp(1.125rem, 0.824rem + 1.23vw, 1.75rem);
  /* 18-28px */
}

.mainBody h4 {
  display: grid;
  grid-template-columns: -webkit-max-content minmax(0, 1fr);
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 8px;
  margin-bottom: 0.5em;
}

.mainBody h4::before {
  content: "";
  width: 0.75rem;
  height: 0.75rem;
  margin-top: 0.5em;
  background-color: var(--main-color);
  border-radius: 5px;
}

h5 {
  font-size: clamp(1.125rem, 0.944rem + 0.74vw, 1.5rem);
  /* 18-24px */
  margin-bottom: 0.75em;
}

h6 {
  font-size: clamp(1rem, 0.88rem + 0.49vw, 1.25rem);
  /* 16-20px */
  margin-bottom: 0.75em;
}

main p {
  margin-bottom: 1rem;
}

main p.paginationSummary,
main p.newsDate,
main .bgColor > p:last-of-type {
  margin-bottom: 0;
}

strong {
  font-weight: 700;
}

small,
.small {
  font-weight: 400;
  font-size: 0.75rem;
}

.text-large {
  font-size: 160%;
  font-weight: 700;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.frontDesk {
  width: 100%;
  padding: 0.35em 2em;
  text-align: center;
  font-weight: 700;
  background-color: var(--ltg-main-color);
  border-radius: 3em;
}

.text-block {
  display: block;
}

/* リスト */
main ul {
  list-style: disc;
  margin: 1.5rem 0 1.5rem 1em;
}

#managementNavi ul,
#mvMenuNavi ul,
.newsList,
.paginationList,
.anchorLink,
.relatedLink,
table td ul,
dl dd > ul,
.mvNotesBox > ul {
  list-style: none;
  margin: 0;
}

main ul li {
  margin-bottom: 0.5em;
}

#managementNavi ul li,
#mvMenuNavi ul li,
.newsList li,
.paginationList li,
.anchorLink li,
.relatedLink li {
  margin-bottom: 0;
}

ol {
  counter-reset: my-counter;
  list-style: none;
   margin: 1.5rem 0 1.5rem 0;
}

.breadcrumbs ol {
  counter-reset: unset;
  margin: 0;
}

table td > ol {
  margin: 0;
}

ol li {
  position: relative;
  margin-bottom: 0.5em;
  padding-left: 1.7rem;
}

.breadcrumbs ol li {
  margin-bottom: 0;
  padding-left: 0;
}

ol li::before {
  content: counter(my-counter);
  counter-increment: my-counter;
  display: block;
  position: absolute;
  top: 0.6em;
  left: 0;
  line-height: 1rem;
  text-align: center;
  font-size: 0.75rem;
  height: 1.2rem;
  width: 1.2rem;
  border: 1px solid var(--black);
  border-radius: 50%;
}

.breadcrumbs ol li::before {
  display: none;
}

/* 定義リスト */
dl div {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  border-bottom: 2px dotted var(--sf-main-color);
}

dl div:first-of-type {
  border-top: 2px dotted var(--sf-main-color);
}

dl dt {
  padding: 0.5em 0 0;
}

dl dd {
  padding: 0.5em 0;
}

/* 除外したい dl は上書き */
.footerInfo dl div,
.mvAddress dl div {
  display: block;
}

.footerInfo dl div:first-of-type,
.mvAddress dl div:first-of-type {
  border-top: none;
}

.footerInfo dl div,
.mvAddress dl div {
  border-bottom: none;
}

.mvAddress dl dt,
.mvAddress dl dd {
  padding: 0;
}

dl dd > ul {
  list-style: disc;
  margin: 0 0 0 1em;
}

/* 表組み */
table {
  width: 100%;
  margin-bottom: 1em;
}

table thead th,
table tfoot th {
  background-color: var(--ltg-main-color);
}

table thead tr {
  border-bottom: 3px solid var(--black);
}

table tfoot tr {
  border-top: 3px solid var(--black);
}

table th,
table td {
  padding: 0.75em;
  border: 1px solid var(--gray);
}

table th {
  background-color: var(--ltg-main-color);
}

table td ul {
  list-style: disc;
  margin: 0 0 0 1em;
}

table td .textImageBox {
  margin-bottom: 0;
}

.tableScroll {
  overflow-x: auto;
}

.tableScroll table {
  width: max(100%, 750px);
}

.tableScroll .scroll-hint-icon-wrap.is-active .scroll-hint-icon {
  opacity: 0.9;
}

.tableScroll .scroll-hint-icon {
  background: var(--black);
}

/* リンク・ボタン */
* a,
a img,
a::before,
a::after,
button,
button::after {
  -webkit-transition: var(--transition-default);
  transition: var(--transition-default);
}

header a:focus {
  color: var(--main-color);
}

.homeBtn a:focus {
  color: var(--white);
}

main a {
  text-decoration: underline;
}

#globalNavi a,
.nomalBtn a,
.homeBtn a,
.tel a,
#managementNavi a,
#pageTop a,
.newsList a,
.page-numbers,
.anchorLink a,
.relatedLink a {
  text-decoration: none;
}

main a:focus {
  color: var(--main-color);
}

footer a:focus {
  color: var(--main-color);
}

a[href^=https]::after,
a[href^=http]::after,
a[href^="//"]::after {
  content: "";
  display: inline-block;
  width: 0.875rem;
  height: 0.875rem;
  margin-left: 0.25em;
  vertical-align: middle;
  -webkit-mask-image: url(../images/icon-external.svg);
  mask-image: url(../images/icon-external.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  background-color: var(--black);
}

a[href^="https://www.iwate-fukushi.or.jp/shisetu/"]::after,
a[href^="http://www.iwate-fukushi.or.jp/shisetu/"]::after,
a[href^="https://test.media-crew.co.jp/iwate-fukushi2025/"]::after,
a[href^="http://test.media-crew.co.jp/iwate-fukushi2025/"]::after {
  display: none;
}

a[href$=".pdf"]::before,
a[href$=".xls"]::before,
a[href$=".xlsx"]::before,
a[href$=".xlsm"]::before,
a[href$=".doc"]::before,
a[href$=".docx"]::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 20px;
  margin-right: 0.5em;
  vertical-align: middle;
}

a[href$=".pdf"]::before {
  background: url(../images/icon-pdf.svg) no-repeat center/cover;
}

a[href$=".xls"]::before,
a[href$=".xlsx"]::before,
a[href$=".xlsm"]::before {
  background: url(../images/icon-excel.svg) no-repeat center/cover;
}

a[href$=".doc"]::before,
a[href$=".docx"]::before {
  background: url(../images/icon-word.svg) no-repeat center/cover;
}

button {
  font-family: var(--base-font-family);
  font-style: normal;
  background-color: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
}

.relatedLink {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1em;
  margin-bottom: 2rem;
}

.relatedLink a {
  display: flex;
  align-items: center;
  position: relative;
  height: 100%;
  padding: 0.75em 2.5em 0.75em 1em;
  font-weight: 700;
  border: 1px solid var(--main-color);
  background-color: var(--white);
  border-radius: 3em;
}

.relatedLink a::before {
  right: 6px !important;
}

.relatedLink a::after {
  inset: 5px !important;
}

.anchorLink {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1em;
}

.anchorLink li {
  border-bottom: 1px solid var(--lt-gray);
}

.anchorLink a {
  display: flex;
  align-items: center;
  position: relative;
  height: 100%;
  padding: 0.75em 2em 0.75em 0.5em;
  font-weight: 700;
}

.anchorLink a::before {
  content: "";
  position: absolute;
  bottom: 0;
  top: 0;
  right: 2px;
  z-index: 0;
  margin: auto;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  -webkit-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: var(--transition-default);
  transition: var(--transition-default);
  background-color: var(--main-color);
}

.anchorLink a::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  mask-image: url(../images/icon-arrow-bottom-circle-mask.svg);
  mask-repeat: no-repeat;
  mask-size: 28px;
  mask-position: center right;
  -webkit-mask-image: url(../images/icon-arrow-bottom-circle-mask.svg);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: 28px;
  -webkit-mask-position: center right;
  -webkit-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: var(--transition-default);
  transition: var(--transition-default);
  background-color: var(--lt-main-color);
}

.homeBtn a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  padding: 0.75em 1.5em;
  color: var(--white);
  font-weight: 700;
  background-color: var(--main-color);
  border-radius: 3em;
  text-decoration: none;
}

.homeBtn a::before {
  content: "";
  display: block;
  width: 1.25rem;
  height: fit-content;
  aspect-ratio: 1/1;
  -webkit-mask-image: url(../images/icon-home.svg);
  mask-image: url(../images/icon-home.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  background-color: var(--white);
}

.homeBtn a:focus {
  background-color: var(--dk-main-color);
}

.nomalBtn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 2rem 0;
}

.nomalBtn.center {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.nomalBtn a {
  display: block;
  position: relative;
  padding-right: 2.3em;
  font-size: clamp(1rem, 0.88rem + 0.49vw, 1.25rem);
  /* 16-20px */
  font-weight: 700;
  text-decoration: none;
}

.nomalBtn a::before {
  content: "";
  position: absolute;
  bottom: 0;
  top: 0;
  right: 2px;
  z-index: 0;
  margin: auto;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: var(--white);
  -webkit-transform: translateX(-3px);
  transform: translateX(-3px);
  -webkit-transition: var(--transition-default);
  transition: var(--transition-default);
}

.nomalBtn a::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  mask-image: url("../images/icon-arrow-right-circle-mask.svg");
  mask-repeat: no-repeat;
  mask-size: 28px;
  mask-position: center right;
  -webkit-mask-image: url("../images/icon-arrow-right-circle-mask.svg");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: 28px;
  -webkit-mask-position: center right;
  -webkit-transform: translateX(-3px);
  transform: translateX(-3px);
  -webkit-transition: var(--transition-default);
  transition: var(--transition-default);
  background-color: var(--main-color);
}

/* 画像 */
picture {
  display: block;
}

img {
  width: 100%;
  height: auto;
  vertical-align: middle;
}

main img {
  border-radius: 10px;
}

.imageSingle {
  margin-bottom: 1em;
}

.imageMin {
  width: min(100%, 460px);
  margin-inline: auto;
}

.imageMiddle {
  width: var(--box-min-width);
  margin-inline: auto;
}

/* アニメーション */
.js-fadeup,
.js-popup {
  opacity: 0;
}

.fadeup--show {
  -webkit-animation: fadeupAnime 1.5s forwards;
  animation: fadeupAnime 1.5s forwards;
  opacity: 0;
}

.popup--show {
  -webkit-animation: popup 0.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  animation: popup 0.6s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

/* noscript */
.noscriptMessage {
  display: block;
  padding: 1.25rem;
  background-color: var(--lt-gray);
}

.noscriptMessage a {
  text-decoration: underline;
}

/* iframe */
iframe {
  border: 0;
}

/* youtube */
.youtube {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
}

.youtube iframe {
  width: 100%;
  height: 100%;
}

.playBtn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  width: 100%;
  height: 100%;
}

.playBtn img {
  width: 50px;
  height: 50px;
}

/* map */
.map {
  width: 100%;
}

.map:not(.half) {
  aspect-ratio: 7/5;
}

.map.half {
  aspect-ratio: 7/5;
}

.map iframe {
  width: 100%;
  height: 100%;
  margin-bottom: 1em;
}

/* アイコン */
/* 丸矢印背景 */
.icon-arrow-circle:not(a[href^="https"]):not(a[href^="http"]):not(a[href^="//"])::before {
  content: "";
  position: absolute;
  bottom: 0;
  top: 0;
  right: 2px;
  z-index: 0;
  margin: auto;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  -webkit-transform: translateX(-3px);
  transform: translateX(-3px);
  -webkit-transition: var(--transition-default);
  transition: var(--transition-default);
}

.icon-arrow-circle:is(.color, .white):not(a[href^="https"]):not(a[href^="http"]):not(a[href^="//"])::before {
  background-color: var(--main-color);
}

/* 丸矢印　矢印マスク */
.icon-arrow-circle:not(a[href^="https"]):not(a[href^="http"]):not(a[href^="//"])::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  mask-image: url("../images/icon-arrow-right-circle-mask.svg");
  mask-repeat: no-repeat;
  mask-size: 28px;
  mask-position: center right;
  -webkit-mask-image: url("../images/icon-arrow-right-circle-mask.svg");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: 28px;
  -webkit-mask-position: center right;
  -webkit-transform: translateX(-3px);
  transform: translateX(-3px);
  -webkit-transition: var(--transition-default);
  transition: var(--transition-default);
}

.icon-arrow-circle.color:not(a[href^="https"]):not(a[href^="http"]):not(a[href^="//"])::after {
  background-color: var(--lt-main-color);
}

.icon-arrow-circle.white:not(a[href^="https"]):not(a[href^="http"]):not(a[href^="//"])::after {
  background-color: var(--white);
}

@media print, screen and (min-width: 768px) {

  /* ブロック */
  .tab-on {
    display: none;
  }

  /* カラム */
  .column3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .column2pc {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .column3pc {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .column4pc {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .textImageBox {
    grid-template-columns: minmax(0, 1fr) 25%;
  }

  /* map */
  .map.half {
    aspect-ratio: 19 / 20;
  }

  /* .frontDesk {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  } */
}

@media print, screen and (min-width: 1024px) {

  /* ブロック */
  .wrap:not(.mvNotes):not(.mvMenu):not(.mvManagement):not(article) {
    padding: 7.5rem 20px;
  }

  article.wrap {
    padding: 0 20px 7.5rem;
  }

  .pc-on {
    display: block;
  }

  .sp-on {
    display: none;
  }

  .mainBody {
    padding: 0 20px 7.5rem;
  }

  .group {
    margin: 5rem 0;
  }

  .group-min {
    margin: 3rem 0;
  }

  /* 背景色ボックス */
  .bgColor {
    padding: 2em;
  }

  /* カラム */
  .column2 {
    gap: 60px;
  }

  .column3 {
    gap: 60px;
  }

  .column4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 60px;
  }

  .column2pc {
    /*gap: 60px;*/
    gap: 40px 60px;
  }

  .column3pc {
    gap: 40px;
  }

  .column4pc {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
  }

  .textImageBox {
    gap: 60px;
  }

  /* 見出し・テキスト */
  .topHeadline {
    margin-bottom: 2.5rem;
  }

  .mainHeadline {
    padding: 6rem 3rem;
    margin-bottom: 5rem;
    border-radius: 40px;
  }

  .mainHeadline::before,
  .mainHeadline::after {
    width: 2.5rem;
    height: 2.5rem;
  }

  .mainBody h2 {
    padding-bottom: 0.3em;
    margin-bottom: 1em;
  }

  .mainBody h3::before {
    width: 8px;
  }

  .mainBody h4::before {
    content: "";
    width: 1rem;
    height: 1rem;
  }

  /* 定義リスト */
  dl div {
    grid-template-columns: minmax(0, 15em) minmax(0, 1fr);
  }

  dl.long div {
    grid-template-columns: minmax(0, 22em) minmax(0, 1fr) !important;
    align-items: center;
  }

  dl dt {
    padding: 1em;
  }

  dl dd {
    padding: 1em;
  }

  /* 表組み */
  .tableScroll {
    overflow-x: auto;
  }

  .tableScroll table {
    width: 100%;
  }

  /* リンク・ボタン */
  .relatedLink {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25em;
  }
  
  .relatedLink a {
    padding: 1em 3em 1em 1.5em;
  }

  .anchorLink {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.25em;
  }
  
  .anchorLink a {
    padding: 1em 2em 1em 0.75em;
  }

  /* map */
  .map:not(.half) {
    aspect-ratio: 21/9;
  }

  /* youtube */
  .playBtn img {
    width: 60px;
    height: 60px;
  }
}

@media (any-hover: hover) {

  a:hover {
    color: var(--main-color);
  }

  a:hover img {
    opacity: 0.8;
  }

  a.icon-arrow-circle:hover::before {
    -webkit-transform: translateX(0) !important;
    transform: translateX(0) !important;
  }

  a.icon-arrow-circle:hover::after {
    -webkit-transform: translateX(0) !important;
    transform: translateX(0) !important;
  }
  
  .anchorLink a:hover::before {
    -webkit-transform: translateY(3px);
    transform: translateY(3px);
  }

  .anchorLink a:hover::after {
    -webkit-transform: translateY(3px);
    transform: translateY(3px);
  }

  .button a:hover {
    color: var(--main-color);
    background-color: var(--white);
  }

  .homeBtn a:hover {
    color: var(--white);
    background-color: var(--dk-main-color);
  }

  .nomalBtn a:hover::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  .nomalBtn a:hover::after {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  .relatedLink a:hover {
    color: var(--white) !important;
    background-color: var(--main-color);
  }
}

/*-----------
header
-----------*/
#skipLink a {
  position: absolute;
  z-index: var(--z-index-header);
  top: -2rem;
  left: 0;
  display: block;
  padding: 2px 10px;
  color: var(--white);
  text-align: left;
  font-size: clamp(0.75rem, 0.69rem + 0.25vw, 0.875rem);
  /*12-14px*/
  overflow: hidden;
  background-color: var(--black);
  -webkit-transition: top 0.5s ease;
  transition: top 0.5s ease;
}

#skipLink a:focus {
  top: 0;
}

.headerInner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: var(--whole-width);
  height: 100%;
  padding: 10px;
  margin-inline: auto;
}

.headerName {
  position: relative;
}

.headerName a {
  color: var(--black);
  text-decoration: none;
  font-weight: 700;
}

.headerName span {
  display: block;
  line-height: 1.5em;
}

.headerName .sub {
  font-size: clamp(0.75rem, 0.63rem + 0.49vw, 1rem);
  /* 12-16px */
}

.headerName .main {
  font-size: clamp(1.25rem, 0.769rem + 1.98vw, 2.25rem);
  /* 20-36px */
}

.headerContents {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: end;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.btnBox .homeBtn {
  display: none;
}

/* スクロールした時 */
.js-fixed {
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
}

.js-fixed.fixed--active {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: var(--white);
  -webkit-box-shadow: 0 2px 5px rgb(0 0 0 / 0.1);
  box-shadow: 0 2px 5px rgb(0 0 0 / 0.1);
  z-index: var(--z-index-header);
}

.js-fixed.fixed--active .headerName .sub {
  font-size: clamp(0.625rem, 0.505rem + 0.49vw, 0.875rem);
  /* 10-14px */
}

.js-fixed.fixed--active .headerName .main {
  font-size: clamp(1.125rem, 0.944rem + 0.74vw, 1.5rem);
  /* 18-24px */
}

.js-fixed.fixed--active #fontSize {
  opacity: 0;
  display: none;
}

.js-fixed.fixed--active .headerInner {
  padding: 8px 10px;
}

/* グローバルナビ */
#naviBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  opacity: 0;
  visibility: hidden;
  position: fixed;
  z-index: var(--z-index-nav);
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  padding: 6.25rem 0;
  background-color: rgb(255 255 255 / .96);
  backdrop-filter: blur(10px);
  -webkit-transform: translateX(100vw);
  transform: translateX(100vw);
  overflow-y: scroll;
  -webkit-transition: var(--transition-default);
  transition: var(--transition-default);
}

#naviBox.naviBox--active {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

.naviBoxInner {
  width: var(--contents-min-width);
  padding: 0 20px;
  margin-inline: auto;
}

#globalNavi ul {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.25rem;
}

#globalNavi .nomalMenu {
  margin-bottom: 2.5rem;
}

#globalNavi .nomalMenu li {
  border-bottom: 2px dotted var(--sf-main-color);
}

#globalNavi .nomalMenu li a {
  display: grid;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-template-columns: minmax(0, 1fr) 28px;
  gap: 8px;
  position: relative;
  padding: 1em 0;
  height: 100%;
  color: var(--black);
  font-weight: 700;
  text-decoration: none;
}

#globalNavi .nomalMenu li a:focus {
  color: var(--main-color);
}

#globalNavi .nomalMenu li a:focus::before {
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

#globalNavi .nomalMenu li a:focus::after {
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

#globalNavi .otherMenu {
  margin-bottom: 2.5rem;
}

#globalNavi .otherMenu li a {
  display: block;
  padding: 1em;
  height: 100%;
  color: var(--black);
  font-weight: 700;
  text-decoration: none;
  background-color: var(--ltg-main-color);
  border-radius: 5px;
}

#globalNavi .otherMenu li a:focus {
  color: var(--main-color);
  background-color: var(--lt-main-color);
}

#globalNavi .managementMenu {
  margin-bottom: 2.5rem;
}

#globalNavi .managementMenu p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 8px;
  margin-bottom: 1rem;
  font-size: clamp(1.125rem, 0.944rem + 0.74vw, 1.5rem);
  /* 18-24px */
  font-weight: 700;
}

#globalNavi .managementMenu p::before {
  content: "";
  display: block;
  width: 1rem;
  height: 1rem;
  background-color: var(--main-color);
  border-radius: 5px;
}

#globalNavi .managementMenu ul {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.25rem;
}

#globalNavi .managementMenu ul li a {
  display: block;
  position: relative;
  height: 100%;
  font-weight: 700;
  border-radius: 5px;
  background-color: var(--lt-main-color);
}

#globalNavi .managementMenu ul li a::before {
  right: 0.5em;
}

#globalNavi .managementMenu ul li a::after {
  right: calc(0.5em - 2px);
}

#globalNavi .managementMenu ul li:not(.hasSubMenu) a {
  display: grid;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  grid-template-columns: minmax(0, 1fr) 28px;
  /*gap: 8px;*/
}

#globalNavi .managementMenu ul li:not(.hasSubMenu) a:focus {
  color: var(--main-color);
  background-color: var(--ltg-main-color);
}

#globalNavi .managementMenu ul li:not(.hasSubMenu) a:focus::before {
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

#globalNavi .managementMenu ul li:not(.hasSubMenu) a:focus::after {
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

#globalNavi .managementMenu ul li:not(.hasSubMenu) .block {
  display: block;
}

#globalNavi .managementMenu ul li:not(.hasSubMenu) .smallBlock {
  display: block;
  font-size: clamp(0.75rem, 0.72rem + 0.12vw, 0.813rem);
  /* 12-13px */
}

#globalNavi .managementMenu ul li a {
  padding: 1em;
}

#globalNavi .managementMenu ul li.subMenu a {
  padding: 0;
}

#globalNavi .managementMenu ul .hasSubMenu {
  padding: 1em;
  font-weight: 700;
  background-color: var(--lt-main-color);
  border-radius: 5px;
}

#globalNavi .managementMenu .subMenu {
  margin-top: 1em;
  gap: 1rem;
}

#globalNavi .managementMenu .subMenu a {
  padding: 1em;
  background-color: var(--white);
  border-radius: 3em;
}

#naviBox .homeBtn {
  margin-bottom: 1em;
}

@media print, screen and (min-width: 768px) {
  #globalNavi ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
  }

  #globalNavi .otherMenu li a {
    text-align: center;
  }

  #globalNavi .managementMenu ul:not(.subMenu) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media print, screen and (min-width: 1024px) {
  .headerInner {
    padding: 0 20px;
  }

  .btnBox .homeBtn {
    display: block;
  }

  /* グローバナビ */
  #naviBox {
    padding: 8.75rem 0;
    /* 140px 0 */
  }

  #globalNavi ul {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  #globalNavi .managementMenu ul:not(.subMenu) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  /* スクロールした時 */
  .js-fixed.fixed--active .headerInner {
    padding: 10px 20px;
  }
}

@media (any-hover: hover) {
  #globalNavi .nomalMenu li a:hover {
    color: var(--main-color);
  }

  #globalNavi .nomalMenu li a:hover::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  #globalNavi .nomalMenu li a:hover::after {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  #globalNavi .otherMenu li a:hover {
    color: var(--main-color);
    background-color: var(--lt-main-color);
  }

  #globalNavi .managementMenu ul li:not(.hasSubMenu) a:hover {
    color: var(--main-color);
    background-color: var(--ltg-main-color);
  }

  #globalNavi .managementMenu ul li:not(.hasSubMenu) a:hover::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  #globalNavi .managementMenu ul li:not(.hasSubMenu) a:hover::after {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

/*-----------
フォントサイズ変更
-----------*/
#fontSize {
  display: none;
  margin-top: 1.5rem;
  margin-bottom: 1rem;
}

#fontSize span,
#fontSize button {
  font-size: clamp(0.75rem, 0.69rem + 0.25vw, 0.875rem);
  /* 12-14px */
}

.sizeButton {
  padding: 0 0.625rem;
  border: 1px solid var(--m-gray);
  border-radius: 10px;
}

.sizeButton.active {
  font-weight: 700;
  background-color: #f0f0f0;
}

@media print, screen and (min-width: 1024px) {
  #fontSize {
    display: block;
  }
}

/*-----------
ハンバーガー
-----------*/
.btnBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1.25rem;
}

/* ハンバーガーボタン */
.hamburger {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 5px;
  position: relative;
  z-index: var(--z-index-hamburger);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: 50px;
  background-color: var(--white);
  border: 1px solid var(--m-gray);
  border-radius: 3em;
  pointer-events: auto;
}

.hamburger:focus .hamburgerBox {
  background-color: var(--dk-main-color);
}

.hamburgerBox {
  display: block;
  position: relative;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: var(--main-color);
}

.hamburgerBoxInner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 6px;
  height: 100%;
}

.hamburgerLine {
  display: block;
  position: relative;
  left: 0;
  width: 20px;
  height: 2px;
  border-radius: 1px;
  background-color: var(--white);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.hamburgerLine span {
  display: block;
  margin: auto;
}

.hamburgerText {
  display: block;
  padding-left: 0.5rem;
  width: 5em;
  text-align: center;
  font-size: clamp(0.625rem, 0.444rem + 0.74vw, 1rem);
  /* 10-16px */
  font-weight: 700;
  line-height: 1;
  color: var(--black);
}

/* ハンバーガーボタン　アクティブ */
.hamburger--active .hamburgerLine:first-of-type {
  top: 8px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.hamburger--active .hamburgerLine:nth-of-type(2) {
  opacity: 0;
}

.hamburger--active .hamburgerLine:last-of-type {
  top: -8px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

@media print, screen and (min-width: 1024px) {

  /* ハンバーガーボタン */
  .hamburger {
    gap: 8px;
    height: 60px;
  }

  .hamburgerBox {
    width: 60px;
    height: 60px;
  }

  .hamburgerText {
    padding-left: 0.75rem;
  }

  /* ハンバーガーボタン　アクティブ */
  .hamburger--active {
    top: -30px;
  }

  /* スクロールした時 */
  .fixed--active .hamburger--active {
    top: 0;
  }
}

@media (any-hover: hover) {
  .hamburger:hover .hamburgerBox {
    background-color: var(--dk-main-color);
  }
}

/*-----------
footer
-----------*/
#pageTop {
  position: absolute;
  top: -30px;
  right: 10px;
}

#pageTop a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3px;
  line-height: 1.4em;
  width: 70px;
  height: 100%;
  aspect-ratio: 1/1;
  color: var(--white);
  font-size: clamp(0.625rem, 0.595rem + 0.12vw, 0.688rem);
  /* 10-11px */
  font-weight: 700;
  background-color: var(--main-color);
  border-radius: 50%;
  -webkit-transform: translateY(0);
  transform: translateY(0);
}

#pageTop a::before {
  content: "";
  display: block;
  width: 12px;
  height: 21px;
  -webkit-mask-image: url(../images/icon-arrow-top.svg);
  mask-image: url(../images/icon-arrow-top.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  background-color: var(--white);
}

footer {
  position: relative;
  background-color: var(--lt-main-color);
  border-radius: 40px 40px 0 0;
}

.footerWrap {
  width: var(--contents-width);
  padding: 3.75rem 20px;
  margin-inline: auto;
}

.footerName {
  margin-bottom: 1.25rem;
  font-weight: 700;
}

.footerName span {
  display: block;
  line-height: 1.6em;
}

.footerName .sub {
  font-size: clamp(0.75rem, 0.69rem + 0.25vw, 0.875rem);
  /* 12-14px */
}

.footerName .main {
  font-size: clamp(1.125rem, 0.944rem + 0.74vw, 1.5rem);
  /* 18-24px */
}

.footerInfo {
  margin-bottom: 1.5rem;
}

.footerInfo dl div {
  border-bottom: 2px dotted var(--sf-main-color);
}

.footerInfo dl div:first-of-type {
  border-top: 2px dotted var(--sf-main-color);
}

.footerInfo dt {
  padding: 0.5em 0 0;
}

.footerInfo dd {
  padding: 0.5em 0;
}

.footerInfo dt,
.footerInfo dd {
  font-size: 0.875rem;
}

.footerInfo a {
  text-decoration: underline;
}

.footerContact {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 1.5rem 1rem;
  background-color: var(--white);
  border-radius: 10px;
}

.footerContact>p {
  margin-bottom: 1em;
  font-size: clamp(1rem, 0.88rem + 0.49vw, 1.25rem);
  /* 16-20px */
  font-weight: 700;
}

#footerNavi {
  margin: 1.5rem 0 1rem;
}

#footerNavi ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

#footerNavi ul li {
  font-size: clamp(0.75rem, 0.69rem + 0.25vw, 0.875rem);
  /* 12-14px */
}

#footerNavi ul li::after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 1em;
  background-color: var(--black);
}

#footerNavi ul li:first-of-type::before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 1em;
  background-color: var(--black);
}

#footerNavi a {
  padding: 0 1em;
  text-decoration: underline;
}

.copyRight {
  display: block;
  text-align: center;
}

@media print, screen and (min-width: 768px) {
  .footerInner {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 40px;
  }

  #footerNavi ul {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: end;
  }

  .copyRight {
    text-align: right;
  }
}

@media print, screen and (min-width: 1024px) {
  #pageTop {
    top: -50px;
    right: 20px;
  }

  #pageTop a {
    gap: 8px;
    width: 100px;
  }

  #pageTop a::before {
    width: 18px;
    height: 30px;
  }

  footer {
    border-radius: 100px 100px 0 0;
  }

  .footerWrap {
    padding: 7.5rem 20px;
  }

  .footerInner {
    gap: 60px;
  }

  .footerInfo {
    margin-bottom: 0;
  }

  .footerInfo dl div {
    display: grid;
    grid-template-columns: 8em minmax(0, 1fr);
  }

  .footerInfo dt,
  .footerInfo dd {
    padding: 1em;
  }

  .footerContact {
    padding: 3rem 2rem;
    border-radius: 20px;
  }

  .footerContact .contact {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1rem;
  }

  #footerNavi {
    margin: 5rem 0 1rem;
  }
}

@media print, screen and (min-width: 1366px) {
  #pageTop {
    right: 100px;
  }
}

@media (any-hover: hover) {
  #pageTop a:hover {
    background-color: var(--dk-main-color);
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
  }
}

/*-----------
お問い合わせエリア
-----------*/
.contact {
  margin-bottom: 1.5rem;
}

.contact>p {
  padding: 0.5em 1.25em;
  margin-bottom: 1em;
  text-align: center;
  font-weight: 700;
  border-top: 1px solid var(--black);
  border-bottom: 1px solid var(--black);
}

.telBox a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 0.5em;
  font-size: clamp(1.5rem, 1.169rem + 1.36vw, 2.188rem);
  /* 24-34px */
  font-weight: 700;
}

.telBox a::before {
  content: "";
  display: block;
  width: 0.875rem;
  height: fit-content;
  aspect-ratio: 3/4;
  -webkit-mask-image: url(../images/icon-tel.svg);
  mask-image: url(../images/icon-tel.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  background-color: var(--main-color);
}

.telBox .telNum {
  display: block;
  line-height: 1em;
}

.telBox .ja {
  display: inline-block;
  margin-right: 8px;
  font-size: clamp(1rem, 0.639rem + 1.48vw, 1.75rem);
  /* 16-28px */
}

@media print, screen and (min-width: 1024px) {
  .contact {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1rem;
  }

  .contact>p {
    margin-bottom: 0;
  }

  .telBox a {
    margin-bottom: 0.25em;
  }

  .telBox a::before {
    width: 1.25rem;
  }
}

/*-----------
パンくずリスト
-----------*/
.breadcrumbs {
  width: var(--whole-width);
  padding: 0 20px;
  margin: 1em auto 0.5em;
}

.breadcrumbs ol {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 8px;
}

.breadcrumbs ol li {
  font-size: clamp(0.75rem, 0.69rem + 0.25vw, 0.875rem);
  /* 12-14px */
}

.breadcrumbs ol li:not(:last-of-type)::after {
  content: ">";
  display: inline-block;
  margin-left: 5px;
}

@media print, screen and (min-width: 1024px) {
  .breadcrumbs {
    margin: 2em auto 1em;
  }
}

/*-----------
お知らせ
-----------*/
.newsList li:first-of-type a {
  border-top: 3px dotted var(--m-gray);
}

.newsList a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 36px;
  align-items: center;
  border-bottom: 3px dotted var(--m-gray);
  padding: 1em 0;
  position: relative;
}

.newsContents {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.newsDate {
  margin-top: 0.5em;
}

.newsContents .newsDate {
  margin-top: 0;
}

.newsImageBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 15px;
  margin-bottom: 2rem;
}

.newsImageBox figure {
  width: 100%;
}

.newsImageBox a {
  display: block;
  position: relative;
}

.newsImageBox a::before {
  content: "";
  position: absolute;
  top: -5px;
  left: -5px;
  z-index: 1;
  width: clamp(30px, 3vw, 44px);
  height: clamp(30px, 3vw, 44px);
  border-radius: 50%;
  background-color: var(--white);
  -webkit-transform: translateX(-3px);
  transform: translateX(-3px);
  -webkit-transition: var(--transition-default);
  transition: var(--transition-default);
}

.newsImageBox a::after {
  content: "";
  position: absolute;
  top: -5px;
  left: -5px;
  /*inset: 0;*/
  z-index: 1;
  width: clamp(30px, 3vw, 44px);
  height: clamp(30px, 3vw, 44px);
  mask-image: url(../images/icon-search-mask.svg);
  mask-repeat: no-repeat;
  mask-position: center right;
  -webkit-mask-image: url(../images/icon-search-mask.svg);
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center right;
  -webkit-transform: translateX(-3px);
  transform: translateX(-3px);
  -webkit-transition: var(--transition-default);
  transition: var(--transition-default);
  background-color: var(--main-color);
}

/* ページネーション */
.pagination {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1em;
  margin-top: 1.5rem;
}

.paginationList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1em;
}

.page-numbers {
  padding: 0.25em 0.65em;
  font-weight: 700;
  border-radius: 5px;
}

span.page-numbers {
  border: 2px solid var(--lt-gray);
  background-color: var(--lt-gray);
}

a.page-numbers {
  border: 2px solid var(--m-gray);
}

@media print, screen and (min-width: 1024px) {
  .newsList a {
    padding: 1.75em 0;
  }

  .newsContents {
    grid-template-columns: 9em minmax(0, 1fr);
    gap: 1em;
  }

  .newsImageBox {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 60px;
  }

  .newsImageBox figure {
    width: calc(50% - 30px);
  }

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

/*-----------
モーダル
-----------*/
.news .lum-lightbox,
.popup .lum-lightbox {
    background: rgb(0 0 0 / 0.8);
}

.news .lum-lightbox.lum-open,
.popup .lum-lightbox.lum-open {
  z-index: var(--z-index-max);
}

.news .lum-lightbox-inner img,
.popup .lum-lightbox-inner img {
  max-height: 600px;
  max-width: 100%;
  width: auto;
}

.news .lum-close-button,
.popup .lum-close-button {
  right: 20px;
  top: 20px;
  width: 50px;
  height: 50px;
  opacity: 1;
  cursor: pointer;
  background-color: var(--white);
  border-radius: 50%;
  transition: var(--transition-default);
}

.news .lum-close-button:after,
.news .lum-close-button:before,
.popup .lum-close-button:after,
.popup .lum-close-button:before {
  left: 24px;
  top: 10px;
  height: 30px;
  background-color: var(--black);
}

@media (any-hover: hover) {
  .news .lum-close-button:hover,
  .popup .lum-close-button:hover {
    background-color: var(--gray);
  }

  .news .lum-gallery-button:hover,
  .popup .lum-gallery-button:hover {
    opacity: 0.5;
  }
}