/* ==========================================================================
   九州画像診断クリニック 共通スタイルシート (style.css)
   ========================================================================== */

/* --- 1. 基本設定 --- */
* { 
    box-sizing: border-box; 
    margin: 0; 
    padding: 0; 
}

body { 
    font-family: "Meiryo", "メイリオ", sans-serif; 
    color: #333; 
    background: #fff; 
    line-height: 1.6; 
    overflow-x: hidden; 
}

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

a { 
    text-decoration: none; 
    color: #0055aa; 
    transition: 0.2s;
}

a:hover { 
    opacity: 0.8; 
}

.container { 
    max-width: 980px; 
    margin: 0 auto; 
    padding: 0 15px; 
}

/* --- 2. ヘッダー & メインビジュアル --- */
#header { 
    padding: 15px 0; 
    border-bottom: 1px solid #eee; 
    text-align: center; 
}

.main-visual { 
    width: 100%; 
    background: #f0f4f8; 
    border-bottom: 4px solid #0055aa; 
    text-align: center; 
}

.main-visual img { 
    width: 100%; 
    max-width: 1000px; 
    display: block; 
    margin: 0 auto; 
}

/* --- 3. メインメニュー (グローバルナビ) --- */
#menu { 
    display: flex; 
    flex-wrap: wrap; 
    list-style: none; 
    background: #0055aa; 
}

#menu li { 
    flex: 1 1 50%; /* スマホでは2カラム */
    border-right: 1px solid rgba(255,255,255,0.2); 
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

#menu li a { 
    display: block; 
    padding: 15px 5px; 
    text-align: center; 
    font-size: 14px; 
    font-weight: bold; 
    color: #fff; 
}

#menu li.act { 
    background: #004488; /* 現在のカテゴリ */
}

@media (min-width: 601px) {
    #menu li { flex: 1; border-bottom: none; }
}

/* --- 4. サブメニュー (ボタンデザイン) --- */
.sub-menu { 
    background: #f0f7ff; 
    padding: 15px 0; 
    border-bottom: 1px solid #d0e4ff; 
}

.sub-menu ul { 
    display: flex; 
    flex-wrap: wrap; 
    justify-content: center; 
    list-style: none; 
    gap: 8px; 
    padding: 0 10px;
}

.sub-menu a { 
    display: inline-block;
    font-size: 13px; 
    font-weight: bold; 
    padding: 8px 16px; 
    color: #0055aa; 
    border: 1px solid #0055aa; 
    background: #fff; 
    border-radius: 4px; 
    white-space: nowrap; 
}

.sub-menu a.current { 
    background: #0055aa !important; 
    color: #fff !important; 
}

.sub-menu a:hover:not(.current) {
    background: #e6f2ff;
}

/* --- 5. レイアウト構造 (2カラム) --- */
.content-wrapper { 
    display: flex; 
    flex-wrap: wrap; 
    gap: 30px; 
    padding: 30px 0; 
}

.main-content { 
    flex: 2; 
    min-width: 320px; 
}

.side-content { 
    flex: 1; 
    min-width: 300px; 
}

@media (max-width: 768px) {
    .content-wrapper { flex-direction: column; }
}

/* --- 6. 見出し・装飾パーツ --- */
h2 { 
    font-size: 1.5rem; 
    color: #004499; 
    margin-bottom: 20px; 
    border-left: 6px solid #004a99; 
    padding-left: 15px; 
}

/* --- 太神追記　2026/3/16 --- */

h3 {
	background: url(images/title-tail.gif) repeat-x 0% 0%;
	height: 44px;
	margin: 0 0 15px 0;
	font-size: 1em;
}

	h3 span {
		background: url(images/title-left.gif) no-repeat 0% 0%;
		display: block;
	}
	
	h3 span span {
		background: url(images/title-right.gif) no-repeat 100% 0%;
		display: block;
		height: 44px;
	}
	
	h3 strong {
		display: block;
		width: 44px;
		height: 44px;
		padding: 0 14px 0 0;
		overflow: hidden;
		float: left;
		line-height: 44px;
		text-align: center;
		font-size: 2.917em;
		color: #fff;
	}
	
	h3 b {
		display: block;
		padding: 5px 0 0 0;
		float: left;
		text-transform: uppercase;
		line-height: 1.125em;
		font-size: 1.333em;
		color: #fff;
	}
	
	h3 i {
		display: block;
		float: left;
		margin: 0 0 0 -5px;
		text-transform: uppercase;
		line-height: 44px;
		font-size: 1.333em;
		font-weight: bold;
		font-style: normal;
		color: #fff;
	}
	
	h3 b em {
		display: block;
		font-style: normal;
	}
	
/* --- ここまで --- */

h4 { 
    display: flex; 
    align-items: center; 
    font-size: 1.1rem; 
    margin: 25px 0 10px; 
    border-bottom: 2px solid #eee; 
    padding-bottom: 5px; 
}

h4 img { 
    margin-right: 8px; 
    width: 24px; 
}

/* 個人情報保護などのリスト用 (dl/dt/dd) */
.policy-list dt { 
    font-weight: bold; 
    color: #0055aa; 
    margin-top: 20px; 
}

.policy-list dd { 
    font-size: 14px; 
    margin-bottom: 10px; 
    line-height: 1.8; 
}

/* --- 7. サイドバー & フッター --- */
.info-box { 
    border: 1px solid #ddd; 
    padding: 20px; 
    background: #f9f9f9; 
    border-radius: 5px; 
}

#footer { 
    background: #333; 
    color: #fff; 
    padding: 30px 0; 
    text-align: center; 
    font-size: 13px; 
    margin-top: 50px; 
}

#footer a { 
    color: #fff; 
    text-decoration: underline; 
}

/* --- 8. 共通ボタン --- */
.bottom-nav { 
    margin: 40px 0 20px; 
    text-align: center; 
}

.btn-top-link { 
    display: inline-block; 
    padding: 12px 60px; 
    background: #0055aa; 
    color: #fff !important; 
    font-weight: bold; 
    border-radius: 5px; 
    font-size: 16px; 
}

@media (max-width: 768px) {
    .btn-top-link { width: 100%; }
}