.contact-wrap_main-view {
display: flex;
width: 100%;
}
.contact-wrap_main-view div {
width: 50%;
}
.contact-wrap_main-view .img {
height: 850px;
}
.contact-wrap_main-view .content-catch {
padding: 300px 60px 0 60px;
}
.contact-wrap_main-view .content-catch h1 {
border-bottom: 1px solid black;
padding: 0 20px 40px 20px;
}
.contact-wrap_main-view .content-catch h3 {
padding: 25px 20px 40px 20px;
}
.contact-wrap_main-view .content-catch p {
padding: 0 20px;
} .contact-wrap_info {
padding: 125px 10%;
}
.contact-wrap_info .title h1 {
position: relative;
width: 60%;
}
.contact-wrap_info .title h1::after {
position: absolute;
content: '';
background-color: rgba(28, 28, 28, 0.3);
width: 80%;
min-width: 200px;
height: 1px;
top: 50%;
right: -70%;
transform: translateY(-50%);
}
.contact-wrap_info .title h3 {
margin-top: 45px;
}
.contact-wrap_info .form-content {
width: 90%;
max-width: 980px;
margin: 50px auto 0 auto;
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
}
.contact-wrap_info .form-content label {
padding: 0 0 15px 15px;
}
.contact-wrap_info .form-content label:last-child {
padding: 0 0 0 15px;
}
.contact-wrap_info .form-content label:last-child a {
border-bottom: 1px solid #1c1c1c;
padding-bottom: 5px;
}
.contact-wrap_info .form-content label span {
color: red;
}
.contact-wrap_info .form-content input:not([type="checkbox"]),
.contact-wrap_info .form-content textarea,
.contact-wrap_info .form-content select {
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
background-color: #FFFFFF;
height: 50px;
border: 1px solid rgba(0, 0, 0, 0.3);
padding: 0 10px;
width: 100%;
}
.contact-wrap_info .form-content textarea {
height: 200px;
}
.contact-wrap_info .form-content .button {
padding-top: 75px;
text-align: center;
transition: all .3s;
}
.contact-wrap_info .form-content .button input {
transition: all .3s;
}
.contact-wrap_info .form-content .button input:hover {
background-color: #FAFAFA;
color: #1c1c1c;
border: 1px solid #1c1c1c;
}
.contact-wrap_info .form-content input[type="submit"] {
background-color: #1c1c1c;
color: #FAFAFA;
padding: 15px 0;
max-width: 300px;
width: 100%;
border: 0;
border-radius: 100px;
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
-ms-border-radius: 100px;
-o-border-radius: 100px;
font-size: 18px;
height: auto;
cursor: pointer;
}
.contact-wrap_info .form-content .row {
display: flex;
flex-direction: column;
margin-top: 25px;
}
.contact-wrap_info .form-content .flex {
display: flex;
margin-top: 25px;
}
.contact-wrap_info .form-content .flex div {
display: flex;
flex-direction: column;
width: 50%;
}
.contact-wrap_info .form-content .flex div:nth-child(1) {
padding-right: 25px;
}
.contact-wrap_info .form-content .flex div:nth-child(2) {
padding-left: 25px;
} .wpcf7-not-valid-tip {
margin-top: 10px;
font-size: 0.8em !important;
}
.wpcf7-spinner {
display: none !important;
} .wpcf7 form.sent .wpcf7-response-output {
display: none;
}
.wpcf7-form.invalid .wpcf7-response-output {
display: none;
}
#wpcf7-modal {
display: none;
position: fixed;
height: 100%;
width: 100%;
top: 0;
left: 0;
justify-content: center;
align-items: center;
}
#wpcf7-modal__bg {
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
background: rgba(0, 0, 0, .5);
z-index: -1;
}
#wpcf7-modal__wrap {
background-color: #ffffff;
border-radius: 10px;
width: 50%;
height: 50vh;
max-width: 550px;
padding: 80px 20px;
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
text-align: center;
}
#wpcf7-modal__wrap p {
margin: 20px auto 50px auto;
width: 80%;
}
#wpcf7-modal__wrap a {
background-color: #D19826;
color: #FAFAFA;
font-weight: bold;
padding: 10px 100px;
border-radius: 50px;
} @media (max-width: 767px) {
.contact-wrap_info {
padding: 100px 25px;
} .contact-wrap_main-view {
flex-direction: column;
}
.contact-wrap_main-view div {
width: 100%;
}
.contact-wrap_main-view .img {
height: 310px;
}
.contact-wrap_main-view .content-catch {
padding: 50px 25px 0 25px;
text-align: center;
}
.contact-wrap_main-view .content-catch h1 {
border-bottom: none;
padding: 0;
}
.contact-wrap_main-view .content-catch h3 {
padding: 25px 0 50px 0;
}
.contact-wrap_main-view .content-catch p {
padding: 0;
} .contact-wrap_info {
padding: 100px 25px;
}
.contact-wrap_info .title h1::after {
content: none;
}
.contact-wrap_info .title h1 {
font-size: 30px;
width: 100%;
}
.contact-wrap_info .title h3 {
margin-top: 15px;
padding-left: 5px;
}
.contact-wrap_info .form-content {
width: 100%;
margin-top: 50px;
padding: 0;
}
.contact-wrap_info .form-content label {
padding: 0 0 8px 5px;
}
.contact-wrap_info .form-content input:not([type="checkbox"]),
.contact-wrap_info .form-content textarea,
.contact-wrap_info .form-content select {
height: 35px;
padding: 0 5px;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
}
.contact-wrap_info .form-content textarea {
height: 130px;
}
.contact-wrap_info .form-content .row {
margin-top: 15px;
}
.contact-wrap_info .form-content .flex {
flex-direction: column;
margin-top: 15px;
}
.contact-wrap_info .form-content .check {
flex-direction: row;
}
.contact-wrap_info .form-content .flex div {
width: 100%;
}
.contact-wrap_info .form-content .flex div:nth-child(1) {
padding-right: 0;
}
.contact-wrap_info .form-content .flex div:nth-child(2) {
padding-left: 0;
margin-top: 15px;
}
.contact-wrap_info .form-content .button {
padding-top: 45px;
}
.contact-wrap_info .form-content input[type="submit"] {
padding: 20px 0;
max-width: 340px;
border-radius: 100px;
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
-ms-border-radius: 100px;
-o-border-radius: 100px;
font-size: 14px;
height: auto;
} #wpcf7-modal__wrap {
width: 90%;
height: 50vh;
padding: 100px 20px;
}
#wpcf7-modal__wrap p {
width: 90%;
}
}