@charset "utf-8";

/*---------------------------------------
common
---------------------------------------*/

html {
  width: 100%;
	/*overflow-x:hidden;*/

}

html {
  font-size: 1px;
}

#wrapper{
	width:100%;
	position: relative;
}

.container {
  max-width: 1180rem;
  margin: 0 auto;
	position: relative;
}

.pc{
	display:block;
}

.sp{
	display: none;
}

@media screen and (max-width: 1000px) {
  html {
    font-size: calc(100vw / 1000);
  }

  .container {
    max-width: 100%;
    margin: 0 auto;
  }
}

@media screen and (max-width: 767px) {
  html {
    font-size: calc(100vw / 750);
		overflow-x:hidden;
  }

  .container {
    max-width: 100%;
    margin: 0 auto;
  }

	.pc{
		display:none;
	}

	.sp{
		display: block;
	}
}

body {
  width: 100%;
	background:#000;
  color: #fff;
  font-weight: 400;
  line-height: 1.6;
  font-feature-settings: "palt" 1;
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  letter-spacing: 0.02em;
}

img{
	width:100%;
	-webkit-backface-visibility: hidden;
}

a{
	transition: 0.4s ;
	text-decoration:none;
}

a:hover{
  opacity: 0.6;
}

/* --------------------------------------------------
対応
 -------------------------------------------------- */
img {
  pointer-events: none;
}

* {
  user-select: none;
}

@media print {
  * {
    display: none;
  }
  body {
    background: #fff;
  }
}

img{
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  -moz-touch-callout:none;
  -moz-user-select:none;
  user-select:none;
}


/* --------------------------------------------------
loader
 -------------------------------------------------- */
.loader {
  position: fixed;
  width: 100%;
  height: 100%;
  background: #fff;
	display: flex;
  justify-content: center;
  align-items: center;
	flex-wrap: wrap;
	z-index:9999;
	transition: 1.0s ;
}



.is_loaded .loader {
  opacity: 0;
}

/*---------------------------------------
mainvisual
---------------------------------------*/
#mainvisual{
	width:100%;
	margin:0 auto;
	position:relative;
	background: url(../images/dot.png);
	overflow:hidden;
}

#mainvisual #mainvisual_inner{
	width:100%;
  min-width: 1180px;
  margin: 0 auto;
	position: relative;
	overflow-x:hidden;
	padding-bottom:60px;
	background: url(../images/gold.png) no-repeat center top;
	background-size:100% auto;
}

#mainvisual #mainvisual_inner h1{
	width:400px;
  margin: 0 auto;
	position: relative;
	padding-top:30px;
}

#mainvisual #mainvisual_inner ul.cp_title{
	width:1180px;
  margin: 0 auto;
	position: relative;
	padding-top:10px;
}

#mainvisual #mainvisual_inner ul.cp_title li:nth-child(1),
#mainvisual #mainvisual_inner ul.cp_title li:nth-child(2),
#mainvisual #mainvisual_inner ul.cp_title li:nth-child(3){
	width:100%;
	position: relative;
}

#mainvisual #mainvisual_inner ul.cp_title li:nth-child(4){
	width:239px;
	position: absolute;
	right:100px;
	top:0;
}

#mainvisual #mainvisual_inner ul.cp_title li:nth-child(5){
	width:1085px;
	margin:40px auto 0;
	position: relative;
}

#mainvisual #mainvisual_inner ul.cp_title li:nth-child(6){
	width:692px;
	margin:15px auto 0;
	position: relative;
}

#mainvisual #mainvisual_inner #lili_block{
	width:198px;
	height:350px;
	position: absolute;
	left:-65px;
	top:95px;
}

#mainvisual #mainvisual_inner #lili_block #lili{
	width:159px;
	position: absolute;
	right:0;
	bottom:0;
}

#mainvisual #mainvisual_inner #lili_block #lili_fukidashi{
	width:95px;
	position: absolute;
	left:0;
	top:0;
}

@media screen and (max-width: 767px) {
	#mainvisual{
		width:100%;
		margin:0 auto;
		position:relative;
		background: url(../images/dot.png);
	}

	#mainvisual #mainvisual_inner{
		width:100%;
	  min-width: 100%;
	  margin: 0 auto;
		position: relative;
		overflow-x:auto;
		padding-bottom:0;
		background: url(../images/sp_gold.png) no-repeat center top;
		background-size:100% auto;
		height:1300rem;
	}

	#mainvisual #mainvisual_inner h1{
		width:400rem;
	  margin: 0 auto;
		position: relative;
		padding-top:30rem;
	}

	#mainvisual #mainvisual_inner ul.cp_title{
		width:710rem;
	  margin: 0 auto;
		position: relative;
		padding-top:70rem;
	}

	#mainvisual #mainvisual_inner ul.cp_title li:nth-child(1),
	#mainvisual #mainvisual_inner ul.cp_title li:nth-child(2),
	#mainvisual #mainvisual_inner ul.cp_title li:nth-child(3){
		width:100%;
		position: relative;
	}

	#mainvisual #mainvisual_inner ul.cp_title li:nth-child(4){
		width:225rem;
		position: absolute;
		right:5rem;
		top:0;
	}

	#mainvisual #mainvisual_inner ul.cp_title li:nth-child(5){
		width:720rem;
		margin:50rem auto 0;
		position: relative;
	}

	#mainvisual #mainvisual_inner ul.cp_title li:nth-child(6){
		width:714rem;
		margin:15px auto 0;
		position: relative;
	}

	#mainvisual #mainvisual_inner #lili_block{
		width:310rem;
		height:270rem;
		position: absolute;
		left:175rem;
		top:980rem;
	}

	#mainvisual #mainvisual_inner #lili_block #lili{
		width:200rem;
		position: absolute;
		right:0;
		bottom:0;
	}

	#mainvisual #mainvisual_inner #lili_block #lili_fukidashi{
		width:135rem;
		position: absolute;
		left:0;
		top:0;
	}
}


/* --------------------------------------------------
menu
 -------------------------------------------------- */

#menu{
	width:100%;
  min-width: 1180px;
  margin: 0 auto;
	position: relative;
	padding:60px 0 0;
}

#menu .container{
	padding-bottom:300px;
}

ul.navi{
	width:1180px;
	display: flex;
  justify-content: start;
  align-items: stretch;
	flex-wrap: wrap;
	margin:0 auto;
}

ul.navi li{
	width:380px;
	height:177px;
	position: relative;
	margin:0 20px 47px 0;
}

ul.navi li .navi_inner{
	width:380px;
	height:177px;
	background: url(../images/bnr.png) no-repeat center top;
	position: relative;
}

ul.navi li:nth-child(3n){
	margin-right:0;
}

ul.navi li .menu_block{
	display:block;
	width:380px;
	height:177px;
	position: relative;
}

.hover_active {
  cursor: pointer;
	transition: 0.4s ;
}

.hover_active:hover {
  transform: scale(1.05);
}

ul.navi li .menu_block .num{
	width:74px;
	position: absolute;
	left:0;
	right:0;
	top:-26px;
	margin:auto;
}

ul.navi li .menu_block .title{
	padding-top:50px;
	width:90%;
	text-align:center;
	margin:0 auto;
}

ul.navi li .menu_block .title .title_inner{
	display:inline-block;
	text-align:left;
}

ul.navi li .menu_block .title .title_inner p{
	width:100%;
}

ul.navi li .menu_block .title .title_inner p:nth-child(2){
	margin-top:5px;
}

ul.navi li .menu_block .title .title_inner p:nth-child(1) span{
	color: #FF55BE;
	font-size: 20px;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: 2px;
	background-color:#fff;
	padding:3px;
	display:inline-block;
	width:145px;
	white-space: nowrap;
}

ul.navi li .menu_block .title .title_inner p:nth-child(2) span{
	color: #fff;
	font-size: 20px;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: 2px;
	background-color:#FF009E;
	padding:3px;
	display:inline-block;
	min-width:145px;
}

ul.navi li .menu_block span.message{
	display:block;
	width:100%;
	height:28px;
	position:absolute;
	left:0;
	bottom:0;
	color: #fff;
	font-size: 13px;
	font-weight: 900;
	line-height: 28px;
	text-align:center;
}

#menu_bottom {
  content: '';
  position: absolute;
	left:440px;
  bottom: 0;
  width: 240px;
  height: 250px;
	z-index:10;
}

#menu_bottom #menu_bottom_fukidashi{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 60px;
  height: 113px;
}

#menu_bottom #menu_bottom_anzu{
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  width: 175px;
  height: 231px;
}


@media screen and (max-width: 767px) {
	#menu{
		width:100%;
	  min-width: 100%;
	  margin: 0 auto;
		position: relative;
		padding:60rem 0 0;
	}

	#menu .container{
		padding-bottom:410rem;
	}

	ul.navi{
		width:708rem;
		display: flex;
	  justify-content: start;
	  align-items: stretch;
		flex-wrap: wrap;
		margin:0 auto;
	}

	ul.navi li{
		width:344rem;
		height:162rem;
		position: relative;
		margin:0 20rem 47rem 0;
	}

	ul.navi li .navi_inner{
		width:344rem;
		height:162rem;
		background: url(../images/bnr.png) no-repeat center top;
		background-size:cover;
		position: relative;
	}

	ul.navi li:nth-child(3n){
		margin-right:20rem;
	}

	ul.navi li:nth-child(2n){
		margin-right:0;
	}

	ul.navi li .menu_block{
		display:block;
		width:344rem;
		height:162rem;
		position: relative;
	}

	ul.navi li .menu_block .num{
		width:74rem;
		position: absolute;
		left:0;
		right:0;
		top:-26rem;
		margin:auto;
	}

	ul.navi li .menu_block .title{
		padding-top:50rem;
		width:90%;
		text-align:center;
		margin:0 auto;
	}

	ul.navi li .menu_block .title .title_inner p:nth-child(2){
		margin-top:5rem;
	}

	ul.navi li .menu_block .title .title_inner p:nth-child(1) span{
		font-size: 20rem;
		letter-spacing: 2rem;
		padding:3rem;
		display:inline-block;
		width:145rem;
	}

	ul.navi li .menu_block .title .title_inner p:nth-child(2) span{
		font-size: 20rem;
		letter-spacing: 2rem;
		padding:3rem;
		min-width:145rem;
	}

	ul.navi li .menu_block span.message{
		display:block;
		width:100%;
		height:28rem;
		font-size: 13rem;
		line-height: 28rem;
	}

	.hover_active{
		cursor:pointer;
		transition: 0s ;
	}

	.hover_active:hover{
		transform: scale(1);
	}

	#menu_bottom {
	  content: '';
	  position: absolute;
		left:170rem;
	  bottom: 0;
	  width: 330rem;
	  height: 380rem;
		z-index:10;
	}

	#menu_bottom #menu_bottom_fukidashi{
	  content: '';
	  position: absolute;
	  left: 0;
	  top: 0;
	  width: 80rem;
	  height: 113rem;
	}

	#menu_bottom #menu_bottom_anzu{
	  content: '';
	  position: absolute;
	  right: 0;
	  bottom: 0;
	  width: 245rem;
	  height: 323rem;
	}

}


/* --------------------------------------------------
tab_menu
 -------------------------------------------------- */
#overlay{
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.4);
	position: fixed;
	left:0;
	top:0;
	z-index:1500;
	display:none;
}

#tab_menu{
	right: -1500px;
	width:1500px;
  margin: 0 auto;
	position: fixed;
	background: url(../images/dot.png);
	padding:120px 0 40px;
	right:0;
	top:80px;
	z-index:2000;
	visibility: hidden;
}

#tab_menu #tab{
	width:100px;
	height:300px;
	position: absolute;
	left:-100px;
	top:160px;
	cursor:pointer;
	transition: 0.4s ;
}

#tab_menu #tab:hover{
	opacity:0.6;
}

#tab_menu #tab_close{
	width:40px;
	height:40px;
	position: absolute;
	right:20px;
	top:20px;
	cursor:pointer;
	transition: 0.4s ;
}

.resizing	.hover_active{
	cursor:pointer;
	transition: 0s ;
}


@media screen and (max-width: 1600px) {
	#tab_menu{
		width:calc(100% - 100px);
		padding:120rem 0 40rem;
		right:0;
		top:80rem;
		z-index:2000;
	}

	#tab_menu ul.navi{
		width:74vw;
		display: flex;
	  justify-content: start;
	  align-items: stretch;
		flex-wrap: wrap;
		margin:0 auto;
	}

	#tab_menu ul.navi li{
		width:23.5vw;
		height:11vw;
		position: relative;
		margin:0 1.75vw 2.8vw 0;
	}

	#tab_menu ul.navi li .navi_inner{
		width:23.5vw;
		height:11vw;
		background: url(../images/bnr.png) no-repeat center top;
		background-size:cover;
		position: relative;
	}

	#tab_menu ul.navi li:nth-child(3n){
		margin-right:0;
	}

	#tab_menu ul.navi li .menu_block{
		display:block;
		width:23.5vw;
		height:11vw;
		position: relative;
	}

	#tab_menu ul.navi li .menu_block .num{
		width:4.6vw;
		position: absolute;
		left:0;
		right:0;
		top:-1.6vw;
		margin:auto;
	}

	#tab_menu ul.navi li .menu_block .title{
		padding-top:3.2vw;
		width:90%;
		text-align:center;
		margin:0 auto;
	}

	#tab_menu ul.navi li .menu_block .title .title_inner{
		display:inline-block;
		text-align:left;
	}

	#tab_menu ul.navi li .menu_block .title .title_inner p{
		width:100%;
	}

	#tab_menu ul.navi li .menu_block .title .title_inner p:nth-child(2){
		margin-top:0.3vw;
	}

	#tab_menu ul.navi li .menu_block .title .title_inner p:nth-child(1) span{
		color: #FF55BE;
		font-size: 1.3vw;
		font-weight: 900;
		line-height: 1.2;
		letter-spacing: 0.1vw;
		background-color:#fff;
		padding:0.1vw;
		display:inline-block;
		width:9.2vw;
	}

	#tab_menu ul.navi li .menu_block .title .title_inner p:nth-child(2) span{
		color: #fff;
		font-size: 1.3vw;
		font-weight: 900;
		line-height: 1.2;
		letter-spacing: 0.1vw;
		background-color:#FF009E;
		padding:0.1vw;
		display:inline-block;
		min-width:9.2vw;
	}

	#tab_menu ul.navi li .menu_block span.message{
		display:block;
		width:100%;
		height:1.8vw;
		position:absolute;
		left:0;
		bottom:0;
		color: #fff;
		font-size: 0.8vw;
		font-weight: 900;
		line-height: 1.6vw;
		text-align:center;
	}
}

@media screen and (max-width: 767px) {
	#sp_menu{
		width:100%;
		height:100%;
		left:0;
		top:100%;
		position: fixed;
		z-index:3000;
		background: url(../images/dot.png);
	}

	#sp_menu #sp_tab{
		width:488rem;
		position: fixed;
		left:0;
		right:0;
		bottom:-200rem;
		margin:auto;
		z-index:1000;
		transition: 0.6s ;
	}

	#sp_menu #sp_tab.open{
		bottom:-2rem;
	}

	#sp_menu #sp_close{
		width:40rem;
		position: absolute;
		right:20rem;
		top:20rem;
	}

	#sp_menu .container{
		padding-top:150rem;
		height: calc(100% - 150rem);
		overflow-y: auto;	
	}

	#sp_menu .container ul.navi{
		padding-bottom:100rem;
	}

}

/* --------------------------------------------------
map
 -------------------------------------------------- */
#map{
	width:100%;
  min-width: 1180px;
	height:900px;
  margin: 0 auto;
	position: relative;
	background: url(../images/map_bg.png) no-repeat center center;
	background-size:cover;
	overflow:hidden;
	box-sizing:border-box;
	padding-top:40px;
}

#map::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 649px;
  height: 634px;
	background: url(../images/shine1.png) no-repeat left top;
	background-size:cover;
	mix-blend-mode: screen;
	z-index:1;
}

#map::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  width: 435px;
  height: 858px;
	background: url(../images/shine2.png) no-repeat left top;
	background-size:cover;
	mix-blend-mode: screen;
	z-index:1;
}

#map .container{
	height:900px;
	position: relative;
	font-size:0;
}

#map #anzu {
  content: '';
  position: absolute;
  right: -225px;
  bottom: 43px;
  width: 234px;
  height: 270px;
	z-index:10;
}

#map #anzu #map_fukidashi{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 58px;
  height: 150px;
}

#map #anzu #map_anzu{
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  width: 219px;
  height: 168px;
}

#map #map_title_block {
  content: '';
  position: absolute;
  left: 0;
  top: 70px;
  width: 325px;
  height: 305px;
	z-index:10;
}

#map #map_title_block #map_title{
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 325px;
  height: 195px;
}

#map #map_title_block #map_chara{
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 120px;
  height: 141px;
}

#map_container {
  position: relative;
  width: 860px;
  margin: 0 auto;
}

#japan_map {
  width: 100%;
  height: auto;
  display: block;
}

.heart {
  position: absolute;
  transform: translate(-50%, -50%);
  pointer-events: none;
	opacity:0;
}

@media screen and (max-width: 767px) {
	#map{
		width:100%;
	  min-width: 100%;
		height:1620rem;
	  margin: 0 auto;
		position: relative;
		background: url(../images/sp_map_bg.png) no-repeat center top;
		background-size:cover;
		overflow-x:hidden;
		box-sizing:border-box;
		padding-top:450rem;
		}

	#map::before {
	  content: '';
	  position: absolute;
	  left: 0;
	  top: 0;
	  width: 561rem;
	  height: 574rem;
		background: url(../images/sp_shine1.png) no-repeat left top;
		background-size:cover;
		mix-blend-mode: screen;
	}

	#map::after {
	  content: '';
	  position: absolute;
	  right: 0;
	  bottom: 0;
	  width: 400rem;
	  height: 828rem;
		background: url(../images/sp_shine2.png) no-repeat left top;
		background-size:cover;
		mix-blend-mode: screen;
	}

	#map .container{
		height:1170rem;
		position: relative;
		font-size:0;
	}

	#map #anzu {
	  content: '';
	  position: absolute;
	  right: 0;
	  bottom: 0;
	  width: 340rem;
	  height: 350rem;
	}

	#map #anzu #map_fukidashi{
	  content: '';
	  position: absolute;
	  left: 0;
	  top: 0;
	  width: 74rem;
	  height: 189rem;
	}

	#map #anzu #map_anzu{
	  content: '';
	  position: absolute;
	  right: 45rem;
	  bottom: 0;
	  width: 277rem;
	  height: 216rem;
	}

	#map #map_title_block {
	  content: '';
	  position: absolute;
	  left: 60rem;
	  top: -400rem;
	  width: 420rem;
	  height: 380rem;
	}

	#map #map_title_block #map_title{
	  content: '';
	  position: absolute;
	  right: 0;
	  top: 0;
	  width: 409rem;
	  height: 246rem;
	}

	#map #map_title_block #map_chara{
	  content: '';
	  position: absolute;
	  left: 0;
	  bottom: 0;
	  width: 153rem;
	  height: 178rem;
	}

	#map_container {
	  position: relative;
	  width: 700rem;
	  margin: 0 auto;
	}

	#japan_map {
	  width: 100%;
	  height: auto;
	  display: block;
	}

}

/* --------------------------------------------------
contents
 -------------------------------------------------- */
#contents{
	width:100%;
  min-width: 1180px;
  margin: 0 auto;
	position: relative;
	background: url(../images/dot.png);
	overflow:hidden;
	padding-bottom:180px;
}

#contents::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 751px;
  height: 722px;
	background: url(../images/decoration1.png) no-repeat left top;
}

#contents::after {
  content: '';
  position: absolute;
  right: 0;
  top: 0;
  width: 403px;
  height: 960px;
	background: url(../images/decoration2.png) no-repeat left top;
}

#contents .conte_list{
	display:none;
	opacity:0;
	transition: opacity 0.5s ease;
	background-color:#CC0A81;
	margin-top:120px;
	padding-bottom:100px;
	position:relative;
	z-index:10;
}

#contents .conte_list.active{
	display: block;
  opacity: 1;
}

#contents .conte_list .num{
	width:96px;
	position:absolute;
	left:0;
	right:0;
	top:-25px;
	margin:auto;
}

#contents .conte_list .romantic{
	width:204px;
	margin:0 auto;
	padding-top:90px;
}

#contents .cont1 .title,
#contents .cont2 .title{
	width:440px;
	margin:0 auto;
	padding-top:70px;
}

#contents .conte_list p.txt{
	width:90%;
	margin:40px auto 0;
	text-align: center;
	text-shadow: 0 2px 5px rgba(255, 0, 158, 0.40);
	font-size: 20px;
	font-weight: 700;
	line-height: 200%;
}

#youtube {
	width:912px;
	margin:60px auto 0;
	position: relative;
}

.video_container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}

.video_container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.contents_inner .cont_img{
	width:1000px;
	margin:40px auto 0;
}

#contents .movie_left {
  content: '';
  position: absolute;
  left: -60px;
  top: -20px;
  width: 300px;
  height: 330px;
}

#contents .movie_left .movie_fukidashi{
  content: '';
  position: absolute;
  left: 10px;
  bottom: 0;
  width: 157px;
  height: 181px;
}

#contents .movie_left .movie_anzu{
  content: '';
  position: absolute;
  left: 55px;
  top: 20px;
  width: 240px;
  height: 351px;
}

#contents .movie_chara{
  content: '';
  position: absolute;
  right: -30px;
  top: 180px;
  width: 162px;
  height: 158px;
}

@media screen and (max-width: 767px) {
	#contents{
		width:100%;
	  min-width: 100%;
	  margin: 0 auto;
		position: relative;
		background: url(../images/dot.png);
		overflow-x:hidden;
		padding-bottom:550rem;
	}

	#contents::before {
	  content: '';
	  position: absolute;
	  left: 0;
	  top: 0;
	  width: 0;
	  height: 0;
		background: none;
	}

	#contents::after {
	  content: '';
	  position: absolute;
	  right: 0;
	  top: 0;
	  width: 0;
	  height: 0;
		background: none;
	}

	#contents .conte_list{
		display:none;
		opacity:0;
		width:710rem;
		margin:240rem auto 0;
		padding-bottom:180rem;
		transition: opacity 0.5s ease;
		background-color:#CC0A81;
		position:relative;
		z-index:10;
	}

	#contents .conte_list.active{
		display: block;
	  opacity: 1;
	}

	#contents .conte_list .num{
		width:200rem;
		position:absolute;
		left:0;
		right:0;
		top:-60rem;
		margin:auto;
	}

	#contents .conte_list .romantic{
		width:318rem;
		margin:0 auto;
		padding-top:180rem;
	}

	#contents .cont1 .title,
	#contents .cont2 .title{
		width:503rem;
		margin:0 auto;
		padding-top:120rem;
	}

	#contents .conte_list p.txt{
		width:640rem;
		margin:50rem auto 0;
		text-align: center;
		text-shadow: 0 2px 5px rgba(255, 0, 158, 0.40);
		font-size: 32rem;
		font-weight: 700;
		line-height: 200%;
	}

	#youtube {
		width:100%;
		margin:80rem auto 0;
		position: relative;
	}

	.contents_inner .cont_img{
		width:640rem;
		margin:40rem auto 0;
	}

	#contents .movie_left {
	  content: '';
	  position: absolute;
	  left: -22rem;
	  top: -265rem;
	  width: 300rem;
	  height: 470rem;
	}

	#contents .movie_left .movie_fukidashi{
	  content: '';
	  position: absolute;
	  left: -30rem;
	  bottom: 60rem;
	  width: 180rem;
	  height: 254rem;
	}

	#contents .movie_left .movie_anzu{
	  content: '';
	  position: absolute;
	  left: 3rem;
	  top: 0;
	  width: 280rem;
	  height: 409rem;
	}

	#contents .movie_chara{
	  content: '';
	  position: absolute;
	  right: -30rem;
	  top: -130rem;
	  width: 234rem;
	  height: 234rem;
	}
}

/*---------------------------------------
footer
---------------------------------------*/
#footer{
	width:100%;
  min-width: 1180px;
	height:250px;
  margin: 0 auto;
	position: relative;
	padding-top:50px;
	box-sizing:border-box;
	background-color: #FF009E;
}

#footer ul.footer_link{
	display: flex;
  justify-content: center;
  align-items: center;
	flex-wrap: wrap;
	gap:20px;
	position: relative;
}

#footer ul.footer_link li{
	position: relative;
}

#footer ul.footer_link li a{
	position: relative;
	display:block;
	color:#fff;
	font-size:16px;
	font-weight:500;
	padding-left:13px;
}

#footer ul.footer_link li a::before{
	content: "";
	position: absolute;
	top: 50%;  
	left: 0;
	transform: translateY(-50%);
	border: 5px solid transparent;
	border-left: 8px solid #fff;
}

#footer #copyright{
	position: relative;
	color:#fff;
	font-size:14px;
	font-weight:500;
	text-align:center;
	margin-top:16px;
	letter-spacing:1px;
}

#footer #share{
	position: relative;
	width:58px;
	text-align:center;
	margin:40px auto 0;
}

#footer ul.footer_sns{
	display: flex;
  justify-content: center;
  align-items: center;
	flex-wrap: wrap;
	gap:40px;
	position: relative;
	margin-top:16px;
}

#footer ul.footer_sns li{
	position: relative;
	width:30px;
}

#footer ul.footer_sns li img {
  pointer-events: auto;
}


@media screen and (max-width: 767px) {
	#footer{
		width:100%;
	  min-width: 100%;
		height:490rem;
	  margin: 0 auto;
		position: relative;
		padding-top:100rem;
		box-sizing:border-box;
		background-color: #FF009E;
	}

	#footer ul.footer_link{
		display: flex;
	  justify-content: center;
	  align-items: center;
		flex-wrap: wrap;
		gap:40rem;
		position: relative;
	}

	#footer ul.footer_link li{
		position: relative;
	}

	#footer ul.footer_link li a{
		position: relative;
		display:block;
		color:#fff;
		font-size:24rem;
		font-weight:500;
		padding-left:30rem;
	}

	#footer ul.footer_link li a::before{
		content: "";
		position: absolute;
		top: 50%;  
		left: 0;
		transform: translateY(-50%);
		border: 9rem solid transparent;
		border-left: 12rem solid #fff;
	}

	#footer #copyright{
		position: relative;
		color:#fff;
		font-size:20rem;
		font-weight:500;
		text-align:center;
		margin-top:25rem;
		letter-spacing:2.5rem;
	}

	#footer #share{
		position: relative;
		width:90rem;
		text-align:center;
		margin:70rem auto 0;
	}

	#footer ul.footer_sns{
		display: flex;
	  justify-content: center;
	  align-items: center;
		flex-wrap: wrap;
		gap:80rem;
		position: relative;
		margin-top:30rem;
	}

	#footer ul.footer_sns li{
		position: relative;
		width:60rem;
	}
}



/*---------------------------------------
gototop
---------------------------------------*/
#gototop,
#gototop p,
#gototop p a{
	width:120px;
	height:227px;
	display:block;
}

#gototop{
	position: fixed;
	z-index: 1000;
	left:0;
	bottom:0;
}

#gototop p{
	position: absolute;
	left:-150px;
	top:0;
	transition: 0.6s ;
}

#gototop p:hover{
	opacity:0.6;
	cursor:pointer;
}

#gototop.abs{
  position: absolute;
	bottom:250px;
}

#gototop.open p{
	left:0;
}

@media screen and (max-width: 767px) {
	#gototop,
	#gototop p,
	#gototop p a{
		width:234rem;
		height:442rem;
		display:block;
	}

	#gototop{
		position: fixed;
		z-index: 1000;
		left:0;
		bottom:490rem;
	}

	#gototop p{
		position: absolute;
		left:-300rem;
		top:0;
		transition: 0.6s ;
	}
}

/*---------------------------------------
animation
---------------------------------------*/

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translateY(-60px);
    transform: translateY(-60px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale(0.8);
    transform:scale(0.8);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1.0);
    transform:scale(1.0);
  }
}

@keyframes zoomOut {
  from {
    opacity: 0;
    -webkit-transform: scale(1.2);
    transform:scale(1.2);
  }
  to {
    opacity: 1;
    -webkit-transform: scale(1.0);
    transform:scale(1.0);
  }
}

@keyframes rotationIn {
  from {
    opacity: 0;
    transform:scale(0.4) rotate(-260deg);
  }
  to {
    opacity: 1;
    transform:scale(1.0) rotate(-360deg);
  }
}

@keyframes slideX1 {
  from {
    opacity: 0;
    transform: translateX(100px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slideX2 {
  from {
    opacity: 0;
    transform: translateX(-100px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes anzu {
  0%   { transform: translateY(100px); opacity: 0; }
  20%  { transform: translateY(0); opacity: 1; }
  35%  { transform: translateY(15px); opacity: 1;  }
  50%  { transform: translateY(0); opacity: 1;  }
  100% { transform: translateY(0); opacity: 1;  }
}

@keyframes poyon {
  0%   { transform: scale(0.6); opacity: 0; }
  20%  { transform: scale(1.1); opacity: 1; }
  40%  { transform: scale(0.8); opacity: 1;  }
  60%  { transform: scale(1.05); opacity: 1;  }
  80%  { transform: scale(0.95); opacity: 1;  }
  100% { transform: scale(1.0); opacity: 1;  }
}

@keyframes blur {
  0% {
	  opacity: 0;
    filter: blur(40rem);
  }
  100% {
	  opacity: 1;
    filter: blur(0);
  }
}


#mainvisual h1,
#mainvisual ul.cp_title li,
#mainvisual #lili_block #lili,
#mainvisual #lili_block #lili_fukidashi{
	opacity:0;
}

.is_loaded h1{
  animation: rotationIn 0.3s ease 0.6s forwards;
}

.is_loaded #mainvisual ul.cp_title li:nth-child(1){
  animation: slideX1 0.4s ease 1.2s forwards;
}

.is_loaded #mainvisual ul.cp_title li:nth-child(2){
  animation: slideX2 0.4s ease 1.4s forwards;
}

.is_loaded #mainvisual ul.cp_title li:nth-child(3){
  animation: slideX1 0.4s ease 1.6s forwards;
}

.is_loaded #mainvisual ul.cp_title li:nth-child(4){
  animation: poyon 0.4s ease 2.0s forwards;
}

.is_loaded #mainvisual ul.cp_title li:nth-child(5){
  animation: zoomOut 0.6s ease 2.2s forwards;
}

.is_loaded #mainvisual ul.cp_title li:nth-child(6){
  animation: zoomOut 0.6s ease 2.4s forwards;
}

.is_loaded #mainvisual #lili_block #lili{
  animation: poyon 0.4s ease 2.8s forwards;
}

.is_loaded #mainvisual #lili_block #lili_fukidashi{
  animation: poyon 0.4s ease 3.0s forwards;
}

#menu ul.navi li .navi_inner,
#menu_bottom #menu_bottom_anzu,
#menu_bottom #menu_bottom_fukidashi{
	opacity:0;
}

#menu.trigger ul.navi li:nth-child(1) .navi_inner {
  animation: poyon 1.0s ease 0.4s forwards;
}

#menu.trigger ul.navi li:nth-child(2) .navi_inner {
  animation: poyon 1.0s ease 0.5s forwards;
}

#menu.trigger ul.navi li:nth-child(3) .navi_inner {
  animation: poyon 1.0s ease 0.6s forwards;
}

#menu.trigger ul.navi li:nth-child(4) .navi_inner {
  animation: poyon 1.0s ease 0.7s forwards;
}

#menu.trigger ul.navi li:nth-child(5) .navi_inner {
  animation: poyon 1.0s ease 0.8s forwards;
}

#menu.trigger ul.navi li:nth-child(6) .navi_inner {
  animation: poyon 1.0s ease 0.9s forwards;
}

#menu.trigger ul.navi li:nth-child(7) .navi_inner {
  animation: poyon 1.0s ease 1.0s forwards;
}

#menu.trigger ul.navi li:nth-child(8) .navi_inner {
  animation: poyon 1.0s ease 1.1s forwards;
}

#menu.trigger ul.navi li:nth-child(9) .navi_inner {
  animation: poyon 1.0s ease 1.2s forwards;
}

#menu_bottom.trigger #menu_bottom_anzu{
  animation: anzu 1.0s ease 0.4s forwards;
}

#menu_bottom.trigger #menu_bottom_fukidashi {
  animation: poyon 0.6s ease 0.8s forwards;
}

#map #map_title_block #map_title,
#map #map_title_block #map_chara,
#map #map_title_block #map_chara img,
#map #anzu #map_fukidashi,
#map #anzu #map_anzu{
	opacity:0;
}

#map.trigger #map_title_block #map_title {
  animation: rotationIn 0.4s ease 0.4s forwards;
}

#map.trigger #map_title_block #map_chara  {
  offset-path: path("M250,0 C250,100 50,100 50,0");
  offset-distance: 0%;
  
	animation: moveU 1s forwards;
  animation-delay: 0.6s;
  animation-timing-function: cubic-bezier(0.6, 0, 0.4, 1);
  offset-rotate: 0deg;
  motion-rotation: 0deg;
}

@keyframes moveU {
  0% {
    offset-distance: 0%;
    opacity: 0;
  }
  100% {
    offset-distance: 100%;
    opacity: 1;
  }
}

#map.trigger #map_title_block #map_chara img{
  animation: fadeIn 1.0s ease 1.0s forwards;
}

#map.trigger #anzu #map_anzu{
  animation: anzu 1.0s ease 1.8s forwards;
}

#map.trigger #anzu #map_fukidashi {
  animation: poyon 0.6s ease 2.2s forwards;
}

#contents .num,
#contents .romantic,
#contents .title,
#contents .txt,
#contents #youtube,
.cont_img,
#contents .movie_left .movie_anzu,
#contents .movie_left .movie_fukidashi,
#contents .movie_chara{
	opacity:0;
}


