@charset "utf-8";
/* CSS Document */

/* font-size調整 */


/***********************************************************************
 SP
***********************************************************************/
/* 共通 */
h2 {
	background-color: transparent;
	position: relative;
}
h2::after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 100%;
	background-color: #000;
	transition: all 1s ease-in;
	z-index: 0;
}
h2.scroll_events::after {
	width: 100%;
}
h2 span {
	display: block;
	position: relative;
	z-index: 10;
}
.introduction h3, .character h3 {
	border-bottom: none;
	position: relative;
}
.introduction h3::after, .character h3::after {
	content: "";
	display: block;
	position: absolute;
	bottom: -4px;
	left: 0;
	height: 4px;
	width: 0;
	background-color: #be1e2d;
	transition: all .8s ease-in;
}
.trailer h3::after {
	background-color: #fff;
}
.introduction h3.scroll_events::after, .character h3.scroll_events::after {
	width: 100%;
}
.location h5 {
	background-color: transparent;
	position: relative;
  line-height: 1.2;
}
.location h5::after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 100%;
	background-color: #be1e2d;
	transition: all 1s ease-in;
	z-index: 0;
}
.location h5 span {
	display: block;
	position: relative;
	z-index: 10;
}
.location h5.scroll_events::after {
	width: 100%;
}
.introduction h2 {
	margin-bottom: 0;
}
.introduction {
	background-image: none;
	background-color: inherit;
}
.story {
	margin-top: inherit;
}
.map-icn {
	border-radius: 50%;
	border: 2px solid #c3303d;
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 6.666%;
	height: 7.042%;
}
.map-icn a {
	display: block;
	position: absolute;
	top: -2px;
	right: -2px;
	bottom: -2px;
	left: -2px;
	border-radius: 50%;
}
.map-icn::before {
	content: "";
	display: block;
	width: 50%;
	height: 50%;
	border-radius: 50%;
	animation: map-icn 1s linear infinite;
	background-color: rgba(198,48,61,0.8);
}
 @keyframes map-icn {
 0% {
 transform: scale(1);
}
100% {
 transform: scale(1.7);
}
}
.map-icn02 {
	border-radius: 50%;
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 6.666%;
	height: 7.042%;
}
.map-icn02 a {
	display: block;
	position: absolute;
	top: -2px;
	right: -2px;
	bottom: -2px;
	left: -2px;
	border-radius: 50%;
}
.map-icn02::before {
	content: "";
	display: block;
	width: 50%;
	height: 50%;
	border-radius: 50%;
	background-color: rgba(198,48,61,0.8);
}
.map-icn__osaka {
	width: 6.666%;
	height: 7.042%;
}
.location__osaka-map-area p[id^="map_osaka-"] {
	position: absolute;
}
#map_osaka-ookawa {
	top: 5.63%;
	left: 13.5%;
}
#map_osaka-nakanoshima{
  top:10.5%;
  left: 8.1%;
}
#map_osaka-shinghiginobashi {
    top: 9.09%;
    left: 59.37%;
}
#map_osaka-uehonmachi {
	top: 53.71%;
	left: 57.03%;
}
#map_osaka-tenshiba {
	top: 83.8%;
	left: 39.21%;
}
#map_osaka-ookawa_txt{
  top: 6.93%;
  left: 20.62%;
	width: 9.71%;
}
#map_osaka-nakanoshima_txt{
  top: 18.7%;
  left: 7.5%;
	width: 9.53%;
}
#map_osaka-shinghiginobashi_txt {
	top: 9.81%;
	left: 68%;
	width: 22.42%;
}
#map_osaka-uehonmachi_txt {
	top: 56.03%;
	left: 64.06%;
	width: 18.85%;
}
#map_osaka-tenshiba_txt {
	top: 85.61%;
	left: 20.78%;
	width: 17.5%;
}
#map_osaka-abenoharukasu_txt {
	top: 88.76%;
	left: 57.81%;
	width: 29.28%;
}
#map_osaka-nanba_txt {
	top: 54.53%;
	left: 35.28%;
	width: 7%;
}
#map_osaka-abenoharukasu_img {
	top: 67.76%;
	left: 51.25%;
	width: 10.93%;
}
#map_osaka-abenoharukasu_logo {
	top: 76.85%;
	left: 63.5%;
	width: 34.68%;
}
#map_osaka-abenoharukasu {
	top: 86.77%;
	left: 49.53%;
}
#map_osaka-nanba {
	top: 52.5%;
	left: 29.14%;
}
.location__osaka-map-area p[id^="map_osaka-"], .location__nara-map-area p[id^="map_nara-"] {
	position: absolute;
}
.map-icn__nara {
	width: 5.78%;
	height: 9.06%;
	position: absolute;
}
#map_nara-narakouen {
	left: 40.62%;
	top: 50.98%;
}
#map_nara-houzanzi {
	top: 49.26%;
	left: 12.5%;
}
#map_nara-houzanzi_txt {
	top: 51.34%;
	left: 3.9%;
	width: 8.28%;
}
#map_nara-narakouen_txt {
	top: 52.2%;
	left: 46.09%;
	width: 10.93%;
}
#map_nara-country {
	top: 46.56%;
	left: 82.96%;
}
#map_nara-country_txt {
	top: 55.88%;
	left: 72.34%;
	position: absolute;
	width: 27.34%;
}
.map-icn__okayama {
	width: 7.3%;
	height: 9%;
	position: absolute;
}
#map_okayama-hiruzen {
	left: 40.15%;
	top: 14.72%;
}
#map_okayama-hiruzen_txt {
	top: 16.63%;
	left: 48%;
	position: absolute;
	width: 18.85%;
}
#map_okayama-okayamashi {
	left: 59%;
	top: 82%;
}
#map_okayama-okayamashi_txt {
	top: 84.1%;
	left: 65.62%;
	position: absolute;
	width: 9.81%;
}

/***********************************************************************  
 SP__END
***********************************************************************/
/* 共通 */
@media screen and (min-width:400px) {
}

/***********************************************************************
 TABLET
***********************************************************************/
@media screen and (min-width:640px) {
}/* TAB_END */

@media screen and (min-width:768px) {
.map-icn__nara {
	width: 5.2%;
	height: 10%;
}
}

/***********************************************************************
 PC
***********************************************************************/
@media screen and (min-width:960px) {
#map_nara-houzanzi_txt {
	top: 51.53%;
	left: 12.5%;
	width: 6.93%;
}
#map_nara-country_txt {
	top: 55%;
	left: 68.97%;
	position: absolute;
	width: 21.22%;
}
#map_nara-houzanzi {
	top: 48%;
	left: 19.4%;
}
#map_nara-narakouen {
	left: 42%;
	top: 48%;
}
#map_nara-narakouen_txt {
	top: 51%;
	left: 47.3%;
	width: 8.97%;
}
#map_nara-country {
	top: 45.19%;
	left: 75.2%;
}
}/* PC_END */

/***********************************************************************
 横幅1000px以上
***********************************************************************/

@media screen and (min-width:1000px) {
}
