/* トップ用 */

@charset "utf-8";

.video{
  position:relative;
  width:100%;
  padding-top:56.25%;
}
.video iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}

	*{
		margin: 0;
		padding: 0;
	}

	ul,ol{list-style:none}

	p.price{
		display: inline;
		color: #009;
	}

	body{background-color: #ccc;}

	#wrap{
		width: 800px;
		padding: 1% 8px 2% 8px;
		margin: auto;
		overflow: auto;
		background-color: #fff;
	}

	#contents{
		margin: auto;
	}

	#mainimage{
		text-align: center;
	}

	ul.brandtitle li{
		text-align: center;
		margin-left: auto;
		margin-right: auto;
	}

	ul.brandarea{
		margin-left: 0;
	}

	ul.brandarea li{
		white-space:nowrap;
		vertical-align: top;
		text-align: center;
		display: inline-block;
		margin-right: 20px;
	}

	ul.kousinarea{
		margin-left: 0;
	}

	ul.kousinarea li{
		white-space:nowrap;
		vertical-align: bottom;
		text-align: center;
		display: inline-block;
		margin-right: 4px;
	}

	ul.sidearea{
		text-align: center;
		margin-top: 10px;
		margin-left: 0;
	}

	ul.sidearea li{
		white-space:nowrap;
		vertical-align: bottom;
		text-align: center;
		display: inline-block;
		margin-right: 4px;
	}

	ul.sidetext{
		text-align: left;
	}

	ul.sidetext li{
		white-space:pre-line;
		vertical-align: bottom;
		text-align: left;
		display: inline-block;
		margin-right: 4px;
	}

	ul.amparea{
		margin-left: 0;
	}

	ul.amparea li{
		white-space:nowrap;
		text-align: center;
		vertical-align: baseline;
		display: inline-block;
		width: 160px;
	}

	ul.photoarea{
		margin-top: 20px;
		margin-left: 0;
	}

	ul.photoarea li{
		white-space:nowrap;
		text-align: center;
		vertical-align: baseline;
		display: inline-block;
		width: 350px;
	}

	ul.sparea{
		margin-left: 12px;
	}

	ul.sparea li{
		white-space:nowrap;
		text-align: center;
		vertical-align: middle;
		display: inline-block;
		width: 135px;
		margin-bottom: 10px;
	}

	ul.detailarea{
		margin-left: 12px;
		margin-right: 12px;
	}

	u.detailarea li{
		width: 80%;
		margin-bottom: 10px;
	}

ul.listarea{
	text-align: center;
	margin-top: 10px;
	margin-left: 8px;
	margin-right: 8px;
	margin-bottom: 10px;
}

ul.listarea li{
		text-align: left;
		display: inline-block;
		width: 350px;
}

.listarea img{
	width: 95%;
	margin-left: 8px;
}

	.container{
		display: flex;
		justify-content: center;
		flex-direction: row;
	}

	.main{
		width: 500px;
		order: 1;
	}

	.side{
		order: 2;
		width: 300px;
		float: right;
		margin-right: 0;
	}

	p.syurui{
		margin-top: 0;
		margin-bottom: 0;
		font-size: 70%;
	}

	p.kousin{
		margin-top: 0;
		margin-bottom: 5px;
		margin-right: 10px;
		font-size: 70%;
	}

	p.roma{
		margin-top: 0;
		margin-bottom: 0;
		font-size: 80%;
		font-weight: bold;
	}

	p.side{
		margin-top: 0;
		margin-bottom: 0;
		font-size: 80%;
	}

	p.detail{
		margin-top: 10px;
		margin-bottom: 20px;
		font-size: 80%;
	}
	
	hr.style13 {
		height: 10px;
		border: 0;
		box-shadow: 0 10px 10px -10px #8c8b8b inset;
	}
	
	hr.style13space {
		height: 10px;
		border: 0;
		box-shadow: 0 10px 10px -10px #8c8b8b inset;
	}

	hr.roma { 
 		border: 0; 
 		height: 1px; 
		background-image: -webkit-linear-gradient(left, #f0f0f0, #b1b1b1, #f0f0f0);
 		background-image: -moz-linear-gradient(left, #f0f0f0, #b1b1b1, #f0f0f0);
 		background-image: -ms-linear-gradient(left, #f0f0f0, #b1b1b1, #f0f0f0);
	 	background-image: -o-linear-gradient(left, #f0f0f0, #b1b1b1, #f0f0f0); 
	}

	hr.roma2 { 
		margin-top: 3px;
		margin-bottom: 3px;
 		border: 0; 
 		height: 1px; 
		background-image: -webkit-linear-gradient(left, #f0f0f0, #b1b1b1, #f0f0f0);
 		background-image: -moz-linear-gradient(left, #f0f0f0, #b1b1b1, #f0f0f0);
 		background-image: -ms-linear-gradient(left, #f0f0f0, #b1b1b1, #f0f0f0);
	 	background-image: -o-linear-gradient(left, #f0f0f0, #b1b1b1, #f0f0f0); 
	}

	a{text-decoration: none;}
	a:hover{text-decoration: underline;}

	.afflink01{
		text-align: right;
		font-size: 80%;
	}

#randomBanner{
	text-align: right;
	font-size: 80%;
}

	img{
		max-width: 160px;
		height: auto;
	}

	img.title{
		max-width: 100%;
		height: auto;
	}

	h1{
		color: #009;
		font-weight: normal;
	}

	h4{
		font-weight: bold;
		display: inline;
	}

	h5{
		font-weight: bold;
		display: inline;
	}

	.double-rect-ads-group {
		width: 800px;
    	margin-left: auto;
    	margin-right: auto;
	}

	.category_ad_01 {
		margin-left: auto;
		margin-right: auto;
		width: 800px;
		height: 280px;
	}

	.category_ad_02 {
		margin-top: 10px;
		width: 300px;
		clear: both;
	}

	.category_ad_03 {
		height: 290px;
		margin-top: 5px;
		margin-left: 0;
		margin-right: 5px;
		margin-bottom: 5px;
	}

	ul.namearea {
		text-align: center;
	}


	ul.namearea li{
		display: inline-block;
		text-align: center;
		margin-bottom: 10px;
	}

table.spec{
	width: 98%;
	font-size: 80%;
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
	border: #ccc 2px solid;
	border-collapse: collapse;
	}

/*540px～800px*/
@media screen and (max-width: 800px){

	#wrap{
		width: 95%;
		padding: 2%;
	}
	
	.container{
 		flex-wrap: wrap;
	}
	
	.main{
		width: 100%;
	}
	
	.side{
		width: 100%;
		margin-right: 0;
	}

	ul.brandarea{
		margin-left: 0;
	}

	ul.brandarea li{
		text-align: center;
		display: inline-block;
	}

	ul.amparea{
		margin-left: 0;
	}

	ul.amparea li{
		text-align: center;
		display: inline-block;
		width: 33%;
	}

	ul.photoarea{
		margin-left: 0;
	}

	ul.photoarea li{
		text-align: center;
		display: inline-block;
		width: 50%;
	}

	ul.detailarea{
		margin-left: 12px;
		margin-right: 12px;
	}
	
	u.detailarea li{
		width: 90%;
		margin-bottom: 10px;
	}

	ul.listarea li{
		text-align: left;
		display: inline-block;
		width: 90%;
	}

	.listarea img{
		width: 85%;
		margin-left: 16px;
	}

	.double-rect-ads-group {
		width: 97%;
    	margin: 0 auto;
  	}

	.category_ad_01 {
		width: 100%;
		height: 290px;
		margin-left: auto;
		margin-right: auto;
	}

	.category_ad_02 {
		width: 300px;
		margin: 10px 0;
		margin-left: auto;
		margin-right: auto;
	}
	.category_ad_03 {
		margin-left: auto;
		margin-right: auto;
	}

table.spec{
	margin-left: 8px;
	margin-right: 8px;
	}

/*540px以下*/
@media screen and (max-width: 539px) {

	#wrap{
		width: 100%;
		padding: 0 5px 0 5px;
	}
	
	.sub{
		width: 400px;
	}

	ul.brandtitle{
		margin: 2%;
	}

	ul.brandarea{
		margin: 8px;
	}

	ul.brandarea li{
		text-align: center;
		display: inline-block;
	}

	ul.amparea{
		margin: 8px;
	}

	ul.amparea li{
		text-align: center;
		display: inline-block;
		width: 48%;
	}

	ul.photoarea{
		margin: 8px;
	}

	ul.photoarea li{
		text-align: center;
		display: inline-block;
		width: 48%;
	}

	ul.detailarea{
		margin-left: 8px;
		margin-right: 8px;
	}

	u.detailarea li{
		width: 95%;
		margin-bottom: 10px;
	}

	ul.listarea li{
		text-align: left;
		vertical-align: middle;
	}

	.listarea img{
		width: 85%;
		margin-left: 16px;
	}

	.category_ad_01 {
		width: 100%;
		height: 280px;
		margin-left: auto;
		margin-right: auto;
	}

	.category_ad_02 {
		width: 336px;
		margin: 10px 0;
		margin-left: auto;
		margin-right: auto;
	}

	.category_ad_03 {
		margin-top: 20px;
		margin-right: 8px;
		margin-bottom: 0;
	}

}