@charset "UTF-8";
.local-nav { width: 90%; max-width: 1100px; margin-inline: auto; margin-top: 4rem; margin-bottom: 4rem; }
.local-nav ul { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
.local-nav ul li a { background-color: #fff; color: #00b1a9; border: 1px solid currentColor; display: flex; flex-wrap: wrap; flex-direction: column; align-content: center; text-align: center; padding: 10px 5px; transition: filter linear .3s; }
.local-nav ul li a:hover { filter: brightness(120%); }
.local-nav ul li a .en { font-size: 10px; }
.local-nav ul li a .jp { font-size: 15px; }
.local-nav ul li.current a { background: #008F91; background: -webkit-linear-gradient(0deg, #008f91 0%, #7cb5bc 100%); background: -moz-linear-gradient(0deg, #008f91 0%, #7cb5bc 100%); background: linear-gradient(0deg, #008f91 0%, #7cb5bc 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#008F91", endColorstr="#7CB5BC", GradientType=0); color: #fff; border: 1px solid #00b1a9; }
@media screen and (max-width: 1024px) { .local-nav ul { grid-template-columns: repeat(3, 1fr); } }
@media screen and (max-width: 768px) { .local-nav ul { grid-template-columns: repeat(2, 1fr); gap: 5px; } }

.move-line::before { background: #00b1a9; }

.contents { color: #222; }

.lmidashi, .midashi, .komidashi { color: #00b1a9; }
.lmidashi.sen, .midashi.sen, .komidashi.sen { border-bottom: solid 1px #00b1a9; padding-bottom: .5rem; }

.img-catemain { margin: 3rem auto 0 auto; }
@media screen and (max-width: 768px) { .img-catemain { width: 110%; margin-left: -5%; } }

.item-list { margin-top: 3rem; }
.item-list .supo-list li.maru-img .maru .cap { color: #000; }

.item-list-w .supo-list .li-ttl { color: #fff; border-bottom: solid 1px #fff; }
.item-list-w .supo-list .li-txt { color: #fff; }
.item-list-w .supo-list li.maru-img .maru .cap { color: #fff; }
.item-list-w .li-2box.cate-headbox::before { background: #3A3A3D; background: -webkit-linear-gradient(0deg, #3a3a3d 20%, rgba(58, 58, 61, 0) 100%); background: -moz-linear-gradient(0deg, #3a3a3d 20%, rgba(58, 58, 61, 0) 100%); background: linear-gradient(0deg, #3a3a3d 20%, rgba(58, 58, 61, 0) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3A3A3D", endColorstr="#3A3A3D", GradientType=0); }

.item-list, .item-list-w { overflow-x: hidden; }
.item-list .supo-list, .item-list-w .supo-list { max-width: 800px; margin: auto; display: grid; gap: 3rem; grid-template-columns: repeat(2, 1fr); }
.item-list .supo-list .li-l, .item-list-w .supo-list .li-l { grid-column: span 2; }
.item-list .img + .note, .item-list-w .img + .note { margin-top: .2rem; }
.item-list .li-ttl, .item-list-w .li-ttl { margin-top: .5rem; color: #00b1a9; font-size: 1rem; line-height: 1.6; }
.item-list .li-ttl .note, .item-list-w .li-ttl .note { display: block; margin-top: .2rem; line-height: 1.2; color: #222; }
.item-list .li-txt, .item-list-w .li-txt { margin-top: .5rem; font-size: .875rem; line-height: 1.8; }
.item-list .li-txt .note, .item-list-w .li-txt .note { margin-top: 1rem; text-align: left; line-height: 1.4; }
@media screen and (max-width: 768px) { .item-list, .item-list-w { /*.li-ttl{
	font-size: .8125rem;
}
.li-txt{
	font-size: .6875rem;
}*/ }
  .item-list .supo-list, .item-list-w .supo-list { gap: 1rem; max-width: 100%; } }
@media screen and (max-width: 500px) { .item-list .supo-list, .item-list-w .supo-list { grid-template-columns: 1fr; /*.li-ttl{
	font-size: .875rem;
}
.li-txt{
	font-size: .75rem;
}*/ }
  .item-list .supo-list .li-l, .item-list-w .supo-list .li-l { grid-column: span 1; } }

.cate-headbox { position: relative; }
.cate-headbox::before { content: ""; position: absolute; bottom: 0; left: -10%; width: 130%; height: 50%; z-index: 2; display: block; opacity: 1; transition: .5s; background: rgba(255, 255, 255, 0.1); background: -webkit-linear-gradient(0deg, white 20%, rgba(255, 255, 255, 0) 100%); background: -moz-linear-gradient(0deg, white 20%, rgba(255, 255, 255, 0) 100%); background: linear-gradient(0deg, white 20%, rgba(255, 255, 255, 0) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFFFFF1A", endColorstr="#FFFFFF", GradientType=0); }
.cate-headbox.show::before { opacity: 0; }

.more { width: 240px; display: -webkit-box; display: flex; flex-wrap: wrap; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: center; align-items: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 3; cursor: pointer; gap: 0; padding: .5rem 3rem; box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.6); background: #00b1a9; color: #fff; }
.more * { min-height: 0%; }
.more .plus { display: block; width: 1rem; height: 1px; background: #fff; position: relative; }
.more .plus::before { content: ""; display: block; width: 1rem; height: 1px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(90deg); background: #fff; }
.more .txt { font-size: 1rem; line-height: 1; letter-spacing: .1em; text-align: center; }

.accordion { max-height: 0; overflow: hidden; transition: .5s; opacity: 0; }
.accordion.show { max-height: 20000px; opacity: 1; }
.accordion > .supo-list { margin-top: 4rem; }

#k00 .rank { background: #7D8488; background: -webkit-linear-gradient(120deg, #7d8488 0%, #38383a 100%); background: -moz-linear-gradient(120deg, #7d8488 0%, #38383a 100%); background: linear-gradient(120deg, #7d8488 0%, #38383a 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#7D8488", endColorstr="#38383A", GradientType=0); color: #fff; margin: 3rem auto 0 auto; padding: 2rem; }
#k00 .rank ul { width: 90%; max-width: 1100px; margin-left: auto; margin-right: auto; width: 100%; display: grid; gap: 1rem; grid-template-columns: repeat(3, 1fr); }
#k00 .rank ul li .img { box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.7); }
#k00 .rank ul li .note { text-align: right; margin-top: .5rem; line-height: 1.4; }
#k00 .graph-box { margin: 3rem auto 0 auto; max-width: 800px; }
#k00 .graph-box .lmidashi + .midashi { margin-top: 2rem; }
#k00 .graph-box .graph01 { margin: 3rem auto 0 auto; }
#k00 .graph-box .graph01 .komidashi { text-align: center; }
#k00 .graph-box .graph01 .txt { display: block; cursor: pointer; transition: .3s; max-width: 520px; margin: auto; padding: 1rem; background: #c9bc9c; color: #fff; position: relative; font-size: .875rem; line-height: 1; text-align: center; }
#k00 .graph-box .graph01 .txt::after { content: ""; display: block; width: .75rem; height: .75rem; border-top: solid 1px #fff; border-right: solid 1px #fff; transform: translateY(-50%) rotate(45deg); position: absolute; top: 50%; right: 1rem; z-index: 2; }
#k00 .graph-box .graph01 .txt:hover { filter: brightness(80%); }
#k00 .graph-box .graph01 .note { margin-top: 1.5rem; }
#k00 .graph-box .graph01 .label { display: none; background: #F1F1F1; padding: 1rem; margin: 1rem auto 0 auto; max-width: 700px; }
#k00 .graph-box .graph01 .label .img { margin-top: 1rem; }
#k00 .graph-box .graph01 + h3 { margin-top: 3rem; }
@media screen and (max-width: 768px) { #k00 .midashi { text-align: center; }
  #k00 .rank { padding: 2rem 1rem; }
  #k00 .rank ul { grid-template-columns: repeat(2, 1fr); } }

#supo .items { display: grid; grid-template-columns: 1fr 2rem; grid-auto-rows: auto; align-items: stretch; }
#supo .items .tate { grid-column: 2 / 3; grid-row: 1 / -1; writing-mode: vertical-rl; text-orientation: upright; padding: .25rem; font-size: 1.5rem; line-height: 1; letter-spacing: .1em; display: -webkit-box; display: flex; flex-wrap: wrap; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; color: #fff; }
#supo .items .tate * { min-height: 0%; }
#supo .items .tate .dot { display: inline-block; transform: translateX(0.25em); /* ← 微調整 */ }
#supo .items .item-list, #supo .items .item-list-w { margin: 0; padding: 2rem 0 0 0; }
#supo .items .item-list ul, #supo .items .item-list-w ul { grid-template-columns: repeat(2, 1fr); }
#supo .items .supo-category { width: 90%; margin: auto; font-size: .875rem; color: #00b1a9; padding-bottom: .5rem; border-bottom: solid 1px #00b1a9; }
#supo .items .supo-category + .supo-list { margin-top: 2rem; }
#supo .items .item-list-w .supo-category { color: #fff; border-bottom: solid 1px #fff; }
#supo .items .item-list-w .li-2box .li-ttl { color: #fff; border-bottom: solid 1px #fff; }
#supo .li-2box { position: relative; width: 90%; max-width: 1100px; margin-left: auto; margin-right: auto; margin-top: 2rem; padding-bottom: 3rem; display: grid; gap: 1rem; grid-template-columns: repeat(2, 1fr); }
#supo .li-2box .img-box { grid-column-start: 2; }
#supo .li-2box .txt-box { grid-row-start: 1; }
#supo .li-2box .txt-box .li-ttl { margin-top: 0; }
#supo .supo-list { width: 90%; margin: 0 auto; padding-bottom: 2rem; }
#supo .supo-list li { position: relative; }
#supo .supo-list li.maru-img { display: grid; gap: .5rem .2rem; align-items: start; grid-template-columns: 1fr 30%; grid-template-rows: max-content auto; grid-template-areas: "ttl img" "txt img"; }
#supo .supo-list li.maru-img .maru { grid-area: img; border-radius: 50%; box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.5); }
#supo .supo-list li.maru-img .maru img { border-radius: 50%; object-fit: cover; display: block; }
#supo .supo-list li.maru-img .maru .cap { background: none; bottom: -10px; right: 0; }
#supo .supo-list li.maru-img .li-ttl { grid-area: ttl; margin-top: 0; }
#supo .supo-list li.maru-img .li-txt { grid-area: txt; margin-top: 0; }
#supo .li-ttl .icon { font-family: "Noto Sans JP","Roboto","YuGothic,YuGothicM","Hiragino Kaku Gothic ProN","メイリオ","Meiryo",sans-serif; -webkit-font-smoothing: antialiased; font-weight: 400; font-feature-settings: 'palt'; background: #e17a00; color: #fff; padding: .3rem .5rem; font-size: .625rem; line-height: 1; letter-spacing: .1em; display: inline-block; display: none; }
#supo .items { width: 100%; }
#supo .supo01 { margin-top: 3rem; display: grid; grid-template-rows: auto auto; }
#supo .supo01 .tate { background: #7dc058; grid-row: 1 / 3; }
#supo .supo01 .item-list-w { background: #7D8488; background: -webkit-linear-gradient(120deg, #7d8488 0%, #38383a 100%); background: -moz-linear-gradient(120deg, #7d8488 0%, #38383a 100%); background: linear-gradient(120deg, #7d8488 0%, #38383a 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#7D8488", endColorstr="#38383A", GradientType=0); color: #fff; }
#supo .supo01 .techo { background: #D4E9E8; padding: 2rem 0; }
#supo .supo01 .techo .supo-list { grid-template-columns: 1fr; }
#supo .supo01 .techo .supo-list li { background: rgba(255, 255, 255, 0.8); padding: 1rem; }
#supo .supo01 .techo .supo-list li .li-ttl { color: #00b1a9; border-bottom: solid 1px #00b1a9; }
#supo .supo01 .techo .supo-list li .li-txt { color: #222; }
#supo .supo02 .li-2box .img-box { grid-column: 1 / 2; }
#supo .supo02 .li-2box .txt-box { grid-column: 2 / 3; }
#supo .supo02 .tate { background: #00b1a9; }
#supo .supo03 .tate { background: #00b3d6; }
#supo .supo03 .item-list-w { background: #7D8488; background: -webkit-linear-gradient(120deg, #7d8488 0%, #38383a 100%); background: -moz-linear-gradient(120deg, #7d8488 0%, #38383a 100%); background: linear-gradient(120deg, #7d8488 0%, #38383a 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#7D8488", endColorstr="#38383A", GradientType=0); color: #fff; }
#supo .supo04 .item-list-w { background: #7D8488; background: -webkit-linear-gradient(120deg, #7d8488 0%, #38383a 100%); background: -moz-linear-gradient(120deg, #7d8488 0%, #38383a 100%); background: linear-gradient(120deg, #7d8488 0%, #38383a 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#7D8488", endColorstr="#38383A", GradientType=0); color: #fff; }
#supo .supo04 .tate { background: #4f66af; }
#supo .supo05 .li-l .komidashi { text-align: center; }
#supo .supo05 .li-l .graph02 { background: #F1F1F1; padding: 1rem; }
#supo .supo05 .li-l .graph02 .note { margin-top: 1rem; }
#supo .supo05 .li-l .graph02 + .li-ttl { margin-top: 1.5rem; }
#supo .supo05 .li-l .note a { text-decoration: underline; }
@media screen and (max-width: 768px) { #supo .items { grid-template-columns: 1fr 1.5rem; }
  #supo .items .tate { font-size: 1rem; }
  #supo .supo-list li.maru-img { grid-template-columns: 1fr 25%; grid-template-areas: "ttl img" "txt txt"; } }
@media screen and (max-width: 500px) { #supo .items .item-list .supo-list, #supo .items .item-list-w .supo-list { grid-template-columns: 1fr; }
  #supo .li-2box { gap: .5rem; grid-template-columns: 1fr; }
  #supo .li-2box .img-box { grid-column-start: 1; }
  #supo .li-2box .txt-box { grid-row-start: 2; }
  #supo .supo-list li.maru-img { grid-template-columns: 1fr 30%; grid-template-areas: "ttl img" "txt img"; }
  #supo .supo02 .li-2box .txt-box { grid-column: 1 / 2; } }

#park { /*.supo-list{
	gap: 2rem 1rem;
	grid-template-columns: repeat(4,1fr);
}*/ }
#park .li-txt { display: none; }
#park .park00 { display: grid; gap: 1rem; grid-template-columns: 65% 1fr; }
#park .park00 .park00-01 { grid-row: span 2; }
#park .park00 .park00-01 .img { height: 100%; overflow: hidden; position: relative; }
#park .park00 .park00-01 .img img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media screen and (max-width: 768px) { #park .supo-list { grid-template-columns: repeat(2, 1fr); } }

#edu .li-txt { display: none; }
#edu .galla .l-img { margin-top: 1rem; display: grid; gap: .5rem; grid-template-columns: 69.3% 1fr; }
#edu .galla .l-img .img-box:first-of-type { grid-row: span 2; }
#edu #more04 { top: 80%; transform: translateY(0), translateX(-50%); }
@media screen and (max-width: 768px) { #edu .accordion04 .supo-list { gap: 2rem 1rem; grid-template-columns: repeat(2, 1fr); }
  #edu #more04 { top: 60%; } }
@media screen and (max-width: 500px) { #edu .galla .l-img { grid-template-columns: repeat(2, 1fr); }
  #edu .galla .l-img .img-box:first-of-type { grid-column: span 2; grid-row: span 1; } }

#medi .li-txt { display: none; }
@media screen and (max-width: 768px) { #medi .supo-list { gap: 2rem 1rem; grid-template-columns: repeat(2, 1fr); } }
@media screen and (max-width: 500px) { #medi .supo-list li.li-l { grid-column: span 2; } }

#event .li-txt { display: none; }
@media screen and (max-width: 768px) { #event .accordion .supo-list { grid-template-columns: repeat(2, 1fr); } }