/*
Theme Name:パンガシウス
Theme URL:https://hsgms.net/
ハンドルネーム：senoka
Author:hsgm
Version:1.00
*/
@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+JP&display=swap');
/*============================================
全般的なスタイル
============================================*/
* {margin:auto; padding: 0em; box-sizing: border-box;}

body

{font-family: "IBM Plex Sans JP", sans-serif;
background-color:white;	/*変更　　#B0E0E6（パウダーブルー）#FFCCCC（ピンク）*/
color: #330000;/*変更　　#5F1F1D（焦げ茶）*/
font-size:100%;
line-height:1.5;
padding: 1.75em;
}

img {
max-width: 100%;
height: auto;
}

a:link { color: #00687C; }/*変更　　#008080（青緑）#00687C（青の濃い青緑）*/
a:visited { color: #5F1F1D; }/*変更　#5F1F1D（焦げ茶）*/
a:hover { color: #FF6666; }/*変更　　#FF6666（蛍光レッド）*/
a:active { color: #FF6666; }/*変更　#FF6666（蛍光レッド）*/

li {list-style-type:none;}
img {border:0;} 
a.no-underline {text-decoration: none;}
table { background-color: #ffffff; }
td {text-align: center;}

h1 {
  position: relative;/* 相対的ポジション*/
  font-size: 2em;
}

h2 { 
	font-size: 1.5em; 
	color: #5F1F1D;/*#5F1F1D（焦げ茶）*/
	border-bottom: dashed 2px #666666;/*点線　#666666（鼠色）*/
}

h3 {
  position: relative;/* 相対的ポジション*/
  font-size: 1.125em;
}

h4 {
	position: relative;
	font-size: 1em;
	color: #003399;/* #003399（濃い青）*/
}

p {
    margin: 1.5em 0; /* 段落間のスペース */
}


.log-box {
    height: 400px;           /* 枠の高さ（ここを変えると広さが変わります） */
    overflow-y: scroll;      /* 縦スクロールバーを出す */
    border: 2px solid #5F1F1D; /* 枠線：本文と同じ焦げ茶色 */
    padding: 1.5em;          /* 枠内の余白 */
    width: 80%;              /* 画面の8割くらいの幅にする */
    margin-bottom: 3em;      /* 下（フッター）との隙間 */
    background-color: rgba(255,255,255,0.8); /* 背景少し透過させてもオシャレかも */
}


.log-box ul {
    width: 100%;             /* 幅いっぱい使う */
}

.log-box li {
    text-align: left;        /* ★重要：margin:autoの影響を打ち消して左寄せにする */
    margin: 0 0 0.5em 0;     /* 下に少し隙間 */
    border-bottom: 1px dashed #ccc; /* 薄い点線で区切る */
    padding-bottom: 0.3em;
}


.log-box .date {
    font-family: monospace;  /* 等幅フォントで数字を揃える */
    color: #666;
    margin-right: 1em;       /* タイトルとの隙間 */
    font-size: 0.9em;
}

/* リンクの下線を消す（ホバー時だけ出るようにする） */
.log-box a {
    text-decoration: none;
}
.log-box a:hover {
    text-decoration: underline;
}


@media (max-width: 768px) {
    .log-box {
        width: 100%;
        height: 300px; /* スマホなら少し低くする */
    }
}