html {
    font-size: 16px;
}

header {
    background-color: white;
    position: fixed;
    width: 100%;
    z-index: 1;
    font-size: 1rem;
    font-family: 游ゴシック, 'Noto Sans JP', sans-serif;
    box-shadow: 0 1px 10px rgb(0 0 0 / 20%);
}

.header-container {
    max-width: 960px;
    padding-top: 0.375rem;
    /*padding-top: 6px;*/
    min-height: 4rem;
}

.header-background {
    width: 100%;
    min-height: 4rem;
    /*min-height: 71px;*/
}

main {
    font-size: 1rem;
    font-family: 游ゴシック, 'Noto Sans JP', sans-serif;
    color: #707070;
}

footer {
    font-size: 1rem;
    font-family: 游ゴシック, 'Noto Sans JP', sans-serif;
}


.header-logo {
    background: url(/image/header-logo.svg) no-repeat;
    height: 50px;
    width: 250px;
}

.header-logo-sp {
    height: 10vw;
    width: 50vw;
    background-size: contain;
    margin-top: 1vw;
}

.header-logo:hover {
    cursor: pointer;
}

.list-group-item {
    border: 0;
    background-color: transparent;
    padding: 0.5rem 0.7rem;
}

.hamburger-menu {
    Z-index: 250;
}

.sp-nav {
    position: fixed;
    top: -100%;
    width: 100%;
    height: 500px;
    background-color: #dbdbdb;
    transition: all 0.5s;
    z-index: 200;
    font-size: xx-large;
    color: #3a3a3a;
    opacity: 95%;
    padding: 10vw;
    font-weight: 500;
}

.sp-nav-open {
    top: 0;
}

.header-menu {
    font-weight: bold;
    font-family: 游ゴシック, 'Noto Sans JP', sans-serif;
}

.header-link {
    position: relative;
    display: inline-block;
    text-decoration: none;
    color: #707070;
}

.header-link:hover {
    color: #707070;
    cursor: pointer;
}

.header-link::after {
    position: absolute;
    bottom: 1px;
    left: 0;
    content: '';
    width: 100%;
    height: 1px;
    background: #333;
    opacity: 0;
    visibility: hidden;
    transition: .3s;
}

.header-link:hover::after {
    bottom: -4px;
    opacity: 1;
    visibility: visible;
}

.header-link-sp {
    position: relative;
    display: inline-block;
    text-decoration: none;
    color: #3a3a3a;
}

.header-link-sp:hover {
    color: #3a3a3a;
}


.header-link-sp-underline {
    border-bottom: solid 1px #3a3a3a;
    padding-bottom: 4px;
}

.header-link-sp-underline-animation {
    animation-name: animation-underline;
    animation-duration: 300ms;
    animation-fill-mode: both;
}

@keyframes animation-underline {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}

.main-visual {
    background: url(/image/main.jpg) center no-repeat;
    background-size: cover;
    height: 51vw;
    max-height: 770px;
    color: white;
}

.main-visual-sp {
    min-height: 452px;
    background-size: 800px;
}

.display-3 {
    font-family: 'Noto Sans JP', sans-serif;
}

.display-3-sp {
    font-size: calc(1.2rem + 3.3vw)
}


.main-visual-text {
    font-weight: unset;
    margin-top: 70px;
    font-family: 'Josefin Sans', sans-serif;
}

.main-visual-text-sp {
    font-size: calc(0.3rem + 3.3vw)
}

.footer {
    background: url(/image/footer.jpg) center no-repeat;
    background-size: cover;
    height: 320px;
}

.footer-sp {
    height: 340px;
}

.container-main {
    max-width: 960px;
    padding-top: 100px;
    padding-bottom: 200px;
}

.container-title {
    max-width: 960px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.container-content {
    max-width: 960px;
    padding-top: 10px;
    padding-bottom: 200px;
}

.line-top {
    border-top: black;
}

.link-primary {
    color: #707070;
    cursor: pointer;
}

.link-primary:hover {
    text-decoration: none;
}


@media (min-width: 768px) {
    a[href^="tel:09059411494"] {
        pointer-events: none;
    }
}

.btn-primary {
    color: white;
    text-decoration: none;
    background: #B76300;
    border: none;
    width: 180px;
    height: 80px;
}

.btn-primary-sp {
    margin-top: 100px;
}

.btn-primary:hover {
    opacity: 0.5;
    background: #B76300;
    transition: opacity 200ms;
}


.btn-primary:disabled {
    background: #B76300;
    border-color: #B76300;
}

.btn-primary:active {
    background: #B76300;
    border-color: #B76300;
}


.business-title {
    position: relative;
    background: url(/image/icon-1.png) left no-repeat;
    background-size: 70px;
    height: 70px;
    margin-bottom: 2rem;
}

.business-title-text {
    position: absolute;
    top: 15px;
    left: 50px;
    font-size: 30px;
    font-weight: bold;
}

.business-title-sp {
    position: relative;
    background: url(/image/icon-1.png) left no-repeat;
    background-size: 70px;
    height: 70px;
    margin-bottom: 2rem;
}

.business-title-text-sp {
    position: absolute;
    top: 15px;
    left: 50px;
    font-size: calc(27px + 3 * (100vw - 375px) / 200);
    font-weight: bold;
}

.business-summary-item {
    margin-top: -2rem;
}

.business-summary-item-sp {
    margin-top: 5rem;
}

.company-info-top {
    margin-top: 50px;
    padding-top: 30px;
    padding-bottom: 30px;
}

.company-info {
    padding-top: 30px;
    padding-bottom: 30px;
}

.company-info.border-top {
    border-top: 0.5px #707070;
}

.company-info.border-bottom {
    border-bottom: 0.5px #707070;
}

.company-info-item {
    font-weight: bold;
    margin-bottom: 0;
}

.company-info-item-sp {
    font-size: 14px;
}

.footer-list-group-item {
    border: 0;
}

.footer-menu {
    font-family: 游ゴシック, 'Noto Sans JP', sans-serif;
    color: white;
}


.list-group-item-dark {
    color: white;
}


.footer-logo {
    background: url(/image/footer-logo.svg) no-repeat;
    min-height: 70px;
    width: 300px;
    margin-top: 40px;
}

.footer-logo-sp {
    min-height: 37px;
    width: 178px;
    margin-top: 10px;
}

.footer-link {
    color: white;
    text-decoration: none;
    cursor: pointer;
}

.footer-link:hover {
    color: white;
}

.footer-link-sp {
    font-size: calc(15px + 2 * (100vw - 375px) / 200);
}

.footer-sp-scroll {
    background: url(/image/footer-sp-scroll.svg) no-repeat;
    background-size: 40px;
    width: 40px;
    height: 40px;
    z-index: 200;
}


.form-check-label {
    margin-bottom: 14px;
}

.form-check-help {
    font-size: small;
    margin-bottom: unset;
}


.col-form-label {
    font-size: large;
    font-weight: bold;
}

.badge {
    margin-right: 10px;
}

.badge-hissu {
    background-color: white !important;
    color: #BF0000;
    border: solid 2px #BF0000;
}

.badge-ninni {
    background-color: white !important;
    color: #707070;
    border: solid 2px #707070;
}

.privacy-title {
    font-weight: bold;
    font-size: larger;
}

.privacy {
    list-style: none;
}


#philosophy {
    margin-top: -200px;
    padding-top: 200px;
}

#philosophy-sp {
    margin-top: -150px;
    padding-top: 150px;
    width: 50vw;
}

#business-summary {
    margin-top: -200px;
    padding-top: 200px;
}

#business-summary-sp {
    margin-top: -150px;
    padding-top: 150px;
    width: 50vw;
}

/* #company-info {
    margin-top: -200px;
    padding-top: 200px;
} */

#company-info-sp {
    margin-top: -150px;
    padding-top: 150px;
    width: 37vw;
}

.company-info-title {
    font-weight: bold;
}

.company-info-title-sp {
    margin-top: 200px;
}

.content-title {
    font-weight: bold;
}

.validation-msg {
    min-height: 1.5em;
    color: #BF0000;
    font-size: 12px;
    font-weight: bold;
}

.nc-int-icon-rotate {
    --animation-duration: 0.4s;
}

.nc-int-icon {
    position: relative;
}

.nc-int-icon-b {
    position: absolute;
    top: calc(50% - 0.5em);
    left: calc(50% - 0.5em);
    opacity: 0;
}

.nc-int-icon-rotate .nc-int-icon-a, .nc-int-icon-rotate .nc-int-icon-b {
    transition: opacity 0s calc(var(--animation-duration) / 2), transform var(--animation-duration);
    transform-origin: center center;
}

.nc-int-icon-rotate .nc-int-icon-b {
    transform: rotate(90deg) scale(0.6);
}

.nc-int-icon-state-b .nc-int-icon-a {
    opacity: 0;
}

.nc-int-icon-state-b .nc-int-icon-b {
    opacity: 1;
}

.nc-int-icon-rotate.nc-int-icon-state-b .nc-int-icon-a {
    transform: rotate(-90deg) scale(0.6);
}

.nc-int-icon-rotate.nc-int-icon-state-b .nc-int-icon-b {
    transform: rotate(0);
}

[x-cloak] {
    display: none !important;
}


.recruit-title {
    font-weight: bold;
}

.recruit-item {
    font-weight: bold;
    margin-bottom: 0;
}

.keyword {
    font-weight: bold;
}

h5 {
    font-weight: bold !important;
    font-size: 1.35rem !important;
}

section .recruitment_content {
    margin-top: 2rem;
}