/* shichusuimei.css（線なし・文字化け修正版） */
.background-layer {
  position: absolute;      /* bodyを基準に配置 */
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* 中央に寄せる */
  
  width: 800px;   /* 好きな大きさに調整 */
  height: 1800px;  /* 正方形や円っぽい背景ならここ */
	margin: 580px auto;
	background: radial-gradient(circle, #dcdcdc 0%, #d8c9e2 100%);
	border-radius: 15px;      /* 丸っぽい装飾 */
  z-index: 0;   /* 背景なので一番後ろ */
  opacity: 0.5;            /* 透け感 */
		box-shadow: 0 4px 8px rgba(143, 109, 160, 0.4); /* ダスティパープル半透明 */
}

/* 全体ラッパー */
.shichusuimei-form,
.results-section,
.adjusted-section {
    max-width: 500px;
    margin: 30px auto;
    padding: 20px;
	background-color: rgba(252, 221, 230, 0.6); /* 透過度60% */
    border-radius: 15px;
	box-shadow: 0 4px 8px rgba(143, 109, 160, 0.4); /* ダスティパープル半透明 */
    font-family: 'Sawarabi Mincho', 'Noto Sans JP', sans-serif;
    display: flex;
    flex-direction: column; /* 全体を縦並び */
    align-items: center;    /* 横方向中央揃え */
    gap: 15px;              /* 各行の間隔 */
	color: #333333; /* 黒より柔らかい暗めグレー */
	position: relative; /* これで z-index が効くようになる */
	z-index: 1;         /* 背景より前に出す */
}

@media (max-width: 600px) {
	#shichusuimei-form,
	#results-section,
	#adjusted-section,
    max-width: 600px;
	align-items: center;    /* 横方向中央揃え */
}	
	
/* 見出し */
.shichusuimei-form-h2,
.shichusuimei-form h3,
.results-section h3 {
    text-align: center;
    color: #54425c; /* ダークパープル */
    display: block;        /* ブロック表示 */
    white-space: normal;   /* 改行を有効にする */
    margin: 1em 0 20px 0; /* 上下余白調整 */
	font-family: 'M PLUS Rounded 1c', 'Noto Sans JP', sans-serif;
}

/* フォームラベル */
.shichusuimei-form label {
    display: block;
    text-align: center;
    margin-top: 10px;
    font-weight: 500;
    color: #54425c; /* ダークパープル */
}

/* フォーム入力 */
.shichusuimei-form input[type="number"],
.shichusuimei-form select {
    padding: 5px 10px;
    margin: 5px 5px 10px 0;
    border-radius: 8px;
    border: 1px solid #8f6da0; /* ダスティパープル */
    width: 100px;
    text-align: center; /* 入力文字を中央揃え */
	color: #444444; /* 黒より柔らかい暗めグレー */
}

/* submitボタン */
.shichusuimei-form input[type="submit"] {
    display: block;
    margin: 20px auto 0 auto;
    padding: 10px 25px;
    background-color: #d8c9e2; /* ライトラベンダー */
    color: #54425c; /* ダークパープル */
    border: none;
    border-radius: 12px;
    font-size: 16px;
    cursor: pointer;
    transition: 0.3s;
}

.shichusuimei-form input[type="submit"]:hover {
    background-color: #8f6da0; /* ダスティパープル */
    color: #ffffff; /* ホワイト */
}

/* shichusuimei-form 専用 横並び */
#shichusuimei-form .form-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center; /* 横方向中央揃え */
}

/* 横1セルのアイテムも横2セルに合わせる */
#shichusuimei-form .form-row > div {
    flex: 0 0 50px; /* 横2セルの幅に合わせる */
    display: flex;
    flex-direction: column;
    align-items: center; /* ラベルと入力欄を縦に中央揃え */
}

#shichusuimei-form .form-item {
    display: flex;
    flex-direction: column; /* labelを上に */
    align-items: center;    /* 中央揃え */
    justify-content: center; /* 横方向中央揃え */
}

#shichusuimei-form .form-row label {
    margin: 0;
    white-space: nowrap; /* ラベルを改行させない */
}

/* スマホなど幅600px以下は縦並び */
@media (max-width: 600px) {
    #shichusuimei-form .form-row {
        flex-direction: column;
        gap: 5px;
    }
}

/* 結果テーブル共通（線なし） */
.meishiki-table,
.taiun-table,
.nenun-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 10px; /* 行間を空ける */
    margin-top: 15px;
    margin-bottom: 25px;
}

/* テーブルヘッダー */
.meishiki-table th, .taiun-table th, .nenun-table th {
    background-color: #d8c9e2; /* ライトラベンダー */
	color: #555555; /* 黒より柔らかい暗めグレー */
    padding: 8px;
    text-align: center;
	border-radius: 8px 8px 0 0;
	border: 1px solid #ffffff;
}

/* テーブルデータ */
.meishiki-table td, .taiun-table td, .nenun-table td {
    padding: 8px;
    text-align: center;
	background-color: rgba(252, 252, 252, 0.7); /* 透過度70% */
    border-radius: 8px;
	color: #444444; /* 黒より柔らかい暗めグレー */
	border: 1px solid #d8c9e2; /* ライトラベンダー */
}

/* 立運セクション */
.rinen-section {
    text-align: center;
    padding: 10px;
    background-color: #fcdde6; /* パステルピンク */
    border-radius: 12px;
    font-weight: 500;
    color: #54425c; /* ダークパープル */
	}	

/* 計算後の生年月日 */
.adjusted-section h4 {
    text-align: center;
    margin-top: 0;
    margin-bottom: 8px;
    font-size: 16px;
    color: #8f6da0; /* ダスティパープル */
    display: block !important;
	font-family: 'M PLUS Rounded 1c', 'Noto Sans JP', sans-serif;
}

.adjusted-section p,
.shichusuimei-form p{
    text-align: center;
    margin: 0;
    line-height: 1.5;
    display: block !important;
	color: #444444; /* 黒より柔らかい暗めグレー */
	font-family: 'M PLUS Rounded 1c', 'Noto Sans JP', sans-serif;
}


