@charset "Shift_JIS";

/* reset */
body{
	margin:0;
	padding:0;
	text-align:left;
	font-size:68%;
	line-height:1.6;
	font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ', Meiryo ;
	color:#333333;
	min-width:1024px;	
	background-image : url(container_bg_1K.png);
	background-color:#fbfaf9;
	background-position:top center;
	background-repeat:no-repeat;
	background-size:100%;
}

html,body,h1,h2,h3,h4,h5,p,div,ul,li{
	margin:0;
	padding:0;
	list-style:none;
}

img{
	border-top:0;
	border-right:0;
	border-bottom:0;
	border-left:0;
}

/*--------------------------------------------------------
  layout
--------------------------------------------------------*/

/* hpb-skip */
#hpb-skip{
	display:none;
}

/* hpb-container */
#hpb-container{
	
	width:682px;
	position:relative;
	padding-top:48px;
	padding-left:342px;
	margin-right:auto;
	margin-left:auto;	
}

/* hpb-header */
#hpb-header{
	overflow:hidden;
	zoom:1;
}

/* hpb-inner */
#hpb-inner{
	padding-top:42px;
	overflow:hidden;
	zoom:1;
}

/* hpb-wrapper */
#hpb-wrapper{
	width:600px;
	float:left;
}

/* hpb-title */
.hpb-layoutset-01 #hpb-title{
	position:relative;	
	color:#ccb98f;
	width:600px;
	height:210px;
	margin-bottom:35px;
	background-image : url(top_mainimg_1K.png);
	background-position:left 25px;
	background-repeat:no-repeat;
	border-top-color:rgba(151,116,32,0.5);
	border-top-style:double;
	border-top-width:3px;
	border-bottom-color:rgba(151,116,32,0.5);
	border-bottom-style:double;
	border-bottom-width:3px;
}

/* hpb-main */
#hpb-main{
	width:600px;
	float:left;	
}

/* hpb-aside */
#hpb-aside{
	width:191px;
	height : 930px;
	padding-top:353px;
	padding-right:25px;
	padding-left:25px;
	float:left;
	position:absolute;
	top:0;
	left:56px;
	background-image : url(aside_bg_1K.png);
	background-position:left top;
	background-repeat:no-repeat;
	
}

/* hpb-footer */
#hpb-footer{
	padding-top:75px;
	padding-bottom:30px;
	position:relative;
	overflow:hidden;
	zoom:1;
}

/* hpb-nav */
#hpb-nav{
	position:absolute;
	top:145px;
	left:81px;
	z-index:1;
}

/* =======================================================
  レスポンシブル設定
======================================================= */
@media screen and (max-width: 568px) {

	body{
		min-width: 100%;
	}

	/*--------------------------------------------------------
		layout
	--------------------------------------------------------*/
	/* hpb-container */
	#hpb-container{
		width: 100%;
		padding: 0;
	}
	/* hpb-header */
	#hpb-header{
		padding-bottom: 10px;
	}
	#hpb-headerExtra1{
		width: 98%;
		margin-left: auto;
		margin-right: auto;
	}
	/* hpb-inner */
	#hpb-inner{
		padding-top: 0;
	}
	/* hpb-wrapper */
	#hpb-wrapper{
		width: 100%;
		float: none;
	}
	/* hpb-title */
	.hpb-layoutset-01 #hpb-title{
		width: 100%;
		height: 210px;
		margin-bottom: 20px;
		background-size: contain;
	}
	/* hpb-main */
	#hpb-main{
		width: 96%;
		float: none;
		margin-left: auto;
		margin-right: auto;
		padding-bottom: 20px;
	}
	/* hpb-aside */
	#hpb-aside{
		width: 96%;
		height: auto;
		padding-top: 0;
		padding-right: 0;
		padding-bottom: 20px;
		padding-left: 0;
		float: none;
		position: relative;
		left: 0;
		background-image: none;
		margin-left: auto;
		margin-right: auto;
	}
	/* hpb-footer */
	#hpb-footer{
		padding-top: 0;
		padding-bottom: 10px;
	}
	#hpb-nav{
		position: relative;
		top: 0;
		left: 0;
	}
	
}
