@charset "utf-8";
/* CSS Document */

/* 共通設定：国紹介ボックス */
.tour-point {
    
    padding: 20px;
    margin-bottom: 30px;
    border-radius: 0 4px 4px 0; 
	background-color: #f5f5f5; 
    scroll-margin-top: 85px; 
}

/* 見出し：下線の色を各国のメインカラーに合わせる */
.tour-point h3 {
    display: inline-block;
    border-bottom: 2px solid #666666; /* 色は下の個別設定で指定 */
    margin: 0 0 15px 0;
    padding-bottom: 5px;
    font-weight: bold;
	font-size: 18px; 
	color: #dc143c;
}


	/* 箇条書き全体の設定 */
.custom-list {
    list-style: none;     /* 点（●）を消す */
    padding: 0;           /* デフォルトの余白をリセット */
    margin: 0;
    display: block;       /* 強制的に縦並びにする */
    width: 100%;          /* 幅をいっぱいにする */
}

/* 各項目（li）の設定 */
.custom-list li {
    display: block;       /* 各項目を独立した一行にする */
    border-bottom: 1px solid #ddd; /* 下線（薄いグレー） */
    transition: all 0.3s ease;
}

/* 最後の項目の下線だけ消す（見た目がスッキリします） */
.custom-list li:last-child {
    border-bottom: none;
}

/* リンク（a）の設定 */
.custom-list li a {
    display: block;       /* 行全体をクリック可能にする */
    padding: 12px 10px;    /* 上下左右に少し余裕を持たせる（指で押しやすく） */
    text-decoration: none;
    color: #333;
    font-size: 15px;      /* 14pxより少し大きくすると視認性が上がります */
}

/* ホバー時の挙動（赤だと少し強いので、旅のデザインルーム様のトーンに合わせて青系か濃い赤にするのもアリです） */
.custom-list li:hover {
    border-bottom: 1px solid #e60012; /* 下線を赤く */
}

.custom-list li:hover a {
    color: #e60012; /* 文字を赤く */
    padding-left: 10px; /* 少し右にスライド */
}