header{		width:100%;		}

nav#global_menu{
	float:right;
	margin:0 0 20px 0;
}


/*	MainVisual	***********************/
#main_visual{
	position:relative;
	width:700px;
	height:400px;
	overflow:hidden;
	float:right;
	border-right:0px;
    background: #777 no-repeat top center;
    background-size: 100%; 	/*Retina用画像を縮小配置しているので必須*/
}

/*	Title	*/
#title{
	position:relative;
	min-width:260px;    
	width : 260px ; /* IE8以下とAndroid4.3以下用フォールバック */
	width : -webkit-calc(100% - 700px) ;
    width : -moz-calc(100% - 700px) ;
	width : calc(100% - 700px) ;
	float:left;
	height:500px; /*自動じゃないので右のコンテンツ（メニューとポスター）の高さを計算*/

	display:table;
	text-align: center;
	vertical-align: middle;

	-webkit-transition:all 1.5s ease-in-out;
    -moz-transition:all 1.5s ease-in-out;
	-o-transition:all 1.5s ease-in-out;
	transition:all 1.5s ease-in-out;
}

#title > p{

	display:table-cell;
	padding:0;
	padding-bottom:50px;

	-webkit-transition:all 0.8s ease-in-out;
    -moz-transition:all 0.8s ease-in-out;
	-o-transition:all 0.8s ease-in-out;
	transition:all 0.8s ease-in-out;
}

#title > p > span{
display:block;
	width:100%;
	height:380px;
    vertical-align: middle;
    background: url("../images/logo.png") center center no-repeat;
    background-size: 180px;
    
    -webkit-transition:all 0.2s ease-in-out;
    -moz-transition:all 0.2s ease-in-out;
	-o-transition:all 0.2s ease-in-out;
	transition:all 0.2s ease-in-out;
}





/*	Infomation	********************************/
section#info{
width:100%;
/*background-color:#5C7886;*/
/*margin-bottom:50px;*/
/*background: url("../images/new_back.png") right top no-repeat;*/
background-size: 20%;
}

#info_wrap{		/*　　#infoとは別に中央に揃えるために、左右をひとつにまとめてる要素　　*/
	position:relative;
	width:940px;
	margin:0 auto;
}

#site_caption{
	position:relative;
	float:left;
	width:620px;
	/*　↓Javascriptが動かなかった場合の背景画像　*/
	background: url("../images/sitecaption/caption_img05.png") right center no-repeat;
}

#info_wrap img.newinfoimg{
    width:100%;
    margin-bottom:2em;
}

#info_wrap #info_old{
max-height:250px;
overflow:scroll;
}


#new{
	position:relative;
	float:right;
	padding:45px 5px 5px 16px;
	margin:0 0 0 0px;
	list-style: none;
	line-height: 2.0em;
	background: url("../images/whatsnew.png") 5px 5px no-repeat;
	font-size: 12px;
	/*background-color:rgba(0,0,0,0.5);
	border-radius: 5px;*/
}

#new li{
	padding: 1px 1px 1px 5px;

}

#new li a:hover{
	background:#D9E021;
}

#new a{
	display:block;
}

#new a:link , #new a:visited{
	color:#338;
}







/*	よく使う	*/
.fa{
	color:rgba(83,71,65,100);
	margin:0 5px 0 0;
}

.list_v_last{
	border-bottom: none!important;
}

#copyright{
	display: block;
	clear:both;
}

.menu_fix{
	position: fixed;
  top: 0px;

  z-index: 800;
	width : 980px !important; /* IE8以下とAndroid4.3以下用フォールバック */
   width : -webkit-calc(100% - 260px)  !important;
   width : calc(100% - 260px)  !important;
   min-width:980px !important;
}



/**検索設定のところ*******************************/

div#find_bar{
	width:100%;
	padding:0 20px 0;
}

div#find_bar div#find01{
	width: 100%;
	background: #eee;
	padding:5px;
	display: table;
}

#refill_range{
	margin:0;
	padding:0;
	font-size:20px;
	display: table-cell;
	text-align: left;
	vertical-align: middle;
}

#refill_count{
	font-size:12px;
}

div#find_bar div#findoption{
	padding:0;
	display: table-cell;
	text-align: right;
	vertical-align: middle;
}

/*div#find_bar div#findoption label{
	font-size:12px;
}*/

#before_next{
	clear:both;
	width:100%;
	background:rgba(255,255,255,0.85);
	margin:0;
	padding:4px;
}

#before_next #beforeRadio , #before_next #afterRadio{
	display:none;
}

#before_next .beforelink,#before_next .afterlink{
	text-decoration: underline;
	color:#00f;
}

#before_next .beforelink:hover,#before_next .afterlink:hover{
	cursor: pointer;
	color:#f07;
}

#before_next .beforelink{
float:left;
}

#before_next .afterlink{
float:right;
}


form#sortChange{
display: inline;
}


#sort_selected{
	color:#fff;
	background:#07a;
	padding:2px 5px 2px;
	border-radius: 4px;
	margin:0 5px 0 0;
}

#sort_unselect{
	color:#ddd;
	text-decoration: none;
	background:#aaa;
	padding:2px 5px 2px;
	border-radius: 4px;
	margin:0 5px 0 0;
}


#sort_unselect:hover{
	color:#fff;
	background:#f07;
	cursor: pointer;
}

#sort_u_radio,#sort_d_radio{
display: none;
}



#category_setting{
	display: inline;
	margin-right:10px;
	/*float:right;*/
}
#volume_setting{
	display: inline;
	/*float:right;*/
}



/*	masonryの範囲	********************************/

div#refill_masonry{
	max-width:100%;
	margin:0 auto;
	padding: 0;
	padding-left:20px;	/*可変グリッドのコラム*/
	clear:both;
	/*background:#0f0;*/
	/*float:left;*/
}

.description{
box-sizing: border-box;
	-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;


	/*float:left;*/
	/*display:inline;*/
	border:2px solid #998675;
	padding:8px;
    width:300px;
    background:#bbb9aa;
	position: relative;
	margin:0 0 20px 0;

	line-height: 1.4em;
/*	transition: top 1s ease, left 1s ease;	
	-webkit-transition: top 1s ease, left 1s ease;
	-o-transition: top 1s ease, left 1s ease;*/
}



div.refill_img{
	width:110px;
	float:left;
	list-style: none;
	margin:0;
	padding:0;
	text-align: center;
	font-size: 80%;	
}

.refill_text{
padding:0 0 0 120px;
}
.refill_no{
	font-size: 12px;
	color: #0071BC;
	vertical-align: bottom;
}
.refill_title{
	margin:6px 0 0 0;
	font-size: 18px;
}

.description p{
	margin:0;
	width:100%;
	padding:0;
	color:#542;
	font-size: 12px;
}


.cat_link_radio{
display:none;
}

.cat_link_label{
	min-width:100px;
	color:#ccc;
	font-size:10px;
	background:#58a;
	padding:1px 4px 1px;
	border-radius: 4px;
}

.cat_link_label:hover{
	background:#b47;
cursor: pointer;
	}


.dl_total{
	font-size: 12px;
	color:#333;
	display: block;
	text-align: right;
	background-color: #cfcfcf;
	margin:0 0 10px 0;
	padding:0 5px 0 0;
}

.refill_detail{
	display: block;
	color: #fff;
	background:#0B3341;
	padding:0;
	border-radius: 6px;
	width:100%;
	text-align: center;
	float:right;
	margin:20px 0 20px 0;
}
.refill_detail:hover{
	background: #ED1E79;
}

.refill_detail a{
	padding: 10px 0px;
	display: block;
	width:100%;
	height:100%;
	color: #fff;
	text-decoration: none;
}

.ddl_btn{
	clear:both;
	display: block;
	padding:5px 0;
	margin:20px 0 0 0;
	background:#502;

	cursor: pointer;
	text-align: center;
	color:#fff;
	font-size: 10px;
}

.ddl_btn:hover{
	text-decoration: underline;
	}




/**大解像度用メディアクエリ*************************************************/


@media screen and (min-width: 1440px) {

#title{
/*background-color: #444;	*/	

background-color: rgba(68,68,68,1);	
/*padding-bottom:120px;*/
}

#title p{
	background: rgba(68,68,68,1);
	padding-bottom:120px;
}

#title span{
	background-image: url("../images/logo2.png");
}

}


@media screen and (min-width: 1600px) {


#title p{
	background: rgba(0,0,0,0.7);
}

#title{
background:rgba(0,0,0,0.2) url("../images/flower3425.png") 10% 80% no-repeat;

}


}