/*
Theme Name: yuripafe-retro
Description: 旧ブログ(rplsv02.com)の完全再現テーマ。マークアップを旧layout.phpと同一にし、旧style.css(1.0.0)をそのまま適用する。
Version: 1.0.0
Author: yuripafe
*/

/* 

	名　称：style.css
	機　能：CSS
	作成日：2026/07/26
	更新日：2026/09/06
	ＶＥＲ：2.0.0
	作成者：yuripafe
	変更歴：2.0.0 弱ベベル全面反映(仕様v3)・アーカイブ年月開閉・コメント欄・404追加

*/

/* リセット */
* {
	box-sizing : border-box;
	font-family: "游ゴシックミディアム", sans-serif;
}
html, body {
	margin : 0;
	padding: 0;
}

/* 全体・背景 */
body {
	font-family     : "游ゴシックミディアム", sans-serif;
	font-size       : 13px;
	line-height     : 1.6;
	color           : #663355;
	background      : #ffffff;
	background-image: repeating-linear-gradient(0deg, #ffd0e0 0 1px, transparent 1px 24px), repeating-linear-gradient(90deg, #ffd0e0 0 1px, transparent 1px 24px);
	padding         : 10px;
}

/* リンク */
a {
	color: #e05a8f;
}
a:visited {
	color: #9933cc;
}
a:hover {
	color     : #ff85b8;
	background: #ffff99;
}

/* 全体枠 */
.wrap {
	width          : 100%;
	max-width      : 100%;
	margin         : 0;
	background     : #fffafc;
	background-clip: padding-box;
	border         : 2px solid;
	border-color   : #ffeef5 #f0a8c4 #f0a8c4 #ffeef5;
	outline        : 1px solid #ff99bb;
	padding        : 10px;
}

/* ヘッダー */
header.site {
	background     : transparent;
	margin         : 0 0 10px;
	padding        : 0;
	display        : flex;
	align-items    : center;
	justify-content: space-between;
}
header.site .title {
	font-size      : 18px;
	font-weight    : bold;
	color          : #ff85b8;
	text-decoration: underline;
	text-shadow    : 1px 1px #ffd0e0;
}
.menu-toggle {
	display      : none;
	height       : auto;
	background  : #fff;
	color       : #e05a8f;
	border      : 2px solid;
	border-color: #ffeef5 #f0a8c4 #f0a8c4 #ffeef5;
	font-weight : bold;
	padding     : 5px 12px;
	font-size   : 13px;
	line-height : 1;
	cursor      : pointer;
}
.menu-toggle:hover {
	background: #ffff99;
}
.menu-toggle:active {
	border-color: #f0a8c4 #ffeef5 #ffeef5 #f0a8c4;
}

/* 本体２ペイン */
.container {
	display    : flex;
	align-items: flex-start;
}
aside.sidebar {
	flex   : 0 0 200px;
	width  : 200px;
	padding: 8px 6px;
}
main.content {
	flex       : 1 1 auto;
	min-width  : 0;
	padding    : 10px 14px;
	border-left: 1px dotted #ff99bb;
	background : #fffafc;
}

/* ロゴ */
.logo-box {
	text-align   : center;
	border       : 1px solid #ff99bb;
	background   : #fff;
	padding      : 6px 3px;
	margin-bottom: 8px;
}
.logo-box .logo {
	font-size     : 19px;
	font-weight   : bold;
	color         : #ff85b8;
	letter-spacing: 1px;
}
.logo-box .logo span {
	color: #e05a8f;
}

/* 左パネル各ブロック */
.side-box {
	margin-bottom: 11px;
}
.side-box h3 {
	font-size   : 12px;
	margin      : 0;
	padding     : 3px 4px;
	color       : #fff;
	text-align  : center;
	background  : #ff85b8;
	border      : 1px solid;
	border-color: #ffc2d9 #e0699a #e0699a #ffc2d9;
}
.side-box ul {
	list-style  : none;
	margin      : 0;
	padding     : 0;
	border      : 1px solid;
	border-color: #f0a8c4 #ffeef5 #ffeef5 #f0a8c4;
	border-top  : none;
}
.side-box li a {
	display        : block;
	padding        : 4px 6px 4px 14px;
	text-decoration: none;
	color          : #e05a8f;
	background     : #fff0f6;
	border-bottom  : 1px dotted #ff99bb;
	position       : relative;
}
.side-box li a::before {
	content : "・";
	color   : #ffa3c7;
	position: absolute;
	left    : 4px;
}
.side-box li a:hover {
	background: #ffff99;
	color     : #e05a8f;
}
.side-box .cnt {
	color    : #cc88aa;
	font-size: 10px;
}

/* タグ */
.tagcloud {
	border      : 1px solid;
	border-color: #f0a8c4 #ffeef5 #ffeef5 #f0a8c4;
	border-top  : none;
	padding     : 5px;
}
.tagcloud a {
	display        : inline-block;
	margin         : 1px;
	padding        : 0 5px;
	background     : #fff0f6;
	color          : #e05a8f;
	text-decoration: none;
	border         : 1px solid;
	border-color   : #ffeef5 #f0a8c4 #f0a8c4 #ffeef5;
	font-size      : 11px;
}
.tagcloud a::before {
	content: "#";
	color  : #ffa3c7;
}
.tagcloud a:hover {
	background: #ffff99;
}

/* プロフィール */
.profile-inner {
	border      : 1px solid;
	border-color: #f0a8c4 #ffeef5 #ffeef5 #f0a8c4;
	border-top  : none;
	padding     : 6px;
	text-align  : center;
}
.profile-inner .avatar {
	width        : 56px;
	height       : 56px;
	background   : #ffe0ec url("/img/profile.jpeg") center/cover no-repeat;
	border       : 1px solid #ff85b8;
	display      : inline-block;
	margin-bottom: 4px;
}
.profile-inner .pname {
	font-weight: bold;
	color      : #ff85b8;
}
.profile-inner .pbio {
	font-size : 11px;
	color     : #886677;
	text-align: center;
	margin-top: 4px;
}

/* nvmリンクカード */
.linkcard {
	display        : block;
	text-align     : center;
	text-decoration: none;
	background     : #ffa3c7;
	color          : #fff;
	padding        : 7px;
	font-size      : 13px;
	font-weight    : bold;
	border         : 2px solid;
	border-color   : #ffc2d9 #e0699a #e0699a #ffc2d9;
}
.linkcard:hover {
	background: #ffb8d4;
	color     : #ffff99;
}

/* メイン：記事一覧 */
.list-head {
	font-size    : 15px;
	color        : #ff85b8;
	font-weight  : bold;
	margin       : 0 0 8px;
	padding      : 2px 6px;
	border-bottom: 2px solid #ff85b8;
}
ul.entry-list {
	list-style: none;
	margin    : 0 0 8px;
	padding   : 0;
}
ul.entry-list li {
	padding      : 5px 2px;
	border-bottom: 1px dashed #ff99bb;
}
ul.entry-list li::before {
	content: " - ";
	color  : #ffa3c7;
}
ul.entry-list li .date {
	color       : #bb88aa;
	font-size   : 11px;
	margin-right: 6px;
}
ul.entry-list li .cat {
	font-size  : 11px;
	color      : #e05a8f;
	padding    : 0 3px;
	margin-left: 5px;
}
ul.entry-list li .cat::before {
	content: "[";
}
ul.entry-list li .cat::after {
	content: "]";
}

/* メイン：記事本文 */
.post {
	margin-top : 18px;
	border-top : 2px solid #ff85b8;
	padding-top: 10px;
}
.post:first-child {
	margin-top : 0;
	border-top : none;
	padding-top: 0;
}
.post h2.post-title {
	font-size   : 16px;
	color       : #fff;
	margin      : 0 0 5px;
	padding     : 4px 8px;
	background  : #ff85b8;
	border      : 1px solid;
	border-color: #ffc2d9 #e0699a #e0699a #ffc2d9;
	border-left : 6px solid #e05a8f;
}
.post .post-meta {
	font-size    : 11px;
	color        : #aa7799;
	margin-bottom: 10px;
}
.post .cat-link {
	color          : #e05a8f;
	text-decoration: none;
}
.post .tag-link {
	color          : #e05a8f;
	text-decoration: none;
	margin-left    : 4px;
}
.post .tag-link::before {
	content: "#";
}
.post .post-body p {
	margin-top   : 1px;
	margin-bottom: 1px;
	white-space  : normal;
}
.post .post-body p:empty {
	min-height: 1.6em;
}
.post .post-body img {
	max-width: 100%;
	height   : auto;
	border   : 1px solid #ff99bb;
}
.post-nav {
	margin-top     : 14px;
	padding-top    : 8px;
	border-top     : 1px dashed #ff99bb;
	display        : flex;
	justify-content: space-between;
	font-size      : 12px;
}
.post-nav span {
	color: #cc88aa;
}

/* 左パネル：アーカイブ(年グループ・月クリック開閉) */
.arc-months {
	display: none;
}
.arc-year.open .arc-months {
	display: block;
}
.side-box .arc-months li a {
	padding-left: 22px;
}
.side-box .arc-months li a::before {
	left: 12px;
}

/* コメント欄 */
.post-comments {
	margin-top : 18px;
	border-top : 2px solid #ff85b8;
	padding-top: 10px;
}
.comment-list {
	list-style: none;
	margin    : 0 0 10px;
	padding   : 0;
}
.comment-list li {
	border      : 1px solid;
	border-color: #f0a8c4 #ffeef5 #ffeef5 #f0a8c4;
	background  : #fff0f6;
	padding     : 6px 8px;
	margin      : 0 0 8px;
	list-style  : none;
}
.comment-list li li {
	margin-top: 8px;
	background: #fffafc;
}
.comment-author {
	font-size  : 12px;
	font-weight: bold;
	color      : #e05a8f;
}
.comment-author .avatar {
	display: none;
}
.comment-metadata {
	font-size: 10px;
	color    : #aa7799;
}
.comment-metadata a {
	color          : #aa7799;
	text-decoration: none;
}
.comment-content p {
	margin: 2px 0;
}
.reply {
	font-size: 11px;
}
.comment-respond .comment-form textarea {
	width       : 100%;
	height      : 80px;
	border      : 1px solid;
	border-color: #f0a8c4 #ffeef5 #ffeef5 #f0a8c4;
	background  : #fff;
	padding     : 4px;
}
.comment-reply-title {
	font-size    : 13px;
	color        : #ff85b8;
	margin       : 10px 0 4px;
	padding      : 0 2px;
	border-bottom: 1px dashed #ff99bb;
}
.comment-form label {
	font-size   : 11px;
	color       : #886677;
	margin-right: 4px;
}
.no-comment {
	font-size: 12px;
	color    : #aa7799;
}

/* ページ送り */
.pager {
	margin-top: 12px;
	text-align: center;
	font-size : 12px;
}
.pager a, .pager span {
	display        : inline-block;
	padding        : 2px 8px;
	margin         : 0 2px;
	border         : 1px solid;
	border-color   : #ffeef5 #f0a8c4 #f0a8c4 #ffeef5;
	text-decoration: none;
}
.pager a {
	color     : #e05a8f;
	background: #fff0f6;
}
.pager a:hover {
	background: #ffff99;
}
.pager .current {
	background  : #ff85b8;
	color       : #fff;
	border-color: #e0699a #ffc2d9 #ffc2d9 #e0699a;
}
.pager .disabled {
	color       : #ddbccc;
	border-color: #f0d0dc;
}

/* フォーム部品 */
input, select, textarea {
	height       : 20px;
	font-size    : 12px;
	color        : #333;
	background   : transparent;
	border       : none;
	border-bottom: 1px dotted #c9aeb9;
	padding      : 0 3px;
	font-family  : inherit;
}
textarea {
	height: auto;
}
input:hover, select:hover, textarea:hover {
	border-bottom: 1px solid #ff85b8;
	background   : #fdeef4;
}
input:focus, select:focus, textarea:focus {
	outline      : none;
	border-bottom: 1px solid #ff85b8;
	background   : #fdeef4;
}
button {
	height       : 20px;
	font-size    : 12px;
	color        : #b0356c;
	background   : transparent;
	border       : none;
	border-bottom: 1px dotted #c9aeb9;
	padding      : 0 8px;
	cursor       : pointer;
	font-family  : inherit;
}
button:hover, button:focus {
	outline      : none;
	border-bottom: 1px solid #ff85b8;
	background   : #fdeef4;
}

/* フッター */
footer.site {
	margin    : 10px -10px -10px;
	padding   : 8px 10px;
	font-size : 11px;
	color     : #aa7799;
	text-align: center;
	background: #fff;
	border-top: 1px solid #f0bcd2;
}
footer.site a {
	color: #e05a8f;
}

/* Scroll Playing Game Title */
.ticker {
	flex       : 1;
	overflow   : hidden;
	white-space: nowrap;
	margin     : 0 12px;
}
.ticker-track {
	display     : inline-block;
	padding-left: 100%;
	animation   : ticker-scroll 10s linear infinite;
	color       : #cc3377;
	font-weight : bold;
}
@keyframes ticker-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-100%); }
}

/* ＳＰ表示対応 */
@media (max-width: 720px) {
	.menu-toggle {
		display: block;
	}
	header.site .title {
		font-size: 18px;
	}
	.container {
		flex-direction: column;
	}
	aside.sidebar {
		order     : 2;
		flex-basis: auto;
		width     : 100%;
		display   : none;
	}
	aside.sidebar.open {
		display: block;
	}
	main.content {
		order      : 1;
		width      : 100%;
		border-left: none;
	}
}