/* 

	名　称：style.css
	機　能：ブログ用CSS
	作成日：2026/07/25
	更新日：2026/07/25
	作成者：yuripafe

*/

/* リセット */
* {
	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         : 3px double #ff85b8;
	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       : 1px solid #ff99bb;
	border-bottom: 1px solid #ff99bb;
	font-weight  : bold;
	padding      : 5px 12px;
	font-size    : 13px;
	line-height  : 1;
	cursor       : pointer;
}
.menu-toggle:hover {
	background   : #ffff99;
	border-bottom: 1px solid #ff99bb;
}

/* 本体２ペイン */
.container {
	display    : flex;
	align-items: flex-start;
}
aside.sidebar {
	flex   : 0 0 180px;
	width  : 180px;
	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 #ff99bb;
}
.side-box ul {
	list-style: none;
	margin    : 0;
	padding   : 0;
	border    : 1px solid #ff99bb;
	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 #ff99bb;
	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 #ff99bb;
	font-size      : 11px;
}
.tagcloud a::before {
	content: "#";
	color  : #ffa3c7;
}
.tagcloud a:hover {
	background: #ffff99;
}

/* プロフィール */
.profile-inner {
	border    : 1px solid #ff99bb;
	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: left;
	margin-top: 4px;
}

/* リンクバナー */
.linkbanner {
	border    : 1px solid #ff99bb;
	border-top: none;
	padding   : 5px;
	text-align: center;
}
.linkbanner a {
	display: inline-block;
	margin : 2px 0;
}
.linkbanner img {
	border : 1px solid #ff99bb;
	width  : 88px;
	height : 31px;
	display: block;
	margin : 0 auto;
}
.linkbanner .dummy {
	width      : 88px;
	height     : 31px;
	background : #fff0f6;
	order      : 1px dashed #ff99bb;
	color      : #cc88aa;
	font-size  : 9px;
	line-height: 31px;
	margin     : 2px auto;
}

/* nvmリンクカード */
.linkcard {
	display        : block;
	text-align     : center;
	text-decoration: none;
	background     : #ffa3c7;
	color          : #fff;
	padding        : 7px;
	font-size      : 13px;
	font-weight    : bold;
	border         : 1px solid #ff85b8;
}
.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-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     : 0 0 1em;
	white-space: pre-wrap;
}
.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;
}

/* ページ送り */
.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 #ff99bb;
	text-decoration: none;
}
.pager a {
	color     : #e05a8f;
	background: #fff0f6;
}
.pager a:hover {
	background: #ffff99;
}
.pager .current {
	background  : #ff85b8;
	color       : #fff;
	border-color: #ff85b8;
}
.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;
}

/* ＳＰ表示対応 */
@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;
	}
}