@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@100;300;400;500;700;800;900&display=swap');

#contents{
  background: url("./background_images/stars.png"), linear-gradient(to bottom, #aee2fd 0%, #f8f1fe 65%, #f9ffc9 100%) no-repeat top center;
  background-size: 100%;
  background-attachment: fixed;
  /* border-bottom: 100px solid #fff; */
}
#footer{
	padding-top: 100px;
	z-index: 1;
	background-color: #fff;
}
.page_title_inner {
  padding-top: 25px;
  container-type: inline-size;
}
#cinnamo_campagin .block_title h2{
  border-bottom-left-radius: 1rem;
  border-bottom-right-radius: 1rem;
  background: rgba(255,255,255,0.5) url('./background_images/title2.svg') no-repeat center;
  background-size: 100%;
  padding: 0;
  width: 100%;
  height: 11rem;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
@media (max-width: 500px) {
	#cinnamo_campagin .block_title h2{
		height: 34cqw;
	}
}
#contents_main h1{
  width: 100%;
  height: 54cqw;
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
  background: rgba(255,255,255,0.5) url("./background_images/logo@2x.png") no-repeat center center;
  background-size: 90%;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
#contents_main h1:after{display: none;}

#contents_main{
	padding-bottom: 0;
}

.fade-enter-active {
  -webkit-transition: opacity 0s ease-in-out;
  transition: opacity 0s ease-in-out;
}

.fade-leave-active {
  -webkit-transition: opacity 0s ease-in-out;
  transition: opacity 0s ease-in-out;
}

.fade-enter-from,
.fade-leave-to {
  opacity: 0;
}

.hideBeforeVue {
  visibility: hidden;
}

#contents_inner/*cinnamo_campagin*/{
	max-width: 500px;
	margin: -30px auto 0 auto;
	padding: 0 25px 25px;
	background: url("./background_images/kirakira.png"), linear-gradient(to bottom, #b7e5fa, #ebd6f0, #fff0d2);
    background-attachment: fixed;
	box-shadow: -10px 0px 9px -5px rgba(0, 0, 0, 0.15) , 10px 0px 9px -5px rgba(0, 0, 0, 0.15);
	text-align: center;
    z-index: 10;
    position: relative;
}

#contents_inner/*cinnamo_campagin*/ *{
	font-family: "M PLUS Rounded 1c", serif;
	font-weight: 800;
	font-style: normal;
	margin-bottom: 0;
}

#contents_inner/*cinnamo_campagin*/ .banner{
	line-height: 0;
}
#contents_inner/*cinnamo_campagin*/ .banner img{
	line-height: 1;
	max-width: 100%;
}

#contents_inner/*cinnamo_campagin*/ h2{
	font-size: 1.625rem;
	font-weight: 900;
	color: #e573b7;
	text-align: center;
	line-height: 1.2;
	padding-bottom: 0;
	margin-bottom: 25px;
}

#contents_inner/*cinnamo_campagin*/ h2:after{
	content: none;
}

#contents_inner/*cinnamo_campagin*/ h3:before{
	content: none;
}

#contents_inner .article_module h3 {
  font-size: 1.4rem;
  color: #555;
  padding-bottom: 8px;
  position: relative;
  display: inline-block;
  color: #8e673e;
  margin-bottom: .5rem;
  letter-spacing: .03rem;
}

#contents_inner .article_module h3::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(to right, #ffadad, #ffd6a5, #fdffb6, #caffbf, #9bf6ff, #a0c4ff, #bdb2ff, #ffc6ff);
  border-radius: 3px;
}

p.title{
	text-align: center;
	font-size: 1.375rem;
	line-height: 1.2;
	margin-bottom: 30px;
	color: #e573b7;
}

.article_module, .index_module{
    border-radius: 1rem;
    background-image: url("./background_images/kirakira.png");
    background-color: rgba(255,255,255,0.5);
    padding: 25px;
    margin: 25px 0;
}

/* モーダル周り */
.index_module.list_block ul.tile3 .text,
.index_module.list_block ul.tile4 .text{
    min-height: 0;
    padding: 0;
}
.index_module.list_block ul.tile3 li .text,
.index_module.list_block ul.tile4 li .text{
    border: none;
	container-type: inline-size;
}
.index_module.list_block ul.tile3 li .item_icon,
.index_module.list_block ul.tile4 li .item_icon{
    font-size: clamp(.7rem, 13cqw, 1rem);
    margin-top: 0.25em;
	font-weight: 500!important;
}
.index_module.list_block ul.tile3 .item_icon:after,
.index_module.list_block ul.tile4 .item_icon:after{
    display: none;
}
.index_module.list_block ul.tile3 li > a:after,
.index_module.list_block ul.tile4 li > a:after{
    display: none;
}
.index_module ul.tile3 li .image_text .image,
.index_module ul.tile4 li .image_text .image{
    border: 1px solid #888;
    background-color: #fff;
}
.index_module ul.tile3 li .image:before,
.index_module ul.tile4 li .image:before{
    padding-top: 100%;
}
.index_module ul.tile3 li > a:hover{
	box-shadow: none;
}
.iziModal{
    max-width: 500px!important;
}

@media screen and (max-width: 500px){
	#cinnamo_campagin{
		padding: 0;
	}
	#app{
		border: none;
	}
}
#contents_inner .list_block h3 {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--hokkaido-color1);
  --size: 40px;      /* 全体のサイズ */
  background-size: var(--size) var(--size);
  position: relative;
  margin-bottom: 1.25rem;
  color: #fff;
  padding: .25em 0;
  border-radius: .5rem;
  font-size: 1.4rem;
}
.index_module .module_title h3 span:not(.cloud) {
  letter-spacing: 2px;
    text-shadow: 2px 2px 4px rgb(53 53 53 / 40%);
  font-weight: 600 !important;
}

.cloud {
  position: absolute;
  width: 5rem;
  height: 5rem;
  margin: 0 auto;
  top: -.5rem;
}

.cloud::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: #000; /* 枠線の色 */
  -webkit-mask-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22uuid-b57ec084-5f5a-4e13-bba2-411dd9ea2973%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%202%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20115.59%2078.84%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%20%7B%20fill%3A%20%23fff%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cg%20id%3D%22uuid-c56b78fe-cb1c-4b3f-a886-b50feadfd096%22%20data-name%3D%22%E3%82%B3%E3%83%B3%E3%83%86%E3%83%B3%E3%83%84%22%3E%20%3Cg%3E%20%3Cg%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2234.41%22%20cy%3D%2220.38%22%20r%3D%2219.71%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2272.16%22%20cy%3D%2219.71%22%20r%3D%2219.71%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2220.38%22%20cy%3D%2253.45%22%20r%3D%2220.38%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2255.79%22%20cy%3D%2253.45%22%20r%3D%2225.39%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2291.71%22%20cy%3D%2243.6%22%20r%3D%2223.89%22%2F%3E%20%3C%2Fg%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2254.19%22%20cy%3D%2227.75%22%20r%3D%224.92%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%3C%2Fsvg%3E');
  mask-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22uuid-b57ec084-5f5a-4e13-bba2-411dd9ea2973%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%202%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20115.59%2078.84%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%20%7B%20fill%3A%20%23fff%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cg%20id%3D%22uuid-c56b78fe-cb1c-4b3f-a886-b50feadfd096%22%20data-name%3D%22%E3%82%B3%E3%83%B3%E3%83%86%E3%83%B3%E3%83%84%22%3E%20%3Cg%3E%20%3Cg%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2234.41%22%20cy%3D%2220.38%22%20r%3D%2219.71%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2272.16%22%20cy%3D%2219.71%22%20r%3D%2219.71%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2220.38%22%20cy%3D%2253.45%22%20r%3D%2220.38%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2255.79%22%20cy%3D%2253.45%22%20r%3D%2225.39%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2291.71%22%20cy%3D%2243.6%22%20r%3D%2223.89%22%2F%3E%20%3C%2Fg%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2254.19%22%20cy%3D%2227.75%22%20r%3D%224.92%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%3C%2Fsvg%3E');
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
}

/* 中身の層（枠線の太さ分だけ小さくする） */
.cloud::after {
  content: '';
  position: absolute;
  inset: 3px; /* ここが枠線の太さになる */
  background-color: #fff;
  -webkit-mask-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22uuid-b57ec084-5f5a-4e13-bba2-411dd9ea2973%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%202%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20115.59%2078.84%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%20%7B%20fill%3A%20%23fff%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cg%20id%3D%22uuid-c56b78fe-cb1c-4b3f-a886-b50feadfd096%22%20data-name%3D%22%E3%82%B3%E3%83%B3%E3%83%86%E3%83%B3%E3%83%84%22%3E%20%3Cg%3E%20%3Cg%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2234.41%22%20cy%3D%2220.38%22%20r%3D%2219.71%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2272.16%22%20cy%3D%2219.71%22%20r%3D%2219.71%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2220.38%22%20cy%3D%2253.45%22%20r%3D%2220.38%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2255.79%22%20cy%3D%2253.45%22%20r%3D%2225.39%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2291.71%22%20cy%3D%2243.6%22%20r%3D%2223.89%22%2F%3E%20%3C%2Fg%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2254.19%22%20cy%3D%2227.75%22%20r%3D%224.92%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%3C%2Fsvg%3E');
  mask-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22uuid-b57ec084-5f5a-4e13-bba2-411dd9ea2973%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%202%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20115.59%2078.84%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%20%7B%20fill%3A%20%23fff%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cg%20id%3D%22uuid-c56b78fe-cb1c-4b3f-a886-b50feadfd096%22%20data-name%3D%22%E3%82%B3%E3%83%B3%E3%83%86%E3%83%B3%E3%83%84%22%3E%20%3Cg%3E%20%3Cg%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2234.41%22%20cy%3D%2220.38%22%20r%3D%2219.71%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2272.16%22%20cy%3D%2219.71%22%20r%3D%2219.71%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2220.38%22%20cy%3D%2253.45%22%20r%3D%2220.38%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2255.79%22%20cy%3D%2253.45%22%20r%3D%2225.39%22%2F%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2291.71%22%20cy%3D%2243.6%22%20r%3D%2223.89%22%2F%3E%20%3C%2Fg%3E%20%3Ccircle%20class%3D%22uuid-3fa9abca-a5e7-41e3-9af0-df6f21fd106a%22%20cx%3D%2254.19%22%20cy%3D%2227.75%22%20r%3D%224.92%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%3C%2Fsvg%3E');
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
}
.cloud.before{
  left: -1rem;
}
.cloud.after{
  right: -1rem;
}

:root{
	--hokkaido-color1: #5c60a3;
	--hokkaido-color2: #7376aa;
	--tohoku-color1: #a3539a;
	--tohoku-color2: #a866a0;
	--kanto1-color1: #d3538f;
	--kanto1-color2: #da679c;
	--kanto2-color1: #de701f;
	--kanto2-color2: #e6823a;
	--tokyo-color1: #25a6b4;
	--tokyo-color2: #3fc0cf;
	--chubu-color1: #a15c36;
	--chubu-color2: #b56c45;
	--kinki-color1: #9fb71d;
	--kinki-color2: #b2c836;
	--chushikoku-color1: #3a9942;
	--chushikoku-color2: #4fac57;
	--kyushuokinawa-color1: #cc3b39;
	--kyushuokinawa-color2: #cf5350;
}
#contents_inner .hokkaido h3{
  background-image: 
    conic-gradient(var(--hokkaido-color1) 25%, var(--hokkaido-color2) 0 50%, var(--hokkaido-color1) 0 75%, var(--hokkaido-color2) 0);
}
#contents_inner .hokkaido .cloud::before {
  background-color: var(--hokkaido-color1); /* 枠線の色 */
}
.index_module.hokkaido ul.tile3 li .image_text .image,
.index_module.hokkaido ul.tile4 li .image_text .image{
  border-color: var(--hokkaido-color1);
}
.index_module.hokkaido ul.tile3 .item_icon{
  color: var(--hokkaido-color1);
}

#contents_inner .tohoku h3{
  background-image: 
    conic-gradient(var(--tohoku-color1) 25%, var(--tohoku-color2) 0 50%, var(--tohoku-color1) 0 75%, var(--tohoku-color2) 0);
}
#contents_inner .tohoku .cloud::before {
  background-color: var(--tohoku-color1); /* 枠線の色 */
}
.index_module.tohoku ul.tile3 li .image_text .image,
.index_module.tohoku ul.tile4 li .image_text .image{
  border-color: var(--tohoku-color1);
}
.index_module.tohoku ul.tile3 .item_icon{
  color: var(--tohoku-color1);
}

#contents_inner .kanto1 h3{
  background-image: 
    conic-gradient(var(--kanto1-color1) 25%, var(--kanto1-color2) 0 50%, var(--kanto1-color1) 0 75%, var(--kanto1-color2) 0);
}
#contents_inner .kanto1 .cloud::before {
  background-color: var(--kanto1-color1); /* 枠線の色 */
}
.index_module.kanto1 ul.tile3 li .image_text .image,
.index_module.kanto1 ul.tile4 li .image_text .image{
  border-color: var(--kanto1-color1);
}
.index_module.kanto1 ul.tile3 .item_icon{
  color: var(--kanto1-color1);
}

#contents_inner .kanto2 h3{
  background-image: 
    conic-gradient(var(--kanto2-color1) 25%, var(--kanto2-color2) 0 50%, var(--kanto2-color1) 0 75%, var(--kanto2-color2) 0);
}
#contents_inner .kanto2 .cloud::before {
  background-color: var(--kanto2-color1); /* 枠線の色 */
}
.index_module.kanto2 ul.tile3 li .image_text .image,
.index_module.kanto2 ul.tile4 li .image_text .image{
  border-color: var(--kanto2-color1);
}
.index_module.kanto2 ul.tile3 .item_icon{
  color: var(--kanto2-color1);
}

#contents_inner .tokyo h3{
  background-image: 
    conic-gradient(var(--tokyo-color1) 25%, var(--tokyo-color2) 0 50%, var(--tokyo-color1) 0 75%, var(--tokyo-color2) 0);
}
#contents_inner .tokyo .cloud::before {
  background-color: var(--tokyo-color1); /* 枠線の色 */
}
.index_module.tokyo ul.tile3 li .image_text .image,
.index_module.tokyo ul.tile4 li .image_text .image{
  border-color: var(--tokyo-color1);
}
.index_module.tokyo ul.tile3 .item_icon{
  color: var(--tokyo-color1);
}

#contents_inner .chubu h3{
  background-image: 
    conic-gradient(var(--chubu-color1) 25%, var(--chubu-color2) 0 50%, var(--chubu-color1) 0 75%, var(--chubu-color2) 0);
}
#contents_inner .chubu .cloud::before {
  background-color: var(--chubu-color1); /* 枠線の色 */
}
.index_module.chubu ul.tile3 li .image_text .image,
.index_module.chubu ul.tile4 li .image_text .image{
  border-color: var(--chubu-color1);
}
.index_module.chubu ul.tile3 .item_icon{
  color: var(--chubu-color1);
}

#contents_inner .kinki h3{
  background-image: 
    conic-gradient(var(--kinki-color1) 25%, var(--kinki-color2) 0 50%, var(--kinki-color1) 0 75%, var(--kinki-color2) 0);
}
#contents_inner .kinki .cloud::before {
  background-color: var(--kinki-color1); /* 枠線の色 */
}
.index_module.kinki ul.tile3 li .image_text .image,
.index_module.kinki ul.tile4 li .image_text .image{
  border-color: var(--kinki-color1);
}
.index_module.kinki ul.tile3 .item_icon{
  color: #839617;/* var(--kinki-color1); */
}

#contents_inner .chushikoku h3{
  background-image: 
    conic-gradient(var(--chushikoku-color1) 25%, var(--chushikoku-color2) 0 50%, var(--chushikoku-color1) 0 75%, var(--chushikoku-color2) 0);
}
#contents_inner .chushikoku .cloud::before {
  background-color: var(--chushikoku-color1); /* 枠線の色 */
}
.index_module.chushikoku ul.tile3 li .image_text .image,
.index_module.chushikoku ul.tile4 li .image_text .image{
  border-color: var(--chushikoku-color1);
}
.index_module.chushikoku ul.tile3 .item_icon{
  color: var(--chushikoku-color1);
}

#contents_inner .kyushuokinawa h3{
  background-image: 
    conic-gradient(var(--kyushuokinawa-color1) 25%, var(--kyushuokinawa-color2) 0 50%, var(--kyushuokinawa-color1) 0 75%, var(--kyushuokinawa-color2) 0);
}
#contents_inner .kyushuokinawa .cloud::before {
  background-color: var(--kyushuokinawa-color1); /* 枠線の色 */
}
.index_module.kyushuokinawa ul.tile3 li .image_text .image,
.index_module.kyushuokinawa ul.tile4 li .image_text .image{
  border-color: var(--kyushuokinawa-color1);
}
.index_module.kyushuokinawa ul.tile3 .item_icon{
  color: var(--kyushuokinawa-color1);
}
@media screen and (max-width: 767px) {
  .index_module ul.tile3 {
    display: flex;
  }
  .index_module ul.tile3 li {
    margin-right: 20px;
  }
}

/* モーダル */
.linkBtnBlock:has(.vote){
	display: none;
}
.modalbox .article_module{
	margin: 0;
	background: url("./background_images/kirakira.png"), linear-gradient(to top, #fff1d0 0%, #ffd0ec 30%, #b7e5fa 100%);
	border-radius: 0;
	display: flex;
	flex-direction: column;
}
.modalbox .module_title{
	order: 1;
}
.modalbox h3{
	position: relative;
	background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22uuid-c44ed484-39c2-4ae5-98b9-3a7f2c5d025c%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%202%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20635.13%2094.87%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.uuid-12bb2c42-b9c2-46c5-a2a6-d52a5f248a8b%20%7B%20fill%3A%20%2325a6b4%3B%20%7D%20.uuid-2c4b424f-4b09-4e3b-bf20-a6b92773b3ee%20%7B%20fill%3A%20%23fff%3B%20%7D%20%3C%2Fstyle%3E%20%3C%2Fdefs%3E%20%3Cg%20id%3D%22uuid-36d370ef-acd8-4591-bb90-e350e316f12c%22%20data-name%3D%22%E3%83%A2%E3%83%BC%E3%83%80%E3%83%AB%22%3E%20%3Cg%3E%20%3Cpolygon%20class%3D%22uuid-2c4b424f-4b09-4e3b-bf20-a6b92773b3ee%22%20points%3D%22516.2%2093.87%20516.2%2015.87%20633.51%2015.87%20614.01%2054.87%20633.51%2093.87%20516.2%2093.87%22%2F%3E%20%3Cpath%20class%3D%22uuid-12bb2c42-b9c2-46c5-a2a6-d52a5f248a8b%22%20d%3D%22M631.89%2C16.87l-18.55%2C37.11-.45.89.45.89%2C18.55%2C37.11h-114.69V16.87h114.69M635.13%2C14.87h-119.93v80h119.93l-20-40%2C20-40h0Z%22%2F%3E%20%3C%2Fg%3E%20%3Cg%3E%20%3Cpolygon%20class%3D%22uuid-2c4b424f-4b09-4e3b-bf20-a6b92773b3ee%22%20points%3D%221.62%2093.87%2021.12%2054.87%201.62%2015.87%20118.93%2015.87%20118.93%2093.87%201.62%2093.87%22%2F%3E%20%3Cpath%20class%3D%22uuid-12bb2c42-b9c2-46c5-a2a6-d52a5f248a8b%22%20d%3D%22M117.93%2C16.87v76H3.24l18.55-37.11.45-.89-.45-.89L3.24%2C16.87h114.69M119.93%2C14.87H0l20%2C40L0%2C94.87h119.93V14.87h0Z%22%2F%3E%20%3C%2Fg%3E%20%3Cg%3E%20%3Cpolygon%20class%3D%22uuid-2c4b424f-4b09-4e3b-bf20-a6b92773b3ee%22%20points%3D%22104.16%2079.55%20104.16%202.22%20118.93%2015.32%20118.93%2092.64%20104.16%2079.55%22%2F%3E%20%3Cpath%20class%3D%22uuid-12bb2c42-b9c2-46c5-a2a6-d52a5f248a8b%22%20d%3D%22M105.16%2C4.45l12.77%2C11.32v74.65l-12.77-11.32V4.45M103.16%2C0v80l16.77%2C14.87V14.87L103.16%2C0h0Z%22%2F%3E%20%3C%2Fg%3E%20%3Cg%3E%20%3Cpolygon%20class%3D%22uuid-2c4b424f-4b09-4e3b-bf20-a6b92773b3ee%22%20points%3D%22516.2%2015.32%20530.97%202.22%20530.97%2079.55%20516.2%2092.64%20516.2%2015.32%22%2F%3E%20%3Cpath%20class%3D%22uuid-12bb2c42-b9c2-46c5-a2a6-d52a5f248a8b%22%20d%3D%22M529.96%2C4.45v74.65l-12.77%2C11.32V15.77l12.77-11.32M531.96%2C0l-16.77%2C14.87v80l16.77-14.87V0h0Z%22%2F%3E%20%3C%2Fg%3E%20%3Cg%3E%20%3Crect%20class%3D%22uuid-2c4b424f-4b09-4e3b-bf20-a6b92773b3ee%22%20x%3D%22104.16%22%20y%3D%221%22%20width%3D%22426.8%22%20height%3D%2278%22%2F%3E%20%3Cpath%20class%3D%22uuid-12bb2c42-b9c2-46c5-a2a6-d52a5f248a8b%22%20d%3D%22M529.96%2C2v76H105.16V2h424.8M531.96%2C0H103.16v80h428.8V0h0Z%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%3C%2Fsvg%3E');
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	height: 3.0em;
	text-align: center;
	line-height: 2.4;
	color: #24A0AE;
	font-size: 1.4rem;
	z-index: 1;
	font-family: "M PLUS Rounded 1c", serif;
	font-weight:600;
	font-style: normal;
}
.modalbox h3:before{
	display: none;
}

.modalbox span.pref {
  position: absolute;
  top: 7.25%;
  left: 0;
  display: inline-block;
  padding: .5rem 2rem .5rem 1rem; /* 右側に余裕を持たせる */
  color: #24A0AE;              /* 文字色 */
  font-weight: bold;
  z-index: 1;
  text-align: left;
  line-height: 1;
  font-size: 1.2rem;
  font-family: "M PLUS Rounded 1c", serif;
  font-weight: 600;
  font-style: normal;
}
.modalbox .article_text .txt{
	font-family: "M PLUS Rounded 1c", serif;
	font-weight: 500;
	font-style: normal;
	color: #8E673E;
  text-align: center;
}
/* 枠線と背景を作るための設定 */
.modalbox span.pref::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  /* メインの枠線色 */
  background-color: #25a6b4; 
  /* 切り抜き形状（外側） */
  clip-path: polygon(0% 0%, 100% 0%, 93% 50%, 100% 100%, 0% 100%);
}

.modalbox span.pref::after {
  content: "";
  position: absolute;
  /* 枠線の太さ分（2px）だけ内側に配置 */
  top: 1px;
  left: 0;
  right: -1px;
  bottom: 1px;
  z-index: -1;
  /* 中の背景色を白にする */
  background-color: #fff;
  /* 切り抜き形状（内側：外側とほぼ同じだが微調整） */
  clip-path: polygon(0% 0%, 98% 0%, 91% 50%, 98% 100%, 0% 100%);
}
.modalbox .article_image {
	order: 2;
	background-color: #fff;
	border-radius: 1rem;
}
.modalbox .article_text{
	order: 3;
	background-color: #fff;
	border-radius: 50%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	min-height: 8rem;
	margin-top: -2rem;
	z-index: 0;
	margin-bottom: 0;
}

/* キャラクタースライド背景 */
#contents:has(.slider){
  position:relative;
}
#contents .slider {
  overflow: hidden;
  width: 100vw; /* 画面幅ぴったり */
  height: 300px; /* 揺れる幅を考慮して少し高めに設定 */
  display: flex;
  align-items: center; /* 中央付近で揺らす */
  position: fixed;
  z-index: 0;
  max-width: 100%;
  opacity: 1;
  transition: opacity 0.5s ease-in-out;
}

#contents .slider-row1 {
  top: 25%;
}

#contents .slider-row2 {
  top: 60%;
}

.slide-track {
  display: flex;
  animation: scroll 180s linear infinite;
}

.slide-track.scroll-reverse {
  animation: scroll-reverse 180s linear infinite;
}
/* 上下に揺れる動き */
.floating-img {
  height: 200px; /* 任意の高さ */
  object-fit: contain;
  flex-shrink: 0;
  padding: 0 10px; /* 画像同士の隙間 */
  
  /* アニメーション名 秒数 緩急 無限 反転（行って戻って） */
  animation: float 4s ease-in-out infinite alternate;
}

/* .slide-track img {
  height: 100%;
  object-fit: cover;
  flex-shrink: 0;
} */

@keyframes scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

@keyframes scroll-reverse {
  0% { transform: translateX(-50%); }
  100% { transform: translateX(0); }
}

/* 上下揺れのアニメーション */
@keyframes float {
  0% {
    transform: translateY(-30px); /* 上に15px */
  }
  100% {
    transform: translateY(30px);  /* 下に15px */
  }
}

.txt .main_txt{
	color: #8e673e;
  letter-spacing: .03rem;
}

body .iziModal-navigate-prev, body .iziModal-navigate-next{
	background: url('./background_images/arrow.png') no-repeat right center;
	opacity: 1;
	width: 3.5rem;
	height: 3.5rem;
	margin: auto;
}