/* 基本設定
 *----------------------------------------------------------------------*/
html{
  font-size:16px;
}
body {
  color: #333;
  font-family: "Helvetica Neue", "Helvetica", "Arial", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  line-height: 1.6;
  background-color: #ededed;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  letter-spacing: 0.03em;
}
.sp_only, .sp{
  display:none;
}

.pc{display:block;}

#sysAll {
  max-width: 100%;
  background-color: transparent;
  padding: 0;
}
#sysWrap{/*白背景・上開け*/
  padding-top: 130px;
}
#sysHeader {
  margin: 0;
  padding: 0;
}
#sysMain {
  float: none;
  width: 100%;
  margin: 0 auto;
  padding: 0;
}
#sysAside {
  display:none;
  float: none;
  padding: 0;
}
#sysFooter {
  margin: 0;
  padding: 0;
}
#top #sysWrap{
  padding-top: 0!important;
  background: transparent;
}
.sysContent {
  padding: 0 !important;
}
h1,h2,h3,h4,h5{
  margin:0;
  padding:0;
  line-height: 1.6;
  font-weight:bold;
  letter-spacing:inherit;
}
a {
  color: #333;
  text-decoration: none;
  font-weight:inherit;
}
a:hover {
  color: #222222;
}
img {
  vertical-align: bottom;
  height:auto;
}
a img { transition: opacity 0.3s;}
a:hover img { opacity: 0.7;}
/* nohoverクラスがついている時は変化させない */
a:hover img.nohover { opacity: 1;}

p {
  margin: 10px auto;
 letter-spacing:0.3pt;
color:#333;
}
p.indent{
  margin: 5px 0 !important;
  text-indent: 1em
}
h1, h2, h3, h4, h5, h6 {
  font-size: inherit;
}
.clearfix:after {
  content: "";
  clear: both;
  display: block;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
/* フォーム要素の基本レイアウト */
input[type=search], input[type=text], input[type=tel], input[type=email], input[type=password], textarea {
  -webkit-appearance: none;
  padding: 15px 10px !important;
  width: 100%;
  line-height: 1;
  background: #fff;
  border: 1px solid #dedede;
  border-radius: 0; 
}
input[type=submit] {
  -webkit-appearance: none;
  line-height: 1;
  border-radius: 0;
}
input[type="radio"]{
  margin: 10px 10px 20px;
}
.sysFormField{margin: 10px 0;}
.sysFormField label{
  margin-right: 20px;
}
.sysFormField a{
  display: inline-block;
  color: #068acc;
  border-bottom: 1px solid #068acc;
  line-height: 15px;
  margin: 0 3px;
}
select {height: 30px;}
.sysItemSearchFormSort select{
border-radius: 0;line-height: 1;background: #fbfbfb; border: 1px solid #ddd;}
.sysItemSearchFormLimit select{
border-radius: 0;line-height: 1;background: #fbfbfb; border: 1px solid #ddd;}

#sysItemCategory select{
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none !important;
        width: 100%;
        padding: 3px 5px;
}
.red{ color: red;}
.t_center{ text-align: center;}
#sysMain, ul, ol, body{ font-size: 0.9rem;}
#sysExplanation .comment ul{font-size: 0.8rem; color: #555;}


.sysItemSearchFormCategory select{ border-radius: 0;
border: 1px solid #ddd;
background-color: #fbfbfb;}

.sysItemListDisp div{margin: 0 0 0 20px;font-size: 13px; color: #333;}

/* submitボタンの調整 */
.sysBackButton,
.sysNextSubmit {
  background: #9E0E30;
  color: #fff;
  display: block;
  padding: 15px;
  text-shadow: none;
  border-color: transparent;
  width: 80%;
  margin: 0 auto;
}
#sysMypageReminder #sysMain input[type=submit]{
  background: #9E0E30;
  color: #fff;
  display: block;
  padding: 15px;
  text-shadow: none;
  border-color: transparent;
  width: 100%;
  margin: 0 auto;
}

/* 商品カテゴリページ */

.sysItemCategoryInfo{margin: 0 auto;
text-align: center;
background: #ededed;
}

.sysItemCategoryForm{width: 80%;
margin: 0 auto;}

.sysFuncItemCategory a {
    line-height: 1.75;
}
.sysFuncItemCategory a:hover {
    background: #eee;
}
#sysItemCategory h1.itemCategory{
  margin-left: 5px;
  border-left: 5px solid #222222;
  padding-left: 10px;
  font-size: 18px;
  margin: 20px 0 10px;
}
.sysSelectionDescription{margin : 2px 0 10px;}

.sysItemCategoryCtl {
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  letter-spacing: 0.08em;
  color: #111;
  line-height: 1.8;
border: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 18px;
}

.sysItemCategoryCtl > br {display: none;}

.sysItemCategoryCtl a {
  position: relative;
  padding: 0;
  background: none;
  border: none;
  color: #666;
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.25s ease;
}

.sysItemCategoryCtl a:hover {
  color: #9e0e30;
}

.sysItemCategoryCtl .sysCurrent {
  color: #9e0e30;
  font-weight: normal;
  pointer-events: none;
}

.sysItemCategoryCtl .sysCurrent::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 1px;
  background: #9e0e30;
}

.sysItemCategoryCtl {
  --label-color: #999;
}

.sysItemCategoryCtl {
  color: var(--label-color);
}

.sysItemCategoryCtl a,
.sysItemCategoryCtl .sysCurrent {
  color: #666;
}

.sysItemCategoryCtl .sysCurrent {
  color: #9e0e30;
}

/* PRアイコン設定 */
.sysPr span:first-child {display: none;}/*謎のspan消し*/

span.icon_online, span.icon_kyobashi{
  display: inline-block;
  background: #ff1000;
  border: 3px solid #ff1000;
  color: #fff;
}
span.icon_book{
  display: inline-block;
  border: 3px solid #ff1000;
  color: #ff1000;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
span.icon_chilled{
  display: inline-block;
  background: #4472c4;
  border: 3px solid #4472c4;
  color: #fff;
  text-indent: 0.5em;
  letter-spacing: 0.5em;
}
/* カートボタン */
.sysCartButton:hover { opacity: 0.8;}

/* アーカイブリスト */
.sysItemList ul.sysList li .sysThumbnailImage {
    width: 40%;
    max-width: 200px;
}
/* 4-1-7  商品サムネイル画像 */
.sysItemList ul.sysThumbnail li {
    display: inline-block;
    float: none;
    vertical-align: top;
    letter-spacing: normal;
}
.sysItemList ul.sysThumbnail {
    letter-spacing: -.4em;
}
.sysItemList ul.sysThumbnail input {
    width: 100%;
    padding: 10px 0;
}

/* 商品ぺージ パンくず、リストスタイル */
.sysCategoryPankuzu {display: none;}
.sysItemCategoryPankuzu{display: none;}
.sysItemCategoryPankuzu,.sysItemListViewType {display: none;}

/* 商品画像 */
.sysThumbnailImage > span,.sysThumbnailImage > br { display: none;}
.sysItemImages .sysImageList li{
    display: inline-block;
    vertical-align: top;
    height: auto;
    width:23%;
    line-height: 1;
    float: none;
    margin: 1% 0;
}
/* 商品名 */
.sysItemName h1 { font-size: x-large;}
/* 注文エリア*/
.orderArea {
    display: flex;
    max-width: 1280px;
    margin: 0 auto;
}
.orderArea > div {
    width: 50%;
    display: block;
margin-top:50px;
}
.orderArea > .orderArea > div {
    width: 100%;
    display: block;
    margin: 0 0 1rem;
}

/* 商品ページのタイトル */
.sysItemName,
.sysExplanation > div > span,
.sysReview > span{
    display: block;
    margin-bottom: 0px;
    font-size: 13px;
    letter-spacing: 0.03em;
    font-family: "yu mincho","hiragino mincho";
}
/* 商品説明 */
/*.iteminfo {
  display: flex;
  justify-content: flex-end;
  margin: 0 auto;
  padding:0 0 3rem 0;
  max-width: 1100px;
}
.iteminfo_dec {
  width: 80%;
}
.iteminfo_dec table {
  margin: 1rem 0;
  width: 100%;
}
.iteminfo_dec th {
  font-weight: normal;
  text-align: left;
  padding-left: 10px;
  font-size: 10px;
color: #555;
text-transform: uppercase;
letter-spacing: 0.15em;
line-height: 2.2;
}
.iteminfo_dec tr {
  border-bottom: 1px dotted #999;
}
.iteminfo_dec td {
  padding: 0.5rem 1.5rem;
  text-align: left;
  font-size: 13px;
  line-height: 2.0;
  color: #444;
  margin-bottom: 18px;
}*/




/* 1. コンテナの調整 */
.iteminfo {
    width: 100%;
    max-width: 500px; /* product-descriptionと合わせる */
    margin: 0 auto 3rem auto;
    padding: 0 20px;
    box-sizing: border-box;
}

.iteminfo_dec {
    width: 100%;
}

/* 2. テーブル構造を解除して dl スタイルを適用 */
.iteminfo_dec table {
    width: 100%;
    border-top: 1px solid #000; /* 上部の黒いライン */
    border-collapse: collapse;
    margin-top: 20px;
}

.iteminfo_dec tr {
    display: block; /* 行をブロック化 */
    width: 100%;
    clear: both;
    overflow: hidden;
}

/* 見出し部分 (th) を dt と同じスタイルに */
.iteminfo_dec th {
    display: block;
    float: left;
    width: 120px; /* product-spec dt と同じ幅 */
    font-size: 10px;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    line-height: 3.0; /* ddと高さを合わせる */
    font-weight: 400;
    text-align: left;
    padding: 0 0 0 10px;
    box-sizing: border-box;
}

/* 内容部分 (td) を dd と同じスタイルに */
.iteminfo_dec td {
    display: block;
    margin-left: 120px; /* thの幅と同じ分だけ空ける */
    font-size: 11px;
    color: #000;
    line-height: 3.0;
    border-bottom: 1px solid #dcdcdc; /* 下の細いグレー線 */
    padding: 0 0 0 10px;
    box-sizing: border-box;
}

/* 3. スマートフォン表示の統合 */
/* スマートフォン表示の最適化 */
@media screen and (max-width: 600px) {
    .iteminfo {
        padding: 0 0 2rem 0; /* 下の余白を少し詰める */
    }

    .iteminfo_dec table {
        border-top: 1px solid #000;
        margin-top: 20px;
    }

    .iteminfo_dec tr {
        display: block;
        padding: 15px 0; /* 各行の上下に均等な余白 */
        border-bottom: 1px solid #dcdcdc;
    }

    .iteminfo_dec th {
        display: block;
        float: none;
        width: 100%;
        padding: 0 0 5px 0;
        line-height: 1.2;
    }

    .iteminfo_dec td {
        display: block;
        margin-left: 0; /* 左マージンを解除 */
        width: 100%;
        padding: 0; /* 無駄なパディングをリセット */
        font-size: 12px;
        line-height: 1.6;
        border-bottom: none; /* tr側で線を引くのでここは消す */
    }
}






/* 買い物フォーム */
#sysItemDetail .sysRetailPrice { font-weight: bold;}
#sysItemDetail #sysVariation {
     overflow: hidden;
     margin: 5px auto;
}
#sysItemDetail #sysVariation >div {
    margin: 10px auto;
    overflow: hidden;
}
#sysItemDetail .sysNumArea button {
    display: inline-block;
    width: 48%;
    background: #666;
    padding: 15px;
    border: 1px solid #999;
    color: #fff;
}
#sysItemDetail .sysNumArea {
    display: none; 
    padding-top: 5px;
    clear: both;
    text-align: right;
}
#sysWishlist .sysButton,
#sysItemDetail .sysCartButton {
    width: 98%;
    margin-left: 2%;
}
#sysItemDetail .sysShare { padding: 5px 0 0 2%;}

/*#sysCartInForm { width: 100%;}
#sysCartInForm {
  width: 100%;
  margin-left: auto;
}*/


.sysButton{
  border: 1px solid #000;
  color: #000;
  background: #fff;
}
.sysLoginButton, .sysButton{
  display: block;
  margin: 0.5rem auto;
  padding: 15px;
  width: 100%;
  max-width: 450px;
}
.sysLoginButton:hover, .sysButton:hover {
    opacity: 0.8;
}
/* カートボタン */
.sysCart #sysMain .sysNextSubmitArea .sysNextSubmit,
.sysCart #sysMain input[type=submit],
.sysCart #sysMain button[type=submit],
.sysCart #sysMain button {
    background: #666;
    color: #fff;
    text-shadow: none;
}
.sysCartInDone{ margin: 0;}
/* ログインボタン */
.sysLoginButton{
  border: 0;
  background: #000000!important;
  color: #fff!important;
  cursor: pointer;
}

/* フォームページの基本レイアウト*/
#sysFormIndex #sysMain,
#sysFormConfirm #sysMain,
#sysFormThanks #sysMain,
.sysMemberRegister #sysMain,
.sysMypage #sysMain{
  width: 1100px;
  padding: 20px 150px !important;
  margin: 30px auto;
}
#sysDestination #sysMain{
  width: 1100px;
  padding: 20px 150px !important;
  margin: 30px auto;
}
#sysFormConfirm label, #sysMemberRegisterConfirm label{
  display: block;
  margin: 15px 0 5px!important;
}
#sysFormConfirm .sysFormField #sysMemberRegisterConfirm .sysFormField{
  margin: 10px 0 20px !important;
}
#sysFormConfirm button.sysButton{
  width: 49%;
  float: left;
  margin: 0;
  margin-right: 1%;
  margin-top: 30px;
  height: 50px;
  border-radius: 3px;
  background: #ccc;
  color: #444;
}
#sysFormConfirm .sysNextSubmit{
  width: 49%;
  margin: 0;
  margin-top: 50px;
  margin-left: 1%;
}
#sysMemberRegisterConfirm .sysNextSubmit{
  width: 49%;
  margin: 0;
  margin-top: 20px;
  margin-right: 1%;
  float: left;
}
#sysMemberRegisterConfirm .sysBackButton{
  width: 49%;
  float: left;
  margin: 0;
  margin-left: 1%;
  margin-top: 0px;
  background: #ccc;
  color: #444;
}
#sysFormThanks .completeText{
  margin: 20px 0;
  text-align: center;
  font-size: 15px;
}
#sysFormThanks .completeText a{
  color: #068acc;
  text-decoration: underline;
}
#sysMemberRegisterRegister #sysMain h2,
#sysMemberRegisterConfirm #sysMain h2,
#sysMemberRegisterIndex #sysMain h2,
#sysFormThanks #sysMain h2,
#sysFormConfirm #sysMain h2,
#sysFormIndex #sysMain h2 {display:none;}
#sysFormIndex #sysMain input {font-size: 15px;}

#sysFormIndex .txtBlock{text-align: center;}
#sysMemberRegisterConfirm  #sysMain > form,
#sysMemberRegisterIndex #sysMain > form,
#sysFormConfirm #sysMain > form,
#sysFormIndex #sysMain > form { padding: 10px;}

#sysMypageReminder #sysMain input[type="text"],
#sysMemberRegisterIndex #sysMain input[type="text"],
#sysFormIndex #sysMain input[type="text"],
#sysFormIndex #sysMain textarea {
        background: #fff;
        margin: 10px 0 30px
}
#sysMemberRegisterIndex #sysMain input[type="tel"],
#sysMemberRegisterIndex #sysMain input[type="email"] ,
#sysMemberRegisterIndex #sysMain input[type="password"] {
        background: #fff;
        margin: 10px 0 30px
}

#sysMain .sysFormLabel{
  display:block;
  padding-left: 5px;
  line-height: 25px;
  margin-bottom: 5px;
}
#sysMain .sysRequired{
  display: inline-block;
  height: 25px;
  line-height: 25px;
  margin-bottom: 5px;
}
#sysMain textarea { min-height: 200px;}
.sysZipcode button,
.sysZipcode .sysFormField { display: inline-block;}
.sysZipcode .sysFormLabel { display: block;}
.sysZipcode .sysFormField { width: 200px;}
.sysZipcode br{ display: none;}
.sysBirthday input { width: auto!important;}

/* フォーム確認ぺージ */
#sysMypageEditConfirm #sysMain .sysFormField,
#sysMemberRegisterConfirm #sysMain .sysFormField,
#sysFormConfirm #sysMain .sysFormField {
    border: 1px solid #999;
    line-height: 2;
    padding-left: 10px;
    margin: 5px auto;
    min-height: 20px;
}

/* マイページ */
.sysMypageMajorHeadLine{display:none;}
.SysMypageMinorHeadLine{
  font-size: 18px;
  margin: 20px 0;
}
#sysMypageLogin .sysMypageMinorHeadLine{display: none;}

/* 購入履歴 */
.sysOrderList {
    border: 1px solid rgb(212,212,212);
    padding: 10px;
    max-height: 400px;
    overflow-y: scroll;
}
.sysOrderList li {
    border-bottom: 1px dotted rgb(212,212,212);
    margin-bottom: 5px;
    padding-bottom: 5px;
}
.sysMypageNav{ margin-top: 1rem;}
/* Member Profile Editor */
h3.sysMypageMinorHeadLine {
  font-size: 1.2rem;
  text-align: center;
  border-bottom: 1px solid #000;
  margin-bottom: 1rem;
}
#sysMypageEditDelivery #sysMain > form,
#sysMypageEditMember #sysMain > form{ padding: 10px;}
#sysMypageEditDelivery #sysMain input,
#sysMypageEditMember #sysMain input {
    line-height: 15px;
    margin: 5px auto;
}
.sysMypage input#button1, .sysMypage input#button2 {
  width: 100%;
}
#sysMypageEditConfirm #sysMain > form { padding: 10px;}

/* Special Point */
.sysSpecialPoint {
    overflow: hidden;
    letter-spacing: -.4em;
}
.sysSpecialPoint > div:nth-child(2n) {
    width: 60%;
}
.sysSpecialPoint > div {
    display: inline-block;
    letter-spacing: normal;
    padding: 5px 10px;
    border-bottom: 1px solid #d5d5d5;
}
.sysSpecialPoint > div:nth-child(2n+1) {
    width: 40%;
}
.sysMyPoint { margin: 1rem 0 3rem;}

/* 4-5-4 Coupon List */
.sysCoupon {
    border: 1px solid #d5d5d5;
    margin: 10px;
}

/* マイページ（複数配送先編集画面）*/
.sysSelectAddress{background: none;}
.sysSelectAddress a {
    display: block;
    text-decoration: none;
    border: 0px solid;
    padding: 10px;
}
.sysSelectAddress {
    margin: 10px 0;
}

.sysSelectAddress a:hover {
    background: #eee;
}
.sysItemList ul.sysList li:last-child, .sysItemList ul.sysList li, .sysItemList ul.sysList li{
  border-top: 0;
  border-bottom: 0;
}
/*商品チェック履歴*/
#sysMypageAshiato .sysList li, #sysMypageReview .sysList li{
  border: 1px solid #000;
  margin: 1rem 0;
  padding: 1rem;
}
#sysMypageAshiato .sysCartButton, #sysMypageReview .sysCartButton{
  width: 100%;
}
#sysMypageLogout h3.sysMypageMinorHeadLine{ display: none;}

/***********************************
  商品詳細ページ
***********************************/
/*商品名*/
#sysItemDetail .sysItemName h1{
  font-size:24px;
  font-weight:normal;
  padding-bottom:10px;
  margin-bottom:10px;
  border-bottom:1px solid #000;
}
/*商品番号*/
#sysItemDetail .sysItemId {
  text-align: right;
  /* font-size: 12px; */
}
/*価格表示*/
#sysItemDetail .sysRetailPrice {
  display: inline-block;
  width: 100%;
  margin-bottom: 5px;
  color: #000;
  font-weight: bold;
  text-align: right;
}
#sysItemDetail .sysRetailPrice span {
  font-size: 1.1rem;
}
#sysItemDetail .sysRetailPrice span .sysRetailPriceTaxIncluded{font-size: small;}

/*通常価格*/
#sysItemDetail .sysSuggestedRetailPrice {
  margin-bottom: 5px;
  text-align: right;
}
#sysItemDetail .sysSuggestedRetailPrice span {
  font-size: 1.1rem;
}
/*送料区分*/
#sysItemDetail .sysShippingCost {
  display: inline-block;
  width: auto;
  margin-left: auto;
  margin-top: 5px;
  padding: 0 5px;
  color: #9e0e30;
  font-weight: bold;
  font-size: 1.1rem;
  border: 1px solid #9e0e30;
  border-radius: 3px;
}
/*PRアイコン(カテゴリーページ)*/
#sysItemCategory input[type=submit]{margin-top: 10px;}
.sysAddSelection div{margin-bottom: 10px;}
.sysAddSelection { clear: both;}
.sysAddSelection input, .sysAddSelection select{margin: 5px 0;}
.sysItemPrArea{margin-top: 5px;}

/* =================================================
   全ページ共通：配送タグ（23区限定/全国配送など）
   ================================================= */
.sysPr {
  display: flex;
  gap: 10px;
  margin-bottom: 30px;
  flex-wrap: wrap;
}

.sysItemPr,
#sysItemDetail .sysItemPrArea span{
  display: inline-flex !important;
  width: 45% !important;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 8px 0 !important;
  height: auto !important;
  background: #e2e2e2 !important;
  color: #111 !important;
  border: none !important;
  border-bottom: 2px solid #111 !important;
  border-radius: 0 !important;
  font-family: "Helvetica Neue", Arial, "Hiragino Sans", "Meiryo", sans-serif !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: 0.25em !important;
  text-transform: uppercase;
  line-height: 1 !important;
}

/* 23区限定：flo.danceの赤をアクセントに */
.sysItemPr.label-limited {
  background: transparent !important; /* ほんのり赤みの背景 */
  color: #900000 !important;      /* 文字をブランドの赤に */
  border-bottom: 2px solid #900000 !important; /* 下線も赤に */
}

/* 全国配送：今のモノトーンを維持、または少し強く */
.sysItemPr.label-nationwide {
  background: #f0f0f0 !important; 
  color: #111 !important;
  border-bottom: 2px solid #111 !important;
}

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

#sysFooter .sysItemPrArea span,
.checked .sysContent .sysHorizontal .sysItemPrArea span, 
.checked .sysContent .sysHorizontal .sysItemPr{
    width: 90% !important; 
    margin-bottom: 10px !important;
  }
}

#sysItemDetail .sysForm select {
  display: inline-block;
  float: none!important;
        margin: 5px 0;
}
#sysItemDetail .sysForm select[name="num"]{
        min-width: 200px;
}
#sysItemDetail .sysForm input[type="text"]{margin-top: 5px;}
#sysSelections div{margin-bottom: 10px;}
#sysItemDetail .sysSelections{ line-height: 30px;}
#sysItemDetail #sysVariation {
  width: 100%;
  max-width: 500px;
  overflow: hidden;
  margin-left: auto;
}
#sysItemDetail #sysVariation >div {
  margin: 10px auto;
  overflow: hidden;
}
#sysItemDetail .sysNumArea button {
  display: inline-block;
  width: 48%;
  background: #000;
  padding: 10px;
  border: 1px solid #999;
  color: #fff;
}
#sysItemDetail .sysNumArea {
  padding-top: 5px;
  clear: both;
  text-align: right;
}
#sysWishlist .sysButton, #sysItemDetail .sysCartButton {
  width: 98%;
  margin-left: 2%;
  border-radius: 0;
}
#sysItemDetail .sysShare {
  padding: 5px 0 0 2%;
  display: none;
}

/*バリエーション*/
#sysItemDetail .sysFormVariationName {
  background-color: #fdf5f5;
}
#sysItemDetail .sysFormVariationTable {
  width: 100%;
  max-width: 500px;
}
/*下部フォーム*/
#sysItemDetail .order_bottom {
  margin: 0 auto 40px;
  text-align: right;
}
/*簡易商品説明*/
#sysItemDetail .sysDescription {
  text-align: left;
}
/*商品詳細*/
.sysExplanation {
  text-align: center;
}
.sysExplanation img {
  height: auto;
}
#sysItemDetail .itempage_cap{
  margin-bottom:30px;
}
#sysItemDetail .itempage_cap .i_ttl{
  margin-bottom:20px;
  font-size:120%;
  font-weight:bold;
}
#sysItemDetail .itempage_detail_ttl{
  position:relative;
  margin-top:40px;
  padding:5px 0;
  font-weight:bold;
  font-size:18px;
}
#sysItemDetail .itempage_detail_ttl:after{
  content: "　";
  display:block;
  position:absolute;
  bottom:0;
  left:50%;
  margin-left:-30px;
  width:60px;
  height:2px;
  background-color:#000;
}
#sysItemDetail .sysMainImage img{
  border:1px solid #ccc;
}
/*数量増減*/
#sysItemDetail .sysNumArea {
  margin-bottom: 20px;
}
#sysItemDetail .sysNumArea button {
  overflow: hidden;
  display: inline-block;
  width: 25%;
  padding: 10px;
  text-indent: -999px;
  border: 1px solid #b9b9b9;
  background: #f1f1f1;
  cursor: pointer;
}
#sysItemDetail .sysNumArea button:hover {
  background-color: #efefef;
}
#sysItemDetail .sysNumArea .sysBtnPlus {
  border-color:#b9b9b9;
  background: url(/img/layout/system/btn_plus.png) center center no-repeat;
  background-size: 65px;
  width: 37%;
}
#sysItemDetail .sysNumArea .sysBtnMinus {
  border-color:#b9b9b9;
  background: url(/img/layout/system/btn_minus.png) center center no-repeat;
  background-size: 90px;
  width: 37%;
}
/*カートに入れる*/
#sysItemDetail .sysCartButton {
  padding:1rem !important;
}
#sysItemDetail .sysCartButton:hover {
  opacity:0.8;
}
#sysItemDetail .sysGoCartButton {
  background: #9e0e30 url(/img/layout/system/btn_cart2.png) center center no-repeat;
  background-size: 127px;
}
/*お気に入り*/
.modaal-container {
    max-width: 750px !important;
    padding: 30px 8%;
    box-shadow: none !important;
    color: #333 !important;
}
/* お気に入り登録時の画面 */
/* バツボタン */
.modaal-close{
    width: 22px !important;
    height: 22px !important;
    position: absolute !important;
    right: 15px !important;
    top: 15px !important;
    border-radius: 0 !important;
    border: 1px solid #9e0e30!important;
    background-color: #fff !important;
}
.modaal-close:after, .modaal-close:before {
    display: block;
    content: " ";
    position: absolute;
    top: 0.3px!important;
    left: 8px!important;
    width: 4px;
    height: 22px;
    border-radius: 4px;
    background: #9e0e30!important;
    -webkit-transition: background .2s ease-in-out;
    transition: background .2s ease-in-out;
}
/*大輪胡蝶蘭のカラーバリエーション*/
.sysExplanation.sysDisplayMobileNone.sysDisplayKeitaiNone h3 {
  border-bottom: 1px solid;
  text-align: left;
  font-size: 1.2rem;
  font-weight: normal;
}
.sysExplanation.sysDisplayMobileNone.sysDisplayKeitaiNone .comment ul {
  display: flex;
  justify-content: center;
  margin: 1rem 0;
}
/*色選択、数量、獲得ポイント*/
#sysCartInForm #sysSelections {
  text-align: right;
}
#sysCartInForm #sysNumber,  #sysCartInForm #sysGetPoint {
  text-align: right;
  margin-bottom: 1rem;
}
span.get_point{ color: red;}

@media (min-width: 1024px){
  .modaal-close {
    width: 44px !important;
    height: 44px !important;
    right: 30px !important;
    top: 30px !important;
  }
  button, input, optgroup, select, textarea {
      font: inherit;
}}

/* サンプルイメージ */
.mdl-dialog__image::before {
  content: "お気に入り登録完了";
  margin-bottom: 15px;
  display: block;
  text-align: center;
  font-size: 1.3rem;
}
.mdl-dialog__image {
  width: 88.81%;
  max-width: 250px;
  margin: auto;
}
.massage{
  text-align: center;
}
/* ログインボタン */
.sysWishlistLoginButton{
  width: 167px;
  line-height: 35px;
  position: relative;
  background-color: #9e0e30;
  text-align: center;
  font-size: 1.3rem;
  transition: .2s;
  color: #fff;
}
.sysWishlistLoginGroup {
    margin: auto auto 30px!important;
    text-align: center;
}

:after, :before {
    text-decoration: inherit;
    vertical-align: inherit;
    background-repeat: no-repeat;
    box-sizing: inherit;
}
@media (min-width: 1024px){.mdl-dialog__content {
    padding: 0 0 30px !important;
    font-size: 1.6rem !important;
}}
/* 会員登録ボタン */
.sysWishlistMemberRegisterGroup::before {
    content: "会員登録をされていないお客様はこちら";
    margin-top: 12px;
    display: block;
    font-size: 1.1rem;
    text-align: center;
}
.sysWishlistMemberRegisterGroup {
    width: 80%;
    text-align: center;
    height: 92px;
    border: 1px solid #bbb;
    position: relative;
    background-color: #fff;
    margin: auto auto 30px!important;
}
.sysWishlistMemberRegistButton{
  width: 167px;
  line-height: 35px;
  position: relative;
  background-color: #9e0e30;
  text-align: center;
  font-size: 1.3rem;
  transition: .2s;
  color: #fff;
}
/* この画面を閉じるボタン */
.sysWishlistCloseBottomButtonGroup button {
    transition: .2s;
    background-color: transparent;
    border-radius: 0px;
}
.sysWishlistCloseBottomButtonGroup {
    margin-top: 30px;
    text-align: right;
    font-size: 1.3rem;
}

/*SNSボタン*/
#sysItemDetail .sysShare {
  padding: 5px 0 0 2%;
  text-align: right;
}
#sysItemDetail .sysShare .sysFacebook {
  position: relative;
  top: 2px;
}
#sysItemDetail .sysShare .sysGoogleplus {
  width: 58px;
}
#sysItemDetail .sysShare .sysLine, #sysItemDetail .sysShare .sysDisplayPcNone {
  display: inline-block !important;
}
#sysItemDetail .sysShare .sysLine {
  position: relative;
  top: 0px;
}
/*.sysReview*/
#sysItemDetail .sysReview {
  margin: 20px 0 40px;
}
/*テーブルデザイン*/
/*商品ページ用おすすめ商品*/
.itempage_recommend .sysItemBlock .sysHorizontal li{
  width:25%;
  padding:0 10px;
}
.itempage_recommend .sysItemName{
  margin-bottom:0;
  /* font-size:14px; */
  text-align:left;
}
.itempage_recommend .sysItemPrice{
  text-align:left;
}
/*商品ページ成分表*/
#sysItemDetail .show_bx{
  margin-bottom:30px;
}
#sysItemDetail .show_bx_inner{
  margin-bottom:10px;
}
#sysItemDetail .contents_tr{
  background-color:#f5f5f5;
}
#sysItemDetail .contents_tr td{
  background-color:#f5f5f5 !important;
}
#sysItemDetail .contents_tr table{
  margin-bottom:0;
}

/***********************************
  カートページ
***********************************/
/*カートページ内レイアウト調整*/
body.sysCart{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: #ededed;
}

.sysCart .header_h1_under,
.sysOpcBody .header_h1_under{
  float:none;
  padding:10px 0;
  width:100%;
  height:auto;
  background-color:#fff;
}
.sysCart .header_h1_under a,
.sysOpcBody .header_h1_under a{
  display:block;
  width:160px;
  margin:0 auto;
}
.sysCart .header_h1_under .logo img,
.sysOpcBody .header_h1_under .logo img{
  float:none;
  margin-right:0;
}
.sysCart .header_h1_under .head_title,
.sysOpcBody .header_h1_under .head_title{
  text-align:center;
}
.sysCart .header_wrap {
    border-bottom:none;
}

.sysCart #sysMain,
.sysOpcBody #sysMain{
  max-width: 1100px;
  padding: 0 150px 3rem;
  margin:0 auto;
}
.sysCart #sysMain, .sysCart #sysMain a {
  color: #000;
}
.sysCart .sysBox, .sysCart .sysSelectPaymentArea,
.sysCart .sysSelectDeliveryArea, .sysCart .sysRemarksArea,
.sysCart .sysSelectOptionArea, .sysCart .sysDetail,
.sysCart .sysOrder .nav,
.sysCart .sysAcceptDomainArea,
.sysCart .sysRepeatOrderSetting {
  background-color: #ffffff;
  border: 1px solid #ccc;
   border-radius: 0;
  box-shadow: none;
  margin: 1em auto 2em;
  padding: 2em;
}
.sysCart .sysBox hr {
  display: block;
  border: 0;
  height: 0;
  border-bottom: 1px solid #cfcfcf;
  margin: 5px 0;
  padding: 0;
}
.sysCart #sysMain input[type="text"],
.sysCart #sysMain input[type="password"],
.sysCart #sysMain input[type="email"],
.sysCart #sysMain input[type="number"],
.sysCart #sysMain input[type="tel"],
.sysCart #sysMain input[type="search"],
.sysCart #sysMain textarea {
  background: none;
   border-radius: 0;
  border: 1px solid #dddddd;
}
.sysCart .sysTotalTxt {
  text-shadow: none;
}
.sysTotal .sysTotalTxt .sysCartAttention {
  font-size: 2rem;
}
.sysCart .sysSubTotalArea {
  margin: 10px 0;
}
.sysCart .sysNextSubmitArea {
  margin-bottom: 20px;
}
.sysCart #sysMain .sysNextSubmitArea .sysNextSubmit {
  width: 100%;
  padding: 15px;
  margin: 1rem auto!important;
  color: #fff;
  font-size: 1rem;
  font-weight: normal;
  text-shadow: none;
  border-radius: 0;
  background: #000 !important;
  border: none;
  height: auto;
}

.sysCart #sysMain .sysNextSubmitArea .sysNextSubmit:hover,
#sysPurchaseAuthMember .sysLoginButton:hover {
  background-color: #9e0e30 !important;
  letter-spacing: 0.3em;
}


.sysCart .sysCartAttention, .sysCart .sysRequired {
  color: #9e0e30;
  font-weight: bolder;
}
.sysCart .sysGetPoint {
  color: #9e0e30;
  font-weight: bolder;
}
.sysCart .sysCartNote {
  color: #000;
  font-size: 90%;
}
.sysCart .sysCartTitle {
  color: #000;
  font-size: large;
  font-weight: bolder;
  background-color: #ededed;
  padding: 0;
  margin-bottom: 2-px;
}
.sysCart .sysCartTitle span {
  font-size: 1.2rem;
}
.sysCart #sysMain input[type="submit"], .sysCart #sysMain button[type="submit"], .sysCart #sysMain button {
  display: inline-block;
  padding: 15px;
  height: auto;
  color: #000;
  background: #fff;
  border-radius: 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  width: 100%;
  line-height: inherit;
}
input.sysAmazonNextSubmit {
  width: 300px !important; 
  height: 55px !important;
  background-color: #000 !important;
  border: none !important;
  border-radius: 0 !important;
  font-size: 14px !important;
  letter-spacing: 0.2em;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s ease !important;
  display: flex;
  align-items: center;
  justify-content: center;
  appearance: none;
  -webkit-appearance: none;
  color: #fff!important;
  padding: 10px!important;
}

/* ホバーで「flo.danceの赤」へ */
.sysAmazonNextSubmit:hover {
  background-color: #9e0e30 !important;
  letter-spacing: 0.3em;
}

.sysCart .sysDeleteArea, .sysCart .sysConfirmButton {
  text-align: right;
}
.sysCart .sysNavImg {
  text-align: center;
         margin-top: 10px;
  margin-bottom: 20px;
}
.sysCart .sysFreeArea {
  color: #000;
  margin: 20px 0;
}
.sysSelectPayment li:last-child,
.sysSelectDelivery li:last-child,
.sysSelectOption li:last-child,
.sysCart .sysDetail li:last-child,
.sysRemarks, .sysCart .sysOrder .nav li:last-child {
  border-bottom: none;
}
.sysCart .sysAcceptDomainArea input {
  padding: 0 10px!important;
}
.sysCart .cart_btn {
  color: #000;
  text-align: center;
  margin-top: 40px;
}
.sysCart .cart_btn p {
  margin: 0;
  padding: 0;
}
.sysCart .cart_btn .btn {
  margin-top: 5px;
}
.sysCart .cart_btn img {
  width: 200px;
  border: 1px solid #d0d0d0;
}
#sysBasket #sysMain {
  padding: 3rem;
}
.sysCart .cart_info .sysContent {
  max-width: 300px;
  color: #000;
  text-align: center;
  font-weight: bolder;
  font-size: 13px;
  border: 1px solid #d0d0d0;
  margin: 1em auto 0 auto;
  padding: 15px;
  background-color: #fff;
}
.sysCart #sysMain .sysConfirmButton input[type="submit"] {
  width: auto;
}
.sysCart #sysMain select {
  display: inline-block;
  border: solid 1px #eee;
}
.sysCart .sysBtnChange {
  margin-bottom: 10px !important;
}
/*登録せずに購入*/
#sysBillingAddress .input-append input[type="text"] {
  display: inline-block;
}
/*都道府県*/
#sysBillingAddress .sysPrefState select {
  width: 200px;
}
/*性別*/
#sysBillingAddress .sysGender {
  margin-bottom: 20px;
}
#sysBillingAddress .sysGender input {
  vertical-align: middle;
}
#sysBillingAddress .sysGender label {
  display: inline-block;
  margin-right: 20px;
}
/*メルマガ*/
#sysBillingAddress .sysAcceptMailmagazine {
  margin-bottom: 20px;
}
/*注文完了ページ*/
.cart_completion {
  text-align: center;
}
#sysThanks .text {
  font-size: 1rem;
}
#sysThanks h2.title {
  margin-top: 2rem;
  padding-bottom: 5px;
  text-align: center;
  border-bottom: 1px solid #000;
}
#sysThanks .sysBox a {
  color: red;
}
#sysThanks .name{
  margin-top: 3rem;
  font-size: 1.2rem;
  font-weight: bold;
  border-top: 1px solid #000;
}
/*ご注文番号*/
#sysThanks #sysMain .sysOrderNumber {
  font-size: 1.5rem;
  font-weight: bold;
}
/*お買い物を続ける*/
body#sysBasket .sysBackButton2 {
  font-weight: bold;
  background: #b4f4ff !important;
  border-color: #000 !important;
}
/* 注文完了 */
.opcConfirm{padding :0 0 1rem;background-color: #ededed;}

/***********************************
  ワンページカート
***********************************/
.mdl_btn_.opcDialog, form.opcUseAmazon{
  width:100%;
  padding-right:0;
}
.sysCart #sysMain h3{
  font-size:20px;
}
.sysCart #sysMain #show-dlg-1,
.sysCart #sysMain #show-dlg-1_low,
.sysCart #sysMain .sysOpcNextSubmit,
.sysCart #sysMain .sysNextSubmit{
  display:block;
  width: 100% !important;
  padding:10px !important;
  margin: 5px 0 !important;
  color: #fff !important;
  font-size:1.2rem;
  line-height:1;
  font-weight: bold;
  text-shadow: none;
  box-shadow: none;
  border:none !important;
  background: #9e0e30 !important;
}
.sysCart #sysMain #show-dlg-2,
.sysCart #sysMain #show-dlg-3{
  display:block;
  width: 100% !important;
  padding: 15px;
  margin:0 0 30px !important;
  color: #fff !important;
  font-size:1.2rem;
  line-height:1;
  text-shadow: none;
  box-shadow: none;
  border:none !important;
  background: #000 !important;
}
.sysCart #sysMain #show-dlg-3{
  color: #fff !important;
  background: #9e0e30 !important;
}
.sysCart #sysMain .next_btn{
  color: #fff !important;
  font-size:1rem;
  line-height:1;
  border:none !important;
  background: #000 !important;
}
.sysCart #sysMain #order_price_confirm_btn{
  color: #fff !important;
  width: 100% !important;
  box-shadow: none;
  background: #000 !important;
}
.sysCart #sysMain .mdl-js-button{
  box-shadow: none;
}
.sysCart #sysMain #change-to-billAddr,
.sysCart #sysMain #show-dlg-addrList,
.sysCart #sysMain #show-dlg-inputAddr{
  line-height:1;
  border:none !important;
  background: #000 !important;
}
.sysCart #sysMain p.user_type{
  font-size:1.2rem;
}
.sysOpcProduct .sysOpcItemName{
  font-size:1.2rem;
}

/*情報入力ページ調整*/
.sysOpcBody div#sysMain {
  padding: 3em 200px 0;
  margin-bottom: 60px;
}
input[type="button"],
select {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -webkit-appearance: none;
}
select {
  padding: 0 .5em;
}
.sysOpcBody img {
  max-width: 100%;
}
.opcCommonInputText,
.opcCommonInputSelect,
.opcCommonInputRadio,
.opcCommonInputCheckbox {
  margin-left: 0 !important;
  border-radius: 0;
}
.opcCommonEditModeBlock {
  background: #fff !important;
  padding: 20px;
  border: 1px solid #ccc;
}
.opcOrderSummaryTitle,
.opcBillingAddressTitle,
.opcDeliveryAddressTitle,
.opcItemTitle,
.opcPaymentMethodTitle {
  font-size: large !important;
  margin-bottom: 0.5em;
}
.opcItem{
    padding: 3%;
    border: 1px solid #9b9b9b;
    margin-top: 10px
}
.opcCommonInputSelect,
.opcCommonButton {
  background: #fff !important;
}
.opcCommonInputSelect {
  background: #fff !important;
}
.opcBillingAddress_completeButton_edit,
.opcDeliveryMethod_completeButton_edit,
.opcPaymentMethod_completeButton_edit,
.opcItem_completeButton_edit,
.opcDeliveryAddress_completeButton_edit,
.opcPointAndCouponDialog_applyButton_edit,
.opcRemarks_completeButton_edit {
  background: #000 !important;
  border: 1px solid #000 !important;
  color: #fff !important;
  font-weight: bold;
}
.opcBillingAddress_completeButton_edit:hover,
.opcDeliveryMethod_completeButton_edit:hover,
.opcPaymentMethod_completeButton_edit:hover,
.opcItem_completeButton_edit:hover,
.opcDeliveryAddress_completeButton_edit:hover,
.opcPointAndCouponDialog_applyButton_edit:hover,
.opcRemarks_completeButton_edit:hover{background-color: #9e0e30 !important;
    letter-spacing: 0.3em;}


.opcConfirm_inputStatus {
  display: block !important;
  width: 700px !important;
  margin: 0 auto 1em;
  background: #9e0e30 !important;
  color: #fff !important;
  border: 1px solid #9e0e30 !important;
  font-weight: bold;
}
.opcConfirm_inputStatus_disable {
  display: block !important;
  width: 700px !important;
  margin: 0 auto 1em;
  background: #ccc !important;
  color: #000 !important;
}
.opcConfirm_order {
  display: block !important;
  width: 700px !important;
  margin: 0 auto;
  background: #9e0e30 !important;
  color: #fff !important;
  border: 1px solid #9e0e30 !important;
  font-weight: bold;
}
.opcConfirm_order_disable {
  display: block !important;
  width: 700px !important;
  margin: 0 auto;
  background: #ccc !important;
  color: #000 !important;
}
.opcItem_increaseNumButton_edit,
.opcItem_decreaseNumButton_edit {
  width: 30px !important;
  background: #f1f1f1 !important;
}
.opcCommonButtonGroup {
  margin-top: 1em;
}
.opcBillingAddress_genderMaleAndLabelGroup_edit,
.opcBillingAddress_genderFemaleAndLabelGroup_edit {
  width: 15% !important;
}
.opcBillingAddress_acceptMailmagazineYesLabel_edit {
  margin-top: 1em;
  display: inline-block;
}
.opcOrderSummary_totalPriceAndLabelGroup {
  padding-bottom: 10px !important;
}
.opcCommonEditLabel {
  margin-top: 1em;
  border-left: 0px;
}
.opcOrderSummary_priceBreakDownGroup {
  padding-top: 1em;
  padding-bottom: 1em;
}
.opcOrderSummary_feeAndLabelGroup,
.opcOrderSummary_usePointPriceAndLabelGroup {
  padding-bottom: 1em;
  margin-bottom: 1em;
}
.opcBillingAddress_prefState_edit {
  margin: 5px 0;
}
.opcBillingAddressButtonGroup_edit,
.opcDeliveryAddress_buttonGroup,
.opcDeliveryMethod_buttonGroup_edit {
  padding: 1em 0;
}
.opcDeliveryMethod_hopeDeliveryDateAndLabelGroup_edit,
.opcDeliveryMethod_hopeDeliveryTimeAndLabelGroup_edit {
  margin-bottom: 1em;
}
.opcItem_itemSubTotalPriceAndLabelGroup {
  padding-bottom: 1em;
  margin-bottom: 1em;
}
.opcDeliveryAddressAndDeliveryMethodGroup,
.opcItemList {
  margin-bottom: 0 !important;
  border: none !important;
  padding: 0 !important;
  position: static !important;
}
.opcBillingAddress .opcCommonReferenceLabel {
  width: 80px;
  display: inline-block;
  position: relative;
}
.opcBillingAddress .opcCommonReferenceLabel::after {
  position: absolute;
  right: 0;
}
.opcDeliveryMethod .opcCommonReferenceLabel {
  width: 150px;
  display: inline-block;
  position: relative;
}
.opcDeliveryMethod .opcCommonReferenceLabel::after {
  position: absolute;
  right: 0;
}
.opcCommonRequireLabel {
  color: #9e0e30 !important;
  font-weight: bold;
}
.opcRemarks_remark_edit {
  width: 100% !important;
}
.opcDeliveryAddressEditDialog_directChangeButtonAndLabelGroup {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 2em;
}
.opcDeliveryAddressEditDialog_directChangeLabel {
  width: 100%;
}
.opcItem_itemName {
  font-weight: bold;
  font-size: 15px;
}
.opcConfirm_headerErrorMessage {
  width: 100% !important;
  max-width: 800px;
}
.opcRemarks_remark,
.opcRemarks_cartOption {
    margin-left: 0 !important;
    width: 100% !important; ;
    white-space: normal !important; ;
}
#sysOpc > form + div {
  margin-bottom: 60px !important;
}
.opcDeliveryMethod_normalShippingDetailAndLabelGroup_edit {
  padding-left: 0 !important;
  margin-left: 0 !important;
  border-bottom: none !important;
}
.opcDeliveryAddress {
  border-bottom: 1px solid #9b9b9b;
  margin-bottom: 1em;
}
.opcDeliveryMethod_hopeDeliveryDateLabel_edit {
  width: 126px;
  display: inline-block;
}
.opcCommonButtonEdit, .opcCommonButton {
  width: 100%!important;
  border-radius: 0;
  font-weight: normal;
  margin: 10px 0;
  padding: 1rem;
}
input.opcItem_increaseNumButton_edit.opcCommonButton, input.opcItem_decreaseNumButton_edit.opcCommonButton  {
  display: none;
}

.opcPaymentMethod_amazonPayGroup_edit {
  margin-bottom: 1.5rem;
}
.opcPaymentMethod_fee_edit {
  display: none;
}

.opcRemarks_edit .opcCommonEditLabel {
  font-size: 1.3rem;
  text-align: center;
  padding: 0.5rem;
  border-bottom: 1px solid #000;
  margin-bottom: 1rem;
}
#sysThanks #sysMain {
  border: none;
}
#sysThanks .sysNavImg {
  display: none;
}
#sysThanks.sysCart .sysBox:nth-of-type(2) div:nth-of-type(1),
#sysThanks.sysCart .sysBox:nth-of-type(2) div:nth-of-type(2) {
  margin-bottom: 1em;
}


/***********************************
  お問い合わせ
***********************************/
#sysFormConfirm .sysNextSubmit{
  width:100%;
  margin:20px 0 0 !important;
}
#sysFormConfirm button.sysButton{
  width:30%;
  margin-bottom:20px;
}

/***********************************
  新規会員登録
***********************************/
#sysMemberRegisterIndex form{
  padding: 0!important;
}

/***********************************
  マイページ
***********************************/
.sysMypageNav > form {
    display: inline-block;
    width: 49%;
    vertical-align: top;
}
.sysMypageNav .sysButton {
    width: 100%;
    display: block;
    font-size: 15px;
  margin: 5px 0;
  padding:15px 0;
}
#sysMemberRegisterIndex .sysNextSubmit{
  width: 49%;
  float: left;
  margin-right: 1%;
}
#sysMemberRegisterIndex .sysButton[type="submit"]{
  width: 49%;
  float: left;
  margin-right: 1%;
  margin-top: 10px;
}

/***********************************
  ヘッダー
***********************************/
#sysHeader{
  /*position: fixed;
  height: 120px;
  top: 0; left: 0; right: 0;
  margin: auto;
  background: rgba(255, 255, 255, 0.8);*/
  z-index: 120;
}


#sysItemSearch h2{font-size: 16px; text-align: center;}
/***********************************
  検索ページ フォーム
***********************************/
.sysItemSearchFormInput {
    background: #f9f9f9;
    padding: 30px;
    border-radius: 8px;
    max-width: 1000px;
    margin: 40px auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 3列レイアウト */
    gap: 20px;
    align-items: end;
}

/* キーワード入力（1列目・2列分使う） */
.sysItemSearchFormWord {
    grid-column: span 2;
}
.sysItemSearchFormWord input[type="search"] {
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
}

/* AND/ORラジオボタン */
.sysItemSearchAndOr {
    font-size: 13px;
    color: #666;
    display: flex;
    gap: 15px;
    padding-bottom: 12px;
}

/* 価格範囲 */
.sysItemSearchFormRange {
    font-size: 13px;
    color: #666;
}
.sysItemSearchFormRange input {
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    margin: 0 5px;
}

/* セレクトボックス共通（カテゴリ、ソート、件数） */
.sysItemSearchFormCategory, 
.sysItemSearchFormSort, 
.sysItemSearchFormLimit {
    font-size: 13px;
    color: #666;
}

.sysItemSearchFormCategory{display: none;}

.sysItemSearchFormInput select {
    width: 100%;
    padding: 0  10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fff;
    margin-top: 5px;
}

/* 検索ボタン */
.sysSearchButton {
    grid-column: span 3; /* ボタンは下部で横いっぱいに */
    background: #333;
    color: #fff;
    border: none;
    padding: 15px;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 0.1em;
    cursor: pointer;
    transition: 0.3s;
    border-radius: 4px;
    margin-top: 10px;
}

.sysSearchButton:hover {
    background: #a38a5e;
}

/* スマホ対応 */
@media screen and (max-width: 768px) {
    .sysItemSearchFormInput {
        grid-template-columns: 1fr; /* 1列に */
        padding: 20px;
    }
    .sysItemSearchFormWord, 
    .sysSearchButton {
        grid-column: span 1;
    }
    .sysItemSearchAndOr {
        order: 2; /* 順序の調整 */
    }
}

/* ================================================= 
   検索ボックス
   ================================================== */
.top_serch {display: flex !important;justify-content: flex-end !important;align-items: center !important;margin: 0;}
.sysItemSearchForm {display: flex !important;align-items: center !important;}
.top_serch .sysItemSearchFormWord {width: 0 !important;opacity: 0 !important;overflow: hidden !important;padding: 0 !important;transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
.top_serch .sysItemSearchFormWord input[type="search"],
.top_serch .sysItemSearchFormWord input[type="text"] {width: 0 !important;padding: 0 !important;border: none !important;background: transparent !important;outline: none;}
.open-search-icon {cursor: pointer;padding: 5px 0;display: flex !important;align-items: center;color: #333;}
/* -------------------------------------------
 チェック時（アイコンクリック後）の挙動
------------------------------------------- */
/* A. 入力欄を広げる */
#search-trigger:checked ~ .sysItemSearchForm .sysItemSearchFormWord {width: 200px !important; /* 広がる幅 */opacity: 1 !important;padding: 0 5px !important;}
#search-trigger:checked ~ .sysItemSearchForm .sysItemSearchFormWord input {width: 100% !important;padding: 4px 6px !important;border-bottom: 1px solid #333 !important;background: #fff !important;}
#search-trigger:checked ~ .sysItemSearchForm .open-search-icon {display: none !important;}

#search-trigger:checked ~ .sysItemSearchForm .sysSearchButton {
display: block !important;
background-color: transparent !important;
background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>') !important;
background-repeat: no-repeat !important;
background-position: center !important;
border: none !important;
width: 35px !important;
height: 35px !important;
text-indent: -9999px;
cursor: pointer;
}

/* =================================================
   スマホ用：検索窓をアイコン直下に展開 ＆ ✕ボタン切り替え
   ================================================= */
@media screen and (max-width: 768px) {
  .top_serch {position: relative !important;overflow: visible !important;}
  #search-trigger:checked ~ .sysItemSearchForm .sysItemSearchFormWord {
position: absolute !important;
    top: 50px;
    right: -80px;
    width: 85vw !important;
    max-width: 300px;
    background: #fff !important;
    padding: 10px !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
    z-index: 10001 !important;
    display: flex !important;
    opacity: 1 !important;
    border-radius: 4px;
  }

  #search-trigger:checked ~ .sysItemSearchForm .sysItemSearchFormWord input {
    font-size: 16px !important;
    border: 1px solid #ddd !important;
    padding: 8px 10px !important;
    width: 100% !important;
    height: 40px !important;
    background: #fff !important;
  }
  #search-trigger:checked ~ .sysItemSearchForm .open-search-icon {
    display: flex !important;
    position: relative;
    z-index: 10002;
  }
  #search-trigger:checked ~ .sysItemSearchForm .open-search-icon svg {
    opacity: 0 !important;
  }
  #search-trigger:checked ~ .sysItemSearchForm .open-search-icon::before {
    content: "✕" !important;
    position: absolute;
    left: 50%; top: 50%;
    transform: translate(-50%, -50%);
    font-size: 22px !important;
    color: #111 !important;
    font-family: Arial, sans-serif;
  }
  #search-trigger:checked ~ .sysItemSearchForm .sysSearchButton {
    display: block !important;
    position: absolute !important;
    top: 62px;
    right: -75px;
    z-index: 10003 !important;
    background-color: transparent !important;
  }
}
/* =================================================
   PC用：展開時に✕ボタン（閉じるスイッチ）を出す
   ================================================= */
@media screen and (min-width: 769px) {
  #search-trigger:checked ~ .sysItemSearchForm .open-search-icon {
    display: flex !important;
    order: 2;
    position: relative;
    margin-left: 5px;
  }
  .search-btns-unit{display: flex;}
  #search-trigger:checked ~ .sysItemSearchForm .open-search-icon svg {
    opacity: 0 !important;
    width: 20px;
  }

  #search-trigger:checked ~ .sysItemSearchForm .open-search-icon::before {
    content: "✕" !important;
    position: absolute;
    left: 50%; top: 50%;
    transform: translate(-50%, -50%);
    font-size: 18px !important;
    color: #666;
    transition: color 0.3s;
  }
  
  #search-trigger:checked ~ .sysItemSearchForm .open-search-icon:hover::before {
    color: #000;
  }

  #search-trigger:checked ~ .sysItemSearchForm .sysSearchButton {
    order: 1; 
  }
}

/* --- トップに戻るボタン --- */
.pagetop #page-top {
  position: fixed !important;
  right: 20px;
  bottom: 60px;
  z-index: 9999;
  display: flex !important;
  color: #fff;
  background: #222;
  width: 40px;
  height: 40px;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s, transform 0.3s;
  transform: translateY(20px);
}

.pagetop #page-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}


/***********************************
  サイド
***********************************/
/*検索ボックス*//*
.side_search{margin-bottom: 30px;}
.side_search form{border:none;}
.side_search input[type="search"]{
  height: 40px;
  border: 1px solid #ddd;
  margin-bottom: 5px;
}
.side_search .sysItemSearchFormWord {
  float:none;
  width:100%;
  margin-bottom:5px;
}
.side_search .sysSearchButton{
  float:none;
  width: 100% !important;
  height: 40px;
  border-radius:5px;
  background: #000 url(/img/common/ico_search.png) no-repeat center center;
  background-size: 70px;
  text-indent: -999px;
}

.side_navi .sysHeadline,
.side_navi_item .sysHeadline{
  margin:0 !important;
  text-align:left;
  font-weight:bold;
  letter-spacing:2px;
  width:auto;
  border-bottom:1px solid #222222;
}
.side_navi .sysHeadline:before,
.side_navi_item .sysHeadline:before{
  content:none;
}
.side_navi a{
  position:relative;
  padding:7px 5px 7px 20px !important;
  letter-spacing:1px;
  border-bottom:1px dotted #cdcdcd !important;
}
.side_navi a:after{
  position:absolute;
  top:7px;
  right:10px;
  content:">";
}
.side_navi a:hover{
  background: #eee;
}
.side_navi{
  margin-bottom:30px;
}*/
/*商品別*//*
.side_navi_item{
  margin-bottom:0;
  border-bottom:1px solid #000;
}
.side_navi_item .sysHeadline,
.side_navi_item .sysContent{
  width:90% !important;
  margin-left:auto !important;
}
.side_navi_item a{
  position:relative;
  padding:7px 5px !important;
  letter-spacing:1px;
  border-bottom:1px dotted #cdcdcd !important;
}
.side_navi_item a:after{
  position:absolute;
  top:7px;
  right:10px;
  content:">";
}
.side_navi_item li:last-child a{
  border-bottom:none !important;
}
.side_navi_item .sysHeadline{
  font-size: 13px;
  padding:0;
  border-bottom:1px dotted #cdcdcd !important;
}
.side_navi_item .sysHeadline a{
  display:block;
  border-bottom:none !important;
}*/
/*お買い物ガイド 最後2つ*//*
.side_navi_guide li:nth-last-child(1),
.side_navi_guide li:nth-last-child(2){
  font-weight:bold;
  border-bottom:1px solid #222222;
  margin-bottom:10px;
}
.side_navi_guide li:nth-last-child(1) a,
.side_navi_guide li:nth-last-child(2) a{
  padding:7px 5px !important;
  border:none !important;
}
.side_navi_guide li:nth-last-child(1) a:hover,
.side_navi_guide li:nth-last-child(2) a:hover{
  background-color:#fff;
}
.side_navi_guide li:nth-last-child(3){
  margin-bottom:10px;
}
*/
/***********************************
  共通パーツ
***********************************/
hr.style01 {
  width: 100%;
  height: 1px;
  background: #222222;
  margin: 50px auto;
  padding: 0;
  border: 0;
}

/*.sysHeadline h2, 
.sysHeadline*/ .sysTitle {
  font-family: "Cinzel", serif, "Yu Mincho", serif;
  font-size: 16px !important;
  font-weight: 300 !important;
  letter-spacing: 0.5em !important;
  color: #333;
  line-height: 2.2 !important;
  position: relative;
  z-index: 2;
  background: #fff;
  display: inline-block;
  padding: 0 30px;
}

.sysTitle::before {
  position: absolute;
  top: 50%;
  left: 0;
  z-index: 1;
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background-color: #dedede !important; /* 黒(#222)から淡いグレーへ変更 */
  transform: translateY(-50%);
}

.sysTitle b{
  display: block;
  text-align: center;
}
.sysTitle span{
  position: relative;
  z-index: 2;
  display: inline-block;
  margin: 0 2.5em;
  padding: 0 30px;
  text-align: center;
}

.contentsWrap{
  width: 1100px;
  margin: 0 auto;
}


/* =================================================
   サイト共通タイトル
   ================================================= */
.sysHeadline {
  text-align: left !important;
  max-width: 1200px;
  margin: 100px auto 60px !important;
  padding: 0 0 0 80px !important;
  border: none !important;  
  background: none !important;
}


.sysHeadline span {
  display: block;
  font-family: 'Cinzel', serif !important;
  font-size: 20px !important;
  letter-spacing: 0.35em !important;
  color: #111 !important;
  text-transform: uppercase;
  font-weight: 500 !important;
  line-height: 1.2;
}


.sysHeadline span b {
  display: block;
  font-weight: normal !important;
  font-size: 12px !important;
  color: #555 !important;
  letter-spacing: 0.25em !important;
  margin-top: 10px !important; 
  text-transform: uppercase; 
}


@media screen and (max-width: 768px) {
  .sysHeadline {
    margin: 60px auto 40px !important;
    padding: 0 15px !important;
  }
  .sysHeadline span {
    font-size: 16px !important;
    letter-spacing: 0.25em !important;
  }
  .sysHeadline span b {
    font-size: 9px !important;
    margin-top: 8px !important;
  }
}

/***********************************
  特商法テーブルレイアウト
***********************************/
#main_tradelaw, .main_tradelaw {
    border: 1px solid #ddd;
    margin: 0 auto 30px;
    max-width: 1100px;
}
#main_tradelaw dl, .main_tradelaw dl{
  background: #ededed;
  border-bottom: 1px dotted #bfbfbf;
  overflow: hidden;
}
#main_tradelaw dl:last-child, .main_tradelaw dl:last-child{border: 0px;}
#main_tradelaw dt, .main_tradelaw dt{
  padding: 15px 0 15px 20px;
  float: left;
  clear: both;
  font-weight: bolder;
}
#main_tradelaw dd, .main_tradelaw dd{
  margin-left: 200px;
  padding: 15px;
  background: #fff;
}
.shipFee{
  max-width: 1100px;
  margin: 20px auto
}
.shipFee .tableTitle{
  height: 70px;
  padding: 10px;
  color: #424242;
  margin: 50px 0 0px;
  border: 0px !important;
  text-align: leftr;
}
table.shipFeeTable {
  border-collapse: collapse;
  margin-bottom: 30px;
  line-height: 1.5;
  text-align: center;
}
table.shipFeeTable .eyeCatch{
  width: 120px;
  display: block;
  margin: 5px auto;
  height: 25px;
  line-height: 25px;
  color: #000;
  border-bottom: 1px solid #aaa;
  padding-bottom: 5px;
}
table.shipFeeTable thead {
  background: #555;
  text-align: center;
}
.spThead{display: none;}
table.shipFeeTable thead th {
  padding: 10px;
  vertical-align: top;
  font-weight: normal;
  color: #fff;
}
table.shipFeeTable tbody .sum{position: relative;}
table.shipFeeTable tbody .sum i{
  position: absolute;
  color: #888;
  font-size: 35px;
  right: -15px;
  bottom: 30px;
  z-index: 20;
}
table.shipFeeTable tbody th {
  width: 600px;
  padding: 10px;
  vertical-align: top;
  background: #fff;
  font-weight: normal;
  border-bottom: 1px solid #ddd;
  border-left: 1px solid #ddd;
  border-right: 1px solid #ddd;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
table.shipFeeTable td {
  width: 500px;
  padding: 10px;
  vertical-align: top;
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: #eee;
}
table.shipFeeTable b{
  color: #D42E30;
  display: inline-block;
  padding: 0 3px;
  font-size: 1.2em;
}
div#main_tradelaw a{
  display: inline-block;
  color: #068acc;
  text-decoration: underline;
}

/***********************************
   お買い物ガイド
***********************************/
.indexList {
    background: #fdfaf5;
    padding: 25px;
    border-radius: 12px;
    margin-bottom: 40px;
}
.indexList ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 10px;
}
.indexList li a {
    display: block;
    background: #fff;
    padding: 12px 15px;
    border: 1px solid #eee;
    color: #333;
    text-decoration: none;
    font-size: 13px;
    border-radius: 6px;
    transition: 0.2s;
}
.indexList li a::before {
    content: "▶";
    font-size: 10px;
    margin-right: 8px;
    color: #a38a5e;
}
.indexList li a:hover {
    background: #f3ede2;
    border-color: #a38a5e;
    transform: translateY(-2px);
}
.guideBlock{padding-top: 30px;}

.steps ul{
  width: 700px;
  margin: 0 auto;
}
.steps ul:after{
  display: block;
  content: "";
  clear: both;
}
.steps li{
  float: left;
  padding: 0 6px;
  height: 200px;
}
.steps li a{
  display: block;
  height: 200px !important;
}
.steps li img{height: 200px;}
.credit { display: flex;}
.credit img {
  width: 60px;
  margin-right: 5px;
}

/***********************************
   ボタンデザイン
***********************************/
.common_btn{
  width: 300px;
  margin:0 auto 50px;
  position: relative;
}
.common_btn a{
  display: block;
  padding:15px 0;
  color: #fff;
  text-align:center;
  background: #9E0E30;
}
.common_btn a:hover{ opacity: 0.8;}
.common_btn a i{
  display:inline-block;
  margin-left:10px;
  font-size:20px;
}

/***********************************
  TOPページ
***********************************/
.column2_flex {
  display: flex;
}
.col2_item {
  width: 50%;
  margin: 1rem;
}

.top_newarrival, .topfeatures, .member, .top_recommend_item, .top_ranking_item, .contents, .voice, .info {
  background: #ededed;
  padding: 10rem 0 10px;margin-bottom:0;
}
.sysContent{
  margin: 0 auto;
}

/*新着アイテム*/
.top_newarrival{margin-bottom:30px;}
.top_newarrival ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap:35px;
}
.top_newarrival li {
  float: none!important;
  margin: 0rem;
  width: 20%!important;
}

.top_newarrival img{aspect-ratio: 3 / 4;object-fit: cover;object-position: center;}

@media screen and (max-width:600px){
  .top_newarrival ul{
    flex-wrap: nowrap !important;
    justify-content: flex-start;
    overflow-x: auto; 
    -webkit-overflow-scrolling: touch;
    gap: 15px;
    padding: 0 20px 15px;
    margin-bottom: 0;
    scroll-snap-type: x mandatory;
  }
  .top_newarrival li{width: 75% !important;
    flex: 0 0 auto;
    scroll-snap-align: center;
    }
  .top_newarrival ul::-webkit-scrollbar {
    display: none;
  }
}


span.sysSubtotalPrice {
  font-size: 17px;
  float: right;
}

div#kuronekoPayFlex {
  margin-right: 21px;
}
.sysCart #sysMain #kuronekoPayFlex button img {
    margin-top: -11px;
}
.sysCart #sysMain button#kmid-login-subwindow-launch,
.sysCart #sysMain button[onclick="Sys('#kmid-login-subwindow-launch').click()"]
 {
  padding: 10px 0px 0px 0px;
}
.sysConfirmButton input#open_dlg_edit_customer_info {
  display: inline-block;
  padding: 15px;
  width: auto;
  height: auto;
  color: #000;
  background: #fff;
  border-radius: none;
  border: 1px solid #999;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

/***********************************
  ご利用規約、会社概要、プライバシー、酒類
***********************************/
.terms, .p-corporate, .p-privacy, .license {
  padding: 5rem;
  background: #fff;
}
.terms .sysHeadline, .p-corporate .sysHeadline, .p-privacy .sysHeadline, .license .sysHeadline{
  padding: 3rem 0;
}
.terms h4, .p-privacy h4 {
  text-align: center;
}
.terms p, .p-privacy p {
  margin: 0.5rem 0 2rem;
}
.rule li, .license li {
  list-style: decimal;
  margin: 0 0 0 1rem;
}
.terms .block1, .p-corporate .block1, .p-privacy .block1, .license .block1{
  padding-bottom: 5rem;
}
/*table*/
.form_table {
  margin: 15px auto 20px auto;
  width: 90%;
  max-width: 1000px;
  border-top:1px solid #666;
  border-left:1px solid #666;
  border-collapse: collapse;
  text-align: left;
}
.form_table th {
  padding: 8px;
  border-right: 1px solid #666;
  border-bottom: 1px solid #666;
  color: #000;
  background-color: #eee;
  font-weight: normal;
  font-size: 80%;
}
.form_table td {
  padding: 8px;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  word-break: break-all;
  font-size: 80%;
  background:#fff;
  color: #000;
}
.form_table td a{ color: red;}
.license a{
  display: block;
  text-align: center;
  color: red;
}
/***********************************
  ご利用ガイド
***********************************/
#shopping-guide h2.title{
  font-size: 1.2rem;
  text-align: center;
  margin: 10rem auto 1rem;
  border-bottom: 1px dotted #333;
  padding-bottom: 5px;
  max-width: 600px;
}
#shopping-guide h3{font-size: 1.1rem;}
#shopping-guide #sysMain .link{color: #ea1749;}
#shopping-guide #sysMain .link:hover{opacity: 0.8;}
.flow_flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.flow_flex .block1 {
  width: 45%;
  margin: 1rem;
}
.block2{ margin: 1rem;}
#payment_navi h3 {
  margin: 0 0 0.5rem;
}
#payment_navi .mt {
  margin-top: 3rem;
}
img.amapay {
  width: 150px;
  margin: 1rem 1rem 0 0;
}
#delivery img {
  margin: 1rem 1rem 0.5rem 0;
}
#delivery h3, #tatefuda h3, #member h3, #biz h3{
  margin: 2rem 0 0.5rem;
}
#delivery h4 {
  border-top: 1px solid #a5a5a5;
  margin-top: 2rem;
  padding: 5px;
}
.deli {margin: 2rem 0;border-top: 1px solid #666;border-left: 1px solid #666;text-align: left;}
.deli th {
  width: 10%;
  padding: 8px;
  border-right: 1px solid #666;
  border-bottom: 1px solid #666;
  color: #fff;
  background: #000;
  font-size: 0.9rem;
}
.deli td {
  padding: 8px;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  word-break: break-all;
  font-size: 0.9rem;
}
#tatefuda img {
  display: block;
  margin: 0 auto;
}
#mail_service img, #member img, #biz img {
  display: block;
  margin: 0 auto;
}
#mail_service p {
  margin-bottom: 3rem;
}
#member .list {
  margin: 1em auto 3em;
}
#member .list li {
  list-style: disc;
  margin-left: 1.5rem;
  margin-bottom: 1rem;
}
.guidimg_bg { 
  background: #9e0e30;
  border-radius: 30px;
}
/*error message*/
.sysErrorMessage{
  padding: 0.3em 5px;
}


/***********************************
  スタッフ紹介
***********************************/
#staff #sysWrap{
  background: #000;
  color: #fff;
}
.block_max{ display: flex;}
.block1200{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.block_pl{
  width: 25%;
  margin: 2% 4% 10%;
}
.staff_in{
  background: #e0e0e0;
  width: 70%;
  margin: -40px auto 0;
  position: relative;
  text-align: center;
}
.staffin_h{
  color: #000000;
  margin: 0 auto;
  border-bottom: solid #000 1px;
  max-width: 100%;
}
.staff_pl{
width:100%;
}
.spimg{display: none;}
.staff_text{
  color:#000000;
}
.staff_text, .staff_text_b{ margin: 0;}
.staff_titlea{
  font-family: "Cinzel", serif;
font-weight: 100!important;
letter-spacing: 0.03em;
  font-size: 250%;
  margin: 0 10%;
  width: 30%;
}
.staff_titleb{ margin: 2% 0px 0 0px;}
.team_text{
  display: block;
  position:absolute;
  max-width: 800px;
  margin: 60px 10% 0px;
  text-align: -webkit-center;
  text-align: left;
  font-size: 90%;
  width: 80%;
}
.team_text p{color: #ababab;}
.staff_text_b{
  color:#000;
  font-size:70%;
}
.st_top{
  max-width: 1200px;
  overflow: auto;
  margin: 5% auto;
  display: flex;
}
.team_img{
  width: 69%;
  margin-left: auto;
}
.team_img img{width:100%;}
.atitle_2{
  text-align: center;
  font-size: 120%;
  margin: 110px 0px 100px 0px;
  max-width: 100%;
}
#staff .footer_menu{ margin: 0;}

/***********************************
  お客様の声（ページ）
***********************************/
/* --- 全体背景との親和性 --- */
#voice .text {
    margin: 4rem auto 6rem;
    max-width: 800px;
    text-align: center;
    line-height: 2;
    font-size: 15px;
    color: #333; /* 文字をはっきりと */
    padding: 0 20px;
}

/* --- お客様の声 外枠 --- */
.voicepage_flex {
    display: flex;
    align-items: stretch; /* 画像とコメントの高さを揃える */
    background: #fff;     /* 背景がグレーなので、カードを白にして際立たせる */
    margin: 0 auto 4rem;
    max-width: 900px;
    /* 強い影はやめ、ごく薄い境界線で1pxの美学を継承 */
    border: 1px solid #d1d1d1; 
    box-shadow: none;      /* 以前の強い黒影をリセット */
}

/* 偶数番目の左右反転（リズムを作る） */
.voicepage_flex:nth-child(even) {
    flex-direction: row-reverse;
}

/* --- 画像エリア --- */
.voicepage_image {
    width: 40%;
    margin: 0;
    overflow: hidden;
    background: #f9f9f9; /* 画像がない場合のプレースホルダー色 */
    border-right: 1px solid #d1d1d1; /* 枠線で区切る */
}

/* 反転時のボーダー位置調整 */
.voicepage_flex:nth-child(even) .voicepage_image {
    border-right: none;
    border-left: 1px solid #d1d1d1;
}

.voicepage_image img {
    width: 100%;
    height: 100%;       /* 枠いっぱいに広げる */
    aspect-ratio: 3 / 4;
    object-fit: cover;
    display: block;
    filter: grayscale(10%); /* ほんの少し彩度を落とすと背景グレーと馴染みます */
    transition: filter 0.3s ease;
}

.voicepage_flex:hover .voicepage_image img {
    filter: grayscale(0%); /* ホバーで鮮やかに */
}

/* --- コメントエリア --- */
.voice_comment {
    width: 60%;
    padding: 4rem 3rem; /* PCではかなり贅沢に余白を取る */
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.voice_comment p {
    margin: 0;
    font-size: 14px;
    line-height: 2; /* 行間を広げて「手紙」のような印象に */
    color: #444;
}

/* --- スマホ対応 --- */
@media screen and (max-width: 768px) {
    .voicepage_flex, 
    .voicepage_flex:nth-child(even) {
        flex-direction: column;
        margin: 0 15px 3rem;
    }

    .voicepage_image, 
    .voice_comment {
        width: 100%;
        border: none !important;
    }

    .voicepage_image {
        border-bottom: 1px solid #d1d1d1 !important;
    }

    .voice_comment {
        padding: 2.5rem 1.5rem;
    }
}
/***********************************
  カテゴリ一覧
***********************************/
/*
#sysItemCategory .sysItemName, #sysItemCategory .sysRetailPrice{
  text-align: center;
}
#sysItemCategory .sysItemName{ 
  padding-top: 10px;
}
#sysItemCategory input.sysCartButton.sysCartInButton{
  margin-top: 10px;
}
#sysItemCategory .sysItemListDisp{
  margin-top: 2rem;
padding: 0 0 0 25px;
}
.sysItemCategoryForm {
  padding-top: 1rem;
}
#sysItemCategory .sysThumbnail, #sysItemSearch .sysThumbnail{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin:0 auto;
  width: 100%;
  padding: 0 50px;
}
#sysItemCategory .sysThumbnail li, #sysItemSearch .sysThumbnail li{
  float: none!important;
  margin: 3rem auto;
  width: 25%!important;
  padding: 1px !important;
}
.sysThumbnailImage{overflow: hidden;}
.sysThumbnail .sysThumbnailImage:hover img {
    transform: scale(1.03);
}

.sysItemList ul.sysThumbnail li img {
    aspect-ratio: 3/4;
    object-fit: cover;
    object-position: center;
    width: 100%;
    display: block;
    transition: opacity 0.4s ease, filter 0.3s ease;
    background-color: inherit;
}

@media screen and (max-width: 768px) {
    #sysItemCategory .sysThumbnail li, 
    #sysItemSearch .sysThumbnail li,
    .sysItemList ul.sysThumbnail li {
        width: 50% !important;
        margin-bottom: 1.5rem;
    }
}*/

/* ============================================================
   flo.dance 商品一覧・検索結果
   ============================================================ */
/* 1. 全体コンテナ */
#sysItemSearch .sysItemListDisp,
#sysItemCategory .sysItemListDisp {
    margin: 2rem auto;
    padding: 0 20px;
}

/* 2. 商品リスト（親要素） */
#sysItemCategory .sysThumbnail, 
#sysItemSearch .sysThumbnail {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 2px;
    padding: 0 20px;
    margin: 0 auto;
    width: 100%;
    list-style: none;
    box-sizing: border-box;
    align-items: start; 
}

/* 3. 各アイテム（li） */
#sysItemCategory .sysThumbnail li, 
#sysItemSearch .sysThumbnail li {
    width: 100% !important; 
    float: none !important;
    margin: 0 0 3rem 0 !important;
    padding: 0 !important;
    min-width: 0;
}

/* 4. 画像エリア（枠）3:4固定 */
.sysThumbnailImage {
    display: block !important;
    width: 100% !important;
    aspect-ratio: 3 / 4 !important;
    overflow: hidden !important;
    background-color: #fff;
    position: relative;
}

/* 5. 画像本体 */
.sysItemList ul.sysThumbnail li img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center !important;
    transition: opacity 0.3s ease, transform 0.3s ease;
}

/* 6. ホバー設定 */
.sysThumbnail .sysThumbnailImage:hover img {
    opacity: 0.9;
    transform: scale(1.01);
}

/* 7. 商品情報 */
#sysItemCategory .sysItemName, 
#sysItemCategory .sysRetailPrice {
    text-align: left;
    font-size: 13px;
    color: #333;
    display: block;
    width: 100%;
    box-sizing: border-box;
    word-break: break-all !important;
    overflow-wrap: break-word !important;
}

/* ============================================================
   レスポンシブ（スマホ対応）
   ============================================================ */
@media screen and (max-width: 768px) {
    #sysItemCategory .sysThumbnail, 
    #sysItemSearch .sysThumbnail {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        padding: 0 10px;
        gap: 2px;
    }
    
    #sysItemCategory .sysItemName {
        font-size: 11px;
        padding-top: 10px;
    }
}



/***********************************
  FAQ
***********************************/
.faqs h4 {
  margin: 1rem 0 0.5rem;
  padding-top: 5px;
  border-top: 1px dotted #999;
}

/*
.faqs dt{
  background: url('/img/icon_question.png') 0 0 no-repeat;
  padding: 0 15px 10px 30px;
  position: relative;
  font-size:90%;
}
.faqs dt:hover{
  cursor: pointer;
}
.faqs dd{
  background: url(../images/a.png) 14px 0 no-repeat;
  padding: 0 15px 15px 2em;
  position: relative;
  font-size:90%;
}
.faqs dd a{ color: red; font-weight: bold;}
.faqs .hover{
  color: #ccc;
}



.inquiry_form{text-align:center;margin-top:50px;}*/

/* FAQ全体のコンテナ */
.faqs {
    max-width: 900px;
    margin: 0 auto;
    padding: 20px;
}

/* カテゴリ見出し (h4) */
.faqs h4 {
    font-size: 1.2rem;
    border-bottom: 2px solid #333;
    padding-bottom: 10px;
    margin: 40px 0 20px;
    letter-spacing: 0.1em;
}

/* アコーディオンの枠 */
.faq-item {
    border-bottom: 1px solid #ededed;
}

/* 質問部分 (クリックエリア) */
.faq-item summary {
    list-style: none; /* デフォルトの三角を消す */
    cursor: pointer;
    padding: 20px 40px 20px 0;
    position: relative;
    font-weight: bold;
    outline: none;
}

/* カスタムのプラスアイコン（開閉マーク） */
.faq-item summary::after {
    content: '+';
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.5rem;
    font-weight: 300;
    transition: transform 0.3s ease;
}

/* 開いている時のアイコンの変化 */
.faq-item[open] summary::after {
    transform: translateY(-50%) rotate(45deg); /* プラスを斜めにして×にする、またはマイナスに変更 */
}

/* 回答部分 */
.faq-item dd {
    padding: 0 0 20px 0;
    margin: 0;
    line-height: 1.8;
    color: #666;
    animation: fadeIn 0.4s ease; /* 開く時のふわっとした動き */
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* デフォルトの三角を消す（Safari/Chrome対策） */
.faq-item summary::-webkit-details-marker {
    display: none;
}


/*-------------------------------
お知らせ
-------------------------------*/
.info{background-color: #fff;
margin: 0px auto;
padding: 1rem 0 5rem;
text-align: center;
}
.oshirase .sysContent{
  max-width: 900px;
  padding: 0 24px;
}

.oshirase p{
  font-family: "Yu Mincho", serif;
  font-size: 14px;
  line-height: 2.4;
  letter-spacing: 0.05em;
  color: #333;
  text-align: left;
  display: inline-block;
  max-width: 100%;
  padding: 0 20px;
  word-break: keep-all; 
  word-break: auto-phrase;
  overflow-wrap: break-word; 
  }


/*カート　ご依頼主情報強調*/
.opcClientList{background-color: rgb(245, 245, 245);}
.opcClientTitle{color: rgb(217, 0, 0);}

.line{
  width: 100%;
  margin: -100px 0 70px 0;
  text-align: end;
}

.line img{
width:60px;
}



/*----酒類販売年齢確認--------------------*/
.overlay {
display: none;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.6);
position: fixed;
z-index: 1;
left:0;
}
.btn_area {
width: 500px;
height: 350px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
background: #fff;
text-align: center;
z-index: 2
}
.btn_area .ttl {
font-weight: bold
}
.btn_area p {
padding: 15px
}
.btn_area button,
.no{
display: block;
margin: 0 auto;
background: #333;
color: #fff;
padding: 20px 40px;
border: none;
width: 150px;
}
.btn_area button:hover {background: #777}
.button{cursor: pointer;}
.alcoh{color: rgb(200, 0, 0);font-size: large;}

/*アルコールチェック*/
.al_ck{
font-size:21px;
color:red;
}

/* ---------------------------
   事業紹介ページ
---------------------------- */

.info_intro{
text-align: left;
display: block;
width: 50%;
margin: 0 auto 40px;
}

.info_intro p{
display:inline-block;
text-align:left;
margin:10px auto;
}

.mokuji{
line-height:2;
}

.service_h1{
text-align: left;
font-size: 50px;
padding: 10rem 0 0em;
border-bottom: 1px solid #afafaf;
width: 80%;
margin: 0 auto 80px;
}

.service_h2{
text-align: center;
font-size: 28px;
padding: 2em 0 0em;
border-bottom: 1px solid #afafaf;
width: 50%;
margin: 0 auto 2rem;
}

.s_con{display: flex;
max-width: 1200px;
margin: 0 auto;
}

.scon_in{margin: 1rem 2rem 1rem;
padding: 2rem;
border: 4px double #cfcfcf;
width: 50%;
display: block;
text-align: center;}

.scon_s
{margin: 1rem auto 1rem;
padding: 2rem;
width: 50%;
display: block;
text-align: center;}


/*----------------------shop--------------------------*/
#shop{
width:100%;
background-color:#526875;
color:#ffffff;
}

.shop_img{
display: flex;
justify-content: center;
background-color:#526875;
}

.shop_A{
margin: 2em 0 1em;
padding: 4em;
letter-spacing: 5px;
line-height: 50px;
background: url(/img/service/shop/shop_back.jpg) no-repeat 0 0 / cover;
background-size: auto 130%;
background-repeat: no-repeat;
background-color: rgba(0,0,0,0.6);
background-blend-mode: color;
display:block;
text-align:center;
background-position:center;
}

.shop_A p{
text-align:left;
display:inline-block;
}

.shop_adress{
text-align:center;
background-color:#526875;
padding: 4em 0 3rem;
}


.shop_adress p{
margin:10px 2em;}

.map_area{
max-width: 700px;
margin: 0 auto;
padding: 0 2em;
}
.shop_map{
text-align: center;
background-color: #526875;
padding-top: 75%;
position: relative;
width: 100%;
height: 0;
}

.shop_map iframe{
position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.lesson{
background-color:#526875;
text-align: center;
display: block;
}

.lesson_info{
display:flex;
max-width: 1200px;
margin: 0 auto;
}

.lesson_in{
margin:2rem 2rem 7rem;
padding:2rem;
border:4px double #fff;
width:50%;
display:block;
text-align:center;
}

.lesson_in p{
display:inline-block;
text-align:left;
}

.lesson_in p b{
font-size:18px;
}

.le_intro{
margin: 0 2em 2em;
text-align: left;
display: inline-block;
}

.shop_sns{
text-align:center;
padding: 3em;
}
.sns_logo{
width:100px;
margin:0 auto;
}

.ls_btn{
display: block;
padding: 5px 0;
text-align: center;
background: #b4becf;
width:60%;
margin:2em auto;
color: rgb(18, 16, 80);
border: 4px double rgb(153, 153, 153);
}

.shop_pc4col{
display:flex;
}

.shop_img1{
display:flex;
}

.full_img{
text-align: center;
padding: 1em 0 5em;
width: 100%;
}
.shop_img p{
margin: 4em 0 0;
}

/*----------------------event--------------------------*/

#event{
width:100%;
background-color:#000000;
color:#ffffff;
padding: 0 0 2rem;
}

.event_A{
margin: 2em 0 1em;
padding: 4em;
letter-spacing: 5px;
line-height: 50px;
background: url(/img/service/event/ev_top.jpg) no-repeat 0 0 / cover;
background-size: auto 130%;
background-repeat: no-repeat;
background-color: rgba(0,0,0,0.6);
background-blend-mode: color;
display:block;
text-align:center;
background-position:center;
}

.ev_info{
margin:5em auto;
}
.ev_imgblock{
display:flex;
justify-content: center;
}

.ev_none{display:none;}

.ev_img1{
display:flex;
}

.evprop ul{
display:flex;
justify-content: center;
}
 .evprop ul li{margin:0 2%;}

.evprop p{
text-align: center;
margin: 5rem auto 2rem;
}

.ev_info p{
text-align:center;
margin: 1px 0 15px;}

.ev_btn{
display: block;
padding: 6px 0;
text-align: center;
background: #b4becf;
width: 40%;
margin: 0 auto;
color: rgb(18, 16, 80);
border: 4px double rgb(153, 153, 153);}

.ev_text{margin:5em 0;}

/*----------------------wedding--------------------------*/
#wedding_info{
padding: 0 0 2rem;
}

.wed_brk{display: flex;
justify-content: center;}

.we_text{
width:800px;
text-align:center;
font-size: 20px;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;

}

#wedding_info p{
text-align:center;
}

/*----------------------shop_decoration--------------------------*/
#r_deco{
background-color: #7a6671;
color:#ffffff;
padding:0 0 1rem;
}

#r_deco div{
display:block;
text-align:center;
}
#r_deco div p{
display:inline-block;
text-align:left;
}

.rd_img{
display:flex;
justify-content: center;
}

/*----------------------interior green--------------------------*/
#green_lease{
background-color: #52756f;
color:#ffffff;
padding:0 0 1rem;
}

.gl_img{
display:flex;
justify-content: center;
}

.gl_text{
width: 800px;
text-align: center;
font-size: 20px;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
/*-----↑事業紹介ページ-----*/

/*----------------------事業案内ボタン-------------------------*/
.j_link{
text-align: center;
width: 50%;
margin: 7px auto;
display: block;
background-color: #556977;
}

.j_link span{
color:#fff;
}


#flow,#payment_navi,#delivery,#tatefuda,#mail_service,#member,#biz,.faqs,.privacy1100,.terms{
max-width:1100px;
margin:0 auto;
padding-top: 60px;
}


/*----シャンパンページフッター---*/
.champagne{border-block: solid #526876 35px;padding: 20px 0;background-color:#ffffff;}
.cham_text_a{width:100%; text-align:center; display:flex;}
.cham_text_b{width:100%;text-align:center;display:flex;}
.cham_a{width:50%;}
.cham_b{width:33%;margin:auto;}
.cham_b h2{font-size:1.4rem;}

/*---最近チェックされた商品---*/
.checked{width:100%;margin:0 auto;}
.checked .sysContent {width: 60%;margin: 0 auto;}
.checked .sysContent .sysItemBlock .sysHorizontal {display:flex !important;flex-wrap:wrap !important;}

.checked .sysContent .sysHorizontal .sysItemImage{display: block !important;
width: 100% !important;
aspect-ratio: 3 / 4 !important;
overflow: hidden !important;
background-color: #fff;
position: relative;}
.checked .sysContent .sysHorizontal .sysItemImage img{position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
display: block !important;
object-fit: cover !important;
object-position: center !important;
transition: opacity 0.3s ease, transform 0.3s ease;}





.lesson_footer{text-align: center;}
.tel_fix a{color:#ffffff;}
.t_scale a:hover img{transform:scale(1.1);}
.ph_val{display:flex;}




/*---------商品詳細ページお届け日数の表示----------*/

#Lesson1 .orderArea .sysDeliveryDate ,
#Lesson2 .orderArea .sysDeliveryDate ,
#Lesson3 .orderArea .sysDeliveryDate ,
#mimosaLesson1 .orderArea .sysDeliveryDate ,
#mimosaLesson3 .orderArea .sysDeliveryDate {display:none;}

/*---------Lesson & Workshop----------*/
.lesson_b{width:100%;display:flex;margin:90px 0;color: #ffffff;height: 500px;overflow: hidden;}
.lesson_b_img{width:60%;}
.lesson_b_text{width:40%;margin:auto;padding:0 2%;}
.lesson_b_text h1{font-size:1.5rem;margin: 50px auto;}
.lesson_b_text h2{font-size:1.2rem;margin: 60px auto;}
.lesson_b text p{margin: 10px auto 70px;}
.lesson_b_btn{width:80%;margin: 30px auto;}
.lesson_b_btn a{background-color:#e0e0e0;padding:10px 0;display: block;}
.lesson_b_btn a:hover{opacity:0.8;}

/*--------------------------
      Semi Order 
--------------------------*/
.semi_order{background-color: #fff;padding-top: 10px;}
.semi-order_area {padding: 20px 0 100px;}
.semi_comment_area {text-align: center;margin: 0 auto 60px;max-width: 800px;padding: 0 20px;}
.semi_coment {font-size: 12px;color: #666;letter-spacing: 0.1em;line-height: 2.2;}
.semi-order_img_inner {display: flex;justify-content: center;gap: 150px;max-width: 1200px;margin: 0 auto;}
.semi_order_img {flex: 1;text-align: center;opacity: 0.95;}
.semi_order_img a {display: block;overflow: hidden;text-decoration: none;background-color: #fcfcfc;aspect-ratio: 1 / 1;margin-bottom: 20px;}
.semi_order_img img {width: 100%;height: 100%;object-fit: cover;transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
.semi_order_img a:hover img {transform: scale(1.08);opacity: 1;}
.semi_order_img h3 {font-size: 13px;font-weight: 600;letter-spacing: 0.15emcolor: #111;margin: 0;}
.semi_deliv {font-size: 9px;color: #666;margin-top: 6px;letter-spacing: 0.1em;text-transform: uppercase;}



/* ---------------------------
   カテゴリヘッド
---------------------------- */
.category_inner {
 display: flex !important;
  justify-content: center;
  align-items: flex-start !important;
  max-width: 1000px !important;
  margin: 0 auto 30px !important;
  padding: 0 40px 0 80px !important;
  box-sizing: border-box !important;
  gap: 50px;
}

.category_logo {
  flex: 0 0 160px !important;
  text-align: left !important;
}

.category_logo h3 {
  font-family: 'Cinzel', serif !important;
  font-size: 14px !important;
  font-weight: 600;
  letter-spacing: 0.25em !important;
  color: #111 !important; 
  text-transform: uppercase;
  margin: 0 !important;
  padding-top: 3px;
  line-height: 1 important!;
}

/* 右側：h4 + p エリア */
.category_comment {
  flex: 1 !important;
  max-width: 650px !important;
  text-align: left !important;
}

/* h4（キャッチコピー） */
.category_comment h4 {
  font-family: "Yu Mincho", serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em !important;
  color: #000000 !important;
  margin-bottom: 0 0 15px 0 !important;
  line-height: 1.4;
  text-align: left;
}

/* p（本文） */
.category_p, .category_comment p {
  font-family: "Yu Mincho", serif !important;
  font-size: 14px !important;
  line-height: 2.1 !important; 
  color: #111111 !important;
  margin-bottom: 1em !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-shadow: 0 0 0.5px rgba(0,0,0,0.05);
  word-break: normal;
  line-break: strict;
  overflow-wrap: anywhere;
}

.category_comment p:last-of-type {
  font-size: 12px !important;
  color: #555 !important;
  border-top: 1px solid #dcdcdc !important;
  padding-top: 15px !important;
}

@media (max-width: 767px) {
  .category_inner {
    flex-direction: column !important;
    padding: 0 24px !important;
    gap: 15px;
  }
  .category_logo { flex: none !important; }
}

/*-------商品ページ立札カード用フッター-------*/
.card_plate{text-align:center;background-color: #fff;padding: 5rem 0 5rem 0;}
.pl_c_comment{width:50%;text-align:left;padding: 0 3% 0;}
.card_option{padding: 100px 40px; background-color: #fff; color: #1a1a1a;}
.card_option h3{font-size: 15px;font-weight: 500;letter-spacing: 0.15em;margin-bottom: 60px;}
.pl_c_comment h3{font-size: 13px; margin: 0 0 20px 0 !important;padding-bottom: 15px;border-bottom: 1px solid #000;display: inline-block;}
.pl_c_comment p {font-size: 12px; line-height: 2.1;color: #555;}
.plate{display:flex;max-width:1200px;margin:0 auto;align-items: flex-start;}
.plate_img{width: 40%;display: grid;gap: 20px;grid-auto-flow: dense;grid-template-columns: repeat(7, 1fr);margin: 1% 0 5% 10%;padding: 0 20px;}
.plate_h img{border: solid 1px #dedede;}
.plate_h:nth-child(7n+1){grid-column: span 4;grid-row:span 1;}
.plate_h:nth-child(7n+2){grid-column: span 4;grid-row:span 1;}
.plate_h:nth-child(7n+3){grid-column: span 4;grid-row:span 1;}
.plate_v{display: flex;grid-column: span 2;grid-row:span 4;}
.plate_v img{object-fit:contain;}
.plate_v figcaption{text-orientation: upright;writing-mode: vertical-lr;}
.pl_c_comment dl { margin-top: 40px; }
.pl_c_comment dl div{display:flex; border-bottom: 1px solid #eee;}
.pl_c_comment dl div dd{width: auto !important; font-size: 12px; color: #333; ;margin: 5px 0;}
.pl_c_comment dl div dt{width:140px; font-size: 11px; color: #777;margin: 5px 0;}
.card{display:flex; margin:8rem auto 5rem; max-width:1200px;}
.card_img{width:45%; display: flex; gap: 15px;}
.card_h{width:50%;margin: 5px auto 10px;}
.plate_sample{margin-inline: 15px;margin-top: 30px;display: grid;gap: 20px 4px;grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));}
.sample_img img{transition:0.5s all;}

@media (max-width: 600px){
.card_option{padding: 50px 20px;}
.plate_sample {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 250px; 
  grid-template-columns: 250px;
  gap: 15px;
  overflow-x: auto;
  width: 100%;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding: 10px 20px;
  box-sizing: border-box;
  margin-inline: 0;
}
.plate_sample figure {
  margin: 0;
  scroll-snap-align: start;
}

.plate_sample figure img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border-radius: 4px;
}

.plate_sample::-webkit-scrollbar {
  display: none;
}
.plate .card{margin: 5rem auto 5rem;}
}

/*----------------------------
横に流れるラインアニメーション
----------------------------*/
.scroll_down {position: relative;width: 100%;margin:20px auto 0px;text-align:center;}
.scroll_down:after {content: '';position: absolute;bottom: 0;left: 0;width: 100%;height: 80%;background: linear-gradient(180deg,rgba(#000, 0) 0, rgba(#000, .8) 80%, rgba(#000, .8) 100%);}
.scroll_down a {display: inline-block;padding: 0px 50px;color: #000;letter-spacing: .2em;transition: .2s;overflow: hidden;margin: auto;font-family: "cinzel";}
.scroll_down a:before {content: '';position: absolute;bottom: 30px;left: 20%;width: 60%;height: 1px;background: #ddd;}
.scroll_down a:after {content: '';position: absolute;bottom: 30px;left: 20%;width: 60%;height: 1px;background: #000;}
#type01 a:after {animation: sdl01 1.5s cubic-bezier(1, 0, 0, 1) infinite;}
@keyframes sdl01 {
  0% {transform: scale(0, 1);transform-origin: 0 0;}
  50% {transform: scale(1, 1);transform-origin: 0 0;}50.1% {transform: scale(1, 1);transform-origin: 100% 0;}
  100% {transform: scale(0, 1);transform-origin: 100% 0;}
}


/* =====================================
  Fullscreen Hero Slider
===================================== */

.top_image {
  margin: 300px 0 15rem;
  display: flex;
  justify-content: center;
}

.top_banner{
  padding: 5rem 0 3rem;
  display: flex;
  justify-content: center;
  background: #f4f4f4;
margin: 80px 0 0 0;
}
.top_banner .common_btn {
  margin-top: 1.5rem;
}

.t_slider .sysContent {
  max-width: none;
  margin: 0;
  padding: 0;
  width: 100%;
}

.fullscreen-slider {
  position: relative;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  z-index: 1;
  background-color: #000;
}

.slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 1.2s ease-in-out;
  z-index: 1;
}

.slide.active {
  opacity: 1;
  pointer-events: auto;
}

.slide picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 共通テキストベース */
/*.slide-content,*/
.topspace {
  position: absolute;
  z-index: 2;
  color: #fff;
  top: 50%;
  left: 50%;
  transform: translate(-85%, -50%);
  text-align: center;
  width: 50vw;
  padding: 10px 10px;
}
.slide-content{
  position: absolute;
}

/* Slide 1 */
.slide1 .topcomment {
  font-family: "Cinzel", serif;
  font-size: clamp(1.1rem, 2vw, 1.5rem) !important;
   text-align: center;
  font-weight: 300;
  letter-spacing: 0.4em !important;
  margin-bottom: 25px;
  color: #fdfdfd !important;
  white-space: nowrap !important;
  position: relative;
  z-index:1;
}

.slide1 .toptext {
  color: #fdfdfd !important;
  font-size: 11px;
  line-height: 2.2;
  letter-spacing: 0.25em;
  text-align: center;
  position: relative;
  z-index:1;
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
}

/* Slide 2〜4: コンテンツ（左下配置） */
.slide-content {
  bottom: 15%;
  left: 6%;
  text-align: left;
  max-width: 600px;
}

.slide-content h2 {
  font-family: "Cinzel", serif;
  font-size: clamp(1.0rem, 1.8vw, 1.3rem) !important;
  font-weight: 400;
  letter-spacing: 0.15em;
  margin-bottom: 15px;
  color: #fff;
}

.slide-content p {
  color: #fdfdfd !important;
  font-size: 12px;
  line-height: 1.8;
  letter-spacing: 0.12em;
  margin-bottom: 25px;
  text-shadow: 0 1px 10px rgba(0,0,0,0.3);
}

.slide-link {
  display: inline-block;
  color: #fff;
  text-decoration: none;
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(255,255,255,0.6) !important;
  padding: 0 0 5px 0 !important;
  transition: border-color 0.3s;
}

.slide-link:hover {
  border-bottom-color: #fff !important;
}

/* インジケーター（極細横棒） */
.slider-indicators {
  position: absolute;
  bottom: 60px;
  left: 6%;
  display: flex;
  gap: 15px;
  z-index: 20;
}

.indicator {
  width: 30px;
  height: 1px;
  background-color: rgba(255,255,255,0.3);
  cursor: pointer;
  transition: all 0.6s ease;
}

.indicator.active {
  width: 60px;
  background-color: #fff;
}

/* --- レスポンシブ調整 --- */
@media (max-width: 1100px) {
  .slide-content, .slider-indicators {
    left: 20px;
  }
}

@media (max-width: 600px) {
  .slide1 .topspace {
    width: 95vw !important;
    padding: 0 !important;
    transform: translate(-65%, -50%);
  }

  .slide1 .topcomment {
    font-size: 1.1rem !important;
    letter-spacing: 0.2em !important;
    margin-bottom: 20px !important;
  }

  .slide-content {
    left: 20px !important;
    bottom: 120px !important;
  }

/*hero*/.slide1 picture img{object-position:75% center;}
/*premium*/.slide2 picture img{object-position:70% center;}
/*refined*/.slide3 picture img{object-position:60% center;}
/*leave*/.slide4 picture img{object-position:28% center;}

  .slide-content h2 {
    font-size: 1.0rem !important;
  }

  .slide1 .toptext, .slide-content p {
    font-size: 10px !important;
  }
}


/*-----------------------------------------*/
/*--------------おすすめ商品スライダー---------*/
/*-----------------------------------------*/
.side_scroll {
  width: 100%;
  position: relative;
  padding: 20px 0;
  overflow: hidden;
  margin-top:0px;
}

.side_scroll .sysContent .sysItemBlock .sysHorizontal {
  display: block !important;
  flex-wrap: unset !important;
  margin: 0;
  padding: 0;
  list-style: none;
}

.side_scroll .sysContent .sysItemBlock .sysHorizontal li {
  float: none !important;
  width: auto !important;
  padding: 0 !important;
}

/* Swiper wrapper & slide */
.side_scroll .swiper-wrapper {
  display: flex !important;
}

.side_scroll .swiper-slide {
  display: block !important;
  flex: 0 0 auto;      /* 幅自動 */
  width: auto;         /* breakpointsで自動調整 */
 background:#ebebeb;
  text-align: center;
  padding: 0px;
}

.side_scroll .swiper-slide input,
.side_scroll .swiper-slide div {
  width: 100%;
}
.side_scroll .swiper-slide div{padding: 0 ;}
.side_scroll .swiper-slide img {
  width: 100%;
  display: block;
  aspect-ratio: 3 / 4;
object-fit: cover;
object-position: center;
}

.side_scroll .swiper-slide {
  font-size: 16px;
  line-height: 1.4;
}

/* ナビボタン */
.side_scroll .swiper-button-next,
.side_scroll .swiper-button-prev {
  color: #dedede;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
}

/* レスポンシブ */
@media (max-width: 768px) {
  .side_scroll .swiper-slide {
    padding: 15px;
  }
}

.swiper-slide .sysItemName a{font-size:14px;}
.swiper-slide .sysItemPrice{font-size: 13px;
font-family: "Cinzel";}



/* ---------------------------
   ご相談ボタン 固定バー
---------------------------- */
/* ------------------ 共通：ベース ------------------ */
.floating-contact {
  position: fixed;
  z-index: 9999;
  display: flex;
  flex-direction: column-reverse;
  align-items: flex-end;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

.floating-contact.visible { 
  opacity: 1; 
  transform: translateY(0); 
}

#contactToggle {
  background: #222; 
  color: #fff; 
  border: none; 
  border-radius: 0;
  padding: 14px 24px; 
  font-size: 13px;
  letter-spacing: 0.2em;
  cursor: pointer;
  box-shadow: 0 4px 15px rgba(0,0,0,0.2);
  white-space: nowrap;
  
min-width: 200px;
font-weight: 500;
}

/* ------------------ メニュー展開エリア ------------------ */
.contact-options {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  margin-bottom: 2px;
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px);
  transition: all 0.3s ease;
}

.floating-contact.open .contact-options { 
  opacity: 1; 
  pointer-events: auto; 
  transform: translateY(0); 
}

/* 展開アイテム */
.contact-item {
  display: flex; 
  align-items: center; 
  background: #222;
  color: #fff;
  text-decoration: none; 
  border-radius: 0;
  font-size: 13px;
  margin-bottom: 1px;
  opacity: 0;
  width: 240px;
  height: 50px;
  box-sizing: border-box;
}

.floating-contact.open .contact-item { opacity: 1; }

.contact-item .contact-icon {
  width: 50px;
  height: 100%;
  padding: 14px;
  box-sizing: border-box;
  border-right: 1px solid rgba(255,255,255,0.2);
  object-fit: contain;
}

.contact-label {
  padding-left: 15px;
  white-space: nowrap;
}

/* ------------------ PC（768px以上） ------------------ */
@media (min-width: 768px) {
  .floating-contact { 
    right: 30px; 
    bottom: 30px; 
    left: auto; 
    width: auto;
  }

  .contact-item {
    transition: background 0.2s ease, color 0.2s ease;
  }

  .contact-item:hover {
    background: #fff !important;
    color: #222 !important;
  }

  .contact-item:hover .contact-icon {
    filter: invert(1) brightness(0);
    border-right: 1px solid rgba(0,0,0,0.1);
  }

  .contact-item .contact-icon {
    transition: filter 0.2s ease, border-right 0.2s ease;
  }
}

/* ------------------ その他、共通の修正（安定化） ------------------ */
.contact-item {
  display: flex; 
  align-items: center; 
  background: #222;
  color: #fff;
  text-decoration: none; 
  border-radius: 0;
  font-size: 13px;
  margin-bottom: 1px;
  width: 240px;
  height: 50px;
  overflow: hidden;
}

.contact-label {
  padding-left: 15px;
  white-space: nowrap;
  font-weight: 500;
}

/* ------------------ スマホ（767px以下） ------------------ */
@media (max-width: 767px) {
  .floating-contact { 
    left: 10px; 
    right: 10px; 
    bottom: 10px; 
    width: calc(100% - 20px);
    align-items: center;
    -webkit-tap-highlight-color: transparent;
  }

  #contactToggle {
    width: 100%;
  }

  .contact-options {
    flex-direction: row; 
    width: 100%;
    gap: 1px;
    margin-bottom: 1px;
  }

  .contact-item { 
    width: 33.33% !important; 
    height: 60px; 
    flex-direction: column; 
    justify-content: center;
    padding: 5px 0;
    transition: background-color 0.2s;
  }

  .contact-item:active {
    background-color: #ffffff !important;
  }
  .contact-item:active .contact-label {
    color: #222 !important;
  }
  .contact-item:active .contact-icon {
    filter: invert(1) brightness(0) !important;
  }

  .contact-item .contact-icon {
    border-right: none;
    border-bottom: none;
    height: 30px;
    padding: 5px;
    display: block;
    margin: 0 auto;
  }

  .contact-label {
    padding-left: 0;
    font-size: 10px; 
    transform: scale(0.9);
    display: block;
    color: #ffffff;
  }
}

  @media (min-width: 768px) {.pagetop { display: none; }
}

/*-------------------------レスポンシブ画面幅調整------------------------*/
/* スマホ */
@media (min-width: 768px) {
  .sysThumbnail,.sysContent {max-width: 834px;}
}

/* タブレット */
@media (min-width: 1024px) {
  .sysThumbnail,.sysContent {max-width: 1194px;}
}

/* 小型PC */
@media (min-width: 1440px) {
  .sysThumbnail,.sysContent {max-width: 1236px;}
}

/* フルHD */
@media (min-width: 1680px) {
  .sysThumbnail,.sysContent {max-width: 1442px;}
}

/* WQHD以上（最大値固定） */
@media (min-width: 1920px) {
  .sysThumbnail,.sysContent {max-width: 1536px;}
}


/*----------statement----------*/

.sysFuncText.statement {
background-color: #1a1a1a;margin: 0; padding: 0; position: relative;z-index: 1;display: flex;
  justify-content: center;
  align-items: center;
}

.sysFuncText.statement .state {
  text-align: center;
  font-size: clamp(14px, 1.1vw, 16px);
  line-height: 2.5;
  letter-spacing: 0.15em;
  color: #f5f5f5;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  padding-top: clamp(60px, 8vw, 100px);
  padding-bottom: clamp(60px, 8vw, 100px);
  margin: 0 !important;
}

.state{margin-bottom: 50px;}

.sysFuncText.statement .state-line {
  display: block;
  width: 100%;
}

/* =================================================
   2. デザイン・フィロソフィーセクション (横並び)
   ================================================= */
.design-philosophy {
  background: 
    linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), 
    url('../img/banner/top_philosophy.webp') no-repeat;
  background-position: left bottom;
  background-size: cover;
  background-attachment: fixed;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  min-height: auto !important;
  display: flex;
  align-items: center;
  position: relative;
  padding: 80px 0 !important;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", serif;
  color: #ffffff;
}

.design-philosophy__inner {
  max-width: 1100px;
  margin: 0 auto;
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 8%;
  padding: 0 6% !important;
}

.design-philosophy__header {
  flex: 0 0 auto;
  text-align: left;
  margin-bottom: 0;
}

.design-philosophy__title {
  font-size: 1.1rem !important;
  letter-spacing: 0.3em;
  font-weight: 500;
  display: flex;
  flex-direction: column;
  align-items: flex-start; /* 左揃え */
  line-height: 1.4;
}

.design-philosophy__title .en {
  font-family: "Cinzel", serif;
  font-size: 1.1rem;
  letter-spacing: 0.4em;
  margin-bottom: 8px;
  color: #fff;
}

.design-philosophy__subtitle {
  font-size: 0.65rem;
  letter-spacing: 0.2em;
  color: rgba(255, 255, 255, 0.5);
}

.design-philosophy__body {
  flex: 0 1 500px; /* 本文の幅を制限 */
  text-align: left;
}

.design-philosophy__text {
  font-size: 0.8rem !important;
  line-height: 2.2; /* 行間を広げて読みやすく */
  letter-spacing: 0.12em;
  margin-bottom: 1.5rem;
  color: rgba(255, 255, 255, 0.9);
  font-feature-settings: "palt";
}

.design-philosophy__text:last-child {
  margin-bottom: 0;
}

/* =================================================
   3. スマホ対応 (Responsive)
   ================================================= */
@media screen and (max-width: 768px) {
  .design-philosophy {
    background-attachment: scroll;
    background-size: cover;
    padding: 40px 0 60px !important;
  }

  .design-philosophy__inner {
    flex-direction: column;
    justify-content: flex-start;
    gap: 30px;
  }

  .design-philosophy__body {
    max-width: 100%;
    padding-left: 10%; 
  }
  .design-philosophy__body {
  flex: 0 1 130px; 
  }

  .design-philosophy__text {
    font-size: 0.75rem !important;
    line-height: 1.8;
  }
}



/*---------- premium & refined ----------*/

/* ===== 全体レイアウト ===== */
.design-dual {
  max-width: 1280px;
  margin: 120px auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 15px;
}

/* ===== 共通設定 ===== */
.design-card { width: 100%; }

.design-image { overflow: hidden; }

.design-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ===== Premium (PC) ===== */
.premium-inner {
  display: flex;
  gap: 40px;
  align-items: flex-end;
}
.design-image.vertical { width: 55%; }
.premium-text { width: 47%; }

/* ===== Refined (PC) ===== */
.refined-inner {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  padding-top: 100px;
}
.design-image.horizontal { margin-bottom: 24px; }
.refined-text {
  text-align: left;
  max-width: 360px;
}
.refined-text .design-text{
  width: fit-content;
margin-left: auto;
margin-right: 0;}

.refined .design-title {
  text-align: right; /* Refinedの見出しは右寄せ */
}
.refined .design-condition {
  align-items: flex-end !important;
}
/* ===== テキスト共通 ===== */
.design-title {
  font-family: "Cinzel", serif;
  font-size: 18px !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase;
  display: block;
  word-break: keep-all;
}

.jp-title {
  display: block;
  font-family: "Yu Mincho", serif;
  font-size: 11px !important;
  letter-spacing: 0.15em;
  color: #555;
  margin-top: 8px;
  text-transform: none;
  font-weight: 500;
}

.design-text {
  font-size: 13px !important;
  color: #444;
  line-height: 2.2 !important;
  font-feature-settings: "palt";
  margin-top: 20px;
}

/* ===== 配送条件 (design-condition) 統合設定 ===== */
.design-condition {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  margin-top: 24px;
  line-height: 1.4;
}

.cond-en {
  display: inline-flex;
  align-items: center;
  font-family: 'Cinzel', serif;
  font-size: 11px;
  letter-spacing: 0.2em;
  color: #111;
  border-bottom: 1px solid #111;
  padding-bottom: 2px;
  margin-bottom: 6px;
}

.cond-jp {
  display: block;
  font-family: "Yu Mincho", serif;
  font-size: 10px;
  color: #555;
  padding-left: 16px; /* アイコン分のスペース */
}

/* アイコン：Premium(ドット) */
.premium .cond-en::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  background-color: #a48a57;
  border-radius: 50%;
  margin-right: 10px;
}

/* アイコン：Refined(＋) */
.refined .cond-en::before {
  content: "＋";
  display: inline-block;
  margin-right: 8px;
  font-size: 12px;
  color: #666;
  font-weight: 400;
}

/* =========================================
   MEDIA QUERY (SP)
========================================= */
@media (max-width: 768px) {
  .design-dual {
    grid-template-columns: 1fr;
    row-gap: 0px;
    margin: 60px auto;
  }

  /* --- Premium SP --- */
  .premium-inner {
    position: relative;
    flex-direction: column;
  }
  .design-image.vertical { width: 100%; background: #f2f2f2; }
  .design-image.vertical img {
    width: 60%;
    margin-left: auto;
    object-fit: contain;
  }
  .premium-inner::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 60%);
    z-index: 1;
    pointer-events: none;
  }
  .premium-text {
    position: absolute;
    top: 40px;
    left: 20px;
    z-index: 2;
    width: 100%;
    max-width: 320px;
  }

  /* --- Refined SP --- */
  .refined { padding-top: 0; align-items: stretch; }
  .refined-text {
    width: 100%;
    max-width: 100%;
    padding: 30px 20px 28px;
    text-align: right;
    color: #fff;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.1) 100%) !important;
    margin-top: -24px;
    z-index: 2;
  }
  .refined .design-condition { align-items: flex-end !important; }
  .refined .cond-jp { padding-left: 0; padding-right: 16px; }

  .premium-text .design-title, .refined-text .design-title,
  .premium-text .design-text, .refined-text .design-text,
  .premium-text .jp-title, .refined-text .jp-title {
    color: #ffffff !important;
  }

  .premium-text .cond-en, .refined-text .cond-en {
    color: #ffffff !important;
    border-bottom-color: rgba(255, 255, 255, 0.5) !important;
  }
  
  .premium-text .cond-jp, .refined-text .cond-jp {
    color: rgba(255, 255, 255, 0.8) !important;
  }

  .premium .cond-en::before, .refined .cond-en::before {
    background-color: #fff;
    color: #fff;
  }
}


/*-----------------------------------------*/
/*------- ------ヘッダーNEW------------------*/
/*-----------------------------------------*/
.sp-only { display: none !important; }
.pc-only { display: block !important; }


@media (min-width: 1101px) {
  .mobile-drawer,
  .drawer-overlay,
  [class^="sp-"] {display: none !important;}

  .menu-trigger {display: block;}
}

@media (max-width: 1100px) {
  .header-nav {display: none;}
  .menu-trigger {display: block;}
}

/* ================================================= 
   PC専用設定（1101px以上）：統合完成版
   ================================================== */

  /* 2. ヘッダー固定 & 透過設定 */
  .site-header {
    position: fixed; top: 0; left: 0; width: 100%; z-index: 9999;
    transition: background-color 0.4s ease;
  }
  .site-header.is-transparent { background-color: transparent; }
  .site-header.is-scrolled {
    background-color: rgba(255, 255, 255, 0.98);
    border-bottom: 1px solid #eee;
  }

  /* 3. 1段目（ロゴ・左右リンク）の配置 */
  .header-inner {
    display: flex !important; justify-content: space-between; align-items: center;
    padding: 12px 40px 10px !important; height: 55px; position: relative;
  }
  .header-logo { position: absolute; left: 50%; transform: translateX(-50%); }
  .header-logo img { height: 32px; width: auto; }
  .upper-left, .upper-right { flex: 1; display: flex !important; gap: 20px; align-items: center; }
  .upper-right { justify-content: flex-end; align-items: flex-end; }
  .header-icon svg{vertical-align: unset !important;}

  .header-nav {
    display: none !important;
    position: relative;
  }
  .is-scrolled .header-nav {
    display: block;
  }
  .header-nav .nav-list {
    display: flex !important; justify-content: center !important;
    list-style: none !important; padding: 12px 0 !important; margin: 0;
    background: #fff; border-top: 1px solid #eee; gap: 40px;
    position: static !important;
  }
  .nav-list li { position: static; }
  .nav-list li a { text-decoration: none; color: #333; font-size: 12px; letter-spacing: 0.1em; }

  .header-nav {
    position: static !important;
  }
  .header-nav .nav-list {
    position: static !important;
    display: flex !important;
    justify-content: center !important;
    gap: 40px !important;
    list-style: none !important;
    padding: 12px 0 !important;
    background: #fff;
    border-top: 1px solid #eee;
  }

  .mega-menu {
    position: absolute !important;
    top: 100% !important;
    padding-top: 25px !important;
    margin-top: -15px !important;
    left: 50% !important;
    right: auto !important;
    width: 100vw !important;
    margin-left: -50vw !important;    
    background: #ffffff !important;
    z-index: 10000 !important;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    box-shadow: 0 15px 30px rgba(0,0,0,0.08);
    display: block !important;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-20px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    pointer-events: none;
  }

  .has-mega:hover > .mega-menu {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
    pointer-events: auto !important;
    overflow-y: auto;
    max-height: calc(100vh - 100px);
  }

.mega-inner-layout {
    width: 100% !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
    padding: 20px 20px 30px 20px !important;
    box-sizing: border-box !important;
  }

  .mega-row-title {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 20px;
    margin: 0 0 15px 0 !important;
    padding-bottom: 5px;
    font-size: 10px !important;
    font-weight: 600 !important;
    color: #333 !important;
    letter-spacing: 0.2em !important;
    text-transform: uppercase;
  }
  .mega-row-title::before,
  .mega-row-title::after {
    content: "";
    height: 1px;
    width: 40px;
    background-color: #e0e0e0;
  }

  .mega-items-wrap {
    display: flex !important;
    justify-content: center !important;
    gap: 15px !important;
    margin-bottom: 20px;
  }

  .col-2 .mega-item { width: 480px !important; }
  .col-2 .img-box {
    width: 100%;
    height: 120px !important;
    overflow: hidden;
    background: #f9f9f9;
  }

  .col-4 .mega-item { width: 220px !important; }
  .col-4 .img-box {
    width: 100%;
    height: 80px !important;
    overflow: hidden;
    background: #f9f9f9;
  }

  .mega-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
  }

  .mega-item span {
    display: block;
    font-size: 11px !important;
    font-weight: bold;
    color: #333;
    margin-top: 8px;
  }
  .mega-item small {
    display: block;
    font-size: 9px !important;
    color: #555;
    line-height: 1.2;
  }

  .text-menu {
    display: flex !important;
    justify-content: center !important;
    gap: 0 !important;
  }

  .text-menu .menu-column {
    flex: 1;
    text-align: center;
    border-right: 1px solid #f0f0f0;
    padding: 0 20px;
  }

  .text-menu .menu-column:last-child {
    border-right: none;
  }

  .text-menu a {
    display: block;
    font-size: 12px !important;
    font-weight: 500;
    color: #444;
    text-decoration: none;
    padding: 12px 0;
    letter-spacing: 0.15em;
    transition: all 0.3s ease;
    position: relative;
  }

  .text-menu a:hover {
    color: #999;
  }
  .text-menu a::after {
    content: "";
    position: absolute;
    bottom: 8px;
    left: 50%;
    width: 0;
    height: 1px;
    background: #999;
    transition: all 0.3s ease;
    transform: translateX(-50%);
  }
  .text-menu a:hover::after {
    width: 30px;
  }

  /* --- Price--- */
  .price-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 12px !important;
    max-width: 600px !important;
    margin: 0 auto !important;
  }

  .price-card {
    height: 54px !important;
    background: #ffffff;
    border: 1px solid #e5e5e5;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px !important;
    font-weight: 600;
    color: #333;
    text-decoration: none;
    letter-spacing: 0.2em;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    position: relative;
    overflow: hidden;
  }

  .price-card:hover {
    border-color: #333;
    background-color: #fcfcfc;
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    color: #000;
  }


  .price-card span {
    font-family: "Georgia", serif;
    font-size: 13px;
    margin-right: 2px;
  }

  .color-menu { gap: 20px !important; }
  .color-item {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100px !important;
  text-decoration: none !important;
}
  .color-circle {
  display: block !important; 
  width: 35px !important;
  height: 35px !important;
  border-radius: 50% !important;
  margin-bottom: 5px !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.1) !important; }



/* ================================================= 
   スマホ専用ハンバーガー設定（1100px以下）
   ================================================== */
@media screen and (max-width: 1100px) {
.sp-only { display: block !important; }
.pc-only, .header-nav { display: none !important; }

.menu-trigger {
position: fixed !important;
top: 18px !important;
left: 20px !important;
width: 24px !important;
height: 16px !important;
display: flex !important;
flex-direction: column !important;
justify-content: space-between !important;
z-index: 1000001 !important;
cursor: pointer !important;
background: none !important;
border: none !important;
padding: 0 !important;
}

.menu-trigger span {
display: block !important;
width: 100% !important;
height: 1px !important;
background-color: #333 !important;
transition: 0.3s !important;
}

/* ✕印のアニメーション */
.menu-trigger.is-active span:nth-child(1) { transform: translateY(7px) rotate(45deg) !important; }
.menu-trigger.is-active span:nth-child(2) { opacity: 0 !important; }
.menu-trigger.is-active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg) !important; }

/* --- 3. ドロワーメニュー本体（隔離設定） --- */
.mobile-drawer {
position: fixed !important;
top: 0 !important;
left: -100% !important;
width: 85% !important;
height: 100vh !important;
background: #fff !important;
z-index: 1000000 !important;
overflow-y: auto !important;
transition: left 0.4s ease !important;
display: block !important;
}

.mobile-drawer.is-open { left: 0 !important; }

.drawer-overlay {
position: fixed !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
background: rgba(0,0,0,0.5) !important;
z-index: 999999 !important;
display: none !important;
}

.drawer-overlay.is-visible { display: block !important; }

.sp-acc-content {
/*display: none !important;*/
display: block !important;
max-height: 0px !important;
overflow: hidden !important;
opacity: 0 !important;
/*opacity: 1 !important;*/
transition: max-height 0.4s ease, opacity 0.3s ease, padding 0.4s ease !important;



position: static !important;
width: 100% !important;
padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    visibility: visible !important;
/*left: 0 !important;*/
/*pointer-events: auto !important;*/
/*transform: none !important;*/
}

.sp-acc-parent.is-active > .sp-acc-content {
max-height: 2000px !important; /* 十分な高さ */
    opacity: 1 !important;
    /* 開いた時だけ元の余白(10px 20px)を戻す */
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}
.sp-acc-parent > a::after {
    transition: transform 0.4s ease !important;
}

.sp-acc-content .sp-menu-list, 
.sp-acc-content .sub-link-list, 
.sp-acc-content .sp-price-grid {
    margin: 0 !important;
}

.drawer-contact-bar { display: flex !important;
gap: 0 !important;
margin-top: 60px !important;
border-top: 1px solid #111 !important;
border-bottom: 1px solid #111 !important;
background-color: #fff !important; }

.drawer-contact-bar a { flex: 1 !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
padding: 20px 5px !important;
text-decoration: none !important;
position: relative !important;
transition: all 0.3s ease !important; }

.drawer-contact-bar a::before {
content: ''; display: block; width: 20px; height: 20px; margin-bottom: 8px; background-size: contain; background-repeat: no-repeat;
background-position: center; opacity: 0.7;
filter: grayscale(1);
}
.drawer-contact-bar a:active {
background-color: #f9f9f9 !important;
}
.btn-tel::before { background-image: url('/img/img/tel_logo.png'); }
.btn-mail::before { background-image: url('/img/img/mail_logo.png'); }
.btn-line::before {
background-image: url('/img/sns/line_logo.png');
filter: none !important;
opacity: 0.9;
}

.btn-line span {
color: #06c755 !important;
}
.drawer-contact-bar a i,
.drawer-contact-bar a svg {
margin-bottom: 8px;
width: 18px;
height: 18px;
stroke-width: 1.2px;
}

.drawer-contact-bar a span {
font-size: 9px !important;
letter-spacing: 0.15em !important;
color: #111 !important;}

.sp-nav-list { list-style: none; padding: 0; margin: 0; }
.sp-acc-parent > a {
display: block; padding: 18px 20px; border-bottom: 1px solid #eee;
font-weight: bold; color: #333; text-decoration: none; position: relative;
}

.sp-acc-parent > a::after {
content: ''; position: absolute; right: 20px; top: 50%;
width: 8px; height: 8px; border-right: 2px solid #ccc; border-bottom: 2px solid #ccc;
transform: translateY(-70%) rotate(45deg); transition: 0.3s;
}

.sp-acc-parent.is-active > a::after { transform: translateY(-30%) rotate(-135deg); }

.sp-menu-list, .sub-link-list, .sp-price-grid {
display: block !important;
padding: 10px 20px !important;
background: #f9f9f9 !important;

}

.sub-link-list {
display: block !important;
padding: 0 !important;
background-color: #f0f0f0 !important;
}

.sub-link-list li {
list-style: none !important;
border-bottom: 1px solid #f5f5f5 !important;
}

.sub-link-list li a {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
padding: 20px 25px !important;
font-size: 13px !important;
color: #111 !important;
text-decoration: none !important;
letter-spacing: 0.05em !important;
}

.sub-link-list li a::after {
content: "\2192";
font-family: serif;
color: #ccc;
font-size: 14px;

}

.sp-price-grid {
display: grid !important;
grid-template-columns: 1fr 1fr !important;
gap: 1px !important;
background-color: #f0f0f0 !important;
border-top: 1px solid #f0f0f0 !important;
border-bottom: 1px solid #f0f0f0 !important;
}

.sp-price-grid a {
background-color: #fff !important;
padding: 25px 10px !important;
text-align: center !important;
font-family: "Cinzel", serif !important;
font-size: 14px !important;
color: #111 !important;
text-decoration: none !important;
}

.sp-price-grid a::before {
content: "Shop by Price";
display: block;
font-family: sans-serif;
font-size: 7px;
text-transform: uppercase;
color: #999;
letter-spacing: 0.2em;
margin-bottom: 5px;
}

.menu-item-row { display: flex; align-items: center; padding: 10px 0; border-bottom: 1px dotted #ccc; text-decoration: none; }
.menu-item-row .img-box { width: 50px; height: 40px; margin-right: 15px; }
.menu-item-row img { width: 100%; height: 100%; object-fit: cover; }
.text-box .en { display: block; font-size: 11px; font-weight: bold; color: #333; }
.text-box .jp { display: block; font-size: 10px; color: #999; }

.color-circle { display: inline-block; width: 24px; height: 24px; border-radius: 50%; vertical-align: middle; }


/* 1. ヘッダー上段左の「Guide / Contact」を消す */
.upper-left {
display: none !important;
}

.header-nav {
display: none !important;
}

.header-inner {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
padding: 10px 15px !important;
height: 50px !important;
}

.header-logo {
position: absolute !important;
left: 50% !important;
transform: translateX(-50%) !important;
margin: 0 !important;
}

.header-logo img {
height: 25px !important;
width: auto !important;
}

.upper-right {
display: flex !important;
gap: 12px !important;
margin-left: auto !important;
}

.header-icon svg, .open-search-icon svg {
width: 20px !important;
height: 20px !important;
}

.drawer-guide-section {
padding: 40px 25px 60px !important;
background-color: #fff !important;
border-top: 1px solid #f0f0f0;
margin-bottom: 30px;
}

.drawer-guide-section .section-title {
font-size: 11px !important;
font-weight: 500 !important;
color: #999 !important;
letter-spacing: 0.25em !important;
text-transform: uppercase;
text-align: center;
margin-bottom: 30px !important;
position: relative;
}

.drawer-guide-section .section-title::after {
content: "";
display: block;
width: 20px;
height: 1px;
background: #ccc;
margin: 10px auto 0;
}

.guide-grid {
display: grid !important;
grid-template-columns: 1fr 1fr !important;
gap: 1px !important;
background-color: #eee !important; 
border: 1px solid #eee !important;
margin-bottom: 30px !important;
}
.guide-grid a {
background-color: #fff !important;
padding: 15px 10px !important;
font-size: 11px !important;
color: #444 !important;
text-decoration: none;
text-align: center;
letter-spacing: 0.05em;
display: flex;
align-items: center;
justify-content: center;
}

.bottom-links {
display: flex !important;
flex-direction: column !important;
gap: 12px !important;
}

.bottom-links .full-link {
display: block !important;
width: 100% !important;
padding: 16px !important;
text-align: center !important;
text-decoration: none !important;
font-size: 12px !important;
letter-spacing: 0.15em !important;
transition: all 0.3s ease;
}

.full-link:first-child {
background: #fff !important;
color: #333 !important;
border: 1px solid #333 !important;
}

.full-link:last-child {
background: #333 !important;
color: #fff !important;
border: 1px solid #333 !important;}
.full-link:active {
opacity: 0.7;
}
}

@media screen and (min-width: 1101px) {
.is-scrolled .header-nav {
display: block !important;
}
}

@media screen and (max-width: 1100px) {
.header-nav {display: none !important;
}
}

/* ================================================= 
   特集3カラム
   ================================================== */
/* --- 特集セクション全体 --- */
.top-specials {
  max-width: 1200px;
  margin: 160px auto 0;
}
.special-inner {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 70px;
}

/* --- 各アイテム --- */
.special-item a {
  text-decoration: none;
  display: block;
}

.special-img {
  aspect-ratio: 3 / 4;
  overflow: hidden;
  background-color: #f9f9f9;
  margin-bottom: 15px;
}

.special-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
  padding: 15px;
}

.special-item a:hover img {
  transform: scale(1.05);
}

.special-meta h3 {
  font-family: "Cinzel", serif;
  font-size: 15px;
  letter-spacing: 0.15em;
  color: #333;
  margin-bottom: 12px;
  font-weight: 400;
}

.special-meta p {
  font-size: 11px;
  line-height: 1.8;
  letter-spacing: 0.08em;
  color: #555;
}

/* --- スマホ対応 --- */
@media screen and (max-width: 768px) {
  .top-specials {
    margin: 80px auto;
    padding: 0 24px;
  }
  
  .special-inner {
    grid-template-columns: 1fr;
    gap: 60px;
    }

  .special-img {aspect-ratio: 1 / 1;
  .special-meta h3 {font-size: 14px;}
}}

/* ================================================= 
 Style Index Section 
================================================== */
.style-index-section {
  padding: 40px 40px 100px;
  background-color: #ededed;
  max-width: 1200px;
  margin: 0 auto;
}

.style-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px 20px;
}

.style-item a {
  text-decoration: none;
  display: block;
}

.style-img {
  width: 100%;
  aspect-ratio: 1 / 1; 
  overflow: hidden;
  background-color: #fcfcfc;
  margin-bottom: 15px;
}

.style-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.6s ease;
  filter: brightness(0.9) brightness(1);
}

.style-text {
  text-align: center;
}

.cat-en {
  font-family: 'Cinzel', serif;
  font-size: 12px;
  letter-spacing: 0.18em;
  color: #111;
  text-transform: uppercase;
  margin-bottom: 5px;
  line-height: 1.4;
}

.cat-jp {
  font-size: 10px;
  color: #555;
  letter-spacing: 0.05em;
}

.style-item a:hover .style-img img {
  transform: scale(1.08);
  filter: brightness(1);
}

.style-item a:hover .cat-en {
  opacity: 0.5;
}

@media screen and (max-width: 768px) {
  .style-index-section {
    padding: 10px 15px 60px;
  }
  
  .style-grid {
    grid-template-columns: 1fr 1fr;
    gap: 25px 12px;
  }

  .cat-en {
    font-size: 10px;
    letter-spacing: 0.1em;
  }
}

/* =========================
   カテゴリページ Pagination
========================= */

.sysPagination {
  max-width: 800px;
  margin: 0 auto 30px;
}

.sysPagination ul {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 22px;
  padding: 0;
  margin: 0;
  list-style: none;
}

/* 数字リンク */
.sysPagination a {
  position: relative;
  display: inline-block;
  padding: 4px 0;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.1em;
  color: #555;
  text-decoration: none;
  background: transparent !important;
  border: none !important;
  transition: color 0.3s ease;
}

/* hover */
.sysPagination a:hover {
  color: #9e0e30;
}

/* 現在のページ */
.sysPagination .sysCurrent {
  color: #9e0e30 !important;
  pointer-events: none;
}

/* 現在ページの下線（視認性UP） */
.sysPagination .sysCurrent::after {content: "";position: absolute;left: 0;bottom: -6px;width: 100%;height: 2px;background: #9e0e30;}
.sysPagination li:last-child a {font-size: 16px;font-weight: 600;letter-spacing: 0;color: #222;}
.sysPagination li:last-child a:hover {color: #9e0e30;}
.sysPagination li:last-child {margin-left: 14px;}


/*-----------------------
会員特典、その他の注文
------------------------*/
.support-section {
background: #ededed; /* サイト全体の背景色 */
  padding: 120px 15px;
}

.support-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 60px; /* 余白を広くとる */
}

.support-item {
  background: #ffffff;
  padding: 40px;
  border: none !important; 
  box-shadow: 0 10px 30px rgba(0,0,0,0.03); 
}

.support-ttl {
  font-family: "Cinzel", serif;
  font-size: 1.2rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  margin-bottom: 2rem;
  font-weight: 500;
  display: flex;
  flex-direction: column;
}

.support-ttl small {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  color: #666;
  margin-top: 8px;
  font-weight: 400;
}

.benefit-list {
  list-style: none;
  padding: 0;
  margin-bottom: 2rem;
}

.benefit-list li {
  font-size: 0.85rem;
  color: #444;
  margin-bottom: 0.8rem;
  padding-left: 1.2rem;
  position: relative;
}

.benefit-list li::before {
  content: "—";
  position: absolute;
  left: 0;
  color: #ccc;
}

.tel-link {
  display: block;
  font-family: "Cinzel", serif;
  font-size: 1.8rem;
  color: #111;
  text-decoration: none;
  margin: 1.5rem 0 0.5rem;
}

.btn-outline {
  display: inline-block;
  width: 100%;
  padding: 15px 0;
  border: 1px solid #111;
  color: #111;
  text-align: center;
  text-decoration: none;
  font-size: 0.8rem;
  letter-spacing: 0.1em;
  transition: all 0.3s;
}

.btn-outline:hover {
  background: #111;
  color: #fff;
}

.link-more {
  display: block;
  margin-top: 15px;
  font-size: 0.75rem;
  color: #555;
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* スマホ表示 */
@media (max-width: 900px) {
  .support-inner {
    grid-template-columns: 1fr;
    gap: 80px;
  }
  .support-item {
    text-align: center;
  }
  .benefit-list li {
    display: inline-block;
    width: 100%;
    text-align: left;
    max-width: 250px;
  }
}

/*---------------------------
イベント、レッスン
----------------------------*/
/* --- Common Settings --- */
.activity-section, .voice-section {width: 100%;overflow: hidden;}

/* --- Activity Section --- */
.activity-section {background: #ededed;padding: 80px 20px;}
.activity-container {max-width: 1100px;margin: 0 auto;height: 320px;display: flex;gap: 10px;}
.activity-item {flex: 1;position: relative;overflow: hidden;text-decoration: none;transition: flex 0.7s cubic-bezier(0.19, 1, 0.22, 1);}
.activity-item:hover {flex: 1.3; }
.activity-visual {position: absolute;inset: 0;background-size: cover;background-position: center;transition: transform 1.5s cubic-bezier(0.19, 1, 0.22, 1);}
.activity-item:hover .activity-visual {transform: scale(1.08); }
.activity-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.5s ease;
}
.activity-inner-text {
  text-align: center;
  color: #fff;
  padding: 0 20px;
}
.activity-item:hover .activity-overlay {
  background: rgba(0, 0, 0, 0.8);
}
.activity-h {
  font-family: "Cinzel", serif;
  font-size: 1.4rem;
  letter-spacing: 0.15em;
  color: #fff;
  margin-bottom: 8px;
}

.activity-p {
  font-size: 0.75rem;
  letter-spacing: 0.15em;
  color: rgba(255, 255, 255, 0.9);
  margin-bottom: 20px;
  font-weight: 300;
}

.activity-more {
  display: inline-block;
  font-size: 0.65rem;
  color: #fff;
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  padding-bottom: 3px;
  text-transform: uppercase;
  letter-spacing: 0.2em;
}
@media (max-width: 768px) {
 
  .activity-container {
    flex-direction: column;
    height: auto;
    gap: 15px;
  }

  .activity-item {
    flex: none;
    width: 100%;
    height: 250px;
  }

  .activity-item:hover {
    flex: none; 
  }

  .activity-h {
    font-size: 1.2rem;
  }
}


/* --- Voice Section --- */
.voice-section {
  background: #ffffff;
  padding: 80px 20px;
}

.voice-container {
  max-width: 900px;
  margin: 0 auto;
}

.voice-intro {
  text-align: center;
  margin-bottom: 50px;
}

.voice-ttl {
  font-family: "Cinzel", serif;
  font-size: 1.2rem;
  letter-spacing: 0.2em;
}

.voice-sub {
  font-size: 0.65rem;
  color: #555;
  margin-top: 5px;
}

.voice-flex-wrapper {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0;
  border-top: 1px solid #111;
  border-bottom: 1px solid #111;
  padding: 40px 0;
}

.voice-item {
  flex: 1;
  padding: 0 40px;
}

.v-badge {
  font-family: "Cinzel", serif;
  font-size: 11px;
  letter-spacing: 0.1em;
  color: #555;
  margin-bottom: 15px;
  text-transform: uppercase;
}

.v-quote {
  font-size: 0.95rem;
  line-height: 1.8;
  color: #111;
  font-weight: 500;
  margin-bottom: 20px;
  position: relative;
}

.v-attribute {
  font-size: 0.75rem;
  color: #555;
}

.v-separator {
  width: 1px;
  background-color: #eee;
  align-self: stretch;
}

.voice-action {
  text-align: center;
  margin-top: 40px;
}

.voice-link-text {
font-size: 0.75rem;
  letter-spacing: 0.2em;
  color: #111;
  text-decoration: none;
  text-transform: uppercase;
  display: inline-block;
  position: relative;
  padding-bottom: 8px;
}

.voice-link-text:hover {
  opacity: 0.6;
}
.voice-link-text::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: #111;
  transform: scaleX(0.4);
  transform-origin: left;
  transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.voice-link-text:hover::after {
  transform: scaleX(1);
}

/* スマホ表示 */
@media (max-width: 768px) {
  .voice-flex-wrapper {
    flex-direction: column;
    padding: 20px 0;
  }
  .voice-item {
    padding: 20px 0;
  }
  .v-separator {
    width: 100%;
    height: 1px;
  }
}

/* --- Responsive --- */
@media (max-width: 800px) {
  .activity-container {height: auto;gap: 10px;}
  .activity-item {height: 240px;}
  .activity-h { font-size: 1.6rem; }
  
  .voice-flex-wrapper {flex-direction: column;padding: 20px 0;}
  .voice-item {padding: 20px 0;}
  .v-separator {width: 100%;height: 1px; }
}

.social-nav {
  background: #ededed;
  padding: 100px 20px;
  border-top: 1px solid #ddd;
}

.social-nav-inner {
  max-width: 1000px;
  margin: 0 auto;
}

.social-nav-header {
  text-align: center;
  margin-bottom: 60px;
}

.social-ttl {
  font-family: "Cinzel", serif;
  font-size: 1.2rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: #111;
}

.social-grid {
  display: flex;
  justify-content: space-between;
  gap: 40px;
}

.social-link-box {
  flex: 1;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 30px 0;
  border: 1px solid transparent;
  transition: all 0.5s ease;
}

.social-link-box:hover {
  background: #fff;
  border-color: #eee;
}

.social-link-box .en {
  font-family: "Cinzel", serif;
  font-size: 1rem;
  letter-spacing: 0.15em;
  color: #111;
  margin-bottom: 10px;
}

.social-link-box .jp {
  font-size: 0.65rem;
  letter-spacing: 0.1em;
  color: #666;
}

/* スマホ対応 */
@media (max-width: 768px) {
  .social-grid {flex-direction: column;gap: 10px;}
  .social-link-box {padding: 20px 0;}
}




/* =================================================
   SITE FOOTER - flo.dance Original
   ================================================= */
.footer_all{background: #e5e5e5;}
.site-footer {
  padding: 120px 20px 60px;
  border-top: 1px solid #ffffff;
  color: #111;
  font-family: "Noto Sans JP", sans-serif;
}

.footer-container {
  max-width: 1000px;
  margin: 0 auto;
}

.footer-brand-row {
  text-align: center;
  margin-bottom: 80px;
}

.footer-logo-text {
  font-family: "Cinzel", serif;
  font-size: 2rem;
  letter-spacing: 0.3em;
  line-height: 1;
  margin-bottom: 12px;
}

.footer-tagline {
  font-size: 0.65rem;
  color: #777;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.footer-nav-groups {
  margin-bottom: 60px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  
  height: auto;
  min-height: min-content;
}

.footer-nav-line {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 15px 40px;
  align-items: center;
  width: 100%;
  margin: 30px auto;
}

.hover-flip {
  display: inline-block;
  position: relative;
  overflow: visible;     
  height: 20px;
  line-height: 20px;
  text-decoration: none;
  text-align: center;
  min-width: 80px;
}

.hover-flip span {
  display: block;
  transition: transform 0.4s cubic-bezier(0.19, 1, 0.22, 1);
  white-space: nowrap;
}

.hover-flip .en {
  font-family: "Cinzel", serif;
  font-size: 0.75rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #555;
}

.hover-flip .jp {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%); /* 英語の幅に対して中央に配置 */
  font-size: 0.7rem;
  color: #111;
  font-family: "Noto Sans JP", sans-serif;
  /* 日本語が長くても箱を切らない */
  visibility: hidden; 
  opacity: 0;
  transition: opacity 0.3s;
}

.hover-flip:hover .en {
  transform: translateY(-100%);
  opacity: 0;
}

.hover-flip:hover .jp {
  transform: translate(-50%, -100%);
  visibility: visible;
  opacity: 1;
}

.studio-nav .en {
  color: #666;
}

/* --- Information Row --- */
.footer-info-row {
  text-align: center;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  padding-top: 50px;
}

.footer-address {
  font-size: 0.7rem;
  color: #555;
  letter-spacing: 0.05em;
  margin-bottom: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.footer-address .sep {
  color: #ccc;
}

.phone-support {
  display: inline-flex;
  align-items: baseline; /* 文字の底辺（ベースライン）で揃える */
  gap: 5px;
}

.icon-phone::before {
  content: "📞"; /* または ☎︎ */
  font-size: 0.8rem;
  margin-right: 4px;
  opacity: 0.7;
}

.phone-support small {
  font-family: "Cinzel", serif;
  font-size: 0.6rem;
  letter-spacing: 0.1em;
  color: #888;
  text-transform: uppercase;
}

.phone-support .label {
  font-family: "Cinzel", serif;
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  color: #777;
  position: relative;
  background-color: unset;
}

.phone-support .time {
  font-size: 0.75rem;
  letter-spacing: 0.05em;
  line-height: 1;
}

.day-off {
  font-size: 0.55rem;
  color: #aaa;
  margin-left: 3px;
}

.footer-address .sep {
  color: #ccc;
  margin: 0 10px;
}

.copyright {
  font-size: 0.6rem;
  color: #777;
  letter-spacing: 0.1em;
}

/* --- Smartphone Adjustment --- */
@media (max-width: 768px) {
  .site-footer {
    padding: 80px 20px 70px;
  }
  .footer-logo-text {
    font-size: 1.6rem;
  }
  .footer-nav-line {
    max-width: 320px;
    margin: 0 auto 30px;
  }
  .footer-address {
    flex-direction: column;
    gap: 5px;
  }
  .footer-address .sep {
    display: none;
  }
}

/* =================================================
   1. おすすめ特集商品グリッド：変則配置＆カード視認性向上
   ================================================= */
.slide_sc, .slide_sc_b {
  margin: 160px auto 0 !important;
  max-width: 1200px;
  padding: 0 40px;
}
.slide_sc .sysItemBlock .sysHorizontal .sysItemName, 
.slide_sc_b .sysItemBlock .sysHorizontal .sysItemName,
.slide_sc .sysItemBlock .sysHorizontal .sysItemPrArea, 
.slide_sc_b .sysItemBlock .sysHorizontal .sysItemPrArea{
  display: none !important;
}
@media screen and (min-width: 769px) {
  .slide_sc .sysHeadline,.slide_sc_b .sysHeadline{padding: 0 !important;}

  /* 親要素のfloat解除とグリッド適用 */
  .slide_sc .sysContent .sysHorizontal, 
  .slide_sc_b .sysContent .sysHorizontal {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px 11px !important; /* 上下の間隔を広く */
    float: none !important;
  }

  /* 子要素（商品カード）の設定 */
  .slide_sc .sysContent .sysHorizontal li, 
  .slide_sc_b .sysContent .sysHorizontal li {
    float: none !important;
    width: auto !important;
    padding: 0px !important;
    list-style: none !important;
    transition: all 0.5s ease;
    background: transparent;
  }

  .slide_sc .sysContent .sysHorizontal li:hover, 
  .slide_sc_b .sysContent .sysHorizontal li:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
  }

  /* 3×2の変則リズム（ゆらぎ）を付与 */
  .slide_sc .sysHorizontal li:nth-child(1) { transform: translateY(0) translateX(0px) scale(1); }
  .slide_sc .sysHorizontal li:nth-child(2) { transform: translateY(0px) translateX(0px) scale(1); }
  .slide_sc .sysHorizontal li:nth-child(3) { transform: translateY(0px) translateX(0px) scale(1); }
  .slide_sc .sysHorizontal li:nth-child(4) { transform: translateY(0) translateX(0px) scale(1); }
  .slide_sc .sysHorizontal li:nth-child(5) { transform: translateY(0px) translateX(0px) scale(1); }
  .slide_sc .sysHorizontal li:nth-child(6) { transform: translateY(0px) translateX(0px) scale(1); }

  .slide_sc_b .sysHorizontal li:nth-child(1) { transform: translateY(0px) translateX(0px) scale(1); }
  .slide_sc_b .sysHorizontal li:nth-child(2) { transform: translateY(0px) translateX(0px) scale(1); }
  .slide_sc_b .sysHorizontal li:nth-child(3) { transform: translateY(0) translateX(0px) scale(1); }
  .slide_sc_b .sysHorizontal li:nth-child(4) { transform: translateY(0px) translateX(0px) scale(1); }
  .slide_sc_b .sysHorizontal li:nth-child(5) { transform: translateY(0px) translateX(0px) scale(1); }
  .slide_sc_b .sysHorizontal li:nth-child(6) { transform: translateY(0) translateX(0px) scale(1); }

  .slide_sc .sysItemBlock .sysHorizontal .sysItemImage, 
  .slide_sc_b .sysItemBlock .sysHorizontal .sysItemImage {
    background-color: #fff;
    padding: 5% !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
  }
  .slide_sc .sysItemBlock .sysHorizontal .sysItemImage img, 
  .slide_sc_b .sysItemBlock .sysHorizontal .sysItemImage img{
aspect-ratio: 3 / 4;
object-fit: cover;
object-position: center;}

  .slide_sc .sysItemBlock .sysHorizontal .sysItemImage::after, 
  .slide_sc_b .sysItemBlock .sysHorizontal .sysItemImage::after {
    content: "VIEW";
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    color: #e2e2e2;
    font-family: "Cinzel", serif;
    font-size: 18px;
    letter-spacing: 0.3em;
    opacity: 0;
    transition: opacity 0.4s ease;
  }

 .slide_sc .sysItemBlock .sysHorizontal li:hover .sysItemImage::after, 
 .slide_sc_b .sysItemBlock .sysHorizontal li:hover .sysItemImage::after{ opacity: 1; }
 .slide_sc .sysItemBlock .sysHorizontal li:hover .sysItemImage img, 
 .slide_sc_b .sysItemBlock .sysHorizontal li:hover .sysItemImage img { opacity: 0.7; transform: scale(1.05); }
}

/* =================================================
   4. メッセージコメント
   ================================================= */
.rec_coment_area {
  margin-bottom: 50px ;
}

.rec_coment {
  font-family: "Yu Mincho", serif !important;
  font-size: 14px !important;
  font-weight: 500 !important; /* 少し太くして読みやすく */
  line-height: 2.8 !important;
  letter-spacing: 0.15em !important;
  color: #222 !important;
  text-align: center;
}

/* =================================================
   3. リンクボタン（VIEW ALL）
   ================================================= */
.sysFuncText.slide_sc_button,
.slide_sc_button_b,.sysFuncText.slide_sc_button p,
.slide_sc_button_b p {
  text-align: center !important;
  /*padding-bottom: 160px !important;*/
}

.recommend_link {
  display: inline-block !important;
  visibility: visible !important;
  font-family: "Cinzel", serif !important;
  font-size: 12px !important;
  letter-spacing: 0.3em !important;
  color: #111 !important;
  text-decoration: none !important;
  text-transform: uppercase;
  border: 1px solid #111 !important;
  padding: 10px 30px !important;
  transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1) !important;
  position: relative;
}

.recommend_link::after {
  content: '→';
  margin-left: 15px;
  display: inline-block;
  transition: transform 0.4s ease;
}

.recommend_link:hover {
  background-color: #111 !important;
  color: #fff !important;
}

.recommend_link:hover::after {
  transform: translateX(10px);
}

@media screen and (max-width: 768px) {
  .recommend_link {
    width: 85%;
    padding: 16px 0 !important;
    font-size: 12px !important;
    letter-spacing: 0.2em !important;
  }
  .rec_coment {
    font-size: 14px !important;
    line-height: 2.2 !important;
  }
}

@media screen and (max-width: 768px) {
  .slide_sc, .slide_sc_b {
    margin: 60px auto 0 !important;
    padding: 0 10px !important;
  }

  .slide_sc .sysItemBlock ul.sysHorizontal,
  .slide_sc_b .sysItemBlock ul.sysHorizontal {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 35px 12px !important;
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
  }

  .slide_sc .sysHorizontal li,
  .slide_sc_b .sysHorizontal li {
    float: none !important;
    width: auto !important;
    margin: 0 !important;
    background: #fff !important;
    padding: 10px !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05) !important;
    box-sizing: border-box !important;
    list-style: none !important;
  }

  .slide_sc .sysHorizontal li:nth-child(odd) { transform: translateY(-28px) !important; }
  .slide_sc .sysHorizontal li:nth-child(even) { transform: translateY(28px) !important; }

  .slide_sc_b .sysHorizontal li:nth-child(odd) { transform: translateY(25px) !important; }
  .slide_sc_b .sysHorizontal li:nth-child(even) { transform: translateY(-25px) !important; }

  .slide_sc .sysItemName a,
  .slide_sc_b .sysItemName a {
    font-size: 11px !important;
    line-height: 1.4 !important;
    height: 2.8em !important;
    margin-top: 10px !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-align: center;
  }

  /* 5. 配送タグの調整（ルート指定） */
  .slide_sc .sysItemPrArea,
  .slide_sc_b .sysItemPrArea {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2px;
  }
  .slide_sc .sysItemPr,
  .slide_sc_b .sysItemPr {
    font-size: 10px !important;
    padding: 1px 4px !important;
    background: #f8f8f8 !important;
    color: #797979 !important;
    width: auto !important;
    margin: 4px 0 0 !important;
    border: none !important;
  }

  .recommend_link {
    width: auto !important;
    min-width: 160px !important;
    padding: 10px 24px !important;
    font-size: 10px !important;
    letter-spacing: 0.2em !important;
    border: 1px solid #d1d1d1 !important;
    margin: 40px auto 0 !important;
  }

  .recommend_link::after {
    font-size: 10px;
    margin-left: 10px;}

    .rec_coment_area {
  margin: 5px auto 0 ;
}
}

@media screen and (min-width: 950px) {
  #sysMain .slide_sc, 
  #sysMain .slide_sc_button,
  #sysMain .slide_sc_b, 
  #sysMain .slide_sc_button_b {
    display: inline-block !important;
    vertical-align: middle !important;
    float: none !important;
    clear: none !important;
  }

  #sysMain .slide_sc,
  #sysMain .slide_sc_b {
    width: 65% !important;
    margin: 30px 0 30px 5% !important;
  }

  #sysMain .slide_sc_button, 
  #sysMain .slide_sc_button_b {
    width: 25% !important;
    margin-left: 2% !important;
    text-align: left !important;
  }

  .slide_sc .sysHorizontal, .slide_sc_b .sysHorizontal {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 20px !important;
  }
}

.sysItemName a {
  display: block !important;
  white-space: normal !important;
  font-size: 14px;
  font-weight: 500 !important;
  color: #111 !important;
  line-height: 1.6 !important;
  margin-top: 20px;
  text-align: left;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.sysItemPrice{color: #666;font-size: 13px;font-family: Cinzel;}


/*--------------------------
商品コメントエリア(簡易商品説明)
--------------------------*/
/* 1. 商品説明全体のレイアウト *//*
.product-description {
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
}


.product-intro {
    margin-bottom: 50px;
}

.concept-title {
    font-size: 19px;
    font-weight: 400;
    letter-spacing: 0.12em;
    line-height: 1.6;
    margin-bottom: 24px;
    color: #000;
}

.description-text {
    font-size: 13px;
    line-height: 2.0;
    color: #444;
    margin-bottom: 18px;
}

.product-spec {
    border-top: 1px solid #000;
    padding-top: 30px;
}

.product-spec dl {
    margin: 0;
    overflow: hidden;
}

.product-spec dt {
    float: left;
    width: 160px; 
    font-size: 10px;
    color: #555;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    line-height: 2.2;
    clear: both;
}

.product-spec dd {
    margin-left: 140px; 
    font-size: 12px;
    color: #333;
    line-height: 2.2;
    margin-bottom: 12px;
    border-bottom: 1px solid #f2f2f2;
    padding-bottom: 12px;
}

.shipping-notice {
    margin-top: 30px;
}

.shipping-notice p {
    font-size: 12px;
    color: #444;
    line-height: 1.6;
    margin: 0;
}

@media screen and (max-width: 600px) {
    .product-spec dt {
        float: none;
        width: 100%;
        line-height: 1.5;
        margin-bottom: 4px;
    }
    .product-spec dd {
        margin-left: 0;
        line-height: 1.5;
        margin-bottom: 20px;
    }
}*/








/* 1. 商品説明全体のレイアウト */
.product-description {
    width: 100%;
    /* 右側カラム(50%)の中で窮屈にならないよう調整 */
    padding: 0 20px; 
    box-sizing: border-box;
}

.product-intro {
    margin-bottom: 60px;
}

.concept-title {
    font-size: 18px; /* わずかに絞って繊細に */
    font-weight: 500;
    letter-spacing: 0.15em;
    line-height: 1.8;
    margin-bottom: 30px;
    color: #000;
}

.description-text {
    font-size: 13px;
    line-height: 2.2; /* 行間を広げて「余白」を読ませる */
    color: #333;
    margin-bottom: 24px;
}

/* 3. スペック：境界線をシャープに */
.product-spec {
    border-top: 1px solid #000; /* 上部はあえて黒で締める */
    padding-top: 20px;
}

.product-spec dl {
    margin: 0;
}

.product-spec dt {
    float: left;
    width: 180px;
    font-size: 10px;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    line-height: 3.0;
    clear: both;
    margin: 5px 0;
}

.product-spec dd {
    font-size: 11px;
    color: #000;
    line-height: 3.0;
    margin: 5px 0 5px 140px;
    border-bottom: 1px solid #dcdcdc;
    padding-bottom: 0;
}

.product-notes {
    margin-top: 40px;
}

.product-notes p {
    font-size: 11px;
    color: #777;
    line-height: 1.8;
    margin-bottom: 8px;
    text-indent: -1em;
    padding-left: 1em;
}

.product-trust-mini {
    display: flex;
    margin-top: 40px;
    border-top: 1px solid #dcdcdc;
    padding-top: 20px;
}
/* ※ここにアイコン用のCSSを追加 */

@media screen and (max-width: 600px) {
    .product-description {
        padding: 0;
    }
    .concept-title {
        font-size: 16px;
    }
    .product-spec dt {
        float: none;
        width: 100%;
        line-height: 1.2;
        margin-top: 20px;
    }
    .product-spec dd {
        margin-left: 0;
        line-height: 2.0;
        padding-bottom: 10px;
        margin-top: 5px;
        text-align: center;
    }
}












/*------------------------------
商品詳細ページ お届け日数
--------------------------------*/


.sysDeliveryDate {
    margin-bottom: 40px !important;
    padding-top: 5px;
    border-top: 1px solid #f2f2f2;
    font-family: var(--body-font-family);
    border-bottom: 1px solid #000;
}

.sysDeliveryDateForm{margin-bottom: 20px;}
 
.sysDeliveryDateViewName {
    display: block;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: #555;
    margin-bottom: 15px;
}

.sysDeliveryDateViewName {
    visibility: hidden;
}
.sysDeliveryDateViewName::after {
    content: "ESTIMATED DELIVERY";
    visibility: visible;
    display: block;
    margin-bottom: -1em;
}

.sysDeliveryDateSelectPrefStateArea {
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.sysDeliveryDateSelectPrefStateLabel {
    font-size: 11px;
    color: #555;
}

#prefStateId {
    appearance: none;
    -webkit-appearance: none;
    border: none;
    border-bottom: 1px solid #ccc;
    background: transparent;
    font-size: 14px;
    padding: 2px 20px 2px 0;
    cursor: pointer;
    border-radius: 0;
    color: #333;
    background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 9l6 6 6-6"/></svg>');
    background-repeat: no-repeat;
    background-position: right center;
}

.sysDeliveryDateString {
    font-size: 12px;
    color: #555;
    line-height: 1.8;
}

.sysDeliveryDateShippingPeriodDatetime, 
.sysDeliveryDateEarliestDeliveryDate {
    font-weight: 500;
    color: #000;
    margin: 0 2px;
}

.sysDeliveryDateAppendComment {
    margin-top: 10px;
    font-size: 12px;
    color: #555;
    line-height: 1.5;
}

@media screen and (max-width: 600px) {
    #prefStateId {
        font-size: 14px;
    }
}

#sysItemDetail .sysRetailPrice {
    display: flex !important;
    margin:1rem 0 !important;
    align-items: baseline;
    justify-content: flex-end;
    gap: 15px;
    padding: 20px 0 0 0 !important;
    color: #1a1a1a !important;
    font-weight: normal !important;
    border-top: 1px solid #dcdcdc;
    position: relative;
}

#sysItemDetail .sysRetailPrice::before {
    content: "Price";
    display: inline-block;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.25em;
    color: #666;
}

#sysItemDetail .sysRetailPrice span.sysRetailPriceValue {
    color: #1a1a1a !important;
    letter-spacing: 0.02em;
    line-height: 1.2;
    display: inline-block;
    font-weight: 400 !important;
}

#sysItemDetail .sysRetailPriceValue {
    font-feature-settings: "palt" 1;
}

.sysCartInForm {
    padding: 0 40px 60px 40px;
    margin: 0;
}

#sysSelections {
    border-top: 1px solid #dcdcdc;
    padding-top: 30px;
    margin-bottom: 40px;
}

#sysSelections div {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: #555;
}

#sysSelections input[type="text"] {
    width: 100%;
    background: fbfbfb;
    border: none;
    border-bottom: 1px solid #999;
    padding: 10px 0;
    margin-top: 10px;
    font-size: 13px;
    border-radius: 0;
}

.sysSelectionDescription {
    font-size: 12px !important;
    color: #555 !important;
    line-height: 1.6;
    margin-top: 12px;
}


#sysNumber {
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    gap: 20px;
    font-size: 11px;
    color: #555;
    text-transform: uppercase;
}

#sysNumber select {
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
    border: none;
    border-bottom: 1px solid #333;
    padding: 0 20px 0 5px;
    font-size: 14px;
    border-radius: 0;
    cursor: pointer;
    background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2"><path d="M6 9l6 6 6-6"/></svg>');
    background-repeat: no-repeat;
    background-position: right center;
}

.sysNumArea { display: none; } 
/* 4. ポイント・小計（静かな案内） */
#sysGetPoint, #sysSubtotal {
    margin-bottom: 15px;
    font-size: 14px;
    color: #555;
    text-align: right;
}

#sysSubtotal .sysSubtotalPrice {
    font-size: 13px;
    color: #333;
    font-weight: 500;
}

.sysCartButton {
    width: 100% !important;
    height: 60px;
    background-color: #000 !important; /* 真っ黒 */
    color: #fff !important;
    border: none;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    cursor: pointer;
    transition: opacity 0.3s;
    margin-top: 20px;
    border-radius: 0;
}

.sysCartButton:hover {
    opacity: 0.9;
}

/* 6. お気に入り・SNS：主張を最小限に */
.sysWishListButton {
    width: 100%;
    background: transparent !important;
    border: 1px solid #333 !important;
    color: #333 !important;
    margin-top: 15px;
    height: 45px;
    font-size: 11px;
    letter-spacing: 0.1em;
}

div.orderArea > div.orderArea{
    display: flex !important;
    flex-direction: column !important;
    padding:0 0 0 30px;
}
.sysRetailPrice{color: #555; font-family: Cinzel;}

/* 各要素の順番を指定（数字が小さいほど上に来ます） */
.sysPr { order: 1; }           /* 1: 配送タグ */
.sysItemName { order: 2; }     /* 2: 商品名 */
.sysDescription { order: 7; }  /* 3: 商品説明 */
.sysDeliveryDate { order: 6; } /* 6: お届け可能日数 */
.sysRetailPrice { order: 4; }  /* 5: 価格 */
.sysExplanation { order: 3; }  /* 4: スペック */
.sysForm { order: 5; }         /* 7: 数量・カートボタン */

.orderArea .sysForm #sysWishlist{display: none;}


.top_serch .search-btns-unit input[type=submit]{display: none;}



/*-----TOP trust-----*/
/* セクション全体の背景と余白 */
.trust-container {
    background-color: #ededed;
    padding: 60px 0;
    overflow: hidden;
}

/* アイコンを並べるコンテナ */
.trust-inner {
    display: flex;
    justify-content: center;
    max-width: 1000px;
    margin: 0 auto;
    gap: 40px;
}

/* 各アイテムの基本設定 */
.trust-item {
    text-decoration: none;
    text-align: center;
    flex: 1;
    max-width: 240px;
    transition: transform 0.3s ease, opacity 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.trust-item:hover {
    transform: translateY(-3px);
    opacity: 0.8;
}

.icon-box {
    background-color: #ffffff;
    width: 80px;
    height: 80px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.03);
}

.icon-box img {
    width: 48px;
    height: 48px;
}

.trust-intro {
    text-align: center;
    margin-bottom: 30px;
}
.trust-label {
    font-size: 11px;
    letter-spacing: 0.3em;
    color: #999; /* 存在感を抑えたグレー */
    text-transform: uppercase;
    position: relative;
    display: inline-block;
    padding: 0 40px;
}

.trust-text {
  display: flex;
  flex-direction: column;
  align-items: center;}

.trust-label::before, .trust-label::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 30px;
    height: 1px;
    background: #ccc;
}
.trust-label::before { left: 0; }
.trust-label::after { right: 0; }

@media screen and (max-width: 768px) {
.trust-container {
        padding: 40px 20px;
        background-color: #f7f7f7;
    }

    .trust-inner {
        flex-direction: column;
        gap: 20px;
        overflow-x: visible;
    }

    .trust-item {
        min-width: 100%;
        flex-direction: row;
        text-align: left;
        background: none;
        border-bottom: 1px solid #e0e0e0;
        border-radius: 0;
        padding: 0 0 15px 0;
        box-shadow: none;
    }
    
    .trust-item:last-child {border-bottom: none;}

    .icon-box {
        background: none;
        width: 40px;
        height: 40px;
        margin-right: 15px;
        margin-bottom: 0;
        box-shadow: none;
    }
     .trust-text{align-items:flex-start;}
    }

    .icon-box img {width: 40px;height: 40px;}
    .trust-text .en {font-size: 11px;margin-bottom: 2px;}
    .trust-text .jp {font-size: 10px;}


/*---------　ご注文の流れ　---------*/

#flow .title span {
    display: block;
    font-size: 12px;
    color: #999;
    letter-spacing: 0.1em;
    margin-top: 5px;
}
.step_num {
    font-family: 'Georgia', serif;
    font-size: 24px;
    color: #a38a5e; /* ゴールド系アクセント */
    border-bottom: 1px solid #a38a5e;
    display: inline-block;
    margin-bottom: 10px;
}
.step_ttl {
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0.1em;
    margin-bottom: 10px;
    color: #333;
}
.sub_note {
    display: block;
    font-size: 10px;
    color: #888;
    margin-top: 8px;
    line-height: 1.4;
}

/*---------　お支払い　---------*/
.pay_ttl {
    font-size: 15px;
    font-weight: bold;
    border-left: 3px solid #a38a5e;
    padding-left: 10px;
    margin-bottom: 15px;
    color: #333;
}
.pay_ttl span {
    font-size: 11px;
    color: #a38a5e;
}
.bank_info {
    background: #f9f9f9;
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 10px;
    border: 1px solid #eee;
}
.bank_name {
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 5px;
}
.bank_details {
    font-family: monospace;
    line-height: 1.6;
}
.amapay_box {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px dotted #ccc;
}
.b2b_box {
    background: #fdfaf5;
    border: 1px solid #f3ede2;
    padding: 15px !important;
    border-radius: 12px;
}
.cvs_links a {
    display: inline-block;
    padding: 5px 12px;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 11px;
    color: #666;
    margin-right: 5px;
    margin-top: 5px;
    text-decoration: none;
}

/*---------　お届け、梱包　---------*/
.shipping_fee {
    background: #fff;
    border: 2px solid #a38a5e;
    padding: 20px;
    border-radius: 12px;
    text-align: center;
    margin-bottom: 15px;
}
.main_fee {
    font-size: 20px;
    font-weight: bold;
    color: #a38a5e;
    margin-bottom: 10px;
}
.season_info {
    margin-top: 15px;
}
.season_ttl {
    font-size: 12px;
    font-weight: bold;
    color: #fff;
    background: #333;
    display: inline-block;
    padding: 2px 8px;
    margin-bottom: 5px;
}
.deli_table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}
.deli_table th, .deli_table td {
    padding: 12px 10px;
    border-bottom: 1px solid #eee;
    text-align: left;
}
.deli_table th {
    width: 30%;
    background: #f9f9f9;
    color: #666;
    font-weight: normal;
}

/*---------　立て札、メッセージカード　---------*/
.logo_send {
    text-align: center;
    margin-top: 15px;
}
.btn_mail {
    display: inline-block;
    background: #a38a5e;
    color: #fff !important;
    padding: 10px 20px;
    border-radius: 5px;
    text-decoration: none;
    font-size: 13px;
    font-weight: bold;
    transition: 0.3s;
}
.btn_mail:hover {
    background: #333;
}
.sample_area {
    background: #fff;
    padding: 30px 20px !important;
    margin-top: 40px;
    border-radius: 12px;
}
.entry_guide {
    margin-top: 40px;
    border-top: 1px dotted #ccc;
    padding-top: 30px !important;
}
.entry_guide img {
    border: 1px solid #eee;
    margin-top: 10px;
}

.guide_card {
    background: #fff;
    border-radius: 12px;
    padding: 20px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    margin-bottom: 20px;
}
.card_ttl {
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    color: #a38a5e;
    margin-bottom: 15px;
}
.format_box dl {
    font-size: 12px;
    border-bottom: 1px dotted #ccc;
    padding-bottom: 10px;
    margin-bottom: 15px;
}
.format_box dt {
    font-weight: bold;
    color: #333;
    margin-top: 8px;
}
.format_box dd {
    color: #666;
    margin-left: 0;
    padding-left: 14px;
    position: relative;
}
.format_box dd::before {
    content: "・";
    position: absolute;
    left: 0;
}
.memo_box {
    background: #f9f9f9;
    padding: 15px;
    border-radius: 6px;
}
.memo_label {
    font-size: 10px;
    font-weight: bold;
    color: #999;
    margin-bottom: 5px;
    text-transform: uppercase;
}
.memo_content {
    font-family: "Hiragino Sans", sans-serif;
    font-size: 12px;
    line-height: 1.6;
    color: #444;
}

/*---------　お届け商品確認サービス　---------*/

#flow .title span, 
#payment_navi .title span, 
#delivery .title span, 
#tatefuda .title span, 
#member_section .title span, 
#mail_service .title span 
#biz .title span {
    display: block;
    font-size: 12px;
    color: #999;
    letter-spacing: 0.1em;
    margin-top: 5px;
}

.guide_pay_ttl {
    font-size: 15px;
    font-weight: bold;
    border-left: 3px solid #a38a5e;
    padding-left: 10px;
    margin-bottom: 15px;
    color: #333;
    text-align: left;
}

/* --- ご注文の流れ(ORDER FLOW) --- */
.guide_step_num {
    font-family: 'Georgia', serif;
    font-size: 24px;
    color: #a38a5e;
    border-bottom: 1px solid #a38a5e;
    display: inline-block;
    margin-bottom: 10px;
}
.guide_step_ttl {
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0.1em;
    margin-bottom: 10px;
    color: #333;
}

/* --- お支払い(PAYMENT) --- */
.guide_bank_info {
    background: #f9f9f9;
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 10px;
    border: 1px solid #eee;
}
.guide_bank_name {
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 5px;
}
.guide_b2b_box {
    background: #fdfaf5 !important;
    border: 1px solid #f3ede2 !important;
    padding: 20px !important;
    border-radius: 12px;
}

/* --- 立札・入力ガイド(TAG & GUIDE) --- */
.guide_card {
    background: #fff;
    border-radius: 12px;
    padding: 20px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    margin-bottom: 20px;
}
.guide_format_box dl {
    font-size: 12px;
    border-bottom: 1px dotted #ccc;
    padding-bottom: 10px;
    margin-bottom: 15px;
}
.guide_format_box dt {
    font-weight: bold;
    color: #333;
    margin-top: 8px;
}
.guide_memo_box {
    background: #f9f9f9;
    padding: 15px;
    border-radius: 6px;
}
.guide_memo_content {
    font-size: 12px;
    line-height: 1.6;
    color: #444;
}

/* お届け後確認サービス専用ブロック */
.ms_photo_flex { display: flex; gap: 20px; margin: 30px 0; }
.ms_photo_item { flex: 1; }
.ms_photo_card { background: #fff; padding: 10px; border: 1px solid #eee; box-shadow: 0 4px 10px rgba(0,0,0,0.03); }
.ms_photo_label { font-size: 11px; font-weight: bold; color: #a38a5e; border-bottom: 1px solid #f3ede2; margin-bottom: 10px; padding-bottom: 5px; text-align: center; }
.ms_info_box { background: #fdfaf5; padding: 35px 20px; border-radius: 12px; text-align: center; margin-top: 20px; }
.ms_cta_area { margin-top: 25px; }
.ms_cta_text { font-size: 15px; margin-bottom: 15px; }
.ms_cta_text strong { color: #d44d4d; font-size: 22px; }
.ms_btn_gold { display: inline-block; background: #333; color: #fff !important; padding: 16px 50px; border-radius: 4px; text-decoration: none; font-size: 15px; font-weight: bold; transition: 0.3s; box-shadow: 0 4px 6px rgba(0,0,0,0.1); }
.ms_btn_gold:hover { background: #a38a5e; transform: translateY(-2px); }
.ms_sub_note { font-size: 11px; color: #888; margin-top: 15px; line-height: 1.5; }
@media screen and (max-width: 768px) { .ms_photo_flex { flex-direction: column; } }

/*---------　会員特典　---------*/
.mb_flex { display: flex; flex-wrap: wrap; gap: 15px; margin: 30px 0; }
.mb_item { flex: 1; min-width: calc(50% - 15px); background: #fff; padding: 20px; border: 1px solid #eee; border-radius: 8px; box-sizing: border-box; }
.mb_ttl { font-size: 14px; font-weight: bold; color: #a38a5e; margin-bottom: 8px; }
.mb_text { font-size: 12px; line-height: 1.6; color: #666; }
.mb_rank_section { margin: 40px auto; text-align: center; }
.mb_sub_ttl { font-size: 13px; letter-spacing: 0.15em; color: #999; margin-bottom: 15px; }
.mb_table_wrapper { max-width: 450px; margin: 0 auto; border: 1px solid #eee; border-radius: 8px; overflow: hidden; }
.mb_rank_table { width: 100%; border-collapse: collapse; font-size: 12px; }
.mb_rank_table th, .mb_rank_table td { padding: 12px; border-bottom: 1px solid #f9f9f9; }
.mb_rank_table th { background: #fafafa; color: #888; font-weight: normal; }
.rank_silver { background: #fdfdfd; }
.rank_gold { background: #fffbf0; color: #b8860b; font-weight: bold; }
.rank_platinum { background: #f4f8ff; color: #4682b4; font-weight: bold; }
@media screen and (max-width: 480px) { .mb_item { min-width: 100%; } }


/* ビジネスサポート専用スタイル */
.biz_concept { margin-bottom: 60px; }
.biz_main_copy { font-size: 18px; line-height: 1.8; color: #333; margin-bottom: 20px; }
.biz_main_copy strong { color: #a38a5e; border-bottom: 1.5px solid #a38a5e; }
.biz_image_frame { padding: 10px; background: #fff; border: 1px solid #eee; box-shadow: 10px 10px 0 #fdfaf5; }

.biz_service_grid { background: #f9f9f9; padding: 40px 20px; border-radius: 12px; margin-bottom: 60px; text-align: center; }
.biz_feature_list { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr) ;gap: 20px; text-align: left; max-width: 800px; margin: 30px auto 0; }
.biz_feature_list li { background: #fff; padding: 20px; border-radius: 6px; border-left: 4px solid #a38a5e; box-sizing: border-box; }
.biz_feature_list li strong { display: block; font-size: 14px; color: #a38a5e; margin-bottom: 5px; }
.biz_feature_list li span { font-size: 12px; color: #666; line-height: 1.5; }

.biz_quality_section { margin-bottom: 60px; }
.biz_quality_ttl { font-size: 16px; font-weight: bold; margin-bottom: 15px; color: #333; }
.biz_contact_box { text-align: center; border-top: 1px solid #eee; padding-top: 40px; margin-bottom: 5rem;}

@media screen and (max-width: 768px) {
    .biz_feature_list { grid-template-columns: 1fr; }
    .biz_main_copy { font-size: 16px; }
    .reverse { display: flex; flex-direction: column-reverse; }
}


/* トップに戻るボタンの初期状態 */
#pagetop {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s, transform 0.3s;
  transform: translateY(10px);
}

#pagetop.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0); 
}

/* 特商法メールアドレスのスパム対策 */
.at-mark::before {
  content: "＠";
  font-family: sans-serif;
  margin: 0 1px;
}
/* 緊急のお知らせ */
.Urgent_notice{;}
.emergency-alert {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #fff3f3; /* 薄い赤（警告色） */
  color: #d00;               /* 濃い赤（文字） */
  padding: 12px 20px;
  border-bottom: 1px solid #fcc;
  position: relative;
  z-index: 9999;
}

.alert-content {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
}

.alert-content p {
  margin: 0;
  font-size: 13px;
  font-weight: bold;
  line-height: 1.4;
}

/* バツボタンの見た目 */
.close-btn {
  background: none;
  border: none;
  font-size: 24px;
  color: #d00;
  cursor: pointer;
  padding: 0 5px;
  line-height: 1;
  transition: opacity 0.2s;
}

.close-btn:hover {
  opacity: 0.6;
}

/* スマホ用の調整（iPhone 17など） */
@media screen and (max-width: 430px) {
  .alert-content p {
    font-size: 12px;
  }
}
#top .sysItemPrice{text-align: left;}
#test #sysWrap{padding-top: 0;}



/* 親要素のクラスも含めて記述し、優先度を最大化します */
div.sysItemImages .sysMainImage {
  display: none !important;
}

/* ulタグの横並び設定を強制解除 */
div.sysItemImages ul.sysImageList {
  display: flex !important;
  flex-direction: column !important; /* 縦並びを強制 */
  gap: 0px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  width: 100% !important;
  height: auto !important;
}

/* liタグの幅とフロートを強制解除 */
div.sysItemImages ul.sysImageList li {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  margin: 0 0 5px 0 !important;
  padding: 0 !important;
  display: block !important;
}

/* 画像自体の枠線やサイズを強制固定 */
div.sysItemImages ul.sysImageList li img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  margin: 0 auto !important;
  border: none !important;       /* グレーの枠線を消す */
  outline: none !important;      /* 選択時の青枠などを消す */
  box-shadow: none !important;
  cursor: default !important;
}

/* aishipRの「現在の画像」を示す枠線クラスも無効化 */
div.sysItemImages ul.sysImageList li.sysCurrent img {
  border: none !important;
  outline: none !important;
}
@media (max-width: 768px) {
  /* 親のpadding: 0 1rem (16px相当) を打ち消して画面端まで広げる */
  div.sysItemImages {
    margin-left: -1rem !important;  /* 左に1remはみ出させる */
    margin-right: -1rem !important; /* 右に1remはみ出させる */
    width: calc(100% + 2rem) !important; /* はみ出した分、幅を広げる */
    overflow: hidden; /* 余計な横揺れを防止 */
  }

  div.sysItemImages ul.sysImageList {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch;
    
    /* スクロールした時、最初と最後の画像が端にベタっとならないよう調整 */
    padding: 0 10px 20px !important; 
    gap: 5px !important;
    
    /* 標準のスクロールバーを非表示にする（デザイン性アップ） */
    scrollbar-width: none;
  }
  div.sysItemImages ul.sysImageList::-webkit-scrollbar {
    display: none;
  }

  div.sysItemImages ul.sysImageList li {
    /* 1枚を大きく見せつつ、次の画像をチラ見せして「スワイプできる感」を出す */
    width: 90% !important; 
    flex: 0 0 auto !important;
    scroll-snap-align: center !important;
  }
}
/* --- 1. メイン表示エリアの完全非表示 --- */
div.sysItemImages .sysMainImage,
div.sysItemImages .sysImageDescription {
  display: none !important;
}

/* --- 2. 画像リストのフルワイド設定（スマホ・PC共通） --- */
div.sysItemImages ul.sysImageList {
  display: flex !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  width: 100% !important;
}

/* --- 3. 【PC版】縦に並べる設定 --- */
@media (min-width: 769px) {
  div.sysItemImages ul.sysImageList {
    flex-direction: column !important;
    gap: 5px !important; /* PCはゆったりと間隔をあける */
  }
  div.sysItemImages ul.sysImageList li {
    width: 100% !important;
    margin-bottom: 0 !important;
  }
}

/* --- 4. 【スマホ版】横スワイプ＆フルワイド設定 --- */
@media (max-width: 768px) {
  /* 親の余白を打ち消して画面端まで広げる */
  div.sysItemImages {
    margin-left: -1rem !important;
    margin-right: -1rem !important;
    width: calc(100% + 2rem) !important;
    overflow: hidden !important;
  }

  div.sysItemImages ul.sysImageList {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch;
    /* 左右に余白を作り、2枚目以降をチラ見せする助走区間 */
    padding: 0 1rem 20px !important; 
    gap: 10px !important;
    scrollbar-width: none; /* Firefox用 */
  }

  div.sysItemImages ul.sysImageList::-webkit-scrollbar {
    display: none; /* Chrome/Safari用 */
  }

  div.sysItemImages ul.sysImageList li {
    width: 92% !important; /* 1枚を大きくしつつ、右端に次をチラ見せ */
    flex: 0 0 auto !important;
    scroll-snap-align: center !important;
  }
}

/* --- 5. 画像自体のスタイル --- */
div.sysItemImages ul.sysImageList li img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border: none !important;
  outline: none !important;
  pointer-events: none !important; /* JS干渉防止 */
}

/* --- 6. JSで追加する「説明文」のデザイン --- */
.custom-image-description {
  margin-top: 10px !important;
  margin-bottom: 20px !important; /* 次の画像との余白 */
  font-size: 12px !important;    /* 少し控えめなサイズ */
  line-height: 1.5 !important;
  color: #555 !important;        /* どぎつくないグレー */
  text-align: center !important;  /* 中央寄せ（お好みでleftに） */
  padding: 0 10px !important;
  letter-spacing: 0.05em !important;
}

/* スマホ版のスワイプ時は左寄せの方が見やすい場合が多いです */
@media (max-width: 768px) {
  .custom-image-description {
    text-align: left !important;
    font-size: 11px !important;
  }
}
/* aishipRの選択中枠（sysCurrent）を完全に殺す */
div.sysItemImages ul.sysImageList li.sysCurrent img {
  border: none !important;
  outline: none !important;
}










/*---------------------------
商品一覧ページ無限スクロール
----------------------------*/

/* もっと見るボタンのコンテナ */
.view-more-container {
    text-align: center;
    margin: 60px 0 100px;
}

/* ボタン本体 */
.view-more-btn {
    appearance: none;
    background-color: transparent;
    border: 1px solid #000;
    color: #000;
    padding: 18px 100px;
    font-size: 11px;
    letter-spacing: 0.3em;
    cursor: pointer;
    transition: all 0.4s ease;
}

.view-more-btn:hover {
    background-color: #000;
    color: #fff;
}
@media screen and (max-width:600px){
.sysDisplayMobileNone{  display:none !important;}
p{font-size:14px;}

/* 10-0 Only Smartphone
 *----------------------------------------------------------------------*/
.sp{ display: block;}
#sysWrap{ margin-top:50px; padding:0;}
#top #sysWrap{ margin-top: 0rem;}
#sysMain,#sysAside{ width: 100%!important;}
#sysFormIndex div#sysMain,
#sysFormConfirm div#sysMain,
#sysFormThanks div#sysMain{ width: 98% !important; padding:20px 10px 30px !important; margin:10px auto;}
.sysCart #sysMain,
.sysMypage div#sysMain,
.sysMemberRegister #sysMain,
#sysItemSearch div#sysMain{
    width: 98% !important;
  padding:20px 10px 30px !important;
    margin:0 auto;
}
.sysCart #sysMain {
  width: 94% !important;
  padding: 0 !important;
  margin: 0 auto;
}
.sysFormField label{display: block;}
#sysFormIndex .txtBlock{text-align: left;}
#sysMain{ margin-top: 0;}
.grid-col {
  float: none;
  width: 100%!important;
        margin-left: 0;
}
/*Header */
article{ padding: 1rem;}

/* Archive Thumbnail Item */
.sysItemList ul.sysThumbnail { font-size: small;}
.sysItemList ul.sysThumbnail input { font-size: x-small;}

/* Order Area */
.orderArea { letter-spacing: normal;padding: 0;}
.orderArea > div { width: 100%; padding: 0; float: none;}
div.orderArea > div.orderArea{padding: 0 15px;}

/*header検索ボックス*/
.h_search{  margin-top:30px;}

/***********************************
  商品詳細ページ
***********************************/


.sysThumbnail{padding: 0 !important;}
#sysItemCategory .sysItemName{padding-top: 5px;}
.sysItemName a{font-size: 12px; margin-top: 10px;}
#sysItemCategory .sysRetailPrice{font-size: 11px;}
.sysCartInForm{padding: 0 0 20px;}

#sysItemDetail .sysItemName h1{
  font-size:20px;
  padding-bottom:5px;
  margin-bottom:20px;
}
#sysItemDetail .sysForm select{
  height:30px;
  text-align:center;
}
#sysItemDetail .sysSelectionDescription{margin: 5px 0 10px;}
#sysItemDetail #sysNumber{text-align: right;}


#sysItemDetail .sysNumArea button {
  width: 35%;
}

#sysItemCategory #sysMain{padding: 5px;}
.sysAddSelection{font-size: 12px;}
.sysSelectionDescription{font-size: 10px;}

.sysPr{margin-top: 10px;}
.sysPr span{
  width: 49%;
  font-size: 16px;
}
#sysItemDetail .sysForm select {
  min-width: 300px;
  display: inline-block;
  float: right;
}
#sysItemDetail .sysNumber select { min-width: 100px;}
.orderArea { flex-direction: column;}
.iteminfo_dec { width: 100%;}
.iteminfo { padding: 1rem 0;}


/*商品ページ用おすすめ商品*/
.itempage_recommend .sysItemBlock .sysHorizontal li{
  width:50%;
  padding:0 5px;
  margin-bottom:20px;
}
.itempage_recommend .sysItemName{ font-size:12px;}
.itempage_recommend .sysItemPrice{ font-size:11px;}

/*for demo 2017/01/12*/
.sysExplanation{ float: none; width: 100%;}
span.sp_newline{display: block}

/***********************************
  ヘッダー
***********************************/
#sysHeader{
  width: 100%;
  margin: 0px auto;
}
.top_serch{ display: none;}
.h_inner{margin: 0px 0 0;}
.header_h1_under a, .header_h1 a{
  display: none;
}
.head_title{
  font-size: 10px;
  font-weight: bold;
  height: 20px;
  line-height: 20px;
  letter-spacing: 1px;
}
.header_sp{
  width: 95%;
  margin: 0 2.5%;
  position: relative;
  text-align: center;
}
.header_sp #navBtn{
  position: absolute;
  top: 6px; right: 0;
}
.header_sp .spCart{
  position: absolute;
  top: 6px; left: 0;
}
.header_sp #navBtn img, .header_sp .spCart img{
  width: 40px;
  height: 40px;
}
.header_sp .spLogo img{
  width: 140px;
}
#headNavigation {
  display: none;
}
.header_sp {
  position: fixed;
}
.sysContent {
  padding: 0!important;
}

/***********************************
  カート情報
***********************************/
#cartInfo{display: none;}

/***********************************
  ナビゲーション
***********************************/
#headNavigation .pcnone{display: block;}
#headNavigation .spnone{display: none;}
#headNavigation li.active{background: #fff;}
.h_navi{
  width: 100%;
  height: 40px;
}
#headNavigation li.tab1{
  width: 25%;
  margin-top:10px;
}
#headNavigation li.tab1 a{
  font-size: 12px;
  line-height: 15px;
  position: relative;
}
#headNavigation li.tab1:nth-of-type(5){
  display:none;
}


/*ナビゲーショントグル*/
/*.toggleNav{
  display: none;
  width: 100%;
  position: absolute;
  height: 0px;
  top: 39px; left:0;
  z-index: 110;
  background: rgba(0,0,0,0);
  box-shadow:0px 0px 0px 0px #ccc;
  -moz-box-shadow:0px 0px 0px 0px #ccc;
  -webkit-box-shadow:0px 0px 0px 0px #ccc;
}
.toggleNav:hover{overflow: visible !important;}
#headNavigation ul.tab{
  position: relative;
}
.tabmenu .border:after{
  content:none;
}
.tabmenu li.tab1{
  position: static;
  border-right:1px solid #000;
}
.tabmenu li.tab1:nth-child(4){
  border-right:none;
}
.tabmenu li.tab1 a{font-size:14px;}
.tabmenu ul:after{
  display: block;
  content: "";
  clear: both;
}
.tabmenu li.tab2{
  width: 100%;
  height:auto;
  text-align: left;
  line-height:1;
  font-size: 18px;
  border-bottom: 1px dotted #ddd;
  position: relative;
  background: rgba(255,255,255,1);
}
.tabmenu li.tab2 a{
  display: block;
  position: relative;
  padding: 5px 15px;
  font-size: 14px !important;
  line-height: 40px !important;
  font-weight: bold;
}
#headNavigation li.tab2 a:after{display: none;}
.tabmenu li.tab2 a i{
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top:-7px;
}

.h_spnavi{
  position: fixed;
  width: 100%;
  height: 100vh;
  top: 0px; left: 0;
  background: #fff;
  z-index: 150;
  color: #444;
  display: none;
  overflow: auto;
}
#spNaviWrap{
  position: absolute;
  width: 100%;
  top: 0px; left: -100%;
  background: #fff;
  z-index:  200;
  padding: 30px 10px 6rem;
  overflow: scroll;
}*/

/***********************************
  ログイン情報
***********************************/
.h_login .sysHeadline,.h_search .sysHeadline{
  text-align: center;
  font-size: 18px;
  margin-bottom: 10px;
}
.h_login .sysContent{text-align: center;}
.h_login .sysFormItem{margin-bottom: 10px;}
.h_login .sysFormLabel{
  display: block;
  height: 20px;
  text-align: left;
  margin-bottom: 3px;
}
.h_login .sysLoginButton{
  width: 100%;
  margin: 10px 0%;
  background:#9E0E30;
  height: 40px;
  line-height: 10px;
  border-radius: 0;
}
.h_login li{
  border:1px solid #444;
  margin-bottom: 10px;
  height: 35px;
  line-height: 32px;
  text-align: center;
}
.h_login li a{
  padding: 0px 5px 5px 0px;
}

/***********************************
  ナビゲーションメニュー
***********************************//*
#closeMenu{
position: fixed;
top: 15px;
right: 15px;
text-align: center;
width: 180px;
height: 30px;
background-color: #ffffff;
border: solid 1px #bababa;
z-index:1;
}
#closeMenu span{
  margin: 0 10px;
  display: inline-block;
  cursor:pointer;
}
#closeMenu2{
  text-align: center;
  margin: 20px 0;
  border: 1px solid #444;
  height: 40px;
  line-height: 40px;
  cursor:pointer;
}
#closeMenu2 span{
  display: inline-block;
  margin: 0 10px;
}
#spNavMenu .navTitle{
  text-align: center;
  font-size: 18px;
  font-weight: bold;
}
#spNavMenu{margin: 30px 0 0;}
#spNavMenu .spMenuList{
  height: auto;
  line-height: 40px;
  font-size: 15px;
  position: relative;
  border-bottom: 1px solid #aaa;
}
#spNavMenu .spMenuList a{
  display: block;
  padding-left: 15px;
}
#spNavMenu .spToggleNav{
  overflow: hidden;
}
#spNavMenu .spToggleNav li{
  height: 45px;
  line-height: 45px;
  border-bottom: 1px dotted #aaa;
}
#spNavMenu .spToggleNav li{padding-left: 20px;}
#spNavMenu .spToggleNav li:first-child{border-top: 1px solid #aaa}
#spNavMenu .spToggleNav li:last-child{border-bottom: 0;}*/

/***********************************
  フッター
***********************************/
/*.footer .f_copy{
  padding: 10px 5px;
  font-size: 10px;
}
.footer_bigmenu {
  display: none;
}
.bottomnav {
  flex-wrap: wrap;
  justify-content:flex-start;
}
.bottomitem {
  width: 43%;
  margin: 10px;
}
.footer_menu{
  margin-top: 0;
}*/
/*sns*/
/*.othersite { flex-direction: column;}
.otheritem { width: 90%;margin: 1rem auto 0;}
.sns {
  justify-content: center;
}


@media screen and (max-width:320px) {
  .footer .telephone .telephone02 a {
      font-size: 27px;
  }
  .footer .f_gnav:nth-of-type(2) li:nth-child(3) a{
    font-size: 10px;
  }
}*/

/***********************************
  共通パーツ
***********************************/
.sysTitle{
  width: 100%;
  margin: 30px auto!important;
  position: relative;
  text-align: center;
  font-size: 13px;
  letter-spacing: auto;
}
.sysTitle b{
  display: block;
  font-size: 12px;
  text-align: center;
  margin-top: 5px;
}
.sysTitle span {
  position: relative;
  z-index: 2;
  display: inline-block;
  margin: 0 2.5em;
  padding: 0 10px 0 20px;
  background-color: #fff;
  text-align: center;
  font-weight: bold;
}
.sysTitle::before {
  position: absolute;
  top: 50%;
  z-index: 1;
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background-color: #222222;
}

.sysTitle span{
  position: relative;
  z-index: 2;
  display: inline-block;
  margin: 0;
  padding: 0;
  /*background-color: #fff;*/
  text-align: center;
}
.sysTitle::before, .sysHeadline::before {height: 0px;}
.contentsWrap{
  width: 90%;
  margin: 0 auto;
}

/***********************************
  特商法テーブルレイアウト
***********************************/  
.p-law .sysTitle{width: 90%;}
#main_tradelaw, .main_tradelaw{
  width: 100%;
  max-width: 1100px;
  margin: 0 auto 30px;
  border: 0px solid #ddd;
}
#main_tradelaw dl , .main_tradelaw d{
  width: 100%;
  background: #ededed;
  border-bottom: 0px dotted #bfbfbf;
  overflow: hidden;
}
#main_tradelaw dl:after, .main_tradelaw dl:after{
  display: block;
  content: "";
  clear: both;
}
#main_tradelaw dt, .main_tradelaw dt{
  width: 100%;
  padding: 15px 0 15px 20px;
  float: none;
  clear: both;
  font-weight: bolder;
}
#main_tradelaw dd, .main_tradelaw dd{
  margin-left: 0px;
  padding: 15px;
  background: #fff;
}
.shipFee{
  max-width: 1100px;
  margin: 20px auto
}
.shipFee .tableTitle{
  text-align: center;
  font-size: 12px;
}
table.shipFeeTable {
  width: 100%;
  margin: 0%;
  border-collapse: collapse;
  margin-bottom: 30px;
  text-align: left;
  line-height: 1.5;
}
.spThead{display: block;}
.pcThead{display: none;}
table.shipFeeTable thead th {
  font-size: 12px;
  padding: 10px;
  font-weight: bold;
  vertical-align: top;
  color: #fff;
  text-align: left;
}
table.shipFeeTable tbody th {
  font-size: 12px;
  display: block;
  width: 100%;
  border: 0px solid #ddd;
}
table.shipFeeTable tbody .sum{
  position: relative;
  padding: 25px 10px;
  text-align: center;
}
table.shipFeeTable tbody .sum i{
  position: absolute;
  color: #888;
  font-size: 35px;
  left: 0;
  right: 0px;
  margin: auto;
  bottom: -20px;
  z-index: 20;
}
table.shipFeeTable td {
  display: block;
  width: 100%;
  vertical-align:top;
  border: 0px;
}
table.shipFeeTable b{
  color: #D42E30;
  display: inline-block;
  padding: 0 3px;
  font-size: 1.2em;
}

/***********************************
  お買物ガイド
***********************************/



/***********************************
  ご利用ガイド
**********************************
.f_guide{margin-top: 30px;}
.f_guide .sysContent{
  width: 100%;
  margin: 0 auto;
  text-align: center;
}
.f_guide .Title{
  font-size: 20px;
  text-align: center; 
  padding: 20px 0 0px;
}
.f_guide .guideBlock{
  width: 95%;
  margin: 50px 2.5%;
  display: block;
  padding: 30px 0px 5px;
  border: 1px solid #424242;
  border-radius: 10px;
  position: relative;
}
.f_guide .guide01{padding-right: 0px;}
.f_guide .guide02{padding-left: 0px;}
.f_guide .guideTitle{
  width: 200px;
  margin: auto;
  text-align: center;
  margin-bottom: 10px;
  position: absolute;
  top: -15px; left:0; right: 0;
  background: #fff;
  font-size: 15px;
}
.f_guide p{
  font-size: 15px;
  line-height: 20px;
  margin: 5px 0  !important;
  text-align: left;
        padding: 0 10px 0 15px;
}
.f_guide img{width: 100%;}
.f_guide .mt{margin-top: 10px;}
.f_guide .smaller{font-size: 12px;}
.f_guide a.f_guide_btn{
  margin: 20px auto;
  float: none;
}
.f_guide .freedial{
  font-size:30px;
}*/

/* カート内商品数表示*/
button.itemCount2{
  display: none;
  position: absolute;
  bottom: 0px;
  right: 0px;
  background: rgba(207,15,42,0.9);
  border:none;
  width: 18px;
  height: 18px;
  border-radius: 10px;
  text-align: center;
  line-height: 15px;
  font-size: 10px;
  color: #fff;
  font-weight: bold;
}
/*商品購入ステップ*/
.steps ul{width: 350px;}
.steps li{
  float: left;
  padding: 0 6px;
  height: 150px;
}
.steps li a{height: 150px !important;}
.steps li img{height: 150px;}
@media screen and (max-width: 350px){
/*商品購入ステップ*/
.steps ul{width: 275px;}
.steps li{
  float: left;
  padding: 0 2px;
  height: 100px;
}
.steps li a{height: 100px !important;}
.steps li img{height: 100px;}
}
/* 決済ページ*/
#sysBillingAddress form{
  width: 95%;
  padding: 30px 20px;
  margin: 0 auto;
}
#sysPayment #sysMain .sysFormLabel{line-height: 10px;}
#sysDestination #sysMain{
  width: 95%;
  border: 1px solid #aaa;
  padding: 20px 20px !important;
  margin: 30px auto;
}

/***********************************
  マイページ
***********************************/
.sysMypage .sysMypageNav form{width: 100% !important;}

/***********************************
  新規会員登録
***********************************/
#sysMemberRegisterIndex .sysNextSubmit{
  width: 100%;
  float: none;
  margin: 10px 0;
  border-radius: 0;
}
#sysMemberRegisterIndex .sysButton[type="submit"]{
  width: 100%;
  float: none;
  border-radius: 0;
}
#sysMypageLogin .sysLoginButton{
  width: 100%;
  float:none;
  margin-right: 0;
  border-radius: 0;
}
#sysMypageLogin .sysButton{
  width: 100%;
  margin-left: 0;
  margin-top: 0;
  border-radius: 0;
}

/***********************************
  カートページ
***********************************/
/*ドメイン*/
.sysAcceptDomainArea .sysAcceptDomain a{
  padding:0;
  font-size:10px;
}

/***********************************
  ボタンデザイン
***********************************/
.common_btn{
  margin: 0 auto 30px;
  width: 250px;
}

/***********************************
  TOPページ
***********************************/
.top_newarrival, .topfeatures, .top_recommend_item, .top_ranking_item {
  padding: 1rem 0;
}

.topcomment {
  font-size:  20px;
  font-weight:bold;
}
.toptext{font-size:14px;}

.topspace::before{
background: rgba(255, 255, 255, 0.6);
-webkit-mask-image: linear-gradient(to top,    transparent 0%,  black 15%, black 85%, transparent 100%),
linear-gradient(to right,  transparent 0%,  black 15%, black 85%, transparent 100%);}


/*新着アイテム*/


/*特集一覧*/
.features_flex {
  flex-direction: column;
}
.features_item{
  width: 90%;
  margin: 1rem auto;
}

/*おすすめ商品、ランキング*/
.top_ranking_item li{
  width: 30% !important;
  margin: 0 1.5% 30px !important;
  padding:0 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.top_recommend_item li .sysItemName,
.top_ranking_item li .sysItemName{
  padding-top:0;
}
.top_recommend_item li .sysItemPrice,
.top_ranking_item li .sysItemPrice{
  font-size:12px;
}
.top_recommend_item li .sysCartButton,
.top_ranking_item li .sysCartButton{
  width:100%;
  font-size:10px;
  letter-spacing:-1px;
  border-radius: 0;
}


.top_recommend_item{
  margin-bottom: 0;
}
.top_ranking_item ul {
  display: flex;
}

/*おすすめ商品*/
.top_recommend_item li{
  padding:5px !important;
}
.calltext {
  margin-top: 2rem;
}

/*お知らせ*/
.info .sysContent {
  margin: 1rem;
}
/*お客様の声*/
.voice_flex {
  flex-wrap: wrap;
}
.voice_item {
  width: 44%;
  margin: 6px;
}
.voice p {
  margin: 1rem;
}
/* 会員特典 */
.membercall > .col2_item{
  padding: 1.5rem;
}
/*コンテンツ*/
.content_item {
  font-size: 12px;
  margin: 5px auto 3rem;
}
/***********************************
  カテゴリ一覧表示
***********************************/  
.itemDetailWrap{ height: auto!important;}
/***********************************
  ワンページカート
***********************************/
/*情報入力ページ調整*/
.sysOpcBody .header_wrap {
  border-bottom: none;
}
.sysOpcBody img {
  max-width: 100%;
}
.sysCart #sysMain,
.sysOpcBody #sysMain{
  border: none;
}
.sysOpcBody div#sysMain {
  padding: 0 3%;
  margin-bottom: 0;
}
.opcCommonInputSelect,
.opcConfirm_inputStatus,
.opcConfirm_inputStatus_disable,
.opcConfirm_order,
.opcConfirm_inputStatus {
  margin-bottom: .5em;
}
.opcItem_increaseNumButton_edit,
.opcItem_decreaseNumButton_edit {
  width: 40px !important;
}
.opcCommonButtonGroup {
  margin-top: 1em;
}
.opcBillingAddress_genderMaleAndLabelGroup_edit,
.opcBillingAddress_genderFemaleAndLabelGroup_edit {
  width: 30% !important;
}
.opcBillingAddress_prefState_edit {
  margin: 5px 0;
  width: 100% !important;
}
.opcBillingAddress .opcCommonReferenceLabel {
  display: inline-block;
  position: relative;
}
.opcBillingAddress .opcCommonReferenceLabel::after {
  position: absolute;
  right: 0;
}
.opcDeliveryMethod .opcCommonReferenceLabel {
  display: inline-block;
  position: relative;
}
.opcDeliveryMethod .opcCommonReferenceLabel::after {
  position: absolute;
  right: 0;
}
.opcBillingAddress_addressGroup {
  width: calc(100% - 90px)!important;
}
.opcRemarks_remark_edit {
  width: 100%!important;
}
.opcDeliveryAddressEditDialog_directChangeButtonAndLabelGroup .opcCommonButton {
  margin: 0 0 .5em!important;
  width: 100%!important;
}
.opcCommonButton{ padding: 0;}
/*完了ページ調整*/
#sysThanks #sysMain {
  width: 100%!important;
  padding: 0 1rem!important;
}
span.opcRemarks_remarkDescription_edit{
  margin-left: 0;
}
#sysWishlist .sysButton, #sysItemDetail .sysCartButton {
  width: 100%;
  margin: 10px auto 5px;
}
/***********************************
  ご利用ガイド
***********************************/
.indexList ul {
  flex-wrap: wrap;
}
.indexList li {
}
.indexList {
  margin: 1rem 0;
}
#shopping-guide h2.title {
  margin: 3rem auto 1rem;
  max-width: 284px;
}
.flow_flex {
  flex-direction: column;
  justify-content: center;
}
.flow_flex .block1 {
  width: 90%;
}
.credit img {
  width: 60px;
}
.block1{ margin: 1rem;}
/***********************************
  スタッフ紹介
***********************************/
.block_max {
  flex-direction: column;
}
.staff_titlea {
  width: 100%;
  margin: 0;
  text-align: center;
}
h1.staff_titleb {
  text-align: center;
}
.st_top {
  flex-direction: column;
  position: relative;
}
.block1200 {
  flex-direction: column;
}
.team_img {
  width: 100%;
}
.team_text {
  position: relative;
  margin: 1rem auto;
}
.block_pl {
  width: 50%;
  margin: 1rem auto;
}
/***********************************
  お客様の声
***********************************/
/*#voice .text {
  margin: 1rem 1rem 2rem;
}
.voicepage_flex {
  flex-direction: column;
  margin: 1rem 1rem 2rem;
}
.voicepage_image {
  width: 100%;
  margin: 1rem auto 0;
}
.voice_comment {
  margin: 1rem 1rem 3rem;
  width: auto;
}*/
/***********************************
  検索ページ
***********************************/
#sysItemSearch #sysMain .sysItemSearchForm {
  padding: 10px;
}
.sysItemSearchFormCategory select {
  font-size: 0.9rem;
}
.sysItemSearchFormInput {
  padding: 10px;
}



.info_intro{
width:80%;
}

.we_text {
font-size: 12px;
}

.sp{display:block;}
.pc{display:none;}
.ev_imgblock{
display:block;
}

.scon_in{
margin: 1rem 5px 3rem;
padding: 1rem;
border: 4px double #e3e2e2;
width: 90%;
display: block;
text-align: center;
}

.scon_s{
width:100%;
}

.ev_btn{
padding:5px 0;
margin:1em auto;
width:60%;
}

.lesson_info{
display:block;
}

.lesson_in{
margin: 2rem 2% 7rem;
padding: 3rem;
width: 96%;
}

.shop_img1 {
display: block;
}

.shop_img1in img{
width:100%;
}
.service_h1{
font-size:28px;
padding:5rem 0 0;
}

.service_h2{
font-size:20px;
}

.r_deco p{
padding:0 20px;
}

.rd_img span img{
width:100%;
}

.gl_img{
display:block;
}
.gl_text{
font-size: 14px;
padding:20px;
width: 100%;
text-align: left;
}


/*---最近チェックした商品---*/
.checked .sysContent {
width: 90%;
margin: 0 auto;
}


/*事業紹介*/
.shop_A{letter-spacing:1px;line-height:36px;font-weight: normal;}
.event_A{letter-spacing:1px;line-height:36px;font-weight: normal;}
.s_con{font-size:0.8rem;}
.j_link{width:70%;font-size:0.9rem;}
.tel_fix{display:flex;}
.products{margin:50px 5px;}
.products_in{margin:3px 3px;}

/*------シャンパンページフッター------*/
.cham_text_a{flex-direction:column;}
.cham_text_b{flex-direction:column-reverse;}
.cham_a{width:100%;}
.cham_b{width:80%;margin:50px auto;}


.lesson_b{flex-direction:column;height:auto;}
.lesson_b_img{width:100%;}
.lesson_b_text{width:100%;}

.evw100cm{top:10%;}

.lesson_b_text h1 {
font-size: 1.5rem;margin: 10px auto;}
.lesson_b_text h2 {font-size: 1rem;margin: 30px auto;}

#spNaviWrap{
display: flex;
flex-direction: column;
}
 .category_inner {
    flex-direction: column; /* 縦並び */
  }
  .category_logo {
    width: 300px;
    height: 60px;
    margin: 0 auto 15px;       /* ロゴブロック自体を中央に */
    display: flex;
    align-items: center;       /* 縦中央 */
    justify-content: center;   /* ← 横中央に修正 */
    padding: 0;                /* 横余白リセット */
    text-align: center;        /* テキスト中央寄せ */
  }
  .category_comment {
    width: 100%;
    padding: 10px;
  }

/*-------商品ページ立札カード用フッター-------*/
.card_plate{text-align:center;}
.pl_c_comment{width:100%;padding:0 3%;}

.plate{flex-direction: column-reverse;}
.plate_img{width: 100%;margin: 8% auto;
padding: 5%;}



.card{flex-direction: column-reverse;}
.card_img{width:100%;padding: 10%;}
.card_h{width:100%;}


/*-------semiOrder-------*/
  .semi-order_area { padding: 10px 0 60px; }
  .semi_comment_area { margin-bottom: 40px; }
  
  /* 横スクロール対応（スクロールバー非表示） */
  .semi-order_img_inner {
    padding: 0 150px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    justify-content: flex-start;
    gap: 60px;
    -ms-overflow-style: none; /* IE, Edge */
    scrollbar-width: none;    /* Firefox */
  }
  .semi-order_img_inner::-webkit-scrollbar {
    display: none; /* Chrome, Safari */
  }

  .semi_order_img {
    flex: 0 0 50vw;
    scroll-snap-align: center;
  }

/*------------おすすめ商品ボタン------------*/
/* 親要素（ボタンとテキストを包む箱）で調整 */
  .slide_sc_button, .slide_sc_button_b {
    margin-top: 10px !important;    /* 上の間隔を固定 */
    padding-bottom: 60px !important; /* 下の間隔を「内側の余白」として確保 */
    text-align: center !important;
  }

  /* pタグ自体のマージンは最小限にする */
  .slide_sc_button p, .slide_sc_button_b p {
    margin-top: 0 !important;
    margin-bottom: 15px !important; /* テキストとボタンの間の距離 */
  }

/*------------statement------------*/
  .sysFuncText .state {
    line-height: 2.1;
    letter-spacing: 0.09em;
  }

.top_newarrival ul {gap: 0px;}

.sysItemCategoryForm{width: 95%;}
.sysItemCategoryCtl {
        text-align: left;           /* スマホでは左詰めでスクロールしやすく */
        white-space: nowrap;        /* 絶対に改行させない */
        overflow-x: auto;           /* 横スクロールを許可 */
        -webkit-overflow-scrolling: touch; /* スムーズなスクロール */
        padding: 15px 10px;
        margin: 20px 0;
        border-bottom: 1px solid #eee; /* 下線も引いてエリアを明確に */
        scrollbar-width: none;      /* Firefoxでスクロールバーを隠す */
    }

    /* Chrome, Safariでスクロールバーを隠す（ミニマル維持） */
    .sysItemCategoryCtl::-webkit-scrollbar {
        display: none;
    }

    .sysItemCategoryCtl a {
        margin-left: 0;
        margin-right: 10px;         /* 右側に余白を作って並べる */
        font-size: 11px;            /* 少しだけ押しやすく調整 */
        display: inline-block;
    }
    
    /* 「表示順」などのテキストを控えめにする */
    .sysItemCategoryCtl {
        display: block;
        align-items: center;
    }
      .sysItemCategoryCtl > br {display: inline !important;
content: normal !important;
margin: 0 !important;}



/* ---------ページネーション------------ */
.sysPagination {
  width: 300px;
  margin: 0 auto 30px;
}

.terms, .p-corporate, .p-privacy, .license {
padding: 1rem;
background: #fff;
}
}
@media screen and (min-width:601px) and (max-width:1100px){
.sysDisplayTabletNone{
  display:none !important;
}

/* 20-0 Only Tablet
 *----------------------------------------------------------------------*/
#sysWrap{} 
div#sysMain,div#sysAside{
  width: 100% !important;
  float: none;
}
.sysMypage #sysWrap,
.sysMemberRegister #sysWrap{
  margin: 130px auto 0;
}
.sysFormField label{display: block;}
.topspace{ padding: 50px 100px;}

/* 決済ページ*/
#sysPayment #sysMain .sysFormLabel{line-height: 10px;}
#sysBillingAddress form{
  width: 95%;
  padding: 30px 20px;
  margin: 0 auto;
}
#sysDestination #sysMain{
  width: 95%;
  border: 1px solid #aaa;
  padding: 20px 20px !important;
  margin: 30px auto;
}
/*header検索ボックス*/
.h_search {
  max-width: 700px;
  margin: 0 auto 3rem;
  padding: 5px;
}
.top_serch, .sysFuncText.header_h1.sysDisplayKeitaiNone{ display: none;}
#top .sysCartButton{ width: 100%;}

/***********************************
  商品詳細ページ
***********************************/
#sysItemCategory #sysMain{padding:  30px 20px;}
#sysItemCategory input[type=submit]{margin-top: 0px;}

#sysItemDetail .sysItemName h1 {
  font-size: 15px;
}
#sysItemDetail .sysItemId {
  margin: 0 0 10px 0 !important;
  text-align: left !important;
}
#sysItemDetail .sysMainImage {
  max-width: 700px;
  margin: 0 auto;
}
#sysItemDetail .sysImageList {
  max-width: 700px;
  margin: 0 auto 20px;
}
#sysItemDetail .sysImageList li {
  display: inline-block;
  max-width: 60px;
  line-height: 0;
}
#sysItemDetail .sysReview,
#sysItemDetail .description_left,
#sysItemDetail .sysDescription,
#sysItemDetail .sysForm,
#sysItemDetail .sysRetailPrice,
#sysItemDetail .sysImageDescription {
  max-width: 700px;
  margin: 0 auto 10px auto !important;
}
#sysItemDetail .sysForm select {
  min-width: 350px;
  display: inline-block;
  float: none!important;
}
#sysItemDetail #sysNumber{text-align:right;}
.sysItemPrArea span{
        width: 48%;
        font-size: 14px;
}
.sysPr span{
  font-size: 10px;
  width: auto;
}
article{
  padding: 3rem 1rem;
}

/***********************************
  ヘッダー
***********************************/
#sysHeader{
  width: 100%;
  margin: 0px auto;
}
.h_inner{margin: 0px 0 0;}
.header_h1_under, .header_h1{
  width: 100%;
  height: 0px;
  float: none;
  text-align: center;
  background: #ededed;
}
.header_h1_under a, .header_h1 a{
  display: none;
}
.head_title{
  font-size: 10px;
  font-weight: bold;
  height: 20px;
  line-height: 20px;
  letter-spacing: 1px;
}
.header_sp{
  width: 95%;
  margin: 0 2.5%;
  position: relative;
  text-align: center;
}
.header_sp #navBtn{
  position: absolute;
  top: 10px; right: 0;
}
.header_sp .spCart{
  position: absolute;
  top: 10px; left: 0;
}
.header_sp #navBtn img, .header_sp .spCart img{
  width: 40px;
  height: 40px;
}
.header_sp .spLogo img{
  width: 180px;
  margin-top: 5px;
}

/***********************************
  カート情報
***********************************/
#cartInfo{display: none;}


/***********************************
  ログイン情報
***********************************/
.h_login{
        max-width: 700px;
        width: 90%;
        margin: 0 auto;
}
.h_login .sysHeadline{
  text-align: center;
  font-size: 25px;
    margin-bottom: 10px;
}
.h_login .sysContent{text-align: center;}
.h_login .sysFormItem{margin-bottom: 10px;}
.h_login .sysFormLabel{
  display: block;
  font-size: 15px;
  height: 25px;
  text-align: left;
  margin-bottom: 0px;
}
.h_login .sysLoginButton{
  width: 100%;
  margin: 15px 0%;
  border-radius: 0;
  border:1px solid #444;
  font-size: 15px;
  height: 50px;
  line-height: 10px;
}
.h_login li{
  border:1px solid #444;
  margin-bottom: 15px;
  height: 50px;
  line-height: 45px;
  text-align: center;
}
.h_login li a{
  font-size: 15px;
  padding: 0px 5px 5px 0px;
}
#sysMypageEditDelivery button {
  border-radius: 0;
}
#sysMypageEditDelivery .sysSelectAddress button {
  background: #eee;
  border: 1px solid #000;
  color: #000;
}


/***********************************
  共通パーツ
***********************************/
.sysTitle{
  width: 600px;
  margin: 50px auto!important;
  position: relative;
  text-align: center;
  font-size: 20px;
  letter-spacing: auto;
}
.sysTitle b{
  display: block;
  font-size: 15px;
  text-align: center;
  margin-top: 5px;
}
.sysTitle span {
  position: relative;
  z-index: 2;
  display: inline-block;
  margin: 0 2.5em;
  padding: 0 40px;
  background-color: #fff;
  text-align: center;
  font-weight: bold;
}
.sysTitle::before {
  position: absolute;
  top: 50%;
  z-index: 1;
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  background-color: #222222;
}

.contentsWrap{
  width: 90%;
  margin: 0 auto;
}

/***********************************
  商法テーブルレイアウト
***********************************/
.p-law .sysTitle{max-width: 600px;}
.p-law .sysTitle span {
  font-size: 22px;
  padding: 0 40px;
}

#main_tradelaw{width: 90%;}
.shipFee{
  width: 90%;
  margin: 50px auto;
}
.shipFee h3{font-size: 16px;}
table.shipFeeTable .newLine{display: block;}
table.shipFeeTable tbody th {
  width: 500px;
  vertical-align: middle;
}
table.shipFeeTable td{
    width: 500px;
  font-size: 15px;
  vertical-align: middle;
}

/***********************************
  カート内商品数表示
***********************************/
button.itemCount2{
        display:none;
  position: absolute;
  bottom: 0px;
  right: 0px;
  background: rgba(207,15,42,0.9);
  border:none;
  width: 18px;
  height: 18px;
  border-radius: 10px;
  text-align: center;
  line-height: 15px;
  font-size: 10px;
  color: #fff;
  font-weight: bold;
}
/***********************************
  商品購入ステップ
***********************************/
.steps ul{width: 550px;}
.steps li{
  float: left;
  padding: 0 2px;
  height: 180px;
}
.steps li a{height: 180px !important;}
.steps li img{height: 180px;}

/***********************************
  TOPページ
***********************************/
/*.トップスライダー*/
#slideShow{height: 190px;}

.topcomment {
  font-size: 1.7rem;
}
/* お知らせ */
.info nav {
  margin: 1rem;
}

/***********************************
  ワンページカート
***********************************/

/*情報入力ページ調整*/
.sysOpcBody .header_wrap {
  border-bottom: none;
}
.sysCart #sysMain,
.sysOpcBody #sysMain{
  border: none;
}
.sysOpcBody div#sysMain {
  margin-bottom: 0;
}
.sysOpcBody img {
  max-width: 100%;
}
.sysOpcBody div#sysMain {
  padding: 0 4%;
}
/***********************************
  ご利用ガイド
***********************************/
.indexList ul {
  flex-wrap: wrap;
}

#sysFormIndex #sysMain, #sysFormConfirm #sysMain, #sysFormThanks #sysMain, .sysMemberRegister #sysMain, .sysMypage #sysMain{
  padding: 0 1rem!important;
}
/***********************************
  検索ページ
***********************************/
#sysItemSearch div#sysMain {
  padding: 0 1rem;
}


/***********************************
商品カテゴリブロック
***********************************/


.lesson_b{flex-direction:column;height:auto;}
.lesson_b_img{width:100%;}
.lesson_b_text{width:100%;}
.lesson_b_text h1 {
font-size: 1.5rem;margin: 10px auto;}
.lesson_b_text h2 {font-size: 1rem;margin: 30px auto;}


#spNaviWrap{
display: flex;
flex-direction: column;
}

.wrap1:nth-child(1){order: 1}
.wrap1:nth-child(2){order: 3}
.wrap1:nth-child(3){order: 2}

/*------------statement------------*/
 .sysFuncText .state {
    line-height: 2.1;
    letter-spacing: 0.09em;
  }

  .block1{margin: 1rem;}

}
@media screen and (min-width:1101px){
.sysDisplayPcNone{
  display:none !important;
}
/* PCではスマホ用パーツを隠す */
.sp-only {
  display: none !important;
}

/* PCヘッダーの微調整（例：ロゴのサイズや余白） */
.header-nav {
  display: block; /* メガメニューを表示 */
}
/* その他、PCのみ適用したい調整をここに集約 */
}
/* #END_OF_RESOURCE_FILE */