/* ================================
  product
  MB→PC min-width:1100px
================================ */

/* ページタイトル ※調整
-------------------------------- */
#cateTitImg { background-image: url("../product/img/contetitimg_product.jpg");}
#cateTitTxt { background-image: url("../product/img/contetitimg_product_bg.jpg");}
#cateTitTxt h1 { background: rgba(113, 153, 79, 0.9);}


@media screen and (min-width: 1100px), print {
  #product #cateTitBox {
    margin-bottom: 30px;
  }
}

/* 
-------------------------------- */
#product .readBox {
  text-align: left;
}
#product .readBox p {
  font-size: 16px;
}
#product .readBox .blBlock {
  display: block;
  
}

#product .readBox .balloon {
  background: #abd15f;
  color: #ff0;
  font-weight: normal;
  animation: pikopiko 1s steps(2, start) infinite;
}
#product .readBox .balloon::before {
  border-top-color: #abd15f;
}

#product .ropsTable {
  width: 100%;
  border: 2px solid #ddd;
}
#product .cropsList {
  padding-bottom: 60px;
}
#product .ropsTable th,
#product .ropsTable td {
  padding: 5px 10px;
  border-right: 2px solid #ddd;
  border-bottom: 2px solid #ddd;
}
#product .ropsTable tr:nth-child(1) {
  background-color: #edeaea;
}
#product .mName {
  position: relative;
  display: inline-block;
  width: 100%;
  margin-bottom: 20px;
  padding: 5px 15px;
  font-size: 20px;
}
#product .mName::before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -10px;
  border: 10px solid transparent;
}
#product .mName .nom {
  font-size: 32px;
}
#product .itemName {
  margin-bottom: 5px;
  padding-bottom: 5px;
  font-size: 20px;
}

.productSec {
padding: 20px 0 0;
}
.productSec:nth-of-type(n+2) {
padding-top: 40px;
}

/* 各月色設定 */
/* 1月 */
#product #january .mName, #product .col_january {
  background-color: #ffe4e4;
}
#product #january .mName:before {
  border-top: 15px solid #ffe4e4;
}
#product #january .itemName {
  color: #f7aaaa;
  border-bottom: 2px dotted #f7aaaa;
}
/* 2月 */
#product #february .mName, #product .col_february {
  background-color: #fff3e2;
}
#product #february .mName:before {
  border-top: 15px solid #fff3e2;
}
#product #february .itemName {
  color: #fbd8a2;
  border-bottom: 2px dotted #fbd8a2;
}
/* 3月 */
#product #march .mName, #product .col_march {
  background-color: #f7ffcf;
}
#product #march .mName:before {
  border-top: 15px solid #f7ffcf;
}
#product #march .itemName {
  color: #d2e183;
  border-bottom: 2px dotted #d2e183;
}
/* 4月 */
#product #april .mName, #product .col_april {
  background-color: #ffe8f4;
}
#product #april .mName:before {
  border-top: 15px solid #ffe8f4;
}
#product #april .itemName {
  color: #f9bfde;
  border-bottom: 2px dotted #f9bfde;
}
/* 5月 */
#product #may .mName, #product .col_may {
  background-color: #ecfddd;
}
#product #may .mName:before {
  border-top: 15px solid #ecfddd;
}
#product #may .itemName {
  color: #a4d17c;
  border-bottom: 2px dotted #a4d17c;
}
/* 6月 */
#product #june .mName, #product .col_june {
  background-color: #e8ecff;
}
#product #june .mName:before {
  border-top: 15px solid #e8ecff;
}
#product #june .itemName {
  color: #99a6dd;
  border-bottom: 2px dotted #99a6dd;
}
/* 7月 */
#product #july .mName, #product .col_july {
  background-color: #e2f9f9;
}
#product #july .mName:before {
  border-top: 15px solid #e2f9f9;
}
#product #july .itemName {
  color: #8cdbdb;
  border-bottom: 2px dotted #8cdbdb;
}
/* 8月 */
#product #august .mName, #product .col_august {
  background-color: #f2e8f1;
}
#product #august .mName:before {
  border-top: 15px solid #f2e8f1;
}
#product #august .itemName {
  color: #ebb3e6;
  border-bottom: 2px dotted #ebb3e6;
}
/* 9月 */
#product #september .mName, #product .col_september {
  background-color: #ebedff;
}
#product #september .mName:before {
  border-top: 15px solid #ebedff;
}
#product #september .itemName {
  color: #a6ace5;
  border-bottom: 2px dotted #a6ace5;
}
/* 10月 */
#product #october .mName, #product .col_october {
  background-color: #fee0e9;
}
#product #october .mName:before {
  border-top: 15px solid #fee0e9;
}
#product #october .itemName {
  color: #d3819a;
  border-bottom: 2px dotted #d3819a;
}
/* 11月 */
#product #november .mName, #product .col_november {
  background-color: #ffe8f9;
}
#product #november .mName:before {
  border-top: 15px solid #ffe8f9;
}
#product #november .itemName {
  color: #e7acd9;
  border-bottom: 2px dotted #e7acd9;
}
/* 12月 */
#product #december .mName, #product .col_december {
  background-color: #fffae6;
}
#product #december .mName:before {
  border-top: 15px solid #fffae6;
}
#product #december .itemName {
  color: #dbca8f;
  border-bottom: 2px dotted #dbca8f;
}
#product .itemName {
  margin-bottom: 5px;
  padding-bottom: 5px;
  font-size: 20px;
  color: #690;
  border-bottom: 2px dotted #690;
}
#product .pbldate {
  display: block;
  margin-bottom: 10px;
  padding-bottom: 10px;
  font-size: 16px;
  font-weight: normal;
}
#product .itemImg {
  padding-bottom: 10px;
  text-align: center;
}
#product .monthBox {
  margin-bottom: 60px;
}

@media screen and (min-width: 1100px), print {

  #product .readBox {
    text-align: center;
  }
  
  #product .readBox .blBlock {
    display: block;
    text-align: center;
  }
  #product .readBox .balloon {
    font-size: 24px;
  }
  #product .readBox h2 {
    font-size: 32px;
  }
  #product .cropsList {
    padding-bottom: 60px;
  }
  #product .itemData {
    display: flex;
  }
  #product .itemData .itemImg {
    flex-shrink: 0;
    order: 2;
    width: 400px;
  }
  #product .itemData .itemTxt {
    order: 1;
    margin-right: 20px;
  }
  #product .itemData .itemTxt p:first-child {
    padding-top: 0;
  }
  #product .mName {
    font-size: 26px;
  }
  #product .mName .nom {
    font-size: 38px;
  }
  #product .itemName {
    font-size: 24px;
  }
}