.button_box {
    display: flex;
    flex-wrap: wrap; 
    justify-content: center;
    max-width: 1100px;
    margin: 0 auto;
    gap: 20px; /* 余白を設定 */
}

/* ボタン 1set */
.button_1p {
    display: flex;
    align-items: center;
    justify-content: center; /* アイコンとテキストを中央に配置 */
    border: 1px solid #000;
    padding: 35px 0;
    text-decoration: none;
    color: #000;
    width: 450px; /* ボタンの幅を固定 */
    box-sizing: border-box; /* パディングとボーダーを含めてサイズを計算 */
    position: relative;
}
.button_1p img {
    position: absolute;
    left: 30px; /* アイコンを左寄せ */
    width: 80px; /* アイコンの幅 */
    height: auto; /* アイコンの高さ */
}
.button_1p span {
    font-family: 'Yu Gothic UI', sans-serif; /* フォントファミリーを指定 */
    font-size: 18px; /* フォントサイズを指定 */
}

/* ボタン 2set */
.button_2p {
    display: flex;
    align-items: center;
    border: 1px solid #000;
    padding: 10px;
    text-decoration: none;
    color: #000;
    flex: 1 1 calc(50% - 40px); /* 画面幅に応じてボタンの幅を調整 */
    box-sizing: border-box; /* パディングとボーダーを含めてサイズを計算 */
    position: relative;
}
.button_2p img {
    margin: 0 20px 0 10px;
    width: 72px; /* アイコンの幅 */
    height: 72px; /* アイコンの高さ */
}
.button_2p span {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    font-family: 'Yu Gothic UI', sans-serif; /* フォントファミリーを指定 */
    font-size: 18px; /* フォントサイズを指定 */
}

@media (max-width: 768px) {
    .button_1p, .button_2p {
        flex: 1 1 calc(100% - 40px); /* 画面幅が768px以下の場合、ボタンを1列にする */
    }
}
