/* ── hero-info（hero-description / hero-logo）───────────── */
.hero-info{width:100%;max-width:1440px;margin:0 auto;padding:40px 20px 50px;text-align:center;background:#fff}
.hero-info .hero-description{font-family:'Noto Serif JP',serif;font-weight:400;font-size:15px;line-height:30px;letter-spacing:-.15px;   word-break: auto-phrase;color:#000;max-width:362px;margin:0 auto}
.hero-info .hero-description p{margin:0}
.hero-info .hero-description br.u-sp-only{display:inline}
.hero-info .hero-logo{display:block;width:50px;height:auto;margin:24px auto 0}
.hero-info .hero-logo img{width:100%;height:auto;display:block}

@media(min-width:1100px){
  .hero-info{padding:50px 20px 60px}
  .hero-info .hero-description{max-width:1340px}
  .hero-info .hero-description br.u-sp-only{display:none}
  .hero-info .hero-logo{width:61px;margin-top:30px}
}

/* 共通コンポーネント：overlay-button-black / check-button（複数セクションで再利用） */
.overlay-button-black{display:block;position:absolute;right:10px;bottom:5px;width:77px;height:60px;padding:0;margin:0;border:0;background:none;line-height:0;cursor:pointer;z-index:3}
.overlay-button-black img{width:100%;height:100%;display:block}

.overlay-button-black.check-button4{right:30px;bottom:15px;width:130px;height:40px;}
.overlay-button-black.check-button5{right:0;bottom:0;width:90px;height:40px;}
/* THE STORE by C'：写真に被らないよう、写真の下に配置 */
.overlay-button-black.check-button5--below{position:static;align-self:flex-end;margin-top:-20px}

.check-button{display:block;width:100%;max-width:240px;padding:0;margin:0;border:0;background:none;line-height:0;cursor:pointer;transition:opacity .3s}
.check-button:hover{opacity:.6}
.check-button img{width:100%;height:auto;display:block}

@media(min-width:1100px){
  .overlay-button-black{width:90px;height:70px}
}

@media(max-width:767.9px){
  .overlay-button-black.check-button4{right:10px;bottom:5px;width:98px;height:30px;}
}

/* 共通コンポーネント：photo_modal（写真拡大オーバーレイ、全セクション共通で再利用） */
[data-photo-modal-target]{cursor:pointer}
html.is-photo_modal-open,body.is-photo_modal-open{overflow:hidden}
.photo_modal{position:fixed;inset:0;z-index:2000;display:none;align-items:center;justify-content:center;opacity:0;pointer-events:none;overscroll-behavior:contain;transition:opacity .3s ease}
.photo_modal.is-active{display:flex;opacity:1;pointer-events:auto}
.photo_modal-overlay{position:absolute;inset:0;background:rgba(0,0,0,.4);overscroll-behavior:contain}
/* Safari対策：panelがbodyより低いと角丸clip内で写真が下にはみ出るため、両者のmax-heightを揃える */
.photo_modal-panel{position:relative;width:700px;max-width:80vw;max-height:min(760px,88vh);max-height:min(760px,88dvh);overflow:hidden;background:#fff;border-radius:20px;opacity:0;transform:scale(.8);transition:all .3s ease}
.photo_modal.is-active .photo_modal-panel{animation:photoModalFadeInScale .4s ease forwards}
@keyframes photoModalFadeInScale{
  0%{opacity:0;transform:scale(.8)}
  100%{opacity:1;transform:scale(1)}
}
.photo_modal-close{position:absolute;top:10px;right:5px;width:40px;height:40px;padding:10px;margin:0;border:0;background:none;cursor:pointer;z-index:2;mix-blend-mode:multiply;opacity:.6}
.photo_modal-close img{width:100%;height:100%;display:block}
.photo_modal-body{max-height:min(760px,88vh);max-height:min(760px,88dvh);overflow-y:auto;overscroll-behavior:contain;padding:0 40px 40px 40px}
.photo_modal-body::-webkit-scrollbar{width:8px}
.photo_modal-body::-webkit-scrollbar-track{background:#fff}
.photo_modal-body::-webkit-scrollbar-thumb{background:#999;border-radius:999px}
.photo_modal-header{display:flex;flex-direction:column;align-items:flex-start;gap:15px;height:fit-content;justify-content:center;margin-bottom:30px}
.photo_modal-floor{display:flex;align-items:center;justify-content:center;flex:0 0 auto;width:120px;height:30px;background:#000;color:#fff;font-family:'Noto Sans JP',sans-serif;font-size:12px;letter-spacing:.05em;text-align:center}
.photo_modal-brand{margin:0;font-family:'Noto Sans JP',sans-serif;font-size:16px;line-height:28px;color:#000;text-decoration:underline}
.photo_modal-brand:visited{color:#000}
.photo_modal-brand:hover{color:#A28467;text-decoration:none}
.sup-size-14{font-size:140%;vertical-align:-2px;line-height:1}
.photo_modal-hero{width:100%;overflow:hidden}
.photo_modal-hero img{width:100%;height:auto;display:block}
.photo_modal-description{margin:30px 0 0;font-family:'Noto Sans JP',sans-serif;font-size:13px;line-height:1.62;color:#000;white-space:pre-wrap}
/* 複数枚写真：scroll-snapで横スクロール表示 */
.photo_modal-swiper{width:87%;margin:30px auto 0;overflow-x:auto;overflow-y:hidden;display:flex;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.photo_modal-swiper::-webkit-scrollbar{height:6px}
.photo_modal-swiper::-webkit-scrollbar-track{background:#fff}
.photo_modal-swiper::-webkit-scrollbar-thumb{background:#999;border-radius:999px}
.photo_modal-swiper-slide{flex:0 0 100%;scroll-snap-align:start}
.photo_modal-swiper-slide img{width:100%;height:100%;object-fit:cover;display:block}

/* item-07・08（写真3枚）：slick.js導入。高さはJSで実写真比率から算出 */
.photo_modal-swiper.slick-initialized{display:block;overflow:visible;background:#fff}
.photo_modal-swiper.slick-initialized .slick-list,
.photo_modal-swiper.slick-initialized .slick-track,
.photo_modal-swiper.slick-initialized .slick-slide,
.photo_modal-swiper.slick-initialized .slick-slide>div{height:100%}
.photo_modal-swiper.slick-initialized .slick-slide img{width:100%;height:100%;object-fit:contain;display:block}
/* 縦写真（.is-portrait）は幅を絞りセンター表示 */
.photo_modal-swiper.slick-initialized .slick-slide img.is-portrait{width:77%;margin:0 auto}
.photo_modal-swiper .slick-arrow{width:5.3%;height:100%;top:0;margin:0;padding:0;transform:none;background:none;z-index:1}
.photo_modal-swiper .slick-prev{left:-7.07%}
.photo_modal-swiper .slick-next{right:-7.07%}
.photo_modal-swiper .slick-prev:before,.photo_modal-swiper .slick-next:before{
  content:'';
  display:block;
  width:100%;
  height:100%;
  opacity:1;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 52'%3E%3Cpath d='M6 4 L22 26 L6 48' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat 50% calc(50% + 6px)/55% 52%;
}
.photo_modal-swiper .slick-prev:before{transform:scaleX(-1)}
.photo_modal-swiper .slick-dots{display:none}
.photo_modal-swiper_counter{margin:5px 0 0;font-family:'Noto Sans JP',sans-serif;font-size:16px;line-height:1.316;color:#000;text-align:center}

/* brand_story専用オーバーレイ本文のレイアウト */
.photo_modal-brand_story .photo_modal-header{margin-bottom:30px}
.photo_modal-brand_story-title{margin:0 0 30px;font-family:'Noto Serif JP',serif;font-weight:900;font-size:18px;line-height:1.3;color:#000}
.photo_modal-brand_story-text{margin:0 0 20px;font-family:'Noto Sans JP',sans-serif;font-size:13px;line-height:1.62;color:#000;white-space:pre-wrap}
.photo_modal-brand_story-photo{margin:0 3px 20px;aspect-ratio:640/430;overflow:hidden}
.photo_modal-brand_story-photo img{width:100%;height:100%;object-fit:cover;display:block}
.photo_modal-brand_story-photo:last-child{margin-bottom:0}
#photo_modal-brand_story .photo_modal-panel{background:#e3d7b7}
#photo_modal-brand_story .photo_modal-body::-webkit-scrollbar-track{background:#e3d7b7}

@media(min-width:768px){
  .photo_modal-panel{width:500px;max-width:80vw;max-height:min(700px,92vh)}
  .photo_modal-body{max-height:min(700px,92vh)}
}

/* Safari（Mac/iPhone共通）は角丸パネルからスクロールバーがはみ出て見えるため非表示にする */
/* jsでUA判定し、html.is-safariで対応 */
html.is-safari .photo_modal-body{scrollbar-width:none;-ms-overflow-style:none}
html.is-safari .photo_modal-body::-webkit-scrollbar{display:none}

/* 共通コンポーネント：outer-cta（View Photosボタン） */
.outer-cta{display:block;width:100%;max-width:180px;height:30px;padding:0;margin:0;border:0;background:#fff;position:relative;text-align:left;cursor:pointer}
.outer-cta_label{position:absolute;left:0;bottom:2px;font-family:'Noto Serif JP',serif;font-weight:500;font-size:14px;letter-spacing:.09em;color:#000}
.outer-cta_icon{position:absolute;left:0;bottom:0;width:100%;height:auto;display:block}

@media(min-width:1100px){
  .outer-cta{height:40px}
  .outer-cta_label{font-size:16px;letter-spacing:1.44px;bottom:3px}
}

/* true_standard（Vol.15／定番アイテム17点）：01=タイトルと1組、02/05/10/17=wide、03/04/06-09/12/13/15/16=square、11/14=tall、03-04・06-09・11-16はDesktopのみ2列マソンリー */
.true_standard{position:relative;max-width:1000px;margin:0 auto;padding:40px 20px 0}
.true_standard-list{display:flex;flex-direction:column;gap:30px}

.true_standard-title{width:100%;max-width:320px;margin:0 auto}
.true_standard-title_logo{width:100%;aspect-ratio:320/130;margin-bottom:20px;overflow:hidden}
.true_standard-title_logo img{width:100%;height:100%;object-fit:cover;display:block}
.true_standard-title_meta{position:relative;display:flex;align-items:center;gap:20px;min-height:65px;padding:10px 0;border-top:1px solid #808080;border-bottom:1px solid #808080}
.true_standard-title_vol{margin:0;flex:0 0 auto;position:relative;padding-right:20px;font-family:'Old Standard TT','Noto Serif JP',serif;font-style:italic;font-size:18px;text-align:center}
.true_standard-title_vol::after{content:"";position:absolute;top:-10px;right:0;bottom:-10px;width:1px;background:#000}
.true_standard-title_tagline{margin:0;font-family:'Noto Serif JP',serif;font-size:16px;line-height:24px;text-transform:uppercase}

/* ── アイテム共通（写真・catch・detail）───────────────────── */
.true_standard_item-photo_group{position:relative;overflow:hidden;display:block;padding:0;border:0;background:none}
.true_standard_item-photo_group img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%);display:block;transition:transform .3s ease}
.true_standard_item-photo_group:hover img{transform:scale(1.1)}

/* モバイルは%指定、デスクトップはpx固定値（--catch-*-d）に切替 */
.true_standard_item-catch{position:absolute;left:var(--catch-l,auto);top:var(--catch-t,auto);right:var(--catch-r,auto);bottom:var(--catch-b,auto);z-index:2;pointer-events:none;font-size:14px;line-height:1}
.true_standard_item-catch_text{writing-mode:vertical-rl;color:#fff;font-family:'Noto Sans JP',sans-serif;font-size:14px;letter-spacing:.05em;line-height:1.3;white-space:nowrap;text-shadow:0 1px 4px rgba(0,0,0,.5)}
/* 縦中横：2桁数字・2文字英字を横向き表示 */
.u-tcy{text-combine-upright:all;-webkit-text-combine:horizontal;-ms-text-combine-horizontal:all}
.true_standard_item-catch--dark .true_standard_item-catch_text{color:#000;text-shadow:none}
/* Safari対策：縦書き2行の右寄せキャッチは幅未指定だと右にはみ出て見切れる（04/09/14/16対象） */
.true_standard_item-catch--fixed2col{width:37px}
/* evam eva（05番）：モバイルのみ2行になるため幅固定（Desktopは1行のままでよい） */
@media(max-width:767.9px){
  .true_standard_item-catch--fixed2col-sp{width:37px}
}
/* 同じSafari対策の1行版：右寄せ1行キャッチが右にずれて見えるため幅固定（10 RING JACKET・17 芋屋金次郎対象） */
.true_standard_item-catch--fixed1col{width:19px}
/* 06・15番：モバイル・デスクトップとも横書き（--catch-w依存） */
.true_standard_item-catch--horizontal .true_standard_item-catch_text{writing-mode:horizontal-tb;white-space:normal;text-align:left;line-height:1.3;width:var(--catch-w,auto)}
/* 01・02・08番：モバイルのみ横書き、デスクトップは縦書き */
.true_standard_item-catch--horizontal-sp .true_standard_item-catch_text{writing-mode:horizontal-tb;white-space:normal;text-align:left;line-height:1.3;width:var(--catch-w,auto)}

.true_standard_item-detail{width:fit-content;display:flex;flex-direction:column;gap:10px}
/* shop_row・price_rowは下揃え、item_rowは中央揃え */
.true_standard_item-shop_row,.true_standard_item-item_row,.true_standard_item-price_row{display:flex;gap:20px;min-height:30px;border-bottom:1px solid #ccc}
.true_standard_item-shop_row,.true_standard_item-price_row{align-items:flex-end}
.true_standard_item-item_row{align-items:center}
.true_standard_item-shop_label,.true_standard_item-item_label,.true_standard_item-price_label{flex:0 0 40px;margin:0;font-family:'Noto Sans JP',sans-serif;font-size:12px;text-transform:uppercase;color:#000}
/* Firefox対策：fit-content幅の誤差で最後の1文字だけ改行されるためnowrap指定（2行分は<br>で対応） */
.true_standard_item-shop_name,.true_standard_item-item_name{margin:0;font-family:'Noto Sans JP',sans-serif;font-weight:700;font-size:16px;white-space:nowrap}
.true_standard_item-shop_open-schedule{font-weight:400;font-size:12px;margin-left:12px;}
.true_standard_item-17 .true_standard_item-price_value{white-space:nowrap}
.true_standard_item-price_value{margin:0;font-family:'Noto Sans JP',sans-serif;font-size:14px}

/* ── head（title＋#01）────────────────────────────────────── */
.true_standard-head{display:contents}

/* ── wideパターン（#02,05,10,17／#01はheadで個別処理）──────── */
.true_standard_item--wide{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.true_standard_item--wide .true_standard_item-photo_group{width:100%;aspect-ratio:var(--ar)}

/* ── squareパターン（#03,04,06,07,08,09,12,13,15,16）───────── */
.true_standard_item--square{display:flex;flex-direction:column;align-items:flex-start;gap:10px;width:100%}
.true_standard_item--square .true_standard_item-photo_group{width:100%;aspect-ratio:4/3}

/* ── tallパターン（#11,14）─────────────────────────────────── */
.true_standard_item--tall{display:flex;flex-direction:column;align-items:flex-start;gap:10px;width:100%}
.true_standard_item--tall .true_standard_item-photo_group{width:100%;aspect-ratio:1/1}

/* ── 2列マソンリー（#03-04／#06-09／#11-16）：Desktopのみ、列ごとにmargin-topで高さのズレを再現 ── */
.true_standard-cols{display:contents}
.true_standard-col{display:contents}

@media(min-width:768px){
  .true_standard{padding:60px 20px 0}
  .true_standard-list{gap:0}
  .true_standard-list>*{margin-top:var(--mt-d,0px)}

  .true_standard-title{max-width:none;width:320px}

  .true_standard-head{display:grid;grid-template-columns:320px 600px;column-gap:40px;row-gap:162px}
  .true_standard-head .true_standard-title{grid-column:1;grid-row:1}
  .true_standard-head .true_standard_item-01{display:contents}
  .true_standard-head .true_standard_item-01 .true_standard_item-detail{grid-column:1;grid-row:1 / 3;align-self:center}
  .true_standard-head .true_standard_item-01 .true_standard_item-photo_group{grid-column:2;grid-row:1 / 3}

  .true_standard_item--wide{flex-direction:row;align-items:center;gap:40px}
  .true_standard_item--wide.true_standard_item--reverse{flex-direction:row-reverse}
  .true_standard_item--wide .true_standard_item-photo_group{width:var(--w-d);aspect-ratio:auto;height:var(--h-d);flex-shrink:0}
  /* 10 RING JACKET：情報量が少なく写真とcenter揃えだと上に余白が空くのでtop揃えに */
  .true_standard_item-10.true_standard_item--wide{align-items:flex-start}

  .true_standard_item--square .true_standard_item-photo_group,
  .true_standard_item--tall .true_standard_item-photo_group{width:460px}

  .true_standard-cols{display:flex;flex-direction:row;align-items:flex-start;column-gap:40px}
  .true_standard-col{display:flex;flex-direction:column;flex:0 0 460px}
  .true_standard-col>.true_standard_item{margin-top:var(--mt-d,0px)}

  /* catch：モバイルは%、デスクトップはpx固定値に切替 */
  .true_standard_item-catch{
    left:var(--catch-l-d,var(--catch-l,auto));
    top:var(--catch-t-d,var(--catch-t,auto));
    right:var(--catch-r-d,var(--catch-r,auto));
    bottom:var(--catch-b-d,var(--catch-b,auto));
  }
  .true_standard_item-catch--horizontal .true_standard_item-catch_text{width:var(--catch-w-d,var(--catch-w,auto))}
  /* 01・02・08：モバイル横書き→デスクトップ縦書きに戻す */
  .true_standard_item-catch--horizontal-sp .true_standard_item-catch_text{writing-mode:vertical-rl;white-space:nowrap;line-height:1.3;width:auto}
}

/* 768〜1099px：zoomで1100px基準に縮小、shop_name/item_nameは最低90%・price_valueは100%を保持 */
@media(min-width:768px) and (max-width:1099.98px){
  .true_standard{
    --scale:clamp(calc(768px / 1100px),calc(100vw / 1100px),1);
    --font-scale:clamp(.9,calc(.9 + .1 * (100vw - 768px) / (1100px - 768px)),1);
    zoom:var(--scale);
  }
  .true_standard_item-shop_name,.true_standard_item-item_name{font-size:calc(16px * var(--font-scale) / var(--scale))}
  .true_standard_item-price_value{font-size:calc(14px / var(--scale))}
}

@media(max-width:767.9px){
  .true_standard_item-shop_open-schedule{display:block;margin-left:0;margin-top:-3px;}
  .true_standard_item-12 .true_standard_item-shop_row{align-items:center}

    .true_standard_item.true_standard_item-03,
    .true_standard_item.true_standard_item-04,
    .true_standard_item.true_standard_item-06,
    .true_standard_item.true_standard_item-07,
    .true_standard_item.true_standard_item-08,
    .true_standard_item.true_standard_item-09,
    .true_standard_item.true_standard_item-11,
    .true_standard_item.true_standard_item-12,
    .true_standard_item.true_standard_item-13,
    .true_standard_item.true_standard_item-14,
    .true_standard_item.true_standard_item-15,
    .true_standard_item.true_standard_item-16{margin-inline:20px;width: calc(100% - 40px);}
}

/* モバイルのみ表示順を変更：THE NORTH FACE＋の後をAUX PARADIS→MOLTON BROWN→伊織→WASHIN OPTICAL→(Epoi)に（デスクトップの列組みは変更なし） */
@media(max-width:767.9px){
  .true_standard_item-14{order:1}
  .true_standard_item-12{order:2}
  .true_standard_item-13{order:3}
  .true_standard_item-15{order:4}
  .true_standard_item-16{order:5}
  .true_standard_item-17{order:6}
}

/* brand_story（Cotopaxiのバックパック）：単発セクション、実測値をそのまま反映 */
.brand_story{position:relative;max-width:1064px;margin:0 20px;padding:60px 0;border-bottom: double #333 4px;}

.brand_story-border{display:block;width:100%;min-height: 24px;overflow: hidden;}
.brand_story-border img{display:block;min-width: 683px;min-height: 24px;}

.brand_story-heading{display:flex;align-items:flex-start;gap:10px;margin-top:26px}
.brand_story-tag_wrap{position:relative;flex:0 0 auto;width:88px;height:31px}
.brand_story-tag_wrap img{width:100%;height:100%;object-fit:fill;display:block}
.brand_story-tag{position:absolute;left: 0;top: 12px;display:flex;align-items:center;justify-content:center;width: 100%;height: 20px;padding:0 8px;border-radius: 100px;background:#000}
.brand_story-tag_number{margin:0;font-family:'Noto Serif JP',serif;font-weight:700;font-size:16px;line-height:1;color:#fff;white-space:nowrap}
.brand_story-title{margin:10px 0 0;font-family:'Noto Serif JP',serif;font-weight:900;font-size:18px;line-height:1.3;color:#000}

.brand_story-photo_group{position:relative;margin-top:24px;overflow:hidden;width:100%;aspect-ratio:362/256.417}
.brand_story-photo_group img.brand_story-photo{width:100%;height:100%;object-fit:cover;object-position:44.5% 40%;display:block;transition:transform .3s ease}
.brand_story-photo_group:hover img.brand_story-photo{transform:scale(1.1)}
.brand_story-logo{display:none}

.brand_story-body{margin:10px 0 0;font-family:'Noto Sans JP',sans-serif;font-size:12px;line-height:1.4;color:#000}

@media(min-width:1100px){
  .brand_story{max-width: 1024px;padding: 150px 0 100px;margin: 0 auto;border-bottom: double #333 6px;}
  .brand_story-border{height:36px}

  .brand_story-heading{gap:16.67px;margin-top:80px;width:800px;margin-inline:auto}
  .brand_story-tag_wrap{width:126.33px;height:50px}
  .brand_story-tag{left:0;top:20px;width: 100%;height:30px;padding:0 12px;}
  .brand_story-tag_number{font-size:20px}
  .brand_story-title{margin-top:12px;font-size:30px}

  .brand_story-photo_group{margin-top:15px;aspect-ratio:840/595;width:800px;margin-inline:auto}
  .brand_story-logo.u-pc-only{display:block;position:absolute;left:10px;bottom:10px;width:20.02px;height:149.88px;opacity:.4;object-fit:cover;pointer-events:none}

  .brand_story-body{margin-top:20px;font-size:14px;line-height:1.4;width:800px;margin-inline:auto}
}

/* common_footer（バナー×3／Q&A）：Q&Aは記事ごとに個別開閉、バナーはDesktopのみGridで並び替え */
.common_footer{position:relative;width:100%;overflow:hidden}

.common_footer-top{position:relative;background-color:#fff}

.common_footer-banner_group{max-width:500px;margin:0 auto;padding:0 20px}
.common_footer-disclaimer{margin:60px 0 0;font-family:'Noto Sans JP',sans-serif;font-size:12px;line-height:2;color:#666}

.common_footer-qa{position:relative;max-width:90%;margin:60px auto 0;border:1px solid #333;background:#fff}
.common_footer-qa_heading{display:flex;align-items:center;justify-content:center;width:100%;height:50px;margin:0;padding:0;font-family:'Noto Sans JP',sans-serif;font-weight:500;font-size:18px;line-height:24px;color:#000}

.common_footer-qa_list{display:flex;flex-direction:column;gap:15px;padding:10px 12.5px 15px;margin:0}

/* qa_article区切り線はgapのみで再現（margin/paddingの二重付与を避ける） */
.qa_article{width:100%;border-bottom:1px solid #ccc;padding-bottom:15px}
.qa_article-question{display:flex;align-items:flex-start;gap:20px;width:100%;margin:0;padding:0;border:0;background:none;font:inherit;text-align:left;cursor:pointer}
.qa_article-answer{display:none;align-items:flex-start;gap:20px;margin-top:15px}
.qa_article[data-open="true"] .qa_article-answer{display:flex}
.qa_article-badge{flex:0 0 18px;width:18px;height:18px;border:1px solid;display:flex;align-items:center;justify-content:center;margin:0;padding-bottom:2px;font-family:'Noto Sans JP',sans-serif;font-weight:700;font-size:14px;line-height:1}
.qa_article-badge--q{color:#2693ff;border-color:#2693ff}
.qa_article-badge--a{color:#a28467;border-color:#a28467}
.qa_article-question_text{flex:1;margin:0;font-family:'Noto Sans JP',sans-serif;font-size:14px;line-height:1.6;letter-spacing:-.02em;color:#000}
.qa_article-answer_text{margin:0;font-family:'Noto Sans JP',sans-serif;font-size:13px;line-height:1.62;color:#000;white-space:pre-wrap}
/* リンクはブラウザ標準色で明示（デフォルトカラーでOKの指示） */
.qa_article-answer_text a{color:#0000EE;text-decoration:underline}
.qa_article-answer_text a:visited{color:#551A8B}

/* トグルアイコン：＋/－を縦棒の90度回転で表現 */
.qa_article-question_toggle_icon{position:relative;flex:0 0 15px;width:15px;height:15px;margin:4px 0 0}
.qa_article-question_toggle_icon::before,
.qa_article-question_toggle_icon::after{content:"";position:absolute;top:50%;left:50%;background:#333;transform:translate(-50%,-50%)}
.qa_article-question_toggle_icon::before{width:10px;height:1px}
.qa_article-question_toggle_icon::after{width:1px;height:10px}
.qa_article[data-open="true"] .qa_article-question_toggle_icon::after{transform:translate(-50%,-50%) rotate(90deg)}

@media(min-width:1100px){
  .common_footer-banner_group{max-width:1064px;padding:0 20px}
  .common_footer-disclaimer{margin-top:90px;max-width:1024px;margin-left:auto;margin-right:auto}

  .common_footer-qa{max-width:1024px;margin-top:90px}
  .common_footer-qa_list{padding:10px 35px 32px;gap:20px}
  .qa_article{padding-bottom:16px}
  .qa_article[data-open="true"] .qa_article-answer{margin-top:16px}
  .qa_article-badge{flex-basis:34px;width:34px;height:34px;font-size:18px;padding-bottom:3px}
  .qa_article-question_text{font-size:14px}
  .qa_article-question_toggle_icon{flex-basis:21px;width:21px;height:21px;margin-top:12px}
  .qa_article-question_toggle_icon::before{width:14px;height:1px}
  .qa_article-question_toggle_icon::after{width:1px;height:14px}
}

/* 〜390px：main-contents全体をzoomで縮小（Firefox対策はosampo2026AW.js参照） */
@media(max-width:390px){
  :root{--scale-sp:clamp(.82,calc(100vw / 395px),1)}

  .main-contents{
    zoom:var(--scale-sp);
  }
  .main-contents > .photo_modal{
    zoom:calc(1 / var(--scale-sp));
  }
}

/* スクロール連動フェードイン（osampo2026AW.js制御） */
.main-contents .fade-in{opacity:0}
.main-contents .fade-in-up{transform:translate(0,80px)}
.main-contents .fade-in-down{transform:translate(0,-80px)}
.main-contents .fade-in-left{transform:translate(-80px,0)}
.main-contents .fade-in-right{transform:translate(80px,0)}
.main-contents .scroll-in{animation:fadeIn .8s ease;animation-fill-mode:forwards}

/* name_price行数は可変のためanimation-delayはJSで動的付与 */

@keyframes fadeIn{
  0%{opacity:0}
  50%{opacity:.4}
  100%{opacity:1;transform:translate(0,0)}
}
