@charset "UTF-8";
@media(min-width: 751px){
  a[href^="tel:"]{
    pointer-events: none;
  }
}

:root {
  --header-height: 80px; /* デフォルト値 */
}
#service::before {
  content: "";
  display: block;
  height: var(--header-height);
  margin-top: calc(var(--header-height) * -1);
  visibility: hidden;
}

@media (max-width: 670px) {
    .globalHeader01 .globalMenu > div {
        margin-bottom: 100px;
    }
    .globalHeader01 .globalMenu > div > p a.icon:hover {
        background-color: transparent;
    }
}



/* header */
.globalHeader01 .globalMenu > div > p {
    padding-left: 0;
    padding-right: 0;
}
.globalHeader01 .globalMenu > div > p a {
    padding-left: 10px;
    padding-right: 10px;
}

.globalHeader01 .compLogo01 {
    z-index: 1;
}
@media screen and (min-width:1245px) {
    .globalHeader01 .compLogo01 {
        width: 1.8em;
        margin-top: -0.15em;
    }
	.globalHeader01 .globalMenu { max-width: 500000px; width: 100%; right: 0;}
	.globalHeader01 .globalMenu > div > p { float: none;}
}

.headContact {
    position: absolute;
    top: 0;
    height: 100%;
    right: 0;
    display: flex;
}

.headContact__tel {
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 0 2.7rem;
}
@media screen and (max-width:1244px) {
    .headContact__tel {
        display: none;
    }
}


.headContact__tel .__time {
    color: #fff;
    font-size: 1.2rem;
    text-align: justify;
    text-align-last: justify;
    margin-bottom: .5em;
}
.headContact__button {
    transition: 0.4s;
}
@media screen and (max-width:1244px) {
    .globalHeader01.active .headContact__button {
        display: none;
    }
}
@media (max-width: 850px) {
    .headContact__button {
        display: none;
    }
}
@media screen and (min-width: 671px) and (max-width: 850px) {
    .globalHeader01.topNav .globalMenu {
        width: calc(100% - 180px) !important;
    }
}

.headContact__button a {
    display: block;
    width: 1.05em;
    height: .8em;
    mask: url(../images/2025/headContact.svg) no-repeat center / contain;
    -webkit-mask: url(../images/2025/headContact.svg) no-repeat center / contain;
    background: #fff;
    transition: 0.4s;
}
.globalHeader01.active .headContact__button {
    background: #fff;
}
.globalHeader01.active .headContact__button a {
    background: #333;
}

.headContact img,
.headContact svg {
    display: block;
}

.globalHeader01 .globalMenu > div > p a {
    display: inline-flex;
    height: 100%;
    justify-content: center;
    align-items: center;
}
@media (max-width: 670px) {
    .globalHeader01 .globalMenu > div > p a {
        font-size: 22px;
        margin: 0.6em 0;
    }
    .globalHeader01 .globalMenu > div > p a strong {
        font-size: inherit;
        margin: 0;
    }
}
.globalHeader01 .globalMenu .contact {
    background: none;
}
@media (min-width: 671px) {
    .pc-flex-center {
        height: 100%;
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
    }
}


/* footer */
.globalFooter01 .inner {
    max-width: 1120px;
}
.globalFooter01 .logo {
    margin-left: 0;
}
.globalFooter01 nav:nth-of-type(1) {
    width: calc(100% - 1.38em);
    border-color: #b2b2b2;
}
.globalFooter01 nav:nth-of-type(1) dl {
    width: auto;
    padding-left: 0.28em;
    padding-right: 0.28em;
    border-color: #b2b2b2;
}
.globalFooter01 ul.double {
    display: grid;
    grid-template-columns: min-content min-content;
    justify-content: space-between;
    column-gap: 1.2em;
}
.globalFooter01 ul.double li:nth-of-type(2) {
    margin-top: 0;
}
.globalFooter01 nav:nth-of-type(1) dt * {
    white-space: nowrap;
}
.globalFooter01 nav:nth-of-type(1) dd > ul a {
    white-space: nowrap;
    vertical-align: middle;
}
@media (max-width: 1244px) {
    .globalFooter01 nav:nth-of-type(1) dl {
        padding-left: .14em;
        padding-right: .14em;
    }
    .globalFooter01 ul.double {
        justify-content: start;
    }
}
@media (max-width: 1000px) {
.globalFooter01 .inner { padding-top:0.52em; padding-bottom:0.52em;}
.globalFooter01 .logo { float:none; margin-left:auto; margin-right:auto;}
.globalFooter01 nav:nth-of-type(1) { float:none; width:calc(100% - 11px); margin-top:0.35em;margin-left: auto;margin-right: auto;}
}
@media (max-width: 660px) {
    .globalFooter01 nav:nth-of-type(1) dl {
        padding-left: 0;
        padding-right: 0;
    }
    .globalFooter01 nav:nth-of-type(1) dt {
        width: auto;
    }
    .globalFooter01 nav:nth-of-type(1) dd {
        margin-top: 0;
    }
    .globalFooter01 nav:nth-of-type(1) dd > ul {
        font-size: 1.4rem;
        margin-top: 0;
    }
    .globalFooter01 nav:nth-of-type(1) dd > ul a {
        padding-top: 0.207em;
        padding-bottom: 0.207em;
        display: inline-block;
    }
    .globalFooter01 ul.double {
        display: block;
    }
    .globalFooter01 ul.double li {
        display: inline-block;
    }
    .globalFooter01 nav:nth-of-type(1) dd li {
        padding-right: 1em;
        margin-top: 0;
    }
    .globalFooter01 nav:nth-of-type(1) dd li:before {
        display: none;
    }
    .globalFooter01 nav:nth-of-type(1) dd.__pp {
        width: calc(100% - 10em);
    }
}
@media (max-width: 400px) {
    .globalFooter01 nav:nth-of-type(1) dt {
        font-size: 1.6rem;
    }
    .globalFooter01 nav:nth-of-type(1) dd {
        width: calc(100% - 6.8em);
    }
    .globalFooter01 nav:nth-of-type(1) dd.__pp {
        width: calc(100% - 12em);
    }
}


.copy__text {
    font-family: "Oswald", serif;
    font-size: 1.6rem;
    font-weight: 500;
    color: #b1b1b1;

    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}
@media screen and (min-width:1245px) {
    .copy__text {
        font-size: 1.1rem;
    }
}


/* top */

.topMv {
    position: relative;
    width: 100%;
    height: 100vh;
}

.topMv__bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.scroll01 {
    z-index: 3;
}

.topPurpose {
    letter-spacing: 0.075em;
    padding-top: 1em;
    padding-bottom: .64em;
    background-color: #fff;
}
.topPurpose__title {
    font-weight: bold;
    text-align: center;
    font-size: 24px;
    line-height: 1.38;
    margin-bottom: .5em;
}
@media (min-width: 751px) {
    .topPurpose__title {
        font-size: 48px;
    }
}

.topWorks {
    border-bottom: none;
}

.container .mainNav li > a > * {
    opacity: 1;
}
.container .mainNav li img {
    opacity: .6 !important;
}
.container .mainNav li > a,
.container .mainNav li > a:hover  {
    padding-top: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

@media (max-width: 500px) {
    .container .mainNav li {
        height: 3em;
    }
    .container .mainNav li > a .text02 {
        line-height: 1.75;
    }
    .container .mainNav li > a .text02 br {
        display: inline;
    }
}



.columnList01 .column a span {
    letter-spacing: 0;
    margin-top: 0.5em;
}
.columnList01 .column a span.client {
    color: #4d4d4d;
    margin-top: 0;
    margin-bottom: 0.6em;
}
.columnList01 .column a strong {
    font-feature-settings: "palt";
}
@media (max-width: 670px) {
    .columnList01 .column a span.client {
        font-size: 12px;
    }
}


@media (max-width: 400px) {
    .projectList {
        padding-bottom: 2.7em;
    }
}

.contact {
    padding-top: 0;
    padding-bottom: 0;
}
.contact.basis_em50 {
    padding: .6em 0;
}

.contact .subTtl01 {
    line-height: 1.5 !important;
}

.contact__buttons {
    margin-top: 20px !important;
}

.contact__buttons .btn {
    width: 250px;
    height: 50px;
    max-width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
    font-size: 16px;
}
.contact__buttons .contactTel {
    font-size: 22px;
    font-weight: 600;
    margin-top: 0 !important;
}

.contactTelLead {
    margin-top: 0.5em;
    letter-spacing: 0.075em;
}
@media screen and (min-width:751px) {
    .contact.basis_em50 {
        padding: 1.6em 0;
    }
    .contact__buttons {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        max-width: 660px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 40px;
    }
    .contact__buttons .btn {
        width: 300px;
        height: 60px;
        font-size: 18px;
        margin-top: 0;
    }
    .contact__buttons .contactTel {
        font-size: 25px;
    }
}
@media screen and (max-width:750px) {
    .contact .btn:hover {
        border-color: #fff;
        background: transparent;
    }
    .contact .btn:active {
        border-color: #000;
        background: #000;
    }
}

/* service */
@media screen and (max-width:670px) {
    .container#works .catLinks01 li a {
        padding: .9em;
    }
}

/* works */
@media screen and (max-width:670px) {
    .projectList .tabSwitch li {
        /* padding: 0; */
        padding-top: 0.5em;
        padding-bottom: 0.5em;
        padding-left: 1.5em;
        padding-right: 1.5em;
    }
    .projectList .tabSwitch li:before {
        left: 0;
        top: 0.5em;
    }
    .projectList .tabSwitch br + li:before {
        display: none;
    }
    .projectList .tabSwitch li:after {
        left: 1.5em;
        right: 1.5em;
        top: 0.5em;
        bottom: 0.5em;
        width: auto;
        height: auto;
    }
}

/* contact */
.contactPage {
    padding-bottom: 1.5em;
}
.contactHead {
    padding-top: 1em;
    padding-bottom: 0.4em;
    background: #fff;
}
.contactHead__lead {
    margin-bottom: 1.5em;
}
.contactBody {
    width: calc(100% - 30px);
    max-width: 910px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 40px;
    position: relative;
}
.contactRequire {
    color: #ff0000;
    font-size: 66%;
}
.contactForm {
    display: grid;
    grid-template-columns: 1fr;
    gap: 4px;
    padding-top: 32px;
}
.contactForm__term {
    font-size: 16px;
    font-weight: 500;
}
.contactForm__desc {
    font-size: 14px;
    margin-bottom: 20px;
    position: relative;
    min-width: 0;
}

.contactForm small {
    display: block;
    font-size: 75%;
    margin-top: 0.2em;
}
.contactBody input {
    appearance: auto;
}
.contactForm input[type="text"] {
    font-size: 16px;
    border: none;
    width: 100%;
    padding: .5em .4em;
}
.contactForm textarea {
    font-size: 16px;
    border: none;
    width: 100%;
    padding: .5em .4em;
    resize: none;
}
.contactForm select {
    font-size: 16px;
    border: none;
    min-width: 12em;
    max-width: 100%;
    padding: .5em 2em .5em .4em;
    color: inherit;
    background: #fff;

    appearance: none;
    position: relative;

    background-image: url(../images/2025/select_arrow.svg);
    background-repeat: no-repeat;
    background-size: 8px auto;
    background-position: right 8px center;
}

.contactBody input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 16px;
    height: 16px;
    border: 1px solid #000;
    border-radius: 0;
    background-color: transparent;
    cursor: pointer;
    position: relative;
    vertical-align: middle;
    margin-right: 6px;
    margin-bottom: 0;
    margin-left: 0;
}
.contactBody input[type="checkbox"] + span {
    vertical-align: middle;
}
.contactBody input[type="checkbox"]::after {
    content: "";
    position: absolute;
    display: block;
    top: 2px;
    left: 5px;
    width: 3px;
    height: 7px;
    border: solid #000;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease, visibility 0s linear 0.2s;
}
.contactBody input[type="checkbox"]:checked::after {
    opacity: 1;
    visibility: visible;
}

.contactForm input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 16px;
    height: 16px;
    border: 1px solid #000;
    border-radius: 50%;
    background-color: transparent;
    cursor: pointer;
    position: relative;
    vertical-align: middle;
    margin-right: 6px;
}
.contactForm input[type="radio"] + span {
    vertical-align: middle;
}
.contactForm input[type="radio"]::before {
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #000;
    position: absolute;
    top: 2px;
    opacity: 0;
    visibility: hidden;
    left: 2px;
    transition: opacity 0.2s ease, visibility 0s linear 0.2s;
}
input[type="radio"]:checked::before {
    opacity: 1;
    visibility: visible;
}

.contactForm ::placeholder {
  color: #ccc;
}
.contactForm input[type="file"] {
    width: 300px;
    font-size: 14px;
    color: #999;
    margin-bottom: 1em;
    margin-top: 0.5em;
}
.contactForm input[type="file"]::file-selector-button {
  color: #000;
  width: 140px;
  height: 28px;
  border-radius: 14px;
  border: 1px solid currentColor;
  background: transparent;
  display: inline-block;
  margin-right: 20px;
  cursor: pointer;
  transition: .6s;
}
.contactForm input[type="file"]::file-selector-button:hover {
  background: #000;
  color: #fff;
}
.entryFile {
    position: relative;
    margin-top: 35px;
    padding-top: 35px;
    padding-bottom: 10px;
    margin-bottom: 30px;
}
.entryFile::before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background: radial-gradient(circle farthest-side, #777, #777 25%, transparent 25%, transparent);
    background-size: 4px;
    content: '';
    display: inline-block;
    height: 1px;
    width: 100%;
}
.entryFile::after {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: radial-gradient(circle farthest-side, #777, #777 25%, transparent 25%, transparent);
    background-size: 4px;
    content: '';
    display: inline-block;
    height: 1px;
    width: 100%;
}

@media screen and (min-width:671px) {
    .contactHead {
        background: transparent;
    }
    .contactBody::after {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        background: radial-gradient(circle farthest-side, #777, #777 25%, transparent 25%, transparent);
        background-size: 4px;
        content: '';
        display: inline-block;
        height: 1px;
        width: 100%;
    }
    .contactBody--thanks {
        padding-top: 0;
    }
    .contactBody--thanks::after {
        display: none;
    }
    .contactForm {
        grid-template-columns: 187px 1fr;
        gap: 40px;
        padding-top: 32px;
        margin-bottom: 64px;
    }
    .contactForm__term {
        font-weight: 400;
    }
    .contactForm__desc {
        font-size: 16px;
        margin-bottom: 0;
    }
    .contactForm__buttons {
        display: flex;
        justify-content: space-between;
        max-width: 560px;
        margin-left: auto;
        margin-right: auto;
    }
    .contactForm input[type="text"] {
        padding: .2em .4em;
    }
    .contactForm textarea {
        padding: .2em .4em;
    }
    .contactForm select {
        padding: .2em 2em .2em .4em;
    }
    .contactForm input[type="file"] {
        width: 380px;
        font-size: 16px;
        margin-top: 0;
    }
    .contactForm input[type="file"]::file-selector-button {
        width: 200px;
        height: 40px;
        border-radius: 20px;
        margin-right: 28px;
    }
    .entryFile {
        margin-top: -14px;
        padding-top: 40px;
        padding-bottom: 40px;
        margin-bottom: 55px;
    }
}
.mw_wp_form .contactForm .horizontal-item {
    margin-right: 1.6em;
    display: inline-block;
}
.mw_wp_form .contactForm .horizontal-item:last-of-type {
    margin-right: 0;
}
.mw_wp_form .contactForm .horizontal-item + .horizontal-item {
    margin-left: 0;
}
.moreBtn[disabled] {
  opacity: .3;
  pointer-events: none;
}
.mw_wp_form .contactForm .error {
    color: #ff0000;
    padding: .2em 0;
}

.mw_wp_form_confirm .input {
    display: none;
}
.mw_wp_form_input .confirm {
    display: none;
}
.mw_wp_form_confirm .text {
    background: #fff;
    min-height: 1.875em;
    padding: 0 .2em;
    overflow-wrap: anywhere; /* 収まらない場合に折り返す */
    word-break: normal; /* 単語の分割はデフォルトに依存 */
    line-break: strict; /* 禁則処理を厳格に適用 */
}
.mw_wp_form_confirm .moreBtn {
    margin-top: 0;
}
.mw_wp_form_complete .moreBtn {
    margin-top: 25px;
}
.mw_wp_form_confirm .mw-wp-form_file {
    margin-bottom: 1em;
}
@media screen and (max-width:670px) {
    .mw_wp_form_confirm .contactForm {
        margin-bottom: 0;
    }
    .mw_wp_form_confirm .contactForm__desc {
        padding: .2em;
    }
    .mw_wp_form_confirm .moreBtn {
        margin-top: 20px;
    }
    .mw_wp_form_complete .moreBtn {
        margin-top: 50px;
    }
}

.caution {
    display: block;
    padding-left: 1em;
    text-indent: -1em;
}

@media (max-width: 660px) {
    dl.contactForm ul {
        position: relative;
        bottom: 0;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

.contactForm input[type="file"].is-selected {
    color: transparent;
}
.contactForm input[type="file"].is-selected + .mwform-file-delete {
    display: none;
}

/* utility */
@media screen and (min-width:671px) {
    .sp {
        display: none;
    }
}
@media screen and (max-width:670px) {
    .pc {
        display: none;
    }
}
.text-center {
    text-align: center;
}
.text-red {
    color: #ff0000;
}
.underline {
    text-decoration: underline;
}
.font-semibold {
    font-weight: 600;
}
.font-regular {
    font-weight: 500;
}
.inline-block {
    display: inline-block;
}
.mb-1em {
    margin-bottom: 1em;
}

/* font-size */
.fontResize {
    font-family: 'Noto Sans JP', sans-serif;
    line-height: 1.75;
    letter-spacing: 0.075em;
}
.fontResize p,
.fontResize li {
    line-height: 1.75;
    letter-spacing: 0.075em;
}
.fontResize.container .mainTxt {
    line-height: 1.75;
    letter-spacing: 0.075em;
    font-feature-settings: "palt";
}
.mainLead {
    font-weight: 600;
    line-height: 1.75;
    letter-spacing: 0.075em;
    margin-bottom: 1em;
    font-feature-settings: "palt";
}
@media screen and (max-width:670px) {
    .fontResize.container .mainTxt {
        text-align: justify;
    }
    .fontResize .scroll01 {
        width: 42px;
        height: 76px;
    }
    .fontResize.container .mainTtl img {
        height: 0.4em;
    }
    .fontResize.container .mainTtl span {
        margin-top: .86em;
        margin-bottom: 1em;
    }
    .fontResize .fontSize10_16 {
        font-size:16px;
    }
    .fontResize .fontSize10_14 {
        font-size:14px;
    }
    .fontResize .fontSize12_18 {
        font-size: 14px;
    }
    .fontResize .fontSize14_18 {
        font-size: 16px;
    }
    .fontResize .topPurpose__title {
        font-size: 26px;
    }
    .fontResize .columnList01 .column a strong {
        line-height: 1.7;
        min-height: 3.4em;
        display: flex;
        align-items: center;
    }
}

.fontResize18 {
    font-size: 18px;
}
.fontResize12_14 {
    font-size: 12px;
}
.fontResize12_16 {
    font-size: 12px;
}
.fontResize14_14 {
    font-size: 14px;
}
.fontResize14_16 {
    font-size: 14px;
}
.fontResize16_18 {
    font-size: 16px;
}
.fontResize18_20 {
    font-size: 18px;
}
.fontResize18_24 {
    font-size: 18px;
}
.fontResize28_48 {
    font-size: 28px;
}
.fontResize15_23 {
    font-size: calc(15px + 0.0024vw);
}
@media screen and (min-width:671px) {
    .fontResize12_14 {
        font-size: 14px;
    }
    .fontResize12_16 {
        font-size: 16px;
    }
    .fontResize14_14 {
        font-size: 14px;
    }
    .fontResize14_16 {
        font-size: 16px;
    }
    .fontResize16_18 {
        font-size: 18px;
    }
    .fontResize18_20 {
        font-size: 20px;
    }
    .fontResize18_24 {
        font-size: 24px;
    }
    .fontResize28_48 {
        font-size: 48px;
    }
    .fontResize15_23 {
        font-size: 23px;
    }
}

.container#works .text03 {
    font-size: clamp(13px, 11.469px + 0.408vw, 16px);
}
.container#recruit .tabContents .tabConSec .tableRow:first-of-type .tableCell {
    padding-top: 30px;
}
.container#recruit .tabContents .tabConSec .tableCell {
    vertical-align: top;
    line-height: 23.8px;
}
.container#recruit .tabContents .tabConSec .tableCell:nth-child(2) {
    font-size: clamp(13px, 12.490px + 0.136vw, 14px);
}
.container#recruit .tabContents .tabConSec .tableCell .__em {
    font-size: 1.14em;
    line-height: 1.7;
    font-weight: 500;
}


.pageHeaderText {
    font-size: clamp(28px, 20.718px + 1.942vw, 58px);

    width: 95%;
    left: 2.5%;
    top: 50%;
    position: absolute;
    color: #fff;
    font-family: "Oswald", "Noto Sans JP";
    font-weight: 500;
    line-height: 1em;
    text-align: center;
    letter-spacing: 0.23em;
    margin-top: -0.5em;
}
@media (max-width:450px) {
    .pageHeaderText {
        margin-top:-0.55em;
        letter-spacing:0.15em;
    }
}
