@charset "utf-8";
html,body{
	overflow-x: hidden;
	width: 100%;
	height: auto;
}
body::-webkit-scrollbar{
	display:none;
}
iframe{
    width: 100%;
    height: 500px;
}
/* ローディング画面 */
#loading {
  width: 100vw;
  height: 100vh;
  transition: all 1s;
  background-color: #fff;
  /* 以下のコードを追加 */
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}
.spinner {
  width: 100px;
  height: 100px;
  margin:22% auto 0;
  background-color: #07B500;
  border-radius: 100%;
  animation: sk-scaleout 1.0s infinite ease-in-out;
}
.loaded {
  opacity: 0;
  visibility: hidden;
}
/* ローディングアニメーション */
@keyframes sk-scaleout {
  0% {
    transform: scale(0);
  } 100% {
    transform: scale(1.0);
    opacity: 0;
  }
}
img{
    -webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
.neocity_wrapper{
	width: 100%;
	position: relative;
	overflow: hidden;
}
#inner {
	position: relative;
}
#scrollArea {
  overflow: auto;
}
.neocity{
	width: 100%;
	position: relative;
}
.neocity::-webkit-scrollbar {  /* Chrome, Safari 対応 */
        display:none;
    }
.background{
	z-index: 1;
	width: 100vw;
	height: auto;
}
.background_neosity{
	z-index: -1;
	animation: background_a 0.4s;
	animation-fill-mode: forwards;
    animation-delay: 1.0s;
    opacity: 0;
}
.track{
	background: url("../img/neocity_track.png") no-repeat;
	background-size: 400%;
	width: 5%;
	left: 71%;
	top: -13%;
	height: 100%;
	position: absolute;
	animation: track 20s infinite linear;
    animation-delay: 1.0s;
}
@keyframes track {
  0%{
	  	z-index: 41;
	  	transform: translate(0,0);
	  	background-position: 0 0;
	}
	 20%{
	  	transform: translate(0,0);
	  	background-position: 0 0;
	}
	50%{
	  	transform: translate(-495%,26.5%);
	  	background-position: 0 0;
	}
	60%{
	  	transform: translate(-495%,26.5%);
	  	background-position: 0 0;
	}
	 91%{
	  	transform: translate(-930%,49.5%);
		background-position: 0 0;
	}
	91.001%{
		transform: translate(-930%,51%);
		background-position: 30% 0;
	}
	 100%{
		 z-index: 41;
	  	transform: translate(-800%,57.5%);
		 background-position: 30% 0;
	}
}
.track02{
	background: url("../img/neocity_track.png") no-repeat;
	background-size: 400%;
	width: 5%;
	left: 34%;
	top: 41%;
	height: 100%;
	opacity: 0;
	position: absolute;
	animation: track02 20s infinite linear;
    animation-delay: 1.0s;
}
@keyframes track02 {
  0%{
	  	z-index: 50;
	  	transform: translate(0,0);
	  	background-position: 0 0;
	}
	20%{
	  	transform: translate(0,0);
	  	background-position: 0 0;
	}
	20.001%{
		transform: translate(-55%,4%);
	  	background-position: 30% 0;
	}
	 40%{
	  	transform: translate(170%,16.3%);
		background-position: 30% 0;
	}
	40.001%{
		transform: translate(185%,16.8%);
		background-position: 100% 0;
	}
	 100%{
		 z-index: 50;
	  	transform: translate(900%,-21.3%);
		 background-position: 100% 0;
	}
}
.track03{
	background: url("../img/neocity_track_blue.png") no-repeat;
	background-size: 400%;
	width: 5%;
	left: 100%;
	top: 77.4%;
	z-index: 60;
	height: 100%;
	position: absolute;
	animation: track03 40s infinite linear;
    animation-delay: 1.0s;
}
@keyframes track03 {
  0%{
	  	z-index: 30;
	  	transform: translate(0,0);
	  	background-position: 65% 0;
	}
	10%{
	  	transform: translate(0,0);
	  	background-position: 65% 0;
	}
	40%{
	  	transform: translate(-700%,-37.8%);
	  	background-position: 65% 0;
	}
	50%{
		transform: translate(-700%,-37.8%);
	  	background-position: 65% 0;
	}
	 100%{
		 z-index: 30;
	  	transform: translate(-2000%,-107%);
		 background-position: 65% 0;
	}
}
.redcar{
	background: url("../img/neocity_redcar.png") no-repeat;
	background-size: 400%;
	width: 4%;
	left: 46.5%;
	top: 100%;
	height: 100%;
	position: absolute;
	animation: redcar 20s infinite linear;
    animation-delay: 1.0s;
}
@keyframes redcar {
    0%{
	  	z-index: 39;
	  	transform: translate(0,0);
	  	background-position: 100% 0;
	}
	25%{
	  	z-index: 39;
	  	transform: translate(440%,-19%);
	  	background-position: 100% 0;
	}
	25.001%{
	  	z-index: 39;
	  	transform: translate(430%,-20%);
	  	background-position: 70% 0;
	}
	 100%{
		 z-index: 40;
	  	transform: translate(-910%,-77.5%);
		 background-position: 70% 0;
	}
}
.yellowcar{
	background: url("../img/neocity_yellowcar.png") no-repeat;
	background-size: 370%;
	width: 4%;
	left: 6%;
	top: 100%;
	height: 100%;
	position: absolute;
	animation: yellowcar 20s infinite linear;
    animation-delay: 1.0s;
}
@keyframes yellowcar {
    0%{
	  	z-index: 39;
	  	transform: translate(0,0);
	  	background-position: 100% 0;
	}
	45%{
	  	z-index: 39;
	  	transform: translate(870%,-37.5%);
	  	background-position: 100% 0;
	}
	55%{
	  	z-index: 39;
	  	transform: translate(870%,-37.5%);
	  	background-position: 100% 0;
	}
	58%{
	  	z-index: 39;
	  	transform: translate(950%,-40.3%);
	  	background-position: 100% 0;
	}
	58.001%{
	  	z-index: 39;
	  	transform: translate(950%,-40.3%);
	  	background-position: 30% 0;
	}
	 100%{
		 z-index: 40;
	  	transform: translate(1900%,0);
		 background-position: 30% 0;
	}
}
.balloon{
	position: absolute;
	left: 48.5%;
	right: 44.3%;
	top:-20%;
    opacity: 0;
	animation: balloon 40s infinite linear;
    animation-delay: 2.0s;
}
@keyframes balloon {
  0%{
	  	z-index: 100;
        opcity:0;
	  	transform: translate(0,0);
	}
    20%{
	  	z-index: 100;
        opcity:1;
	  	transform: translate(0,0);
	}
	50%{
	  	transform: translate(0,0);
	}
	 100%{
		 z-index: 100;
	  	transform: translate(-900%,500%);
	}
}
.drone01{
	position: absolute;
	left: 82%;
	right: 13%;
	top:100%;
	animation: drone01 40s infinite cubic-bezier(0, 0, 0.58, 1.0);
    animation-delay: 1.0s;
}
@keyframes drone01 {
  0%{
	  	z-index: 100;
	  	transform: translate(0,0);
	}
	50%{
	  	transform: translate(0,0);
	}
	70%{
		z-index: 100;
	  	transform: translate(-50%,-750%);
	}
	72.5%{
		z-index: 100;
	  	transform: translate(-50%,-740%);
	}
	75%{
		z-index: 100;
	  	transform: translate(-50%,-750%);
	}
	77.5%{
		z-index: 100;
	  	transform: translate(-50%,-740%);
	}
	80%{
		z-index: 100;
	  	transform: translate(-50%,-750%);
	}
	 100%{
		 z-index: 100;
	  	transform: translate(-100%,-1500%);
	}
}
.drone02{
	position: absolute;
	left: 13%;
	right: 82%;
	top:100%;
	animation: drone02 40s infinite cubic-bezier(0, 0, 0.58, 1.0);
    animation-delay: 1.0s;
}
@keyframes drone02 {
  0%{
	  	z-index: 100;
	 	transform: translate(0,0);
	}
	20%{
		transform: translate(50%,-750%);
	}
	22.5%{
		transform: translate(50%,-740%);
	}
	25%{
		transform: translate(50%,-750%);
	}
	27.5%{
		transform: translate(50%,-740%);
	}
	30%{
		transform: translate(50%,-750%);
	}
	50%{
		transform: translate(100%,-1500%);
	}
	 100%{
		 z-index: 100;
	  	transform: translate(100%,-1500%);
	}
}
.car01{
	z-index: 30;
	position: absolute;
	left: 50.8%;
	right: 42.5%;
	top:79%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.5s;
	animation-fill-mode: forwards;
}
.car02{
	z-index: 40;
	position: absolute;
	left: 33%;
	right: 58%;
	top:42%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.5s;
	animation-fill-mode: forwards;
}
.car03{
	z-index: 40;
	position: absolute;
	left: 15%;
	right: 82%;
	top:82%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.5s;
	animation-fill-mode: forwards;
}
.factory01{
	z-index: 42;
	position: absolute;
	left: 35.2%;
	right: 49%;
	top:31%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.5s;
	animation-fill-mode: forwards;
}
.factory02{
	z-index: 70;
	position: absolute;
	left: 58.5%;
	right: 18.2%;
	top:51%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.7s;
	animation-fill-mode: forwards;
}
.library{
	z-index: 50;
	position: absolute;
	left: 79%;
	right: 7%;
	top:67%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.7s;
	animation-fill-mode: forwards;
}
.plaza{
	z-index: 50;
	position: absolute;
	left: 70.5%;
	right: 6.0%;
	top:17.3%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.6s;
	animation-fill-mode: forwards;
}
.plazaman{
	z-index: 51;
	position: absolute;
	left: 70.3%;
	right:27.6%;
	top:42%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 2.6s;
	animation-fill-mode: forwards;
}
.fountainman{
	z-index: 51;
	position: absolute;
	left: 49%;
	right:49.3%;
	top:10%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 2.6s;
	animation-fill-mode: forwards;
}
.buildingman{
	z-index: 51;
	position: absolute;
	left: 19%;
	right:79.9%;
	top:27%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 2.6s;
	animation-fill-mode: forwards;
}
.suitman{
	position: absolute;
	left: 52%;
	right:46.8%;
	top:45%;
	animation: suit 10s infinite linear;
	opacity: 0;
	animation-delay: 2.6s;
}
@keyframes suit {
  0%{
	  	z-index: 30;
	  	transform: translate(0,0);
	  	background-position: 0 0;
        opacity: 0;
	}
    10%{
        transform: translate(0,0);
	  	background-position: 0 0;
        opacity: 1;
    }
    90%{
        z-index: 30;
	  	transform: translate(-440%,170%);
		 background-position: 100% 0;
         opacity: 1;
    }
	 100%{
		 z-index: 30;
	  	transform: translate(-440%,170%);
		 background-position: 100% 0;
         opacity: 0;
	}
}
.conveniman{
	z-index: 51;
	position: absolute;
	left: 22%;
	right:76.0%;
	top:64%;
	animation: conveni 10s linear infinite;
	opacity: 0;
    animation-delay: 2.6s;
}
@keyframes conveni {
  0%{
	  	z-index: 30;
	  	transform: translate(0,0);
	  	background-position: 0 0;
        opacity: 0;
	}
    10%{
        transform: translate(0,0);
	  	background-position: 0 0;
        opacity: 1;
    }
    80%{
        z-index: 30;
	  	transform: translate(-380%,-150%);
		 background-position: 100% 0;
         opacity: 1;
    }
    80.001%{
        z-index: 9;
	  	transform: translate(-380%,-150%);
		 background-position: 100% 0;
         opacity: 1;
    }
	 100%{
		 z-index: 9;
	  	transform: translate(-300%,-220%);
		 background-position: 100% 0;
        opacity: 1;
	}
}
.parkman{
	z-index: 51;
	position: absolute;
	left: 42.5%;
	right:56.3%;
	top:77%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 2.6s;
	animation-fill-mode: forwards;
}
.swingwoman{
	z-index: 51;
	position: absolute;
	left: 33%;
	right:62.0%;
	top:72%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 2.6s;
	animation-fill-mode: forwards;
}
.cafeman{
	z-index: 51;
	position: absolute;
	left: 15.2%;
	right:83.7%;
	top:80%;
	animation: cafeman 10s linear infinite;
	opacity: 0;
    animation-delay: 2.6s;
}
@keyframes cafeman {
  0%{
	  	z-index: 30;
	  	transform: translate(0,0);
	  	background-position: 0 0;
        opacity: 0;
	}
    10%{
        transform: translate(0,0);
	  	background-position: 0 0;
        opacity: 1;
    }
    80%{
		 z-index: 30;
	  	transform: translate(-270%,-160%);
		 background-position: 100% 0;
        opacity: 1;
	}
    80.01%{
		 z-index: 30;
	  	transform: translate(-225%,-140%);
		 background-position: 100% 0;
        opacity: 0;
	}
	 100%{
		 z-index: 30;
	  	transform: translate(-220%,-140%);
		 background-position: 100% 0;
        opacity: 0;
	}
}
.cafemanstop{
	z-index: 51;
	position: absolute;
	left: 12.5%;
	right:87%;
	top:75%;
	animation: cafemanstop 10s linear infinite;
	opacity: 0;
    animation-delay: 2.6s;
}
@keyframes cafemanstop {
  0%{
	  	z-index: 30;
        opacity: 0;
	}
    10%{
        opacity: 0;
    }
    79.9%{
		 z-index: 30;
        opacity: 0;
	}
    80%{
		 z-index: 30;
        opacity: 1;
	}
    95%{
		 z-index: 30;
        opacity: 1;
	}
	 100%{
		 z-index: 30;
        opacity: 0;
	}
}
.hospital{
	z-index: 10;
	position: absolute;
	left: 54%;
	right: 28%;
	top:7.3%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.6s;
	animation-fill-mode: forwards;
}
.newfactory{
	z-index: 44;
	position: absolute;
	left: 51%;
	right: 38%;
	top:29%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.5s;
	animation-fill-mode: forwards;
}
.company{
	z-index: 43;
	position: absolute;
	left: 48.2%;
	right: 45.4%;
	top:17.7%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.5s;
	animation-fill-mode: forwards;
}
.warehouse{
	z-index: 41;
	position: absolute;
	left: 40%;
	right: 49.5%;
	top:22%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.5s;
	animation-fill-mode: forwards;
}
.hut{
	z-index: 30;
	position: absolute;
	left: 51%;
	right: 45%;
	top:45%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.5s;
	animation-fill-mode: forwards;
}
.fountain{
	z-index: 10;
	position: absolute;
	left: 41%;
	right: 48.9%;
	top:6.5%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.7s;
	animation-fill-mode: forwards;
}
.building{
	z-index: 30;
	position: absolute;
	left: 15.5%;
	right: 57%;
	top:4.5%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.7s;
	animation-fill-mode: forwards;
}
.shop{
	z-index: 60;
	position: absolute;
	left: 8.5%;
	right: 76.3%;
	top:23%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.8s;
	animation-fill-mode: forwards;
}
.conveni{
	z-index: 10;
	position: absolute;
	left: 16%;
	right: 76%;
	top:51.5%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.7s;
	animation-fill-mode: forwards;
}
.gs{
	z-index: 30;
	position: absolute;
	left: 22%;
	right: 64.5%;
	top:59.7%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.7s;
	animation-fill-mode: forwards;
}
.cafe{
	z-index: 10;
	position: absolute;
	left: 3%;
	right: 83%;
	top:59.7%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.7s;
	animation-fill-mode: forwards;
}
.park{
	z-index: 50;
	position: absolute;
	left: 32%;
	right: 44.6%;
	top:63.8%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.7s;
	animation-fill-mode: forwards;
}
.home01{
	z-index: 60;
	position: absolute;
	left: 23.5%;
	right: 68%;
	top: 46.5%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.6s;
	animation-fill-mode: forwards;
}
.home02{
	z-index: 80;
	position: absolute;
	left: 32%;
	right: 59.5%;
	top: 52.5%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.6s;
	animation-fill-mode: forwards;
}
.home03{
	z-index: 80;
	position: absolute;
	left: 60%;
	right: 30%;
	top: 43.5%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.6s;
	animation-fill-mode: forwards;
}
.home04{
	z-index: 80;
	position: absolute;
	left: 52%;
	right: 38%;
	top: 53%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.6s;
	animation-fill-mode: forwards;
}
.sign{
	z-index: 50;
	position: absolute;
	left: 60.5%;
	right: 37.5%;
	top:38%;
	animation: woods 1.0s;
	opacity: 0;
	animation-delay: 1.5s;
	animation-fill-mode: forwards;
}
.woods_right01{
	z-index: 30;
	position: absolute;
	left: 55.5%;
	right: 30.5%;
	top:16.5%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_right02{
	z-index: 60;
	position: absolute;
	left: 69%;
	right: 30%;
	top:38%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_right03{
	z-index: 60;
	position: absolute;
	left: 84%;
	right: 14%;
	top:53%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_right04{
	z-index: 60;
	position: absolute;
	left: 20%;
	right: 79%;
	top:28%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_right05{
	z-index: 60;
	position: absolute;
	left: 23%;
	right: 76%;
	top:31%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_right06{
	z-index: 60;
	position: absolute;
	left: 33%;
	right: 66%;
	top:25%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_right07{
	z-index: 60;
	position: absolute;
	left: 40%;
	right: 59%;
	top:19%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_left01{
	z-index: 40;
	position: absolute;
	left: 7.0%;
	right: 78%;
	top:28%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_left02{
	z-index: 50;
	position: absolute;
	left: 30%;
	right: 65.5%;
	top:36%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_left03{
	z-index: 50;
	position: absolute;
	left: 7.5%;
	right: 80%;
	top:31.5%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_bottom01{
	z-index: 30;
	position: absolute;
	left: 49%;
	right: 45%;
	top:61%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_bottom02{
	z-index: 80;
	position: absolute;
	left: 69%;
	right: 25%;
	top:81.5%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_bottom03{
	z-index: 80;
	position: absolute;
	left: 92%;
	right: 5%;
	top:72.5%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_bottom04{
	z-index: 80;
	position: absolute;
	left: 12%;
	right: 79%;
	top:68%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_top01{
	z-index: 30;
	position: absolute;
	left: 39%;
	right: 54%;
	top:10%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_center01{
	z-index: 50;
	position: absolute;
	left: 57%;
	right: 40%;
	top:38.5%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_center02{
	z-index: 10;
	position: absolute;
	left: 42%;
	right: 49%;
	top:52.6%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.woods_center03{
	z-index: 50;
	position: absolute;
	left: 22%;
	right: 73%;
	top:43%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.loadlight01{
	z-index: 70;
	position: absolute;
	left: 68%;
	right: 30%;
	top:80%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.loadlight02{
	z-index: 70;
	position: absolute;
	left: 56.5%;
	right: 41.5%;
	top:67%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.loadlight03{
	z-index: 51;
	position: absolute;
	left: 41%;
	right: 57%;
	top:50%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.loadlight04{
	z-index: 40;
	position: absolute;
	left: 40%;
	right: 58%;
	top:9%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.loadlight05{
	z-index: 60;
	position: absolute;
	left: 73%;
	right: 25%;
	top:43%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.loadlight06{
	z-index: 60;
	position: absolute;
	left: 81%;
	right: 17%;
	top:51.5%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.loadlight07{
	z-index: 60;
	position: absolute;
	left: 60%;
	right: 38%;
	top:30%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.loadlight08{
	z-index: 60;
	position: absolute;
	left: 28%;
	right: 70%;
	top:36%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.loadlight09{
	z-index: 60;
	position: absolute;
	left: 7%;
	right: 91%;
	top:51%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.loadlight10{
	z-index: 60;
	position: absolute;
	left: 24%;
	right: 74%;
	top:69%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.signal01{
	z-index: 20;
	position: absolute;
	left: 65%;
	right: 34%;
	top:35%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.signal02{
	z-index: 20;
	position: absolute;
	left: 46%;
	right: 53%;
	top:14%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.signal03{
	z-index: 40;
	position: absolute;
	left: 26.5%;
	right: 72.5%;
	top:35%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.signal04{
	z-index: 20;
	position: absolute;
	left: 46%;
	right: 53%;
	top:55.5%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.signal05{
	z-index: 70;
	position: absolute;
	left: 44%;
	right: 55%;
	top:57.3%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.signal06{
	z-index: 41;
	position: absolute;
	left: 24.8%;
	right: 74.2%;
	top:36.5%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.signal07{
	z-index: 41;
	position: absolute;
	left: 44%;
	right: 55%;
	top:16%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.signal08{
	z-index: 41;
	position: absolute;
	left: 63%;
	right: 36%;
	top:37%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.signal09{
	z-index: 30;
	position: absolute;
	left: 85.5%;
	right: 13.5%;
	top:57%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.signal10{
	z-index: 60;
	position: absolute;
	left: 66.5%;
	right: 32.5%;
	top: 77.5%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.signal11{
	z-index: 60;
	position: absolute;
	left: 83.5%;
	right: 15.5%;
	top: 58.5%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.signal12{
	z-index: 60;
	position: absolute;
	left: 64.5%;
	right: 34.5%;
	top: 79%;
	animation: woods 1.0s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
@keyframes woods {
  0%{
		opacity:0;
	  	transform: translate(0,2vh)
	}
	
	100% {
		opacity:1;
		transform: translate(0,0)
	}
}
.fadein{
	width: 0;
	height: 0;
}
.neocity_icon01{
	z-index: 300;
	opacity: 0;
	left: 52%;
	top:46%;
	position: absolute;
}
.neocity_icon01 img{
	height: 100px;
}
.neocity_icon02{
	z-index: 300;
	opacity: 0;
	left: 61%;
	top:36%;
	position: absolute;
}
.neocity_icon02 img{
	height: 100px;
}
.neocity_icon03{
	z-index: 300;
	opacity: 0;
	left: 32%;
	top:44%;
	position: absolute;
}
.neocity_icon03 img{
	height: 100px;
}
.neocity_icon04{
	z-index: 300;
	opacity: 0;
	left: 24%;
	top:38%;
	position: absolute;
}
.neocity_icon04 img{
	height: 100px;
}
.neocity_icon05{
	z-index: 300;
	opacity: 0;
	left: 34%;
	top:24%;
	position: absolute;
}
.neocity_icon05 img{
	height: 100px;
}
.neocity_icon06{
	z-index: 300;
	opacity: 0;
	left: 55%;
	top:25%;
	position: absolute;
}
.neocity_icon06 img{
	height: 100px;
}
.neocity_icon07{
	z-index: 300;
	opacity: 0;
	left: 45%;
	top: 16%;
	position: absolute;
}
.neocity_icon07 img{
	height: 100px;
}

/*----------業務案内----------*/
#neocity_location{
	cursor: pointer;

}
.neocity_business_wrapper{
	width: 100%;
	position: relative;
}
.background_business{
	z-index: -1;
	animation: background_a 0.6s;
    animation-delay: 1.0s;
	opacity: 0;
    animation-fill-mode: forwards;
}
.background_back{
	animation: background_back 0.6s;
	animation-fill-mode: forwards;
}
.premises{
	z-index: 5;
	position: absolute;
	left: 28%;
	right:42%;
	top: 39%;
	animation: pakking 0.6s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.premises_back{
	animation: premises_back 0.6s;
	animation-fill-mode: forwards;
}
.strage_illust{
	z-index: 2;
	position: absolute;
	left: 42%;
	right: 42%;
	top: 4%;
	animation: strage 0.6s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.strage_illust_back{
	animation: strage_back 0.6s;
	animation-fill-mode: forwards;
}
.pikking{
	z-index: 2;
	position: absolute;
	left: 13%;
	right: 63%;
	top:17%;
	animation: pikking 0.8s;
    animation-delay: 1.0s;
    opacity: 0;
    animation-fill-mode: forwards;
}
.pikking_back{
	animation: pikking_back 0.8s;
	animation-fill-mode: forwards;
}
.focklift{
	position: absolute;
	left: 35%;
	right: 53%;
	top:28%;
	animation: fockliftfadeIn 20s infinite linear;
	animation-delay: 1s;
	opacity: 0;
    animation-fill-mode: forwards;
}
.focklift_back{
	animation: focklift_back 0.8s;
	animation-fill-mode: forwards;
}
@keyframes fockliftfadeIn {
  0%{
	  	z-index: 10;
		opacity:0;
	  	transform: translate(0,0)
	}
	 10%{
		opacity:1;
	  	transform: translate(0,0)
	}
	
	100% {
		z-index: 10;
		opacity:1;
		transform: translate(-600%,350%)
	}
}
@keyframes focklift_back {
  0%{
		opacity:0;
	}
	100% {
		opacity:0;
	}
}
@keyframes president {
  0%{
		opacity:0;
	  	transform: translate(50vw,50vh)
	}
	100% {
		opacity:1;
		transform: translate(0,0)
	}
}
@keyframes president_back {
  0%{
		opacity:1;
	  	transform: translate(0,0)
	}
	100% {
		opacity:0;
		transform: translate(20vw,20vh)
	}
}
@keyframes background_a {
  0%{
		opacity:0;
	  	transform: translate(0,5vh)
	}
	
	100% {
		opacity:1;
		transform: translate(0,0)
	}
}
@keyframes background_back {
  0%{
		opacity:1;
	  	transform: translate(0,0)
	}
	100% {
		opacity:0;
		transform: translate(0,10vh)
	}
}
@keyframes pakking {
  0%{
		opacity:1;
	  	transform: translate(-50vw,50vh)
	}
	100% {
		opacity:1;
		transform: translate(0,0)
	}
}
@keyframes premises_back {
  0%{
		opacity:1;
	  	transform: translate(0,0)
	}
	100% {
		opacity:0;
		transform: translate(-20vw,20vh)
	}
}
@keyframes strage {
  0%{
		opacity:0;
	  	transform: translate(50vw,-50vh)
	}
	100% {
		opacity:1;
		transform: translate(0,0)
	}
}
@keyframes strage_back {
  0%{
		opacity:1;
	  	transform: translate(0,0)
	}
	100% {
		opacity:0;
		transform: translate(20vw,-20vh)
	}
}
@keyframes pikking {
  0%{
		opacity:0;
	  	transform: translate(-50vw,-50vh)
	}
	100% {
		opacity:1;
		transform: translate(0,0)
	}
}
@keyframes pikking_back {
  0%{
		opacity:1;
	  	transform: translate(0,0)
	}
	100% {
		opacity:0;
		transform: translate(-20vw,-20vh)
	}
}
.handlift{
	z-index: 2;
	position: absolute;
	left: 53%;
	right: 40%;
	top:19%;
	animation: strage 0.5s;
    animation-delay: 1s;
	opacity: 0;
    animation-fill-mode: forwards;
}
.handlift_back{
	animation: strage_back 0.6s;
	animation-fill-mode: forwards;
}
.presidentmessage{
	z-index: 2;
	position: absolute;
	left: 65%;
	right: 26%;
	top:37%;
	animation: president 0.6s;
    animation-delay: 1s;
	opacity: 0;
    animation-fill-mode: forwards;
}
.presidentmessage_back{
	animation: president_back 1.2s;
	animation-fill-mode: forwards;
}
.bulk{
	z-index: 2;
	position: absolute;
	left: 76%;
	right: 16%;
	top:41%;
	animation: president 0.8s;
    animation-delay: 1s;
	opacity: 0;
    animation-fill-mode: forwards;
}
.bulk_back{
	animation: president_back 1.2s;
	animation-fill-mode: forwards;
}
.pc{
	z-index: 2;
	position: absolute;
	left: 65%;
	right: 8%;
	top:58%;
	animation: president 0.7s;
    animation-delay: 1s;
	opacity: 0;
    animation-fill-mode: forwards;
}
.pc_back{
	animation: president_back 1.0s;
	animation-fill-mode: forwards;
}
.bulk_back{
	animation: president_back 1.2s;
	animation-fill-mode: forwards;
}
.meeting{
	z-index: 2;
	position: absolute;
	left: 48%;
	right: 37%;
	top:68%;
	animation: president 0.85s;
    animation-delay: 1s;
	opacity: 0;
    animation-fill-mode: forwards;
}
.meeting_back{
	animation: president_back 1.1s;
	animation-fill-mode: forwards;
}
.pakking{
	z-index: 2;
	position: absolute;
	left: 12%;
	right: 71%;
	top:62%;
	animation: pakking 0.7s;
    animation-delay: 1s;
	opacity: 0;
    animation-fill-mode: forwards;
}
.pakking_shadow{
	z-index: 2;
	position: absolute;
	left: 12%;
	right: 71%;
	top:73%;
	animation: pakking 0.7s;
    animation-delay: 1s;
	opacity: 0;
    animation-fill-mode: forwards;
}
.pakking_back{
	animation: premises_back 1.0s;
	animation-fill-mode: forwards;
}
.red{
	color: red;
}
.business_icon01{
	z-index: 10;
	height: 90px;
	position: absolute;
	left: 15%;
	top:29%;
}
.business_icon01 img{
	height: 90px;
}
.business_icon02{
	z-index: 10;
	height: 90px;
	position: absolute;
	left: 72%;
	top:33%;
}
.business_icon02 img{
	height: 90px;
}
.business_icon03{
	z-index: 10;
	height: 90px;
	position: absolute;
	left: 10%;
	top:63%;
}
.business_icon03 img{
	height: 90px;
}
.business_icon04{
	z-index: 10;
	height: 90px;
	position: absolute;
	left: 36%;
	top:40%;
}
.business_icon04 img{
	height: 90px;
}
.business_icon05{
	z-index: 10;
	height: 90px;
	position: absolute;
	left: 46%;
	top:5%;
}
.business_icon05 img{
	height: 90px;
}
@keyframes focklifticon {
  0%{
	  	transform: translate(0%,0%);
	}
	 10%{
	  	transform: translate(0%,0%);
	}
	
	100% {
		transform: translate(-58vw,50vh);
	}
}
.movie_icon04{
	z-index: 10;
	position: absolute;
	left: 20%;
	top:58%;
}
.movie_icon04 img{
	height: 40px;
}
.movie_icon05{
	z-index: 10;
	position: absolute;
	left: 27%;
	top:20%;
}
.movie_icon05 img{
	height: 40px;
}
.movie_icon06{
	z-index: 10;
	position: absolute;
	left: 63%;
	top:30%;
}
.movie_icon06 img{
	height: 40px;
}
.movie_icon07{
	z-index: 10;
	position: absolute;
	left: 50%;
	top:50%;
}
.movie_icon07 img{
	height: 40px;
}
.movie_icon08{
	z-index: 10;
	position: absolute;
	left: 50%;
	top:10%;
}
.movie_icon08 img{
	height: 40px;
}
.movie_icon09{
	z-index: 10;
	position: absolute;
	left: 82%;
	top:37%;
}
.movie_icon09 img{
	height: 40px;
}
@keyframes focklifticon {
  0%{
	  	transform: translate(0%,0%);
	}
	 10%{
	  	transform: translate(0%,0%);
	}
	
	100% {
		transform: translate(-58vw,50vh);
	}
}
@media screen and (max-width: 1450px) {
.neocity_icon01{
	z-index: 300;
	opacity: 0;
	left: 52%;
	top:46%;
	position: absolute;
}
iframe{
    width: 100%;
    height: 500px;
}
.neocity_icon01 img{
	height: 80px;
}
.neocity_icon02{
	z-index: 300;
	opacity: 0;
	left: 61%;
	top:36%;
	position: absolute;
}
.neocity_icon02 img{
	height: 80px;
}
.neocity_icon03{
	z-index: 300;
	opacity: 0;
	left: 32%;
	top:44%;
	position: absolute;
}
.neocity_icon03 img{
	height: 80px;
}
.neocity_icon04{
	z-index: 300;
	opacity: 0;
	left: 24%;
	top:38%;
	position: absolute;
}
.neocity_icon04 img{
	height: 80px;
}
.neocity_icon05{
	z-index: 300;
	opacity: 0;
	left: 34%;
	top:24%;
	position: absolute;
}
.neocity_icon05 img{
	height: 80px;
}
.neocity_icon06{
	z-index: 300;
	opacity: 0;
	left: 55%;
	top:25%;
	position: absolute;
}
.neocity_icon06 img{
	height: 80px;
}
.neocity_icon07{
	z-index: 300;
	opacity: 0;
	left: 45%;
	top: 16%;
	position: absolute;
}
.neocity_icon07 img{
	height: 80px;
}
.business_icon01{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 15%;
	top:29%;
}
.business_icon01 img{
	height: 70px;
}
.business_icon02{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 72%;
	top:33%;
}
.business_icon02 img{
	height: 70px;
}
.business_icon03{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 10%;
	top:63%;
}
.business_icon03 img{
	height: 70px;
}
.business_icon04{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 36%;
	top:40%;
}
.business_icon04 img{
	height: 70px;
}
.business_icon05{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 40%;
	top:5%;
}
.business_icon05 img{
	height: 70px;
}
.movie_icon04{
	z-index: 10;
	position: absolute;
	left: 20%;
	top:58%;
}
.movie_icon04 img{
	height: 30px;
}
.movie_icon05{
	z-index: 10;
	position: absolute;
	left: 27%;
	top:20%;
}
.movie_icon05 img{
	height: 30px;
}
.movie_icon06{
	z-index: 10;
	position: absolute;
	left: 63%;
	top:30%;
}
.movie_icon06 img{
	height: 30px;
}
.movie_icon07{
	z-index: 10;
	position: absolute;
	left: 50%;
	top:50%;
}
.movie_icon07 img{
	height: 30px;
}
.movie_icon08{
	z-index: 10;
	position: absolute;
	left: 50%;
	top:10%;
}
.movie_icon08 img{
	height: 30px;
}
.movie_icon09{
	z-index: 10;
	position: absolute;
	left: 82%;
	top:37%;
}
.movie_icon09 img{
	height: 30px;
}
}
@media screen and (max-width: 1100px) {
.neocity_icon01{
	z-index: 300;
	opacity: 0;
	left: 52%;
	top:46%;
	position: absolute;
}
    iframe{
    width: 100%;
    height: 500px;
}
.neocity_icon01 img{
	height: 70px;
}
.neocity_icon02{
	z-index: 300;
	opacity: 0;
	left: 61%;
	top:36%;
	position: absolute;
}
.neocity_icon02 img{
	height: 70px;
}
.neocity_icon03{
	z-index: 300;
	opacity: 0;
	left: 32%;
	top:44%;
	position: absolute;
}
.neocity_icon03 img{
	height: 70px;
}
.neocity_icon04{
	z-index: 300;
	opacity: 0;
	left: 24%;
	top:38%;
	position: absolute;
}
.neocity_icon04 img{
	height: 70px;
}
.neocity_icon05{
	z-index: 300;
	opacity: 0;
	left: 34%;
	top:24%;
	position: absolute;
}
.neocity_icon05 img{
	height: 70px;
}
.neocity_icon06{
	z-index: 300;
	opacity: 0;
	left: 55%;
	top:25%;
	position: absolute;
}
.neocity_icon06 img{
	height: 70px;
}
.neocity_icon07{
	z-index: 300;
	opacity: 0;
	left: 45%;
	top: 16%;
	position: absolute;
}
.neocity_icon07 img{
	height: 70px;
}
.business_icon01{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 15%;
	top:29%;
}
.business_icon01 img{
	height: 55px;
}
.business_icon02{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 72%;
	top:33%;
}
.business_icon02 img{
	height: 55px;
}
.business_icon03{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 10%;
	top:63%;
}
.business_icon03 img{
	height: 55px;
}
.business_icon04{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 34%;
	top:40%;
}
.business_icon04 img{
	height: 55px;
}
.business_icon05{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 46%;
	top:5%;
}
.business_icon05 img{
	height: 55px;
}
.movie_icon04{
	z-index: 10;
	position: absolute;
	left: 20%;
	top:58%;
}
.movie_icon04 img{
	height: 25px;
}
.movie_icon05{
	z-index: 10;
	position: absolute;
	left: 27%;
	top:20%;
}
.movie_icon05 img{
	height: 25px;
}
.movie_icon06{
	z-index: 10;
	position: absolute;
	left: 63%;
	top:30%;
}
.movie_icon06 img{
	height: 25px;
}
.movie_icon07{
	z-index: 10;
	position: absolute;
	left: 50%;
	top:40%;
}
.movie_icon07 img{
	height: 25px;
}
.movie_icon08{
	z-index: 10;
	position: absolute;
	left: 50%;
	top:10%;
}
.movie_icon08 img{
	height: 25px;
}
.movie_icon09{
	z-index: 10;
	position: absolute;
	left: 82%;
	top:37%;
}
.movie_icon09 img{
	height: 25px;
}
}
/* モーダルCSS */
.modalAreas {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
    z-index: 500;
}
.modalBg {
  width: 100%;
  height: 100%;
  background-color: rgba(30,30,30,0.9);
    z-index: 500;
}
video{
	width: 100%;
}
.modalWrapper {
	z-index: 500;
  position: absolute;
  top: 50%;
  left: 50%;
  transform:translate(-50%,-50%);
  width: 100%;
  height: 100%;
  max-width: 980px;
  max-height: 600px;
  background-color: #fff;
}
.modalWrapper_video {
  position: absolute;
  top: 50%;
  left: 50%;
	z-index: 1000;
  transform:translate(-50%,-50%);
  width: 100%;
  height: 100%;
  max-width: 980px;
  max-height: 500px;
  background-color: #fff;
}
.closeModal {
  position: absolute;
  top: -1.5rem;
  right: 1rem;
  cursor: pointer;
    color: #FFFFFF;
}

#modal-bg {
　　display:none;
　　width:100%;
　　height:100%;
　　background-color: rgba(0,0,0,0.5);
　　position:fixed;
　　top:0;
　　left:0;
　　z-index: 1000;
}
.modal_flex_01{
	display: flex;
	margin: 20px 0 0 0;
}
.pikking_img_01{
	margin: 130px 0 0 150px;
}
.modal_text_01{
	margin: 150px 0 0 100px;
	width: 500px;
}
.modal_head_01{
	font-family: 'Sawarabi Mincho', sans-serif;
	font-size: 2.5em;
}
.modal_line{
	border: 1px solid #000000;
	width: 60px;
	margin: 20px 0 0 0;
}
.modal_subtext_01{
	margin: 20px 0 0 0;
	font-size: 1.3em;
	width: 450px;
}
.modal_flex_02{
	display: flex;
	margin: 40px 0 0 0;
}
.pikking_img_02{
	margin: 150px 0 0 150px;
}
.modal_text_02{
	margin: 120px 0 0 100px;
	width: 500px;
}
.modal_head_02{
	font-family: 'Sawarabi Mincho', sans-serif;
	font-size: 2.5em;
}
.modal_line{
	border: 1px solid #000000;
	width: 60px;
	margin: 20px 0 0 0;
}
.modal_subtext_02{
	margin: 20px 0 0 0;
	font-size: 1.3em;
	width: 450px;
}
.modal_flex_03{
	display: flex;
	margin: 50px 0 0 0;
}
.pikking_img_03{
	margin: 130px 0 0 130px;
}
.modal_text_03{
	margin: 130px 0 0 100px;
	width: 500px;
}
.modal_head_03{
	font-family: 'Sawarabi Mincho', sans-serif;
	font-size: 2.5em;
}
.modal_line{
	border: 1px solid #000000;
	width: 60px;
	margin: 20px 0 0 0;
}
.modal_subtext_03{
	margin: 20px 0 0 0;
	font-size: 1.3em;
	width: 450px;
}
.modal_flex_04{
	display: flex;
	margin: 20px 0 0 0;
}
.pikking_img_04{
	margin: 130px 0 0 130px;
}
.modal_text_04{
	margin: 160px 0 0 70px;
	width: 500px;
}
.modal_head_04{
	font-family: 'Sawarabi Mincho', sans-serif;
	font-size: 2.5em;
}
.modal_line{
	border: 1px solid #000000;
	width: 60px;
	margin: 20px 0 0 0;
}
.modal_subtext_04{
	margin: 20px 0 0 0;
	font-size: 1.3em;
	width: 450px;
}
.modal_flex_05{
	display: flex;
	margin: 70px 0 0 0;
}
.pikking_img_05{
	margin: 130px 0 0 100px;
}
.modal_text_05{
	margin: 100px 0 0 70px;
	width: 500px;
}
.modal_head_05{
	font-family: 'Sawarabi Mincho', sans-serif;
	font-size: 2.5em;
}
.modal_line{
	border: 1px solid #000000;
	width: 60px;
	margin: 20px 0 0 0;
}
.modal_subtext_05{
	margin: 20px 0 0 0;
	font-size: 1.3em;
	width: 450px;
}
@media screen and (max-width: 1024px) {
	html,body{
	overflow-x:auto;
	width: 100%;
	height: auto;
}
.neocity_wrapper{
	width: 1900px;
	margin: 20px 0 0 0;
	position: relative;
	overflow: hidden;
}
.neocity_business_wrapper{
	width: 1900px;
	margin: 60px 0 0 0;
	position: relative;
}
.neocity_icon01{
	z-index: 300;
	opacity: 0;
	left: 52%;
	top:46%;
	position: absolute;
}
.neocity_icon01 img{
	height: 100px;
}
.neocity_icon02{
	z-index: 300;
	opacity: 0;
	left: 61%;
	top:36%;
	position: absolute;
}
.neocity_icon02 img{
	height: 100px;
}
.neocity_icon03{
	z-index: 300;
	opacity: 0;
	left: 32%;
	top:44%;
	position: absolute;
}
.neocity_icon03 img{
	height: 100px;
}
.neocity_icon04{
	z-index: 300;
	opacity: 0;
	left: 24%;
	top:38%;
	position: absolute;
}
.neocity_icon04 img{
	height: 100px;
}
.neocity_icon05{
	z-index: 300;
	opacity: 0;
	left: 34%;
	top:24%;
	position: absolute;
}
.neocity_icon05 img{
	height: 100px;
}
.neocity_icon06{
	z-index: 300;
	opacity: 0;
	left: 55%;
	top:25%;
	position: absolute;
}
.neocity_icon06 img{
	height: 100px;
}
.neocity_icon07{
	z-index: 300;
	opacity: 0;
	left: 45%;
	top: 16%;
	position: absolute;
}
.neocity_icon07 img{
	height: 100px;
}
.movie_icon07 img{
	height: 25px;
		opacity: 1;
}
.business_icon01{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 15%;
	top:29%;
}
.business_icon01 img{
	height: 100px;
}
.business_icon02{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 72%;
	top:33%;
}
.business_icon02 img{
	height: 100px;
}
.business_icon03{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 10%;
	top:63%;
}
.business_icon03 img{
	height: 100px;
}
.business_icon04{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 34%;
	top:40%;
}
.business_icon04 img{
	height: 100px;
}
.business_icon05{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 46%;
	top:5%;
}
.business_icon05 img{
	height: 100px;
}
.movie_icon04{
	z-index: 10;
	position: absolute;
	left: 20%;
	top:58%;
}
.movie_icon04 img{
	height: 40px;
}
.movie_icon05{
	z-index: 10;
	position: absolute;
	left: 27%;
	top:20%;
}
.movie_icon05 img{
	height: 40px;
}
.movie_icon06{
	z-index: 10;
	position: absolute;
	left: 63%;
	top:30%;
}
.movie_icon06 img{
	height: 40px;
}
.movie_icon07{
	z-index: 10;
	position: absolute;
	left: 50%;
	top:40%;
}
.movie_icon07 img{
	height: 40px;
}
.movie_icon08{
	z-index: 10;
	position: absolute;
	left: 50%;
	top:10%;
}
.movie_icon08 img{
	height: 40px;
}
.movie_icon09{
	z-index: 10;
	position: absolute;
	left: 82%;
	top:37%;
}
.movie_icon09 img{
	height: 40px;
}
.modalAreas {
  display: none;
  position: fixed;
  z-index: 1000; /*サイトによってここの数値は調整 */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.modalBg {
  width: 100%;
  height: 100%;
  background-color: rgba(30,30,30,0.9);
}
video{
	width: 100%;
}
.modalWrapper {
    z-index: 100px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform:translate(-50%,-50%);
  width: 100%;
  height: 100%;
  max-width: 980px;
  max-height: 600px;
  background-color: #fff;
}
.modalWrapper_video {
  position: absolute;
  top: 50%;
  left: 50%;
	z-index: 100px;
  transform:translate(-50%,-50%);
  width: 100%;
  height: 100%;
  max-width: 980px;
  max-height: 432px;
  background-color: #fff;
}
.closeModal {
  position: absolute;
  top: -1.5rem;
  right: 1rem;
  cursor: pointer;
    color: #FFFFFF;
}

#modal-bg {
　　display:none;
　　width:100%;
　　height:100%;
　　background-color: rgba(0,0,0,0.5);
　　position:fixed;
　　top:0;
　　left:0;
　　z-index: 200;
}
.modal_flex_01{
	display: block;
	margin: 50px 0 0 0;
}
.pikking_img_01{
	margin: 0 auto;
    text-align: center;
}
.pikking_img_01 img{
	width: 100px;
}
.modal_text_01{
	margin: 30px auto 0;
	width: 410px;
}
.modal_head_01{
	font-family: 'Sawarabi Mincho', sans-serif;
	font-size: 2.5em;
    margin: 0 0 0 50px;
}
.modal_line{
	border: 1px solid #000000;
	width: 60px;
	margin: 20px auto 0;
}
.modal_subtext_01{
	margin: 20px 0 0 0;
	font-size: 1.3em;
	width: 450px;
}
.modal_flex_02{
	display: block;
	margin: 70px 0 0 0;
}
.pikking_img_02{
	margin: 0 auto;
    text-align: center;
}
.pikking_img_02 img{
	width: 100px;
}
.modal_text_02{
	margin: 30px auto 0;
	width: 410px;
}
.modal_head_02{
	font-family: 'Sawarabi Mincho', sans-serif;
	font-size: 2.5em;
    text-align: center;
}
.modal_subtext_02{
	margin: 20px 0 0 0;
	font-size: 1.3em;
	width: 450px;
}
.modal_flex_03{
	display: block;
	margin: 70px 0 0 0;
}
.pikking_img_03{
	margin: 0 auto;
    text-align: center;
}
.pikking_img_03 img{
	width: 150px;
}
.modal_text_03{
	margin: 30px auto 0;
	width: 410px;
}
.modal_head_03{
	font-family: 'Sawarabi Mincho', sans-serif;
	font-size: 2.5em;
    text-align: center;
}
.modal_subtext_03{
	margin: 20px 0 0 0;
	font-size: 1.3em;
	width: 450px;
}
.modal_flex_04{
	display: block;
	margin: 50px 0 0 0;
}
.pikking_img_04{
	margin: 0 auto;
    text-align: center;
}
.pikking_img_04 img{
	width: 160px;
}
.modal_text_04{
	margin: 30px auto 0;
	width: 410px;
}
.modal_head_04{
	font-family: 'Sawarabi Mincho', sans-serif;
	font-size: 2.5em;
    text-align: center;
}
.modal_subtext_04{
	margin: 20px 0 0 0;
	font-size: 1.3em;
	width: 450px;
}
.modal_flex_05{
	display: block;
	margin: 70px 0 0 0;
}
.pikking_img_05{
	margin: 0 auto;
    text-align: center;
}
.pikking_img_05 img{
	width: 180px;
}
.modal_text_05{
	margin: 30px auto 0;
	width: 410px;
}
.modal_head_05{
	font-family: 'Sawarabi Mincho', sans-serif;
	font-size: 2.5em;
    text-align: center;
}
.modal_subtext_05{
	margin: 20px 0 0 0;
	font-size: 1.3em;
	width: 450px;
}
}
@media screen and (max-width: 414px) {
	html,body{
	overflow-x:auto;
	width: 100%;
	height: auto;
}
iframe{
    width: 100%;
    height: 220px;
}
.neocity_wrapper{
	width: 1330px;
	margin:30px 0 0 0;
	position: relative;

	overflow: hidden;
}
.neocity_business_wrapper{
	width: 1330px;	
    margin:60px 0 0 0;
	position: relative;
}
.neocity_icon01{
	z-index: 300;
	opacity: 0;
	left: 52%;
	top:46%;
	position: absolute;
}
.neocity_icon01 img{
	height: 70px;
}
.neocity_icon02{
	z-index: 300;
	opacity: 0;
	left: 61%;
	top:36%;
	position: absolute;
}
.neocity_icon02 img{
	height: 70px;
}
.neocity_icon03{
	z-index: 300;
	opacity: 0;
	left: 32%;
	top:44%;
	position: absolute;
}
.neocity_icon03 img{
	height: 70px;
}
.neocity_icon04{
	z-index: 300;
	opacity: 0;
	left: 24%;
	top:38%;
	position: absolute;
}
.neocity_icon04 img{
	height: 70px;
}
.neocity_icon05{
	z-index: 300;
	opacity: 0;
	left: 34%;
	top:24%;
	position: absolute;
}
.neocity_icon05 img{
	height: 70px;
}
.neocity_icon06{
	z-index: 300;
	opacity: 0;
	left: 55%;
	top:25%;
	position: absolute;
}
.neocity_icon06 img{
	height: 70px;
}
.neocity_icon07{
	z-index: 300;
	opacity: 0;
	left: 45%;
	top: 16%;
	position: absolute;
}
.neocity_icon07 img{
	height: 70px;
}
.movie_icon07 img{
	height: 25px;
		opacity: 1;
}
.business_icon01{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 15%;
	top:29%;
}
.business_icon01 img{
	height: 70px;
}
.business_icon02{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 72%;
	top:33%;
}
.business_icon02 img{
	height: 70px;
}
.business_icon03{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 10%;
	top:63%;
}
.business_icon03 img{
	height: 70px;
}
.business_icon04{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 34%;
	top:40%;
}
.business_icon04 img{
	height: 70px;
}
.business_icon05{
	z-index: 10;
	height: 70px;
	position: absolute;
	left: 46%;
	top:5%;
}
.business_icon05 img{
	height: 70px;
}
.movie_icon04{
	z-index: 10;
	position: absolute;
	left: 20%;
	top:58%;
}
.movie_icon04 img{
	height: 30px;
}
.movie_icon05{
	z-index: 10;
	position: absolute;
	left: 27%;
	top:20%;
}
.movie_icon05 img{
	height: 30px;
}
.movie_icon06{
	z-index: 10;
	position: absolute;
	left: 63%;
	top:30%;
}
.movie_icon06 img{
	height: 30px;
}
.movie_icon07{
	z-index: 10;
	position: absolute;
	left: 50%;
	top:40%;
}
.movie_icon07 img{
	height: 30px;
}
.movie_icon08{
	z-index: 10;
	position: absolute;
	left: 50%;
	top:10%;
}
.movie_icon08 img{
	height: 30px;
}
.movie_icon09{
	z-index: 10;
	position: absolute;
	left: 82%;
	top:37%;
}
.movie_icon09 img{
	height: 30px;
}
.modalAreas {
  display: none;
  position: fixed;
  z-index: 500; /*サイトによってここの数値は調整 */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.modalBg {
  width: 100%;
  height: 100%;
  background-color: rgba(30,30,30,0.9);
     z-index: 500; /*サイトによってここの数値は調整 */
}
video{
	width: 100%;
}
.modalWrapper {
    z-index: 500;
  position: absolute;
  top: 50%;
  left: 50%;
  transform:translate(-50%,-50%);
  width: 100%;
  height: 100%;
  max-width: 980px;
  max-height: 500px;
  background-color: #fff;
}
.modalWrapper_video {
  position: absolute;
  top: 50%;
  left: 50%;
	z-index: 500;
  transform:translate(-50%,-50%);
  width: 100%;
  height: 100%;
  max-width: 980px;
  max-height: 210px;
  background-color: #fff;
}
.closeModal {
  position: absolute;
  top: -1.5rem;
  right: 1rem;
  cursor: pointer;
    color: #FFFFFF;
}
#modal-bg {
　　display:none;
　　width:100%;
　　height:100%;
　　background-color: rgba(0,0,0,0.5);
　　position:fixed;
　　top:0;
　　left:0;
　　z-index: 500;
}
.modal_flex_01{
	display: block;
	margin: 30px 0 0 0;
}
.pikking_img_01{
	margin: 0 auto;
    text-align: center;
}
.pikking_img_01 img{
	width: 100px;
}
.modal_text_01{
	margin: 30px auto 0;
	width: 310px;
}
.modal_head_01{
	font-family: 'Sawarabi Mincho', sans-serif;
	font-size: 2.0em;
}
.modal_line{
	border: 1px solid #000000;
	width: 60px;
	margin: 20px auto 0;
}
.modal_subtext_01{
	margin: 20px auto 0;
	font-size: 1.0em;
	width: 310px;
}
.modal_flex_02{
	display: block;
	margin: 30px 0 0 0;
}
.pikking_img_02{
	margin: 0 auto;
    text-align: center;
}
.pikking_img_02 img{
	width: 100px;
}
.modal_text_02{
	margin: 40px auto 0;
	width: 310px;
}
.modal_head_02{
	font-family: 'Sawarabi Mincho', sans-serif;
	font-size: 2.0em;
    text-align: center;
}
.modal_subtext_02{
	margin: 20px auto 0;
	font-size: 1.0em;
	width: 310px;
}
.modal_flex_03{
	display: block;
	margin: 40px 0 0 0;
}
.pikking_img_03{
	margin: 0 auto;
    text-align: center;
}
.pikking_img_03 img{
	width: 150px;
}
.modal_text_03{
	margin: 30px auto 0;
	width: 310px;
}
.modal_head_03{
	font-family: 'Sawarabi Mincho', sans-serif;
	font-size: 2.0em;
    text-align: center;
}
.modal_subtext_03{
	margin: 20px 0 0 0;
	font-size: 1.0em;
	width: 310px;
}
.modal_flex_04{
	display: block;
	margin: 20px 0 0 0;
}
.pikking_img_04{
	margin: 0 auto;
    text-align: center;
}
.pikking_img_04 img{
	width: 160px;
}
.modal_text_04{
	margin: 30px auto 0;
	width: 310px;
}
.modal_head_04{
	font-family: 'Sawarabi Mincho', sans-serif;
	font-size: 2.0em;
    text-align: center;
}
.modal_subtext_04{
	margin: 20px 0 0 0;
	font-size: 1.0em;
	width: 310px;
}
.modal_flex_05{
	display: block;
	margin: 40px 0 0 0;
}
.pikking_img_05{
	margin: 0 auto;
    text-align: center;
}
.pikking_img_05 img{
	width: 180px;
}
.modal_text_05{
	margin: 30px auto 0;
	width: 310px;
}
.modal_head_05{
	font-family: 'Sawarabi Mincho', sans-serif;
	font-size: 2.0em;
    text-align: center;
}
.modal_subtext_05{
	margin: 20px 0 0 0;
	font-size: 1.0em;
	width: 310px;
}
}