@charset "utf-8";
.sp {
  display: none;
}
.preload * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}
input[type="submit"] {
  -webkit-appearance: none;
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
*:focus {
  outline: none;
}
html {
}
body {
  font-size: 16px;
  font-family: 'fot-tsukuardgothic-std', 'M PLUS Rounded 1c', 'ヒラギノ丸ゴ ProN W4', 'Hiragino Maru Gothic ProN', "Meiryo", "メイリオ", "MS Pゴシック", sans-serif;
  text-align: left;
  -webkit-text-size-adjust: 100%;
  width: 100%;
  word-wrap: break-word;
  line-height: 1.5;
  color: #1A1A1A;
  background-color: #fff;
  padding-top:465px;
  min-width: 960px;
  transition: all 0.5s 0.5s ease-in-out;
}
body.scrolled {
  padding-top:285px;
}
p, dt, dd, li, th, td {
  line-height: 1.5;
}
/*clearfix */
.clearfix:after {
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
  min-height: 0px;
}
h1 {
  margin: 0;
  padding: 0;
  -webkit-margin-before: 0em;
  -webkit-margin-after: 0em;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
  display: inherit;
}
h1, h2, h3, h4, h5, h6 {
  margin: 0;
  font-family: inherit;
  font-weight: inherit;
  line-height: inherit;
  color: inherit;
  text-rendering: inherit;
}

img {
  border: none;
  vertical-align: top;
  height: auto;
  max-width:100%;
}
ul, ol {
  margin: 0;
  padding: 0;
  list-style: none;
}
li {
  margin: 0px;
  padding: 0px;
}
a {
  color: inherit;
  text-decoration: none;
}
.hover {
  cursor: pointer;
  transition: all 0.2s;
}
.hover:hover {
  opacity: 0.7;
}
.fl {
  float: left;
}
.fr {
  float: right;
}
.bold {
  font-weight: bold;
}
.center {
  text-align: center!important;
}
table {
  border-collapse: collapse;
}
iframe {
  border-top-style: none;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
}
.anchor{
  /*ページ内リンクの位置調整*/
  display: block;
  padding-top: 200px;
  margin-top: -200px;
}

header {
  position: absolute;
  top:0;
  left:0;
  width:100%;
  min-width:767px;
  z-index: 9999;
  height: 85px;
  background-color: #fff;
}
.head01 {
  float: left;
  padding-top: 30px;
  padding-left: 55px;
  font-size: 18px;
  font-weight: bold;
}
.head01 a {
  display: block;
  position: relative;
}
.head01 a::after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: -15px;
  margin-top: -5px;
  width: 7px;
  height: 7px;
  border-top: 1px solid #1a1a1a;
  border-right: 1px solid #1a1a1a;
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
}
.head02 {
  position: relative;
  padding-top: 30px;
  padding-bottom: 15px;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 320px;
  color: #fff;
  background-color: #1A1A1A;
  text-align: center;
  font-weight: bold;
  transition: all 0.5s ease-in-out, transform 0;
}
.head02.scrolled {
  top: 95px;
  width: 440px;
  padding-top:3px;
  height:35px;
}
.head02.fixed {
  position: fixed;
  transform: translate(-50%,-85px);
}
@media all and (-ms-high-contrast: none){
  .head02.scrolled {
    padding-top:10px;
  }
}
.head03 {
  width:51px;
  margin:auto;
  margin-bottom: 6px;
  transition: all 0.2s ease-in-out;
}
.head04 {
  margin-bottom: 10px;
  font-size: 20px;
  transition: all 0.2s ease-in-out;
}
.head04 span {
  font-size: 18px;
}
.head05 {
  transition: all 0.2s ease-in-out;
}
.head02.scrolled .head03,
.head02.scrolled .head04,
.head02.scrolled .head05 {
  display: none;
}
.head06 {
  float: right;
  padding-top: 30px;
  padding-right: 90px;
}
.head06 img {
	width: 173px;
}
.head07 {
  visibility: hidden;
  font-size: 1.2rem;
  font-weight:bold;
  color: #fff;
  opacity:0;
  height:0;
  transition: all 0.5s 0.3s ease-in-out;
}
.head02.scrolled .head07 {
  visibility: visible;
  opacity:1;
  height:auto;
}

.rmap {
  position: absolute;
  top:85px;
  left:0;
  width:100%;
  min-width:767px;
  height:380px;
  background:url(../img/rmap_bg.webp) center center / 27px 26px repeat;
  z-index: 999;
  overflow: hidden;
  transition: height 0.5s 0.5s ease-in-out;
}
.rmap.scrolled {
  height:200px;
}
.rmap.fixed {
  position: fixed;
  top:0;
}
.rmap .inner {
  position: relative;
  width:800px;
  height:100%;
  margin:0 auto;
}
.rmap .jpn {
  position: absolute;
  top:34.21%;
  left:50%;
  transform: translateX(-50%);
  width:32.5%;
  height:65.78%;
  background:url(../img/rmap_jpn.webp) center center / contain no-repeat;
  z-index:10;
  transition:all 0.5s 0.5s ease-in-out;
}
.rmap.scrolled .jpn {
  visibility: hidden;
  opacity:0;
  width:100%;
  height:100%;
  top:20%;
}
.rmap .flag {
  position: absolute;
  top:53.42%;
  left:53.75%;
  width:2.5%;
  height:11.31%;
  background:url(../img/rmap_flag.webp) center center / contain no-repeat;
  z-index:20;
  transition: all 0.2s ease-in-out;
}
.rmap.scrolled .flag {
  visibility: hidden;
  opacity:0;
}
.rmap .ken {
  position: absolute;
  top:56.57%;
  left:56.25%;
  font-size: min(4vw,2rem);/*32px*/
  font-weight:bold;
  z-index:20;
  transition: all 0.2s ease-in-out;
}
.rmap.scrolled .ken {
  visibility: hidden;
  opacity:0;
}
.rmap [class^="wave0"] {
  position: absolute;
  display: block;
  width:9%;
  height:4.5%;
  background:url(../img/rmap_wave.webp) center center / contain no-repeat;
  transition: all 0.5s 0.5s ease-in-out;
}
.rmap.scrolled [class^="wave0"] {
  visibility: hidden;
  opacity:0;
}
.rmap .wave01 {
  top:39.47%;
  left:40%;
}
.rmap .wave02 {
  top:76.31%;
  left:65%;
}
.rmap .wave03 {
  top:78.94%;
  left:17.75%;
}
.rmap .miyagi {
  visibility: hidden;
  opacity:0;
  position: absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:url(../img/rmap_miyagi.webp) 385px 155px / 55px auto no-repeat;
  z-index:50;
  transition: opacity 1s 0.5s ease-in-out, background 1s 0s ease-in-out;
}
.rmap.scrolled .miyagi {
  visibility: visible;
  opacity:1;
  background:url(../img/rmap_miyagi.webp) 20px -245px / 480px auto no-repeat;
}
.rmap .jpn_after {
  visibility: hidden;
  opacity:0;
  position: absolute;
  top:25%;
  left:20%;
  transform: translateX(-50%);
  width:50%;
  height:75%;
  background:url(../img/rmap_jpn.webp) center center / contain no-repeat;
  z-index:10;
  transition:all 0.5s 0.5s ease-in-out;
}
.rmap.scrolled .jpn_after {
  visibility: visible;
  opacity:1;
  left:16.5%;
}
.zoom_ring {
  visibility: hidden;
  opacity:0;
  position: absolute;
  top:0;
  left:145px;
  width:340px;
  height:245px;
  background:url(../img/zoom_ring.webp) center center / contain no-repeat;
  z-index:60;
  transition: opacity 0.5s 1s ease-in-out, background 1s 0s ease-in-out;
}
.rmap.scrolled .zoom_ring {
  visibility: visible;
  opacity:1;
}
.sendai {
  visibility: hidden;
  opacity:0;
  position: absolute;
  top:90px;
  left:375px;
  display: inline-block;
  position: relative;
  font-size:1.125rem;
  font-weight:bold;
  z-index:60;
  transition: all 0.5s 1.5s ease-in-out;
}
.sendai::after {
  content:"";
  position: absolute;
  top:35px;
  left:50%;
  width:4px;
  height:4px;
  border-radius:5px;
  transform:translateX(-50%);
  background-color:#4D4D4D;
}
.rmap.scrolled .sendai {
  visibility: visible;
  opacity:1;
}
[class^="rank0"] {
  visibility: hidden;
  opacity:0;
  position: absolute;
  display: inline-block;
  font-size:1rem;
  font-weight:bold;
  color: #fff;
  padding:5px 15px 5px 62px;
  border-radius:100px;
  z-index: 100;
  filter: saturate(1) brightness(1);
  transition: filter 0.5s;
}
[class^="rank0"]:hover {
  filter: saturate(0.8) brightness(1.4);
  transition: filter 0.5s;
}
@media all and (-ms-high-contrast: none){
  [class^="rank0"] {
    padding:10px 20px 0px 62px;
  }
}
.rmap.scrolled [class^="rank0"] {
  visibility: visible;
  opacity:1;
}
[class^="rank0"]::after {
  position: absolute;
  content:"";
  display: block;
}
[class^="rank0"] div {
  display: block;
  width:100%;
  height:100%;
}
[class^="rank0"] span.icon {
  position: absolute;
  top:50%;
  left:0;
  transform:translateY(-50%);
  content: "";
  display: block;
  width:56px;
  height:56px;
}
[class^="rank0"] span.arrow {
  font-size:0.8em;
  vertical-align:text-top;
  margin-left: 5px;
}
[class^="rank0"].active {
  width:85px;
  height:85px;
  padding:54px 0 0 0;
  font-size:1.1rem;
  text-align: center;
  animation: plus 0.75s ease 0s 1 normal;
}
[class^="rank0"].active span.arrow {
  display: none;
  }
@keyframes plus {
  0% {
    transform: scale(0,0);
  }
  33% {
    transform: scale(1.1,1.1);
  }
  66% {
    transform: scale(0.9,0.9);
  }
  100% {
    transform: scale(1,1);
  }
}
[class^="rank0"].active::after {
  content:none;
}
[class^="rank0"].active span.icon {
  top:3px;
  left:50%;
  transform:translateX(-50%);
}
.rank01 {
  top:72px;
  left:450px;
  background-color: #A52D62;
  transition: opacity 0.5s 2s ease-in-out;
}
.rank01.active {
  top:48px;
  left:445px;
}
.rank01::after {
  top:40px;
  left:-40px;
  width:70px;
  height:20px;
  background:url(../img/map_rank01_line.webp) center center / contain no-repeat;
}
.rank01 span.icon {
  background:url(../img/map_rank01.webp) center center / contain no-repeat;
}
.rank02 {
  top:108px;
  left:163px;
  background-color: #2D7558;
  transition: opacity 0.5s 2.5s ease-in-out;
}
.rank02 br {
  display: none;
}
.rank02.active {
  top:80px;
  left:270px;
  padding:50px 0 0 0;
  font-size:0.9rem;
  line-height:1.1;
  letter-spacing: 0;
}
.rank02.active .icon {
  width:48px;
  height:48px;
}
.rank02.active br {
  display: block;
}
.rank02::after {
  top:50%;
  left:100%;
  width:50px;
  height:2px;
  background:url(../img/map_rank02_line.webp) center center / contain no-repeat;
}
.rank02 span.icon {
  background:url(../img/map_rank02.webp) center center / contain no-repeat;
}
.rank03 {
  top:152px;
  left:465px;
  background-color: #754C24;
  transition: opacity 0.5s 3s ease-in-out;
}
.rank03.active {
  top:114px;
  left:405px;
}
.rank03::after {
  top:-30px;
  left:-60px;
  width:60px;
  height:57px;
  background:url(../img/map_rank03_line.webp) center center / contain no-repeat;
}
.rank03 span.icon {
  background:url(../img/map_rank03.webp) center center / contain no-repeat;
}
.rmap [class^="wave1"] {
  visibility: hidden;
  opacity:0;
  position: absolute;
  display: block;
  width:9%;
  height:4.5%;
  background:url(../img/rmap_wave.webp) center center / contain no-repeat;
  transition: all 1s 1.5s ease-in-out;
}
.rmap.scrolled [class^="wave1"] {
  visibility: visible;
  opacity:1;
}
.rmap .wave11 {
  top:60%;
  left:66%;
}
.rmap .wave12 {
  top:90%;
  left:53%;
}


.content {
  position: relative;
  text-align:center;
  width:100%;
}
.arai .inner {
  background-color: #FEF6F6;
}
.arai .hd {
  background:url(../img/arai.webp) center center / cover no-repeat;
}
.arai .hd .catch {
  color:#A52D62;
}
.arai [class^="sb0"]::before {
  border-left: 1px solid #A52D62;
}
.arai [class^="sb0"]::after {
  border-left: 1px solid #A52D62;
}
.arai .sb01 {
  margin-top:45px;
}
.arai .sb02 {
  margin-top:80px;
}
.arai .sb03 {
  margin-top:80px;
}
.arai [class^="hl0"] {
  background-color: #A52D62;
}
.arai .hl01 {
  width:520px;
}
.arai .hl02 {
  width:700px;
}
.arai .hl03 {
  width:520px;
}
.arai .source {
  color: #A52D62;
}
.arai .nt01 {
  width:700px;
}
.arai .nt02 {
  width:560px;
}
.arai .nt03 {
  width:480px;
  margin-bottom:80px;
}
.omachi .inner {
  background-color: #F2F8F3;
}
.omachi .hd {
  background:url(../img/omachi.webp) center center / cover no-repeat;
}
.omachi .hd .catch {
  color:#388165;
}
.omachi [class^="sb0"]::before {
  border-left: 1px solid #388165;
}
.omachi [class^="sb0"]::after {
  border-left: 1px solid #388165;
}
.omachi .sb01 {
  margin-top:45px;
}
.omachi .sb02 {
  margin-top:80px;
}
.omachi [class^="hl0"] {
  background-color: #388165;
}
.omachi .hl01 {
  width:560px;
}
.omachi .hl02 {
  width:560px;
}
.omachi .source {
  color: #388165;
}
.omachi .nt01 {
  width:480px;
}
.omachi .nt02 {
  width:520px;
  margin-bottom:80px;
}
.nagamachi .inner {
  padding-bottom:70px;
  background-color: #F1EDE9;
}
.nagamachi .hd {
  background:url(../img/nagamachi.webp) center center / cover no-repeat;
}
.nagamachi .hd .catch {
  color:#754C24;
}
.nagamachi [class^="sb0"]::before {
  border-left: 1px solid #754C24;
}
.nagamachi [class^="sb0"]::after {
  border-left: 1px solid #754C24;
}
.nagamachi .sb01 {
  margin-top:45px;
}
.nagamachi .sb02 {
  margin-top:80px;
}
.nagamachi [class^="hl0"] {
  background-color: #754C24;
}
.nagamachi .hl01 {
  width:560px;
}
.nagamachi .hl02 {
  width:560px;
}
.nagamachi .source {
  color: #754C24;
}
.nagamachi .nt01 {
  width:480px;
}
.nagamachi .nt02 {
  width:520px;
  margin-bottom:80px;
}
.nagamachi .sogood {
  position: relative;
  width:800px;
  border:3px solid #EDCB00;
  background-color: #fff;
  margin:60px auto 0 auto;
  text-align:left;
  padding:40px 30px 0 30px;
}
.nagamachi .sogood .image {
  float:right;
}
.nagamachi .sogood .sg01 {
  position: absolute;
  top:-30px;
  left:50%;
  transform:translateX(-50%);
  width:465px;
  height:60px;
  background:url(../img/nagamachi_sg01.webp) center center / contain no-repeat;
}
.nagamachi .sogood .hl {
  display: inline-block;
  font-size:1.5rem;
  font-weight:bold;
  border-bottom:3px solid #EDCB00;
  padding-bottom: 10px;
  margin-bottom: 20px;
}
.nagamachi .sogood .txt p {
  font-size:0.875rem;
  font-weight:bold;
  margin-bottom:1em;
}

.footwrap {
  padding-top: 45px;
  padding-bottom: 11px;
  text-align: center;
  background-color: #000;
}
.foot01 {
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  letter-spacing: 0.05em;
}


.hd {
  height:240px;
  text-align:center;
}
.hd .name {
  font-size: 2.2rem;
  font-weight:bold;
  line-height:1;
  margin:auto;
  padding-top: 60px;
}
.hd .name img {
  width:56px;
  vertical-align:bottom;
  margin-right: 30px;
}
@media all and (-ms-high-contrast: none){
  .hd .name img {
    vertical-align:baseline;
  }
}
.hd .catch {
  display: inline-block;
  font-size: 1.2rem;
  font-weight:bold;
  background-color: rgba(255,255,255,0.8);
  min-width: 400px;
  text-align: center;
  margin:20px auto 0 auto;
  padding:5px 30px;
}
@media all and (-ms-high-contrast: none){
  .hd .catch {
    padding:10px 0 2px 0;
  }
}
[class^="sb0"] {
  display: inline-block;
  position: relative;
  font-size:1.125rem;
  font-weight:bold;
  padding:0 15px;
  transform:translateY(30px);
  opacity:0;
  transition: all 0.5s ease-in-out;
}
[class^="sb0"].active {
  transform:translateY(0);
  opacity:1;
}
[class^="sb0"]::before {
  position: absolute;
  top:0;
  left: 0;
  content:'';
  display: block;
  width:1px;
  height:25px;
  transform:rotate(150deg);
}
[class^="sb0"]::after {
  position: absolute;
  top:0;
  right: 0;
  content:'';
  display: block;
  width:1px;
  height:25px;
  transform:rotate(-150deg);
}
[class^="hl0"] {
  display: block;
  position: relative;
  font-size:1.6rem;
  font-weight:bold;
  color:#fff;
  margin:15px auto 0 auto;
  padding:5px 0 7px 0;
  border-radius: 100px;
}
@media all and (-ms-high-contrast: none){
  [class^="hl0"] {
    padding:12px 0 0 0;
  }
}
.source {
  font-size:0.8rem;
}
[class^="nt0"] {
  display: inline-block;
  position: relative;
  margin:20px auto 0 auto;
  padding:10px 0 15px 0;
  background-color: #EDCB00;
  border-radius: 15px;
  transform:translateY(30px);
  opacity:0;
  transition: all 0.5s ease-in-out;
}
[class^="nt0"].active {
  transform:translateY(0);
  opacity:1;
}
[class^="nt0"] span {
  font-size:1.1rem;
  font-weight:bold;
  line-height:1.9;
  border-bottom:1px solid;
  padding-bottom: 5px;
}
@media all and (-ms-high-contrast: none){
  [class^="nt0"] {
    padding:20px 0 15px 0;
  }
  [class^="nt0"] span {
    display: inline-block;
    padding-bottom: 0;
    line-height:1.9;
    border-bottom:0;
    text-decoration: underline;
  }
}


/* インフォグラフィック
======================================*/

.arai .ig01 {
  position: relative;
  display: block;
  width:300px;
  height:300px;
  margin:10px auto 0 auto;
  background:url(../img/arai_ig01_bg.webp) center center / 94.25% 94.25% no-repeat;
}
.arai .ig01 .eki {
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
  display: block;
  width:33%;
  height:33%;
  z-index: 100;
}
.arai .ig01 .eki > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig01_eki.webp) center center /contain no-repeat;
}
.arai .ig01 .eki span {
  position: absolute;
  top:50%;
  left:50%;
  width:100%;
  transform: translateX(-50%);
  font-size:1.3rem;
  font-weight:bold;
}
.arai .ig01 [class^="p0"] {
  position: absolute;
  display: block;
  width:20%;
  height:20%;
  z-index: 10;
}
.arai .ig01 [class^="p0"] span {
  position: absolute;
  top:45px;
  left:50%;
  padding:3px 0;
  transform: translateX(-50%);
  text-align:center;
  font-size:0.8rem;
  font-weight:bold;
  line-height:1.2;
  color:#fff;
  background-color: #388165;
  border-radius:5px;
}
@media all and (-ms-high-contrast: none){
  .arai .ig01 [class^="p0"] span {
    padding:8px 0 3px 0;
  }
}
.arai .ig01 .p01 {
  top:9%;
  left:9%;
}
.arai .ig01 .p01 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig01_p01.webp) center center /contain no-repeat;
}
.arai .ig01 .p01 span {
  width:140%;
}
.arai .ig01 .p02 {
  top:35%;
  left:7%;
}
.arai .ig01 .p02 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig01_p02.webp) center center /contain no-repeat;
}
.arai .ig01 .p02 span {
  width:140%;
}
.arai .ig01 .p03 {
  top:66%;
  left:8.5%;
}
.arai .ig01 .p03 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig01_p03.webp) center center /contain no-repeat;
}
.arai .ig01 .p03 span {
  width:137.5%;
}
.arai .ig01 .p04 {
  top:69.75%;
  left:50%;
  transform: translateX(-50%);
}
.arai .ig01 .p04 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig01_p04.webp) center center /contain no-repeat;
}
.arai .ig01 .p04 span {
  width:160%;
}
.arai .ig01 .p05 {
  top:74%;
  left:71%;
}
.arai .ig01 .p05 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig01_p05.webp) center center /contain no-repeat;
}
.arai .ig01 .p05 span {
  width:135%;
}
.arai .ig01 .p06 {
  top:45%;
  left:76%;
}
.arai .ig01 .p06 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig01_p06.webp) center center /contain no-repeat;
}
.arai .ig01 .p06 span {
  width:195%;
}
.arai .ig01 .car {
  position: absolute;
  top:21.5%;
  left:59.75%;
  display: block;
  width:22.75%;
  height:8.25%;
  z-index: 10;
}
.arai .ig01 .car > div {
  display: block;
  width:100%;
  height:100%;
  transform: translateX(180px);
  background: url(../img/arai_ig01_car.webp) center center /contain no-repeat;
  transition: all 0.5s ease-in-out;
}
.arai .ig01 .car > div.active {
  transform: translateX(0);
}
.arai .ig01 .line {
  position: absolute;
  top:calc(50% + 5%);
  left:calc(50% - 3%);
  transform: translate(-50%,-50%);
  display: block;
  width:69.75%;
  height:67%;
  z-index: 1;
}
.arai .ig01 .line > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig01_line.webp) center center /contain no-repeat;
}
.arai .ig02 {
  position: relative;
  display: block;
  width:470px;
  height:220px;
  margin:40px auto 10px auto;
}
.arai .ig02 .ground {
  position: absolute;
  bottom:8.8%;
  left:0;
  display: block;
  width:100%;
  height:11.76%;
  background: url(../img/arai_ig02_bg.webp) center center /contain no-repeat;
  z-index: 10;
}
.arai .ig02 .unit {
  position: absolute;
  bottom:-2%;
  right:1.38%;
  display: block;
  font-size:0.875rem;
  color:#A52D62;
  z-index: 10;
}
.arai .ig02 .jyuki01 {
  position: absolute;
  bottom:20.5%;
  left:2.77%;
  display: block;
  width:13.33%;
  height:16.17%;
  z-index: 10;
}
.arai .ig02 .jyuki01 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig02_jyuki01.webp) center center /contain no-repeat;
}
.arai .ig02 .jyuki02 {
  position: absolute;
  bottom:20.5%;
  right:0;
  display: block;
  width:18.61%;
  height:25.29%;
  z-index: 10;
}
.arai .ig02 .jyuki02 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig02_jyuki02.webp) center center /contain no-repeat;
}
.arai .ig02 .b01 {
  position: absolute;
  bottom:20%;
  left:22.91%;
  display: block;
  width:10%;
  height:22.94%;
  z-index: 10;
}
.arai .ig02 .b01 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig02_b01.webp) center center /contain no-repeat;
}
.arai .ig02 .b02 {
  position: absolute;
  bottom:19.7%;
  left:44.44%;
  display: block;
  width:10%;
  height:54.41%;
  z-index: 10;
}
.arai .ig02 .b02 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig02_b02.webp) center center /contain no-repeat;
}
.arai .ig02 .b03 {
  position: absolute;
  bottom:19.7%;
  left:66.66%;
  display: block;
  width:10%;
  height:62.64%;
  z-index: 10;
}
.arai .ig02 .b03 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig02_b03.webp) center center /contain no-repeat;
}
.arai .ig02 .m01 {
  position: absolute;
  bottom:44.11%;
  left:19.44%;
  display: block;
  width:16.52%;
  height:10.29%;
  z-index: 10;
}
.arai .ig02 .m01 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig02_m01.webp) center center /contain no-repeat;
}
.arai .ig02 .m02 {
  position: absolute;
  bottom:76.47%;
  left:40.97%;
  display: block;
  width:16.52%;
  height:10.29%;
  z-index: 10;
}
.arai .ig02 .m02 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig02_m02.webp) center center /contain no-repeat;
}
.arai .ig02 .m03 {
  position: absolute;
  top:0;
  left:56.94%;
  display: block;
  width:27.77%;
  height:12.64%;
  z-index: 10;
}
.arai .ig02 .m03 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig02_m03.webp) center center /contain no-repeat;
}
.arai .ig03 {
  position: relative;
  display: block;
  width:680px;
  height:290px;
  margin:20px auto 10px auto;
}
.arai .ig03 .t01 {
  position: absolute;
  top:0;
  left:190px;
  display: block;
  width:273px;
  height:122px;
  z-index: 10;
}
.arai .ig03 .t01 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig03_t01.webp) center center /contain no-repeat;
}
.arai .ig03 .t02 {
  position: absolute;
  bottom:0;
  left:75px;
  display: block;
  width:231px;
  height:26px;
  z-index: 10;
}
.arai .ig03 .t02 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig03_t02.webp) center center /contain no-repeat;
}
.arai .ig03 .t03 {
  position: absolute;
  bottom:0;
  right:60px;
  display: block;
  width:247px;
  height:26px;
  z-index: 10;
}
.arai .ig03 .t03 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig03_t03.webp) center center /contain no-repeat;
}
.arai .ig03 .bg01 {
  position: absolute;
  bottom:35px;
  left:112px;
  display: block;
  width:156px;
  height:80px;
  z-index: 10;
}
.arai .ig03 .bg01 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig03_bg02.webp) center center /contain no-repeat;
}
.arai .ig03 .bg02 {
  position: absolute;
  bottom:35px;
  right:100px;
  display: block;
  width:156px;
  height:80px;
  z-index: 10;
}
.arai .ig03 .bg02 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig03_bg02.webp) center center /contain no-repeat;
}
.arai .ig03 .h01 {
  position: absolute;
  bottom:70px;
  left:120px;
  display: block;
  width:138px;
  height:70px;
  z-index: 20;
}
.arai .ig03 .h01 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig03_h01.webp) center center /contain no-repeat;
}
.arai .ig03 .h02 {
  position: absolute;
  bottom:70px;
  right:143px;
  display: block;
  width:71px;
  height:70px;
  z-index: 20;
}
.arai .ig03 .h02 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig03_h02.webp) center center /contain no-repeat;
}
.arai .ig03 .arrow {
  position: absolute;
  bottom:80px;
  left:290px;
  display: block;
  width:103px;
  height:22px;
  z-index: 20;
}
.arai .ig03 .arrow > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/arai_ig03_arrow.webp) center center /contain no-repeat;
}
.arai .ig03 .n01 {
  position: absolute;
  bottom:150px;
  left:165px;
  display: block;
  font-size:1.2rem;
  font-weight:bold;
  z-index: 20;
}
.arai .ig03 .n01 > div {
  display: block;
}
.arai .ig03 .n02 {
  position: absolute;
  bottom:150px;
  right:130px;
  display: block;
  font-size:1.2rem;
  font-weight:bold;
  z-index: 20;
}
.arai .ig03 .n02 > div {
  display: block;
}
.omachi .ig01 {
  position: relative;
  display: block;
  width:710px;
  height:196px;
  margin:20px auto 10px auto;
}
.omachi .ig01 .eki01 {
  position: absolute;
  bottom:0;
  left:100px;
  display: block;
  width:155px;
  height:100px;
  z-index: 20;
}
.omachi .ig01 .eki01 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/omachi_ig01_eki01.webp) center center /contain no-repeat;
}
.omachi .ig01 .eki02 {
  position: absolute;
  bottom:0;
  right:100px;
  display: block;
  width:155px;
  height:100px;
  z-index: 20;
}
.omachi .ig01 .eki02 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/omachi_ig01_eki02.webp) center center /contain no-repeat;
}
.omachi .ig01 .eki03 {
  position: absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  display: block;
  width:170px;
  height:180px;
  z-index: 20;
}
.omachi .ig01 .eki03 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/omachi_ig01_eki03.webp) center center /contain no-repeat;
}
.omachi .ig01 .line {
  position: absolute;
  bottom:25px;
  left:200px;
  display: block;
  width:310px;
  height:1px;
  z-index: 10;
}
.omachi .ig01 .line > div {
  display: block;
  width:0%;
  height:100%;
  border-top:2px solid #388165;
  transition: all 0.5s ease-in-out;
}
.omachi .ig01 .line > div.active {
  width:100%;
}
.omachi .ig02 {
  position: relative;
  display: block;
  width:550px;
  height:250px;
  margin:20px auto 10px auto;
}
.omachi .ig02 .n01 {
  position: absolute;
  bottom:0;
  left:0;
  display: block;
  width:150px;
  height:110px;
  z-index: 20;
}
.omachi .ig02 .n01 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/omachi_ig02_n01.webp) center center /contain no-repeat;
}
.omachi .ig02 .n02 {
  position: absolute;
  bottom:0;
  right:-40px;
  display: block;
  width:288px;
  height:110px;
  z-index: 20;
}
.omachi .ig02 .n02 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/omachi_ig02_n02.webp) center center /contain no-repeat;
}
.omachi .ig02 .time {
  position: absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  display: block;
  width:171px;
  height:150px;
  z-index: 20;
}
.omachi .ig02 .time > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/omachi_ig02_time.webp) center center /contain no-repeat;
}
.omachi .ig02 .walk {
  position: absolute;
  bottom:12px;
  left:100px;
  display: block;
  width:215px;
  height:70px;
  z-index: 10;
}
.omachi .ig02 .walk > div {
  display: block;
  width:0;
  height:100%;
  background: url(../img/omachi_ig02_walk.webp) right center /215px 70px no-repeat;
  transition: all 1s ease-in-out;
}
.omachi .ig02 .walk > div.active {
  width:100%;
}
.nagamachi .ig01 {
  position: relative;
  display: block;
  width:820px;
  height:262px;
  margin:20px auto;
}
.nagamachi .ig01 .map {
  position: absolute;
  top:0;
  left:0;
  display: block;
  width:100%;
  height:262px;
  background: url(../img/nagamachi_ig01_map.webp) center center /contain no-repeat;
  z-index: 10;
}
.nagamachi .ig01 .pin01 {
  position: absolute;
  top:60px;
  left:412px;
  display: block;
  width:33px;
  height:53px;
  z-index: 20;
}
.nagamachi .ig01 .pin01 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig01_pin.webp) center center /contain no-repeat;
}
.nagamachi .ig01 .pin02 {
  position: absolute;
  top:95px;
  left:297px;
  display: block;
  width:23px;
  height:37px;
  z-index: 20;
}
.nagamachi .ig01 .pin02 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig01_pin.webp) center center /contain no-repeat;
}
.nagamachi .ig01 .pin03 {
  position: absolute;
  top:140px;
  left:442px;
  display: block;
  width:23px;
  height:37px;
  z-index: 20;
}
.nagamachi .ig01 .pin03 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig01_pin.webp) center center /contain no-repeat;
}
.nagamachi .ig01 .p01 {
  position: absolute;
  top:45%;
  left:50px;
  transform:translateY(-50%);
  display: block;
  width:140px;
  height:140px;
  z-index: 30;
}
.nagamachi .ig01 .p01 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig01_p01.webp) center center /contain no-repeat;
}
.nagamachi .ig01 .p02 {
  position: absolute;
  top:45%;
  right:90px;
  transform:translateY(-50%);
  display: block;
  width:140px;
  height:140px;
  z-index: 30;
}
.nagamachi .ig01 .p02 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig01_p02.webp) center center /contain no-repeat;
}
.nagamachi .ig01 .p03 {
  position: absolute;
  top:60px;
  right:35px;
  display: block;
  width:91px;
  height:85px;
  z-index: 40;
}
.nagamachi .ig01 .p03 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig01_p03.webp) center center /contain no-repeat;
}
.nagamachi .ig01 .l01 {
  position: absolute;
  top:44%;
  left:187px;
  transform:translateY(-50%);
  display: block;
  width:108px;
  height:6px;
  z-index: 20;
}
.nagamachi .ig01 .l01 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig01_l01.webp) center center /contain no-repeat;
}
.nagamachi .ig01 .l02 {
  position: absolute;
  top:52%;
  right:200px;
  transform:translateY(-50%);
  display: block;
  width:145px;
  height:6px;
  z-index: 20;
}
.nagamachi .ig01 .l02 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig01_l02.webp) center center /contain no-repeat;
  transition: all 1s ease-in-out;
}
.nagamachi .ig02 {
  position: relative;
  display: block;
  width:750px;
  height:310px;
  margin:20px auto 10px auto;
}
.nagamachi .ig02 .ten {
  position: absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  display: block;
  width:100px;
  height:100px;
  background: url(../img/nagamachi_ig02_ten.webp) center center /contain no-repeat;
  z-index: 10;
}
.nagamachi .ig02 [class^="p0"],
.nagamachi .ig02 [class^="p1"] {
  position: relative;
  display: block;
  width:90px;
  height:60px;
  z-index: 20;
}
.nagamachi .ig02 [class^="p0"] span,
.nagamachi .ig02 [class^="p1"] span {
  position: absolute;
  top:calc(100% + 5px);
  left:-30px;
  width:150px;
  padding:2px 0;
  background-color: #fff;
  font-size:0.875rem;
  font-weight:bold;
  text-align:center;
  border:3px solid #754C24;
  border-radius: 20px;
}
@media all and (-ms-high-contrast: none){
  .nagamachi .ig02 [class^="p0"] span,
  .nagamachi .ig02 [class^="p1"] span {
    padding:8px 0 3px 0;
  }
}
.nagamachi .ig02 .p01 {
  position: absolute;
  top:90px;
  left:0;
}
.nagamachi .ig02 .p01 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig02_p01.webp) center center /contain no-repeat;
}
.nagamachi .ig02 .p02 {
  position: absolute;
  top:90px;
  left:28%;
  transform:translateX(-50%);
}
.nagamachi .ig02 .p02 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig02_p02.webp) center center /contain no-repeat;
}
.nagamachi .ig02 .p03 {
  position: absolute;
  top:90px;
  left:50%;
  transform:translateX(-50%);
  width:137px;
}
.nagamachi .ig02 .p03 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig02_p03.webp) center center /contain no-repeat;
}
.nagamachi .ig02 .p03 span {
  left:-6px;
}
.nagamachi .ig02 .p04 {
  position: absolute;
  top:90px;
  left:72%;
  transform:translateX(-50%);
}
.nagamachi .ig02 .p04 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig02_p04.webp) center center /contain no-repeat;
}
.nagamachi .ig02 .p05 {
  position: absolute;
  top:90px;
  right:-25px;
  width:141px;
}
.nagamachi .ig02 .p05 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig02_p05.webp) center center /contain no-repeat;
}
.nagamachi .ig02 .p05 span {
  left:-5px;
}
.nagamachi .ig02 .p06 {
  position: absolute;
  bottom:45px;
  left:0;
}
.nagamachi .ig02 .p06 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig02_p06.webp) center center /contain no-repeat;
}
.nagamachi .ig02 .p07 {
  position: absolute;
  bottom:45px;
  left:28%;
  transform:translateX(-50%);
}
.nagamachi .ig02 .p07 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig02_p07.webp) center center /contain no-repeat;
}
.nagamachi .ig02 .p08 {
  position: absolute;
  bottom:45px;
  left:50%;
  transform:translateX(-50%);
}
.nagamachi .ig02 .p08 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig02_p08.webp) center center /contain no-repeat;
}
.nagamachi .ig02 .p09 {
  position: absolute;
  bottom:45px;
  left:72%;
  transform:translateX(-50%);
  width:135px;
}
.nagamachi .ig02 .p09 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig02_p09.webp) center center /contain no-repeat;
}
.nagamachi .ig02 .p09 span {
  left:-7px;
}
.nagamachi .ig02 .p10 {
  position: absolute;
  bottom:45px;
  right:0;
}
.nagamachi .ig02 .p10 > div {
  display: block;
  width:100%;
  height:100%;
  background: url(../img/nagamachi_ig02_p10.webp) center center /contain no-repeat;
}
.goto {
  display: inline-block;
  margin:0 auto;
  padding:20px 70px;
  background-color: #EDCB00;
  font-size:1.2rem;
  font-weight:bold;
  border-radius:5px;
}
.goto::before {
  content:"";
  display: inline-block;
  width:24px;
  height:24px;
  margin-right: 10px;
  transform:translateY(5px);
  background: url(../img/goto_arrow.webp) center center / contain no-repeat;
}