.mv {
    position: relative;
}
#pankuzu {
    position: absolute;
    top: 0;
    left: 5%;
    /* color: #fff; */
}
.p-location {
    background-color: #fff;
    background-image: url('../images/top/bg_blue.webp');
    background-size: cover;
    background-position: center;
    padding-bottom: 80px;
}
.p-location__lead {
    padding: 60px 0;
    color: #fff;
    font-size: 140%;
}
.p-location__map {
    margin-bottom: 60px;
}
.p-location__category {
    color: #fff;
    text-align: left;
    font-size: 40px;
    border-bottom: 1px solid #fff;
    margin-bottom: 20px;
}
.p-location__item-wrap {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    gap: 30px;
    margin-bottom: 30px;
}
.p-location__item-wrap li {
    width: calc((100% - 60px) / 3);
}
.notes-area {
    margin: 0 auto;
}
@media screen and (max-width: 768px) {
    .title-area {
        margin-bottom: 0 !important;
    }
    .p-location__lead {
        text-align: justify;
    }
    .p-location__item-wrap li {
        width: calc((100% - 30px) / 2);
    }
}




.location-li {
    color: #fff;
    margin-bottom: 60px;
}
.location-li-item {}

.location-li > div:last-child .location-li-item:last-child {margin-bottom: 0;}
.location-li-item-header {font-size:116%;letter-spacing:.2em;margin:0 0 15px;color: #ef8200;}

.location-li-item > p {margin: 0 0 5px;font-size: 85%;}
.location-li-item ul {list-style-type:none;margin:0;padding:0;}
.location-li-item ul li {position:relative;margin-bottom:10px;line-height:1.5;display:-webkit-flex;display:-moz-flex;display:-ms-flex;display:-o-flex;display:flex;-ms-flex-wrap:wrap;-webkit-flex-wrap:wrap;flex-wrap:wrap;justify-content:space-between;-webkit-align-items:flex-end;-ms-align-items:flex-end;align-items:flex-end;font-size: 85%;}
.location-li-item ul li:last-child {margin-bottom: 0;}
.location-li-item ul li span {position:relative;z-index:1;display:inline-block;padding-right:0px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;height:100%;text-align: left;}
.location-li-item ul li span span.ate {
    font-size: 80%;
    /* display: inline-block; */
}
.location-li-item ul li > span:first-child {width: calc(100% - 12.5em);position: relative;overflow: hidden;}
.location-li-item ul li.subItem > span:first-child {padding-left: 1em;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
.location-li-item ul li > span:first-child::after {content: '\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65\FF65';display: inline-block;position: absolute;margin: 0 5px;}

.location-li-item ul li > span:last-child {position:absolute;padding-right:0;right:0;width:12.5em;white-space:nowrap;display:-webkit-flex;display:-moz-flex;display:-ms-flex;display:-o-flex;display:flex;-ms-flex-wrap:wrap;-webkit-flex-wrap:wrap;flex-wrap:wrap;justify-content:space-between;-webkit-align-items:space-between;-ms-align-items:flex-end;align-items:flex-end;bottom: 0;}
.location-li-item ul li span i {font-style: normal;display: inline-block;}
.location-li-item ul li span i:last-child {
    width: 3.6rem;
    text-align: right;
}
.location-li-item ul li > span:last-child span {
    display: flex;
    justify-content: flex-end;
}
.location-li-item ul li p{width: 100%;padding: 0;margin: 0;line-height: 1.8;text-align: left;}
.location-box .note-box{text-align: left;width: 100%;margin: 0;}
@media print, screen and (min-width: 670px) { /*670px*/

.location-li-item {margin-bottom: 50px;}

.location-li > div .location-li-item:last-child {margin-bottom: 0;}
.location-li-item-header {font-weight: bold;margin: 0 0 15px;line-height: 1.5;font-size: 138.5%;}
.location-li-item ul li,.location-li-item p {font-size: 100%;}
}

@media screen and (max-width: 810px) {/*スマホ設定*/
.location-li {
    gap: 10px;
}
.life-information h4{margin-top: 30px;}
.life-information h4 img{height: 30px;object-fit: cover;}
.location-li .col2{width: 100%;}
.location-li-item ul li{font-size: 11px!important;}
}


/* .hero{
  position: relative;
  overflow: hidden;
}

.hero__base img{
  display:block;
  width:100%;
  height:auto;
}


.hero__pillar{
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
  transition:opacity 1.2s;
  background:url("../images/location/light.webp") no-repeat center / cover;
  mix-blend-mode: screen;
  width: 12%;
  left: 31%;
  bottom: 35%;
}

.hero__spark{
  position:absolute;
  left: 27%;
  bottom: 23%;
  width:21.8666%;
  height:84%;
  pointer-events:none;
  opacity:0;
  transition:opacity 1.2s;
  z-index:2;
}

.hero__sparkInner{
  width:100%;
  height:500%;            
  background:url("../images/location/masktag.webp") repeat-y center top / 100%;
  transform:translateY(50%);  
} */
.hero{
  position: relative;
  overflow: hidden;
  isolation: isolate; /* ★ blend-mode をhero内に閉じる */
  z-index: 0;         /* ★ 外の要素と喧嘩しにくくする */
}
/* 空撮は一番下に固定 */
.hero__base{
  position: relative;
  z-index: 0;
}
.hero__base img{ display:block; width:100%; height:auto; }

/* 共通：上に重ねるレイヤーは最初は消す */
.hero__pillar,
.hero__imgA,
.hero__spark,
.hero__imgB{
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
  transition:opacity 1.2s;
}

/* ==== 光の柱 ==== */
.hero__pillar{
  z-index:2;
  background:url("../images/location/light.webp") no-repeat center / cover;
  mix-blend-mode: screen;
  width: 12%;
  left: 31%;
  bottom: 35%;
}

/* ① 柱直後に出す画像（位置は例。柱位置に合わせて調整） */
.hero__imgA{
  z-index:3;
}
.hero__imgA img{
  position:absolute;
  /* 例：柱付近に置く（必要に応じて変更） */
  left: 36.4%;
  top: 18%;
  width: 1.4%;
  height: auto;
}

/* ==== スパーク（柱に重ねる縦帯） ==== */
.hero__spark{
  z-index:4;
  left: 27%;
  bottom: 46%;
  width:21.8666%;
  height:84%;
  pointer-events:none;
  overflow:hidden; /* ★中身の移動を隠す */

  -webkit-mask-image: linear-gradient(to bottom, transparent 20%, #000 70%, #000 70%, transparent 80%);
  mask-image: linear-gradient(to bottom, transparent 20%, #000 70%, #000 70%, transparent 80%);
}

.hero__sparkInner{
  width:100%;
  height:120%; /* “流れ続ける感” */
  background:url("../images/location/masktag.webp") repeat-y center top / 100%;
  transform:translateY(0%);
}

@keyframes sparkUp{
  from { transform: translateY(0%); }
  to   { transform: translateY(-83%); }
}
@keyframes sparkLoop{
  from { transform: translateY(0); }
  to   { transform: translateY(-120%); } /* ★高さ分だけ上へ */
}

/* ② 左右中央に出す画像（画面中央） */
.hero__imgB{
  z-index:5;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero__imgB img{
    width: min(500px, 40vw);
    height: auto;
}

/* ===== 段階的にON ===== */
.hero.is-pillar .hero__pillar{ opacity:1; }          /* 柱表示 */
.hero.is-a      .hero__imgA{ opacity:1; }            /* 画像A */
.hero.is-spark  .hero__spark{ opacity:1; }           /* スパーク表示 */
.hero.is-spark  .hero__sparkInner{
  animation: sparkUp 12s linear infinite;             /* 速さは5sのまま */
}
.hero.is-spark  .hero__sparkInner{
  animation: sparkLoop 5s linear infinite;             /* 速さは5sのまま */
}
.hero.is-b      .hero__imgB{ opacity:1; }            /* 画像B */

/* 任意：SP調整（元tab相当） */
@media (max-width:810px){
  .hero__spark{ width:14.1458%; left: 31%; }
  .hero__imgA img{ right:38.5%;  }
  .hero__imgB img {
    width: min(500px, 60vw);
    }
}