@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Noto+Sans+JP:wght@100..900&display=swap');

/* hero */
.hero{position: relative;border-radius: 0 0  min(5.5vw,110px) min(5.5vw,110px);overflow: hidden;}
.hero img{width: 100%;}
.hero .txt-mv{position: absolute;top: 55%;left: 50%;transform: translate(-50%,-50%);text-align: center;width: 100%;}
.hero .txt-mv p{line-height: 2.5; position: relative;z-index: 3;font-weight: bold;}
.hero .txt-mv h3 {
    margin: 0 0 min(2vw,40px);
    padding: 0 0 min(2vw,40px);
  }
.hero .txt-mv h3::before{content: '';color: #F1F1F1;background: url('../img/contact/contact.svg') no-repeat;background-size: auto;width: 975px;height: 140px;z-index: -1;top: -50%;background-size: contain;transform: translate(-50%,5%);}
@media (max-width: 1600px){
    .hero .txt-mv h3::before{width: 80vw;background-position: center;}
}
@media (max-width: 1200px){
    .hero .txt-mv h3::before{top: -7vw;}
}
@media (max-width: 1200px){
    .hero .txt-mv h3::before{top: -50px;width: 60%;}
}
@media (max-width: 768px){
    .hero{border-radius: 0;}
    .hero .txt-mv h3::before{top: -130%;}
    .hero .txt-mv h3{padding-bottom: 20px;margin-bottom: 20px;}
    .hero .txt-mv{top: 60%;}
    .hero .txt-mv p{line-height: 2;}
}
@media (max-width: 430px){
    .hero .txt-mv h3::before{top: -40%;
        width: 287px;height: 41px;}
}

/* form-contact */
#form-contact{max-width: 1000px;width: calc(100% - 40px);margin: 0 auto;box-shadow: 0 3px 20px rgba(0, 0, 0, 0.3);padding: min(3.5vw,75px) min(3.5vw,75px);border-radius: 14px;position: relative;margin-top:-5.5vw;background: #fff;}
#form-contact .form-group{display: flex;justify-content: space-between;flex-wrap: wrap;margin: 0 0 35px;align-items: center;}
#form-contact .form-group-last{align-items: flex-start;}
#form-contact .form-group-last label{padding-top: 20px;}
#form-contact label {width: 170px;font-size: 1.6rem;}
#form-contact label sup{color: #FE6445;font-size: 1.4rem;}
#form-contact input,
#form-contact  textarea {width: calc(100% - 187px);padding:20px 10px;border: 1px solid #ccc;border-radius: 5px;font-size: 1.6rem; font-family: "Noto Sans JP", serif;}
#form-contact textarea {height: 250px;resize: none;word-wrap: break-word; font-family: "Noto Sans JP", serif;}
#form-contact .submit-btn {background-color: #000000;color: white;border: none;border-radius: 11px;max-width: 220px;width: 100%;display: block;margin: 0 auto;cursor: pointer;font-size: 2rem;font-weight: 500;margin:50px auto 0;line-height: 2;padding: 10px 0;transition: all 0.4s;letter-spacing: 0.1em; font-family: "Noto Sans JP", serif;}
#form-contact .submit-btn:hover{background: #EF7626;}
#form-contact label.error {font-size: 12px;color: #ff0000;padding-left: 187px;width: 100%;font-weight: 400;}
@media (max-width: 1420px){
    #form-contact{margin-top: -4.5vw;}
}
@media (max-width: 1220px){
    #form-contact{margin-top: -2.5vw;}
}
@media (max-width: 768px){
    #form-contact{width: 100%;border-radius: 0;padding: 30px 13px 50px;margin-top: 0;background: #FBFCFF;}
    #form-contact .form-group{margin: 0 0 20px;}
    #form-contact label{width: 100%;}
    #form-contact input, #form-contact textarea{width: 100%;padding: 10px 10px;margin-top: 15px;}
    #form-contact .submit-btn{margin: 50px 0 0;max-width: 100%;}
    #form-contact label.error{padding: 0;}
    #form-contact label sup{font-size: 1.2rem;}
}


/* form */

#confirm header{position: unset;}
#confirm .m-tit5{text-align: center;font-size: 4rem;margin: 0 0 40px;}
.frm-wrap{margin: 40px auto 0;}
.frm-btn{display: flex; justify-content: center; margin: 60px 0 0 0;}
.frm-btn button{width: 400px; margin: 0 20px 0 0; background: #000; color: #fff; text-align: center; font-weight: 600; border-radius: 6px; padding: 15px 0; display: block; cursor: pointer; font-size: 2rem;font-family: "Noto Sans JP", serif;}
.frm-btn button:last-of-type{margin-right: 0;}
.frm-btn button:hover{background: #ef7626;}
.frm-btn button.frm-btn_back{background: #333;}
.frm-btn button.frm-btn_back:hover{background: #ef7626;}
table.formTable{width:100%;margin:0 auto;border-collapse:collapse;}
table.formTable td,table.formTable th{border:1px solid #ccc;padding:10px;}
table.formTable th{width:30%;font-weight:normal;background:#efefef;text-align:left;}
table.formTable td {word-wrap: anywhere;}
p.error_messe{margin:5px 0;color:red;}

/* media */
@media screen and (max-width:768px) {
    #confirm .m-tit{font-size: 3.2rem;}
    #formWrap {width:95%;margin:0 auto;}
    #form-contact .form-group-last label{padding-top: 0;}
    table.formTable th, table.formTable td {width:auto;display:block;}
    table.formTable td {word-wrap: anywhere;}
    table.formTable th {margin-top:5px;border-bottom:0;}
    form input[type="submit"], form input[type="reset"], form input[type="button"] {display:block;width:100%;height:40px;}
}
@media screen and (max-width:576px) {
    #confirm .m-tit{font-size: 5.5vw;}
}
/* thanks */
.thanks header{position: unset;}
.thanks .main{margin: 40px 0 0;text-align: center;}
.thanks .main a{text-decoration: underline;text-underline-offset: 5px;}
.thanks .main a:hover{color: #EF7626;}
@media screen and (max-width:576px) {
    .thanks .m-tit{font-size: 5.5vw;}
}