﻿body {
    background-color:#ffffff;
}

body {
    min-width: 1400px;
}
.content_width {
    width: 1400px;
    margin: 0 auto;
}


/* top header  -----------------------------------------------*/
#bg_top_header_00{
    background-image: url('img/bg_top_header_00.jpg');
    background-repeat: repeat-x;
    background-position: center top;
}
#bg_top_header_10{
    background-image: url('img/bg_top_header_10.jpg');
    background-repeat:no-repeat;
    background-position: center top;
}
#top_header{
    height:600px;
}



/* header -----------------------------------------------*/
#bg_header_00{
    background-image: url('img/bg_header_00.jpg');
    background-repeat: repeat-x;
    background-position: center top;
    background-color: #AFFDC6;
}
#bg_header_10{
    background-image: url('img/bg_header_10.png');
    background-repeat:no-repeat;
    background-position: center top;
}
#header{
    height: 155px;
}

/* menu -----------------------------------------------*/
#bg_menu_00{
/*    background-repeat: no-repeat;
    background-position: center top;
    background-color: #000000;*/
}
#bg_menu_10{
/*    background-repeat: no-repeat;
    background-position: center top;*/
}
#menu{
    /* [height]+[padding-top] = bg_menuの[background-image]の高さに設定する*/
    height: 84px;
    padding-top: 0px;
}
#menu table{
    margin-top: 0px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 0px;
    border-collapse: separate;
    border-spacing: 0px 0px;

}
#menu a{
    display:inline-block;
}

/* footer -----------------------------------------------*/
#bg_footer_00 {
    background-image:url('img/bg_footer_00.png');
	background-repeat: repeat-x;
	
    }

#bg_footer_10 {
	background-image: url('img/bg_footer_10.png');
    background-repeat:no-repeat;
    background-position: right;
}
#footer{
    height: 138px;
    background-image: url(img/footer.png);
}


/* content default -----------------------------------------------*/
#bg_content_00{
    background-image: url("img/bg_content_00.jpg");
/*    background-attachment: fixed;*/
    background-position: center top;

    overflow:hidden;
}
        
#bg_content_fix{
/*    background-image: url('img/bg_content_fix.png');*/
    background-repeat: repeat-y;
    background-position: center top;
    padding-top:1px;
    height:879px;
}

#bg_content_fix #content{

}

#bg_content_loop {
    background-image: url('img/border_top.png');
    background-repeat: repeat-x;
    background-position: center top;
    position: relative;
    padding-top:1px;    
	min-height:1000px;
}

#bg_content_loop_top{
	
}

#bg_content_loop_bottom{
    background-image:none;
    height: 0px;


}



#bg_content_loop #content{
    position: relative;
    min-height: 750px;
    padding-bottom: 1px;
}

/* h1 h2 h3 -----------------------------------------------*/
h1 {
	margin:15px 0 15px;
    text-align: center;
	/*
    background-image: url(img/h1_base.jpg);
	*/
}

/* ギャラリー関連　-----------------------------------------------*/
h2.gallery{
	text-align: center;
	margin: 10px auto;
}

.next_cg{
margin: 0px auto;
}

.next_cg a{
    display: inline-block;
    width: 80px;
    height: 600px;
    background-color: #3F4BAF;
    background-position: center center;
    background-repeat: no-repeat;
    border-radius: 12px;
    border: 2px solid hsla(253,66%,89%,1.00);
}
.next_cg a.prev_button{
    background-image: url(img/gallery_prev.png);
	
}
.next_cg a.next_button{
	    background-image: url(img/gallery_next.png);
}
.next_cg a:hover{
			background-color: #C2CB9A;
}
		.subcg_list{
    margin-top: 0px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 21px;
    border-collapse: separate;
    border-spacing: 10px 1px;
		}
		.subcg_list div{
			background-color: #3F4BAF;

		}
		.subcg_list div:hover{
			background-color: #C2CB9A;
		}
				
		.subcg_list div img{
						opacity: 0.5;
		}
		.subcg_list div.this_page img{
			opacity: 1.0;
		}
		.cg_story {
    margin: 10px auto;
    width: 1000px;
    padding: 20px 40px;
    /* [disabled]background-color: hsla(235,47%,38%,0.80); */
    color: #ffffff;
    font-size: 18px;
    line-height: 175%;
    font-weight: bold;
    border-radius: 20px;

    background-image: url(img/cg_story_bg.png);
		}
		.cg_story.sakura{
			    text-shadow: 0px 4px 5px #BD094C,0px 0px 3px #BD094C,0px 0px 3px #BD094C,0px 0px 1px #BD094C;
		}
		.cg_story.yuzuha{
    text-shadow: 0px 4px 5px #086BBD,0px 0px 3px #086BBD,0px 0px 3px #086BBD,0px 0px 1px #086BBD;
		}
		.cg_story.kyouka{
    text-shadow: 0px 4px 5px #048E14,0px 0px 3px #048E14,0px 0px 3px #048E14,0px 0px 1px #048E14;
		}
		.cg_story.touka{
    text-shadow: 0px 4px 5px #8F8A04,0px 0px 3px #8F8A04,0px 0px 3px #8F8A04,0px 0px 1px #8F8A04;
		}
		.cg_story.suzuka{
    text-shadow: 0px 4px 5px #04478F,0px 0px 3px #04478F,0px 0px 3px #04478F,0px 0px 1px #04478F;
		}


/*キャラクター紹介ページ用共通・始まり -----------------------------------------------*/

#char_menu{
    margin: 0 auto;
    border-spacing: 0px 0px;
    border-collapse: separate;
}
#character{
    padding-top:10px;
    text-align:center;
}

#voice_menu{
    text-align:center;
    background-color:#000000;
    width:800px;
    margin:0 auto;
}

#voice_menu1{
    position: absolute;
    top: 367px;
    left: 168px;	
}

#voice_menu2{
    position: absolute;
    top: 490px;
    left: 168px;
	
}
#voice_menu3{
    position: absolute;
    top: 571px;
    left: 124px;
	
}
#voice_menu1 a:hover,#voice_menu2 a:hover ,#voice_menu3 a:hover {
	opacity: 0.8;
}


		#char_desc{
    margin-top: 18px;
	width: 1400px;
    height: 618px;
			 position: relative;
		}
		#char_text{
    position: absolute;
    width: 420px;
    background-color: hsla(0,0%,0%,0.59);
    right: 32px;
    bottom: 32px;
    padding: 8px 16px;
    border-radius: 16px;
    min-height: 179px;
		}
		
		#char_text p {
    color: #F1E0E1;
    font-size: 14px;
    line-height: 159%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-shadow: 0px 0px 5px #2B2C2A,0px 0px 3px #2C2D2B,0px 0px 3px #2C2D2B,0px 0px 1px #2C2D2B;
    padding-bottom: 0px;
    margin-top: 8px;
}
		
		#char_ev{
    position: absolute;
    left: 20px;
    bottom: 15px;
    border-collapse: separate;
    border-spacing: 6px 6px;
		}	

.char_hensin_btn {
    position: absolute;
    left: 453px;
    top: 592px;
    width: 167px;
}
.change_btn {
    position: absolute;
    width: 167px;
    height: 171px;
    top: 592px;
}

.change_btn:hover {
    background-color: rgba(255, 255, 0, 0.5);
    box-shadow: 0px 0px 22px 22px rgba(255, 255, 0, 0.5);
    border-radius: 20px;
}
.change_btn_right {
    left: 453px;
}
.change_btn_left {
    left: 453px;
    opacity: 0.0;
}

.bg_char {
    height: 1214px;
    background-repeat: no-repeat;
    background-position: center 151px;
    position: absolute;
    width: 100%;
}
.bg_char01 {
    background-image: url('img/char_bg01.png');
}
.bg_char02 {
    background-image: url('img/char_bg02.png');
    background-repeat: repeat-x;
}

.char_tachi {
    position: absolute;
    left: 623px;
    width: 441px;
    top: 29px;
}
.char_spec {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 980px;
}

.character_in {
    position: relative;
    width: 1400px;
    height: 1114px;
    margin: 0px auto;
}
/*キャラクター紹介ページ用共通・終わり -----------------------------------------------*/

.float{
	position: fixed;
	background-repeat: no-repeat;
	background-position: center center;
}
.float a{
    display: inline-block;
}

.float a:hover {
    opacity: 0.9;
}

#float_twitter{
	    top: 0px;
    right: 100px;
}
#float_twitter a{
	    width: 69px;
    height: 114px;
	    background-image: url(img/float_twitter.png);
}

#float_tinker{
	    top: 0px;
    right: 30px;
	}
#float_tinker a{
	    width: 69px;
    height: 114px;
	    background-image: url(img/float_tinker.png);
}


#float_shop{
	    bottom: 200px;
    left: 0px;
	}
#float_shop a{	
	    width: 129px;
    height: 511px;
	    background-image: url(img/float_shop.png);
}



#float_index{
	    bottom: 500px;
    right: 0px;
	}
#float_index a{		
	    width: 87px;
    height: 76px;
	    background-image: url(img/float_index.png);
}


#float_campaign{
	    bottom: 400px;
    right: 0px;
	}
#float_campaign a{		
	    width: 87px;
    height: 76px;
	    background-image: url(img/float_campaign.png);
}

#float_movie{
	    bottom: 300px;
    right: 0px;
	}
#float_movie a{		
	    width: 87px;
    height: 76px;
	    background-image: url(img/float_movie.png);
}

#float_taiken{
    /*background-color: greenyellow;*/
    background-image: url("img/float_masterup.png");
    width: 652px;
    height: 551px;

	}
#float_omake{
    /*background-color: greenyellow;*/
    background-image: url("img/float_omake.png");
    width: 579px;
    height: 597px;

	}

#float_taiken div{		
	    width: 456px;
    height: 291px;

	/*background-color: red;*/
}



/*●back-top begin-----------------------------------------*/
#back-top {
    position: fixed;
    bottom: 100px;
    right: 16px;
 /*   background-color: hsla(307,18%,49%,0.85);*/
    border-radius: 10px;
    background-image: url(img/upa.png);
    background-repeat: no-repeat;
    background-position: center center;
}
#back-top a{
    display: block;	

    width: 180px;
    height: 190px;
}

#back-top a:hover {
   /* background-color: #FF326D;*/
	opacity: 0.9;
}
/*●back-top end-----------------------------------------*/
