@charset "UTF-8"; /**/

.pd_202411hot {
  margin-bottom: 0 !important;
}
.pd_202411hot {
  font-family: "icomoon", YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo,
    "sans-serif";
  font-feature-settings: "palt" 1;
}

/* 注釈 */
.pd_202411hot .attention {
  /*opacity: 1; text-indent: 0;*/
}

/* カテゴリ別 */
.pd_202411hot .bg_so {
  background-image: url(../images/image_bg_so.png);
}
.pd_202411hot .bg_ri {
  background-image: url(../images/image_bg_ri.png);
}
.pd_202411hot .bg_po {
  background-image: url(../images/image_bg_po.png);
}

/* 余白・サイズ調整 */
.pd_202411hot .tit {
  text-align: center;
  font-weight: 900;
  color: #4f3000;
  border: 1px solid #4f3000;
}

/**/
.topArea {
  position: relative;
}
.detail_so,
.detail_po,
.detail_ri,
.cart_so,
.cart_po,
.cart_ri,
.detail_so_s,
.detail_po_s,
.detail_ri_s {
  position: absolute;
  display: block;
}

.detail_so {
  width: 200px;
  height: 280px;
  left: 5.97%;
  top: 37.96%;
}
.detail_po {
  width: 200px;
  height: 280px;
  left: 36.11%;
  top: 37.96%;
}
.detail_ri {
  width: 200px;
  height: 280px;
  left: 65.97%;
  top: 37.96%;
}

.cart_so {
  width: 200px;
  height: 50px;
  left: 5.97%;
  top: 64.81%;
}
.cart_po {
  width: 200px;
  height: 50px;
  left: 36.11%;
  top: 64.81%;
}
.cart_ri {
  width: 200px;
  height: 50px;
  left: 65.97%;
  top: 64.81%;
}

.detail_so_s {
  width: 200px;
  height: 40px;
  left: 5.97%;
  top: 69.62%;
}
.detail_po_s {
  width: 200px;
  height: 40px;
  left: 36.11%;
  top: 69.62%;
}
.detail_ri_s {
  width: 200px;
  height: 40px;
  left: 65.97%;
  top: 69.62%;
}

/* インクルード部分*/

.item_include .icon_box {
  text-align: left;
  font-size: 130%;
}
.item_include .copy {
  display: none;
}
.item_include .tax {
  font-size: 40%;
  margin-left: -0.3em;
}
.item_include .btn {
  margin-left: auto;
  margin-top: 1em;
  background: #e91e63;
  background: linear-gradient(115deg, #ff1100 0, #ff770d 50%, #ffb200 100%);
  position: relative;
  transition: 0.2s;
  border-radius: 0.25em;
  border: none;
}

.item_include .btn p {
  margin-bottom: 0;
  color: #ffffff;
  font-weight: bold;
  letter-spacing: 0.05em;
}
.item_include .btn p:after {
  content: "\e90c";
  position: absolute;
  font-weight: normal;
}
fieldset,
img {
  border: 0;
}
.display_exact .img_box,
.display_exact2 .img_box,
.body_sph ul.display_hybrid .img_box,
.body_sph ol.display_hybrid .img_box {
  width: 120px;
  float: left;
  text-align: left;
}

/*口コミ
.reviewArea{background: #ffffff;}
.reviewArea ul{}
.body_pc .reviewArea ul{padding: 5%;}
.body_sph .reviewArea ul{padding: 2% 5%;}
.reviewArea li{border-bottom: 2px dotted #4f3000;}
.body_pc .reviewArea li{padding: 1em 0; font-size: 1.3em; line-height: 2;}
.body_sph .reviewArea li{padding: 1em 0;}
.reviewArea li:last-child {border: none;}
.live_age{display: block; font-size: 80%; margin-top: 0.5em;}
.marker{background: #fff097;}*/ /*linear-gradient(transparent 60%, #fbcdcd 60%);*/

/* ふわっとアニメ */
/* 動作を適用する箇所 */
.fuwatAnime {
  -webkit-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 2s; /* アニメ時間 */
  -ms-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-transition-delay: 0.5s; /* 開始時間 */
  -ms-transition-delay: 0.5s;
  transition-delay: 0.5s;
  -webkit-animation-name: fuwatAnime; /* アニメ名 */
  -ms-animation-name: fuwatAnime;
  animation-name: fuwatAnime;
  visibility: visible !important;
}

/* 動作内容 */
@-webkit-keyframes fuwatAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-150px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}
@keyframes fuwatAnime {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-150px);
    -ms-transform: translateY(-150px);
    transform: translateY(-150px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.item_include .btn:after {
  content: "\e90c";
  position: absolute;
  font-weight: normal;
}

.item_include .goods_set {
  margin: 0.75em;
}

/* テキスト部分 */
.display_exact .c-panel__body {
  flex: 1;
  gap: 6px;
  margin-top: 0 !important;
}
/* 商品名、受取方法、価格 */
.display_exact .c-panel__body {
  /*place-content: center; /*縦真ん中寄*/
  place-items: start; /*真ん中寄*/
}
.display_exact .c-panel__body {
  margin-left: 235px;
  text-align: left;
  font-size: 130%;
}

/*商品名*/
/* 内側テキスト（商品名・価格） */
.sample_view .c-panel__name {
  line-height: 1.4 !important;
  font-size: 1.9rem;
}
/* inculude使用時のボタン、画像、商品名調整 */
.display_exact .c-panel__header img {
  width: 120px;
  float: left;
  text-align: left;
}
/* 価格色調整 */
.display_exact .c-panel__price-wrapper {
  color: #f30;
}
.display_exact .c-price {
  margin-top: 0.5em;
  line-height: 1;
}

.display_exact .c-panel__desc {
  display: none;
}
/* ボタン調整 */
.display_exact .c-panel__action {
  margin-top: 15px; /*カートボタン上の余白*/
  margin-right: 5px;
}

/* カートボタン位置 */
.display_exact .c-panel__action {
  margin-left: auto;
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

.display_exact .btn-primary {
  border-color: aliceblue;
}

/*バッチ*/
.display_exact .badge {
  color: black !important;
  border-color: black !important;
  background-color: white;
  border-radius: 0;
}

/* テンプレート ------------------- */
@media print, screen and (min-width: 768px) {
  .pd_202411hot {
    width: 720px;
    margin: 0 auto;
  }
  /* PC表示 */
  div.attention {
    text-align: center;
    margin: 0.5em;
  }
  .pd_202411hot .tit {
    font-size: 1.7em;
    padding: 0.5em;
    margin: 1em 0.5em;
  }
  .item_include {
    padding: 1em 2em; /*border-radius: 0.75em;*/
  }
  .item_include li:last-child {
    border-bottom: none;
  }
  /*.item_include .goods_set {margin: 0.75em;}*/
  .item_include .img_box {
    width: 215px;
    float: left;
    text-align: left;
  }
  .item_include .txt_box {
    margin-left: 235px;
    text-align: left;
    font-size: 130%;
  }
  .item_include .name {
    font-weight: bold;
  }
  .item_include .price2 strong {
    font-size: 1.6em;
  }
  .item_include .btn {
    width: 100%;
    margin-top: 0.7em;
  }
  .item_include .r_img {
    border-radius: 0.75em; /**/
  }

  .item_include .btn p:after {
    font-size: 1.6em;
    top: 10%;
    right: 26%;
  }
  .item_include .inclbt {
    margin-bottom: 2em;
  }
  .pd_202411hot .item_include .goods_set {
    height: 222px;
    position: relative;
    line-height: 1.4;
    overflow: hidden;
  }

  /* inculude使用時のボタン、画像、商品名調整 */
  .display_exact .c-panel__header img {
    width: 215px;
    float: left;
    text-align: left;
  }
  .display_exact .c-panel__action {
    width: 60%;
    margin-top: 0;
  }
  .display_exact .c-panel__action {
    margin-left: 235px;
    text-align: center;
    font-size: 130%;
  }
  .display_exact .c-panel__action button {
    font-size: 1.15em;
    padding: 2% 4% 2% 4%;
    text-align: center;
  }
  .display_exact .c-panel__action button {
    margin-bottom: 0;
    color: #ffffff;
    font-weight: bold;
    letter-spacing: 0.05em;
  }
  .display_exact .c-price {
    font-size: 6rem;
  }
}

/*   スマホ　　*/
@media print, screen and (max-width: 768px) {
  .l-main {
    margin: auto;
  }

  /* SP表示 */
  .contents_main {
    margin: 0;
  }

  div.attention {
    margin: 1em;
    font-size: 0.55em;
  }

  .pd_202411hot .tit {
    font-size: 94%;
    padding: 0.6em 0.1em;
    margin: 1em 0;
  }

  .detail_so,
  .detail_po,
  .detail_ri {
    width: 27.77%;
    height: 25.92%;
  }

  .cart_so,
  .cart_po,
  .cart_ri {
    width: 27.77%;
    height: 4.63%;
  }

  .detail_so_s,
  .detail_po_s,
  .detail_ri_s {
    width: 27.77%;
    height: 3.7%;
  }

  .item_include {
    padding: 1em 2em;
  }

  .item_include .inclbt {
    margin-bottom: 2em;
  }

  .item_include .goods_set {
    margin: 0;
  }

  .item_include .icon_box {
    text-align: left;
    font-size: 140%;
  }

  .pd_202411hot .item_include .img_box {
    width: 48%;
  }

  .pd_202411hot .item_include .txt_box {
    font-size: 78%;
    margin-left: 52%;
  }

  .item_include .price_box {
    font-size: 115%;
  }

  .item_include .price1 {
    display: block;
  }

  .item_include .price2 {
    font-size: 170%;
  }

  .item_include .btn {
    width: 100%;
    margin-top: 0.5em;
  }

  .item_include .r_img {
    border-radius: 0.5em; /**/
  }

  .item_include .btn p {
    font-size: 1.25em;
    padding: 7% 20% 7% 7%;
    text-align: left;
  }

  .item_include .btn p:after {
    font-size: 1.85em;
    top: 5.5%;
    right: 5.5%;
  }

  /* include（新サイトのc-panel）側：レイアウト */
  .display_exact .c-panel__body {
    margin-left: 130px;
    text-align: left;
    font-size: 130%;
  }

  .display_exact .c-panel__action {
    margin-top: 0;
    margin-left: 130px;
  }

  .display_exact .c-panel__badge .badge {
    font-size: 0.8rem;
  }

  /* 商品名：旧に近い見た目へ（※旧の 0.8rem 指定は削除済み） */
  .display_exact .c-panel__name,
  .sample_view .c-panel__name {
    font-size: 1.2rem !important; /* 必要なら 1.3rem に */
    line-height: 1.35 !important;
    font-weight: 700;
  }

  /* 価格：現状維持（必要に応じて調整） */
  .display_exact .c-price {
    font-size: 3rem;
  }

  /* ボタン文字：スマホだけ大きく */
  .display_exact .c-panel__action button,
  .display_exact .c-panel__action a,
  .display_exact button.add-to-cart-from-tile-asset,
  .display_exact a.add-to-cart-from-tile-asset {
    font-size: 1.15rem !important; /* 必要なら 1.2rem に */
    font-weight: 700;
    padding: 12px 14px !important;
    line-height: 1.2 !important;
  }
}

@media print, screen and (max-width: 768px) {

  .display_exact .c-panel__action{
    width: auto !important;
  }

  .display_exact .c-panel__body{
    font-size: 100% !important;
  }

  .display_exact .c-panel__name,
  .sample_view .c-panel__name{
    font-size: 1.2rem !important;
    line-height: 1.35 !important;
    font-weight: 700;
  }


  .display_exact .c-panel__action button,
  .display_exact .c-panel__action a,
  .display_exact button.add-to-cart-from-tile-asset,
  .display_exact a.add-to-cart-from-tile-asset{
    font-size: 1.6rem !important;
    padding: 7% 20% 7% 7% !important;
    text-align: left;
  }
}

/* =====================================================
   pd_202411hot：SPだけ アイコン（カート）を少し大きく＆位置調整
   ===================================================== */
@media screen and (max-width: 768px){

  /* include（c-panel）側のボタン本体：念のため relative を担保 */
  .pd_202411hot .display_exact .c-panel__action .btn{
    position: relative;
  }

  /* 旧サイト寄せ：右端アイコン（\e90c）を少し大きく */
  .pd_202411hot .display_exact .c-panel__action .btn::after{
    font-size: 2.05em !important; /* 1.85em → 少し大きく（好みで 1.95〜2.2） */
    top: 50% !important;
    right: 5.5% !important;
    transform: translateY(-50%) !important;
  }

  /* hoverで崩れるのをSPでは抑制（必要なら） */
  .pd_202411hot .display_exact .c-panel__action .btn:hover{
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
  }
}