@charset "UTF-8";
/* ==================================================================
  common.css
  AQUA GARAGE — Global Styles
  ------------------------------------------------------------------
  TOC:
   01) Base / Reset（既存のままでOK）
   02) Header / Global Nav（既存のままでOK）
   03) Footer Base（既存のままでOK）

   10) Menu Primary（カテゴリメニュー）
   20) Events（event_list.html）
   30) Stylebook / Instagram
   40) Free Shipping Section
   50) Welcome Members（会員特典）
   60) Footer Accordion（フッターの開閉）
   70) Product Type Point（商品ページ）
   99) Utilities（任意）
================================================================== */
/* ------------------------------
  基本設定
------------------------------ */
:root{
  --max-wide: 1400px;
  --color-bk: #111111;
  --color-wh: #FFFFFF;
  --color-dgy: #323232;
  --color-gy: #666666;
  --color-ltgy: #DADADA;
  --color-gd: #8C7E5D;
  --color-rd: #BB1405;
  --font-size-s: .8rem;
  --font-size-m: 1.2rem;
  --header-height: 60px; /* メニュー展開位置と整合 */
}

html{ font-size:62.5%; }
body{
  background:var(--color-wh);
  color:var(--color-bk);
  font-family: "Noto Sans JP","Helvetica Neue",Helvetica,"Yu Gothic Medium","Hiragino Kaku Gothic ProN",sans-serif;
  font-size:1.4rem;
  font-weight:400;
  letter-spacing:.03em;
  word-wrap:break-word; overflow-wrap:break-word;
  padding-top: var(--header-height);
  /* 固定ヘッダー運用時に有効化（JSで .is-fixed を付与）
     body.is-fixed { padding-top: var(--header-height); } */
}
a{ color:var(--color-bk); text-decoration:none !important; }
ul{ margin-left:-40px; }
li{ list-style:none; }
img{ max-width:100%; }
.clear{ clear:both; }

.white, .white a{ color:var(--color-wh) !important; }

/* ------------------------------
  ヘッダー
------------------------------ */
header{
  display:block; width:100%; max-width:var(--max-wide);
  margin:0 auto 3.5rem; position:relative;
}
#header_fix{
  position:fixed; top:0; width:100%; max-width:1280px; text-align:center; display:block;
  margin:0 auto; background:rgba(255,255,255,.7); z-index:9998; backdrop-filter:blur(5px);
}
#header_area{
  width:100%; max-width:var(--max-wide);
  text-align:center; position:relative;
  background:rgba(255,255,255,.85); top:0; left:0; margin:0 auto;
}
/* ロゴ/検索/アイコン位置 */
#aquagarage_logo{ display:block; margin:5px 8px 0 14px; width:45%; max-width:240px; z-index:1; }
#aquagarage_logo img{ width:100%; }

.searchbox_head{ width:230px; position:absolute; right:130px; top:3px; }
.searchbox_head .fs-p-searchForm__input{ width:calc(100% - 32px) !important; }
.searchbox_head .fs-p-searchForm__button{ width:32px !important; height:32px !important; }
.searchbox_head .fs-p-searchForm__button::before{ font-size:2.2rem; line-height:32px !important; }

.mypage, .cart{
  position:absolute; display:block; width:40px; height:40px; font-size:24px;
  right:0; top:3px; cursor:pointer; text-align:center; transition:.5s all;
}
.mypage{ right:78px; top:3px; }
.cart{ right:40px; top:3px; }
.cart a, .mypage a{ color:var(--color-bk) !important; text-decoration:none; }

/* ------------------------------
  グローバルナビ
------------------------------ */
#global-nav{ background:var(--color-wh); width:100%; z-index:9999; }
#global-nav .header_menu ul{
  width:100%; max-width:800px; padding:.5rem 0; margin:0 auto;
  list-style:none; font-size:1.3rem; display:flex; flex-wrap:wrap;
}
#global-nav .header_menu ul li{ border-right:1px solid var(--color-dgy); text-align:center; padding:.75rem 0; }
#global-nav .header_menu ul li:last-child{ border-right:0; }
#global-nav .header_menu ul li a{ display:block; width:95%; margin:0 auto; }

/* ------------------------------
  お知らせ/帯
------------------------------ */
.informationBox{ width:90%; border:1px solid var(--color-ltgy); padding:.6rem; margin:0 auto 1rem; }
.w970{ max-width:970px; }
.information{ color:var(--color-gd); font-size:1rem; margin:.5rem 1%; }
.informationBox a{ text-decoration:underline; color:var(--color-gd); }

.obi{ width:100%; margin:.3rem auto; text-align:center; }
.obi img{ display:block; width:100%; max-width:800px; margin:0 auto; }

/* ------------------------------
  ドロワーメニュー
------------------------------ */
.menu-drawer .dmenu_btn{
  right:0; top:3px; width:40px; height:40px; font-size:24px;
  position:absolute; display:block; cursor:pointer; text-align:center; transition:.5s all;
}
.menu-drawer .dmenu_btn::before, .menu-drawer .dmenu_btn::after{ font-family:'icomoon' !important; }
.menu-drawer .dmenu_btn::before{ content:"\e900"; }
.menu-drawer .dmenu_btn::after{ content:"\e91f"; }

.menu-drawer .dmenu_other{
  position:fixed; background:rgba(0,0,0,.2); top:3px; left:0; width:100%; height:100%;
  z-index:1000; display:none;
}
.menu-drawer .content{
  position:absolute; right:0; display:table; background:var(--color-wh); width:100%; height:100vh;
  top:var(--header-height); text-align:left; padding:10px 10px 80px; z-index:1001;
  transform:translate(350%,0); transition:transform .3s ease-in-out;
}
.menu-drawer .content #content_inner{ height:100%; overflow-y:auto; }
.menu-drawer #chk{ display:none; }
.menu-drawer #chk ~ .dmenu_btn::before{ display:block; }
.menu-drawer #chk ~ .dmenu_btn::after{ display:none; }
.menu-drawer #chk ~ .content{ transform:translate(350%,0); }
.menu-drawer #chk:checked ~ .dmenu_btn::before{ display:none; }
.menu-drawer #chk:checked ~ .dmenu_btn::after{ display:block; }
.menu-drawer #chk:checked ~ .dmenu_other{ display:block; }
.menu-drawer #chk:checked ~ .content{ transform:none; }

/* ------------------------------
  セクションタイトル/もっと見る
------------------------------ */
.contents_title{
  text-align:center; margin:3.5rem auto 2rem; font-size:2.8rem; font-weight:bold; color:var(--color-bk);
}
.contents_title span{ font-size:1.1rem; }

.more_button{ text-align:right; }
.more_button a{ display:inline-block; font-size:1.4rem; margin:1rem 1rem 1.5rem auto; }
.more_button a:after{
  content:""; display:inline-block; width:12px; height:12px;
  background-image:url(https://aqua-garage.jp/img/allow_left.png);
  background-size:contain; margin-left:5px;
}
.more_button a:hover{ text-decoration:underline; }

.concept{ font-size:.87rem; padding:4px 8px; }

/* ------------------------------
  カテゴリアコーディオン
------------------------------ */
.search_banner .accordion_wrap{ width:100%; padding:8px; margin:0 auto; }
.search_banner .accordion_wrap .accordion_header{
  height:40px; line-height:40px; text-align:left; position:relative; z-index:1;
  border-bottom:1px solid #ccc; cursor:pointer; transition:opacity .1s;
}
.search_banner .accordion_wrap .accordion_header:hover{ opacity:.8; }
.search_banner .accordion_wrap .accordion_header .i_box{
  display:flex; justify-content:center; align-items:center; position:absolute; top:50%; right:5%;
  width:34px; height:34px; margin-top:-17px; box-sizing:border-box; transform:rotate(45deg); transform-origin:center;
}
.search_banner .accordion_wrap .accordion_header .i_box .wrap_i{
  display:block; width:10px; height:10px; transform:rotate(45deg); transform-origin:center; position:relative;
}
.search_banner .accordion_wrap .accordion_header.open .i_box{ transform:rotate(-360deg); right:7%; }
.txt_a_ac a{ height:40px; text-indent:30px; line-height:40px; display:block; color:#111; }
/* プラス/マイナス記号 */
.search_banner .accordion_wrap .accordion_header .i_box .wrap_i:before,
.search_banner .accordion_wrap .accordion_header .i_box .wrap_i:after{
  content:''; display:flex; background-color:#ccc; border-radius:10px;
  width:10px; height:2px; position:absolute; top:3px; left:1px; transform:rotate(45deg); transform-origin:center;
}
.search_banner .accordion_wrap .accordion_header .i_box .wrap_i:before{ width:2px; height:10px; top:5px; left:5px; }
.search_banner .accordion_wrap .accordion_header.open .i_box .wrap_i:before{
  transform:rotate(90deg); width:2px; height:10px; top:-5px; left:9px;
}
.search_banner .accordion_wrap .accordion_header.open .i_box .wrap_i:after{
  transform:rotate(90deg); width:10px; height:2px; top:3px; left:1px;
}
.search_banner .accordion_wrap .accordion_inner{ display:none; box-sizing:border-box; }
.search_banner .accordion_wrap .accordion_inner p.txt_a_ac{
  margin:0; background:#f7f7f7; border-bottom:1px dashed #fff;
}
.menu-category img{ max-width:35px; height:auto; vertical-align:top; margin:0 .8em 0 0; }

/* ------------------------------
  チェックボックス（カラーフィルタ）
------------------------------ */
input[type=checkbox]{ display:none; }
.checkbox01{ box-sizing:border-box; cursor:pointer; display:inline-block; padding:5px 30px; position:relative; }
.checkbox01::before{
  background:var(--color-wh); border:1px solid #231815; content:''; display:block; height:16px; width:16px;
  position:absolute; top:50%; left:5px; margin-top:-8px;
}
.checkbox01::after{
  border-right:3px solid #716D55; border-bottom:3px solid #716D55; content:''; display:block;
  height:9px; width:5px; position:absolute; top:50%; left:10px; margin-top:-7px; transform:rotate(45deg); opacity:0;
}
input[type=checkbox]:checked + .checkbox01::after{ opacity:1; pointer-events:auto; }

/* カラーチップ */
input.cb_white[type="checkbox"], input.cb_black[type="checkbox"],
input.cb_gray[type="checkbox"], input.cb_red[type="checkbox"],
input.cb_orange[type="checkbox"], input.cb_brown[type="checkbox"],
input.cb_yellow[type="checkbox"], input.cb_beige[type="checkbox"],
input.cb_khaki[type="checkbox"], input.cb_green[type="checkbox"],
input.cb_blue[type="checkbox"], input.cb_pink[type="checkbox"],
input.cb_purple[type="checkbox"]{
  position:relative; height:40px; width:40px; display:inline-block; border-radius:8px; -webkit-appearance:none; appearance:none; border:none;
}
input.cb_white{ border:2px solid #ccc; background:var(--color-wh); }
input.cb_black{ background:var(--color-bk); }
input.cb_gray{ background:#9F9F9F; }
input.cb_red{ background:#FF0000; }
input.cb_orange{ background:#E85E07; }
input.cb_brown{ background:#6D3317; }
input.cb_yellow{ background:#F3C41B; }
input.cb_beige{ background:#C0AD9A; }
input.cb_khaki{ background:#4E642E; }
input.cb_green{ background:#0C7500; }
input.cb_blue{ background:#000BB5; }
input.cb_pink{ background:#FA3989; }
input.cb_purple{ background:#AA0BC2; }

/* チェック時のSVG（白/黒の反転） */
input.cb_white:checked{
  border:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16'><rect fill='%23fff' width='16' height='16'/><path fill='none' stroke='%23000' stroke-width='2' d='M12.6,5.17l-5.66,5.66L3.4,7.29'/></svg>");
  background-repeat:no-repeat; background-size:cover;
}
input.cb_black:checked, input.cb_gray:checked, input.cb_red:checked,
input.cb_orange:checked, input.cb_brown:checked, input.cb_yellow:checked,
input.cb_beige:checked, input.cb_khaki:checked, input.cb_green:checked,
input.cb_blue:checked, input.cb_pink:checked, input.cb_purple:checked{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16'><rect fill='transparent' width='16' height='16'/><path fill='none' stroke='%23fff' stroke-width='2' d='M12.6,5.17l-5.66,5.66L3.4,7.29'/></svg>");
  background-repeat:no-repeat; background-size:cover;
}

/* ------------------------------
  リスト/カード
------------------------------ */
/* Gridレイアウト化：PC4列／TB3列／SP2列 */
.ShowBox, .hitBox{width:100%; padding:0; display:grid; gap: 20px 8px; margin:0 auto;}
.ShowBox{	
  grid-template-columns:repeat(5,minmax(0,1fr));
}
.hitBox{	
  grid-template-columns:repeat(4,minmax(0,1fr));
}
@media (max-width:1024px){
  .ShowBox{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:480px){
  .ShowBox, .hitBox{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

.ShowBox li, .hitBox li{ list-style:none; text-align:left; }
.ShowBox li p{ width:95%; font-size:1rem; text-align:left; color:var(--color-dgy); }
.list li{ opacity:1; transition:all .4s ease 0s; }
.list li.is-hidden{ opacity:0; height:0; margin:0; }
span.pricetext{ color:var(--color-bk); font-size:1.5rem; padding:0 4px; }
.freeshippingTxt, .fshipt{
  display:inline-block; border-radius:0; font-size:1rem; padding:.2rem; margin:0 2px 0 0; position:relative; top:-2px; line-height:140%;
}
span.freeshippingTxt, span.fshipt{
  background:#484848; color:var(--color-wh); padding:.18rem .25rem .2rem; letter-spacing:.5px; margin-top:2px;
}
span.freeshippingTxt:empty, span.fshipt:empty{ display:none; }

/* バッジ */
.saleIcon{
  border:1px solid #DD0000; color:#DD0000; display:inline-block; font-size:1rem; padding:.2rem; margin:0 2px 0 0; position:relative; top:-2px; line-height:120%;
}
.newIcon, .reIcon{ display:none !important; }

/* ------------------------------
  無料配送セクション
------------------------------ */
#free_shipping_section{ width:100%; padding:1rem 0 4rem; text-align:center; background:#B6B6B6; }
.freeshipping_area1{ margin:0 auto; }
.freeshipping_area2{ font-size:2.8rem; letter-spacing:2px; margin:0 auto 2rem; }
.freeshipping_area2 span{ font-size:6rem; color:#FFF447; }

#freeship_show, .freeshipBox{ width:100%; max-width:var(--max-wide); margin:0 auto; text-align:center; }
.freeshipBox li{ width:25% !important; margin:0 auto 2rem; float:left; }
.freeship_list{ position:relative; margin:0 0 1rem; }
.freeship_list p{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  background-color:rgba(237,237,237,.8); padding:.6rem 1rem; line-height:140%;
}

/* ------------------------------
  ランキング/セレクト
------------------------------ */
#contentBox{ padding-top:20px; padding-bottom:100px; }
#pref-search{
  overflow:hidden; width:90%; margin:2em auto; text-align:center; position:relative;
  border:1px solid #bbbbbb; border-radius:2px; background:var(--color-wh);
}
#pref-search::before{
  position:absolute; top:.8em; right:.9em; content:''; border-left:6px solid transparent; border-right:6px solid transparent; border-top:6px solid var(--color-gy);
}
.refineForm{
  width:100%; padding:8px 38px 8px 8px; color:var(--color-gy); cursor:pointer; border:none; outline:none; background:transparent; -webkit-appearance:none; appearance:none;
}
.commonForm form{ background:transparent; }

#itemList {
  counter-reset: number;
  padding: 0;
  width: 98%;
  margin: 0 auto;
  font-size: 0;
  position: relative;
}
#itemList li::before {
  counter-increment: number;
  content: counter(number);
  position: absolute;
  top: 0;
  left: -50px;
  width:100px;
	height:40px;
	background:linear-gradient(to top right, transparent 0%,#D5B2A3 calc(50% + 2px)) top left/ 0% 100% no-repeat,
	linear-gradient(to top left, transparent 50%, #D5B2A3 calc(10% + 2px)) top right / 50% 100% no-repeat;
  color: #fff;
  font-size: 1.4rem;
	text-indent: 27px;
  text-align: center;
  z-index: 1;
}
.ctInner, #itemList li{position:relative; }
.ctInner a, #itemList li a{ width:100%; display:block; line-height:1.5rem;}
.ctInner p, #itemList li p{ position:relative;top:-1rem;width:95%; color:var(--color-dgy); font-size:1rem;}

.none{ display:none; }

/* ------------------------------
  フッター
------------------------------ */
#Footer{ background:url(https://aquagarage.itembox.design/item/parts/footer_background.png) repeat-y center; }
#footer_area{ width:100%; max-width:var(--max-wide); margin:0 auto; text-align:center; }
#footerBox{ width:95%; margin:0 auto; }
#footer-contact{ width:100%; margin:0 1%; padding:0; text-align:center; }
#footer-contact p{ margin:0; line-height:180%; }
div.footer-inner{ width:50%; float:left; text-align:left; }
div.footer-inner dl{ width:83%; margin:.8rem auto; }
div.footer-inner dl dt{ font-size:1.2em; font-weight:bold; padding-bottom:4px; }
div.footer-inner dl dt::before{ content:"●"; padding-right:3px; }
div.footer-inner dl dt span{ font-weight:normal; font-size:1rem; margin-left:10px; }
div.footer-inner dl dd{ line-height:170%; margin:0; }
div.footer-inner dl dd img{ width:100%; margin:8px 0; }

ul.credit{ width:80%; margin:0; padding:0; }
ul.credit li{ width:16%; display:inline-block; margin-top:-1.2rem; }
ul.credit li img{ width:98%; }

ul.settlement{ width:100%; line-height:40%; margin:0; padding:0; margin-top:-12px; }
ul.settlement li{ width:10%; display:inline-block; vertical-align:bottom; }
ul.settlement li img{ width:100%; }
ul.settlement li:first-child{ width:32%; }
ul.settlement li:nth-child(n+2) img{ border:1px solid var(--color-bk); border-radius:6px; }

div.footer-inner dl dd.yubin img{ width:55%; }

.footer-inner .accordion-footer{ width:95%; margin:0; padding:0; }
.accordion-footer p{
  width:100%; display:block; font-size:1.2rem; background:var(--color-dgy); color:var(--color-wh);
  padding:0 .5rem; margin:.2rem auto 0; line-height:250%; position:relative;
}
.accordion-footer p::after{
  content:""; position:absolute; top:0; bottom:0; right:1em; width:6px; height:6px;
  border-top:2px solid var(--color-wh); border-right:2px solid var(--color-wh); transform:rotate(135deg); margin:auto; transition:.5s;
}
.accordion-footer .active::after{ transform:rotate(-45deg); }
.accordion-footer div{ width:95%; margin:.3rem auto; }

.acc_a{
  background:var(--color-ltgy); padding:.6rem 0 .6rem 1.5rem; margin:.4rem auto; width:100%; display:block; position:relative; left:-.25rem;
}
.acc_a::before{
  content:""; position:absolute; top:0; bottom:0; left:.6rem; width:6px; height:6px;
  border-top:2px solid var(--color-bk); border-right:2px solid var(--color-bk); transform:rotate(45deg); margin:auto; transition:.5s;
}

/* ------------------------------
  テキストサイズユーティリティ
------------------------------ */
.text_small{ font-size:11px; color:var(--color-bk); line-height:250%; }
.text{ font-size:11px; color:var(--color-bk); line-height:200%; }
.text_color{ font-size:12px; color:var(--color-rd); line-height:250%; font-weight:bold; }
.text_medium{ font-size:15px; color:var(--color-bk); line-height:90%; }
.text_medium_color{ font-size:15px; color:var(--color-rd); line-height:90%; font-weight:bold; }
.text_big{ font-size:23px; color:var(--color-bk); line-height:110%; }
.text_big_color{ font-size:23px; color:var(--color-rd); line-height:110%; font-weight:bold; }

/* ------------------------------
  SNS / 会員テキスト
------------------------------ */
.WelcomeMembers{ width:97%; max-width:480px; margin:0 auto 1.5rem; background:#F3E3D0; padding:1rem; }
.WelcomeMembers ul{ width:100%; max-width:400px; margin:0 auto; font-size:0; }
.WelcomeMembers li{ clear:both; }
.WelcomeMembers li p{
  float:left; margin:.3rem .3rem 0 0; font-size:1rem; padding:.2rem .7rem; background:#8A7E61; border-radius:85px; line-height:160%; text-align:center; color:var(--color-wh);
}
.WelcomeMembers li p span{ font-size:1.5rem; font-weight:bold; }
.WelcomeMembers li div{ float:left; padding:.35rem .5rem; margin:.45rem 0 .3rem 0; font-size:1.3rem; font-weight:bold; }

/* ------------------------------
  スタイルブック / Instagram
------------------------------ */
#stylebookList, .stylebookList{ width:100%; margin:0; padding:0; font-size:0; list-style:none; }
#stylebookList li, .stylebookList li{ width:20%; display:inline-block; text-align:left; vertical-align:top; }
#stylebookList li img, .stylebookList li img{ width:95%; display:block; margin:0 auto; }
#stylebookList li p, .stylebookList li p{
  padding:0 0 0 .6rem; margin:.5rem auto; width:95%; color:var(--color-dgy);
  font-size:1.2rem !important; line-height:2.8rem; border-bottom:1px solid #ECECEC; display:block;
  background:url('https://www.aqua-garage.jp/img/parts/subcat_view.png') no-repeat right 5px center;
  -webkit-background-size:14px 14px; -moz-background-size:14px 14px; position:relative;
}
#stylebookList li p a, .stylebookList li p a{ text-decoration:none; display:block; color:var(--color-dgy); }
#stylebookList li p span, .stylebookList li p span{ position:absolute; right:15%; }

#instagram-list, #top_instagram-list{ width:100%; max-width:860px; margin:0 auto; font-size:0; }
#instagram-list li, #top_instagram-list li{ width:33%; display:inline-block; margin:.5rem auto; position:relative; }
.instaImg{ position:relative; width:100%; padding-top:100%; margin:0 auto; }
.instaImg img, .instaImg video{ position:absolute; width:100%; height:100%; top:0; object-fit:cover; }
#instagram-list li p, #top_instagram-list li p{ width:95%; margin:.8rem auto; text-align:right; }
#instagram-list li p a, #top_instagram-list li p a{ display:block; color:#1B668B; font-size:1rem; }
#instagram-list li p a::before, #top_instagram-list li p a::before{ content:">"; padding:.3rem; }
#instagram-list li img, #top_instagram-list li img{ width:98%; margin:0 auto; }
#instagram-list li span, #top_instagram-list li span{
  display:block; background:#111; color:#DDD; padding:.5rem; font-size:.8rem; position:absolute; left:12px; bottom:40px; z-index:11;
}

/* RWD微調整 */
@media screen and (max-width:960px){ #stylebookList li, .stylebookList li{ width:25%; } }
@media screen and (max-width:767px){
  #stylebookList li, .stylebookList li{ width:33%; }
  #stylebookList li p, .stylebookList li p{ font-size:.8rem; line-height:2.3rem; }
}
@media screen and (max-width:480px){
  #stylebookList li p, .stylebookList li p{ font-size:.75rem !important; line-height:2.2rem; }
}
@media screen and (max-width:460px){
  #instagram-list li, #top_instagram-list li{ width:50%; }
  #top_instagram-list li:nth-child(n+12){ display:none; }
}
@media screen and (max-width:375px){
  #stylebookList li p, .stylebookList li p{ font-size:.7rem !important; }
}

/* ===== Free Shipping Section ===== */
#free_shipping_section{ width:100%; padding:1rem 0 4rem; text-align:center; background:#B6B6B6; }
.freeshipping_area1{ margin:0 auto; }
.freeshipping_area2{ font-size:2.8rem; letter-spacing:2px; margin:0 auto 2rem; }
.freeshipping_area2 span{ font-size:6rem; color:#FFF447; }

#freeship_show, .freeshipBox{ width:100%; max-width:var(--max-wide,1080px); margin:0 auto; text-align:center; }
.freeshipBox li{ width:25% !important; margin:0 auto 2rem; float:left; }
.freeship_list{ position:relative; margin:0 0 1rem; }
.freeship_list p{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  background:rgba(237,237,237,.8); padding:.6rem 1rem; line-height:140%;
}

@media screen and (max-width:1023px){ .freeship_list p{ font-size:var(--font-size-m); } }
@media screen and (max-width:768px){
  .freeship_list p{ font-size:var(--font-size-m); }
  .freeship_list p span.tax{ font-size:var(--font-size-s); }
}
@media screen and (max-width:480px){ .freeship_list p{ padding:1rem; width:60%; } }

/* ===== Welcome Members ===== */
.WelcomeMembers{ width:97%; max-width:480px; margin:0 auto 1.5rem; background:#F3E3D0; padding:1rem; }
.WelcomeMembers ul{ width:100%; max-width:400px; margin:0 auto; font-size:0; }
.WelcomeMembers li{ clear:both; }
.WelcomeMembers li p{
  float:left; margin:.3rem .3rem 0 0; font-size:1rem; padding:.2rem .7rem; background:#8A7E61;
  border-radius:85px; line-height:160%; text-align:center; color:var(--color-wh);
}
.WelcomeMembers li p span{ font-size:1.5rem; font-weight:bold; }
.WelcomeMembers li div{ float:left; padding:.35rem .5rem; margin:.45rem 0 .3rem 0; font-size:1.3rem; font-weight:bold; }

@media screen and (max-width:480px){ .WelcomeMembers li div{ font-size:1rem; } }
@media screen and (max-width:375px){
  .WelcomeMembers li p span{ font-size:1.2rem; }
  .WelcomeMembers li div{ font-size:1.1rem; padding:.35rem; margin:.45rem 0 .3rem 0; }
}
@media screen and (max-width:320px){ .WelcomeMembers li div{ font-size:1rem; } }

/* ===== Footer Accordion ===== */
.footer-inner .accordion-footer{ width:95%; margin:0; padding:0; }
.accordion-footer p{
  width:100%; display:block; font-size:1.2rem; background:var(--color-dgy); color:var(--color-wh);
  padding:0 .5rem; margin:.2rem auto 0; line-height:250%; position:relative;
}
.accordion-footer p::after{
  content:""; position:absolute; top:0; bottom:0; right:1em; width:6px; height:6px;
  border-top:2px solid var(--color-wh); border-right:2px solid var(--color-wh); transform:rotate(135deg); margin:auto; transition:.5s;
}
.accordion-footer .active::after{ transform:rotate(-45deg); }
.accordion-footer div{ width:95%; margin:.3rem auto; }

.acc_a{
  background:var(--color-ltgy); padding:.6rem 0 .6rem 1.5rem; margin:.4rem auto; width:100%; display:block; position:relative; left:-.25rem;
}
.acc_a::before{
  content:""; position:absolute; top:0; bottom:0; left:.6rem; width:6px; height:6px;
  border-top:2px solid var(--color-bk); border-right:2px solid var(--color-bk); transform:rotate(45deg); margin:auto; transition:.5s;
}

/* ===== Product Page: Type Point ===== */
.type_point{ color:var(--color-dgy); font-size:1rem; }

/* ------------------------------
  レスポンシブ（共通調整）
------------------------------ */
@media screen and (max-width:1023px){
  .freeship_list p{ font-size:var(--font-size-m); }
}
@media screen and (min-width:768px) {
  .w768 {display: none !important;}
}
@media screen and (max-width:768px){
  #footer-contact{ width:96%; clear:both; text-align:center; }
  .snsIcon{ width:70%; }
  .snsIcon p{ font-size:2.5rem; }
  #button_footer div{ margin:1.2rem .5% .3rem; font-size:var(--font-size-m); }
  ul.credit{ width:100%; }
  ul.credit li{ max-height:20px; width:15%; margin-top:-1rem; }
  #global-nav .header_menu ul li{ border-bottom:1px solid var(--color-dgy); border-top:1px solid var(--color-dgy); }
}
@media screen and (max-width:560px){
  :root{ --header-height:40px; }
  #global-nav .header_menu ul{ font-size:1rem; }
}
@media screen and (max-width:480px){
  p.price{ font-size:1rem; }
  span.pricetext{ padding-left:2px; padding-right:2px; }
}
@media screen and (max-width:460px){
  #instagram-list li, #top_instagram-list li{ width:50%; }
  #top_instagram-list li:nth-child(n+12){ display:none; }
}
@media screen and (max-width:375px){
  #stylebookList li p, .stylebookList li p{ font-size:.7rem !important; }
}
@media screen and (max-width:320px){
  #info_footer{ font-size:.6rem; }
  .event_text{ font-size:.8rem; }
}
@media screen and (min-width:560px){
  .menu-drawer .content{ width:500px; }
}
/* ===== Events (event_list.html) ===== */
#event_list_pc{max-width:1400px; display:block; margin: 0 auto; }
#eventWrap_sp{ font-family:"Noto Sans JP","Helvetica Neue",Helvetica,"Yu Gothic Medium","Hiragino Kaku Gothic ProN",sans-serif; }
#eventWrap_sp, .event_box{ width:100%; margin:0; padding:0; display:flex; flex-wrap:wrap; }
.event_left{ width:42%; float:left; }
.event_right{ width:56%; height:auto; float:right; vertical-align:top; }
.event_text_h2{ font-weight:bold; font-size:1.2rem; color:#323232; margin:0; letter-spacing:.3vw; }
.event_text_h3{ font-weight:bold; font-size:1rem; color:#B6B6B6; margin:.3rem 0 0; }
.event_text{ font-size:var(--font-size-s, .8rem); color:#111; margin:.5rem 0 0; }

/* 300px以下：右側とテキストを非表示、.event_boxは5件まで */
@media screen and (max-width:300px){
  #event_list_pc { height: 1000px !important; overflow-y: hidden; }
  .event_left{ width:100%; max-width:230px; clear:both; margin:0; padding:0; }
  .event_right,.event_text_h2,.event_text_h3,.event_text{ display:none; }
  .event_box:nth-child(n+6){ display:none; }
}

/* 499px〜：カード化 */
@media screen and (min-width:499px){
  #eventWrap_sp{ width:95%; margin:0 auto; }
  .event_box{ width:32%; display:inline-block; margin-bottom:.5rem; }
  .event_left{ width:98%; margin:1%; clear:both; }
  .event_right{ width:98%; clear:both; padding-bottom:.5rem; }
  .event_text_h3{ margin-top:.5rem; }
  .event_text_h2{ font-size:1rem; }
}

/* 1079px〜：4列 */
@media screen and (min-width:1079px){
  .event_box{ width:24%; }
  #event_list_pc{ max-width: 1400px; height:1020px !important; overflow-y:hidden; }
}


@media screen and (min-width:481px) and (max-width:767px) {
  .w481_767 {
    display: none !important;
  }
  #event_list_pc {
    height: 610px !important;
    overflow-y: hidden;
  }
}
/* ===== Menu Primary (カテゴリメニュー) ===== */
.menu-primary li{ width:100%; margin:0 auto; border-bottom:1px solid #DDD; }
.menu-primary li:last-child{ padding-bottom:0; border-bottom:none; }
.menu-primary li:hover{ background:#F1F1F1; }
.menu-primary li a{ display:block; color:var(--color-bk); padding:1em 0; text-decoration:none; }