@charset "UTF-8";

table.top_event,
table.top_event img {
  width: 100%;
}

p.shop_news {
  font-weight: bold;
  font-size: 15px;
  margin-bottom: 8px;
}
p.shop_message {
  color: #343434;
  line-height: 2.0 !important;
}
hr.style-one {
    border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
    background-image:    -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
    background-image:     -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
    background-image:      -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
}

/**　新着情報　**/
#info.no_titlebar ul {
    border-top: 1px solid #e1e1e1;
}
#info.no_titlebar ul li{
    position: relative;
    border-bottom: 1px solid #e1e1e1;
    padding: 10px 0;
}

#info.no_titlebar .date{
color: #333;
font-size:12px;
margin-bottom: 6px;
}

#info.no_titlebar .news-title{
    font-size: 15px;
    color: #333;
    margin-top: 5px;
    line-height: 1.6;
}
.news-title a {
    color: #333;
    text-decoration: none;
}

/* ランキングエリア 20170215 */
.slider {
        width:auto;
        margin: 15px 10px 40px 10px;
    }

    .slick-slide {
      margin: 0px 5px;
    }

.oec-carouselPanel .oec-itemBox {
    width: 120px !important;
    height: 300px;
}
.oec-itemBox, .oec-itemCheckBox {
    margin-right: 10px;
    padding: 5px;
    width: 120px;
    border: 1px solid #cccccc;
    float: left;
    background: #ffffff;
}
.oec-itemBox a, .oec-itemCheckBox a {
    display: block;
    color: #333;
    text-decoration: none;
}
.oec-itemBox .oec-itemImageBlock, .oec-itemCheckBox .oec-itemImageBlock {
    margin-bottom: 5px;
    position: relative;
}
.owl-carousel .owl-item img {
    display: block;
    width: 100%;
    -webkit-transform-style: preserve-3d;
}

.oec-itemBlock .oec-rankingIco {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 100;
}
.oec-itemBlock .oec-rankingIco img {
    width: 33px !important;
    height: 27px;.oec-itemBlock .oec-rankingIco {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 100;
}
}
.owl-carousel .owl-item img {
    display: block;
    width: 100%;
    -webkit-transform-style: preserve-3d;
}

h1, h2, h3, h4, h5, h6 {
    font-size: 12px;
    font-weight: normal;
}

    .slick-prev:before,
    .slick-next:before {
        color: black;
    }
button.slick-prev {
    left: 1%;
}
button.slick-next {
	left: 94%;
}

/* 夏季休業用 */
.box26 {
    position: relative;
    margin: 1.5em 10px;
    padding: 1.5em 1em;
    border: solid 3px #de0000;
    border-radius: 8px;
}
.box26 .box-title {
    position: absolute;
    display: inline-block;
    top: -13px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 19px;
    background: #FFF;
    color: #de0000;
    font-weight: bold;
}
.box26 p {
    margin: 0; 
    padding: 0;
}

/** **/
.slider {
    width: 100%;
    margin: 0;
}
.bx-wrapper {
  box-shadow: none;
  border: none;
  left: 0;
  background-color: transparent;
  margin: 0 auto;
}

.bx-wrapper img {
    width: 100%;
    display: block;
}
@media screen and (min-width:480px) and (max-width:959px) { 
.container {
    width: 92%;
    margin: 0 auto;
    padding: 0;
    position: relative;
}
}

/* NEW ITEM グリッド */
.p-newItem__grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(120px,1fr));
  gap:16px;
  margin:0;
  padding:10px;
  list-style:none;
}
.p-newItem__card{background:#fff;}
.p-newItem__card a{text-decoration:none;color:#1b1b1b;display:block}
/** Start of Selection */
.p-newItem__name{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 0.9rem;
  line-height: 1.4;
  margin: 6px 0 2px;
}
/** End of Selection */
.p-newItem__price{font-weight:700}
.p-newItem__off{color:#d00;font-size:0.85rem;margin-left:4px}
.p-newItem__soldout{display:inline-block;background:#999;color:#fff;font-size:0.75rem;padding:0 4px;margin-left:6px}
@media(max-width:480px){
  .p-newItem__grid{gap:10px}
}
/* ===========================================================
   NEW - ITEM  モジュール
   画像と見本スクリーンショットのレイアウトを忠実に再現
   （HTML は前回のまま変更不要）
   =========================================================== */

/* ---------- 全体 ---------- */
.p-newItem, .p-feature{
  margin:0 auto 30px;       /* 中央寄せ & 下マージン */
  text-align:center;
}

/* ---------- 見出し ---------- */
.p-newItem__ttl{
  margin:0 0 15px;
  font-size:26px;
  letter-spacing:.08em;
  line-height:1;
  font-weight:700;
  text-transform:uppercase;
  position:relative;
}
.p-newItem__ttl::before{      /* 上に日本語サブタイトルを載せる */
  content:"New Items";
  display:block;
  font-size:9px;
  letter-spacing:.12em;
  font-weight:600;
  margin-bottom:4px;
  color:#666;
}
/* ---------- 見出し-TOP RECOMMENDED ---------- */
.p-recommendItem__ttl{
  margin:0 0 15px;
  font-size:26px;
  letter-spacing:.08em;
  line-height:1;
  font-weight:700;
  text-transform:uppercase;
  position:relative;
}
.p-recommendItem__ttl::before{      /* 上に日本語サブタイトルを載せる */
  content:"Recommend";
  display:block;
  font-size:9px;
  letter-spacing:.12em;
  font-weight:600;
  margin-bottom:4px;
  color:#666;
}

/* ---------- グリッド ---------- */

/* ---------- figure & image ---------- */
.p-newItem__card figure{
  margin:0;
}
.p-newItem__card img{
  width:100%;
  height:auto;
  display:block;
  background:#f6f6f6;        /* ローディング時の保護色 */
  border-radius:4px;
}

/* ---------- テキストブロック ---------- */
figcaption{
  text-align:left;
  margin-top:6px;
  line-height:1.35;
}
.p-newItem__name{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  font-size:12px;
  font-weight:500;
}
.p-newItem__price{
  font-size:13px;
  font-weight:700;
  margin-top:2px;
}
.p-newItem__off{
  font-size:11px;
  color:#d60000;
  margin-left:4px;
}
.p-newItem__soldout{
  font-size:10px;
  /* color:#999; */
  margin-left:6px;
}

/* ---------- 一覧ボタン ---------- */
.p-newItem__more{
  margin-top:15px;
}
.c-btnOutline{
  display:inline-block;
  padding:12px 52px;
  border:1px solid #e71257;
  border-radius:28px;
  font-size:14px;
  font-weight:600;
  letter-spacing:.06em;
  color:#e71257;
  text-decoration:none;
  transition:background .2s;
}
.c-btnOutline:hover{
  background:#e71257;
  color:#fff;
}

/* ---------- topics ---------- */
/* .p-topics   {padding:24px 0;}
.p-topics__ttl   {font-size:22px;font-weight:700;margin-bottom:16px;}
.p-topics__list  {display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 0;}
.p-topics__card  {flex:0 0 280px;background:#fff;border-radius:12px;box-shadow:0 2px 4px rgba(0,0,0,.08);scroll-snap-align:start;}
.p-topics__thumb img{display:block;width:100%;height:auto;border-radius:12px 12px 0 0;}
.p-topics__name  {font-weight:600;font-size:15px;margin:8px 12px 4px;height:3.2em;overflow:hidden;}
.p-topics__desc  {font-size:13px;color:#555;margin:0 12px 12px;height:4.2em;overflow:hidden;}
.p-topics__more  {margin-top:20px;text-align:center;}
.c-btnOutline::after{content:'›';font-size:18px;line-height:1;} */

.p-feature {
  margin: 24px auto;
  padding: 0 10px;
  max-width: 980px;
}
.p-feature__ttl {
  font-size: 1.6rem;
  margin: 0 0 16px;
  font-weight: 700;
}
.p-feature__carousel {
  display: flex;
  gap: 16px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 8px;
  list-style: none;
  margin: 0;
}
.p-feature__card {
  flex: 0 0 80vw;
  max-width: 140px;
  background: #fff;
  /* border: 1px solid #e5e5e5; */
  /* border-radius: 8px; */
  overflow: hidden;
  /* box-shadow: 0 2px 4px rgba(0, 0, 0, .04); */
  /* transition: transform .15s; */
  scroll-snap-align: start;
}
@media (min-width: 600px) {
  .p-feature__card { flex: 0 0 220px; }
}
@media (min-width: 900px) {
  .p-feature__card { flex: 0 0 260px; }
}
.p-feature__card:hover { transform: translateY(-2px);}
.p-feature__card a {
  /* color: #1b1b1b; */
  text-decoration: none;
  display: block;
  height: 100%;
}
.p-feature__card figure {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.p-feature__card img {
  width: 100%;
  /* height: auto; */
  /* aspect-ratio: 26 / 27; */
  object-fit: cover;
  display: block;
}
.p-feature__name {
  font-size: 13px;
  font-weight: 700;
  margin: 8px 0 4px;
  line-height: 1.4;
}
.p-feature__lead {
  font-size: 12px;
  /* color: #333; */
  /* line-height: 1.6; */
  flex-grow: 1;
}
.p-feature__more { text-align: center; margin-top: 24px;}
/* .c-btnOutline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 240px;
  padding: 12px 24px;
  border: 1.5px solid #1b1b1b;
  border-radius: 30px;
  font-size: 1rem;
  font-weight: 600;
  transition: .2s;
} */
/* .c-btnOutline:hover { background: #1b1b1b; color: #fff;} */

/* =======================================================
   無料配送バー + ツールバー調整用コード
   ======================================================= */

/* 1. 無料配送バー */
.promo-bar{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  background:#f50060;          /* 背景色変更用 */
  color:#fff;
  font-size:.78rem;
  line-height:1.4;
  text-align:center;
  padding:4px 6px;
  font-weight:600;
  box-shadow:0 1px 4px rgba(0,0,0,.08);
  z-index:1100;                /* ツールバーより上に表示 */
}

/* 2. ツールバー調整 */
.toolbar{
  top:25px !important;         /* 無料配送バーの高さに合わせて調整 */
  z-index:1000 !important;     /* 無料配送バーより下に表示 */
}

/* 3. ヘッダー調整 */
header#pagetop,
.global_header{
  padding-top:77px !important;
}

/* 4. モバイル表示調整 */
@media (max-width:480px){
  .promo-bar{font-size:.7rem;padding:4px 4px;}
  .toolbar{top:23px !important;}
  header#pagetop,
  .global_header{padding-top:75px !important;} /* 26 + 52 */
}