/*inview
--------------------------------------------------------*/
.scroll {
  width: 100%;
  margin: 0 auto;
  padding: 0;
}

.scroll > div {
  list-style: none;
  transition: 0.5s;

}


.scroll .fade_in {
  opacity: 0;  
}

.scroll .fade_in_anime {
  opacity: 1;  
}

.scroll .up {
  transform: translate(0,50px); 
  -webkit-transform: translate(0,50px); 
  opacity: 0;  
}

.scroll .up_anime {
  transform: translate(0,0); 
  -webkit-transform: translate(0,0); 
  opacity: 1;  
}

.scroll .side {
  transform: translate(50px,0); 
  -webkit-transform: translate(50px,0);
  opacity: 0;  
}

.scroll .side_anime {
  transform: translate(0,0); 
  -webkit-transform: translate(0,0);
  opacity: 1;  
}

/*コス画像切り替え（SP）
--------------------------------------------------------*/
.js-swapImage .thumbnail{
background: url(../img/chara_cos_title.png) no-repeat top center;
position: static;
width: 70%;
padding: 40px 0 0;
height: auto;
display: flex;
margin: 0 auto 1em;
 justify-content: space-between;
}

.js-swapImage .thumbnail li{
flex: 0 1 30%;
	}

/*新着情報（SP）
--------------------------------------------------------*/
.news_box{
	width: 100%;
	margin: -2px auto 0;
	position: relative;
	color: #444;
	background: url(../img/news_bg.jpg) top center #ff0080;
	text-align: left;
	font-size: 100%;
	background-size:100% auto;
}
.news_box .title{
	display: block;
	height: auto;
	width: 100%;
}
.news_box .middle{
	padding: 0 1em;
}

.news_box dl{
	margin: 0;
	padding: 5px 0 10px;
	border-bottom: #c1b7b1 solid 1px;
	clear: both;
}
.news_box dt{
	float: none;
	clear : both;
	width: 6.2em;
	height: auto;
	display: block;
	max-width:6.2em;
	line-height: 120%;/* IE11対策 */
	text-align: left;
	color: #ff0080;
	font-weight: bold;
}
.news_box dd{
	margin-left : 0;
	width: auto;
	background-position: 0px 0px;
	padding: 0;
	line-height: 120%;/* IE11対策 */

}

.news_box label {
	cursor: pointer;
	text-align: center;
	position: absolute;
	bottom: 0;
	width: 100%;
}

.news_box label:after {
	content: url(../img/btn_news_open.png);
	position: absolute;
	bottom: -20px;/* Openボタンの位置 */
	right: 10px;/* Openボタンの位置 */
	width: 140px;
	height: 50px;

}
.news_box label:before {

}
.news_box input {
	display: none;
}

.news_box .middle {
	overflow: hidden;
	height: 100px; /* デフォルトのボックスの高さ */
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}

.news_box input:checked + label {
}
.news_box input:checked + label:after {
	content: url(../img/btn_news_close.png);
}
.news_box input:checked + label:before {
}
.news_box input:checked ~ .middle {
    height: auto;
	padding-bottom: 10px;/* Closeボタンの位置 */
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}

.news_box a{color: #ff0080;}
.news_box a:hover{color: #808033;}

/* pagetop --------------------------------start */
.pagetop {
    display: none;
    position: fixed;
    bottom: 30px;
    right: 10px;
	width: 90px;
	height: 60px;
	text-indent: -9999px;
	z-index: 99999;
}
.pagetop a {
    display: block;
	width: 90px;
	height: 60px;
    background-image: url(../img/btn_back.png);
	background-size:100% auto;
	filter:alpha(opacity=100);
    -moz-opacity: 1.0;
    opacity: 1.0;
}
.pagetop a:hover {
    display: block;
	filter:alpha(opacity=70);
    -moz-opacity: 0.7;
    opacity: 0.7;
}
/* pagetop ----------------------------------end */

/* Tablet （画面481px以上1023以下）
=================================================*/
@media screen and (min-width:481px) {

}


/* PC 画面サイズ1024px以上
=================================================*/
@media screen and (min-width: 1024px) { 
/*メインキャラ（PC）
--------------------------------------------------------*/
ul.main_chara{
	position: relative;
	width: 1420px;
	height: 860px;
	}
ul.main_chara li{
	display: none;
	}

ul.main_chara .chara01,ul.main_chara .chara02,ul.main_chara .chara03,ul.main_chara .chara04,ul.main_chara .chara05,
ul.main_chara .chara06,ul.main_chara .chara07,ul.main_chara .chara08,ul.main_chara .chara09,ul.main_chara .chara10,
ul.main_chara .chara11,ul.main_chara .chara12,ul.main_chara .chara13,ul.main_chara .chara14{
	position: absolute;
	background: none;
	}
	
	
ul.main_chara .chara01{
	width: 530px;
	height: 575px;
	bottom: 0;
	left: 65px;
	z-index: 100;
	}
ul.main_chara .chara02{
	width: 470px;
	height: 540px;
	bottom: 0;
	right: 155px;
	z-index: 100;
	}
ul.main_chara .chara03{
	width: 350px;
	height: 575px;
	bottom: 0px;
	left: 390px;
	z-index: 99;
	}
ul.main_chara .chara04{
	width: 450px;
	height: 550px;
	bottom: 0;
	right: 440px;
	z-index: 98;
	}
ul.main_chara .chara05{/*レオナ*/
	width: 225px;
	height: 270px;
	top: 35px;
	right: 290px;
	z-index: 93;
	}
ul.main_chara .chara06{/*ユリ*/
	width: 300px;
	height: 320px;
	bottom: 35px;
	left: 290px;
	z-index: 95;
	}
ul.main_chara .chara07{/*シェルミー*/
	width: 290px;
	height: 270px;
	top: 200px;
	right: 340px;
	z-index: 96;
	}
ul.main_chara .chara08{/*シルヴィ*/
	width: 375px;
	height: 350px;
	top: 5px;
	left: 145px;
	z-index: 90;
	}
ul.main_chara .chara09{/*サリナ*/
	width: 380px;
	height: 555px;
	bottom: 0px;
	right: 0px;
	z-index: 97;
	}
ul.main_chara .chara10{/*ラブ*/
	width: 355px;
	height: 625px;
	bottom: 0px;
	left: 0px;
	z-index: 96;
	}
ul.main_chara .chara11{/*ミアン*/
	width: 150px;
	height: 470px;
	top: 40px;
	left: 600px;
	z-index: 95;
	}
ul.main_chara .chara12{/*ルオン*/
	width: 330px;
	height: 600px;
	top: 10px;
	left: 360px;
	z-index: 96;
	}
ul.main_chara .chara13{
	width: 425px;
	height: 520px;
	bottom: 185px;
	right: 140px;
	z-index: 96;
	}
ul.main_chara .chara14{
	width: 295px;
	height: 350px;
	top: 10px;
	right: 440px;
	z-index: 94;
	}
	
	
	
/*コス画像切り替え（PC）
--------------------------------------------------------*/
.targetImg img{
position: absolute;
top:0;
left: 0;
z-index: 888;
width: auto;
}
.js-swapImage .thumbnail{
background: url(../img/chara_cos_title.png) no-repeat top center;
position: absolute;
top:350px;
left: 10px;
z-index: 2000;
width: 260px;
padding: 40px 0 0;
height: auto;
display: flex;
}

.js-swapImage .thumbnail li{
flex: 0 1 30%;
	}
	
/*新着情報（PC）
--------------------------------------------------------*/
.news_box{
	width: 100%;
	margin: 0 auto;
	background: url(../img/news_bg.jpg) top center #ff0080;
	text-align: left;
	font-size: 110%;
}
.news_box .title{
	width: 1000px;
	height: 70px;
	margin: 0 auto;
	}
.news_box .middle{
	width: 840px;
	margin: 0 auto;
	padding: 0 60px;
}
.news_box dt{
	float: left;
	font-size: 16px;

}
.news_box dd{
	margin :0 0 0 6.2em;
	font-size: 16px;
	text-align: left;
}
/* pagetop --------------------------------start */
.pagetop {
	width: 180px;
	height: 120px;
}
.pagetop a {
	width: 180px;
	height: 120px;
}

/* pagetop ----------------------------------end */

}