@charset "UTF-8";

body {
    font-family: "Noto Sans", serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
    font-variation-settings: "wdth"100;
    max-width: 1920px;
    width: 100%;
    margin: 0 auto !important;
    color: #1e1e1e;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
}

.ff-roboto-bold {
    font-family: "Roboto",
        sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
    font-variation-settings: "wdth"100;
}

.ff-roboto-black {
    font-family: "Roboto",
        sans-serif;
    font-weight: 900;
    font-style: normal;
    font-variation-settings: "wdth"100;
}

.ff-noto-r {
    font-family: "Noto Sans JP",
        sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

.ff-noto-m {
    font-family: "Noto Sans JP",
        sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
}

.ff-noto-b {
    font-family: "Noto Sans JP",
        sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

img,
svg {
    width: 100%;
}

.header-pc {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: clamp(1.25rem, 0.000rem + 2.604vw, 3.125rem);
    height: clamp(3.75rem, 2.840rem + 3.883vw, 7.5rem);
}

.site-title {
    display: flex;
    align-items: center;
    justify-content: start;
    width: clamp(31.661rem, 0.000rem + 65.96vw, 79.152rem);
}

.pc-tel {
    width: clamp(11rem, 0.000rem + 22.917vw, 27.5rem);
    background: #004098;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: clamp(0.75rem, 0.000rem + 1.563vw, 1.875rem);
    color: #fff;
    letter-spacing: 0.08em;
}

.pc-tel p {
    margin-bottom: 0;
}

.pc-tel .tel-number {
    font-size: clamp(1.1rem, 0.000rem + 2.292vw, 2.75rem);
    letter-spacing: 0.04em;
}

/* about us*/
section h2 {
    font-size: clamp(1rem, 0.000rem + 2.083vw, 2.5rem);
    letter-spacing: 0.025em;
    line-height: 1.75;
    color: #004098;
    border-bottom: 2px solid #004098;
}

section h2 span {
    font-size: clamp(0.75rem, 0.000rem + 1.563vw, 1.875rem);
    letter-spacing: 0;
    padding-left: 1em;
}

/* about us*/
.about {
    padding-top: clamp(2.75rem, 0.000rem + 5.729vw, 6.875rem);
    padding-bottom: clamp(2.25rem, 0.000rem + 4.688vw, 5.625rem);
}

.about-text p {
    font-size: clamp(0.5rem, 0.000rem + 1.042vw, 1.25rem);
    letter-spacing: 0.08em;
    line-height: 1.9;
}

.aboutus-img {
    width: clamp(15.5rem, 0.000rem + 32.292vw, 38.75rem);
    position: relative;
}

.profile {
    background: #cce5ff66;
    padding: clamp(2.375rem, 0.000rem + 4.948vw, 5.938rem) 0;
}

.profile h2 {
    margin-bottom: 1em;
}

.profile table {
    background: #fff;
    border-top: 2px solid #004098;
    border-bottom: 2px solid #004098;
    width: 100%;
    margin: 0 auto;
}

.profile table tr {
    min-height: clamp(1.25rem, 0.000rem + 2.604vw, 3.125rem);
}

.profile table tr:nth-child(2n+1) {
    /* background: #99bbdd33; デザインの通り*/
    background: #99bbdd77;
}

th.item-title {
    font-size: clamp(0.5rem, 0.000rem + 1.042vw, 1.25rem);
    letter-spacing: 0.01em;
    color: #004098;
    padding: clamp(0.375rem, 0.000rem + 0.781vw, 0.938rem) 0;
    padding-left: clamp(0.8rem, 0.000rem + 1.667vw, 2rem);
    vertical-align: top;
}

th.item-title-en {
    font-size: clamp(0.525rem, 0.000rem + 1.094vw, 1.313rem);
    letter-spacing: 0.01em;
    color: #004098;
    vertical-align: top;
    padding: clamp(0.375rem, 0.000rem + 0.781vw, 0.938rem) 0;
    padding-left: clamp(1.675rem, 0.000rem + 3.49vw, 4.188rem);
}

.profile td {
    font-size: clamp(0.5rem, 0.000rem + 1.042vw, 1.25rem);
    letter-spacing: 0.01em;
    line-height: 1.75;
    padding: clamp(0.375rem, 0.000rem + 0.781vw, 0.938rem) 0;
}

section.link-list {
    background: url(img/footer-bg-pc.jpg)no-repeat;
    background-size: cover;
    padding: clamp(2.375rem, 0.000rem + 4.948vw, 5.938rem) 0;
}

.link-item a {
    display: block;
    background: #004098;
    width: clamp(10rem, 0.000rem + 20.833vw, 25rem);
    height: clamp(4.15rem, 0.000rem + 8.646vw, 10.375rem);
    position: relative;
    font-size: clamp(0.8rem, 0.000rem + 1.667vw, 2rem);
    color: #fff;
    line-height: 1.5;
    text-decoration: none;
    padding-left: clamp(0.9rem, -0.000rem + 1.875vw, 2.25rem);
    padding-top: clamp(0.65rem, 0.000rem + 1.354vw, 1.625rem);
}

.link-item a::before {
    border: 1px solid #fff;
    width: clamp(9.5rem, 0.000rem + 19.792vw, 23.75rem);
    height: clamp(3.663rem, 0.000rem + 7.63vw, 9.156rem);
    position: absolute;
    content: '';
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.link-item a::after {
    background: url(img/arrow.svg)no-repeat;
    background-size: contain;
    width: clamp(8.165rem, -0.000rem + 17.01vw, 20.413rem);
    height: clamp(0.889rem, 0.000rem + 1.853vw, 2.223rem);
    position: absolute;
    content: '';
    left: 50%;
    top: clamp(2.531rem, -0.000rem + 5.272vw, 6.327rem);
    transform: translateX(-50%);
}

.link-item a:hover {
    background: #fff;
    color: #004098;
    opacity: .8;
}

.link-item a:hover::before {
    border-color: #004098;
}

.link-item a:hover::after {
    background: url(img/arrow-b.svg)no-repeat;
    background-size: contain;
}

.copyright {
    font-size: clamp(0.375rem, 0.000rem + 0.781vw, 0.938rem);
    letter-spacing: 0.16em;
    height: clamp(1.25rem, 0.000rem + 2.604vw, 3.125rem);
    display: flex;
    align-items: center;
    justify-content: center;
    background: #004098;
    color: #fff;
}

.copyright p {
    margin-bottom: 0;
}

/*メディアクエリ*/

@media(max-width:767px) {
    body {
        border: none;
    }

    header {
        position: fixed;
        width: 100%;
        background: #fff;
        z-index: 10;
    }

    .header-sp {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding-left: clamp(0.625rem, 0.029rem + 2.545vw, 1.25rem);
        height: clamp(3.75rem, 0.172rem + 15.267vw, 7.5rem);
        position: relative;
    }

    .site-title {
        width: clamp(16.688rem, 0.001rem + 71.196vw, 34.175rem);
    }

    /*ハンバーガーメニュー*/
    .menu {
        background: #004098;
        width: clamp(3.75rem, 0.172rem + 15.267vw, 7.5rem);
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /*navボタン*/
    .nav_toggle {
        display: block;
        position: relative;
        width: clamp(1.875rem, 0.086rem + 7.634vw, 3.75rem);
        height: clamp(1.375rem, 0.063rem + 5.598vw, 2.75rem);
    }

    .nav_toggle i {
        display: block;
        width: 100%;
        height: clamp(0.125rem, 0.006rem + 0.509vw, 0.25rem);
        background-color: #fff;
        position: absolute;
        transition: transform .5s, opacity .5s;
        border-radius: 5px;
    }

    .nav_toggle i:nth-child(1) {
        top: 0;
    }

    .nav_toggle i:nth-child(2) {
        top: 0;
        bottom: 0;
        margin: auto;
    }

    .nav_toggle i:nth-child(3) {
        bottom: 0;
    }

    /*navボタンクリック後*/
    .nav_toggle.show i:nth-child(1) {
        width: 100%;
        transform: translateY(clamp(0.625rem, 0.029rem + 2.545vw, 1.25rem)) rotate(-30deg);
    }

    .nav_toggle.show i:nth-child(2) {
        opacity: 0;
    }

    .nav_toggle.show i:nth-child(3) {
        width: 100%;
        transform: translateY(calc(-1 * clamp(0.625rem, 0.029rem + 2.545vw, 1.25rem))) rotate(30deg);
    }

    /*メニュー*/
    .nav {
        position: fixed;
        top: clamp(3.75rem, 0.172rem + 15.267vw, 7.5rem);
        left: 100%;
        width: 100%;
        padding-top: clamp(2.5rem, -0.005rem + 10.687vw, 5.125rem);
        padding-left: clamp(0.313rem, 0.000rem + 1.333vw, 0.64rem) !important;
        padding-right: clamp(0.313rem, 0.000rem + 1.333vw, 0.64rem);
        background: #fff;
        flex-direction: column;
        margin: 0;
        height: 100%;
        -webkit-transition: .5s ease-in-out;
        -moz-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
        overflow-y: scroll;
        z-index: 100;
    }

    .nav.show {
        left: 0%;
    }

    .nav ul {
        padding-left: 0;
        list-style: none;
        width: 100%;
    }

    .nav a {
        text-decoration: none;
    }

    ul.nav-menu-ul-01 {
        font-size: clamp(1.188rem, 0.000rem + 5.066vw, 2.432rem);
        padding: 0 clamp(0.938rem, 0.000rem + 4vw, 1.92rem);
        margin-bottom: clamp(6.25rem, -0.000rem + 26.667vw, 12.8rem);
    }

    ul.nav-menu-ul-01 a {
        color: #004098;
        letter-spacing: 0.1em;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: clamp(1.75rem, 0.000rem + 7.466vw, 3.584rem) 0;
    }

    ul.nav-menu-ul-01 a span {
        font-size: clamp(0.875rem, 0.000rem + 3.733vw, 1.792rem);
        color: #004098;
        letter-spacing: 0;
    }

    ul.nav-menu-ul-01 li {
        border-bottom: 1px solid #ccc;
    }

    ul.nav-menu-ul-01 li:first-child {
        border-top: 1px solid #ccc;
    }

    ul.nav-menu-ul-02 {
        padding: 0 clamp(0.938rem, 0.000rem + 4vw, 1.92rem);
    }

    ul.nav-menu-ul-02 a {
        font-size: clamp(1.188rem, 0.000rem + 5.066vw, 2.432rem);
        color: #004098;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: clamp(4.063rem, 7.133rem + -13.099vw, 0.845rem);
        border: 1px solid #004098;
        border-radius: clamp(0.625rem, 0.029rem + 2.545vw, 1.25rem);
    }

    ul.nav-menu-ul-02 li {
        margin-bottom: clamp(0.625rem, 0.029rem + 2.545vw, 1.25rem);
    }

    .sp-tel a {
        font-size: clamp(1.063rem, 0.049rem + 4.326vw, 2.125rem);
        letter-spacing: 0.08em;
        background: #004098;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: clamp(3.125rem, 0.143rem + 12.723vw, 6.25rem);
        border-radius: clamp(0.625rem, 0.029rem + 2.545vw, 1.25rem);
    }

    .sp-tel a .tel-number {
        font-size: clamp(1.563rem, 0.072rem + 6.361vw, 3.125rem);
        letter-spacing: 0.04em;
    }

    .first-view-img {
        padding-top: clamp(1.875rem, 0.086rem + 7.634vw, 3.75rem);
    }

    section h2 {
        font-size: clamp(1.375rem, -0.000rem + 5.868vw, 2.816rem);
    }

    .about {
        margin: 0 clamp(0.688rem, -0.000rem + 2.934vw, 1.408rem);
        margin-bottom: 0;
    }

    .about h2 {
        margin-bottom: 0.6em;
    }

    .about-text {
        margin-left: 0;
    }

    .about-text p {
        font-size: clamp(0.875rem, 0.040rem + 3.562vw, 1.75rem);
        letter-spacing: 0.12em;
        line-height: 1.78;
        margin-bottom: 1.5em;
    }

    .aboutus-img {
        width: 100%;
        margin: 0 auto;
        z-index: 1;
    }

    .profile h2 {
        margin-bottom: 0.3em;
    }

    .profile {
        padding: clamp(0.313rem, 0.000rem + 1.333vw, 0.64rem);
        padding-top: clamp(1.875rem, -0.208rem + 4.34vw, 5rem);
        padding-bottom: clamp(3.125rem, -0.000rem + 13.333vw, 6.4rem);
    }

    .profile table tr {
        height: auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        background: #99bbdd55;
    }

    th.item-title {
        font-size: clamp(1rem, 0.004rem + 4.249vw, 2.044rem);
        padding: clamp(0.5rem, 0.000rem + 2.133vw, 1.024rem);
        padding-left: 1em;
    }

    th.item-title-en {
        font-size: clamp(0.938rem, 0.000rem + 4vw, 1.92rem);
        letter-spacing: 0.01em;
        padding-right: clamp(1.125rem, -0.008rem + 4.835vw, 2.313rem);
        width: auto;
    }

    .profile td {
        font-size: clamp(0.938rem, 0.000rem + 4vw, 1.92rem);
        display: block;
        width: 100%;
        padding-bottom: 5px;
        background-color: #fff;
        line-height: 1.68;
        padding: clamp(0.5rem, 0.000rem + 2.133vw, 1.024rem);
        padding-left: clamp(1.125rem, -0.008rem + 4.835vw, 2.313rem);
        padding-right: clamp(1.063rem, -0.000rem + 4.534vw, 2.176rem);
    }

    .profile td ol {
        padding-left: clamp(1.125rem, -0.008rem + 4.835vw, 2.313rem);
    }

    section.link-list {
        background: url(img/footer-bg-sp.jpg) no-repeat;
        background-size: cover;
        padding: clamp(3.125rem, -0.000rem + 13.333vw, 6.4rem) 0;
    }

    .link-item a {
        width: clamp(18.75rem, 0.000rem + 80vw, 38.4rem);
        height: clamp(7.169rem, -0.000rem + 30.589vw, 14.682rem);
        font-size: clamp(1.438rem, 0.000rem + 6.132vw, 2.944rem);
        color: #fff;
        line-height: 1.35;
        padding-left: clamp(1.72rem, -0.000rem + 7.339vw, 3.523rem);
        padding-top: clamp(1.313rem, -0.000rem + 5.601vw, 2.688rem);
        margin: auto;
        margin-bottom: clamp(1.063rem, -0.000rem + 4.534vw, 2.176rem);
    }

    .link-list .col-md-4:last-child .link-item a {
        margin-bottom: 0;
    }

    .link-item a::before {
        width: clamp(17.75rem, 0.002rem + 75.725vw, 36.35rem);
        height: clamp(6.169rem, 0.002rem + 26.31vw, 12.631rem);
    }

    .link-item a::after {
        width: clamp(15.313rem, 0.000rem + 65.333vw, 31.36rem);
        height: clamp(1.667rem, 0.000rem + 7.115vw, 3.415rem);
        position: absolute;
        top: clamp(4.188rem, 0.001rem + 17.863vw, 8.575rem);
    }

    .copyright {
        font-size: clamp(0.563rem, 0.000rem + 2.4vw, 1.152rem);
        height: clamp(1.875rem, 0.000rem + 8vw, 3.84rem);
        letter-spacing: 0.06em;
    }

    .footer-tel-link {}

    .footer-tel-link a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 96%;
        height: clamp(3.125rem, 0.143rem + 12.723vw, 6.25rem);
        background: #004098;
        border-radius: clamp(0.625rem, 0.029rem + 2.545vw, 1.25rem);
        color: #fff;
        margin: clamp(0.313rem, 0.014rem + 1.272vw, 0.625rem) auto;
        text-decoration: none;
    }

    .footer-tel-link a span {
        font-size: clamp(1.188rem, 0.054rem + 4.835vw, 2.375rem);
        letter-spacing: 0.08em;
    }

    .footer-tel-link a span.tel-number {
        font-size: clamp(1.732rem, 0.082rem + 7.043vw, 3.462rem);
        letter-spacing: 0.04em;
    }
}