@charset "UTF-8";

html{
    font-size: 62.5%;
}

.f-size8,
span.text-s
{
    font-size: .8rem;
    display: block;
}


strong,
p.f-size12,
small{
    font-size: 1rem;
}


span.line,
p.header-sub01,
.about-button a{
    font-size: 1.2rem;
}


.link-tub a,
em{
    font-size: 1.4rem;
}


p.contact-text,
.contact-button a{
    font-size: 1.6rem;
}


.about-title,
.contact-title h2{
    font-size: 2.5rem;
}


p.header-sub02{
    font-size: 2rem;
}


.box-text-grid {
    grid-template-rows: 34px;
}

small{
    font-family: "DIN 2014", sans-serif;
}


@media screen and (min-width:750px) and (max-width:999px){
    span.f-size8{
        font-size: 0.9852216748768473vw;
        display: block;
    }

    strong,
    p.f-size12{
        font-size: 1.6420361247947455vw;
    }

    span.line,
    span.text-s{
        font-size: 2.2988505747126435vw;
    }

    span.text-s{
        display: inline-block;
    }

    .link-tub a{
        font-size: 2.6272577996715927vw;
    }

    small{
        font-size: 3.284072249589491vw;
    }

    em{
        font-size: 2.955665024630542vw;
    }

    p.header-sub01,
    .about-button a{
        font-size: 3.284072249589491vw;
    }

    p.contact-text{
        font-size: 4.433497536945813vw;
    }

    .contact-button a{
        font-size: 4.3999999999999995vw;
    }

    .about-title{
        font-size: 6.075533661740558vw;
    }

    p.header-sub02{
        font-size: 5.747126436781609vw;
    }

    .contact-title h2{
        font-size: 7.55336617405583vw;
    }

    .box-text-grid {
        grid-template-rows: 37px;
    }
}

@media screen and (min-width:1000px){
    span.f-size8{
        font-size: 0.5714285714285714vw;
        /* 8px */
    }

    strong,
    p.f-size12,
    small{
        font-size: 0.8571428571428572vw;
        /* 12px */
    }

    .link-tub a,
    span.line,
    span.text-s{
        font-size: 1vw;
        /* 14px */
    }

    em{
        font-size: 1.5714285714285716vw;
        /* 22px */
    }

    p.header-sub01,
    .about-button a{
        font-size: 1.1428571428571428vw;
        /* 1.6px */
    }

    p.contact-text{
        font-size: 1.9285714285714284vw;
        /* 27px */
    }

    .contact-button a{
        font-size: 2.6rem;
        /* 26px */
    }

    .about-title{
        font-size: 3.6rem;
        /* 37px */
    }

    p.header-sub02{
        font-size: 2.142857142857143vw;
        /* 30px */
    }

    .contact-title h2{
        font-size: 4rem;
        /* 40px */
    }
}