﻿@charset "utf-8";

/* ベース */
html,body{
font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HiraKakuPro-W3","ＭＳ Ｐゴシック","MS PGothic",Arial, Helvetica,sans-serif;
line-height:1.5;
letter-spacing:1.5px;
height:100%;
background:url(../img/bg_body.png) #000000 top center;
}

#wrapper{
width:100%;
min-width:1260px;

}



/*////////////////////////////////////////////////////////////////////////////////////////*/
/* 表現の拘り */

#insistence01{
width:1260px;
height:1460px;
margin-top:-100px;
margin-right:auto;
margin-left:auto;
background:url(../img/bg_insistence.png) no-repeat top center;
text-align:center;
position:relative;
}


/* 被せ用ＢＧ左 */
.insis_lbg00{
width:424px;
height:1492px;
margin-top:0px;
margin-left:0px;
z-index:100;
position:absolute;
opacity: 1;
}

/* 被せ用ＢＧ右 */
.insis_rbg00{
width:143px;
height:1492px;
margin-top:0px;
margin-left:1117px;
z-index:100;
position:absolute;
opacity: 1;
}

/* 黒フィルター上 */
#black01{
width:615px;
height:616px;
margin-top:0px;
margin-left:463px;
z-index:120;
position:absolute;
background:rgba(0,0,0,0.7);
}

/* 黒フィルター下 */
#black02{
width:615px;
height:616px;
margin-top:975px;
margin-left:463px;
z-index:120;
position:absolute;
background:rgba(0,0,0,0.7);
}

/* 文字01 */
.insis01{
margin-top:200px;
margin-right:auto;
margin-left:14px;
z-index:500;
position:absolute;
}


/* 文字02 */
.insis02{
margin-top:1172px;
margin-right:auto;
margin-left:527px;
z-index:500;
position:absolute;
}


/*////////////////////////////////////////////////////////////////////////////////////////*/
/* slick_ＣＧ用 */



#cg_slick01{
width:970px;
height:1500px;
margin-top:0px;
margin-right:auto;
margin-left:285px;
display:block;
position:absolute;
text-align:center;
padding:auto;
}

#thumb01{
margin-top:68px;
margin-right:auto;
margin-left:auto;
width:970px;
height:1500px;
display:block;
position:relative;
text-align:center;
padding:0px 0px 0px 0px;

}



.slider .slick-slide{
    margin-top: -3px;

  }


.slick-prev{
margin-right:105px;
margin-left:auto;
height:77px;
margin-top:930px;
background:rgba(0,0,255,0.5);
}


.slick-next{
margin-right:auto;
margin-left:802px;
height:77px;
margin-top:384px;
background:rgba(0,0,255,0.5);
}


/*////////////////////////////////////////////////////////////////////////////////////////*/
/* slick_サムネイル用 */

#cg_slick02{
width:136px;
height:1470px;
margin-top:0px;
margin-right:auto;
margin-left:104px;
display:block;
position:absolute;
text-align:center;
padding:auto;
background:url(../img/insis_sfilm00.png) no-repeat top center;
z-index:200;
}

#thumb02{
margin-top:500px;
margin-right:auto;
margin-left:auto;
width:120px;
height:700px;
display:block;
position:relative;
text-align:center;
padding:5px 5px 5px 7px;
z-index:200;
}

.slider-nav .slick-slide{
    margin-top: 4px;

  }

/*////////////////////////////////////////////////////////////////////////////////////////*/

/* 大きいサムネイル 中央以外グレー */
.slider .slick-slide {
    -webkit-transition:all 0.5s ease-in-out;
    transition:all 0.5s ease-in-out;
    
  }
 
.slider .slick-slide:not(.slick-center) {
    pointer-events: none; /* aタグのリンクを無効にする */
    -webkit-filter: grayscale(1); /* Webkit */
	filter: gray; /* IE6-9 */
	filter: grayscale(1); /* W3C */
  }

/*////////////////////////////////////////////////////////////////////////////////////////*/

/* 小さいきサムネイル 選択以外グレー */
.slider-nav .slick-slide {
    -webkit-transition:all 0.1s ease-in-out;
    transition:all 0.1s ease-in-out;
    
    
  }
 
.slider-nav .slick-slide:not(.slick-center) {
    -webkit-filter: sepia(100%); /* Webkit */
	filter: sepia; /* IE6-9 */
	filter: sepia(100%); /* W3C */
  }


/*////////////////////////////////////////////////////////////////////////////////////////*/

/* 小さいほうサムネイル 中央枠 */


#thumb02 .slick-center{
	border: 3px solid #F00;
	width:100px;

}





/*////////////////////////////////////////////////////////////////////////////////////////*/

#cg_no{
	width:100px;
	height:30px;
    position: absolute;
    left: 1100px;
    top: 260px;
    color: rgb(255,255,255);
    font-weight: bold;
    font-size: 19px;
    text-shadow: #4F1640 2px 2px 0px, #4F1640 -2px 2px 0px,
           		 #4F1640 2px -2px 0px, #4F1640 -2px -2px 0px;
    background:rgba(0,0,255,0.5);
}

/*////////////////////////////////////////////////////////////////////////////////////////*/

.text {
    position: absolute;
    left: 5px;
    top: 5px;
    color: rgb(255,255,255);
    font-weight: bold;
    font-size: 19px;
    text-shadow: #4F1640 2px 2px 0px, #4F1640 -2px 2px 0px,
           		 #4F1640 2px -2px 0px, #4F1640 -2px -2px 0px;
}




/*////////////////////////////////////////////////////////////////////////////////////////*/

#footer{
position:relative;
height:120px;
width:100%;
min-width:1260px;
padding-bottom:10px;
padding-top:20px;
background:url(../img/bg_footer.png) repeat-x top center;
margin-top:-5px;
z-index:300;
}

#footer p{
color:#F2EEEE;
font-size:12px;
text-align:center;
letter-spacing:4px;
margin-bottom:20px;
}

#footer ul{
font-size:10px;
text-align:center;
letter-spacing:-.40em;
margin-bottom:15px;
}

#footer ul li{
display:inline-block;
vertical-align:middle;
letter-spacing:normal;
}

#footer ul li a{
display:block;
letter-spacing:4px;
width:150px;
padding-top:5px;
padding-bottom:5px;
border-right:1px dashed rgba(255,255,255,0.6);
}

#footer li a:hover{
background:rgba(0,0,0,0.1);
}

#footer a:link{color:#fdd5a6;}
#footer a:visited{color:#fdd5a6;}
#footer a:hover{color:#FFF;}

#footer p a:hover{color:#FFF;}






/*////////////////////////////////////////////////////////////////////////////////////////*/
.page-back {
 position: fixed;
 bottom: 5px;
 right: 50px;
 z-index:400;
}