.top_logo {
    background: none;
}
#contact_wrap{
    
}
#contact{
    text-align:center;
    width: 100%;
    padding: 0 20%;
}
.contact_inner{
    border: 10px solid #D8C0B8;
    border-radius: 10px;
    text-align: center;
}
.contact_inner p{
    font-size: 20px;
    text-align: center;
    margin-top: 30px;
    margin-bottom: 30px;
}
#contact_wrap .contact-box{
    display: flex;
    justify-content: flex-start;
    
}
#contact_wrap .contact-box .left{
    margin-left: 15%;
    margin-right: 10%;
}
#contact_wrap .contact-box .right{
    text-align: left;
}
#contact_wrap .contact-box .right img{
    width: 200px;
    margin-top: 20px;
    margin-left: 50px;
}
#contact_wrap .contact-box p{
    text-align: left;
    margin-top: 0;
    margin-bottom: 5px;
    font-size: 18px;
    font-weight: bold;
    color: #35bbc9;

}
#contact_wrap .contact-box a{
    color: ;
}

@media screen and (max-width:820px){
    #contact{
        padding: 0 5%;
    }
    .contact_inner {
        border-width: 5px; /* スマホではボーダーを薄くする */
    }
    .contact_inner p.ep{
        text-align: left;
        padding: 0 20px;
    }
    .contact-box {
        flex-direction: column; /* スマホではアイテムを縦並びにする */
        align-items: center; /* 中央揃えにする */
        padding: 0 5%;
    }

    .contact-box .left,
    .contact-box .right {
        margin: 0; /* スマホでは余白を取り除く */
        width: 100%; /* スマホでは幅を最大にする */
        text-align: center; /* テキストを中央揃えにする */
    }

    .contact-box .right img {
        width: 150px; /* スマホでは画像サイズを小さくする */
        margin: 20px 0; /* 上下のマージンを設定 */
    }

    .contact-box p {
        font-size: 16px; /* スマホではフォントサイズを小さくする */
    }
    #contact_wrap .contact-box .left{
        text-align: left;
        margin: 0 auto;
    }
    #contact_wrap .contact-box .right{
        text-align: left;
    }
    #contact_wrap .contact-box .right img{
        width: 200px;
        position: relative;
        left: 50%;
        transform: translate(-50%, 0);
        margin: 20px auto;
    }
}