/* Reset & base */
@charset "utf-8";
*{box-sizing:border-box}
html,body{margin:0}
:root{
  --bg:#FAFAF7;--ink:#222;--muted:#5b5b5b;--brand:#0A3A5E;--brand-2:#0E4B7E;--line:#E7E4DD;--card:#FFFFFF;--shade:#F4F2EE;
}
/*#lp-primo{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic UI","Yu Gothic",sans-serif;color:var(--ink);background:var(--bg);line-height:1.8}
*/
#lp-primo{font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;color:var(--ink);background:var(--bg);line-height:1.8}
#lp-primo img{max-width:100%;height:auto;display:block}
#lp-primo .container{width:min(1200px,92%);margin-inline:auto}
#lp-primo .narrow{width:min(880px,92%)}
#lp-primo .section{padding:72px 0}
#lp-primo .section--shade{background:var(--shade)}
#lp-primo .display{font-family:"Noto Serif JP","Yu Mincho",serif;font-weight:700;font-size:clamp(28px,3.6vw,44px);letter-spacing:.02em;margin:0 0 16px}
#lp-primo .lead{font-size:clamp(16px,1.6vw,18px);color:var(--muted);margin:0 0 28px}

/* Header */
/*
#lp-primo .site-header{position:sticky;top:0;z-index:30;background:rgba(250,250,247,.8);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--line)}
#lp-primo .header-inner{display:flex;align-items:center;gap:24px;padding:12px 0}
#lp-primo .brand{font-weight:700;letter-spacing:.12em;text-decoration:none;color:var(--ink)}
#lp-primo .main-nav{margin-left:auto;display:flex;gap:20px}
#lp-primo .main-nav a{text-decoration:none;color:var(--muted)}
#lp-primo .main-nav a:hover{color:var(--ink)}
#lp-primo .cart-button{margin-left:8px;background:none;border:1px solid var(--line);border-radius:8px;padding:6px 10px;cursor:pointer}
#lp-primo .badge{margin-left:4px;background:var(--brand);color:#fff;border-radius:999px;padding:0 6px;font-size:12px}
*/

/* Hero */
/*
#lp-primo .hero{background:linear-gradient(180deg,rgba(10,58,94,.08),rgba(10,58,94,0)),radial-gradient(80% 100% at 80% 0%,rgba(0,0,0,.20),transparent 60%);min-height:68vh;display:grid;align-items:center}
#lp-primo .hero-inner{padding:64px 0}
#lp-primo .cta-row{display:flex;flex-wrap:wrap;gap:12px}
#lp-primo .btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border-radius:10px;text-decoration:none;cursor:pointer;transition:.2s ease}
#lp-primo .btn-primary{background:var(--brand);color:#fff;border:1px solid var(--brand)}
#lp-primo .btn-primary:hover{background:var(--brand-2);border-color:var(--brand-2)}
#lp-primo .btn-outline{border:1px solid var(--ink);color:var(--ink);background:#fff}
#lp-primo .btn-outline:hover{border-color:var(--brand);color:var(--brand)}
#lp-primo .btn-ghost{border:1px solid var(--line);background:transparent;color:var(--ink)}
*/

/* Features */
/*
#lp-primo .features{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;list-style:none;padding:0;margin:24px 0 0}
#lp-primo .features li{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px;text-align:center}
#lp-primo .features .icon{width:32px;height:32px;margin:0 auto 10px;fill:currentColor;color:var(--brand)}
#lp-primo .features h3{margin:.2rem 0 .2rem;font-size:16px}
#lp-primo .features p{margin:0;color:var(--muted);font-size:14px}
*/

/* Products */
/*
#lp-primo .grid.products{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
#lp-primo .card{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column}
#lp-primo .card .media{aspect-ratio:4/3;background:linear-gradient(135deg,#d7d7d2,#efefe9);border-bottom:1px solid var(--line)}
#lp-primo .card-body{padding:18px}
#lp-primo .card h3{margin:0 0 6px;font-size:18px}
#lp-primo .price{margin:0 0 8px;color:var(--muted)}
#lp-primo .bullets{margin:8px 0 14px;padding-left:18px}
#lp-primo .controls{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:10px 0 14px}
#lp-primo .controls label{display:grid;gap:6px;font-size:14px}
#lp-primo .controls select,.controls input{padding:8px;border:1px solid var(--line);border-radius:8px;background:#fff}
*/

/* Size table */
/*
#lp-primo .table-scroll{overflow:auto}
#lp-primo .size-table{border-collapse:collapse;width:100%;min-width:560px}
#lp-primo .size-table th,.size-table td{border:1px solid var(--line);padding:8px;text-align:center}
*/

/* Reviews */
#lp-primo .reviews{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
#lp-primo .reviews blockquote{margin:0;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px}
#lp-primo .reviews footer{color:var(--muted);font-size:14px}

/* Shops */
#lp-primo .shops{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
#lp-primo .shops h2{margin:0 0 6px;font-size:20px;font-weight: bold;}
#lp-primo .shop-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px}
#lp-primo .shop-card h3{font-weight: bold;margin-bottom: 10px;font-size:16px;}
#lp-primo .shop-card p{line-height: 1.5;}
#lp-primo .store-link{margin-top:12px}

/* Sticky CTA */
#lp-primo .sticky-cta{position:sticky;bottom:0;border-top:1px solid var(--line);background:rgba(250,250,247,.9);backdrop-filter:saturate(180%) blur(6px);padding:10px 0;z-index:20}
#lp-primo .sticky-cta .container{display:flex;align-items:center;justify-content:space-between;gap:10px}

/* Cart */
/*
#lp-primo .cart{position:fixed;inset:0;display:grid;grid-template-columns:1fr;place-items:end center}
#lp-primo .cart__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.32)}
#lp-primo .cart__panel{position:relative;z-index:1;width:min(560px,92%);max-height:92vh;background:#fff;border-radius:16px;box-shadow:0 10px 40px rgba(0,0,0,.2);display:flex;flex-direction:column}
#lp-primo .cart__header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:14px 16px}
#lp-primo .icon-btn{border:none;background:transparent;font-size:20px;cursor:pointer}
#lp-primo .cart__items{padding:10px 16px;overflow:auto;flex:1}
#lp-primo .cart-item{display:grid;grid-template-columns:1fr auto;gap:8px;border-bottom:1px solid var(--line);padding:10px 0}
#lp-primo .cart__footer{border-top:1px solid var(--line);padding:14px 16px}
#lp-primo .cart__total{font-weight:700;margin-bottom:10px}
#lp-primo .note{color:var(--muted);font-size:12px;margin-top:8px}
*/

/* Footer */
#lp-primo .site-footer{border-top:1px solid var(--line);padding:24px 0;margin-top:56px}

/* Responsive */
@media (max-width:1199px){
	#lp-primo .grid.products{grid-template-columns:repeat(2,1fr)}
	#lp-primo .features{grid-template-columns:repeat(2,1fr)}
	#lp-primo .shops{grid-template-columns:repeat(2,1fr)}
	#lp-primo .reviews{grid-template-columns:1fr}
}
@media (max-width:719px){
	#lp-primo .grid.products{grid-template-columns: 1fr;}
	#lp-primo .features{grid-template-columns:1fr}
	#lp-primo .controls{grid-template-columns:1fr 1fr}
	#lp-primo .shops{grid-template-columns:1fr}
	#lp-primo .header-inner{gap:12px}
	#lp-primo .main-nav{display:none}
	
	#lp-primo .shops h2{margin:0 0 6px;font-size:16px;font-weight: bold;}
	#lp-primo .shop-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px}
	#lp-primo .shop-card h3{font-weight: bold;margin-bottom: 10px;font-size:14px;}
	#lp-primo .shop-card p{line-height: 1.5;font-size:13px;}

}


/*-------------------------------------------------------------------------------------------------------------*/

#primo_category .try-noto {
  font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;
}	

#primo_category .pc-banner { 	display: none;	 	}
#primo_category .pc-banner img {max-width:100%; max-height: auto;	}
#primo_category .sp-banner {
 	display: block; 
	width: 100%;
	text-align:center;
	margin-top: 0px;
}
#primo_category .sp-banner img {max-width:100%; max-height: auto;	}

#primo_category .comment01 {
	margin:20px 0 10px;
	text-align:center;
	line-height:2.0;
	font-size: 16px;
	font-weight: bold;
}

#primo_category .comment02 {
	margin:20px 0 10px;
	text-align:center;
	line-height:2.0;
	font-size: 13px;
	font-weight: normal;
}

#primo_category .comment03 {
	margin:20px 0 10px;
	text-align:center;
	line-height:1.5;
	font-size: 20px; color: #880002;
	font-weight: bold;
}
	
#primo_category .flex_box { display: flex; margin-top:30px; justify-content:center; flex-wrap: wrap; }
#primo_category .flex_item {  margin: 0 5px 20px;}
/*#primo_category .flex_item img { width: 99%; text-align: center;}*/
#primo_category .flex_item img { width: 100%; text-align: center;}
	
#primo_category .br_block { display: block;}

#primo_category .primo-sub {  margin: 80px 0 20px; }

#primo_category .primo-sub-img {
  width: 95%;
  text-align: center;
  margin: 40px auto; 
}

#primo_category .primo-sub-img img {
  width: 100%;
  height: auto;
  max-width: 100%;
}

#primo_category .pd_box1 {
	font-size:11px;
	color:#262626;
	line-height: 1.8;
	text-align: left;
	margin: 5px 5px 0;
}


/*動画*/
#primo_category .video-section { padding: 24px 0; }

/* センタリング専用の外枠（親の影響を打ち消す） */
#primo_category .video-center {
  display: grid;
  justify-items: center; /* 横中央 */
	
	
  width: 100%;
  box-sizing: border-box;
	
}

/* 幅：スマホ100%／PC60%。中央は上のgridで保証 */
#primo_category .video-wrap {
  width: 95%;
  aspect-ratio: 16 / 9;
  border-radius: 8px; overflow: hidden;	
	
	
  box-sizing: border-box;
	
}

@media (min-width: 768px) {  #primo_category .video-wrap { width: 70%; }}

/* iframe */
#primo_category .video-wrap iframe {
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
}
/*動画*/




/*------------------------------------------------------*/

/*
.sp_top5  {	margin-top: 5px;}
.sp_top10 {	margin-top: 10px;}
.sp_top15 {	margin-top: 15px;}
.sp_top20 {	margin-top: 20px;}
.sp_top30 {	margin-top: 30px;}
.sp_top40 {	margin-top: 40px;}
.sp_top50 {	margin-top: 50px;}
.sp_top60 {	margin-top: 60px;}
.sp_top80 {	margin-top: 80px;}
.sp_top100 { margin-top: 100px;}
*/

@media screen and (min-width: 641px){
#primo_category .try-noto {
  font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;
}	
	
#primo_category .pc-banner {
	display: block;
	text-align:center;
	width: 100%;
	
}
#primo_category .sp-banner { 	display: none;	 	}

	
#primo_category .comment01 {
	margin:30px 0 10px;
	text-align:center;
	line-height:2.0;
	font-size: 20px;
	font-weight: bold;
}
	
#primo_category .comment02 {
	margin:30px 0 10px;
	text-align:center;
	line-height:2.0;
	font-size: 16px;
	font-weight: normal;
}
	
#primo_category .comment03 {
	margin:30px 0 10px;
	text-align:center;
	line-height:1.5;
	font-size: 20px; color: #880002;
	font-weight: bold;
}
	
#primo_category .flex_box { display: flex; margin-top:50px; justify-content:center; flex-wrap: wrap; }
#primo_category .flex_item img { width: 100%;}
	

#primo_category .primo-sub {  margin: 120px 0 20px; }
	
#primo_category .primo-sub-img {
  width: 100%;
  text-align: center;
  margin: 40px auto; 
}	
	
#primo_category .primo-sub-img img {
    width: 750px;
    max-width: 750px;
    margin-left: auto;
    margin-right: auto;
    display: block;
  }
	
#primo_category .video-section { padding: 0px 0 50px; } 
#primo_category .video-wrap {    width: 60%;	max-width: 780px;	    }

/* iframeを比率ボックスにフィットさせる */
#primo_category .video-wrap iframe {
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
}	
	

#primo_category .pd_box1 {
	font-size:12px;
	color:#262626;
	line-height: 1.8;
	text-align: left;
	margin: 3px 0;
}
	
	
#primo_category .br_block { display: none;}
	
	
}






/* ================================
   CTAボタン（LPトーンに合わせられる設計）
   ================================ */
:root{
  --lp-accent: #03014c;
  --lp-accent-hover: #19166a;
  --lp-accent-active:#0e0b59;
  --lp-cta-text: #ffffff;
  --lp-focus: #86b7ff;
}

.video-cta__btn { margin: 20px 0 30px; /*margin: 100px 0 50px*/}
@media (min-width: 768px){ .video-cta__btn { margin: 50px 0 50px; /*margin: 100px 0 50px*/} }

.video-center { display: grid; justify-items: center; gap: 16px; }
.video-wrap { width: 100%; aspect-ratio: 16/9; box-sizing: border-box; }
@media (min-width: 768px){ .video-wrap { width: 70%; } }
.video-wrap iframe { width: 100%; height: 100%; display: block; border: 0; }

.video-cta__btn{
  width: 80%;
  box-sizing: border-box;
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; padding: 12px 16px;
  background-color: var(--lp-accent);
  color: var(--lp-cta-text);
  text-decoration: none; font-weight: 600; letter-spacing: .02em; line-height: 1.4;
  border-radius: 0px; text-align: center;
  -webkit-tap-highlight-color: transparent;

	font-size: 16px;
	/*margin: 50px 0; 	*/
}
@media (min-width: 768px){ .video-cta__btn{ width: 30%; /*margin: 100px 0 50px*/ } }

.video-cta__btn:hover  { background: var(--lp-accent-hover); }
.video-cta__btn:active { background: var(--lp-accent-active); }
.video-cta__btn:focus-visible{ outline: 3px solid var(--lp-focus); outline-offset: 2px; }

/* ← 当たり確認のため一時的に併用（直ることが確認できたら !important は外す） */
.video-cta__btn,
.video-cta__btn:link,
.video-cta__btn:visited,
.video-cta__btn:hover,
.video-cta__btn:active,
.video-cta__btn:focus {
  color:#fff !important;
}
.video-cta__btn * { color: inherit !important; }


.image-cta{
  display: grid;
  justify-items: center;  /* 中央寄せ */
  margin: 20px 0;
}


/* ================================
  スクロールで追従するミニCTA
   ================================ */
/* ---- 色（#03014cトーン） ---- */
:root{
  --lp-accent: #03014c;   /* ベース */
  --lp-accent-hover: #02013f; /* hover */
  --lp-accent-active:#010133; /* active */
  --lp-cta-text:#fff;          /* 文字色 */
  --lp-focus:#86b7ff;          /* フォーカス枠 */
}

/* ---- ミニCTA本体（初期は非表示。JSで .is-visible 付与） ---- */
.mini-cta{
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 1000;
  display: grid;
  place-items: center;

  /* iOSのホームバーに配慮 */
  padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
  background: transparent;

  transform: translateY(110%);
  transition: transform .25s ease;
}

/* ボタン */
.mini-cta__btn{
  /* SP：横幅は端から端に近いが、左右に安全余白を残す */
  width: min(95vw, 560px);
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 48px;
  padding: 12px 16px;
  border-radius: 999px;         /* pill形。帯にしたければ 0 に */
  background: var(--lp-accent);
  color: var(--lp-cta-text);
  text-decoration: none;
  font-weight: 700;
  letter-spacing: .02em;
  line-height: 1.2;
  box-shadow: 0 6px 16px rgba(0,0,0,.18);
  -webkit-tap-highlight-color: transparent;
}

/* PCではやや控えめの幅に（中央表示） */
@media (min-width: 992px){
  .mini-cta__btn{ width: min(32vw, 520px); }
}

/* 状態 */
.mini-cta__btn:hover  { background: var(--lp-accent-hover); }
.mini-cta__btn:active { background: var(--lp-accent-active); }
.mini-cta__btn:focus-visible{
  outline: 3px solid var(--lp-focus);
  outline-offset: 2px;
}

/* 表示状態 */
.mini-cta.is-visible{ transform: translateY(0); }

/* （任意）サイト側のリンク色上書き対策：確実に白にする */
.mini-cta__btn,
.mini-cta__btn:link,
.mini-cta__btn:visited,
.mini-cta__btn:hover,
.mini-cta__btn:active,
.mini-cta__btn:focus { color: #fff !important; }
.mini-cta__btn * { color: inherit !important; }