@charset "UTF-8";
@font-face {
    font-family: 'Antonio';
    src: url('../fonts/Antonio-Regular.ttf') format('truetype');
  }
/* CSS Document */

a:hover {
    color: #CCC;
    text-decoration: underline;
}

ul li {
  list-style: none;
}

section {
    display: block;
    unicode-bidi: isolate;
}

#sub {
	padding: 30px 0 0;
}

#sub article.cWrap {
    width: 730px;
    float: none;
    margin: 0 auto;
}

.reflects a, #subBox a {
    color: #0071BC;
}

#onlineShop {}

/*---------------------------------
	タイトル部
---------------------------------*/

#sub .fvTitleSet {}

/* ページタイトル(英字) */
#sub .fvTitleSet em {
    font-family: 'Antonio', sans-serif;
    font-size: 2.4rem;
    font-weight: 200;
    font-style: normal;
    line-height: 1em;
    color: #74C133;
	background: url("../img/icon_melon.gif") no-repeat left 15px;
	padding-left: 30px;
}

/* ページタイトル(日本語) */
#sub .fvTitleSet em span{
		font-size: 1.2rem;
		margin-left: 10px;
		color: #000;
		letter-spacing: 2px;
}

/* ページ見出し */
#sub .fvTitleSet h2 {
    font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    font-size: 1.7rem;
    font-weight: 600;
    line-height: 1.4em;
    color: #333;
    border-bottom: 6px dotted #ccc;
    padding: 5px 0 15px;
    display: flex;
}

#sub .fvTitleSet h2::after {
    content: '';
    background: url("../img/title_line.png") no-repeat;
    flex-grow: 2;
    margin-left: 20px;
}

.fullwidth {
    width: auto !important;
    float: none !important;
    margin: 0 auto !important;
}

@media screen and (max-width:640px) {
    #sub article.cWrap {
        float: none;
        width: auto;
        margin-bottom: 50px;
    }
		#sub .fvTitleSet em {
			font-size: 2.3rem;
		}
		#sub .fvTitleSet em span {
			font-size: 1rem;
			letter-spacing: 1px;
		}
		#sub .fvTitleSet h2 {
			font-size: 1.3rem;
		}
}
/*---------------------------------
	案内部
---------------------------------*/
/* 案内文 */
#onlineShop .read {
  font-size: 110%;
  margin: 10px 0 30px;
}

/* 注意文 */
#onlineShop .attention {
  border: 1px solid #ccc;
  padding: 15px;
  margin: 0 0 40px;
}

#onlineShop .attention h3{
	font-size: 100%;
}

#onlineShop .attention ul li{
  font-size: 100%;
  text-indent: -1em;
  padding-left: 1em;
  margin: 10px 0;
}

/* カテゴリータイトル */
#onlineShop h2 {
  font-size: 140%;
  letter-spacing: 2px;
  font-weight: 600;
  color: #D4746A;
  margin-bottom: 10px;
}
#onlineShop dl.cat {
  background: #E6E6E6;
  padding: 7px 10px;
  display: flex;
}
#onlineShop dl.cat dt{
  margin: 5px;
  width: 100px;
}
#onlineShop dl.cat dt:after{
  content: '';
  display: inline-block;
  margin-left: 5px;
  border-left: 5px solid #999;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
}
#onlineShop dl.cat dd{
  width: 880px;
}

#onlineShop dl.cat dd ul,
#onlineShop ul.cat{
  display: flex;
  flex-wrap: wrap;
}
#onlineShop ul.cat{
  justify-content: flex-end;
}
#onlineShop .cat li{
  margin: 3px;
  display: inline-block;
}

/* 各種色別カテゴリー */
#onlineShop .cat li a{
  font-size: 100%;
  color: #fff;
  padding: 5px 15px;
  border-radius: 20px;
  line-height: 1em;
  display: block;
}
/* タグの色指定 */
#onlineShop .Vegetable{ background-color: #39B54A; }/*野菜*/
#onlineShop .Fruit { background-color: #FBB03B; }/*果物*/
#onlineShop .Sweets { background-color: #ED1E79; }/*スイーツ*/
#onlineShop .Meat { background-color: #D4746A; }/*肉*/
#onlineShop .Fish { background-color: #0174C5; }/*魚*/
#onlineShop .ProcessedFood{ background-color: #666666}/*加工品*/
#onlineShop .Melon { background-color: #78BD36; }/*メロン*/
#onlineShop .Ibaraking { background-color: #0CCB5B; }/*イバラキング*/
#onlineShop .Strawberry { background-color: #E73A1C; }/*いちご*/
#onlineShop .Hitachigyu { background-color: #CC704A; }/*常陸牛*/
#onlineShop .Hitachinokagayaki { background-color: #CCB400; }/*常陸の輝き*/
#onlineShop .Pear { background-color: #F2D20B; }/*梨*/
#onlineShop .DriedPotato { background-color: #D58816; }/*干し芋*/
#onlineShop .Tea { background-color: #a260bf;}/*茶*/
#onlineShop .Rice { background-color: #cfb793;}/*米*/
#onlineShop .Peanut { background-color: #de7957;}/*落花生*/
#onlineShop .Hitachiakisoba { background-color: #997c60;}/*常陸秋そば*/
#onlineShop .SweetPotato { background-color: #9E3645;}/*さつまいも*/
#onlineShop .LotusRoot { background-color: #b89963;}/*れんこん*/
#onlineShop .Tomato { background-color: #c61c08;}/*トマト*/
#onlineShop .Hoozuki { background-color: #f58c02;}/*ほおずき*/
#onlineShop .Chestnut { background-color: #642B20;}/*栗*/
#onlineShop .Blueberry { background-color: #313771;}/*ブルーベリー*/
#onlineShop .Watermelon { background-color: #F2463F;}/*すいか*/
#onlineShop .Liquor { background-color: #07a9f6;}/*酒*/
#onlineShop .GreenPepper { background-color: #296101;}/*ピーマン*/
#onlineShop .BokChoy { background-color: #749302;}/*ちんげん菜*/
#onlineShop .Herbs { background-color: #86B300;}/*ハーブ*/
#onlineShop .Paprika { background-color: #fead08;}/*パプリカ*/
#onlineShop .EdibleFlower { background-color: #eda8be;}/*エディブルフラワー*/
#onlineShop .Grape { background-color: #B85d53;}/*ぶどう*/

#onlineShop .archives{
  margin: 40px 0;
}
#onlineShop .archives h3{
	align-items: flex-end;
    display: flex;
    background: #fff;
    padding: 5px 0;
    margin-bottom: 5px;
}
/* 小項目タイトル */
#onlineShop .archives h3 span{
  font-size: 140%;
  font-weight: 600;
  background: #D4746A;
  padding: 7px 20px;
  border-radius: 20px;
  display: inline-block;
  white-space: nowrap;
  color: #fff;
  line-height: 1em;
  letter-spacing: 2px;
}
#onlineShop .pickup h3 span{ background: #FCEE21; color: #42210B; }
#onlineShop .now h3 span{ background: #78BD36; }

#onlineShop .archives h3 i{
  font-size: 140%;
  padding: 5px 10px;
  border-bottom: 3px dotted #ccc;
  width: 100%;
  font-style: normal;
}
#onlineShop .archives ul.box{
  display: flex;
  flex-wrap: wrap;
}
#onlineShop .archives ul.box > li{ 
  width: 31.3%;
  background: #eee;
  padding: 10px;
  box-sizing: border-box;
  margin: 2% 1%;
}

#onlineShop .archives.pickup ul.box > li{ 
  width: 48%;
}
#onlineShop .archives ul.box .cat > li a{ 
  padding: 3px 10px;
}
#onlineShop .archives ul.box > li .img{ 
  background: #fff;
}
#onlineShop .archives ul.box > li .img img{
  max-width: 100%;
}
/* リンクリスト説明文 */
#onlineShop .archives ul.box > li h4{
  font-size: 100%;
  background: #fff;
  padding: 5px;
  margin-bottom: 5px;
}


#onlineShop .link{
  background: #eee;
  padding: 20px;
  margin: 0 0 100px;
}
#onlineShop .link h3{
  font-size: 120%;
  margin-bottom: 10px;
}
#onlineShop .link ul li{
  display: inline-block;
  margin: 5px;
  line-height: 1.4em;
  font-size: 110%;
}
#onlineShop .link ul li a{
  color: #666;
  background: #FCECB1;
  padding: 2px 10px;
}

#onlineShop .pagination{
  margin-bottom: 80px;
}

#onlineShop.detail .cat{
  justify-content: flex-start;
}

#onlineShop.detail .shop{
  margin: 10px 0 0;
}

/* オンラインショップタイトル */
#onlineShop.detail .shop h2{
  font-family: "Hiragino Mincho Pro","MS PMincho", serif;
  font-size: 190%;
  line-height: 100%;
  color: #666;
  background: url("../img/icon_shop.png") no-repeat left;
  padding: 20px 0 0 70px;
  border-bottom: 1px solid #ccc;
  height: 64px;
  letter-spacing: 0;
}

#onlineShop.detail .shop .social{
  display: flex;
  align-items: center;
  margin: 10px 0;
}
#onlineShop.detail .shop .social li{
  margin: 0 5px;
}

#onlineShop.detail .shop .mainImg {
  text-align: center;
  margin-top: 30px;
}
#onlineShop.detail .shop .mainImg img{
  max-width: 100%;
}
/* ショップ説明文 */
#onlineShop.detail .shop .mainTxt{
  font-size:100%;
  padding: 15px 0;
}

/* 販売商品説明 */
#onlineShop.detail .archives .itemTxt{
  font-size:100%;
  padding: 15px;
}
#onlineShop.detail .archives dl{
  margin: 15px;
}

/* urlタイトル*/
#onlineShop.detail .archives dl dt{
  background: #FBF1F0;
  border-left: 8px solid #F3D8D5;
  padding: 8px 10px;
  font-size: 120%;
  color: #745131;
}
/* url表示 */
#onlineShop.detail .archives dl dd{
  padding: 10px 20px;
}

#onlineShop .archives.relatedLink img {
	object-fit: cover;
	object-position: center center;
	width:300px;

}

@media screen and (max-width:640px){
  
  #onlineShop dl.cat {
    display: block;
  }
  #onlineShop dl.cat dd {
    width: auto;
  }
  #onlineShop .archives.pickup ul.box > li {
    width: 100%;
  }
  #onlineShop .archives ul.box > li {
    width: 48%;
  }
  
  #onlineShop .archives h3 {
    align-items: center;
	}
  #onlineShop .archives h3 span {
    font-size: 120%;
    white-space: normal;
    letter-spacing: 1px;
    padding: 7px 15px;
  }
  #onlineShop .archives.pickup h3 span {
    white-space: nowrap;
  }
  #onlineShop .archives.itemslist h3 i,
  #onlineShop .archives.onlineShop h3 i,
  #onlineShop .archives.buyShop h3 i,
  #onlineShop .archives.relatedLink h3 i  {
    display: none;
  }
  
  #onlineShop.detail .archives dl {
    margin: 5px;
  }  
}


/*---------------------------------
	タグ生成用
---------------------------------*/

.tagcontainer {
    margin: 0.7em 0;
    padding: 0 1em;
}

.tagcontainer .tagcaption {
    display: inline-block;
}

.tagcontainer li.tagcaption {
    border: none;
    color: #5E5E5E;
}

.tagcontainer li {
    border: solid 1px #BABABA;
    border-radius: 0.4em;
    margin-right: 0.3em;
    display: inline-block;
    white-space: nowrap;
    padding: 0.2em 0.3em;
}

.tagcontainer li a {
	font-size: 100%;
    color: #989898;
}

/*---------------------------------
	ページナビ部
---------------------------------*/
.pageNav {
	font-size:100%;
    text-align: center;
    padding-bottom: 80px;
}
.pageNav a {
    color: #78BD36;
}


/*---------------------------------
	inner
---------------------------------*/
.inner {
  width: 1024px;
  margin-right: auto;
  margin-left: auto;
}

@media screen and (max-width: 640px) {
  .inner {
    width: auto;
    margin: 0;
    padding: 3%;
  }
}

/*---------------------------------
	clearfix
---------------------------------*/
.clearfix {
zoom:1;
}

.clearfix:after{
content:".";
display: block;
height:0px;
clear:both;
line-height:0;
visibility:hidden;
}

.clearBox {
	font-size: 0.1px;
	line-height: 1%;
	clear: both;
	height: 0px;
	width: 0px;
}

/* ADD CSS 2024.10.18 */
/*---------------------------------
	#onlineShop
---------------------------------*/
@media screen and (max-width: 767px) {
	#onlineShop.detail .shop h2{
		height: auto;
		padding-bottom: 15px;
	}
}