@charset "UTF-8";

.contact-01 .inputError-01,
.contact-01 .inputError-02 { font-size:16px;}
.contact-01 .column-01,
.contact-01 .inputArea-01 .key,
.contact-01.confirm .value { font-size:18px;}
.contact-01 .column-01 .link-01 a { font-size:20px;}
.contact-01 { max-width:1100px; width:90%; margin-left:auto; margin-right:auto; margin-top:0.5rem;}
.contact-01 .column-01 { width:100%; letter-spacing:0.05em;}
.contact-01 .column-01 > * { font-size:1em; line-height:1.9; width:95%; margin-right:auto; margin-left:auto;}
.contact-01 .column-01 > * + * { margin-top:1em;}
.contact-01 .column-01 .link-01 { display:flex; justify-content:center; margin-top:2em;}
.contact-01 .column-01 .link-01 a { font-family:"Noto Serif JP"; letter-spacing:0.1em; color:#fff; background:#006835; width:15em; height:4.2em; display:flex; align-items:center; justify-content:center; padding-bottom:0.3em; -webkit-transition:background 0.4s; -moz-transition:background 0.4s; -ms-transition:background 0.4s; -o-transition:background 0.4s; transition:background 0.4s;}

body.pc .contact-01 .column-01 .link-01 a:hover { background:#00532a;}
.contact-01 .formArea { background:#fff; margin-top:0.7rem; padding-top:0.75rem; padding-bottom:0.3rem; position:relative;}
.contact-01 .inputArea-01 { width:86.36364%; margin-top:0.3rem; margin-right:auto; margin-left:auto; display:flex; justify-content:space-between;}
.contact-01 .inputArea-01:first-of-type { margin-top:0;}
.contact-01 .inputArea-01 .key { line-height:1.5; display:flex; align-items:center; width:calc(25.26316% - 0.5em);}
.contact-01 .inputArea-01 .value { width:74.73684%;}
.contact-01 .inputArea-01 .value textarea,
.contact-01 .inputArea-01 .value input[type="text"] { width:100%;}
.contact-01 .inputArea-01 .value textarea { height:17.8em; float:left;}
.contact-01 .submit-01 { margin-top:0.6rem; width:86.36364%; margin-right:auto; margin-left:auto; display:flex; justify-content:center;}
.contact-01 .submit-01 .btnArea + .btnArea { margin-left:2em;}
.contact-01 .inputError-01,
.contact-01 .inputError-02 { line-height:1.5; padding-top:0.35em; padding-right:0.5em; padding-bottom:0.5em; padding-left:1em; background:#c00; color:#fff; display:block; letter-spacing:0.05em; width:100%;}
.contact-01 .inputError-01 { text-align:center; margin-top:0.7rem;}
.contact-01 .inputError-01 + .formArea { margin-top:0;}
.contact-01 .inputError-02 { margin-top:0.5em;}
.contact-01 .inputError-02 + .inputError-02 { margin-top:0.25em;}
.contact-01.confirm .value { /*background:mix($gray-10,
#fff,75%); */border-width:1px; border-color:#ecead2; border-style:solid; background:#fdfbe1; padding-top:1em; padding-right:1em; padding-bottom:1.1em; padding-left:1em;}
.contact-01.confirm .submit-01 { margin-top:0.8rem;}
.contact-01.confirm .submit-01 button[type="submit"] { float:left;}
.contact-01.error .column-01,
.contact-01.finish .column-01 { text-align:center; background:#fff; width:100%; margin-right:auto; margin-left:auto; padding-top:0.75rem; padding-bottom:0.8rem;}
.contact-01.error .column-01 .subTtl-01,
.contact-01.finish .column-01 .subTtl-01 { font-size:1.2em; font-weight:600; line-height:1.6;}
.contact-01.error .column-01 .info-01,
.contact-01.finish .column-01 .info-01 { display:flex; justify-content:center; text-align:left;}
.contact-01.error .column-01 .info-01 *,
.contact-01.finish .column-01 .info-01 * { font-size:1em;}
.contact-01.error .column-01 .info-01 a,
.contact-01.finish .column-01 .info-01 a { /* 点線-> */background:-webkit-linear-gradient(90deg, #333 50%, transparent 0) repeat-x; background:-moz-linear-gradient(90deg, #333 50%, transparent 0) repeat-x; background:-ms-linear-gradient(90deg, #333 50%, transparent 0) repeat-x; background:-o-linear-gradient(90deg, #333 50%, transparent 0) repeat-x; background:linear-gradient(90deg, #333 50%, transparent 0) repeat-x; background-size:3px 1px; background-position:0 1.4em; /* <-点線 */padding-bottom:0.08em;}
.globalFooter.contact { margin-top:1rem;}

@media (max-width:1000px) {
.contact-01 .submit-01 .btnArea + .btnArea { margin-left:1.4em;}
}

@media (max-width:900px) {
.contact-01 .inputArea-01 .key { width:calc(27.36842% - 0.5em);}
.contact-01 .inputArea-01 .value { width:72.63158%;}
}

@media (max-width:768px) {
.contact-01 { margin-top:0.378rem;}
.contact-01 .formArea { margin-top:0.441rem; padding-top:0.4725rem; padding-bottom:0.189rem;}
.contact-01 .inputArea-01 { margin-top:0.189rem; margin-right:auto; margin-left:auto;}
.contact-01 .inputArea-01 .key { width:calc(30.52632% - 0.5em);}
.contact-01 .inputArea-01 .value { width:69.47368%;}
.contact-01 .submit-01 { margin-top:0.378rem;}
.contact-01 .inputError-01,
.contact-01 .inputError-02 { font-size:11px;}
.contact-01 .inputError-01 { margin-top:0.441rem;}
.contact-01.confirm .submit-01 { margin-top:0.504rem;}
.contact-01.error .column-01,
.contact-01.finish .column-01 { padding-top:0.5355rem; padding-bottom:0.567rem;}
.globalFooter.contact { margin-top:0.63rem;}
}

@media (max-width:600px) {
.contact-01 .inputArea-01 { display:block;}
.contact-01 .inputArea-01 .key { width:100%;}
.contact-01 .inputArea-01 .key br { display:none;}
.contact-01 .inputArea-01 .value { margin-top:0.5em; width:100%;}
.contact-01 .submit-01 .btnArea + .btnArea { margin-left:1em;}
}

@media (max-width:550px) {
.contact-01.confirm .submit-01 button[type="submit"] { width:12.5em;}
}

@media (max-width:450px) {
.contact-01 .submit-01 .btnArea + .btnArea { margin-left:0.8em;}
.contact-01.confirm .submit-01 button[type="submit"] { width:11.5em;}
}

@media (max-width:400px) {
.contact-01 .inputArea-01 { width:89.81818%;}
.contact-01 .submit-01 .btnArea + .btnArea { margin-left:0.4em;}
.contact-01.confirm .submit-01 button[type="submit"] { width:10.5em;}
}

@media (max-width:350px) {
.contact-01 .column-01,
.contact-01 .inputArea-01 .key,
.contact-01.confirm .value { font-size:11px;}
.contact-01 .column-01 .link-01 a { font-size:12px;}
.contact-01 .inputArea-01 .value { margin-top:0.4em;}
.contact-01.input .column-01 p,
.contact-01.confirm .column-01 p { line-height:1.7;}
.contact-01.confirm .submit-01 button[type="submit"] { width:10em;}
.contact-01.error .column-01 .subTtl-01 + p,
.contact-01.finish .column-01 .subTtl-01 + p { line-height:1.7;}
}

@media (min-width:769px) and (max-width:1222px) {
.contact-01 .inputError-01,
.contact-01 .inputError-02 { font-size:calc(11px + ((1vw - 7.68px) * 1.1013));}
.contact-01 .column-01,
.contact-01 .inputArea-01 .key,
.contact-01.confirm .value { font-size:calc(14px + ((1vw - 7.68px) * 0.8811));}
.contact-01 .column-01 .link-01 a { font-size:calc(14px + ((1vw - 7.68px) * 1.3216));}
}

@media (min-width:351px) and (max-width:768px) {
.contact-01 .column-01,
.contact-01 .inputArea-01 .key,
.contact-01.confirm .value { font-size:calc(11px + ((1vw - 3.5px) * 0.7177));}
.contact-01 .column-01 .link-01 a { font-size:calc(12px + ((1vw - 3.5px) * 0.4785));}
}