@charset "UTF-8";

/* ===================================================================
   シミュレーター操作ガイド専用スタイル
=================================================================== */

/* --- 汎用マージンクラス --- */
.guide-mt-30 { margin-top: 30px !important; }
.guide-mt-40 { margin-top: 40px !important; }
.guide-mb-20 { margin-bottom: 20px !important; }
.guide-mb-30 { margin-bottom: 30px !important; }
.guide-mb-40 { margin-bottom: 40px !important; }
.guide-mb-0  { margin-bottom: 0 !important; }

/* --- 画像の装飾 --- */
.guide-img-shadow {
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    border-radius: 4px;
}

/* --- リストデザイン（操作手順・結果の見方） --- */
.guide-dl-list {
    margin-bottom: 0;
}
.guide-dl-list dt {
    background-color: #e9ecef;
    padding: 8px 15px;
    border-left: 5px solid #6c757d;
    margin-bottom: 10px;
    font-weight: bold;
    color: #333;
}
.guide-dl-list dd {
    margin-bottom: 20px;
    padding-left: 15px;
    line-height: 1.6;
}
/* リスト内の最後の要素の下余白を消す */
.guide-dl-list dt:last-child,
.guide-dl-list dd:last-child {
    margin-bottom: 0;
}

/* --- 注意事項ボックス --- */
.guide-attention-box {
    border: 2px solid #e74c3c;
    background-color: #fdf2f0;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 40px;
}
.guide-attention-box dd {
    margin-left: 1.5em;
    text-indent: -1.5em;
    margin-bottom: 15px;
    line-height: 1.6;
}
.guide-attention-box dd:last-child {
    margin-bottom: 0;
}
.guide-attention-mark {
    color: #e74c3c;
    font-weight: bold;
}
.t-type2 {
    border-bottom: solid 4px #007bc3;
    padding: 2rem 1rem;
    text-align: center;
    font-size: 1.8rem;
    font-weight: bold;
    background: #e5eeff;
    color: #042d61;
    line-height: 2.4rem;
}

@media (min-width: 768px) {

.t-type2 {
    font-size: 2.8rem;
    padding: 3rem;
    line-height: 4rem;
    }