:root {
--icon-arrow-right: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%3E%3Cpath%20d%3D%22M9.52%204.21s1.5%201.5%203.26%203.25c.29.29.29.77%200%201.06l-3.25%203.25A.72.72%200%20019%2012c-.41%200-.75-.34-.75-.75%200-.2.08-.38.22-.52l1.98-1.97h-6.7A.764.764%200%20013%208c0-.41.34-.75.75-.75h6.69L8.47%205.27a.742.742%200%20010-1.05.75.75%200%20011.05-.01z%22%2F%3E%3C%2Fsvg%3E");
--icon-arrow-b-right: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%3E%3Cpath%20d%3D%22M11.11%208.59c-1.97%201.97-3.65%203.66-3.65%203.66a.84.84%200%2001-.6.25c-.47%200-.84-.38-.84-.84%200-.22.09-.43.24-.59L9.33%208%206.26%204.93a.836.836%200%20010-1.18.88.88%200%2001.61-.25c.22%200%20.43.09.59.24%200%200%201.69%201.69%203.65%203.66.33.33.33.86%200%201.19z%22%2F%3E%3C%2Fsvg%3E");
--color-black: #221e1f;
--color-green: #43a700;
--color-white: #fff;
--color-indigo: #1270b3;
--color-red: #d93030;
--color-gray-pale: #e6e6e6;
--color-offwhite: #f7f6f4;
--color-olive: #a9a637;
--transition-duration: 0.15s;
--content-width-small: 88vw;
--content-width-medium: 88vw;
--content-width-large: 88vw;
--content-width-xlarge: 92vw;
--font-10: 10px;
--font-11: 11px;
--font-12: 11px;
--font-13: 12px;
--font-14: 13px;
--font-15: 13px;
--font-16: 14px;
--font-17: 14px;
--font-18: 15px;
--font-19: 16px;
--font-20: 16px;
--font-21: 17px;
--font-22: 18px;
--font-23: 18px;
--font-24: 19px;
--font-25: 19px;
--font-26: 20px;
--font-27: 21px;
--font-28: 21px;
--font-29: 22px;
--font-30: 23px;
--font-31: 23px;
--font-32: 24px;
--font-33: 24px;
--font-34: 25px;
--font-35: 26px;
--font-36: 26px;
--font-37: 27px;
--font-38: 28px;
--font-39: 28px;
--font-40: 29px;
--font-41: 29px;
--font-42: 30px;
--font-47: 33px;
}
@media (min-width: 1200px) {
:root {
--content-width-small: clamp(550px, 65.671641791vw, 880px);
--content-width-medium: clamp(665px, 79.4029850746vw, 1064px);
--content-width-large: clamp(700px, 83.5820895522vw, 1120px);
--content-width-xlarge: min(clamp(820px, 97.9104477612vw, 1312px), 90vw);
}
}
@media (min-width: 960px) {
:root {
--font-10: 10px;
--font-11: 11px;
--font-12: 12px;
--font-13: 13px;
--font-14: 14px;
--font-15: 15px;
--font-16: 16px;
--font-17: 17px;
--font-18: 18px;
--font-19: 19px;
--font-20: 20px;
--font-21: 21px;
--font-22: 22px;
--font-23: 23px;
--font-24: 24px;
--font-25: 25px;
--font-26: 26px;
--font-27: 27px;
--font-28: 28px;
--font-29: 29px;
--font-30: 30px;
--font-31: 31px;
--font-32: 32px;
--font-33: 33px;
--font-34: 34px;
--font-35: 35px;
--font-36: 36px;
--font-37: 37px;
--font-38: 38px;
--font-39: 39px;
--font-40: 40px;
--font-41: 41px;
--font-42: 42px;
--font-47: 47px;
}
} .c-contactForm {
color: var(--color-olive-900); line-height: 1.6;
}
.c-contactForm > .lead {
display: none;
margin-bottom: clamp(50px, 5.97vw, 80px);
}
.c-contactForm > .lead > .heading {
font-weight: 700;
font-size: clamp(1.75rem, 1.553rem + 0.84vw, 2.5rem);
line-height: 1.6;
text-align: center;
color: var(--color-green);
}
.c-contactForm > .lead > .text {
margin-top: 1.5em;
font-size: clamp(0.875rem, 0.776rem + 0.42vw, 1.25rem);
line-height: 1.8;
text-align: center;
}
.c-contactForm > .list > .item {
gap: 0.5em 0;
padding: 1.25em 0;
}
.c-contactForm > .list > .item.-combine {
border-top: none;
padding-top: 0;
}
.c-contactForm > .list > .item > .label {
font-weight: 700;
display: flex;
align-items: center;
gap: 0.5em;
}
@media (min-width: 768px) {
.c-contactForm > .list > .item > .label {
flex: 0 0 auto;
width: 18em;
padding: calc(0.875em + 1px) 0;
}
}
.c-contactForm > .list > .item > .label::before {
content: "";
display: inline-block;
width: 8px;
height: 8px;
background: var(--color-orange-350);
border-radius: 100%;
}
.c-contactForm > .list > .item > .label > .required {
margin-left: 1em;
font-size: var(--font-14);
color: var(--color-orange-500);
}
.c-contactForm > .list > .item > .control {
flex: 1 1 0%;
}
.c-contactForm > .list > .item > .control > .checkboxList > .item + .item {
margin-top: 0.5em;
}
.c-contactForm > .note {
max-width: 50em;
margin: clamp(40px, 4.776vw, 64px) auto 0;
font-size: var(--font-14);
line-height: 2;
}
.c-contactForm > .action {
margin-top: clamp(40px, 4.776vw, 64px);
text-align: center;
}
.c-contactForm > .action > .back {
margin-top: 1em;
}
.c-contactForm-controlSeparator {
display: block;
position: relative;
height: 100%;
padding: 0 0.5em;
}
.c-contactForm-controlSeparator::before {
content: "";
position: absolute;
top: 50%;
left: 50%;
height: 2em;
border-right: 1px solid var(--color-gray-pale);
transform: translate(-50%, -50%) rotate(25deg);
}
.mw_wp_form_preview .c-contactForm > .lead {
display: block;
}
@media (min-width: 768px) {
.mw_wp_form_preview .c-contactForm > .list > .item > .label {
padding: 0;
}
}
.mw_wp_form_preview .c-contactForm > .list > .item > .label > .required {
display: none;
} .c-formControl {
box-sizing: border-box;
display: block;
width: 100%;
margin: 0;
padding: 0.875em 1.25em;
background: white;
border: 2px solid #cabc97;
border-radius: 9px;
font: inherit;
font-size: var(--font-16);
line-height: 1.6;
color: inherit;
appearance: none;
}
.c-formControl:disabled {
cursor: not-allowed;
}
.c-formControl::placeholder {
opacity: 0.25;
}
textarea.c-formControl {
resize: vertical;
}
select.c-formControl {
padding-right: 2em;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='22' viewBox='0 0 30 22'%3e%3cpath fill='%23343a40' d='M15 22L0 0h30z'/%3e%3c/svg%3e");
background-repeat: no-repeat;
background-position: calc(100% - 0.75em) 50%;
background-size: 0.5em auto;
}
select.c-formControl[multiple],
select.c-formControl[size]:not([size="1"]) {
background-image: none;
}
.c-formControl.-auto {
display: inline-block;
width: auto;
max-width: 100%;
}
.c-formControl.-small {
font-size: var(--font-14);
}
.c-formControl.-xsmall {
font-size: var(--font-13);
}
.c-formControl.-narrow {
padding: 0.6875em 1.125em;
}
.c-formControl.-xnarrow {
padding: 0.5em 1em;
}
.c-formControl.-typeTermList {
min-width: 14em;
padding: 0.75em 1em;
font-size: var(--font-15);
} .mwform-checkbox-field > label {
display: inline-flex;
align-items: baseline;
}
.mwform-checkbox-field > label > input {
flex: 0 0 auto;
}
.mwform-checkbox-field > label > .mwform-checkbox-field-text {
flex: 1 1 0%;
} .c-btn {
position: relative;
display: inline-flex;
align-items: center;
margin: 0;
padding: 0;
background: transparent;
border: none;
border-radius: 0;
font: inherit;
line-height: 1;
text-decoration: none;
text-align: inherit;
vertical-align: middle;
white-space: nowrap;
color: inherit;
transition: opacity var(--transition-duration) ease;
}
button.c-btn,
[type="button"].c-btn,
[type="reset"].c-btn,
[type="submit"].c-btn {
appearance: none;
cursor: pointer;
}
.c-btn.-c-contactForm-submit,
.c-btn.-c-contactForm-back {
justify-content: center;
width: min(24em, 100%);
padding: 1.75em;
border-radius: 9999px;
font-weight: 700;
font-size: var(--font-18);
transition: background-color var(--transition-duration) ease;
}
.c-btn.-c-contactForm-submit {
background: var(--color-olive-100);
border: 1px solid var(--color-olive-700);
color: var(--color-olive-900);
box-shadow: 5px 5px 0 0 var(--color-olive-250);
transition: 0.2s ease;
}
.c-btn.-c-contactForm-submit:hover {
opacity: 1;
background: var(--color-orange-100);
box-shadow: 0 0 0 0 var(--color-olive-250);
transform: translate(5px, 5px);
}
.c-btn.-c-contactForm-back {
background: var(--color-black);
border: 1px solid var(--color-black);
color: var(--color-white);
}
.c-btn.-c-contactForm-back:hover {
background: var(--color-white);
border-color: var(--color-black);
color: var(--color-black);
} .t_c-typography {
--c-typography-elem-gap: 1em;
--c-typography-a-color: var(--color-indigo);
padding-top: clamp(4rem, 3.079rem + 3.93vw, 7.5rem);
padding-bottom: clamp(5rem, 3.684rem + 5.61vw, 10rem);
}
.c-typography {
font: inherit;
line-height: inherit;
color: inherit;
text-align: justify;
word-break: break-all;
}
.c-typography a:hover {
transition: color var(--transition-duration) ease;
color: var(--color-green);
} ._font-bold {
font-weight: 700 !important;
}
._font-2xlarge {
font-size: 1.5em !important;
}
._leading-xsmall {
line-height: 1.8 !important;
}
._text-center {
text-align: center !important;
}
._mt-6 {
margin-top: 3em !important;
} .c-btn.-typeA {
--c-btn-typeA-color: var(--color-green);
justify-content: center;
background: var(--color-white);
border-radius: 999px;
font-weight: 700;
font-size: var(--font-17);
line-height: 1.4;
text-align: center;
color: var(--color-green);
white-space: normal;
}
.c-btn.-typeA::before {
content: "";
opacity: 0.4;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: -4px;
background: var(--color-green);
border-radius: 999px;
pointer-events: none;
transition: opacity var(--transition-duration) ease;
}
.c-btn.-typeA > .inner {
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
min-height: 3.8em;
padding: 0.375em 3.5em 0.375em 2.75em;
background: var(--color-white);
border-radius: 999px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
transition: background-color var(--transition-duration) ease;
}
.c-btn.-typeA > .inner::before,
.c-btn.-typeA > .inner::after {
content: "";
position: absolute;
top: 50%;
right: 1.25em;
width: calc(1em + 5px);
aspect-ratio: 1 / 1;
transform: translateY(-50%);
transition: transform var(--transition-duration) ease;
}
.c-btn.-typeA > .inner::before {
background: var(--color-green);
border-radius: 100%;
}
.c-btn.-typeA > .inner::after {
background: var(--color-white);
mask: var(--icon-arrow-right) no-repeat 50% 50% / calc((1em + 5px) * 0.6);
}
.c-btn.-typeA:hover {
opacity: 1;
}
.c-btn.-typeA:hover::before {
opacity: 1;
}
.c-btn.-typeA:hover > .inner {
background-color: rgba(255, 255, 255, 0.95);
}
.c-btn.-typeA:hover > .inner::before,
.c-btn.-typeA:hover > .inner::after {
transform: translate(3px, -50%);
}
.c-btn.-typeA.-w-fixed {
width: min(28em, 100%);
} .-t_fs23{
font-size: var(--font-23);
}
.-t_pl{
padding-left: calc(0.9em / 2);
} .recruit-bnr{
border: 2px solid var(--color-olive);
}
.recruit-bnr>a{
transition: opacity .4s ease;
}
@media (hover : hover) {
.recruit-bnr>a:hover{
opacity: .65;
}
}