@charset "utf-8";
/* リセット
----------------------------------------- */
html, body, h1, h2, h3, h4, ul, ol, dl, li, dt, dd, p, div, span, img, a, table, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    font-weight: normal;
    font-size: 100%;
    vertical-align: baseline;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
article, header, footer, aside, figure, figcaption, nav, section {
    display: block;
}
body {
    line-height: 1;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Helvetica, "游ゴシック体", YuGothic, "Yu Gothic M", "游ゴシック Medium", "Yu Gothic Medium", "メイリオ", Meiryo, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	background:#fde152 url(../imgs/bg.png);
}
ol, ul {
    list-style: none;
    list-style-type: none;
}
a {
    text-decoration: none;
    color: #7b2000;
}
/* clearfix */
.cf:after {
    content: "";
    display: block;
    clear: both;
}
img.img100 {
    width: 100%;
    height: auto;
}
/* アンカー */
.l_anchor {
    position: absolute;
    height: 0;
    margin-top: -20px;
}
#wrapper {
}

/* スマホでは非表示 */
.sp_none {
    display: none;
}


/* アニメーション設定 */
.mpickup_item,
.item{
	opacity: 0;
}
.elem_fadeUp {
		animation-name:fadeUpAnime;
		animation-duration:0.8s;
		animation-fill-mode:forwards;
		opacity: 0;
	}
	@keyframes fadeUpAnime{
	from {
		opacity: 0;
		transform: translateY(50px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
	}

/* パンくず */
.breadcrumb {
    font-size: 11px;
    line-height: 1;
    padding: 5px 10px;
    background: darkred;
	margin-bottom:1px;
}
.breadcrumb li {
    display: inline-block;
    color: #fff;
}
.breadcrumb a {
    color: #fff;
}
.breadcrumb li::after {
    content: ">";
}
.breadcrumb li:last-child::after {
    content: "";
}
/* ヘッダー
-----------------------------------------*/
#header {
    position: relative;
    z-index: 1;
}

.head_notice{
	background:#fff;
	padding:10px;
	text-align:center;
	margin:0 0 20px 0;
	line-height:1.5;
	font-size:13px;
}

h1{
	background:#fff;
	font-size:12px;
	font-weight:bold;
	text-align:center;
	padding:5px 0 5px 0;
	color:#8E0000;
}

#logo {
	position: absolute;
	z-index: 500;
	top: 5px;
	left: 5px;
	width:100px;
}
#logo img {
	display: block;
	width: 100px;
}

.cashless{
	background:#E61212;
	text-align:center;
}
.cashless img{
	width:100%;
	max-width:950px;
}

/* タイトル部分
---------------------------------------------------*/
.title_area{
	background:url(../imgs/bg_title.jpg) no-repeat center center;
	background-size:cover;
	padding:10px 0;
	position: relative;
}
.title_ph{
	display: block;
	width:55%;
	position: absolute;
	left:45%;
	bottom:0px;
	z-index:1;
	animation-delay: 0.2s;
}
.title_ph img{
	width:100%;
}

.title_logo{
	position: relative;
	z-index:99;
	margin: auto;
	animation-delay: 0.4s;
}
.title_logo img{
	display: block;
	width:60%;
}

/* タイトルアニメーション部分 */
.fadeIn{
	animation-name:fadeInAnime;
	animation-duration:0.8s;
	animation-fill-mode:forwards;
	opacity: 0;
}
@keyframes fadeInAnime{
from {
	opacity: 0;
}

to {
	opacity: 1;
}
}
	.fadeUp {
	animation-name:fadeUpAnime;
	animation-duration:0.8s;
	animation-fill-mode:forwards;
	opacity: 0;
}
@keyframes fadeUpAnime{
from {
	opacity: 0;
	transform: translateY(50px);
}

to {
	opacity: 1;
	transform: translateY(0);
}
}


/* ヘッドコピー */
.head_copy{
	padding:10px 10px 20px 10px;
	line-height:1.5;
	font-size:16px;
	text-align:center;
}

/* 早割表示部分 */
.head_haya{background:darkred;text-align:center}
.head_haya img{max-width:800px;width:100%;}

/* 背景ボックス設定 */
.bg_ot{background:#6d0001 url(../imgs/bg06.jpg) center center;}

/* メニューボタン */
.gnav_area {
    padding: 5px;
}
.gnav_area {
    display: table;
    width: 100%;
    margin: 0 auto;
}
.gnav_area li {
    width: 32.6666%;
    float: left;
    margin-right: 1%;
}
.gnav_area li:nth-child(3) {
    margin-right: 0;
}

.gnav_area img {
    width: 100%;
    height: auto;
	border-radius:5px;
}
.gnav_area a {
    display: block;
}

/* ランキング */
.ranking_area{
	margin-bottom: 50px;
}
.ranking_ttl{
	text-align: center;
	margin-bottom: 10px;
}
.ranking_ttl img{
	width:95%;
	max-width:800px;
}
.ranking_wrap{
}

.ranking_area .rank{
	padding:5px 10px 5px 35px;
	background:  no-repeat 0 center;
	background-size:30px auto;
}
.ranking_area .rank.r1{ background-image: url(../imgs/icon_rank1.png);padding-top:10px; }
.ranking_area .rank.r2{ background-image: url(../imgs/icon_rank2.png); }
.ranking_area .rank.r3{ background-image: url(../imgs/icon_rank3.png); }
.ranking_area .rank.r4{ background-image: url(../imgs/icon_rank4.png); }
.ranking_area .rank.r5{ background-image: url(../imgs/icon_rank5.png);padding-bottom:10px; }


.ranking_area .item{
	border-radius:10px;
	box-shadow: 0px 0px 12px -6px rgba(118,30,5,0.8);
	background:#fff;
}
.ranking_area .item a{
	display: flex;
	color: #000;
}
.ranking_area .item a .ph{
	flex-basis: 40%;
}
.ranking_area .item a .main{
	flex-basis: 60%;
	padding:5px 5px 5px 10px;
}
.ranking_area .item .ph img{
	width:100%;
	display: block;
	border-radius: 10px 0 0 10px;
}
.ranking_area .item .name{
	font-size:15px;
	line-height: 1.2;
	font-weight: bold;
	margin-bottom: 5px;
}
.ranking_area .item .price{
	font-size:13px;
}
.ranking_area .item .price strong{
	font-size:20px;
}
.ranking_area .item .price strong span{
	font-size:15px;
	font-weight: bold;
}
.ranking_area .item .btn{
	padding:5px;
	text-align: center;
	color:#fff;
	border-radius: 5px;
	display: flex;
	margin:5px 10px 0 10px;
	justify-content: center;
	font-size:11px;
	background: #e84c4c; /* Old browsers */
	background: -moz-linear-gradient(top,  #e84c4c 0%, #b30000 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #e84c4c 0%,#b30000 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #e84c4c 0%,#b30000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e84c4c', endColorstr='#b30000',GradientType=0 ); /* IE6-9 */
}
.ranking_area .item .btn::before{
	content:"";
	background: url("../imgs/arrow02.png") no-repeat center center;
	background-size:contain;
	display: block;
	width: 20px;
}




/* 文字の見出し */
.text_ttl{
	text-align: center;
	margin-bottom: 20px;
	font-size:30px;
	color: #410001;
	font-family: serif;
	font-weight: bold;
}

/* 種類から探す */
.cat_area{
	padding:40px 0;
}
.cat_area .text_ttl{
	color:#fff;
}

.cat_list{
	padding:0;
	width:100%;
	display: flex;
	flex-wrap: wrap;
}
.cat_list li{
width:50%;
/*
	width:33.3333%;
*/
	text-align: center;
}
.cat_list li a{
	color: #fff;
	padding:10px;
	display: block;

}
.cat_list img{
	width:100%;
}
.cat_list li a span{
	color:#fff;
	font-weight: bold;
	font-size:14px;
	line-height: 1.2;
	display: block;
	padding-bottom: 18px;
	background:url(../imgs/arrow03.png) no-repeat bottom center;
	background-size: 13px auto;
}


/* 価格で選ぶ
------------------------------------------------------- */
.price_area{
	padding:40px 0;
}

.navi_price{
	box-sizing: border-box;
	display: table;
	width:100%;
}
.navi_price li{
	box-sizing: border-box;
	width: calc(100%/2);
	float: left;
	padding:5px;
}
.navi_price li a{
	display: block;
	padding:15px 15px 15px 35px;
	font-size: 16px;
    background: #fff url(../imgs/arrow05.png) no-repeat 5px center;
    background-size: 17px;
    color: #6d0001;
    border-radius: 5px;
	font-weight: bold;
}


/* アイテムエリア
--------------------------------------------------- */
.item_wrap {
    padding: 10px 0 30px 0;
	background:repeat-y top center;
	background-size: cover;
}
.item_wrap.bg1{
	background-color: #FFEFC5;
	background-image: url(../imgs/bg01_sp.jpg);
}
.item_wrap.bg2{
	background-color:#FFFF9D;
	background-image: url(../imgs/bg02_sp.jpg);
}

.item_title_wrap{
	position:relative;
	margin-bottom: 20px;
}
.item_title_ph{
	display: block;
	height:200px;
	width: auto;
	margin:0 auto;
}

.item_copy h2{
	font-family: serif;
	font-weight: bold;
	font-size:40px;
	text-align: center;
	margin-bottom: 5px;
	color:#410001;
}

.item_title_wrap .item_copy{
	font-size:14px;
	text-align: center;
	line-height: 1.4;

}

.box {
    margin: 0 10px;
	display: flex;
	flex-wrap:wrap;
}
.box .item {
    width: 50%;
	background:#fff;
	z-index: 2;
	
}
.item_wrap .box .item {
	width:48.5%;
	margin-right:3%;
	margin-bottom:15px;
	border-radius:10px;
	box-shadow: 0px 0px 12px -6px rgba(118,30,5,0.8);
}
.item_wrap .box .item:nth-child(2n) {
	margin-right:0;
}

.box .item a {
    display: table;
    color: #555;
}
.item a .point{
	background:#ff2727;
	color:yellow;
	text-align: center;
	font-weight: bold;
	padding:5px;
	height:27px;
}
.item a .point.over{
	font-size:12px;
}
.box .item .ph {
	position:relative;
}
.box .item .ph.so::after {
	content:"";
	position:absolute;
	width:100%;
	height:100%;
	background:url(../imgs/item_so.png) no-repeat 0 -20px;
	background-size:cover;
	top:0;
	left:0;
}
.box .item .ph.so2::after {
	content:"";
	position:absolute;
	width:100%;
	height:100%;
	background:url(../imgs/item_so2.png) no-repeat 0 -20px;
	background-size:cover;
	top:0;
	left:0;
}
.box .item .ph img {
    width: 100%;
    display: block;
	border-radius: 5px 5px 0 0;
}
.box .item .main {
    padding: 5px 10px 10px 10px;
}
.box .item .name {
    font-weight: bold;
    font-size: 17px;
    margin-bottom: 5px;
    line-height: 1.3;
}
.box .item .text {
    font-size: 11px;
    line-height: 1.3;
    margin-bottom: 10px;
	overflow:hidden;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
	display: none;
}
.item .price {
    font-size: 12px;
    color: #dc1c24;
    font-weight: bold;
    text-align: right;
    margin-bottom: 8px;
	line-height: 1.3;
}
.box .item .price span {
    font-size: 11px;
    color: #333;
}
.box .item .price strong {
    font-size: 18px;
}
.box .item .price strong span{
	font-size:12px;
	font-weight: bold;
	color:#dc1c24;
}
.box .item .tag span {
    font-weight:bold;
    font-size: 12px;
    color:#fff;
    padding:5px;
    display:inline-block;
    background:#ff953f;
    margin-bottom:3px;
}
.box .item .tag span.oku{
background:#838383;
}


.y_pre {
    display: inline-block;
    background: url("../imgs/yahoo_premium.png") no-repeat 0 0;
    background-size: contain;
    width: 15px;
    height: 12px;
}

.box .item .tag .y_pre {
}
.box .item .tag .y_pre:after {
    content: "プレミアム会員";
    background: url("../imgs/yahoo_premium.png") no-repeat 0 0;
    background-size: contain;
    padding-left: 18px;
    margin-left: -3px;
}

.box .item .btn{
	padding:10px 5px;
	text-align: center;
	color:#fff;
	font-weight: bold;
	border-radius: 5px;
	display: flex;
	margin:0px;
	justify-content: center;
	font-size:14px;
	background: #e84c4c; /* Old browsers */
	background: -moz-linear-gradient(top,  #e84c4c 0%, #b30000 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #e84c4c 0%,#b30000 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #e84c4c 0%,#b30000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e84c4c', endColorstr='#b30000',GradientType=0 ); /* IE6-9 */
}
.box .item .btn::before{
	content:"";
	background: url("../imgs/arrow02.png") no-repeat center center;
	background-size:contain;
	display: block;
	width: 20px;
}

/* item　pickup用 */
.item_wrap .box .item.pickup {
	width:100%;
}
.item_wrap .box .item.pickup .name{
	font-size:17px;
	min-height:auto;
	margin-bottom:5px;
}
.item_wrap .box .item.pickup .text{
	display:block;
	font-size:14px;
}
.item_wrap .box .item.pickup .price{
	font-size:17px;
}
.item_wrap .box .item.pickup .price strong{
	font-size:28px;
}
.item_wrap .box .item.pickup .btn{
	font-size:16px;
	margin:0 auto;
	width:250px;
}
.item_wrap .box .item.pickup .btn::before{
	width: 30px;
}

/* おすすめエリア
-----------------------------------------*/
.main_pickup_area{
	padding:0 10px;
	margin: 10px 0 40px 0;
	border-width: 5px 0;
}

.mpickup_ttl{
	margin: 0 0 5px 0;
	text-align:center
}

.mpickup_ttl img{
	width:100%;
	max-width:650px;
}
.mpickup_item {
	position:relative;
	margin-bottom: 20px;
	background:#fff;
	padding:0 0 15px 0;
	border:1px solid #ccc;
}
.mpickup_item.end{
	margin-bottom: 0;
}
.mpickup_item a{
	color: #000;
	display: block;
}
.mpickup_item img{
	width: 100%;
	margin-bottom: 10px;
}
.mpickup_item h2{
	font-size:22px;
	font-weight: bold;
	margin-bottom: 10px;
	padding:0 8px;
}
.mpickup_item p{
	font-size:16px;
	line-height: 1.4;
	margin-bottom: 10px;
	padding:0 8px;
}
.mpickup_item .price{
	color:#dc1c24;
	font-size:25px;
	text-align: center;
	margin-bottom: 20px;
}
.mpickup_item .price s{
	font-size:18px;
}
.mpickup_item .price span{
	font-size:18px;
	font-weight: bold;
}

.mpickup_item .price .y_pre{
	width:25px;
	height:23px;
}

.mpickup_item .btn{
	padding:10px;
	text-align: center;
	color:#fff;
	font-weight: bold;
	border-radius: 5px;
	display: flex;
	width: 200px;
	margin:0 auto;
	justify-content: center;
background: #e84c4c; /* Old browsers */
background: -moz-linear-gradient(top,  #e84c4c 0%, #b30000 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #e84c4c 0%,#b30000 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #e84c4c 0%,#b30000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e84c4c', endColorstr='#b30000',GradientType=0 ); /* IE6-9 */
}
.mpickup_item .btn::before{
	content:"";
	background: url("../imgs/arrow02.png") no-repeat center center;
	background-size:contain;
	display: block;
	width: 30px;
}

.mpickup_item .point{
position:absolute;
z-index:99;
top:5px;
right:5px;
background:red;
color:yellow;
padding:15px;
font-weight:bold;
border-radius:50px;
font-size:20px;
/* box-shadow */
box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.8);
}

/* フッター
-------------------------------------------------- */
#footer {
}
/* 特典 */
.point_area {
    padding: 50px 0;
}
.f_point {
    padding: 0 0 10px 0;
}
.f_point img {
    display: block;
}
.f_point h3 {
    width: 300px;
    margin: 0 auto 25px auto;
}
.f_point h3 img {
    width: 100%;
}
.point_list {
    margin: 0 10px;
}
.point_list li {
    display: table;
    width: 100%;
    margin-bottom: 15px;
}
.point_list li .point_mark, .point_list li .point_main {
    display: table-cell;
    vertical-align: middle;
}
.point_list li .point_mark {
    background: #7B5E3E;
    color: #fff;
    padding: 5px;
    font-size: 12px;
    width: 50px;
    border-radius: 5px;
    font-weight: bold;
    text-align: center;
}
.point_list li .point_main {
    padding-left: 10px;
    line-height: 1.3;
    font-size: 18px;
    font-weight: bold;
    color: #7B5E3E;
}
.point_list li:last-child {
    border-bottom: 0;
}
.point_list li.card img {
    max-width: 50%;
    display: block;
    margin: 0 auto;
}
/* お届け */
.f_otodoke {
    background: #fff1dc;
    padding: 10px;
}
.f_otodoke h3 {
    background: #7b5e3e;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    padding: 5px;
    margin-bottom: 5px;
}
.f_otodoke p {
    text-align: center;
}

/* インフォメーション */
.info_area {
    padding: 50px 10px;
}
.info_box {
    font-size: 12px;
    line-height: 1.5;
    margin-bottom: 15px;
}
.info_box h2 {
    font-weight: bold;
    font-size: 14px;
    border-bottom: 1px solid #333;
    margin-top: 20px;
    margin-bottom: 5px;
}
.info_box h2:first-child {
    margin-top: 0;
}
.ib_n1 {
    background: #352014;
    color: #EFE9D1;
    padding: 10px;
}
.ib_n1 a {
    color: #fff;
}
.yamato_time {
    width: 100%;
    max-width: 298px;
}
/* ページの先頭へ */
#fixedTop {
    display: none;
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 9999;
    font-size: 12px;
    background: darkred;
    color: #fff;
    padding: 25px;
    text-align: center;
    border-radius: 40px;
    transition: auto;
}

/* フッターリンク */
.f_navlink{
	padding-bottom:10px;
}
.f_navlink ul{
	text-align: center;
}
.f_navlink li{
	font-size:12px;
	display: inline-block;
}
.f_navlink li:after{
	content:" -";
}
.f_navlink li:last-child:after{
	content:"";
}

/* コピーライト */
.copyright {
    padding: 10px 10px 50px 10px;
    text-align: center;
    font-size: 10px;
    line-height: 1;
    background: #000;
    color: #fff;
}
.copyright a {
    color: #333;
}

/* ドロワーメニュー
------------------------------------------------ */
.menu_box{
	display:none;
	position:fixed;
top:0;
left:0;
z-index:9999;
width:100%;
}
.menu{
width:100%;
display:table;
}
.menu > li{
position: relative;
float:left;
background:#D8225C url(../imgs/bg06.jpg);
color:#fff;
text-align:center;
width:33.333333%;
line-height: 1em;
padding:0;
border-right:1px dotted #fff;
font-size:12px;
}
.menu > li:last-child{
border-right:0;
}
.menu li a{
color:#fff;
display:block;
padding:20px 0;
}
.menu_item {
  cursor: pointer;
  display: block;
  margin-bottom: 1px;
}
.menu_item_link {
  color: #fff;
  display: block;
  position: relative;
padding:20px 0;
}

.menu .submenu {
background:#fff;
  display: none;
  position:absolute;
  width:100%;
  left:0;
}
.menu .submenu_item {
  color: #222;
  border-bottom:1px dotted #ccc;
}
.menu .submenu_item a{
color:#000;
padding:10px 0;
}

/* 予算で選ぶ
--------------------------------------------------- */
#logo.price{
}
.price_title_area{
	background:url(../imgs/bg_header.jpg) no-repeat center center;
	background-size:cover;
}
.price_title_area .pagetitle{
	width:100%;
	height:100%;
	background:rgba(255,255,255,0.5);
	padding:40px 0 10px;
	font-size:16px;
	font-weight: bold;
	text-align: center;
}
.price_title_area .pagetitle img{
	display:block;
	width:70%;
	height:auto;
	margin:0 auto;
}

.price_wrap {
    padding: 0 0 50px 0;
}
.price_menu_btn {
    padding: 10px;
    margin-bottom: 0px;
}
.price_menu_btn li {
    width: 49%;
    margin-right: 2%;
    margin-bottom: 10px;
    float: left;
    font-size: 16px;
    background: #dc1c24 url(../imgs/arrow02.png) no-repeat 5px center;
    background-size: 17px;
    color: #fff;
    border-radius: 5px;
}
.price_menu_btn li:nth-child(2n) {
    margin-right: 0;
}
.price_menu_btn li.active {
    background-color: #EAC81E;
    color: #000;
}
.price_menu_btn li a {
    display: block;
    padding: 10px 10px 10px 30px;
	color:#fff;
}

/* お届け情報
-----------------------------------------------------*/
.otodoke_area{
	padding:0 10px;
	margin-bottom:20px;
}
.otodoke_area img{
	width:100%;
	max-width:800px;
}

/* 特典
-----------------------------------------------------*/
.tokuten_area{
	padding:0 10px;
	margin:40px 0 0 0;
}
.tokuten_area img{
	width:100%;
	max-width:800px;
}

/* 豆知識、カテゴリ解説 
--------------------------------------------------- */
.note_list h3, .topics_area h3 {
    text-align: center;
    font-size: 26px;
    font-weight: bold;
    margin-bottom: 50px;
    position: relative;
}
.note_list h3:before, .topics_area h3:before {
    content: '';
    position: absolute;
    bottom: -15px;
    display: inline-block;
    width: 30px;
    height: 4px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: black;
}


/* 豆知識目次 */
.note_list_area {
    padding: 50px 10px 50px 10px;
}
.note_list {
    padding: 0 0 30px 0;
}
.note_list li {
    display: table;
    width: 100%;
    margin-bottom: 0;
}
.note_list a {
    display: block;
    padding: 8px;
    border: 1px solid #ddd;
    background: #fff url(../imgs/arrow06.png) no-repeat right center;
    background-size: 40px;
    margin-bottom: 15px;
}
.note_list li .ph {
    display: table-cell;
    width: 20%;
    vertical-align: middle;
}
.note_list li .ph img {
    width: 100%;
    height: auto;
    display: block;
}
.note_list li .text {
    display: table-cell;
    vertical-align: middle;
    width: 80%;
    font-size: 16px;
    font-weight: bold;
    padding-left: 10px;
	padding-right: 30px;
	line-height: 1.3;
}


/* カテゴリ解説 */
.topics_area {
    padding: 0;
}
.topics_list li {
    display: table;
    width: 100%;
    margin-bottom: 20px;
}
.topics_list li:last-child {
    margin-bottom: 0;
}
.topics_list li .ph {
    float: left;
    width: 28%;
}
.topics_list li .text {
    width: 70%;
    float: right;
    font-size: 11px;
    line-height: 1.5;
}
.topics_list li .text strong {
    font-size: 13px;
    font-weight: bold;
}
.topics_list li .ph img {
    width: 100%;
    height: auto;
}

/* 記事
------------------------------------------- */
.article_area{
	padding:30px 10px 50px 10px;
}
.article_area img{
	max-width: 100%;
	height:auto;
}

.article_area h1{
	background:#fff;
	font-size:20px;
	font-weight: bold;
	padding:20px;
	margin-bottom: 1em;
	border-radius: 5px;
}
.article_area h2{
	font-size:20px;
	font-weight: bold;
	margin: 2em 0 1em 0;
	border-bottom:1px solid #333;
	padding-bottom: 10px;
	line-height: 1.4;
}
.article_area h2 i.fas{
	margin-right: 5px;
	color:#A08838;
}
.article_area h3{
	font-size:18px;
	font-weight: bold;
	margin: 2em 0 0.5em 0;
}
.article_area p{
	font-size:14px;
	line-height:1.8;
	margin-bottom: 1em;
}
.article_area .alignright{
	margin-bottom: 1em;
}

.article_area .page_navi{
	font-size:12px;
	width:100%;
	margin-top:50px;
}
.article_area .page_navi .prev{
	margin-bottom:10px;
}
.article_area .page_navi .next{
	text-align:right;
}

.article_area table{
	border-collapse: separate;
	border-spacing: 5px;
	width:100%;
}
.article_area table th,
.article_area table td{
	font-size:14px;
	line-height: 1.5;
	padding:10px 15px;
}
.article_area table th{
	font-weight: bold;
	white-space: nowrap;
	background:#B5A148;
	color:#fff;
}
.article_area table td{
	background:#F9F3D4;
}

.article_area .note_itemlist,
.article_area .note_itemlist li{
}
.article_area .note_itemlist li{
	width:33.33%;
	float:left;
}
.article_area .note_itemlist a,
.article_area .note_itemlist img{
	display:block;
}

.article_area .note_bn{
	border:1px solid #ccc;
}
.article_area .message_ex{
	border:1px solid #ccc;
	padding:15px;
	margin-bottom: 1em;
}
.article_area .message_ex p{
	margin-bottom: 0;
}

/* クーポン・バナー
-----------------------------------------------------*/
.coupon_main{
	text-align: center;
	margin-bottom: 0%;
}
.coupon_main img{
	width:100%;
	max-width:800px;
}

.coupon{
	position:fixed;
	z-index:9999;
	bottom:200px;
	right:0;
	text-align:center;
}
.coupon img{
	width:50px;
}

.side_linkbn{
	position:fixed;
	z-index:9999;
	bottom:100px;
	right:0;
	text-align:center;
}
.side_linkbn img{
	width:50px;
}

.link_bn_area{
	padding:0 10px;
}
.link_bn_area img{
	width:100%;
}

/* 早割キャンペーン
--------------------------------------*/
.list_hayawari_area{
padding:10px;
margin-bottom:40px;
}
.list_hayawari{
width:100%;
max-width:550px;
margin:0 auto;
border-collapse: separate;
border-spacing: 5px;
}
.list_hayawari caption{
font-size:25px;
margin-bottom:5px;
padding:5px;
text-align:center;
font-weight:bold;
color:#ff682d;
}
.list_hayawari th,
.list_hayawari td{
background:#fff;
padding:10px;
font-size:20px;
font-weight:bold;
border-radius:5px;
text-align:center;
border:2px solid #ccc;
vertical-align:middle;
}
.list_hayawari th{
background:#ccc;
color:#fff;
}
.list_hayawari td{
color:#ccc;
}
.list_hayawari td span{
font-weight:bold;
font-size:15px;
}
.list_hayawari .now th,
.list_hayawari .now td{
border:2px solid #ff682d;
}
.list_hayawari .now th{
background:#ff682d;
color:#fff;
}
.list_hayawari .now td{
color:#ff682d;
background:#fff89e;
}



/* 560px以上 */
@media screen and (min-width:560px) {
	.item a .point.over{
		font-size:16px;
	}
	
	.item_wrap .box .item {
		padding: 15px;
		width:48%;
	}
	.box .item .ph img{
		border-radius: 0;
	}

	.item_wrap .box .item{
		margin:0 1% 30px 1%;
	}
	.item_wrap .box .item:nth-child(2n){
		margin-right: 1%;
	}

	.box .item .main{
		padding:10px 0 0 0;
	}
	.box .item .main .name {
		font-size: 20px;
		margin-bottom: 10px;
	}
	.box .item .main .text {
		display: block;
		font-size: 14px;
		height:auto;
		overflow:visible;
		display: none;
	}
	.box .item .main .tag {
		font-size: 12px;
	}
	.box .item .main .tag span.mark {
	}
	.box .item .main .tag span.y_pre {
	}
	.box .item .main .tag span.y_pre:after {
		padding-left: 20px;
		margin-left: -5px;
	}
	.box .item .main .price {
		font-size: 18px;
		margin-bottom: 15px;
	}
	.box .item .main .price strong {
		font-size: 25px;
	}
	.main .price .y_pre {
		height: 17px;
		width: 20px;
	}
	.box .item .main .btn {
		font-size:17px;
	}
	.box .item .main .btn:before {
		width:30px;
	}

		/* トピックス　おすすめ商品 */
.reco_area{max-width:700px;margin:40px auto 0 auto;}
.reco_area a{display:flex;flex-direction: row;}
.reco_area .reco_ph{width:30%;margin-right:2%}
.reco_area .reco_txt{width:68%;}
.reco_area .reco_ph img{}
.reco_area .reco_txt p{padding:0;font-size:16px;line-height:1.6;}
.reco_area .reco_txt strong{font-size:20px;}
.reco_area .reco_txt .reco_btn{font-size:16px;}

}

/* 960px以上 */
@media screen and (min-width:960px) {
	body {

	}
	a, a img {
	/* transition: .3s; */
	}
	a:hover,  a:hover img {
		opacity: 0.7;
	}
	/* アンカー */
	.l_anchor {
		margin-top: -70px;
	}
	/* PCでは非表示 */
	.pc_none {
		display: none;
	}
	.sp_none {
		display: block;
	}

	/* ヘッダー
	-----------------------------------------*/
	#header {
	}
	#logo {
		top: 30px;
		left: 15px;
		width:170px;
	}
	#logo img {
		width: 170px;
	}
	#logo.price{
		top:10px;
	}
	


	/*  タイトル部分
	-------------------------------------*/
	.title_area{
		padding:20px 0 20px 0;
		overflow: hidden;
	}
	.title_area_in{
		width:80%;
		margin:0 auto;
	}
	.title_logo{
	}
	.title_logo img{

	}
	.title_ph{
		position: absolute;
		left:45%;
		top:0%;
	}

	
	/* ヘッドコピー */
	.head_copy{
		font-size:24px;
		padding-bottom:50px;
	}
	
	/* 上部 クーポン */
	.hayawari{
	}
	.hayawari img{
	}
	.head_coupon{
	}
	.head_coupon img{
		width:inherit;
	}
	
	/* メニューボタン */
	.gnav_area {
		padding: 30px 0;
		max-width: 800px;
		margin: 0 auto;
	}

	/* パンくず */
	.breadcrumb {
	}
	.breadcrumb ul {
		max-width: 1300px;
		margin: 0 auto;
	}


	/* おすすめエリア
-----------------------------------------*/
.main_pickup_area{
	padding-bottom: 0;
}
.main_pickup_area_inner{
	max-width:1000px;
	margin:0 auto;
}
.mpickup_item{
	padding:20px;
	border-radius: 10px;
}
.mpickup_ttl,.mpickup_ttl.first{
}
.mpickup_item a{
	display: flex;
}
.mpickup_item .point{
	font-size:30px;
}
.mpickup_item .ph{
	position: relative;
}
.mpickup_item .ph img{
	margin-bottom: 0;
	width:480px;
}
.mpickup_item .main{
	flex-basis:auto;
	padding:10px 0 0 20px;
	position:relative;
}
.mpickup_item h2{
	font-size:33px;
	margin-bottom: 18px;
}
.mpickup_item p{
	font-size:20px;
	line-height: 1.5;
	margin-bottom: 18px;
}
.mpickup_item .price{
	text-align: right;
	font-size:30px;
}
.mpickup_item .price strong{
	font-size:40px;
}
.mpickup_item .btn{
	font-size:28px;
	/*
	position: absolute;
	bottom:10px;
	*/
	width:100%;
}
.mpickup_item .btn::before{
	width:50px;
}

.mpickup_item .main .price .y_pre{
	width:30px;
	height:28px;
}

.mpickup_item .price s{
	font-size:30px;
}

.mpickup_item .point{
top:10px;
}
	
	/* ランキング */
	.ranking_area{
		margin-bottom: 60px;
	}

	.ranking_wrap{
		width: 100%;
		max-width:1000px;
		margin:0 auto;
		display: flex;
	}
	.ranking_area .rank{
		background-position: top center;
		padding:60px 5px 0 5px;
	}
	.ranking_area .rank.r1{
		padding-top:60px;
	}
	.ranking_area .rank.r5{
		padding-bottom: 0;
	}
	.ranking_area .rank.r4,
	.ranking_area .rank.r5{
		background-position: center 23px;
	}
	.ranking_area .item a{
		display: block;
		padding-bottom: 5px;
	}
	.ranking_area .item a .main{
		padding:5px;
	}
	.ranking_area .item .name{
		height:2.7em;
		font-size:15px;
	}
	.ranking_area .item .price,
	.ranking_area .item .price strong{
		font-size:18px;
	}
		.ranking_area .item .price strong span{
			font-size:13px;
		}
	.ranking_area .item .btn{
		font-size: 14px;
	}
	.ranking_area .item .ph img{
		border-radius: 10px 10px 0 0;
	}

	
	
	/* 文字の見出し */
	.text_ttl{
		font-size:50px;
		margin-bottom: 50px;
	}

	
	/* カテゴリから選ぶ */
	.cat_area{
		padding:70px 0;
	}
	.cat_area .text_ttl{
		margin-bottom: 0;
	}

	.cat_list{
		max-width:1050px;
		margin-left:auto;
		margin-right: auto;
		flex-wrap: nowrap;
	}
	.cat_list li{
		width:auto;
	}
	.cat_list li a{
	}
	.cat_list li a span{
		padding-bottom: 20px;
		font-size:18px;
	}

	/* 予算から選ぶ */
	.price_area{
		padding:70px 0;
	border-top:5px solid darkred;
	}
	.navi_price{
		max-width:1100px;
		margin:0 auto;
	}
	.navi_price li{
		width: calc(100%/4);
	}
	.navi_price li a{
		padding:25px 10px 25px 50px;
		font-size:23px;
		background-size: 20px;
		background-position: 15px center;
	}

	
	/* 商品エリア */
	.item_wrap {
		padding: 0 0 100px 0;
		background: repeat-y top center
	}
	.item_wrap.bg1{
		background-image:url(../imgs/bg01.jpg);
	}
	.item_wrap.bg2{
		background-image: url(../imgs/bg02.jpg);
	}


.item_title_wrap{
	height:300px;
	padding-top:30px;
	
}
.item_title_ph{
	position: absolute;
	top:20px;
	right:0;
	height:380px;
	margin:inherit;
}
.item_title_wrap .item_copy{
	position:relative;
	margin:0 auto;
	max-width:1050px;
	padding:40px 0 0 10px;
	z-index: 5;
}
.item_title_wrap .item_copy h2{
	font-size:60px;
	margin-bottom: 10px;
	text-align: left;
}
.item_title_wrap .item_copy p{
	text-align: left;
	font-size:20px;
	line-height: 1.7;
}


	
	.item_wrap .box {
		max-width: 1050px;
		margin: 0 auto;
	}

	.item_wrap .box .item {
		width: 31.3333%;
	}

	.box .item .ph, .box .item .main {
		float: none;
		width: 100%;
	}
	.item a .point{
		position:absolute;
		top:-10px;
		right:5px;
		font-size:23px;
		padding:15px;
		height:auto;
		border-radius:30px;
		/* box-shadow */
box-shadow: 3px 3px 12px -3px rgba(0,0,0,0.6);
	}

	.box .item .ph {
		margin-bottom: 15px;
	}
	.box .item .main {
		padding: 0;
	}
	
	.box.col1 .item {
		width: 100%;
		display: table;
	}
	.box.col1 .item a {
		height: 100%;
	}
	.box.col1 .item .ph,
	.box.col1 .item .main{
		display: table-cell;
		vertical-align: middle;
	}
	.box.col1 .item .ph {
		max-width: 480px;
		width: 45%;
		margin-bottom: 0;
	}
	.box.col1 .item .main {
		width: 55%;
		padding: 20px 20px 0 20px;
	}
	.box.col1 .item .main .name {
		font-size: 28px;
		margin-bottom: 15px;
	}
	.box.col1 .item .main .text {
		font-size: 15px;
		line-height: 1.6;
	}
	.box.col1 .item .main .price {
		float: none;
		margin: 0 0 20px 0;
	}
	.box.col1 .item .main .price span {
		font-size: 16px;
	}
	.box.col1 .item .main .price strong {
		font-size: 30px;
	}
	.box.col1 .item .main .btn {
		font-size: 28px;
		padding-left: 50px;
	}
	.box.col1 .item .main .btn:before {
		background-size: 25px;
		height: 48px;
		width: 48px;
	}
	.box .item .price br{
		display: none;
	}
	.box .item .price strong span{
		font-size:16px;
	}
	.box .item .tag span{
		font-size:14px;
	}
	
	/* item　pickup用 */
	.item_wrap .box .item.pickup {
		width:100%;
		margin:0 auto 30px auto;
		float:none;
		display:table;
	}
	.item_wrap .box .item.pickup .ph{
		width:48%;
		float:left;
		margin-bottom:0;
	}
	.item_wrap .box .item.pickup .main{
		width:50%;
		float:right;
	}
	.item_wrap .box .item.pickup .name{
		font-size:26px;
		margin-bottom:15px;
	}
	.item_wrap .box .item.pickup .text{
		font-size:18px;
		line-height:1.5;
		margin-bottom:20px;

	}

	
	/* フッター
	-------------------------------------------------- */
	#footer {
		padding: 0;
	}
	
	/* 特典 */
	.point_area {
		padding: 70px 0 100px 0;
	}
	.f_point {
		width: 700px;
		margin: 0 auto 40px auto;
		padding: 0;
	}
	.f_point h3 {
		width: 450px;
		margin-bottom: 30px;
	}
	.point_list {
		margin: 0;
	}
	.point_list li .point_mark {
		font-size: 20px;
		width: 110px;
		padding: 20px;
	}
	.point_list li .point_main {
		font-size: 22px;
	}
	/* お届け */
	.f_otodoke {
		width: 640px;
		margin: 0 auto;
	}
	.f_otodoke h3 {
		font-size: 22px;
	}
	.f_otodoke img {
		width: auto;
		display: block;
		margin: 0 auto 15px auto;
	}
	/* インフォメーション */
	.info_area {
		padding: 80px 0;
	}
	.info_area .inner {
		display: table;
		width: 100%;
		max-width: 1100px;
		margin: 0 auto;
		padding: 0 10px;
	}
	.info_area .info_box {
		float: left;
		width: 32%;
		margin-right: 2%;
	}
	.info_area .info_box.ib_n1 {
		margin-right: 0;
	}
	/* ページの先頭へ */
	#fixedTop {
		opacity: 0.5;
	}
	#fixedTop:hover {
		opacity: 1;
	}
	
	/* コピーライト */
	.copyright{
		padding:10px;
	}
	
	/* 豆知識、カテゴリ解説
		-----------------------------------------*/
	.note_list h3,  .topics_area h3 {
		margin-bottom: 50px;
		font-size: 30px;
	}
	/* 豆知識 */
	.note_list_area {
		padding: 80px 0;
	}
	.note_list {
		padding-bottom: 70px;
	}
	.note_list .inner {
		max-width: 800px;
		margin: 0 auto;
		display: table;
		padding-left: 0;
		padding-right: 0;
	}
	.note_list a {
		width: 48%;
		float: left;
		display: table;
		margin-right: 4%;
	}
	.note_list a:nth-child(2n) {
		margin-right: 0;
	}
	.note_list li .ph {
		width: 90px;
	}
	.note_list li .text {
		width: 280px;
	}
	/* カテゴリ解説 */
	.topics_area {
	}
	.topics_area .inner {
		max-width: 1100px;
		margin: 0 auto;
		display: table;
		padding: 0 10px;
	}
	.topics_list li {
		width: 48%;
		margin-right: 4%;
		float: left;
	}
	.topics_list li:nth-child(2n) {
		margin-right: 0;
	}
	.topics_list li:nth-child(7),  .topics_list li:nth-child(8) {
		margin-bottom: 0;
	}
	.topics_list li .ph {
		width: 20%;
	}
	.topics_list li .text {
		width: 78%;
		font-size: 13px;
	}
	.topics_list li .text strong {
		font-size: 15px;
	}
	.topics_list li .ph img {
	}
	/* カテゴリ解説 */
	.topics_area {
	}
	.topics_area .inner {
		max-width: 1100px;
		margin: 0 auto;
		display: table;
		padding: 0 10px;
	}
	.topics_list li {
		width: 48%;
		margin-right: 4%;
		float: left;
	}
	.topics_list li:nth-child(2n) {
		margin-right: 0;
	}
	.topics_list li:nth-child(7),  .topics_list li:nth-child(8) {
		margin-bottom: 0;
	}
	.topics_list li .ph {
		width: 20%;
	}
	.topics_list li .text {
		width: 78%;
		font-size: 13px;
	}
	.topics_list li .text strong {
		font-size: 15px;
	}
	.topics_list li .ph img {
	}
	/* 予算で選ぶ
	--------------------------------------------------- */
	
	.price_title_area{
	}
	.price_title_area .pagetitle{
		padding:60px 0 30px;
	}
	.price_title_area .pagetitle img{
		width:350px;
	}

	.price_wrap {
		padding: 100px 0;
	}
	.price_wrap .item_wrap_ttl {
		margin-bottom: 30px;
	}
	.price_menu_btn {
		max-width: 1000px;
		margin: 0 auto;
	}
	.price_menu_btn li {
		width: 32%;
		font-size: 25px;
		background-size: 25px;
		background-position: 10px center;
		margin-right: 2%;
	}
	.price_menu_btn li:nth-child(2n) {
		margin-right: 2%;
	}
	.price_menu_btn li:last-child {
		margin-right: 0;
	}
	.price_menu_btn li.active {
	}
	.price_menu_btn li a {
		padding: 15px 15px 15px 45px;
		font-weight: bold;
	}

	/* お届け情報
	-----------------------------------------------------*/
	.otodoke_area{
		padding:0;
		margin:0 auto 30px auto;
		max-width:800px;
		text-align:center;
	}
	.otodoke_area img{
	}
	
	/* 特典
	-----------------------------------------------------*/
	.tokuten_area{
		padding:0;
		margin:0 auto;
		max-width:800px;
		text-align:center;
	}
	.tokuten_area img{
	}
		
	
	/* 記事
	------------------------------------------- */
	.article_area{
		max-width:950px;
		margin:0 auto;
		padding:50px 10px 100px 10px;
	}
	.article_area img{
	}

	.article_area h1{
		font-size:26px;
	}
	.article_area h2{
		font-size:23px;
	}
	.article_area h3{
		font-size:20px;
	}
	.article_area p{
		font-size:16px;
		line-height: 1.9;
		margin-bottom: 2em;
	}
	.article_area .alignright{
		float:right;
		width:450px;
		margin-left:20px;
	}

	.article_area .page_navi{
		clear: both;
		font-size:14px;
		display: table;
	}
	.article_area .page_navi ul{
		margin-top:40px;
	}
	.article_area .page_navi .prev{
		float:left;
		margin-bottom:0;
	}
	.article_area .page_navi .next{
		float:right;
	}
	
	.article_area table{
	border-collapse: separate;
	border-spacing: 5px;
	width:100%;
}
	.article_area table th,
	.article_area table td{
		font-size:18px;
		line-height: 1.5;
		padding:20px;
	}
	.article_area table th{
	}
	.article_area table td{
	}
	
	/* ドロワーメニュー
	-----------------------------------------------------*/
	.menu{
position:fixed;
top:0;
left:0;
z-index:99;
width:100%;
display:table;
}
.menu > li{

font-size:20px;
}
.menu > li:last-child{

}
.menu li a{

}
.menu_item {

}
.menu_item_link {

}

.menu .submenu {

}
.menu .submenu_item {

}
.menu .submenu_item a{
padding:20px 0;
}
	
	/* クーポン・バナー
	-----------------------------------------------------*/
	.coupon{
		bottom:300px;
	}
	.coupon img{
		width:100px;
	}
	
	.side_linkbn{
		bottom:100px;
	}
	.side_linkbn img{
		width:100px;
	}
	
	.link_bn_area{
		padding:0;
		text-align:center;
	}
	.link_bn_area img{
		width:inherit;
	}

}