.main-contact {
    background-image: url(../images/yama4.png);
height: 50vh;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 100%;
    padding-top: 10%;
    background-size:cover;
    background-position: center center;

    position: relative;
    z-index: -10;

 }

 .contact2 {
    background-image: url(../images/sea.jpg);
    background-attachment: fixed;
    background-size: cover;
}

.contact-container {
    max-width: 1000px;
    margin: 0 auto;
    margin-top: 10%;
    margin-bottom: 10%;
    padding-bottom: 10%;
    background-color: rgba(240, 240, 240, 0.7);
}

.contact-TextArea {
    text-align: center;
}

.contact-TextArea h1 {
    margin: 30px;
}
.contact-container h1 img {
    margin-top: 50px;
}

form {
    margin-top: 50px;
    margin-right: 5%;
    margin-left: 5%;
    text-align: center;
}




/* コンタクト */
.contact2 {
    background-attachment: fixed;
    background-size: cover;
}

.contact_btn {
    text-align: center;
}

.contact_btn a {
    border: 1px solid #2f0d34;
    border-radius: 30px;
    padding: 10px 10%;
    display: inline-block;
    margin: 30px 0;
    color: #2f0d34;
    text-decoration: none;
    background-color: #fff;
}

.contact_btn a:hover {
    background-color: #9d84a1;
}



input[type="text"]
,textarea{
    width: 500px;
    padding: 0.25em;
}
input[type="email"]
,textarea{
    width: 500px;
    padding: 0.25em;
}

@media screen and (max-width: 640px) {
    input[type="text"]
    ,textarea{
        width: 200px;
        padding: 0.25em;
        margin: 0;
    }
    input[type="email"]
    ,textarea{
        width: 200px;
        padding: 0.25em;
}}

/* マウスが乗ったときに色が変わる */
input[type="submit"]:hover{
    background-color: orange;
    border-color: red;

/* allは全体 ０.5はアニメーションの時間 linearは同じ感じで変わる */
    transition: all 0.5s linear;

/* 指のマークになる */
    cursor: pointer;
}

/* 選ばれたところに色がつく */
select:focus,input:focus,textarea:focus{
    outline-color: orange;
}