/*
Theme Name: TailPress Version 3
Theme URI: https://github.com/jeffreyvr/tailpress
Author: Jeffrey van Rossum
Author URI: https://vanrossum.dev
Description: TailPress is a simple boilerplate WordPress theme with Tailwind CSS.
Version: 3.4.8
License: MIT
License URI: https://github.com/jeffreyvr/tailpress/blob/master/LICENSE
Text Domain: tailpress
*/

@media (min-height: 32em) {
    html {
        scroll-padding-top: 100px;
    }
}
body {
    background-color: #FFF;
    font-family: "Noto Sans JP", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-size: 14px;
    line-height: 140%;
    word-break: auto-phrase;
    color: #282828;
}
a:hover {
    opacity: 0.8;
}
.icn-phone {
    -webkit-mask: url('img/icon/icn_phone.svg') no-repeat center / contain;
    mask: url('img/icon/icn_phone.svg') no-repeat center / contain;
    display: inline-block;
}
.icn-mail {
    -webkit-mask: url('img/icon/icn_mail.svg') no-repeat center / contain;
    mask: url('img/icon/icn_mail.svg') no-repeat center / contain;
    display: inline-block;
}

.custom-logo {
    width: 166px;
    height: auto;
}
.site-footer .custom-logo {
    width: 120px;
}

ol.breadcrumb {
    display: flex;
    align-items: center;
    gap: 16px;
    font-weight: 500;
    font-size: 13px;
    line-height: 16px;
    letter-spacing: 0.1em;
    color: #282828;
    margin-bottom: 32px;
}
ol.breadcrumb li {
    display: inline-flex;
    align-items: center;
    gap: 16px;
}
ol.breadcrumb li.item::after {
    content: ">";
    display: inline-block;
}
ol.breadcrumb li.item-last {
    color: rgba(40, 40, 40, 0.5);
}

.wpcf7-form .form-field {
    display: grid;
    grid-template-columns: 30% 70%;
    margin-bottom: 20px;
}
.wpcf7-form .form-field .field-right {
    max-width: 350px;
    width: 100%;
}
.wpcf7-form .form-field .field-name {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.wpcf7-form .form-field .field-address {
    max-width: none;
    display: grid;
    gap: 10px;
    font-weight: 700;
    font-size: 14px;
    line-height: 140%;
}
.wpcf7-form .form-field .field-address p {
    display: grid;
    gap: 5px;
}
.wpcf7-form .form-field .field-address .address-postcode {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-weight: 700;
    font-size: 18px;
    line-height: 140%;
}
.wpcf7-form .form-field .field-address .address-postcode input {
    width: 162px;
}
.wpcf7-form .form-field .field-address .address-prefecture {
    max-width: 350px;
    width: 100%;
}
.wpcf7-form .form-field .field-textarea {
    max-width: none;
}
.wpcf7-form .form-field .field-information {
    width: 100%;
    height: 72px;
    padding: 10px 5px 10px 20px;
    background: #FFFFFF;
    border: 1px solid rgba(40, 40, 40, 0.15);
    border-radius: 3px;
    overflow: auto;
}
.wpcf7-form .form-acceptance label {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}
.wpcf7-form .form-submit {
    text-align: center;
}
.wpcf7-form .form-submit p {
    display: inline-block;
    position: relative;
}
.wpcf7-form .form-submit .wpcf7-spinner {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}
.wpcf7-form input, .wpcf7-form select {
    box-sizing: border-box;
    padding: 10px 20px;
    width: 100%;
    height: auto;
    background: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 3px;
    font-weight: 500;
    font-size: 16px;
    line-height: 160%;
    color: rgb(40, 40, 40);
}
.wpcf7-form input[type="checkbox"] {
    width: 15px;
    height: 15px;
}
.wpcf7-form input[type="submit"] {
    width: 300px;
    height: auto;
    background-color: #3C996D;
    padding: 20px 0;
    border-radius: 50px;
    margin: 16px 0;
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
    color: #FFFFFF;
}
.wpcf7-form textarea {
    width: 100%;
    height: 176px;
    padding: 10px 20px;
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 3px;
    font-weight: 500;
    font-size: 16px;
    line-height: 160%;
}
.wpcf7-form label {
  display: block;
  font-weight: 700;
  font-size: 16px;
  line-height: 140%;
  padding-right: 20px;
  padding-top: 12px;
}
.wpcf7-form .required {
    padding: 3px 5px;
    background: #E40000;
    border-radius: 3px;
    font-weight: 700;
    font-size: 12px;
    line-height: 140%;
    color: #FFFFFF;
}
.wpcf7-form .non-required {
    padding: 3px 5px;
    background: #A8A8A8;
    border-radius: 3px;
    font-weight: 700;
    font-size: 12px;
    line-height: 140%;
    color: #FFFFFF;
}
.wpcf7-form .wpcf7-not-valid-tip, .wpcf7-form #form_postcode_error {
    font-size: 12px;
    font-weight: 400;
    color: #E40000;
}
.wpcf7-form .wpcf7-response-output {
    text-align: center;
    margin: 0!important;
}

@media screen and (max-width: 1024px) {
    .custom-logo {
        width: 100px;
        height: auto;
    }
}

#top_fv {
    width: 100%;
    height: 666px;
    background-image: url('img/top_fv.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
}
#top_fv .x3C_Group_x3E {
    padding: 75px 118px 86px;
    background-image: url('img/top_fv_bg_info.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center;
}
.top-cta .inner {
    clip-path: polygon(0 0, 100% 10%, 100% 90%, 0% 100%);
}
#top_contact.top-cta .inner {
    clip-path: polygon(0 0, 100% 4%, 100% 96%, 0% 100%);
}
#top_info_2 .inner-head {
    clip-path: polygon(0 0, 50% 12%, 100% 0, 100% 84%, 50% 100%, 0 84%);
}
#top_info_2 .inner-head h2::before {
    content: "・・・・";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-weight: 400;
}
#top_info_2 .inner-body {
    background-image: url('img/top_reason_bg.jpg');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center;
}

.mv-banner {
    width: 100%;
    height: 390px;
    background-image: url('img/page/page-banner.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
}
.mv-banner .inner {
    background-image: url('img/page/heading-bg.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: center;
}
.text-shadow-heading {
    text-shadow: -4px -4px 0px #FFE5C5, 4px -4px 0 #FFE5C5, -4px 4px 0 #FFE5C5, 4px 4px 0 #FFE5C5;
}
.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    font-weight: 700;
    font-size: 18px;
    line-height: 100%;
}
.pagination .page-numbers {
    border: 1px solid #3C996D;
    border-radius: 50px;
    width: 60px;
    height: 60px;
    text-align: center;
    align-content: center;
}
.pagination .page-numbers.current {
    background-color: #3C996D;
    color: #FFF;
}
.pagination .page-numbers.prev, .pagination .page-numbers.next {
    width: 120px;
}
@media screen and (max-width: 959px) {
    #top_fv {
        height: 420px;
    }
    #top_fv .x3C_Group_x3E {
        padding: 32px 118px 28px;
        background-image: url('img/top_fv_bg_info_sp.png');
    }
    .top-cta .inner {
        clip-path: polygon(0 0, 100% 4%, 100% 96%, 0% 100%);
    }
    #top_contact.top-cta .inner {
        clip-path: polygon(0 0, 100% 1%, 100% 99%, 0% 100%);
    }
    #top_info_2 .inner-head {
        clip-path: polygon(0 0, 50% 6%, 100% 0, 100% 84%, 50% 100%, 0 84%);
    }
}
@media screen and (max-width: 781px) {
    #top_fv .x3C_Group_x3E {
        padding: 32px 28px 28px;
    }
    #top_info_2 .inner-body {
        background-image: url('img/top_reason_bg_sp.jpg');
    }

    .wpcf7-form .form-field {
        grid-template-columns: repeat(1, minmax(0, 1fr));
        gap: 12px;
    }
    .wpcf7-form .form-field .field-address .address-postcode {
        gap: 5px;
    }
    .wpcf7-form label {
        padding: 0;
    }
    .wpcf7-form .form-field .field-name {
        gap: 5px;
    }
    .wpcf7-form input, .wpcf7-form select {
        padding: 10px;
    }
}