@charset "UTF-8";
/* pc, sp共通-------------------------------------------------------- */
a:link, a:visited {
    text-decoration: none;
}

img{
	vertical-align:top;
}
.main-body {
	background: white;
    width: 1000px;
    margin: 0 auto;
	font-size: 18px;
}

.main-body h1,.main-body h2{
	margin: 0;
}

.main-top{
	position: relative;
	margin-bottom: 40px;
}
/*
.main-top-btn{
	position: absolute;
	bottom: 50px;
	left: 40px;
	text-align: center;
    padding: 10px 20px;
    background: white;
    border: 1px solid #000000;
    border-radius: 4px;
}

.main-top-btn a{
	color: #000000;
}

.main-top-btn img{
	width: 300px;
}
*/
/*
.intro{
	text-align: center;
	margin-bottom: 0px;
	background: #000000;
}*/



#special-item{
	background: url("../img/bg_item.png") center top no-repeat #9b0001;
	text-align: center;
	overflow: hidden;
	padding: 20px;
	margin-bottom: 40px;
}

#special-item h2{
	margin-bottom: 40px;
}

.item-box{
	display: flex;
	background: #ffffff;
	border: solid 2px #d9bd00;
	/*order-radius: 10px;*/
	padding: 20px;
	margin-bottom: 0px;
	align-items: center;
	justify-content: space-evenly;
}
.item-img{
	margin: 0;
}
.item-spec{
	text-align: left;
	margin-left: 20px;
}
.item-name{
	margin: 20px 0 ;
}
.item-text{
	margin: 0 0 20px;
}
.btn-cart img{
	width: 300px;
}

/* バナー　レシピ 
.bnr_recipe{
	text-align: center;
	margin-bottom: 80px;
}*/

/* バナー　villa */
.bnr_villa{
	text-align: center;
}

/* report */
#report{
	margin: 0 0 40px;
	padding: 40px;
	background: #fcfaf1;
}

.report-box{
	display: flex;
	padding: 0;
	margin-bottom: 20px;
	/*flex-direction: row-reverse;*/	
}

.report-box h3{
	margin: 0 0 20px;
	color: #9b0001;
	padding: 5px 0;
	font-size: 1.4rem;
}
.report-text{
	padding-right: 20px;
}

.report-img-01 img{
	width: 170px;
}
.report-img-02 img{
	width: 220px;
}
.notes{
	font-size: 0.8rem;
}

.contents-menu{
	padding: 40px 40px;
	background: #fff6d6;
	text-align: center;
	margin-bottom: 80px;
}

.contents-menu h3{
	margin-bottom: 30px;
	padding: 0 1em;
}
.contents-menu ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
	list-style: none;
	margin: 0;
	padding: 0;
}

.contents-menu ul li{
	padding: 10px 10px 0;
    color: #b48410;
	font-weight: bold;
    letter-spacing: .1em;
    text-align: center;
    margin: 0;
}
.contents-menu ul li a{
    color: #b48410;
	text-decoration: none;
}
.contents-menu ul li img{
	width: 100%;
}

.list-with{
	padding: 40px 40px;
	text-align: center;
	margin-bottom: 40px;
	border-top: solid 1px #ccc;
}

.list-with h3{
	margin-bottom: 30px;
	font-size: 1.5rem;
}
.list-with ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

.list-with ul li{
	padding: 10px 10px 0;
    letter-spacing: .1em;
    text-align: center;
    margin: 0;
	font-size: 1rem;
	width: 260px;
}
.list-with ul li a{
	text-decoration: none;
	color: #000;
}
.list-with ul li img{
	width: 200px;
	border: 1px solid #f0f0f0;
}

.list-ranking{
	padding: 40px 40px;
	text-align: center;
	margin-bottom: 40px;
	border-top: solid 1px #ccc;
}

.list-ranking h3{
	margin-bottom: 30px;
	font-size: 1.5rem;
}
.list-ranking-wrap{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 0;
	padding: 0;
}
.list-ranking-item{
	width: 170px;
}
.list-ranking-item a{
	color: #000;
}
.list-ranking-item dd{
	margin: 0;
}
.product_name{
	margin: 10px 0;
    height: 42px;
    overflow: hidden;
    font-size: 12px;
    font-weight: 12px;
    text-decoration: underline;
	text-align: left;
}
.product_price {
    margin: 10px 0 0;
    font-size: 16px;
    font-weight: 600;
    text-align: right;
}
.list-ranking-item img{
	width: 100%;
	border: 1px solid #f0f0f0;
}
.list-ranking .hlicon {
    margin-right: 0.3em;
    vertical-align: sub;
    width: 30px;
}
.list-ranking-item dd {
    position: relative;
}
.list-ranking-item img.ic_rank {
    position: absolute;
    left: 5px;
    bottom: 5px;
    width: 30px;
    height: 21px;
	border: none;
}

/* PC-------------------------------------------------------- */

@media only screen and (min-width: 641px) {
	.no-pc{display: none}	
/*	.row-reverse{
		flex-direction: row-reverse;
	}
    .row-reverse .contents-text{
        padding-right: 20px;
		padding-left: 0px;
    }
    .section .lead{
        color: #000;
        font-size: 18px;
        font-weight: normal;
    }
    .tolineup-btn img{
        width: 340px;
    }*/
	
}

/* SP-------------------------------------------------------- */

@media only screen and (max-width: 640px) {
	.no-sp{display: none}	
    .main-body {
        width: 100%;
		font-size: 1rem;
    }
	.main-body img{
        width: 100%;
		/* display: inline-block; */
    }
    .main-top {
        margin-bottom: 1em;
    }
    #special-item {
        background-size: cover;
        padding: 1em;
		margin-bottom: 1em;
    }	
    .item-box{
        display: inline-block;
        padding: 20px 1em ;
    }	
    .item-spec{
        margin-left: 0;
    }	

    .bnr_villa{
        padding: 0 1em;
		padding-bottom: 3em;
		margin-bottom: 0;
    }
	
    #report{
        padding: 2em 1em;
		margin-bottom: 3em;
    }
    .report-box{
        display: inline-block;
        padding: 0;
    }
    .report-text{
        margin-bottom: 1em;
        padding-right: 0;
    }
    .report-box img{
        width: 50%;
        margin: 0 auto;
    }
	
    .contents-menu{
        padding: 2em 1em;
        margin-bottom: 3em;
        /* text-align: left; */
    }
    .contents-menu ul li{
        margin-bottom: 1em;
    }	
    .contents-menu ul li a{
        display: flex;
        align-items: center;
    }		
    .contents-menu ul li a img{
        width: 45%;
        margin-left: 1em;
    }		
    .contents-menu ul li a p{
        text-align: left;
		margin-left: 1em;
    }	
	
    .list-ranking{
        padding: 2em 1em;
        margin-bottom: 3em;
    }
    .list-ranking-item {
        width: 44%;
        padding: 3%;
    }
	
    .list-with{
        padding: 2em 1em;
        margin-bottom: 3em;
    }
    .list-with ul li{
        margin-bottom: 1em;
		width: 100%;
    }	
    .list-with ul li a{
        display: flex;
        align-items: center;
    }		
    .list-with ul li a img{
        width: 50%;
    }		
    .list-with ul li a p{
        text-align: left;
		margin-left: 1em;
    }	
	
}