/* ========================================================= TEAM凛龍 ダウンロード販売サイト team-rinryu.com(WordPressテーマ rinryu)と同じデザインを白ベースにした上書きCSS. EC-CUBE標準の style.css の後に読み込まれる. ========================================================= */ @import url("https://fonts.googleapis.com/css2?family=Shippori+Mincho+B1:wght@500;700;800&family=Noto+Sans+JP:wght@400;500;700&family=Cormorant+Garamond:wght@500;600&display=swap"); :root{ /* 白ベース：ink=背景、paper=文字(名前は黒ベース時代のまま) */ --ink:#ffffff; /* 背景(白) */ --ink-2:#f7f4ef; /* 帯・箱の背景(生成り) */ --ink-3:#eee8df; --shu:#c8321e; /* 朱 */ --shu-deep:#9e2414; --gold:#8f7238; /* 金(白地で読める濃さ) */ --gold-soft:rgba(143,114,56,.35); --paper:#1c1716; /* 文字(墨) */ --mute:#6b625a; --line:rgba(143,114,56,.28); --serif:"Shippori Mincho B1","Hiragino Mincho ProN",serif; --sans:"Noto Sans JP","Hiragino Sans",sans-serif; --latin:"Cormorant Garamond",serif; --num:"Noto Sans JP","Hiragino Sans",sans-serif; /* 金額(細いセリフ体だと読みにくいのでゴシック) */ --w:1180px; --hd:76px; } /* ===== 基本 ===== */ html,body{background:var(--ink)} body{overflow-x:hidden} body{color:var(--paper);font-family:var(--sans);font-size:15px;line-height:1.85;letter-spacing:.04em;-webkit-font-smoothing:antialiased} a{color:var(--paper)} a:hover{color:var(--gold);text-decoration:none} .ec-layoutRole{background:var(--ink);color:var(--paper)} .ec-layoutRole__header{position:sticky;top:0;z-index:50} .ec-layoutRole .ec-layoutRole__contents{max-width:var(--w);padding:0 24px} .ec-layoutRole__main{padding-bottom:80px} .rr-wrap{max-width:var(--w);margin:0 auto;padding:0 24px} h1,h2,h3,h4{color:var(--paper)} hr{border-color:var(--line)} ::selection{background:var(--shu);color:#fff} /* EC-CUBE標準ヘッダー部品(使わない) */ .ec-headerNaviRole,.ec-headerRole,.ec-headerNavSP,.ec-categoryNaviRole,.ec-drawerRole,.ec-drawerRoleClose{display:none !important} /* ===== 年齢確認 ===== */ .rr-gate{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;background:rgba(250,248,244,.96);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:24px} .rr-gate[hidden]{display:none} .rr-gate__box{max-width:520px;width:100%;text-align:center;border:1px solid var(--line);padding:56px 32px 44px;position:relative;background:var(--ink);box-shadow:0 20px 60px rgba(60,40,20,.12)} .rr-gate__box::before,.rr-gate__box::after{content:"";position:absolute;width:28px;height:28px;border:1px solid var(--gold)} .rr-gate__box::before{top:-1px;left:-1px;border-right:0;border-bottom:0} .rr-gate__box::after{bottom:-1px;right:-1px;border-left:0;border-top:0} .rr-gate__logo{font-family:var(--serif);font-weight:800;font-size:40px;letter-spacing:.2em} .rr-gate__logo span{color:var(--shu)} .rr-gate__lead{font-family:var(--latin);color:var(--gold);letter-spacing:.4em;font-size:13px;margin:6px 0 28px} .rr-gate p{font-size:14px;color:var(--mute);margin-bottom:28px} .rr-gate__btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap} /* ===== ボタン ===== */ .rr-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:180px;padding:14px 28px;font-family:var(--serif);font-weight:700;font-size:15px;letter-spacing:.15em;border:1px solid var(--gold);background:transparent;color:var(--paper);cursor:pointer;transition:.25s} .rr-btn--shu{background:var(--shu);border-color:var(--shu);color:#fff} .rr-btn--shu:hover{background:var(--shu-deep);border-color:var(--shu-deep);color:#fff} .rr-btn--ghost:hover{background:var(--gold);color:var(--ink)} /* EC-CUBEのボタン */ .ec-blockBtn,.ec-blockBtn--action,.ec-blockBtn--cancel,.ec-blockBtn--top,.ec-inlineBtn,.ec-inlineBtn--action,.ec-inlineBtn--cancel,.ec-inlineBtn--top{font-family:var(--serif);font-weight:700;letter-spacing:.12em;border-radius:0;transition:.25s} .ec-blockBtn--action,.ec-inlineBtn--action,.ec-blockBtn--action:visited{background:var(--shu);border:1px solid var(--shu);color:#fff} .ec-blockBtn--action:hover,.ec-blockBtn--action:focus,.ec-blockBtn--action:active,.ec-inlineBtn--action:hover{background:var(--shu-deep);border-color:var(--shu-deep);color:#fff} .ec-blockBtn--action:disabled,.ec-blockBtn--action.disabled{background:var(--ink-3);border-color:var(--line);color:var(--mute)} .ec-blockBtn,.ec-blockBtn--cancel,.ec-blockBtn--top,.ec-inlineBtn,.ec-inlineBtn--cancel,.ec-inlineBtn--top,.ec-blockBtn--cancel:visited{background:transparent;border:1px solid var(--gold);color:var(--paper)} .ec-blockBtn:hover,.ec-blockBtn--cancel:hover,.ec-blockBtn--cancel:focus,.ec-blockBtn--top:hover,.ec-inlineBtn:hover,.ec-inlineBtn--cancel:hover,.ec-inlineBtn--top:hover{background:var(--gold);border-color:var(--gold);color:var(--ink)} .ec-blockBtn--action .ec-blockBtn--cancel{color:var(--paper)} /* ページトップへ(画面右下に固定表示) */ .ec-blockTopBtn{width:auto;min-width:96px;padding:0 14px;background:var(--ink-2);border:1px solid var(--line);border-right:0;color:var(--paper);font-family:var(--serif);font-size:11px;letter-spacing:.1em;opacity:.9} .ec-blockTopBtn:hover{background:var(--shu);border-color:var(--shu);opacity:1} .ec-blockTopBtn.rr-has-en{min-height:0;padding-top:7px !important;padding-bottom:6px !important} .ec-blockTopBtn .rr-en{font-size:9px;letter-spacing:.2em;margin-top:1px} /* 日本語の下の英語表記(Block/header.twig のスクリプトが付ける) */ .rr-en{display:block;font-family:var(--latin);font-size:10px;font-weight:600;letter-spacing:.28em;line-height:1.2;margin-top:3px;opacity:.85;text-transform:uppercase;white-space:nowrap} .rr-has-en{height:auto !important;min-height:56px;line-height:1.4 !important;padding-top:10px !important;padding-bottom:9px !important} .rr-btn.rr-has-en,.rr-ft__official.rr-has-en{flex-direction:column;gap:0;min-height:0;text-align:center} .rr-ft__official.rr-has-en{padding-top:7px !important;padding-bottom:6px !important} .ec-inlineBtn.rr-has-en,.ec-inlineBtn--action.rr-has-en,.ec-inlineBtn--cancel.rr-has-en,.ec-inlineBtn--top.rr-has-en{min-height:0;padding-top:6px !important;padding-bottom:5px !important;text-align:center} .ec-inlineBtn .rr-en,.ec-inlineBtn--action .rr-en,.ec-inlineBtn--cancel .rr-en,.ec-inlineBtn--top .rr-en,.rr-ft__official .rr-en{font-size:9px;letter-spacing:.2em;margin-top:1px} /* ===== ヘッダー ===== */ .rr-hd{background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)} .rr-hd__in{display:flex;align-items:center;gap:32px;height:var(--hd)} .rr-brand{margin-right:auto;display:flex;flex-direction:column;gap:7px;min-width:0} .rr-logo{display:flex;align-items:baseline;gap:12px;color:var(--paper)} .rr-license{margin:0;font-size:10px;line-height:1;letter-spacing:.12em;color:var(--mute);white-space:nowrap} .rr-logo:hover{color:var(--paper)} .rr-logo__ja{font-family:var(--serif);font-weight:800;font-size:26px;letter-spacing:.18em;line-height:1} .rr-logo__ja span{color:var(--shu)} .rr-logo__en{font-family:var(--latin);font-size:11px;letter-spacing:.35em;color:var(--gold);white-space:nowrap} .rr-nav{display:flex;gap:28px;font-family:var(--serif);font-size:14px;letter-spacing:.12em} .rr-nav a,.rr-cart__label{position:relative;padding:4px 0;color:var(--paper);text-align:center;line-height:1.5} .rr-nav a::after{content:"";position:absolute;left:50%;right:50%;bottom:-2px;height:1px;background:var(--shu);transition:.25s} .rr-nav a:hover{color:var(--paper)} .rr-nav a:hover::after{left:0;right:0} .rr-nav small,.rr-cart small{display:block;font-family:var(--latin);font-size:10px;color:var(--gold);letter-spacing:.25em;text-align:center;line-height:1} .rr-cart{display:flex;align-items:center;gap:10px;padding:8px 14px;border:1px solid var(--line);font-family:var(--serif);font-size:14px;letter-spacing:.12em;color:var(--paper);transition:.25s} .rr-cart:hover{border-color:var(--shu);color:var(--paper)} .rr-cart__badge{min-width:22px;height:22px;display:grid;place-items:center;padding:0 6px;background:var(--shu);color:#fff;font-family:"Hiragino Sans","Noto Sans JP",sans-serif;font-size:12px;font-weight:700;letter-spacing:0;line-height:1;font-variant-numeric:tabular-nums;border-radius:11px} .rr-burger{display:none;width:44px;height:44px;border:1px solid var(--line);background:none;position:relative;cursor:pointer;flex-shrink:0} .rr-burger i{position:absolute;left:11px;right:11px;height:1px;background:var(--paper);transition:.3s} .rr-burger i:nth-child(1){top:16px}.rr-burger i:nth-child(2){top:22px}.rr-burger i:nth-child(3){top:28px} .is-open .rr-burger i:nth-child(1){top:22px;transform:rotate(45deg)} .is-open .rr-burger i:nth-child(2){opacity:0} .is-open .rr-burger i:nth-child(3){top:22px;transform:rotate(-45deg)} /* カテゴリ帯・検索 */ .rr-subnav{background:var(--ink-2);border-bottom:1px solid var(--line)} .rr-subnav__in{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:52px} .rr-cats{display:flex;flex-wrap:wrap;gap:4px 26px;list-style:none;margin:0;padding:0;font-family:var(--serif);font-size:14px;letter-spacing:.1em} .rr-cats>li{position:relative} .rr-cats a{display:block;padding:12px 0;color:var(--paper)} .rr-cats a:hover{color:var(--gold)} .rr-cats .has-child>a::after{content:"";display:inline-block;width:5px;height:5px;margin-left:8px;border-right:1px solid var(--gold);border-bottom:1px solid var(--gold);transform:translateY(-3px) rotate(45deg)} .rr-cats ul{display:none;position:absolute;top:100%;left:-16px;z-index:60;min-width:200px;list-style:none;margin:0;padding:8px 0;background:var(--ink);border:1px solid var(--line)} .rr-cats li:hover>ul,.rr-cats li:focus-within>ul{display:block} .rr-cats ul a{padding:8px 16px;white-space:nowrap} .rr-cats ul a:hover{background:rgba(200,50,30,.12)} .rr-search{display:flex;align-items:stretch;border:1px solid var(--line);min-width:280px} .rr-search input{flex:1;min-width:0;background:transparent;border:0;color:var(--paper);padding:8px 12px;font-size:13px;outline:none} .rr-search input::placeholder{color:var(--mute)} .rr-search button{background:transparent;border:0;border-left:1px solid var(--line);color:var(--gold);padding:0 14px;cursor:pointer} .rr-search button:hover{background:var(--shu);color:#fff} /* ===== トップ：ヒーロー ===== */ .ec-layoutRole__contentTop{padding:0} /* レイアウトの幅に関係なく画面いっぱいに広げる */ .rr-hero,.rr-sec--scale{width:100vw;margin-left:calc(50% - 50vw)} .rr-hero{position:relative;display:grid;place-items:center;min-height:560px;height:72vh;max-height:760px;overflow:hidden;text-align:center; background:radial-gradient(ellipse 60% 70% at 40% 30%,rgba(200,50,30,.12),transparent 70%),radial-gradient(ellipse 50% 60% at 90% 90%,rgba(143,114,56,.14),transparent 70%),linear-gradient(160deg,#fbf3ec 0%,#f8efe6 40%,var(--ink) 100%)} .rr-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;background:linear-gradient(0deg,var(--ink),transparent);pointer-events:none} .rr-hero__in{position:relative;z-index:1;padding:40px 24px} .rr-hero__lead{display:flex;align-items:center;justify-content:center;gap:18px;font-family:var(--latin);font-size:13px;letter-spacing:.45em;color:var(--gold)} .rr-hero__lead::before,.rr-hero__lead::after{content:"";width:56px;height:1px;background:var(--gold)} .rr-hero__team{font-family:var(--serif);font-size:clamp(22px,3vw,34px);letter-spacing:.6em;margin:22px 0 0 .6em;color:var(--paper)} .rr-hero__ttl{font-family:var(--serif);font-weight:800;font-size:clamp(96px,16vw,190px);line-height:1.1;letter-spacing:.06em;color:var(--paper);margin:0} .rr-hero__sub{font-family:var(--serif);font-size:15px;letter-spacing:.5em;color:var(--gold);margin-top:10px} .rr-hero__btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:40px} /* ===== セクション ===== */ .rr-sec{padding:100px 0} .rr-sec--scale{background-color:var(--ink-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)} .rr-sec-hd{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:48px} .rr-sec-ttl{font-family:var(--serif);font-weight:700;font-size:clamp(26px,3.2vw,38px);letter-spacing:.14em;line-height:1.3;margin:0} .rr-sec-ttl small{display:flex;align-items:center;gap:12px;font-family:var(--latin);font-size:13px;letter-spacing:.45em;color:var(--shu);margin-bottom:10px} .rr-sec-ttl small::before{content:"";width:8px;height:8px;background:var(--shu);transform:rotate(45deg)} .rr-more{font-family:var(--serif);font-size:14px;letter-spacing:.15em;color:var(--gold);display:inline-flex;align-items:center;gap:10px;white-space:nowrap} .rr-more::after{content:"";width:34px;height:1px;background:currentColor;transition:.25s} .rr-more:hover{color:var(--gold)} .rr-more:hover::after{width:52px} /* メイン領域内のセクションは、領域自体の余白に揃える(二重余白を防ぐ) */ .ec-layoutRole__contents .rr-sec:not(.rr-sec--scale)>.rr-wrap{padding:0} /* 作品カード */ .rr-works{display:grid;grid-template-columns:repeat(4,1fr);gap:28px} .rr-work{display:block;color:var(--paper)} .rr-work:hover{color:var(--paper)} .rr-work__pkg{position:relative;aspect-ratio:3/2;background:#000;border:1px solid var(--line);overflow:hidden} /* 写真は切り取らず枠に収め、余白は黒 */ .rr-work__pkg img{width:100%;height:100%;object-fit:contain;transition:transform .6s} .rr-work:hover .rr-work__pkg img{transform:scale(1.05)} .rr-badge{position:absolute;top:12px;left:12px;z-index:2;background:var(--shu);color:#fff;font-family:var(--serif);font-size:12px;font-weight:700;letter-spacing:.15em;padding:3px 10px} .rr-work__code{margin-top:16px;font-size:12px;color:var(--gold);letter-spacing:.15em} /* 品番の右に発売日 */ .rr-work__code{display:flex;justify-content:space-between;gap:8px} .rr-work__release{color:var(--mute);letter-spacing:.06em;white-space:nowrap} .rr-work__ttl{font-family:var(--serif);font-weight:700;font-size:16px;line-height:1.6;margin:4px 0 8px} .rr-work__foot{display:flex;justify-content:space-between;align-items:center;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)} .rr-work__price{font-family:var(--num);font-weight:500;font-size:19px;letter-spacing:.02em;font-variant-numeric:tabular-nums} .rr-work__price small{font-family:var(--sans);font-size:11px;color:var(--mute);margin-left:4px} /* カテゴリ一覧 */ .rr-catlist{display:grid;grid-template-columns:repeat(3,1fr);gap:20px} .rr-catlist a{display:flex;flex-direction:column;gap:6px;padding:30px 56px 30px 28px;border:1px solid var(--line);background:var(--ink);position:relative;color:var(--paper);transition:.25s} .rr-catlist a::after{content:"→";position:absolute;right:26px;top:50%;transform:translateY(-50%);font-family:var(--latin);font-size:24px;color:var(--gold);transition:.25s} .rr-catlist a:hover{border-color:var(--shu);background:var(--ink-3);color:var(--paper)} .rr-catlist a:hover::after{right:18px;color:var(--shu)} .rr-catlist small{font-family:var(--latin);font-size:12px;letter-spacing:.35em;color:var(--gold)} .rr-catlist b{font-family:var(--serif);font-size:20px;letter-spacing:.12em} .rr-catlist span{font-size:13px;color:var(--mute)} /* 新着情報(EC-CUBE標準ブロック) */ .ec-newsRole{padding:80px 0 0} .ec-secHeading{display:flex;align-items:center;gap:14px;margin-bottom:32px;color:var(--paper)} .ec-secHeading .ec-secHeading__en{font-family:var(--latin);font-size:28px;letter-spacing:.3em;color:var(--paper)} .ec-secHeading .ec-secHeading__line{background:var(--shu);width:1px;height:16px} .ec-secHeading .ec-secHeading__ja{font-family:var(--serif);color:var(--gold);letter-spacing:.2em} .ec-newsRole .ec-newsRole__news{border:0;border-top:1px solid var(--line);padding:0} .ec-newsRole .ec-newsRole__newsItem{border-bottom:1px solid var(--line);padding:18px 8px} .ec-newsRole .ec-newsRole__newsDate{font-family:var(--latin);font-size:16px;color:var(--gold)} .ec-newsRole .ec-newsRole__newsColumn,.ec-newsRole .ec-newsRole__newsTitle{color:var(--paper)} .ec-newsRole .ec-newsRole__newsCloseBtn{background:var(--ink-3);color:var(--gold)} .ec-newsRole .ec-newsRole__newsDescription{color:var(--mute)} .ec-newsRole .ec-newsRole__newsDescription a{color:var(--gold)} /* ===== フッター ===== */ .ec-layoutRole__footer{background:var(--ink)} .rr-ft{border-top:1px solid var(--line);padding:72px 0 32px;margin-top:40px;color:var(--paper)} .rr-ft__in{display:grid;grid-template-columns:1.2fr 2fr;gap:60px} .rr-ft__desc{color:var(--mute);font-size:13px;margin-top:18px} .rr-ft__official{display:inline-block;margin-top:20px;padding:8px 18px;border:1px solid var(--line);font-family:var(--serif);font-size:13px;letter-spacing:.15em} .rr-ft__official:hover{border-color:var(--shu);color:var(--paper)} .rr-ft__nav{display:grid;grid-template-columns:repeat(3,1fr);gap:10px 24px;font-family:var(--serif);font-size:14px;letter-spacing:.1em} .rr-ft__nav a:hover{color:var(--shu)} .rr-ft__copy{margin-top:56px;padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-family:var(--latin);font-size:12px;letter-spacing:.2em;color:var(--mute);flex-wrap:wrap;gap:8px} /* ========================================================= EC-CUBE 各画面の配色 ========================================================= */ /* 見出し・パンくず */ .ec-pageHeader h1,.ec-pageHeader .ec-pageHeader__title{font-family:var(--serif);font-weight:700;letter-spacing:.14em;color:var(--paper);border-top:0;border-bottom:1px solid var(--line);padding:56px 0 20px;margin-bottom:40px} .ec-heading,.ec-heading-bold,.ec-headingTitle{font-family:var(--serif);color:var(--paper)} .ec-rectHeading h1,.ec-rectHeading h2,.ec-rectHeading h3,.ec-rectHeading h4{background:transparent;color:var(--paper);font-family:var(--serif);letter-spacing:.12em;border-left:3px solid var(--shu);padding:6px 14px} .ec-reportHeading{border-color:var(--line)} .ec-reportHeading h2{font-family:var(--serif);color:var(--paper)} .ec-topicpath{border-color:var(--line);color:var(--mute)} .ec-topicpath .ec-topicpath__item a,.ec-topicpath .ec-topicpath__item--active{color:var(--gold)} .ec-font-bold,.ec-color-red{color:var(--paper)} .ec-color-accent,.ec-text-ac{color:var(--shu)} .ec-color-grey{color:var(--mute)} /* 線・枠・背景 */ .ec-borderedDefs dl,.ec-borderedList,.ec-borderedList li,.ec-borderedDefs{border-color:var(--line) !important} .ec-borderedDefs dt .ec-label,.ec-label{color:var(--paper);font-family:var(--serif)} .ec-required{background:var(--shu);color:#fff;border-radius:0;font-family:var(--sans)} .ec-off1Grid,.ec-off2Grid,.ec-off3Grid,.ec-off4Grid{color:var(--paper)} .ec-login,.ec-guest,.ec-totalBox,.ec-orderRole .ec-orderAccount,.ec-cartHeader,.ec-cartHeader__label,.ec-mypageRole .ec-welcomeMsg,.ec-modal .ec-modal-box,.ec-cartNaviIsset,.ec-cartNaviNull,.ec-favoriteRole__item,.ec-historyRole .ec-historyRole__contents{background:var(--ink-2) !important;color:var(--paper);border-color:var(--line)} .ec-login,.ec-guest{border:1px solid var(--line)} .ec-login .ec-login__link a,.ec-login__link .ec-link{color:var(--gold)} .ec-login .ec-login__actions .ec-blockBtn--cancel{background:var(--shu);border-color:var(--shu);color:#fff} .ec-login .ec-login__actions .ec-blockBtn--cancel:hover{background:var(--shu-deep);border-color:var(--shu-deep)} .ec-login .ec-login__icon .ec-icon img{filter:grayscale(1);opacity:.45} /* 本文中のリンク */ .ec-layoutRole__main p a:not([class*="Btn"]),.ec-layoutRole__main label a,.ec-layoutRole__main .ec-link,.ec-layoutRole__main dd a:not([class*="Btn"]){color:var(--gold);text-decoration:underline;text-underline-offset:3px} .ec-layoutRole__main p a:not([class*="Btn"]):hover,.ec-layoutRole__main label a:hover,.ec-layoutRole__main .ec-link:hover{color:var(--shu)} .ec-guest .ec-guest__inner p{color:var(--mute)} /* 入力欄 */ .ec-input input,.ec-halfInput input,.ec-numberInput input,.ec-zipInput input,.ec-telInput input,.ec-select select,.ec-birth select,.ec-input textarea,textarea,input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="tel"],input[type="search"],select{background-color:var(--ink);color:var(--paper);border:1px solid var(--line);border-radius:0} .ec-input input:focus,.ec-halfInput input:focus,.ec-select select:focus,textarea:focus,input:focus,select:focus{border-color:var(--gold);box-shadow:0 0 0 2px rgba(143,114,56,.25);outline:none} input:focus,select:focus,textarea:focus{background-color:var(--ink) !important;color:var(--paper)} input:-webkit-autofill,input:-webkit-autofill:focus{-webkit-text-fill-color:var(--paper);-webkit-box-shadow:0 0 0 1000px var(--ink) inset;caret-color:var(--paper)} input::placeholder,textarea::placeholder{color:var(--mute)} input[type="checkbox"],input[type="radio"]{accent-color:var(--shu)} .ec-select select option{background:var(--ink-2);color:var(--paper)} .ec-errorMessage,.ec-input.error input,.ec-halfInput.error input{color:var(--shu)} .ec-input.error input,.ec-halfInput.error input,.ec-select.error select{border-color:var(--shu);background:rgba(200,50,30,.06)} .ec-checkbox label,.ec-radio label{color:var(--paper)} .ec-alert-warning{background:rgba(200,50,30,.08);border:1px solid var(--shu);color:var(--paper)} .ec-alert-warning .ec-alert-warning__icon,.ec-alert-warning__text{color:var(--paper)} /* 商品一覧 */ .ec-searchnavRole .ec-searchnavRole__topicpath,.ec-searchnavRole .ec-searchnavRole__infos{border-color:var(--line)} .ec-searchnavRole .ec-searchnavRole__counter,.ec-searchnavRole .ec-searchnavRole__counter span{color:var(--paper)} .ec-searchnavRole .ec-searchnavRole__actions select{background:var(--ink-3);color:var(--paper)} .ec-shelfGrid .ec-shelfGrid__item{color:var(--paper)} .ec-shelfGrid .ec-shelfGrid__item a{color:var(--paper)} .ec-shelfGrid .ec-shelfGrid__item-image{border:1px solid var(--line);background:#000;aspect-ratio:3/2;overflow:hidden;margin-bottom:12px} .ec-shelfGrid .ec-shelfGrid__item-image img{width:100%;height:100%;object-fit:contain;transition:transform .6s} .ec-shelfGrid .ec-shelfGrid__item a:hover img{transform:scale(1.05)} .ec-shelfGrid .ec-shelfGrid__item a>p:nth-of-type(2){font-family:var(--serif);font-weight:700;font-size:16px;line-height:1.6} .ec-shelfGrid .ec-shelfGrid__item a>p:nth-of-type(3):not(.price02-default){font-size:12px;color:var(--gold);letter-spacing:.08em;line-height:1.7;margin-top:4px} /* 発売日(Product/list.twig) */ .ec-shelfGrid .ec-shelfGrid__item a>p.rr-list-release:not(.price02-default){font-size:12px;color:var(--mute);letter-spacing:.06em;line-height:1.7;margin-top:4px} .ec-shelfGrid .price02-default{margin-top:10px;padding-top:10px;border-top:1px solid var(--line)} .ec-shelfGrid .price02-default{font-family:var(--num);font-weight:500;font-size:19px;letter-spacing:.02em;font-variant-numeric:tabular-nums;color:var(--paper)} .ec-shelfGrid .ec-productRole__btn button,.ec-shelfGrid .add-cart{margin-top:10px} .ec-pager .ec-pager__item a,.ec-pager .ec-pager__item--active a{border:1px solid var(--line);color:var(--paper);background:transparent;font-family:var(--latin);font-size:16px} .ec-pager .ec-pager__item a:hover,.ec-pager .ec-pager__item--active a,.ec-pager .ec-pager__item--active{background:var(--shu);border-color:var(--shu);color:#fff} /* 商品詳細 */ .ec-productRole{padding-top:48px} .ec-productRole .ec-productRole__title .ec-headingTitle{font-family:var(--serif);font-weight:700;font-size:clamp(22px,2.6vw,30px);line-height:1.5;letter-spacing:.06em;color:var(--paper)} .ec-productRole .ec-productRole__tags,.ec-productRole .ec-productRole__tag{border-color:var(--gold);color:var(--gold)} .ec-productRole .ec-productRole__priceRegular,.ec-productRole .ec-productRole__priceRegularTax{color:var(--mute)} .ec-productRole .ec-productRole__price .ec-price .ec-price__price{font-family:var(--num);font-weight:500;letter-spacing:.02em;font-variant-numeric:tabular-nums;color:var(--paper);font-size:30px} .ec-productRole .ec-productRole__price .ec-price .ec-price__tax{color:var(--mute)} .ec-productRole .ec-productRole__price,.ec-productRole .ec-productRole__code,.ec-productRole .ec-productRole__category{border-color:var(--line);color:var(--paper)} .ec-productRole .ec-productRole__code .product-code-default{color:var(--gold)} .ec-productRole .ec-productRole__category a{color:var(--gold)} .ec-productRole .ec-productRole__description{color:var(--paper);line-height:2;border-top:1px solid var(--line);padding-top:24px} .ec-productRole .ec-productRole__profile .ec-productRole__actions .ec-numberInput span{color:var(--paper)} .ec-sliderItemRole .item_visual,.ec-sliderItemRole .slide-item img{border:1px solid var(--line)} .ec-sliderItemRole .item_nav .slideThumb{opacity:.6} .ec-sliderItemRole .item_nav .slideThumb:hover,.ec-sliderItemRole .item_nav .slideThumb.active{opacity:1} /* カート・購入手続き */ .ec-progress{color:var(--mute)} .ec-progress .ec-progress__number{background:var(--ink-3);color:var(--mute);border:1px solid var(--line)} .ec-progress .ec-progress__item::after{background:var(--line)} .ec-progress .is-complete .ec-progress__number{background:var(--shu);border-color:var(--shu);color:#fff} .ec-progress .is-complete .ec-progress__label{color:var(--paper)} .ec-cartRole .ec-cartRole__totalText,.ec-cartRole .ec-cartRole__totalAmount{color:var(--paper)} .ec-cartRole .ec-cartRole__totalAmount,.ec-totalBox .ec-totalBox__price,.ec-totalBox .ec-totalBox__paymentTotal .ec-totalBox__price{font-family:var(--num);font-weight:500;letter-spacing:.02em;font-variant-numeric:tabular-nums;color:var(--paper)} .ec-cartRole .ec-cartRole__cart .ec-cartTable,.ec-cartRow,.ec-cartRow__contentColumn,.ec-cartRow .ec-cartRow__delColumn,.ec-cartRow .ec-cartRow__amountColumn,.ec-cartRow .ec-cartRow__subtotalColumn{border-color:var(--line) !important;color:var(--paper)} .ec-cartRow .ec-cartRow__name{font-family:var(--serif);font-weight:700} .ec-cartRow .ec-cartRow__delColumn .ec-icon img{opacity:.7} .ec-totalBox{border:1px solid var(--line)} .ec-totalBox .ec-totalBox__spec,.ec-totalBox .ec-totalBox__total,.ec-totalBox .ec-totalBox__paymentTotal{border-color:var(--line);color:var(--paper)} .ec-totalBox .ec-totalBox__taxLabel,.ec-totalBox .ec-totalBox__taxRate{color:var(--mute)} .ec-totalBox .ec-totalBox__pointBlock{background:var(--ink-3);color:var(--paper)} .ec-orderRole .ec-orderAccount,.ec-orderRole .ec-orderDelivery,.ec-orderRole .ec-orderPayment,.ec-orderRole .ec-orderConfirm,.ec-orderRole .ec-orderPoint{color:var(--paper)} .ec-orderRole .ec-orderDelivery__title{background:var(--ink-3);color:var(--paper)} .ec-orderRole .ec-orderDelivery__item{border-color:var(--line)} .ec-orderRole .ec-orderPoint .ec-input{color:var(--paper)} .ec-imageGrid,.ec-imageGrid .ec-imageGrid__img{border-color:var(--line)} .ec-cartCompleteRole,.ec-reportDescription{color:var(--paper)} /* マイページ */ .ec-navlistRole .ec-navlistRole__navlist{border-color:var(--line)} .ec-navlistRole .ec-navlistRole__item{border-color:var(--line)} .ec-navlistRole .ec-navlistRole__item a{color:var(--paper);font-family:var(--serif);letter-spacing:.08em} .ec-navlistRole .ec-navlistRole__item a:hover,.ec-navlistRole .active a{background:var(--shu);color:#fff} .ec-welcomeMsg{border-color:var(--line) !important} .ec-historyRole,.ec-historyListHeader,.ec-historyListHeader .ec-definitions dt,.ec-historyListHeader .ec-definitions dd,.ec-orderMails .ec-orderMail{color:var(--paper);border-color:var(--line)} .ec-historyRole .ec-historyRole__detail .ec-imageGrid{border-color:var(--line)} .ec-historyRole .ec-historyRole__contents{border:1px solid var(--line)} .ec-orderRole__detail .ec-orderOrder,.ec-orderRole__detail .ec-definitions{color:var(--paper)} /* モーダル */ .ec-modal .ec-modal-overlay{background:rgba(28,23,22,.55)} .ec-modal .ec-modal-box{border:1px solid var(--line)} .ec-modal .ec-modal-close .ec-icon img{opacity:.7} .ec-modal .ec-modal-box .ec-role{color:var(--paper)} /* 404・エラー */ .ec-404Role{color:var(--paper)} .ec-404Role .ec-404Role__title{font-family:var(--serif)} /* ===== レスポンシブ ===== */ @media (max-width:1024px){ .rr-works{grid-template-columns:repeat(2,1fr)} .rr-catlist{grid-template-columns:repeat(2,1fr)} .rr-hd__in{gap:20px} .rr-nav{gap:20px} } @media (max-width:900px){ .rr-nav{position:fixed;inset:var(--hd) 0 auto 0;flex-direction:column;gap:0;background:rgba(255,255,255,.98);border-bottom:1px solid var(--line);padding:8px 24px 24px;transform:translateY(-130%);transition:.35s;z-index:-1} .is-open .rr-nav{transform:none} .rr-nav a{padding:16px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;text-align:left} .rr-nav a::after{display:none} .rr-nav small{display:inline} .rr-burger{display:block} .rr-cart{padding:6px 10px} .rr-cart__label small{display:none} .rr-subnav__in{flex-direction:column;align-items:stretch;gap:0;padding-bottom:12px} .rr-cats{overflow-x:auto;flex-wrap:nowrap;white-space:nowrap} .rr-cats ul{display:none !important} .rr-cats .has-child>a::after{display:none} .rr-search{min-width:0} .rr-ft__in{grid-template-columns:1fr;gap:40px} .rr-catlist{grid-template-columns:1fr} } @media (max-width:600px){ body{font-size:14px} :root{--hd:64px} .rr-wrap,.ec-layoutRole .ec-layoutRole__contents{padding:0 16px} .rr-logo__en{display:none} .rr-logo__ja{font-size:21px} .rr-license{font-size:9px;letter-spacing:.06em} .rr-cart__label{display:none} .rr-hero{min-height:480px;height:auto} .rr-hero__lead{font-size:11px;letter-spacing:.3em;gap:10px} .rr-hero__lead::before,.rr-hero__lead::after{width:24px} .rr-sec{padding:72px 0} .rr-sec-hd{flex-direction:column;align-items:flex-start;margin-bottom:32px} .rr-works{gap:24px 14px} .rr-work__ttl{font-size:14px} .rr-ft__nav{grid-template-columns:repeat(2,1fr)} .rr-btn{min-width:0;flex:1;padding:14px 12px;letter-spacing:.08em;white-space:nowrap} .ec-pageHeader h1{padding-top:36px;margin-bottom:28px} } /* ===== 注文詳細: DLプラグインの「ダウンロード」ボタンが上の価格行に重ならないように ===== */ .ec-imageGrid__content p:has(> .ec-inlineBtn){display:flex;margin:10px 0 4px} /* ===== スマホ: 開いたメニューの上にカテゴリ列・検索欄が重なって見えないように ===== */ @media (max-width:900px){ .rr-hd{position:relative;z-index:2} .rr-nav{background:var(--ink)} } /* ===== スマホ: ヒーローのボタン(作品一覧／ログイン／ご利用ガイド)を2段に ===== */ @media (max-width:600px){ .rr-hero__btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:340px;margin-left:auto;margin-right:auto} .rr-hero__btns .rr-btn{min-width:0;padding:12px 8px;font-size:14px;letter-spacing:.1em} .rr-hero__btns .rr-btn--shu, .rr-hero__btns .rr-btn:last-child:nth-child(2){grid-column:1/-1} } /* ===== 白ベース: 標準CSSが親に color:#fff を付けている所の「戻る」系ボタンの文字色 ===== */ /* (ご注文手続き・確認の「カートに戻る」「ご注文手続きに戻る」、ログイン画面のゲスト購入) */ .ec-totalBox .ec-totalBox__btn .ec-blockBtn--cancel,.ec-guest .ec-guest__actions .ec-blockBtn--cancel{color:var(--paper)} .ec-totalBox .ec-totalBox__btn .ec-blockBtn--cancel:hover,.ec-guest .ec-guest__actions .ec-blockBtn--cancel:hover{color:#fff} /* ===== スマホ: カテゴリのアコーディオン(Block/category_nav_pc.twig の .rr-spcats) ===== */ .rr-spcats{display:none} @media (max-width:900px){ .rr-cats{display:none} .rr-spcats{display:block;margin:0 -24px 12px;border-bottom:1px solid var(--line)} .rr-subnav:has(.rr-spcats){border-top:0} .rr-spcats summary{list-style:none;cursor:pointer;-webkit-tap-highlight-color:transparent} .rr-spcats summary::-webkit-details-marker{display:none} /* 見出しの帯は朱の塗りで目立たせる */ .rr-spcats__head{display:flex;align-items:center;gap:10px;padding:15px 24px;background:var(--shu);font-family:var(--serif);font-weight:700;font-size:16px;letter-spacing:.12em;color:#fff;transition:background .2s} .rr-spcats__head:active{background:var(--shu-deep)} .rr-spcats__head::before{content:"\f0ca";font-family:"Font Awesome 6 Free","Font Awesome 5 Free";font-weight:900;font-size:15px;letter-spacing:0} .rr-spcats__head small{font-family:var(--latin);font-weight:500;font-size:11px;letter-spacing:.25em;color:rgba(255,255,255,.8)} .rr-spcats__head::after{content:"";margin-left:auto;width:9px;height:9px;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:translateY(-3px) rotate(45deg);transition:transform .2s} .rr-spcats[open]>.rr-spcats__head::after{transform:translateY(2px) rotate(-135deg)} /* 開いた一覧は画面の高さの65%まで(ヘッダーが固定なので、長いときは中でスクロール) */ .rr-spcats__list{max-height:65vh;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;background:var(--ink);border-top:1px solid var(--line)} .rr-spcats__list,.rr-spcats__list ul{list-style:none;margin:0;padding:0} .rr-spcats__list ul{border-top:1px solid var(--line)} .rr-spcats__item+.rr-spcats__item{border-top:1px solid var(--line)} .rr-spcats__item>a,.rr-spcats__item>details>summary{display:flex;align-items:stretch;min-height:48px} .rr-spcats__item>a,.rr-spcats__item>details>summary>a{flex:1;display:flex;align-items:center;padding:12px 16px 12px 24px;font-family:var(--serif);font-size:14px;letter-spacing:.06em;line-height:1.5;color:var(--paper)} /* 階層ごとに字下げと背景 */ .rr-spcats__item--d1{background:var(--ink-2)} .rr-spcats__item--d2,.rr-spcats__item--d3{background:var(--ink-3)} .rr-spcats__item--d1>a,.rr-spcats__item--d1>details>summary>a{padding-left:40px;font-size:13px} .rr-spcats__item--d2>a,.rr-spcats__item--d2>details>summary>a{padding-left:56px;font-size:13px} .rr-spcats__item--d3>a,.rr-spcats__item--d3>details>summary>a{padding-left:72px;font-size:13px} .rr-spcats__item--d1>a::before,.rr-spcats__item--d1>details>summary>a::before, .rr-spcats__item--d2>a::before,.rr-spcats__item--d2>details>summary>a::before, .rr-spcats__item--d3>a::before,.rr-spcats__item--d3>details>summary>a::before{content:"";flex:none;width:6px;height:1px;margin-right:10px;background:var(--gold)} /* ＋／−(下の階層を開く) */ .rr-spcats__toggle{position:relative;flex:none;width:52px;border-left:1px solid var(--line)} .rr-spcats__toggle::before,.rr-spcats__toggle::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;background:var(--shu);transform:translate(-50%,-50%);transition:transform .2s} .rr-spcats__toggle::after{transform:translate(-50%,-50%) rotate(90deg)} .rr-spcats__item>details[open]>summary .rr-spcats__toggle::after{transform:translate(-50%,-50%) rotate(0)} .rr-spcats__item>details[open]>summary>a{color:var(--shu)} } @media (max-width:600px){ .rr-spcats{margin-left:-16px;margin-right:-16px} .rr-spcats__head{padding:14px 16px} .rr-spcats__item>a,.rr-spcats__item>details>summary>a{padding-left:16px} .rr-spcats__item--d1>a,.rr-spcats__item--d1>details>summary>a{padding-left:30px} .rr-spcats__item--d2>a,.rr-spcats__item--d2>details>summary>a{padding-left:44px} .rr-spcats__item--d3>a,.rr-spcats__item--d3>details>summary>a{padding-left:58px} } /* 作品一覧の「ただいま品切れ中です。」: 2列のスマホではボタン幅に収まらないので、「ただいま」の後ろで折り返す ( は list.twig) */ .ec-shelfGrid .ec-productRole__btn button[disabled]{white-space:normal;word-break:keep-all;overflow-wrap:anywhere;height:auto;min-height:56px;line-height:1.4;padding:10px 6px} /* PCのカテゴリ: 孫カテゴリより下は、親の項目の右へ広がるメニューで出す (twig は category_nav_pc.twig の pc_category) */ .rr-cats ul li{position:relative} .rr-cats ul ul{top:-9px;left:100%} .rr-cats ul .has-child>a{padding-right:34px} .rr-cats ul .has-child>a::after{position:absolute;right:16px;top:50%;margin:0;transform:translateY(-50%) rotate(-45deg)} .rr-cats ul{width:max-content;max-width:340px} .rr-cats ul a{white-space:normal;line-height:1.6} /* PCのカテゴリメニュー: マウスが斜めに動いて別の項目を少し通っても、開いているメニューがすぐ閉じない・切り替わらないようにする */ .rr-cats ul{display:block;visibility:hidden;opacity:0;transition:opacity .15s ease .25s,visibility 0s linear .4s} .rr-cats li:hover>ul,.rr-cats li:focus-within>ul{visibility:visible;opacity:1;transition:opacity .15s ease 0s,visibility 0s linear 0s} .rr-cats ul li:hover>ul{transition-delay:.15s,.15s} .rr-cats li:hover{z-index:2} /* ===================================================================== DVD通販ショップ (disk.team-rinryu.com) 用 ここまではダウンロード販売サイトと同じ。配色だけ、本文は生成り・ ヘッダー/カテゴリ帯/トップ見出し/フッター/年齢確認は臙脂に差し替える ===================================================================== */ :root{--ink:#f4ede0;--ink-2:#ebe1cf;--ink-3:#dfd2bb;--shu:#c8321e;--shu-deep:#9e2414;--gold:#86672c;--gold-soft:rgba(134,103,44,.35);--paper:#1c1716;--mute:#5f564c;--line:rgba(134,103,44,.32)} .rr-hd,.rr-subnav,.rr-hero,.rr-ft,.rr-gate{--ink:#5a1b18;--ink-2:#4a1513;--ink-3:#6b221e;--paper:#f6eddc;--mute:#d9bfae;--gold:#e0bf78;--gold-soft:rgba(224,191,120,.35);--line:rgba(224,191,120,.32);color:var(--paper)} .rr-hd{background:rgba(90,27,24,.97)} .rr-subnav{background:#4a1513} .rr-ft{background:#4a1513} .rr-hero{background:radial-gradient(ellipse 60% 70% at 40% 30%,rgba(210,58,36,.22),transparent 70%),radial-gradient(ellipse 50% 60% at 90% 90%,rgba(224,191,120,.16),transparent 70%),linear-gradient(160deg,#4a1513 0%,#5a1b18 100%)} .rr-gate{background:rgba(40,12,11,.94)} .rr-gate__box{box-shadow:0 20px 60px rgba(0,0,0,.35)} @media (max-width:900px){.rr-nav{background:#5a1b18}} /* トップ 新作DVD(バナーとサンプル動画。中身は Block/category.twig) */ .rr-dvdnews__list{max-width:980px;margin:0 auto} .rr-dvdnews__list br{display:none} .rr-dvdnews__list a.banner{display:block;margin-top:36px;border:1px solid var(--line);transition:opacity .2s} .rr-dvdnews__list a.banner:first-child{margin-top:0} .rr-dvdnews__list a.banner:hover{opacity:.85} .rr-dvdnews__list a.banner img{display:block;width:100%;height:auto} .rr-dvdnews__list p{margin:12px 0 0} .rr-dvdnews__list video{display:block;width:100%;height:auto;background:#000} /* トップページはカテゴリ帯がメイン欄の中にあるので、ヒーローと同じく画面いっぱいに広げる */ .ec-layoutRole__main>.rr-subnav{width:100vw;margin-left:calc(50% - 50vw)} /* 注意枠(カートが空のときなど): 標準CSSの白文字が残って読めないので墨色にする */ .ec-alert-warning .ec-alert-warning__icon,.ec-alert-warning .ec-alert-warning__text{color:var(--paper)} /* 作品詳細のサンプル動画(説明文の先頭に入れた