@charset "UTF-8";
/*=============================================================================

	style.css

============================================================================= */
.hover a {
	display: block;
}
.hover a:hover {
	opacity: 0.7;
}
/* =============================================================================

ファッションチェック

============================================================================= */
/*=============================================================================

	トップページ

============================================================================= */
#project{
	padding: 24px 0;
}
#project h3 {
	margin:0 0 12px 0;
	padding: 10px 0;
	color: #0e68ab;
	font-weight: bold;
	font-size: 28px;
	font-size: 2.8rem;
}
#project h3 span{
	max-width: 200px;
	display: inline-block;
	vertical-align: middle;
	padding-right: 15px;
}
#project h3 em{
	font-style: normal;
	display: inline-block;
	vertical-align: middle;
}
#project p{
	font-weight: bold;
	font-size: 18px;
	font-size: 1.8rem;
}
@media screen and (max-width: 800px) {
#project h3 span{
	max-width: 30%;
}
.sp-clear{clear: both;
}
	
}	/* for SP max-width: 800px */

/*-----------------------------------
トップスライダー
------------------------------------*/
#banner-slider{
	position: relative;
	background-repeat: repeat;
	padding: 24px 0;
	margin-bottom: 24px;
}
/*
#banner-slider.vol1{
	background-image: url(../images/bg-slider-vol1.jpg);
}
#banner-slider.vol2{
	background-image: url(../images/bg-slider-vol2.jpg);
}*/
.slick-slide,
.slick-slide a {
	outline: none;
}
.slick-slide img {
	display: block;
	padding: 15px;
}
.slick-next {
	right: 0px!important;
	height: 108px;
	width: 37px;
}
.slick-prev {
	left: 0px!important;
	width: 37px;
	height: 108px;
}
.slick-next img,
.slick-prev img{
	width: 100%;
}
div.slick-next,
div.slick-prev{
	z-index: 1 !important;
}
button.slick-next,
button.slick-prev{
	z-index: 2 !important;
}

/* タブレット以下 */
@media screen and (max-width: 1070px) {

}	/* for tablet max-width: 1070px */

/* SP向けレイアウトの指定：～800px */
@media only screen and (max-width: 800px) {	
#banner-slider{
	position: relative;
	background-repeat: repeat;
	padding: 20px 0;
	margin-bottom: 20px;
}	
.slick-slide img {
	padding: 0;
}
.slick-next {
	height: 88px;
	width: 30px;
}
.slick-prev {
	height: 88px;
	width: 30px;
}	
#index--banner-slider{
	padding: 12px 0;
}	

}	/* for SP max-width: 800px */


/*-----------------------------------
人物選択
------------------------------------*/
#selector{
	padding: 0 0 40px;
}
#selector .col-xs-3 {
	height: 840px;
	margin-top: 20px;
}
.selector-content{
	position: relative;
}
.selector-vo1 .selector-content{
	padding: 65px 15px 0 0;
}
.selector-vo2 .selector-content{
	padding: 0 15px 0 0;
}
.selector-vo3 .selector-content{
	padding: 63px 15px 0 0;
}
.selector-vo4 .selector-content{
	padding: 63px 15px 0 0;
}
.selector-vo5 .selector-content{
	padding: 0 0 0 0;
}
.selector-vo6 .selector-content{
	padding: 63px 0 0 0;
}
.selector-coming .selector-content{
	padding: 60px 0px 0 0;
}
.selector-vo3 .selector-content img{
	transform: scale(1.15,1.15);
}
.selector-vo4 .selector-content img{
	transform: scale(1.15,1.15);
}
.selector-vo1,
.selector-vo2,
.selector-vo3,
.selector-vo4,
.selector-vo5,
.selector-vo6,
.selector-vo7{
	position: relative;
	moz-transition: -moz-transform 0.1s linear;
	-webkit-transition: -webkit-transform 0.1s linear;
	-o-transition: -o-transform 0.1s linear;
	-ms-transition: -ms-transform 0.1s linear;
	transition: transform 0.1s linear;
}
.selector-vo1:hover,
.selector-vo2:hover,
.selector-vo3:hover,
.selector-vo4:hover,
.selector-vo5:hover,
.selector-vo6:hover,
.selector-vo7:hover{
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-o-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);
}

/* タブレット以下 */
@media screen and (max-width: 1070px) {
#selector .col-xs-3 {
	height: 70vw;
}
#selector .selector-content{
	padding: 5vw 15px 0 0 !important;
}	
	
}	/* for tablet max-width: 1070px */


@media (max-width: 767px) {
#selector{
	padding: 0 0 20px;
}	
#selector{
	margin-top: -10vw;
}
#selector .col-xs-3 {
	margin-top: 10vw;
	height: 140vw;
}
#selector .selector-content{
	padding: 7vw 15px 0 0 !important;
}		

}	/* for SP max-width: 767px */

@media (max-width: 600px) {
#selector .col-xs-3:nth-child(odd) {
	padding-left: 0;
	padding-right: 2vw;
}
#selector .col-xs-3:nth-child(even) {
	padding-right: 0;
	padding-left: 2vw;
}	

}	/* for SP max-width: 600px */

/*-----------------------------------
img_change_wrp
------------------------------------*/
.img_change_wrp {
	position: relative;
}
.img_change_wrp .img01 {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
}
#selector a:hover .img_change_wrp .img01 {
	opacity: 0;
}
.img_change_wrp .img02 {
	position: relative;
	z-index: 1;
	opacity: 0;
}
#selector a:hover .img_change_wrp .img02 {
	opacity: 1;
}

/* タブレット以下 */
@media screen and (max-width: 1070px) {	

}	/* for tablet max-width: 1070px */

/* SP向けレイアウトの指定：～800px */
@media only screen and (max-width: 800px) {	

}	/* for SP max-width: 800px */


/*=============================================================================

	ファッションアドバイス

============================================================================= */
.mt36 {
	margin-top: 36px !important;
}
.mb36 {
	margin-bottom: 36px !important;
}

/* タブレット以下 */
@media screen and (max-width: 1070px) {

}	/* for tablet max-width: 1070px */

/* SP向けレイアウトの指定：～800px */
@media only screen and (max-width: 800px) {	

}	/* for SP max-width: 800px */


/*=============================================================================

	ファッションチェック

============================================================================= */
/*-----------------------------------
vol1
------------------------------------*/
#section-1{
	position: relative;
}
.section-1{
	position: relative;
	/*
	background-image: url(../images/img-vol01-1.png);
	background-repeat: no-repeat;
	background-position: left top;
	width: 100%;
	min-height: 680px;
	background-size: contain;
	*/
}

.section-1-image{
	margin-top: 100px;
}
.section-1-isamu{
	position: absolute;
	right: -30px;
	bottom: 0;
}
.img-2{
	margin-top: 30px;
}
.img-3{
	margin-top: -55px;
}
.img-4{
	margin-top: -250px;
}
.img-5{
	margin-top: -280px;
}
.img-6{
}
.img-7{
 	margin-top: -300px;
	margin-right: -20px;
}
.img-8{
	margin: 80px 0;
}
.img-9{
	margin-top: -50px;
}
.img-11{
	margin-top: 30px;
	margin-bottom: 20px;
}

/* タブレット以下 */
@media screen and (max-width: 1070px) {
.section-1-image{
	margin-top: 5vw !important;
}	
.section-1-isamu{
	right: -3vw;
	width: 100%;
}
.img-2,
.img-3,
.img-4,
.img-5,
.img-6,
.img-7,
.img-8,
.img-9,
.img-10,
.img-11,
.img-12,
.img-13,
.img-14,
.img-15,
.img-16,
.img-17,
.img-18{
	margin: 2vw 0 0 !important;
}
.sp_mt{
	margin-top: -10vw !important;
}		

}	/* for tablet max-width: 1070px */

/* SP向けレイアウトの指定：～800px */
@media only screen and (max-width: 800px) {	

}	/* for SP max-width: 800px */

/*-----------------------------------
vol2
------------------------------------*/
.vol2 .img-2{
	margin-top:20px;
}
.vol2 .img-3{
	margin-top: -255px;
	margin-left: -35px;
}
.vol2 .img-4{
	margin-top: -100px;
}
.vol2 .img-5{
	margin-top: -50px;
}
.vol2 .img-6{
}
.vol2 .img-7{
	margin-top:0px;
	margin-right: 0px;
}
.vol2 .img-8{
	margin-top: -100px;
}
.vol2 .img-9{
	margin-top: -245px;
}
.vol2 .img-11{
	margin-top: 0px;
	margin-bottom: 0px;
}

/* タブレット以下 */
@media screen and (max-width: 1070px) {

}	/* for tablet max-width: 1070px */

/* SP向けレイアウトの指定：～800px */
@media only screen and (max-width: 800px) {	

}	/* for SP max-width: 800px */

/*-----------------------------------
vol3
------------------------------------*/
.vol3 .section-1-isamu{
	top: 380px;
  right: 0;
}
.vol3 .img-1{
	/*margin: 50px 0 0 -30px;*/
}
.vol3 .img-2{
	margin-top:0px;
}
.vol3 .img-3{
	margin-top: 50px;
	margin-left: 0px;
}
.vol3 .img-4{
	margin-top: -50px;
}
.vol3 .img-5{
	margin-top: -250px;
}
.vol3 .img-6{
	margin-top: -180px;
}
.vol3 .img-7{
 	margin-top:-120px;
	margin-right: 0px;
}
.vol3 .img-8{
	margin: 0 0 0 0;
}
.vol3 .img-9{
	margin-top: 0px;
}
.vol3 .img-10{
	margin: 30px 0;
}
.vol3 .img-11{
	margin: 30px 0;
}

/* タブレット以下 */
@media screen and (max-width: 1070px) {
.vol3 .section-1-isamu{
	top: 34vw;
}	


}	/* for tablet max-width: 1070px */

/* SP向けレイアウトの指定：～800px */
@media only screen and (max-width: 800px) {	

}	/* for SP max-width: 800px */

/*-----------------------------------
vol4
------------------------------------*/
.vol4 .section-1-isamu{
	top: 360px;
  right: 0;
}
.vol4 .img-1{
	margin: 50px 0 0 -30px;
}
.vol4 .img-2{
	margin-top:0px;
}
.vol4 .img-3{
	margin-top: 50px;
  margin-left: 0px;
}
.vol4 .img-4{
	margin-top: -150px;
}
.vol4 .img-5{
	margin-top: -220px;
  margin-left: 0px;
}
.vol4 .img-6{
	margin-top: -150px;
}
.vol4 .img-7{
	margin: -100px 0 0 0;
}
.vol4 .img-8{
	margin: 0 0 0 0;
}
.vol4 .img-9{
	margin: 180px 0 180px 0;
}
.vol4 .img-11{
	margin: -100px 0 0 0;
}
.vol4 .img-12{
	margin: -180px 0 0 0;
}
.vol4 .img-13{
	margin: -180px 0 0 0;
}
.vol4 .img-14{
	margin: -140px 0 0 0;
}
.vol4 .img-15{
	margin: 40px 0 0 0;
}

/* タブレット以下 */
@media screen and (max-width: 1070px) {
.vol4 .section-1-isamu{
	top: 34vw;
  right: 0;
}	

}	/* for tablet max-width: 1070px */

/* SP向けレイアウトの指定：～800px */
@media only screen and (max-width: 800px) {	

}	/* for SP max-width: 800px */

/*-----------------------------------
vol5
------------------------------------*/
.vol5 .section-1-isamu{
	top: 380px;
    right: 0;
}
.vol5 .img-1{
	margin: 50px 0 0 0;
}
.vol5 .img-2{
}
.vol5 .img-3{
	margin: 50px 0 0 0;
}
.vol5 .img-4{
	margin: -320px 0 0 0;
}
.vol5 .img-5{
	margin: -150px 0 0 0;
}
.vol5 .img-6{
	margin: -30px 0 0 0;
}
.vol5 .img-7{
	margin: -30px 0 0 0;
}
.vol5 .img-8{
	margin: -150px 0 0 0;
}
.vol5 .img-9{
	margin: -100px 0 0 0;
}
.vol5 .img-10{
	margin: -180px 0 0 0;
}
.vol5 .img-11{
	margin: -200px 0 0 0;
}
.vol5 .img-12{
	margin: 180px 0 180px 0;
}
.vol5 .img-13{
	margin: 0 0 0 0;
}
.vol5 .img-14{
	margin: -380px 0 0 0;
}
.vol5 .img-15{
	margin: -100px 0 0 0;
	position: relative;
	z-index: 100;
}
.vol5 .img-16{
	margin: -650px 0 0 0;
	position: relative;
	z-index: 0;
}
.vol5 .img-17{
	margin: 50px 0 0 0;
}

/* タブレット以下 */
@media screen and (max-width: 1070px) {
.vol5 .section-1-isamu{
	top: 34vw;
  right: 0;
}

}	/* for tablet max-width: 1070px */

/* SP向けレイアウトの指定：～800px */
@media only screen and (max-width: 800px) {	

}	/* for SP max-width: 800px */

/*-----------------------------------
vol6
------------------------------------*/
.vol6 .section-1-isamu{
	top: 320px;
	right: 0;
}
.vol6 .img-1{
	margin: 50px 0 0 0;
}
.vol6 .img-3{
	margin: -50px 0 0 0;
}
.vol6 .img-4{
	margin: -400px 0 0 0;
}
.vol6 .img-5{
	margin: -250px 0 0 0;
}
.vol6 .img-6{
	margin: -330px 0 0 0;
}
.vol6 .img-7{
	margin: -320px 0 0 0;
}
.vol6 .img-8{
	margin: -160px 0 0 0;
}
.vol6 .img-9{
	margin: -180px 0 0 0;
}
.vol6 .img-10{
	margin: -270px 0 0 0;
}
.vol6 .img-12{
	margin: -160px 0 0 0;
}
.vol6 .img-13{
	margin: 180px 0 180px 0;
}
.vol6 .img-14{
}
.vol6 .img-15{
	margin: -420px 0 0 0;
}
.vol6 .img-16{
	margin: -280px 0 0 0;
	z-index: 9;
	position: relative;
}
.vol6 .img-17{
	margin: -310px 0 0 0;
	z-index: 10;
	position: relative;
}
.vol6 .img-18{
	margin: -230px 0 0 0;
	z-index: 11;
	position: relative;
}

/* タブレット以下 */
@media screen and (max-width: 1070px) {
.vol6 .section-1-isamu{
	top: 29vw;
  right: 0;
}		

}	/* for tablet max-width: 1070px */

/* SP向けレイアウトの指定：～800px */
@media only screen and (max-width: 800px) {	

}	/* for SP max-width: 800px */

