@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* ============================================================
   エロエロ研究室_VR専門 (vr.eroero4610.com)
   SWELL 子テーマ style.css に貼り付けてください

   他サイトへ複製する際は、一番下の「サイト別カラー」だけ
   差し替えれば同じデザインが適用されます。
   ============================================================ */


/* ------------------------------------------------------------
   1. カラー変数（サイトごとに変えるのはここだけ）
   ------------------------------------------------------------ */
:root {
	--fas-main:   #0A0E27;  /* ヘッダー・帯の色 */
	--fas-accent: #00D4FF;  /* ボタン・リンク・強調 */
	--fas-bg:     #0d0d0d;  /* ページ背景 */
	--fas-text:   #eaeaea;  /* 本文 */
	--fas-muted:  #8b8b8b;  /* 補足文 */
	--fas-line:   rgba(255,255,255,.10);
	--fas-card:   rgba(255,255,255,.035);

	/* プラグイン側のCSSが参照する変数 */
	--fas-ac: var(--fas-accent);
}


/* ------------------------------------------------------------
   2. ベース
   ------------------------------------------------------------ */
body {
	background: var(--fas-bg);
	color: var(--fas-text);
	font-family: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, sans-serif;
	-webkit-font-smoothing: antialiased;
}

a { color: var(--fas-accent); transition: opacity .18s; }
a:hover { opacity: .78; text-decoration: none; }

.l-content, .l-mainContent { background: transparent; }
.post_content { color: var(--fas-text); }


/* ------------------------------------------------------------
   3. ヘッダーとロゴ（縦2段）
   ------------------------------------------------------------ */
.l-header,
.l-header__inner {
	background: var(--fas-main) !important;
	border-bottom: 2px solid var(--fas-accent);
}

/* サイト名 */
.c-catchphrase,
.l-header .c-headLogo__link,
.l-header .site-title,
.l-header .c-catchphrase {
	color: var(--fas-text) !important;
}

.c-headLogo,
.l-header .c-headLogo {
	font-size: 19px;
	font-weight: 900;
	letter-spacing: .04em;
	line-height: 1.15;
}

/* キャッチフレーズを2行目として表示 */
.c-catchphrase {
	display: block !important;
	font-size: 10.5px !important;
	font-weight: 600;
	letter-spacing: .18em;
	color: var(--fas-accent) !important;
	margin-top: 3px;
	opacity: 1 !important;
}

/* SWELLがキャッチフレーズを持たない構成の場合の代替表示 */
.c-headLogo__link::after {
	content: "VR専門";           /* ← サイトごとに変更 */
	display: block;
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: .18em;
	color: var(--fas-accent);
	margin-top: 3px;
}

/* ナビゲーション */
.c-gnav > li > a { color: var(--fas-text) !important; font-size: 13px; letter-spacing: .04em; }
.c-gnav > li > a:hover { color: var(--fas-accent) !important; }
.c-iconBtn, .c-iconBtn__icon { color: var(--fas-text) !important; }


/* ------------------------------------------------------------
   4. 一覧（アーカイブ・検索結果）を2列カードに
   ------------------------------------------------------------ */
.p-postList.-type-card > .p-postList__item,
.p-postList > .p-postList__item {
	background: var(--fas-card);
	border: 1px solid var(--fas-line);
	border-radius: 6px;
	overflow: hidden;
	transition: transform .15s, border-color .15s;
}
.p-postList > .p-postList__item:hover {
	transform: translateY(-3px);
	border-color: var(--fas-accent);
}

.p-postList__title {
	font-size: .8rem !important;
	line-height: 1.45;
	font-weight: 600;
	padding: .55em .7em;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.p-postList__excerpt {
	font-size: .72rem !important;
	color: var(--fas-muted);
	padding: 0 .7em .7em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* サムネイルの比率を統一 */
.p-postList__thumb {
	position: relative;
	padding-top: 66%;
	overflow: hidden;
	background: #1a1a1a;
}
.p-postList__thumb img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* 日付は控えめに */
.p-postList__times { font-size: .68rem; color: var(--fas-muted); padding: 0 .7em .6em; }


/* ------------------------------------------------------------
   5. 見出し・本文
   ------------------------------------------------------------ */
.post_content h2 {
	background: transparent;
	border-left: 4px solid var(--fas-accent);
	padding: .1em 0 .1em .6em;
	font-size: 1.15rem;
	color: var(--fas-text);
}
.post_content h3 { border-bottom: 1px solid var(--fas-line); }

.c-postTitle__ttl,
.p-articleThumb__ttl { color: var(--fas-text); }


/* ------------------------------------------------------------
   6. パンくず・ページャー
   ------------------------------------------------------------ */
.p-breadcrumb, .p-breadcrumb a { color: var(--fas-muted) !important; font-size: .72rem; }

.c-pagination__item {
	background: var(--fas-card) !important;
	color: var(--fas-text) !important;
	border: 1px solid var(--fas-line);
}
.c-pagination__item.is-active,
.c-pagination__item:hover {
	background: var(--fas-accent) !important;
	color: #0b0b0b !important;
}


/* ------------------------------------------------------------
   7. サイドバー・フッター
   ------------------------------------------------------------ */
.l-sidebar .c-widget__title {
	color: var(--fas-text);
	border-left: 3px solid var(--fas-accent);
	padding-left: .5em;
}
.l-sidebar { color: var(--fas-text); }

.l-footer { background: #070707; color: var(--fas-muted); }
.l-footer a { color: var(--fas-muted); }
.l-footer a:hover { color: var(--fas-accent); }


/* ------------------------------------------------------------
   8. 不要な装飾を隠す
   ------------------------------------------------------------ */
.p-articleFoot__sns,      /* シェアボタン */
.p-authorBox,             /* 著者情報 */
.p-toc { display: none; } /* 目次（自動生成記事には不要） */


/* ------------------------------------------------------------
   9. スマホ調整
   ------------------------------------------------------------ */
@media (max-width: 640px) {
	.c-headLogo { font-size: 16px; }
	.c-headLogo__link::after { font-size: 9.5px; }
	.post_content h2 { font-size: 1.05rem; }
	.p-postList__title { font-size: .75rem !important; }
}