@import url('https://fonts.cdnfonts.com/css/helvetica-neue-55?styles=30126,30124,15999,30130,15997');
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import "button-v2.css";

* {
    box-sizing: border-box;
}

#contactSection {
    padding: 141px 0px 107px 0px !important;
    background: url(../webp/contact-background.webp);
    background-size: cover;
    background-position: center;
    color: white;
    z-index: 1;
    position: relative;
}

#contactSection .section-title span {
    color: white;
    font-size: 40px;
    font-weight: 600;
    padding: 0px;
    line-height: 1em;
    margin-bottom: 0.5em;
}

.content-contact-section {
    border: none;
    text-align: center;
}

.content-contact-section .description {
    margin-bottom: 2rem;
    font-size: 16px;
    font-weight: 400;
}

.content-contact-section .contact-number-list {
    flex-wrap: wrap;
    min-width: 100%;
    justify-content: center;
    display: flex;
    margin: 0px -25px;
    margin-top: 0px;
}

.content-contact-section .contact-number-list>* {
    width: auto;
    padding: 0px 25px;
    margin-bottom: 25px;
}

.content-contact-section .contact-number .info {
    font-size: 22px;
    font-family: "jost",serif;
    text-transform: uppercase;
    line-height: 1.5em;
    margin-bottom: 0.5em;
}

.content-contact-section .contact-number-list .cta {
    width: 100%;
    margin-bottom: 25px;
}

.content-contact-section .contact-number-list {
    flex-wrap: wrap;
    width: 100%;
    max-width: 750px;
    margin: 0 auto;
}

.content-contact-section .contact-number {
    text-align: center;
}

.content-contact-section .contact-number .number {
    font-size: 36px;
    padding: 10px 0;
    line-height: 1em;
    border-top: 1px solid;
    border-bottom: 1px solid;
    font-family: "adobe-garamond-pro", serif;
    width: 326px;
}

.content-contact-section .contact-number .number .phone-number{
    color: #FFF;
    font-size: 36px;
    font-weight: 600;
}

.content-contact-section .contact-number .meta-info {
    font-size: 16px;
    margin-top: 0.7rem;
}

#contactSection a.button-v2.button-lg {
    font-size: 36px;
    text-align: center;
    justify-content: center;
    color: #003399;
    background: white;
    border: none;
    font-family: "adobe-garamond-pro", serif;
    font-weight: bold;
    padding: 30px 20px;
    border-radius: 0;
    width: 456px;
    height: 96px;
}

#contactSection a.button-v2.button-lg span{
    font-size: 36px;
}

.section-title {
    font-size: 48px;
    font-family: "adobe-garamond-pro", serif;
    font-weight: 600;
    position: relative;
    line-height: 1.2em;
    color: #222222;
    padding: 2rem 0rem;
    margin: 0px;
}

.section-tel{
    display: flex;
    justify-content: center;
    gap:30px;
}

.pc-non {
    display: none;
}

.remove-padding{
    padding: 0 !important;
}

.remove-margin{
    margin: 0 auto !important;
}

.margin-bottom{
    margin-bottom: 10px !important;
}

.text-align-center{
    text-align: center !important;
}

@media screen and (max-width: 860px) {

    #contactSection {
        padding: 83px 0px 61px 0px !important;
    }

    #contactSection .section-title>* {
        text-wrap: nowrap;
    }

    #contactSection .section-title span {
        font-size: 32px;
        line-height: 32px;
    }

    .content-contact-section .contact-number-list {
        max-width: 320px;
    }

    .content-contact-section .contact-number-list>* {
        width: 100%;
        padding: 0px;
        margin-bottom: 0px;
    }

    #contactSection a.button-v2.button-lg {
        width: 100%;
        height: max-content;
        padding: 22px 20px;
    }

    #contactSection .section-title {
        font-size: 32px;
    }

    #contactSection a.button-v2.button-lg span {
        font-size: 24px;
        line-height: 28px;
    }

    .content-contact-section .contact-number .info {
        font-size: 20px;
    }

    .content-contact-section .contact-number .meta-info {
        font-size: 14px;
    }

    .content-contact-section .contact-number {
        padding: 16px 24px;
        margin-bottom: 10px;
        border: 1px solid;
    }

    .content-contact-section .contact-number .number {
        font-size: 28px;
        padding: 5px 0;
        color: #FFF;
        line-height: 32px;
        max-width: 100%;
        width: 278px;
        margin: 0 auto;
    }

    .content-contact-section .contact-number .number .phone-number {
        color: #FFF;
        font-size: 28px;
        font-weight: 600;
    }

    .content-contact-section a[href^="tel:"] {
        color: inherit;
        text-decoration: none;
    }

    .section-tel {
        display: block;
    }

    .pc-non {
        display: block;
    }

    .margin-bottom{
        margin-bottom: 20px !important;
    }

}