/* --------------------------------------------------
	2025 即PATご利用ガイド（PayPay）
-------------------------------------------------- */


.nav_col3 {
    --btn_size: 223px;
	margin-top: 15px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(var(--btn_size), 1fr));
    gap: 10px;
}

.nav_col3 > div {
    display: grid;
    grid-template-columns: subgrid;
    grid-template-rows: subgrid;
}

.nav_col3 a {
    display: grid;
    place-content: center;

	color: #fff;
	box-shadow: none;
	border: 1px solid #fff;
	font-size: 1.3rem;
	position: relative;
	border-radius: 6px;
	padding: 12px;
	text-decoration: none;
}

.nav_col3 a::after {
	font-family: var(--fa-style-family, "Font Awesome 6 Free");
	font-weight: var(--fa-style, 900);
	font-size: 0.8rem;
	content: '\f078';
	position: absolute;
	bottom: 2px;
	left: 50%;
	transform: translateX(-50%);
}

/* - 画像　センター
-------------------------------------------------- */

.img_md {
    text-align: center;
}

.img_md img {
    width: 100%;
    max-width: 600px;
}

/* - 馬券購入の流れ
-------------------------------------------------- */
.flow_buy_block .img{
    text-align: center;
}

.flow_buy_block img{
    width: 100%;
    max-width: 640px;
}

.flow .heading-leftline {
    color: var(--type-color);
}


/* - 注記リスト
-------------------------------------------------- */
.grid_note_list {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 8px;
}

.grid_note_list li {
	display: grid;
	grid-template-columns: subgrid;
	grid-column: span 2;
	column-gap: clamp(8px,-2.7468rem + 4.6243vw,16px);
}

.grid_note_list .cap {
	font-weight: bold;
}

/* - 注記ブロック
-------------------------------------------------- */
.caution.white {
    background: #fff;
}

/* - 画像の横スクロール
-------------------------------------------------- */
.scr-md .scr_caution{
    display: none;
}

/* - ボタンリスト　調整
-------------------------------------------------- */
.button-list {
    justify-items: center;
}

/* ------------------------------------------------------------
	959px以下
------------------------------------------------------------ */
@media screen and ( max-width : 959px ) {
    .type_head_area.w940{
        padding: 10px;
    }
}


/* ------------------------------------------------------------
	767px以下
------------------------------------------------------------ */
@media screen and (max-width : 767px) {
    .nav_col3 {
        grid-template-columns: 1fr 1fr;
    }

    /* - 画像の横スクロール
    -------------------------------------------------- */
    .scr-md .scr_caution{
        display: block;
        margin-bottom: 10px;
        background: #fff;
    }

    .scr-md .img {
        width: 768px;
        padding-bottom: 10px;
    }

}

/* ------------------------------------------------------------
	479px以下
------------------------------------------------------------ */
@media screen and (max-width : 479px) {

    .grid_note_list {
        grid-template-columns: 1fr;
        row-gap: 16px;
    }

    .grid_note_list li {
        grid-column: span 1;
        row-gap: 8px;
    }

    /* - ボタンリスト　調整
    -------------------------------------------------- */
    .button-list {
        justify-items: stretch;
    }

}