@charset "utf-8";




/*----------------------------------------
	for PC
----------------------------------------*/


/*@media screen and (min-width: 481px){*/

	#wrapper{
		width:100%;
		min-width:1100px;
		background-image:url(../img/character/chara_bg.jpg);
		background-size:cover;
		background-attachment:fixed;
		padding-bottom:0px;
		padding-top: 140px;
		overflow: hidden;
	}

	h2{padding-bottom: 40px;padding-top:10px;}

	#characters{ position:relative; z-index:50;}
	#characters .btn_voice_01{ display:block; width:161px; height:140px; position:absolute; top:320px;left:600px; z-index:10;transition:all 0.3s ease;}
	#characters .btn_voice_02{ display:block; width:161px; height:140px; position:absolute; top:420px;left:610px; z-index:10;transition:all 0.3s ease;}
	#characters .btn_voice_01:hover, #characters .btn_voice_02:hover{ transform:scale(0.9,0.9);}
	#characters .btn_voice_01 img, #characters .btn_voice_02 img{ display:block; width:100%;height:100%;}

	#characters .section_inner{ padding:0px 0 160px;}
	#characters .slick-slider { position:inherit;}
	#characters .slick-list   { position:inherit;overflow:hidden;padding-top:0px;}
	#characters .slick-next   { right: 50%; margin-right: -530px; display:block; background-image:url(../img/common/arrow_r.png);}

	#characters .slick-prev   { left: 50%; margin-left:-530px;display:block;background-image:url(../img/common/arrow_l.png);}
	#characters .slick-arrow  { top:38%; width:86px;height:86px;display:block;z-index:20;transition: all 0.3s;transform-origin:50% 50%;}

	#characters .slick-arrow:hover{transform:scale(0.9,0.9);top:34.15%;}
	#characters .slick-arrow:before{display:none;}
	#characters .slider-item {width:1100px;height:900px;transition: all 0.5s;position:relative;margin: auto;}
	#characters .slick-center{opacity:1;}
	#characters .slider-item .photo{position:absolute;top:0px;right:50px;}
	#characters .slider-item .still{position:absolute;top:0px;right:10px;z-index:2;}
	#characters .slider-item .still.c13{right:-25px;}
	#characters .slider-item .mini_chara{position:absolute;top:250px;left:420px;z-index:10;}
	#characters .slider-item .btn_story{position:absolute;top:520px;left:105px;z-index:12;display:block;}
	#characters .slider-item .btn_photo{position:absolute;top:470px;left:198px;z-index:10;display:block;}

	#characters .story{width:950px;text-align:center;position:absolute;top:610px;left:90px;z-index:20;}
	#characters .story .head{display:inline;margin-bottom:10px;}
	#characters .story .img{display:inline;}

	/*
	#characters .slider-item .btn_photo.update:after{content:'UPDATE';display:blockbackground-color:#faff00;color:#333;position:absolute;right:8px;top:0px;font-size:13px;border-radius:20px;padding:4px 10px;line-height:1;font-weight:600;box-shadow:3px 3px 0px rgba(0,0,0,0.3);font-style: italic;}*/

	#characters .slider-item h3{position:absolute;display:block;left:30px;top:30px;}
	#characters .slider-item p{ position:absolute;border:2px solid #fff;padding:10px 15px;display:block;left:130px;top:190px;color:#fff;line-height: 1.7em;}


.characters-list{background: url(../img/character/charalist_bg.jpg);padding: 80px 0 60px;position: relative;margin-top:40px;}
.characters-list::before{content:"";display: block;width: 100%;height: 3px;background-color: #dcebf1;top:15px;position: absolute;}
.characters-list-inner{width: 1000px;margin: auto;display: flex;flex-wrap: wrap;gap:13px;padding:0 60px;}

.characters-item{text-align: center; width: 112px;display: block;position: relative;}
.characters-item__icon{width: 100%;border-radius: 100px;padding-bottom: 100%;position: relative;overflow: hidden;}
.characters-item__icon img{display: block;width: 100%;position: absolute;top:0;}
.characters-item__name{color:#fff;font-size:1em;line-height:1.2;font-weight: bold;margin-top: 0.5rem;text-shadow: 0 0 0.5rem rgba(77, 110, 186, 0.9);}
.characters-item__cv{font-size:0.9em;}

.characters-item.i-on .characters-item__icon::after{content:"";display:block;border: 3px solid #f75087;width: calc(100% - 6px);height:calc(100% - 6px);position: absolute;top:0px;left:0px;border-radius: 100px;transition:all 0.5s;}

.characters-item:hover .characters-item__icon::after{content:"";display:block;border: 3px solid #f75087;width: calc(100% - 6px);height:calc(100% - 6px);position: absolute;top:0px;left:0px;border-radius: 100px;}

#btn_back_02{
	padding: 40px;
  margin: 0;
  background: #75e0ec;
}

.btn_back_02_a{
	background-color: #fff;
	color: #09d;
	border-radius: 50px;
}

.characters-direct{
	/* display: flex;
	justify-content: center;
	gap:10px;
	margin:20px 0 60px; */
}


.characters-direct--prev{
	position: fixed;
	display: block;
	/* background-color: #f75087; */
	color: #fff;
	/* border-radius: 50px; */
	/* padding:7px 25px; */
	/* font-size: 22px; */
	top:50%;
	font-size: 0;
	line-height: 0;
	left:10px;
	z-index: 10;
	text-indent: ー99999px;
}
.characters-direct--next{
	position: fixed;
	/* background-color: #f75087; */
	color: #fff;
	/* border-radius: 50px; */
	/* padding:7px 25px; */
	/* font-size: 22px; */
	top:50%;
	font-size: 0;
	line-height: 0;
	right:10px;
	z-index: 10;
	text-indent: -99999px;
}
/* .characters-direct--prev img, */
.characters-direct--prev img{
	width: 4rem;
	display: block;
	/* margin-top: -0.3em; */
	/* margin-bottom: -0.4em; */
	/* margin-left: -1rem; */
}
.characters-direct--next img{
	width: 4rem;
	display: block;
	/* margin-top: -0.3em; */
	/* margin-bottom: -0.4em; */
	/* margin-right: -1rem; */
}
