@charset "euc-jp";

.topicpath-nav li{
  font-family:"ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", 游明朝, YuMincho, メイリオ, Meiryo, serif;
}
#contents{
  padding-bottom:5em;
}
#contents > div > h2{
  font-family:"ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", 游明朝, YuMincho, メイリオ, Meiryo, serif;
}
.cg_freespace_01{
  margin-bottom:3em;
}
.col{
  margin-bottom:2em;
}
.show{
  padding-bottom:.4em;
}
.col a{
	display: block;
	position: relative;
}
.col p.name{
  margin-bottom:.2em;
}
.col p.name span {
  display: block;
}
.col p.price{
  margin-bottom:0;
}
.col .price .teika {
	color: rgb(180,150,150);
	font-size: .9em;
	text-decoration: line-through;
	display: inline-block;
}
.col .price .off {
  color: #cc0000;
}
.col .price .soldout{
  color:rgb(255,100,0);
}

#head_wait{
	display: -webkit-flex;
	-webkit-justify-content: flex-start;
	-webkit-align-items: center;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin-bottom: 2em;
}
#head_wait h2{
	font-family: sans-serif;
	font-size: 1.5rem;
	border: solid 2px;
	border-radius: 5px;
	padding: .2em .5em .1em;
	color: rgb(220,50,50);
	margin: 0;
}
#head_wait div{
	border-left: 1px solid;
	margin-left: 1.5rem;
	padding-left: 1.5rem;
}
#head_wait p{
	font-size: 1rem;
	line-height: 1.5;
	margin: 0;
}
#head_wait p.limit{
	color: rgb(220,50,50);
	margin-top: .3em;
}
#head_wait p.limit strong{
	font-size: 1.4em;
}


@media (max-width: 480px) {
 .col img{
   width:100%;
  }
  #head_wait{
    display:block;
  }
  #head_wait div{
    border-left: none;
    margin-left: 0;
    padding-left: 0;
    padding-top: 1em;
	}
}

/* for set*/
#contents li.productlist-unit a{
	position: relative;
	display: block;
}
#contents li.productlist-unit a[href="?pid=109681181"]:before,
#contents li.productlist-unit a[href="?pid=109681181"]:after{
	content: "";
	display: block;
	position: absolute;
	left: 3%;
	z-index: 1;
	width: 4em;
	height: 4em;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
#contents li.productlist-unit a[href="?pid=109681181"]:before{
	background-image: url(https://img21.shop-pro.jp/PA01329/320/etc/assort_point1.png);
	top: 3%;
}
#contents li.productlist-unit a[href="?pid=109681181"]:after{
	background-image: url(https://img21.shop-pro.jp/PA01329/320/etc/assort_point2.png);
	top: calc(3% + 4.5em);
}

/* for icon */
span.deli{
	position: absolute;
	top: .6em;
	left: .6em;
	font-size: .9em;
	line-height: 1.3;
	text-align: center;
	display: block;
	width: 5em;
	height: 5em;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding-top: 1.35em;
	border-radius: 2.5em;
	color: white;
	-webkit-box-shadow: 0 0 3px gray;
	box-shadow: 0 0 3px gray;
}
span.late6{
	background-color: rgb(130,150,255);
}
span.early7{
	background-color: rgb(100,190,180);
}
span.mid7{
	background-color: rgb(100,210,110);
}
span.late7{
	background-color: rgb(170,220,20);
}
span.seibo{
	position: absolute;
	top: .6em;
	left: .6em;
	font-size: 1em;
	line-height: 1.3;
	text-align: center;
	display: block;
	width: 5.6em;
	height: 5.6em;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding-top: 1.8em;
	border-radius: 3.5em;
	color: white;
	-webkit-box-shadow: 0 0 3px gray;
	box-shadow: 0 0 3px gray;
      font-family: "Lucida Sans Unicode", "Lucida Grande", Arial, Helvetica, "ヒラノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", sans-serif;
}
span.early12{
	background-color: rgb(210,30,0);
}
span.mid12{
	background-color: rgb(255,180,30);
}
span.late12{
	background-color: rgb(100,150,0);
}
span.early1{
	background-color: rgb(150,0,160);
}

.sp {display: none;}
@media (max-width: 480px) {
  .pc {display: none;}
  .sp {display: block;}
}

/*     お中元      */
#event-ochugen {
	width: 100%;

}
#event-ochugen .flexbox {
	display: flex;
	justify-content: space-between;
}
#event-ochugen .flexbox div {
	width: 48%;
}
#event-ochugen .days {
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","游明朝", YuMincho,"メイリオ", Meiryo, serif;
	color: #990000;
	font-size: 1.4em;
	line-height: 2;
	display: inline-block;
	text-align: left;
	letter-spacing: .15em;
margin-top:.5em;
}
#event-login {
	margin: 2em auto;
	text-align: center;
}
#event-login p a:link,
#event-login p a:visited {
	font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","游明朝", YuMincho,"メイリオ", Meiryo, serif;
	color: #990000;
	font-size: 2em;
	line-height: 2;
	display: inline-block;
	text-align: left;
	letter-spacing: .30em;
	font-weight: bold;
}
#event-login span {
	font-family: "ヒラギノゴシック W3", "Hiragino Gosic","游ゴシック", YuGosic,"メイリオ", Meiryo, sans-serif;
	color: #990000;
	font-size: 1em;
	margin-bottom: 1em;
	letter-spacing: .1em;
	display: block;
}
#event-login .bt {
	width: 42%;
	min-width: 300px;
}
@media screen and (max-width: 880px) {
	#event-ochugen .days {
		font-size: 1.2em;
	}
}
@media screen and (max-width: 640px) {
	#event-ochugen .flexbox {
		flex-wrap: wrap;
	}
	#event-ochugen .flexbox div {
		width: 100%;
	}
	#event-ochugen .days {
		font-size: 4.2vw;
	}

}

/* 2020お中元  */
#items .focus{
	position: relative;
	overflow: hidden;
	width: 100%;
	padding-top: calc(100% / 3);
	margin-bottom: 2em;
}
#items .focus:after{
	content: "";
	background: url(https://img21.shop-pro.jp/PA01329/320/etc/cc_anpone_icon.png) no-repeat bottom center;
	background-size: contain;
	width: 16.8%;
	height: 100%;
	position: absolute;
	bottom: 7%;
	right: 3.5%;
}
#items .focus img{
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
}
#items ul{
	display: -webkit-flex;
	-webkit-flex-wrap: wrap;
	-webkit-justify-content: center;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-pack: start;
	-ms-flex-pack: flex-start;
	justify-content: flex-start;
}
#items li{
	width: 30%;
	margin-left: 1.5%;
	margin-right: 1.5%;
	margin-bottom: 4em;
}
#items li img{
	width: 100%;
	padding-bottom: 1em;
}
#items ul:not(.nofocus) li:nth-child(-n+2) > .image{
	display: none;
}
#items li div{
	text-align: center;
	position: relative;
}
/*中元アイコン設定*/

#items li div.image span.deli{
	position: absolute;
	top: .6em;
	left: .6em;
	font-size: .9em;
	line-height: 1.3;
	text-align: center;
	display: block;
	width: 5em;
	height: 5em;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding-top: 1.35em;
	border-radius: 2.5em;
	color: white;
	-webkit-box-shadow: 0 0 3px gray;
	box-shadow: 0 0 3px gray;
}

#items li div.image span.late6{
	background-color: rgb(130,150,255);
}
#items li div.image span.early7{
	background-color: rgb(100,190,180);
}
#items li div.image span.mid7{
	background-color: rgb(100,210,110);
}
#items li div.image span.late7{
	background-color: rgb(170,220,20);
}

#items li  p.new{
	color: red;
}

#items li  p span.price {
	display: block;
	text-decoration: line-through;
	font-size: .9em;
	color: rgb(180,150,150);
	margin-top: .5em;
}

#items li  p span.off {
	color: #cc0000;
}

#items li h2{
	font-size:1.1rem;
	font-weight:normal;
	margin:0 0 .1em;
}

#items ul:not(.nofocus) li:nth-child(-n+2) h2:before{
	content: "New!";
	display: block;
	color: rgb(255,100,0);
	font-size: .8em;
	margin-right: .5em;
	vertical-align: top;
}
#items li p{
	margin:0 0 .2em;
	font-size:1.05rem;
}
#items li p.soldout{
	color: red;
}

#items li p a{
	display: block;
	background-color:#F60;
	border-radius:5px;
	line-height:1;
	font-size:.95em;
	padding: .8em 0 .7em;
	margin:.5em auto 0;
	text-align:center;
	width: 60%;
	min-width: 10em;
}
#items li p a:hover{
  text-decoration: none;
}
@media (max-width: 480px) {
  #items li{
		width: 100%;
		margin-left: auto;
		margin-right: auto;
	}
	#items li:nth-child(-n+2) > .image{
		display: block;
	}
}
