@charset "UTF-8";

/*//////////////////////////////////////////////////////////////////////////////

styles.css

--------------------------------------------------------------------------------

//////////////////////////////////////////////////////////////////////////////*/

/*
 * サイトで共通のスタイルを定義します
 * ========================================================================== */
body {
  height: 100% !important;
  color: #2d2d2d;
  font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3",
    "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", sans-serif;
  background-color: #fff7fa;
}

/* 見出しのスタイル */
h1,
h2,
h3,
h4,
h5 {
  font-family: "Dosis", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3",
    "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", sans-serif;
  font-weight: 700;
}


/*ボタン*/
.btn.btn-brown {
  color: #fff ; 
  background-color: #8B4513 ;
  border-color: #8B4513;
}
.btn.btn-brown:hover,
.btn.btn-brown:focus {
  background-color: #A0522D;
  border-color: #A0522D;
}

/* btnの下線を消す */
.btn {
    text-decoration: none !important;
}
.btn:hover {
    text-decoration: none !important;
}

/************************************************************
問題編集、詳細画面、フォームのラベル
*==============================================================
/* 共通：セクションの見出しバー */
.section-label {
    padding: .4rem .75rem;
    font-weight: 700;
    font-size: .9rem;
    border-radius: .5rem .5rem 0 0;
    color: #fff;
    display: flex;
    align-items: center;
}

/* 直後のフォーム要素との隙間を少し詰める */
.section-label + .form-control,
.section-label + .form-select,
.section-label + textarea,
.section-label + .mt-2,
.section-label + div {
    margin-top: .35rem;
}

/* 科目名：落ち着いたブルー */
.section-label-subject {
    background: #0d6efd;           /* Bootstrap primary に近い青 */
}

/* テーマ：少し紫寄りで、重要感を出す */
.section-label-theme {
    background: #6f42c1;           /* BS purple 系 */
}

/* 問題：注意を引く赤系 */
.section-label-question {
    background: #d63384;           /* red/pink 中間くらい */
}

/* 図版/写真：情報っぽいシアン寄り */
.section-label-info {
    background: #0dcaf0;           /* info 系 */
}

/* 小さい説明テキスト（例：※20文字以内）を少し弱めに */
.section-label small {
    font-weight: 400;
    opacity: .9;
}

/* 図版/写真 見出し内の＋ボタンのなじませ */
.section-label-info .btn-light {
    font-size: .75rem;
    padding: .15rem .5rem;
    border-radius: 999px;
}

/* 枠　　*/
.section-box {
    border: 1px solid #dee2e6;
    border-radius: .5rem;
    background: #fff;
    padding: .75rem;
    margin-top: .25rem;
}

/* タイトル　　*/
.section-title {
    font-weight: 600;
    margin-bottom: 20px;
    color: var(--bs-dark);
}

/* コンテナー枠 */
.container.container-box {
	border: 1px solid #dee2e6;
    border-radius: .5rem;
    background: #fff;
    padding: 1rem;
    margin-top: 1rem;
	margin-bottom: 2rem;
}

.container-fluid.container-box {
	border: 1px solid #dee2e6;
    border-radius: .5rem;
    background: #fff;
    padding: 1rem;
    margin-top: 1rem;
	margin-bottom: 2rem;
}

/* =====================================================================================
*/