@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Akaya+Kanadaka&family=Homemade+Apple&family=Cedarville+Cursive&family=Yellowtail&family=Zen+Kurenaido&family=Shippori+Mincho&family=Yellowtail&family=Zen+Maru+Gothic&display=swap');
@import url('https://use.fontawesome.com/releases/v7.0.1/css/all.css');

body{	/* 全体設定 */
	font-family: "Zen Maru Gothic", sans-serif;
	background: #ddd;
	color: #333;
	font-size: 10px;
	line-height: 2em;
}

a{	/* リンク設定 */
	text-decoration: none;	/* 装飾なし */
	color: #B9ADB9;
}
				
a:hover{	/* リンクにカーソルを合わせたときの色 */
	color: #235AAA;
}

a:visited{
	color: #821550;
}


h1{	/* タイトル */
	font-family: "Shippori Mincho", serif;	　/* しっぽり明朝 */
	font-weight: lighter;	　/* 文字細め */
	font-size: 10px;
	color: #999;
	text-align: center;
}

h1 a{	/* タイトル内リンク */
	font-family: "Shippori Mincho", serif;
	color: #999;
	text-decoration: none;
}

h1 a:hover{	/* タイトル内リンク */
	font-family: "Shippori Mincho", serif;
	color: #999;
	text-decoration: none;
}

h1 a:visited{	/* タイトル内リンク */
	font-family: "Shippori Mincho", serif;
	color: #999;
	text-decoration: none;
}

.menu{	/* プロフなどリンクボックス */
	width: 80%;
	padding: 3px;
	position: relative;
	left: -30px;
}

.menu ul{	/* プロフなどリスト */
	list-style: none;
	display: flex;
	justify-content: flex-end;
}

.menu li{	/* プロフなどリスト */
	padding: 2px;
	margin-left: 1.5px;
}

.menu a{ /* リスト内リンク */
	font-family: 'Homemade Apple', sans-serif;
	color: #235AAA;
	text-decoration: none;
}

.profile{	/* プロフィール */
	margin: auto;
	width: 65%;
	position: relative;
	top: 13px;
}

.profile b{
	background: #B9ADB9;
}

.template{
	width: 65%;
	margin: auto;
	position: relative;
	top: 13px;
}

.template textarea{
	font-family: 'Akaya Kanadaka', 'STHeitiSC-Light', 'Microsoft YaHei', gulim, メイリオ, sans-serif;
	max-height: 30%;
	max-width: 30%;
	background: #f8fbff;
	color: #333;
}

.bookmark{
	width: 65%;
	margin: auto;
	position: relative;
	top: 13px;
}

.bookmark a{
	font-family: 'Akaya Kanadaka', 'STHeitiSC-Light', 'Microsoft YaHei', gulim, メイリオ, sans-serif;
	color: #B9ADB9;
}

.bookmark a:hover{
	font-family: 'Akaya Kanadaka', 'STHeitiSC-Light', 'Microsoft YaHei', gulim, メイリオ, sans-serif;
	color: #235AAA;
}

.bookmark a:visited{
	font-family: 'Akaya Kanadaka', 'STHeitiSC-Light', 'Microsoft YaHei', gulim, メイリオ, sans-serif;
	color: #821550;
}

.diary_box{
	max-width: 70%;
	margin: auto;
	font-size: 10px;
}

.diary_box h2{
	font-family: "Zen Maru Gothic", sans-serif;
	font-size: 12px;
	font-weight: lighter;
	color: 333;
	border-bottom: solid 0.3px #999;
}

.kgm_date{
	font-family: 'Homemade Apple', sans-serif;
	font-weight: lighter;
	text-align: right;
	font-size: 12px;
	color: #A590AF;
	display: block;
}

.kgm_diary{
	font-family: "Zen Maru Gothic", sans-serif;
	font-weight: lighter;
	font-size: 10px;
	color: #333;
	max-width: 90%;
	margin: auto;
}

.kgm_diary .np{
	background: #B9ADB9;
	max-width: 35%;
	margin: auto;
	border-radius: 1em;
	white-space: nowrap;
	overflow: hidden;
}

.kgm_diary .np p{
	background: #B9ADB9;
	font-size: 8px;
	animation: slideword 12s linear infinite;
}

.skng_date{
	font-family: 'Homemade Apple', sans-serif;
	font-weight: lighter;
	text-align: right;
	font-size: 12px;
	color: #235AAA;
	display: block;
}

.skng_diary{
	font-family: "Zen Maru Gothic", sans-serif;
	font-weight: lighter;
	font-size: 10px;
	color: #333;
	max-width: 90%;
	margin: auto;
}

.skng_diary .np{
	background: #235AAA;
	max-width: 35%;
	margin: auto;
	border-radius: 1em;
	white-space: nowrap;
	overflow: hidden;
}

.skng_diary .np p{
	background: #235AAA;
	font-size: 8px;
	color: #f8fbff;
	animation: slideword 12s linear infinite;
}

.np p::before{
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 10px;
	content: '\f144';
	color: #333;
	padding-right: 1em;
}

@keyframes slideword{
	from{
		transform: translateX(100%);
	}
	to{
		transform: translateX(-200%);
	}
}

h3{	/* 見出し */
	font-size: 12px;
	font-family: 'Homemade Apple', sans-serif;
	font-weight: lighter;
	border-bottom: solid 0.5px #333;
	width: 70%;
	margin: auto;
}

.timeline{
	max-width: 50%;
	max-height: 20%;
	margin: auto;
	overflow-y: scroll;	
}

.timeline .kgm_t{
	font-family: "Zen Maru Gothic", sans-serif;
	font-size: 10px;
	text-align: center;
	position: relative;
	top: 5px;
}

.timeline .kgm_t::after{
	font-family: 'Akaya Kanadaka', 'STHeitiSC-Light', 'Microsoft YaHei', gulim, メイリオ, sans-serif;
	content: " @H_KAGAMI2434";
	font-size: 10px;
	color: #B9ADB9;
}

.tweet{
	font-family: "Zen Maru Gothic", sans-serif;
	font-weight: lighter;	
	text-align: left;
	position: relative;
	border-bottom: dotted 1px #999;
	max-width: 90%;
	margin: auto;
}

.time{
	font-family: 'Akaya Kanadaka', 'STHeitiSC-Light', 'Microsoft YaHei', gulim, メイリオ, sans-serif;
	font-weigh: lighter;
	color: #444;
	display: block;
	text-align: right;
	padding-top: 2px;
}

details{
	transition: 2s;
}

details[open]{
	background: rgb(35 90 170 / 0.1);
}

summary{
	display: block;
}

details[open] summary{
	background: rgb(35 90 170 / 0.1);
}

summary::before{
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 12px;
	content: '\f6a9';
	color: #235AAA;
	padding-right: 1em;
}

details[open] summary::before{
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 12px;
	content: '\f028';
	color: #235AAA;
	padding-right: 1em;
}

.m_kgm{
	background: #B9ADB9;
}

.m_knmc{
	background: #A590AF;
}

.m_fw{
	background: #BF69F4;
}

.m_kid{
	background: #4DD7E3;
}

.m_fr{
	background: #FAD246;
}

.m_wtri{
	background: #CD3764;
}

.m_srp{
	background: #DC3C41;
}

.m_skng{
	color: #f8fbff;
	background: #235AAA;
}

.m_ymo{
	background: #AC324B;
}

.m_hsrb{
	background: #A58CDC;
}

.m_ysr{
	background: #B6C6F2;
}

.m_itk{
	background: #F3A4A9;
}

.m_skk{
	background: #C2AAE6;
}