@import "bootstrap_min.css";
@import "bootstrap-responsive_min.css";
@import "font-awesome_min.css";
@import "common.css";

/* サイトのデザイン指定をここへ指定 */

/* 短い一覧のスタイル */
/* 罫線 */
ul.ruled {
    list-style: none outside none;
    padding-left: 0;
    margin-top: 0;
    margin-left: 0;
}
.ruled li {
	border-bottom: 1px dotted #0088cc; /* 太さ、線種、色 */
	height: 100%;
	padding-top: 0.3em;
	padding-right: 0;
	padding-bottom: 0.3em;
	padding-left: 0;
}
/* 一番上（リストの上）の罫線 */
div.ruled {
    border-bottom: 1px dotted #0088cc; /* 太さ、線種、色 */
}

/* 文字色・スタイル */
.listdate {
    color: gray;
}

.listlink a,
.listlink a:link
{
    color: #389ABE;
    text-decoration: none;
}
.listlink a:hover,
.listlink a:active
{
    text-decoration: underline;
}
.listlink a:visited
{
    color: #9A38BE;
}
/* 文字色・スタイル ここまで */

/* マウスオーバーでの背景色の設定 ここから */
.interactive li:hover{
    background-color: #f0f0f0;
}
/* マウスオーバーで背景色を変更する時は、リンク文字の変更を止めておく */
.interactive .listlink a:hover,
.interactive .listlink a:active
{
    text-decoration: none;
}
/* マウスオーバーでの背景色の設定 ここまで */


/* 全一覧のスタイル */
.blog-entry {
	border-bottom: #dfdfdf solid 1px;
}
.blog-entry h3,
.blog-entry h2 {
	line-height: 1em;
	font-weight: normal;
}
.blog-entry p {
	margin: 0.8em auto 1.5em auto;
}
/* 全一覧の画像 */
.catch-image img {
	width: 150px;
	margin-bottom: 15px;
}

/* 記事ページの画像 */
.images-col img {
	margin-bottom: 20px;
	margin-right: 20px;
	width 100%;
}

/* 記事ページの記事部分部分 */
.images-col, 
.body-area {
	margin-top: 1.8em;
}

/* 記事ページのフッタリンク調整 */
.page-footer-link {
	margin-top: 40px;
}

/* タブレット縦置き以下のサイズを想定 */
@media (max-width: 767px) {
	/* 指でスクロールできる幅を残す */
	body {
		margin-right: 30px;
	}
} /* max-width: 767px */

/* 画像の代りにファイルをアップロードしたときのアイコン表示 */
.filelink {
	padding-left: 20px;
	margin-right: 10px;
	background: url(../../icons/general.gif) no-repeat top left;
}
.doc {
	background-image: url(../../icons/doc.gif)
}
.pdf {
	background-image: url(../../icons/pdf.gif)
}
.ppt {
	background-image: url(../../icons/ppt.gif)
}
.txt {
	background-image: url(../../icons/txt.gif)
}
.xls {
	background-image: url(../../icons/xls.gif)
}
.zip {
	background-image: url(../../icons/zip.gif)
}

/* 追加・修正 */

.ruled li {
	border-bottom: 1px dotted #0088cc;
	padding: 0.3em 0;
	display: flex;           /* 横並びにする */
	align-items: flex-start; /* 上揃えにする（中央にしたいなら center） */
	gap: 1em;                 /* 日付とリンクの間隔 */
}

/* 日付部分 */
.listdate {
	color: gray;
	font-family: monospace, "Courier New", Courier; /* 等幅フォント */
	min-width: 7em;         /* 11文字くらいの幅を確保（数字 + ハイフン） */
	text-align: right;      /* 揃えたい方向に合わせる */
	flex-shrink: 0;         /* 幅を保つ */
}

/* リンク部分（左揃え） */
.listlink {
	flex: 1;
}
.listlink a,
.listlink a:link {
	color: #389ABE;
	text-decoration: none;
	display: inline-block;
}

/*記事一覧 */
.info-item {
    border: 1px solid #dddddd;
    padding: 10px;
    margin-bottom: 20px;
}

.date {
    font-size: 0.8rem;
    color: #888888;
    margin-bottom: 5px;
}

.title {
    font-size: 1.2rem;
    font-weight: bold;
    margin-top: 0;
    margin-bottom: 10px;
}

.title a {
    color: #111111;
    text-decoration: none;
    transition: color 0.3s ease;
}

.title a:hover {
    color: #555555;
}
.body {
    font-size: 0.9rem;
    color: #555555;
    margin-top: 0;
}