/* 1336pxの場合　フォントサイズ以外
 min(1rem,calc(10vw/12)) */
body {
 background-color: #FFF8E3;
}
  .page_ttl {
 width:  min(35.7rem,calc(357vw/12));
 margin: 0 auto;
}
.miryoku_contents {
 position: relative;
 width: min(120rem, calc(1200vw / 12));
 margin: 0 auto;
}

.miryoku_img {
 width: min(36.6rem, calc(366vw / 12));
 position: absolute;
 top: min(28rem, calc(280vw / 12));
 right: min(15rem, calc(150vw / 12));
}


#charm {
 margin-bottom: min(20rem, calc(200vw / 12));
}
.charm_menu ul {
 display: flex;
 justify-content: space-between;
 flex-wrap: wrap;
 gap: min(2rem, calc(20vw / 12)) 0;
 margin-top: min(2.5rem, calc(25vw / 12));
}
.charm_menu ul li {
 text-align: justify;
 width: min(39rem, calc(390vw / 12));
 position: relative;
}
.charm_menu ul li .charm_menu_ttl {
 display: inline-block;
 min-width: min(23.5rem, calc(235vw / 12));
 position: relative;
 font-family: YakuHanJP, "M PLUS Rounded 1c", sans-serif;
 font-weight: 600;
 color: #e65046;
 text-align: center;
 font-size: 2.2rem;
 position: relative;
 padding: 0 min(1rem, calc(10vw / 12));
}
.charm_menu ul li .charm_menu_ttl::before,
.charm_menu ul li .charm_menu_ttl::after {
 content: "";
 width: min(1rem, calc(10vw / 12));
 height: min(2.8rem, calc(28vw / 12));
 background: url(../images/common/brackets.svg) no-repeat;
 background-size: cover;
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 left: 0;
}
.charm_menu ul li .charm_menu_ttl::after {
 transform: translateY(-50%) scale(-1, 1);
 left: auto;
 right: 0;
}
.charm_menu ul li p {
 width: min(21rem, calc(210vw / 12));
 font-size: 1.7rem;
 line-height: 1.76;
 letter-spacing: 0.05em;
}
.charm_menu ul li:nth-of-type(2) p {
 width: min(25rem, calc(250vw / 12));
}
.charm_menu ul li:nth-of-type(3) p {
 width: min(19rem, calc(190vw / 12));
}

.charm_menu_img {
 width: min(18rem, calc(180vw / 12));
 position: absolute;
 top: 0;
 right: 0;
 z-index: -1;
}

.info {
 margin-top: min(11rem, calc(110vw / 12));
}
.info_item {
 width: 100%;
 background-color: #fff;
 position: relative;
 padding: min(1rem, calc(10vw / 12)) 0;
 border-radius: min(2rem, calc(20vw / 12));
}
.info_ttl {
 width: min(70rem, calc(700vw / 12));
 color: #e65046;
 font-family: YakuHanJP, "M PLUS Rounded 1c", sans-serif;
 font-weight: 600;
 position: absolute;
 background: url(../images/miryoku/info_ttl_bg.svg) no-repeat;
 background-size: cover;
 left: 0;
 right: 0;
 margin: 0 auto;
 top: max(-3.5rem, calc(-35vw / 12));
 box-sizing: border-box;
}
.info_ttl span{
 letter-spacing: 0.5em;
 font-size: 2.6rem;
 padding-top: min(1.5rem, calc(15vw / 12));
 line-height: 1.23;
 display: block;
  width: min(28.7rem, calc(287vw / 12));
  margin: 0 auto;
  padding-left: min(1rem, calc(10vw / 12));
}

.info_item dl {
 width: min(70rem, calc(700vw / 12));
 margin: 0 auto;
 display: flex;
 align-items: center;
 border-top: #eb5f5c solid min(0.2rem, calc(2vw / 12));
 padding: min(2rem, calc(20vw / 12)) 0;
}
.info_item dl:first-of-type {
 border-top: none;
}
.info_item dt {
 width: min(10rem, calc(100vw / 12));
 font-size: 2rem;
 letter-spacing: 0.14em;
}
.info_item dd {
 width: min(59rem, calc(590vw / 12));
 font-size: 1.7rem;
 line-height: 1.76;
 text-align: justify;
}

.info .btn_02 {
 width: min(48rem, calc(480vw / 12));
 margin: min(8rem, calc(80vw / 12)) auto 0;
}
.info .btn_02 a {
 font-size: 2.3rem;
}
.info .btn a::before {
 content: "";
 background: url(../images/common/arrow.svg) no-repeat;
 background-size: cover;
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 right: min(1.5rem, calc(15vw / 12));
 transition: 0.4s;
 width: min(1.2rem, calc(12vw / 12));
 height: min(2.3rem, calc(23vw / 12));
}


#area {
 margin-bottom: min(20rem, calc(200vw / 12));
}
.area_map {
 position: relative;
 width: 100%;
 margin-left: auto;
 margin: min(7rem, calc(70vw / 12)) 0 min(12rem, calc(120vw / 12));
}
.area_map span {
 transition: 0.4s;
}
.area_map span:nth-of-type(1) {
 width: min(13.5rem, calc(135vw / 12));
 position: absolute;
 top: max(-3rem, calc(-30vw / 12));
 left: min(22rem, calc(220vw / 12));
}
.area_map span:nth-of-type(2) {
 width: min(13.5rem, calc(135vw / 12));
 position: absolute;
 top: min(33rem, calc(330vw / 12));
 left: max(-4rem, calc(-40vw / 12));
}
.area_map span:nth-of-type(3) {
 width: min(13.5rem, calc(135vw / 12));
 position: absolute;
 top: min(47.5rem, calc(475vw / 12));
 left: max(-3rem, calc(-30vw / 12));
}
.area_map span:nth-of-type(4) {
 width: min(15.2rem, calc(152vw / 12));
 position: absolute;
 top: min(2.5rem, calc(25vw / 12));
 left: min(38.5rem, calc(385vw / 12));
}
.area_map span:nth-of-type(5) {
 width: min(15.2rem, calc(152vw / 12));
 position: absolute;
 top: min(6.5rem, calc(65vw / 12));
 right: 0;
}

.area_map span:hover {
 transform: scale(1.1);
}

.area_item {
 margin-bottom: min(14rem, calc(140vw / 12));
}
.area_item:last-of-type {
 margin-bottom: 0;
}
.area_item_ttl {
 display: flex;
 align-items: center;
 font-size: 2rem;
 position: relative;
 letter-spacing: 0.04em;
 text-align: left;
 gap: 0 min(2.5rem, calc(25vw / 12));
 border-bottom: solid #000 min(0.2rem, calc(2vw / 12));
}

.area_item_ttl .ttl {
 font-size: 3rem;
}
#area_owari .area_item_ttl {
 border-color: #ff9a00;
}
#area_owari .area_item_ttl .ttl {
 color: #505050;
}
#area_ama .area_item_ttl {
 border-color: #8fc13c;
}
#area_ama .area_item_ttl .ttl {
 color: #505050;
}
#area_chita .area_item_ttl {
 border-color: #1cbbd7;
}
#area_chita .area_item_ttl .ttl {
 color: #505050;
}
#area_nishimikawa .area_item_ttl {
 border-color: #f283aa;
}
#area_nishimikawa .area_item_ttl .ttl {
 color: #505050;
}
#area_higashimikawa .area_item_ttl {
 border-color: #9e7fc1;
}
#area_higashimikawa .area_item_ttl .ttl {
 color: #505050;
}
.area_item_ttl .icon {
 width: min(23.5rem, calc(235vw / 12));
 position: absolute;
 bottom: 0;
 right: 0;
}
.area_item_txt {
 font-size: 1.7rem;
 letter-spacing: 0.1em;
 line-height: 1.76;
 text-align: justify;
 margin-top: min(1rem, calc(10vw / 12));
}

.area_item_flex {
 display: flex;
 flex-wrap: wrap;
 gap: min(3.5rem, calc(35vw / 12)) min(3.5rem, calc(35vw / 12));
 margin-top: min(2.5rem, calc(25vw / 12));
}
.area_item_box_top {
 width: 100%;
}
.area_item_box {
 width: min(23.5rem, calc(235vw / 12));
}
.area_item_box p {
 font-size: 1.7rem;
 letter-spacing: 0.1em;
 text-align: left;
}
.area_item_box_img {
 border-radius: min(1rem, calc(10vw / 12));
 overflow: hidden;
 position: relative;
}
.area_item_box_img img {
 transition: 0.4s;
}
.area_item_box_img span {
 width: min(3rem, calc(30vw / 12));
 height: min(3rem, calc(30vw / 12));
 border-radius: 50%;
 box-sizing: border-box;
 border: #fff solid min(0.2rem, calc(2vw / 12));
 background-color: #ff9a00;
 position: absolute;
 bottom: min(1rem, calc(10vw / 12));
 right: min(1rem, calc(10vw / 12));
}
#area_ama .area_item_box_img span {
 background-color: #8fc13c;
}
#area_chita .area_item_box_img span {
 background-color: #1cbbd7;
}
#area_nishimikawa .area_item_box_img span {
 background-color: #f283aa;
}
#area_higashimikawa .area_item_box_img span {
 background-color: #9e7fc1;
}
.area_item_box_img span::before,
.area_item_box_img span::after {
 content: "";
 width: min(1.8rem, calc(18vw / 12));
 height: min(0.3rem, calc(3vw / 12));
 background: #fff;
 position: absolute;
 top: 50%;
 transform: translateY(-50%);
 left: 0;
 right: 0;
 margin: 0 auto;
}
.area_item_box_img span::after {
 transform: translateY(-50%) rotate(90deg);
}

@media (hover: hover) and (pointer: fine) {
 .area_item_box_img:where(:any-link, :enabled, summary):hover img {
  transform: scale(1.1);
 }
}

#area_other {
 position: relative;
 z-index: 1;
}
.area_other_bg {
 width:  min(340.7rem, calc(3407vw / 12));
 position: absolute;
 bottom: min(20rem, calc(200vw / 12));
 right: max(-62rem, calc(-620vw / 12));
 z-index: -1;
}

.area_other_ttl {
 margin-bottom: min(4.5rem, calc(45vw / 12));
}
.area_other_txt {
 font-size: 1.65rem;
 line-height: 1.76;
 letter-spacing: 0.05em;
 margin-bottom: min(9rem, calc(90vw / 12));
}
.area_other_item dl {
 display: flex;
 justify-content: space-between;
 margin-bottom: min(9rem, calc(90vw / 12));
}
.area_other_item dl:last-of-type {
 margin-bottom: 0;
}
.area_other_item dt {
 width: min(16.7rem, calc(167vw / 12));
}
.area_other_item dd {
 width: min(59rem, calc(590vw / 12));
 font-size: 1.7rem;
 line-height: 1.76;
 text-align: justify;
 letter-spacing: 0.1em;
}
.area_other_item dd sup {
 font-size: 1.2rem;
}
.area_other_item dd .btn {
 margin-left: 0;
 width: min(27.5rem, calc(275vw / 12));
 margin-top: min(4rem, calc(40vw / 12));
}




.area_other_item:last-of-type {
 margin-top: min(15rem, calc(150vw / 12));
}
.area_other_item dl:last-of-type dd .btn {
 width: min(52rem, calc(520vw / 12));
}


.area_other_item:last-of-type dt {
 width: min(24.7rem, calc(247vw / 12));
}
.area_other_item:last-of-type dd {
 width: min(51rem, calc(510vw / 12));
}
.area_other_item:last-of-type dl:last-of-type dd .btn {
 width: min(44.5rem, calc(445vw / 12));
}

.area_modal {
 position: fixed;
 top: 0;
 width: 100%;
 height: 100vh;
 height: 100dvh;
 left: 0;
 z-index: 100;
 background-color: #ffffffe6;
 display: none;
 overflow: scroll;
}

.area_modal_bg {
 position: fixed;
 width: 100%;
 height: 100%;
 top: 0;
 left: 0;
 z-index: -1;
}
.area_modal_inner {
 width: min(60rem, calc(600vw / 12));
 border: #ff9a00 solid min(0.2rem, calc(2vw / 12));
 border-radius: min(2rem, calc(20vw / 12));
 background-color: #fff;
 margin: 0 auto;
 position: relative;
 z-index: 1;
 box-sizing: border-box;
 padding: min(6rem, calc(60vw / 12)) min(4.5rem, calc(45vw / 12)) min(3rem, calc(30vw / 12));
 position: relative;
 box-shadow: min(0.4rem, calc(4vw / 12)) min(0.4rem, calc(4vw / 12)) 0 #ff9a00;
 margin-top: min(10rem, calc(100vw / 12));
}
.area_ama .area_modal_inner {
 box-shadow: min(0.4rem, calc(4vw / 12)) min(0.4rem, calc(4vw / 12)) 0 #8fc13c;
 border-color: #8fc13c;
}
.area_chita .area_modal_inner {

  box-shadow: min(0.4rem, calc(4vw / 12)) min(0.4rem, calc(4vw / 12)) 0 #1cbbd7;
 border-color: #1cbbd7;
}
.area_nishimikawa .area_modal_inner {
 box-shadow: min(0.4rem, calc(4vw / 12)) min(0.4rem, calc(4vw / 12)) 0 #f283aa;
 border-color: #f283aa;
}
.area_higashimikawa .area_modal_inner {
 box-shadow: min(0.4rem, calc(4vw / 12)) min(0.4rem, calc(4vw / 12)) 0 #9e7fc1;
 border-color: #9e7fc1;
}
.area_modal_place {
 width: min(20.5rem, calc(205vw / 12));
 font-size: 2.2rem;
 letter-spacing: 0.04em;
 padding: min(3.5rem, calc(35vw / 12)) 0;
 position: absolute;
 top: max(-1rem, calc(-10vw / 12));
 left: max(-1.5rem, calc(-15vw / 12));
 color: #505050;
 background: url(../images/miryoku/modal_place_01.svg) no-repeat;
 background-size: cover;
}
.area_ama .area_modal_place {
 background: url(../images/miryoku/modal_place_02.svg) no-repeat;
 background-size: cover;
}
.area_chita .area_modal_place {
 background: url(../images/miryoku/modal_place_03.svg) no-repeat;
 background-size: cover;
}
.area_nishimikawa .area_modal_place {
 background: url(../images/miryoku/modal_place_04.svg) no-repeat;
 background-size: cover;
}
.area_higashimikawa .area_modal_place {
 background: url(../images/miryoku/modal_place_05.svg) no-repeat;
 background-size: cover;
}
.area_modal_img {
 overflow: hidden;
 border-radius: min(1rem, calc(10vw / 12));
 height: min(28.5rem, calc(285vw / 12));
}

.area_modal_ttl {
 font-size: 1.9rem;
 letter-spacing: 0.1em;
 text-align: justify;
 color: #505050;
 line-height: 1.76;
 display: flex;
 justify-content: space-between;
 align-items: center;
 margin: min(2.5rem, calc(25vw / 12)) 0 min(1rem, calc(10vw / 12));
}
.area_modal_ttl span {
 background: #FFF;
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 90%, rgba(255, 154, 0, 1) 90%, rgba(255, 154, 0, 1) 100%);
}
.area_ama .area_modal_ttl span{
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 90%,#8fc13c 90%,#8fc13c 100%);
}
.area_chita .area_modal_ttl span{
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 90%,#1cbbd7 90%,#1cbbd7 100%);
}
.area_nishimikawa .area_modal_ttl span{
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 90%,#f283aa 90%,#f283aa 100%);
}
.area_higashimikawa .area_modal_ttl span{
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 90%,#9e7fc1 90%,#9e7fc1 100%);
}
.area_modal_ttl p {
 width: min(28rem, calc(280vw / 12));
 line-height: 1.4;
}
.area_modal_ttl a {
 display: block;
 width: min(22rem, calc(220vw / 12));
 color: #fff;
 font-size: 1.5rem;
 background-color: #a7699a;
 border-radius: min(1.5rem, calc(15vw / 12));
 box-sizing: border-box;
 border: min(0.2rem, calc(2vw / 12)) solid #a7699a;
 line-height: 1.8;
 letter-spacing: 0.04em;
 text-align: center;
 position: relative;
 display: flex;
 align-items: center;
 gap: 0 min(0.5rem, calc(5vw / 12));
 justify-content: center;
}
.area_modal_ttl a::after {
 content: "";
 width: min(1.5rem, calc(15vw / 12));
 height: min(1.6rem, calc(16vw / 12));
 background: url(../images/common/blank_icon.svg) no-repeat;
 background-size: cover;
 filter: brightness(0) invert(1);
 transition: 0.4s;
}
.area_modal_txt {
 text-align: justify;
 font-size: 1.5rem;
 line-height: 1.73;
 letter-spacing: 0.1em;
}

@media (hover: hover) and (pointer: fine) {
 .area_modal_ttl a:where(:any-link, :enabled, summary):hover {
  background-color: #fff;
  color: #505050;
 }
 .area_modal_ttl a:where(:any-link, :enabled, summary):hover::after {
  filter: brightness(1) invert(0);
 }
}

.close_btn {
 width: min(2.8rem, calc(28vw / 12));
 height: min(2.8rem, calc(28vw / 12));
 position: absolute;
 top: min(2rem, calc(20vw / 12));
 right: min(3.5rem, calc(35vw / 12));
 transform: rotate(45deg);
}
.close_btn::before {
 content: '';
 width: 100%;
 box-sizing: border-box;
 border: #505050 solid  min(.1rem, calc(1vw / 12));
 position: absolute;
 top: 0;
 left: 0;
}
.close_btn::after {
 content: '';
 width: 100%;
 box-sizing: border-box;
 border: #505050 solid  min(.1rem, calc(1vw / 12));
 position: absolute;
 top: 0;
 left: 0;
 transform: rotate(90deg);
}


@media screen and (max-width: 767px) {

   .page_ttl {
 width: 20.7rem;
}
  .page_top {
margin-top:7.5rem;
}
 .miryoku_contents {
  width: 100%;
 }

 .miryoku_img {
  width: 24.7rem;
  margin: 4rem auto 0;
  position: static;
 }


 #charm {
  margin-bottom: 10rem
 }
 .charm_ttl {
  width: 32rem;
  margin: 0 auto;
 }
 .charm_menu ul {
  flex-direction: column;
  gap:3rem 0;
  margin-top: 2rem
 }
 .charm_menu ul li {
  width: 100%;
 }
 .charm_menu ul li .charm_menu_ttl {
  min-width: 20rem;
  font-size: 1.6rem;
  padding: 0 ;
 }
 .charm_menu ul li .charm_menu_ttl::before,
 .charm_menu ul li .charm_menu_ttl::after {
  width:.7rem;
  height: 2rem;
 }
 .charm_menu ul li p {
  width: 20rem;
  font-size: 1.3rem;
 }
 .charm_menu ul li:nth-of-type(2) p {
  width:20rem;
 }
 .charm_menu ul li:nth-of-type(3) p {
  width:20rem;
 }

 .charm_menu_img {
  width: 14rem;
  position: absolute;
  top: 0;
  right: -2rem;
  z-index: -1;
 }

 .info {
  margin-top:8rem;
 }
 .info_item {
  padding: .5rem 0 0;
  border-radius:2rem;
 }
 .info_ttl {
  width: 27.5rem;
  top: -1.6rem;
  box-sizing: border-box;
   background: url(../images/miryoku/info_ttl_bg_sp.svg) no-repeat;
 background-size: cover;
 }
 .info_ttl span{
  width: 13.5rem;
  font-size: 1.6rem;
  line-height: 1;
  padding: .8rem 0 0;
  box-sizing: border-box;
  padding-left: 0.5rem;
}

 .info_item dl {
  width: 27.5rem;
  border-top: #eb5f5c solid .1rem;
  padding:1.8rem 0;
 }
 .info_item dt {
  width: 7rem;
  font-size: 1.6rem;
 }
 .info_item dd {
  width: 20rem;
  font-size: 1.3rem;
 }

 .info .btn_02 {
  width: 32.5rem;
  margin: 4rem auto 0;
 }
 .info .btn_02 a {
  font-size: 1.7rem;
 }
 .info .btn a::before{
 width: 1.1rem;
 height:2.2rem;
 right: 1rem;
}

 #area {
  margin-bottom: 10rem;
 }
 .area_map {
  position: relative;
  width: 100%;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1rem .5rem;
  margin: 2rem 0 0;
  padding-bottom: 43rem;
 }
 .area_map_img {
  width: 36.2rem;
  left: 50%;
  transform: translateX(-50%);
  position: absolute;
  top: 13rem;

 }
 .area_map span {
  transition: 0.4s;
 }
 .area_map span:nth-of-type(1) {
  width:10.5rem;
  position: static;
 }
 .area_map span:nth-of-type(2) {
  width:10.5rem;
  position: static;
 }
 .area_map span:nth-of-type(3) {
  width:10.5rem;
  position: static;
 }
 .area_map span:nth-of-type(4) {
  width: 12rem;
  position: static;
 }
 .area_map span:nth-of-type(5) {
  width: 12rem;
  position: static;
 }

 .area_map span:hover {
  transform: scale(1);
 }

 .area_item {
  margin-bottom:6rem;
 }
 .area_item_ttl {
  font-size: 1.1rem;
  line-height: 1.47;
  gap: 0 1rem;
  border-bottom: solid #000 .1rem;
  padding-bottom: 0.5rem;
 }

 .area_item_ttl .ttl {
  font-size: 1.6rem;
 }

 .area_item_ttl .icon {
  width: 12.6rem;
 }
 .area_item_txt {
  font-size: 1.3rem;
  margin-top:1rem;
 }

 .area_item_flex {
  gap: 2rem 1.5rem;
  margin-top: 5rem;
 }
 .area_item_box {
  width:9.8rem;
 }
 .area_item_box p {
  font-size: 1.3rem;
  line-height: 1.4;
 }
 .area_item_box_img {
  border-radius:.4rem;
 }
 .area_item_box_img span {
  width: 1.3rem;
  height: 1.3rem;
  border: #fff solid .1rem;
  bottom: .5rem;
  right: .5rem;
 }

 .area_item_box_img span::before,
 .area_item_box_img span::after {
  width: .7rem;
  height:.1rem;
 }
 .area_other_bg {
 width:  100%;
 bottom: 7rem;
 right: 0;
}
 .area_other_ttl {
  margin-bottom: 2.5rem;
 }
 .area_other_txt {
  font-size: 1.3rem;
  margin-bottom: 7rem;
 }
 .area_other_item dl {
  flex-direction: column;
  margin-bottom: 7.5rem;
 }
 .area_other_item dt {
  width:15rem;
  margin: 0 auto 2rem;
 }
 .area_other_item dd {
  width: 100%;
  font-size: 1.3rem;
 }
 .area_other_item dd sup {
 font-size: 1rem;
}
 .area_other_item dd .btn {
  width: 22.5rem;
  margin: 5.5rem auto 0;
 }
 .area_other_item dd .btn a {
  border-radius: .8rem;
  overflow: hidden;
 }

 .area_other_item:last-of-type {
  margin-top: 10rem;
 }
 .area_other_item dl:last-of-type dd .btn {
  width: 28rem;
 }
 .area_other_item dl:last-of-type dd .btn a {
  line-height: 1.4;
  text-align: center;
 }
 .area_other_item dl:last-of-type dd .btn a p{
  padding: 0.4rem 0;
 }



 .area_other_item:last-of-type dt {
  width: 22.2rem;
 }
 .area_other_item:last-of-type dd {
  width:100%;
 }
 .area_other_item:last-of-type dl:last-of-type dd .btn {
  width: 22.5rem;
 }


 .area_modal_inner {
  width:32.3rem;
  border: #ff9a00 solid.1rem;
  border-radius:1rem;
  padding: 3.5rem 2.1rem 2rem;
  box-shadow: .2rem .2rem 0 #ff9a00;
  margin-top: 6rem;
  margin-bottom: 6rem;
 }
 .area_ama .area_modal_inner {
  box-shadow: .2rem .2rem 0 #8fc13c;
  border-color: #8fc13c;
 }
 .area_chita .area_modal_inner {
  box-shadow: .2rem .2rem 0 #8fc13c;
  border-color: #8fc13c;
    box-shadow: .2rem .2rem 0 #1cbbd7;
  border-color: #1cbbd7;
 }
 .area_nishimikawa .area_modal_inner {
  box-shadow: .2rem .2rem 0 #f283aa;
  border-color: #f283aa;
 }
 .area_higashimikawa .area_modal_inner {
  box-shadow: .2rem .2rem 0 #9e7fc1;
  border-color: #9e7fc1;
 }

 .area_modal_img {
 border-radius:.5rem;
 height: 15.7rem;
}
 .area_modal_place {
  width: 11.1rem;
  font-size: 1.5rem;
  padding:1.6rem 0;
  top: -.5rem;
  left:-0.7rem;
 }
 .area_modal_img {
  border-radius:.5rem;
 }
 .area_modal_ttl {
  font-size: 1.5rem;
  margin:1rem 0 ;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem 0;
 }
 .area_modal_ttl p {
  width:100%;
 }
 .area_modal_ttl a {
  width:16rem;
  font-size: 1.1rem;
  border-radius:1.1rem;
  border:none;
  line-height: 2;
  gap: 0 .5rem;
 }
 .area_modal_ttl a::after {
  width: 1rem;
  height:1.1rem;
 }
 .area_modal_txt {
  font-size: 1.3rem;
 }

 .close_btn {
 width: 2rem;
 height: 2rem;
 top: 1rem;
 right: 1.5rem;
}
.close_btn::before {
 border: #505050 solid  .1rem;
}
.close_btn::after {
 border: #505050 solid  .1rem;
}

}

.cloud_miryoku {
 position: absolute;
 left: 0;
 right: 0;
 margin: 0 auto;
 top: 0;
 z-index: -2;
}
.cloud_dot {
 z-index: -1;
}

.cloud_miryoku_item {
 position: absolute;
 top: 0;
 left: 0;
 z-index: -5;
 width:100%;
 height: 100%;
 left: 0;
 right: 0;
 margin: 0 auto;
 overflow: hidden;
}

.cloud_miryoku_01 {
 width: min(17.4rem, calc(174vw / 12));
 left: max(-91rem, calc(-910vw / 12));
 top: min(108rem, calc(1080vw / 12));
}
.cloud_miryoku_02 {
 width: min(18.4rem, calc(183vw / 12));
 left: max(-106rem, calc(-1060vw / 12));
 top: min(114rem, calc(1140vw / 12));
}
.cloud_miryoku_03 {
 width: min(28rem, calc(260vw / 12));
 left: max(-101rem, calc(-1010vw / 12));
 top: min(164rem, calc(1640vw / 12));
}
.cloud_miryoku_04 {
 width: min(24rem, calc(240vw / 12));
 left: max(-70rem, calc(-700vw / 12));
 top: min(173rem, calc(1730vw / 12));
}
.cloud_miryoku_05 {
 width: min(35.5rem, calc(355vw / 12));
 left: max(-120rem, calc(-1200vw / 12));
 top: min(231rem, calc(2310vw / 12));
}
.cloud_miryoku_06 {
 width: min(22rem, calc(220vw / 12));
 left: max(-118rem, calc(-1180vw / 12));
 top: min(247rem, calc(2470vw / 12));
}
.cloud_miryoku_07 {
 width: min(12.2rem, calc(122vw / 12));
 left: max(-82rem, calc(-820vw / 12));
 top: min(331rem, calc(3310vw / 12));
}
.cloud_miryoku_08 {
 width: min(22rem, calc(220vw / 12));
 left: max(-105rem, calc(-1050vw / 12));
 top: min(333rem, calc(3330vw / 12));
}
.cloud_miryoku_09 {
 width: min(35.4rem, calc(354vw / 12));
 left: max(-101rem, calc(-1010vw / 12));
 top: min(396rem, calc(3960vw / 12));
}
.cloud_miryoku_10 {
 width: min(22rem, calc(220vw / 12));
 left: max(-80rem, calc(-800vw / 12));
 top: min(412rem, calc(4120vw / 12));
}
.cloud_miryoku_11 {
 width: min(30rem, calc(300vw / 12));
 left: max(-96rem, calc(-960vw / 12));
 top: min(505.5rem, calc(5055vw / 12));
}
.cloud_miryoku_12 {
 width: min(18.6rem, calc(186vw / 12));
 left: max(-70rem, calc(-700vw / 12));
 top: min(498.5rem, calc(4985vw / 12));
}
.cloud_miryoku_13 {
 width: min(12.2rem, calc(122vw / 12));
 left: max(-102rem, calc(-1020vw / 12));
 top: min(615rem, calc(6150vw / 12));
}
.cloud_miryoku_14 {
 width: min(22rem, calc(220vw / 12));
 left: max(-80rem, calc(-800vw / 12));
 top: min(628rem, calc(6280vw / 12));
}
.cloud_miryoku_15 {
 width: min(20.5rem, calc(205vw / 12));
 left: max(-60rem, calc(-600vw / 12));
 top: min(708rem, calc(7080vw / 12));
}
.cloud_miryoku_16 {
 width: min(18.6rem, calc(186vw / 12));
 left: max(-85rem, calc(-850vw / 12));
 top: min(749rem, calc(7490vw / 12));
}
.cloud_miryoku_17 {
 width: min(30rem, calc(300vw / 12));
 left: max(-110rem, calc(-1100vw / 12));
 top: min(752.5rem, calc(7525vw / 12));
 z-index: -3;
}
.cloud_miryoku_18 {
 width: min(22rem, calc(220vw / 12));
 left: max(-93rem, calc(-930vw / 12));
 top: min(878rem, calc(8780vw / 12));
}
.cloud_miryoku_19 {
 width: min(14rem, calc(140vw / 12));
 left: max(-80rem, calc(-800vw / 12));
 top: min(873rem, calc(8730vw / 12));
}

.cloud_miryoku_20 {
 width: min(22rem, calc(220vw / 12));
 right: max(-121rem, calc(-1210vw / 12));
 top: min(132rem, calc(1320vw / 12));
}
.cloud_miryoku_21 {
 width: min(22rem, calc(220vw / 12));
 right: max(-110rem, calc(-1100vw / 12));
 top: min(140rem, calc(1400vw / 12));
}

.cloud_miryoku_22 {
 width: min(19.5rem, calc(195vw / 12));
 right: max(-98rem, calc(-980vw / 12));
 top: min(216.5rem, calc(2165vw / 12));
}
.cloud_miryoku_23 {
 width: min(17rem, calc(170vw / 12));
 right: max(-112rem, calc(-1120vw / 12));
 top: min(211rem, calc(2110vw / 12));
}
.cloud_miryoku_24 {
 width: min(25rem, calc(250vw / 12));
 right: max(-110rem, calc(-1100vw / 12));
 top: min(350rem, calc(3500vw / 12));
}
.cloud_miryoku_25 {
 width: min(15.3rem, calc(153vw / 12));
 right: max(-112rem, calc(-1120vw / 12));
 top: min(358.5rem, calc(3585vw / 12));
}
.cloud_miryoku_26 {
 width: min(12.2rem, calc(122vw / 12));
 right: max(-113rem, calc(-1130vw / 12));
 top: min(520rem, calc(5200vw / 12));
}

.cloud_miryoku_27 {
 width: min(12.2rem, calc(122vw / 12));
 right: max(-60rem, calc(-600vw / 12));
 top: min(591rem, calc(5910vw / 12));
}
.cloud_miryoku_28 {
 width: min(19.7rem, calc(197vw / 12));
 right: max(-80rem, calc(-800vw / 12));
 top: min(583rem, calc(5830vw / 12));
}
.cloud_miryoku_29 {
 width: min(19.5rem, calc(195vw / 12));
 right: max(-99rem, calc(-990vw / 12));
 top: min(708.5rem, calc(7815vw / 12));
}
.cloud_miryoku_30 {
 width: min(17rem, calc(170vw / 12));
 right: max(-115rem, calc(-1150vw / 12));
 top: min(703.5rem, calc(7035vw / 12));
}
.cloud_miryoku_31 {
 width: min(19.5rem, calc(195vw / 12));
 right: max(-75rem, calc(-750vw / 12));
 top: min(820rem, calc(8200vw / 12));
}
.cloud_miryoku_32 {
 width: min(23.5rem, calc(235vw / 12));
 right: max(-110rem, calc(-1100vw / 12));
 top: min(909rem, calc(9090vw / 12));
}

@media screen and (max-width: 767px) {
 .cloud_miryoku {
  left: auto;
  right: auto;
  margin: 0;
 }
 .cloud_miryoku_01 {
  width: 5.2rem;
  left: 3.6rem;
  top: 66.8rem;
 }
 .cloud_miryoku_02 {
  width: 7.2rem;
  left: -1.5rem;
  top: 68.5rem;
 }
 .cloud_miryoku_03 {
  width: 5.5rem;
  left: 1.7rem;
  top: 250rem;
 }
 .cloud_miryoku_04 {
  width: 6.5rem;
  left: 4rem;
  top: 252rem;
 }
 .cloud_miryoku_05 {
  width: 9rem;
  left: -3.2rem;
  top: 306rem;
 }
 .cloud_miryoku_06 {
  width: 7.4rem;
  left: -4rem;
  top: 310rem;
 }
 .cloud_miryoku_07 {
  width: 4.4rem;
  left: 23rem;
  top: 409rem;
 }
 .cloud_miryoku_08 {
  width: 7.4rem;
  left:0.5rem;
  top: 405rem;
 }
 .cloud_miryoku_09 {
  width: 5.5rem;
  left: -.5rem;
  top: 641rem;
 }
 .cloud_miryoku_20 {
  width: 9.1rem;
  right: -4.5rem;
  top: 160rem;
 }
 .cloud_miryoku_21 {
  width: 7.4rem;
  right: -1.5rem;
  top: 164rem;
 }
 .cloud_miryoku_22 {
  width: 4.4rem;
  right: 1.5rem;
  top: 276rem;
 }
 .cloud_miryoku_23 {
  width: 8.6rem;
  right: 4.7rem;
  top: 277rem;
  z-index: -3;
 }
 .cloud_miryoku_24 {
  width: 4.4rem;
  right: 10.5rem;
  top: 335rem;
 }
 .cloud_miryoku_25 {
  width: 8.6rem;
  right: 4.5rem;
  top: 338rem;
 }
 .cloud_miryoku_26 {
  width: 8.1rem;
  right: 1.5rem;
  top: 458rem;
 }
 .cloud_miryoku_28 {
  width: 7.4rem;
  right: 6.5rem;
  top: 456rem;
 }
 .cloud_miryoku_29 {
  width: 5.2rem;
  right: 10.5rem;
  top: 518rem;
 }
 .cloud_miryoku_30 {
  width: 7.2rem;
  right: 13.5rem;
  top: 520rem;
 }
 .cloud_miryoku_31 {
  width: 9.1rem;
  right:-.5rem;
  top: 524rem;
 }
 .cloud_miryoku_32 {
  width: 7.4rem;
  right:8.5rem;
  top: 585rem;
 }
 .cloud_miryoku_11 {
  width: 5.5rem;
  left: 18rem;
  top: 583rem;

 }
 .cloud_miryoku_13 {
  width: 9.1rem;
  left: 27rem;
  top: 631rem;

 }
 .cloud_miryoku_14 {
  width: 6.5rem;
  left: 24.8rem;
  top: 634rem;

 }
}