#header-area {
	pointer-events: none;

	position: fixed;
	height : 10vh;
	width : 100%;

	text-align : left;
	top : 0px;

	background: rgba(255, 255, 255, 1);
	transition: 1s;
}

.header_logo {
	position : absolute;
	bottom : -1.0vh;

	width : 100%;

	text-align : center;
}

.header_logo img{ height : 10vh; }

/*ノーマル版
.header_icon_right {

	position : absolute; 
	bottom : -4vh; 
	left : calc( 50% + 47vh );

}*/

.header_icon_right {

	position : absolute; 
	bottom : -4vh; 
	left : calc( 50% + 40vh );

}




.header_icon_right img{ height : 15vh; }

.header_icon_left {

	position : absolute; 
	bottom : -4vh; 
	left : calc( 50% - 63vh );

}

.header_icon_left img{ height : 15vh; }


.header_produced img{ height : 3vh; }

.tate {

	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	text-align: left;
	display: inline-block;

}

#map-area {
	width: 100%;
	height : 100vh;
	display: flex;
  	flex-direction: column;
	align-items: center;
	justify-content: center;

	pointer-events: auto;

	margin-top : -100vh;
}

#map {
	position : absolute;
	left : 0px;
	top : 0px;

	height : 100vh;
	width : 50%;

	pointer-events: auto;

	background: rgba(255, 255, 255, 1);
	border:  1px solid rgba(8,53,110, 0.9);
}

#coordinate {

	font-size : calc( 0.9vw + 1.5vh );

	position: relative;
	width : 80%;
	margin : 0% auto 0% auto;
	padding : 4% 10% 4% 10%;

	background-color: #031b39;

	pointer-events: auto;

}

#coordinate .value input{

	font-size : calc( 0.9vw + 1.5vh );
	color : #ffffff;

    background-color: #031b39;
    border : none;  

}


#map_reference {

	position : absolute;
	top : 3vh;
	left : 1em;

	color : #000000;

	z-index : 1000;

}

#shikinaisya_icon {

	position : absolute; 
	bottom : 2.5%; left : 1em; 
	width :40%; min-height : 15%;
	padding : 1em 1em; 
	color : #000000;
	background: rgba(255, 255, 255, 0.9);
	border: 2px solid rgba(0,50,100, 0.6);

}

#character_text {

	position : absolute; 
	bottom : 2.5%; left : 1em; 
	width :30%; min-height : 20%; 
	padding : 1em 1em; 
	color : #000000;
	background: rgba(255, 255, 255, 0.9);
	border: 2px solid rgba(0,50,100, 0.6);

}

#character_text .scroll-box::-webkit-scrollbar {
  background: rgba(255, 255, 255, 0);
  width: 5px;
  height: 5px;
}

#character_text .scroll-box::-webkit-scrollbar-thumb {
  background-color: #555555;
	border-radius: 2.5px;
}

#character_illust {

	position : absolute; 
	bottom : 0px; right : 50%; 
	width : 25% ; height : 35%; 
	text-align : right;

}

#character_intro_illust {

	display : inline-block; vertical-align : top; 

	width : 39vw; height : 20vw;

	margin-bottom : 0.5em;

}

#character_intro_box {

	display : inline-block; vertical-align : top; 

	width : 48%; height : 100%; 

	background-repeat:no-repeat;
	background-position: right bottom; 
	background-size:contain;
	border: 2px solid rgba(0,50,100, 0.6);

}

#character_intro_text {

	display : inline-block; vertical-align : top; 

	width : 37vw; min-height : 18vw;
	padding : 1vw 1vw; 

	font-size : 110%;
	line-height : 1.2em;
	font-weight : 600; 

	color : #000000;
	background: rgba(255, 255, 255, 0.9);
	border: 2px solid rgba(0,50,100, 0.6);

}


#result_table{
	border-collapse: collapse;  
	width: 100%; 
	background-color: #031b39;
}

#result_table tr:hover td {
	background-color: #1b4f91;
}

/*#result_table td a{
	display:block;
	width:100%;
	height:100%;
} */


#search { text-align : center;}
#search input{ font-size: calc( 1.0vw + 1.0vh ); width : 90%; margin : 2%;}

.saijin_list {
	display : inline-block;
	width : 49%;

	margin : 0;

	background-color: #031b39;

	vertical-align : middle;
	text-align : center;

	border-width: 1px;
	border-color: #777777;
	border-style: solid;
}

/*.saijin_list a{ display : block ; }*/
.saijin_list:hover{ background-color: #1b4f91; border-color: #ffffff;}
.saijin_list p{ text-align: center;}

.saijin_name_title { margin-top : -20px; }

.norito_list {
	display : inline-block;
	width : 48%;

	margin : 0;

	background-color: #031b39;

	vertical-align : middle;
	text-align : center;

	border-width: 1px;
	border-color: #777777;
	border-style: solid;
}

/*.norito_list a{ display : block ; }*/
.norito_list:hover{ background-color: #1b4f91; border-color: #ffffff;}
.norito_list p{ text-align: center;}

#VR-area {

	width: 100%;
	height : 100vh;
	display: flex;
  	flex-direction: column;
	align-items: center;
	justify-content: center;

}

#VR-area iframe{

	width : 100%;
	height : 100%;

}

video {

	width: 100%;

}

#result_list {
	width : 100%;
	padding-top : 0px;
	margin-bottom : 6vh;
}

#result_osanpoAI {
	width : 100%;
	padding-top : 0px;
}

.location_photo {
	width : 30%;

	display : inline-block;
}

.location_info {
	padding-left : 10%;
	vertical-align : top;
	display : inline-block;
}

#notice {
	margin-top : 5vh;
	font-size : calc( 0.4vw + 0.7vh );
}

.info-table-1 {
	display: block;
	width : 100%;

	margin : 0;

	padding : 0%;

	vertical-align : top;

	border-width: 0px;
	border-color: #cccccc;
	border-style: solid;
}

.info-table-1 img {
	width : 100%;
	object-fit : cover;
}


.info-table-2 {
	display: block;
	width : 100%;

	margin : 0;

	padding : 0%;
}

.overview-table-1 {

	display: inline-block;
	width : 20%;

	margin : 5px 0px 15px 0px;

	vertical-align : top;

	border-width: 0px;
	border-color: #cccccc;
	border-style: solid;
}

.overview-table-2 {

	display: inline-block;
	width : 75%;

	white-space: pre-line;

	margin : 5px 0px 15px 3%;

	border-width: 0px;
	border-color: #cccccc;
	border-style: solid;

}

#story_title { 

	font-weight : 700; 
	margin : 0.5em 0;

}

#story_detail { 

	font-weight : 400; 
	margin-left : 5%; 

}


@media screen and (max-device-width:1281px) and (orientation: portrait){

	.header_logo {
		position : absolute;
		bottom : 0.8vh;
		padding-left : 0vw;
	}

	.header_logo img{ height : 6vh; width : 65vw;}

	/*ノーマル版.header_icon_right { left : calc( 50% + 65vw / 2  - 3vw ); }*/
	.header_icon_right { left : calc( 50% + 65vw / 2  - 40vw ); }

	.header_icon_left { left : calc( 50% - 65vw / 2 - 15vh + 1vw ); }

	#map-area {
		width: 100vw;
		height : 50vh;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	#map {
		height : 100%;
		width : 100%;
	}

	#shikinaisya_icon {

		bottom : 5.5%; left : 1.5em; 
		padding : 0.5em 2em; 
		width :80%; min-height : 15%;

	}

	#character_text {

		bottom : 5.5%; left : 1.5em; 
		padding : 0.5em 2em; 
		width :60%; min-height : 20%; 

	}

	#character_illust {

	bottom : 0px; right : 0px; 
	width : 50%; height : 35%; 

	}

	#character_intro_illust {

	width : 100%; height : 40vw;

	}

	#character_intro_box {

	width : 48%; height : 100%; 

	}

	#character_intro_text {

	width : 90%; min-height : 18vw;
	padding : 1vw 5%; 

	}

	#VR-area {

		width: 100%;
		height : 50vh;
		display: flex;
	  flex-direction: column;
		align-items: center;
		justify-content: center;

	}

	#VR-area iframe{

		width : 100%;
		height : 100%;

	}

}