@charset "UTF-8";

/* ======================================== Common ======================================== */
/* ============================== html tags ============================== */
html {
    box-sizing: border-box;
    font-family: "TsukuGoPro-B-HelveticaNowTextMedium", "Noto Sans JP", "Arial", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Meiryo", sans-serif;
    font-size: 62.5%;
    font-weight: 400;
    scrollbar-width: none; /* Firefox */
}
html::-webkit-scrollbar {
    display: none;
}
*, *::before, *::after {
    box-sizing: inherit;
}
* {
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: "palt";
}
body {
    position: relative;
    font-size: 1.6rem;
    -webkit-text-size-adjust: 100%;
    color: #222;
    scrollbar-width: none; /* Firefox */
}
/* Chrome, Safari用 */
body::-webkit-scrollbar {
    display: none;
}
body.-fixed {
    overflow: hidden;
    position: fixed;
    width: 100%;
}
body.index {
    background: transparent;
}
body.page {
    background: #fff;
}
h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
}
a {
    cursor: pointer;
    text-decoration: none;
    color: inherit;
}
button {
    cursor: pointer;
    display: block;
    outline: none;
    display: block;
    padding: 0;
    border: none;
    border-radius: 0;
    margin: 0;
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
    background-color: transparent;
}
ul,
ol {
    padding: 0;
    margin: 0;
    list-style: none;
    caret-color: transparent;
    /* キャレットを非表示にする */
}
table {
    width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
}
tbody {
    display: block;
    width: 100%;
}
::-webkit-input-placeholder,
:-moz-placeholder {
    font-family: "TsukuGoPro-B-HelveticaNowTextMedium", "Noto Sans JP", "Arial", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Meiryo", sans-serif;
    font-family: sans-serif !important;
    font-weight: 600;
}
th,
td {
    text-align: left;
}
input,
textarea {
    box-sizing: border-box;
    display: block;
    width: 100%;
    padding: 0;
    border: unset;
    border-width: 0;
    background-color: transparent;
}
input[type="text" i] {
    padding: 0;
}
input:focus-visible,
textarea:focus-visible {
    outline: unset;
}
input:-webkit-autofill,
textarea:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #fff inset;
    -webkit-text-fill-color: #222;
}
/* input:-internal-autofill-selected {
    appearance: menulist-button;
    background-image: none !important;
    background-color: #fff;
    color: fieldtext !important;
} */
select {
    border-width: 0px;
}
/* ============================== End html tags ============================== */
/* ============================== Utility Classes ============================== */
/* display inline-block */
.display_ib {
    display: inline-block;
}
/* display inline-block */
.width_0 {
    display: inline-block;
    width: 0;
}
/* Display Utilities: Show/Hide on Devices */
/* 
- .pc / .tablet-sp:
- Default: .pc is visible, .tablet-sp is hidden.
- Below 1000px: .pc is hidden, .tablet-sp is visible.
*/
.pc {
    display: block;
}
.tablet-sp {
    display: none;
}
@media screen and (max-width: 1000px) {
    .pc {
        display: none !important;
    }
    .tablet-sp {
        display: block !important;
    }
}
/* 
- .pc-tablet / .sp:
- Default: .pc-tablet is visible, .sp is hidden.
- Below 750px: .pc-tablet is hidden, .sp is visible.
*/
.pc-tablet {
    display: block;
}
.sp {
    display: none;
}
@media screen and (max-width: 750px) {
    .pc-tablet {
        display: none !important;
    }
    .sp {
        display: block !important;
    }
}
/* text-align */
.text-align_right {
    text-align: right;
}
/* 打ち消し線（gray） */
.strikethrough {
    position: relative;
    text-decoration: line-through;
    color: #cccccc;
}
/* color */
.color-white {
    color: #fff;
}
:root {
    --blue: #004097;
}
.color-blue {
    color: var(--blue);
}
/* background-color */
.bgc-white {
    color: #fff;
}
/* ============================== End Utility Classes ============================== */
/* ============================== Helper Classes ============================== */
/* English Font Settings */
.en {
    letter-spacing: 0 !important;
}
.img,
.video {
    width: 100%;
    height: auto;
    object-fit: contain;
}
/* Container Helper: Layout Width */
:root {
    --wrapper-width: 85%;
    --wrapper-left-margin: 7.5%;
}
.wrapper {
	width: var(--wrapper-width);
    margin: 0 auto;
}
@media screen and (max-width: 1000px) {
    :root {
        --wrapper-width: 89%;
        --wrapper-left-margin: 5.5%;
    }
    .wrapper {
        width: var(--wrapper-width);
    }
}
/* text */
.text {
    font-size: 1.5rem;
    line-height: 2;
    letter-spacing: 0.075em;
}
.text + .text {
    padding-top: 3.5rem;
}
/* ----- responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .text + .text {
        padding-top: 3rem;
    }
}
.text-link {
    text-decoration: underline;
    opacity: 1;
    transition: opacity .3s;
}
@media (hover: hover) {
    .text-link:hover {
        opacity: .6;
    }
}
/* hover-animation opacity */
.hover-opacity {
    opacity: 1;
    transition: opacity .3s;
}
@media (hover: hover) {
    .hover-opacity:hover {
        opacity: .7;
    }
}
/* inview */
.inview {
    transform: translate(0, 5px);
    opacity: 0;
    transition: filter 1s, opacity 1s, transform 1s;
}
.inview.show {
    transform: translate(0, 0);
    opacity: 1.0;
}
/* ============================== End Helper Classes ============================== */
/* ============================== Common Component Classes ============================== */
/* ==================== Header ==================== */
.header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
    width: 20rem;
    height: 20rem;
    background-color: #fff;
    transition: width .3s, height .3s;
}
.header.-scroll {
    width: 12rem;
    height: 12rem;
}
.header__logo-area {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    opacity: 1;
    transition: margin .3s, opacity .2s;
}
@media (hover: hover) {
    a.header__logo-area:hover {
        opacity: .7;
    }
}
/* header-logo */
.header-logo {
    overflow: hidden;
    position: relative;
    display: flex;
    justify-content: center;
    width: 100%;
    height: 11.1rem;
    transition: height .3s;
}
.header.-scroll .header-logo {
    height: 6rem;
}
.header-logo__img {
    position: relative;
    z-index: 0;
    display: inline-block;
    width: 44%;
    transition: width .3s;
}
.header-logo__img::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    transition: height .3s;
}
.header.-scroll .header-logo__img {
    width: 53%;
}
/* ダミー要素は画面に影響を与えないようにしておく */
#scroll-trigger {
    position: absolute;
    top: 100px;
    width: 100%;
    height: 1px;
}
/* -------------------- Header responsive (1000) -------------------- */
@media screen and (max-width: 1000px) {
    .header {
        width: 10rem;
        height: 10rem;
    }
    .header.-scroll {
        width: 8rem;
        height: 8rem;
    }
    /* header-logo */
    .header-logo {
        height: 6.2rem;
    }
    .header.-scroll .header-logo {
        height: 4.2rem;
    }
    .header-logo__img {
        width: 48%;
    }
    .header.-scroll .header-logo__img {
        width: 55%;
    }
}

/* ==================== End Header ==================== */
/* ==================== Hamburger Button ==================== */
.hamburger-button {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 8rem;
    height: 8rem;
    background-color: #444444;
    transition: background-color .4s;
}
.hamburger-button.-open {
    background-color: transparent;
}
.hamburger-button__line-base {
    position: relative;
    width: 3.2rem;
    height: 0.9rem;
    transition: top .46s, right .46s;
}
.hamburger-button__line {
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #fff;
    transition: background-color .3s;
}
.hamburger-button.-open .hamburger-button__line {
    background-color: #222;
}
.hamburger-button__line.--1 {
    top: 0;
}
.hamburger-button__line.--2 {
    bottom: 0;
}
@keyframes menu-open-top {
    0% {
        top: 0;
        transform: translateY(-50%);
    }
    60% {
        top: 50%;
        transform: translateY(-50%);
    }
    100% {
        top: 50%;
        transform: translateY(-50%) rotate(45deg);
    }
}
@keyframes menu-open-bottom {
    0% {
        bottom: 0;
        transform: translateY(50%);
    }
    60% {
        bottom: 50%;
        transform: translateY(50%);
    }
    100% {
        bottom: 50%;
        transform: translateY(50%) rotate(-45deg);
    }
}
@keyframes menu-close-top {
    0% {
        top: 50%;
        transform: translateY(-50%) rotate(45deg);
    }
    40% {
        top: 50%;
        transform: translateY(-50%);
    }
    100% {
        top: 0;
        transform: translateY(-50%);
    }
}
@keyframes menu-close-bottom {
    0% {
        bottom: 50%;
        transform: translateY(50%) rotate(-45deg);
    }
    40% {
        bottom: 50%;
        transform: translateY(50%);
    }
    100% {
        bottom: 0;
        transform: translateY(50%);
    }
}
/* -------------------- Hamburger Button responsive (1000) -------------------- */
@media screen and (max-width: 1000px) {
    .hamburger-button {
        width: 6rem;
        height: 6rem;
    }
    .hamburger-button__line-base {
        width: 2.8rem;
        height: 0.7rem;
    }
}
/* ==================== End Hamburger Button ==================== */
/* ==================== Hamburger Menu ==================== */
.hamburger-menu {
    overflow-y: auto;
    position: fixed;
    top: 0;
    right: 0;
    transform: translate(50%,0);
    z-index: 1000;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 52rem;
    height: 100dvh;
    border-bottom-left-radius: 2rem;
    background-color: #ffffff;
    opacity: 0;
    visibility: hidden;
    transition: transform .5s ease, opacity .5s, visibility .5s;
}
@media screen and (max-height: 560px) {
    .hamburger-menu {
        justify-content: start;
    }
}
.hamburger-menu.-open {
    transform: translate(0,0);
    opacity: 1;
    visibility: visible;
}
.hamburger-menu__inner {
    position: relative;
    z-index: 1;
}
.hamburger-menu__nav {
    overflow: hidden;
    padding: 8rem 7rem 11rem;
}
.hamburger-menu__list {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 3rem;
}
.hamburger-menu__item {
    display: inline-block;
    transform: translate(3rem,0);
    opacity: 0;
    transition: transform .1s ease .48s, opacity .1s ease .5s;
}
.hamburger-menu.-open .hamburger-menu__item:nth-child(1) {
    transition: transform .48s ease .1s, opacity .3s ease .1s;
}
.hamburger-menu.-open .hamburger-menu__item:nth-child(2) {
    transition: transform .48s ease .15s, opacity .3s ease .15s;
}
.hamburger-menu.-open .hamburger-menu__item:nth-child(3) {
    transition: transform .48s ease .2s, opacity .3s ease .2s;
}
.hamburger-menu.-open .hamburger-menu__item:nth-child(4) {
    transition: transform .48s ease .25s, opacity .3s ease .25s;
}
.hamburger-menu.-open .hamburger-menu__item:nth-child(5) {
    transition: transform .48s ease .3s, opacity .3s ease .3s;
}
.hamburger-menu.-open .hamburger-menu__item:nth-child(6) {
    transition: transform .48s ease .35s, opacity .3s ease .35s;
}

.hamburger-menu.-open .hamburger-menu__item {
    transform: translate(0);
    opacity: 1;
}
.hamburger-menu__link {
    position: relative;
    display: inline-block;
    white-space: nowrap;
    font-size: 4.5rem;
    line-height: 1.1;
    opacity: 1;
    transition: opacity .3s;
}
@media (hover: hover) {
    .hamburger-menu__link:hover {
        opacity: .5;
    }
}
.hamburger-menu__link.on::after {
    box-sizing: border-box;
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    display: block;
    width: calc(100% - 0.2rem);
    padding-top: 1px;
    background-color: #222;
    transition: transform .3s;
}
.hamburger-menu-escape {
    cursor: pointer;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
    display: block;
    width: 100vw;
    height: 100%;
    background-color: #222;
    opacity: 0;
    visibility: hidden;
    transition: opacity .55s, visibility .55s;
}
.hamburger-menu-escape.-open {
    visibility: visible;
    opacity: .4;
}
/* -------------------- Hamburger Menu responsive (1000) -------------------- */
@media screen and (max-width: 1000px) {
    .hamburger-menu {
        width: 86%;
        max-width: 32rem;
    }
    @media screen and (max-height: 560px) {
        .hamburger-menu {
            justify-content: center;
        }
    }
    @media screen and (max-height: 470px) {
        .hamburger-menu {
            justify-content: start;
        }
    }
    .hamburger-menu__nav {
        padding: 8rem 3.5rem 10rem;
    }
    .hamburger-menu__link {
        font-size: 3rem;
    }
    .hamburger-menu__link.on::after {
        width: calc(100% - 0.2rem);
    }
}
/* ==================== End Hamburger Menu ==================== */
/* ==================== Footer ==================== */
.footer {
    position: relative;
    padding: 6rem 0;
    background-color: #fff;
}
.footer__copyright {
    text-align: center;
    font-size: 1.2rem;
    color: #222;
}
/* -------------------- Footer responsive (1000) -------------------- */
@media screen and (max-width: 1000px) {
    .footer {
        padding: 4.4rem 0 4.5rem;
    }
    .footer__copyright {
        font-size: 1.1rem;
    }
}
/* ==================== End Footer ==================== */
/* ==================== Other Common Modules ==================== */
/* ===== common-logo-link ===== */
.common-logo-link {
    position: absolute;
    top: 5rem;
    left: 5rem;
    z-index: 10;
    display: inline-block;
    width: 12rem;
    opacity: 1;
    transition: opacity .3s;
}
@media (hover: hover) {
    .common-logo-link:hover {
        opacity: .7;
    }
}
/* ----- common-logo-link responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .common-logo-link {
        top: 3rem;
        left: 2rem;
        width: 8rem;
    }
}
/* ===== End common-logo-link ===== */
/* ===== common-scroll-link ===== */
.common-scroll-link {
    position: absolute;
    bottom: 4rem;
    right: 2%;
    z-index: 2;
    display: block;
    height: 10rem;
    padding-right: 1.4rem;
    writing-mode: vertical-lr;
    font-size: 1.4rem;
    font-weight: 400;
    color: #fff;
}
.common-scroll-link:before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 0.1rem;
    padding-top: 10rem;
    background-color: #fff;
    opacity: 0.2;
}
.common-scroll-link::after {
    content: '';
    position: absolute;
    right: 0;
    transform: translateX(50%);
    width: 0.1rem;
    background-color: #fff;
    animation: scroll-bar 4s ease infinite;
}
@keyframes scroll-bar {
    0% {
        height: 0;
        top: 0;
    }
    50% {
        height: 10rem;
        top: 0;
    }
    100% {
        height: 0;
        top: 10rem;
    }
}
/* ----- common-scroll-link responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .common-scroll-link {
        right: 2rem;
    }
}
/* ===== End common-scroll-link ===== */
/* ===== common-section-title ===== */
.common-section-title {
    font-size: 3rem;
    letter-spacing: 0.075em;
    line-height: 1.66;
}
/* ----- common-section-title responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .common-section-title {
        font-size: 2.1rem;
    }
}
/* ===== End common-section-title ===== */
/* ===== common-link-with-icon ===== */
.common-link-with-icon {
    position: relative;
    display: flex;
    gap: 1.5rem;
    width: fit-content;
    padding-right: 4.5rem;
}
.common-link-with-icon.--white {}
.common-link-with-icon__text {
    font-size: 2.5rem;
    color: #222;
}
.common-link-with-icon.--white .common-link-with-icon__text {
    color: #fff;
}
.common-link-with-icon__icon {
    overflow: hidden;
    position: absolute;
    top: 0;
    right: 0;
    transform: scale(1);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border: 1px solid #222;
    border-radius: 50%;
    background-color: transparent;
    transition: transform .4s, background-color .29s ease .1s;
}
@media (hover: hover) {
    a:hover .common-link-with-icon__icon,
    a.common-link-with-icon:hover .common-link-with-icon__icon,
    button.common-link-with-icon:hover .common-link-with-icon__icon {
        transform: scale(1.2);
        background-color: #222;
    }
}
.common-link-with-icon.--white .common-link-with-icon__icon {
    border: 1px solid #fff;
}
@media (hover: hover) {
    a:hover .common-link-with-icon .common-link-with-icon__icon,
    a.common-link-with-icon:hover .common-link-with-icon .common-link-with-icon__icon,
    button.common-link-with-icon:hover .common-link-with-icon .common-link-with-icon__icon {
        background-color: transparent;
    }
}
.common-link-with-icon__icon::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(calc(-50% - 1px), -50%) rotate(45deg);
    display: inline-block;
    width: 6px;
    height: 6px;
    border-top: 1px solid #222;
    border-right: 1px solid #222;
    transition: transform .2s ease .17s, opacity .2s .2s;
}
.common-link-with-icon.--white .common-link-with-icon__icon::before {
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
}
a:hover .common-link-with-icon__icon::before,
a.common-link-with-icon:hover .common-link-with-icon__icon::before,
button.common-link-with-icon:hover .common-link-with-icon__icon::before {
    transform: translate(10px, -50%) rotate(45deg);
    opacity: 0;
    transition: transform .3s ease, opacity .3s;
}
.common-link-with-icon__icon::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(calc(-20px - 1px), -50%) rotate(45deg);
    display: inline-block;
    width: 6px;
    height: 6px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    opacity: 0;
    transition: transform .2s, opacity .2s;
}
.common-link-with-icon.--white .common-link-with-icon__icon::after {}
a:hover .common-link-with-icon__icon::after,
a.common-link-with-icon:hover .common-link-with-icon__icon::after,
button.common-link-with-icon:hover .common-link-with-icon__icon::after {
    transform: translate(calc(-50% - 1px), -50%) rotate(45deg);
    opacity: 1;
    transition: transform .2s ease .15s, opacity .3s;
}

/* ----- common-link-with-icon responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .common-link-with-icon {
        gap: 1.5rem;
        padding-right: 4.5rem;
    }
    .common-link-with-icon.--white {}
    .common-link-with-icon__text {
        font-size: 2rem;
    }
    .common-link-with-icon__icon {
        top: -4px;
    }
}
/* ===== End common-link-with-icon ===== */
/* ===== common-page-title-area-without-bgi ===== */
.common-page-title-area-without-bgi {
    padding-top: 28rem;
}
/* ----- common-page-title-area-without-bgi responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .common-page-title-area-without-bgi {
        padding-top: 16rem;
    }
}
/* ===== End common-page-title-area-without-bgi ===== */
/* ===== common-page-title ===== */
.common-page-title {
    font-size: 6rem;
    font-weight: 600;
}
/* ----- common-page-title responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .common-page-title {
        font-size: 4rem;
    }
}
/* ===== End common-page-title ===== */
/* ===== common-table ===== */
.common-table {
    width: 100%;
    max-width: 88rem;
}
.common-table.--th-width15rem {}
.common-table__body {}
.common-table__tr {
    display: flex;
    width: 100%;
    padding: 1.3rem 0 1.6rem;
    border-top: 1px solid #222;
}
.common-table__tr:last-child {
    border-bottom: 1px solid #111;
}
.common-table__th {
    width: 15rem;
    padding-right: 1rem;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2;
}
.common-table.--th-width15rem .common-table__th {
    width: 15rem;
}
.common-table__td {
    width: calc(100% - 15rem);
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2;
}
.common-table.--th-width15rem .common-table__td {
    width: calc(100% - 15rem);
}
/* ----- common-table responsive (1000) ----- */
@media screen and (max-width: 1000px) {
.common-table {}
.common-table.--th-width15rem {}
.common-table__th {
    width: 12.5rem;
}
.common-table.--th-width15rem .common-table__th {
    width: 12.5rem;
}
.common-table__td {
    width: calc(100% - 12.5rem);
}
.common-table.--th-width15rem .common-table__td {
    width: calc(100% - 12.5rem);
}
}
/* ===== End common-table ===== */
/* ===== common-works ===== */
.common-works {}
.common-works__wrapper {
    /* wrapperと左端を揃える */
    padding: 0 var(--wrapper-left-margin);
}
.common-works__title {
    font-size: 5.5rem;
    line-height: 1.2;
}
.common-works__list-area {
    /* wrapperと左端を揃える */
    padding: 3.5rem 0 0 var(--wrapper-left-margin);
}
.common-works__link-wrap {
    padding: 4rem 0 0 0;
}
/* ----- responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .common-works {}
    .common-works__sec {
        padding: 5rem 0 8rem;
    }
    .common-works__wrapper {
        padding: 0 var(--wrapper-left-margin);
    }
    .common-works__title {
        font-size: 3.5rem;
        line-height: 1.2;
    }
    .common-works__list-area {
        padding: 3rem 0 0 var(--wrapper-left-margin);
    }
    .common-works__link-wrap {
        padding: 3.5rem 0 0 0;
    }
}
/* ===== End common-works ===== */
/* ===== common-works-archive ===== */
.common-works-archive {}
.common-works-archive__list {
    display: flex;
    flex-wrap: wrap;
}
/* common-works-archive-item  */
.common-works-archive-item {
    position: relative;
    width: calc(100% / 4);
}
.common-works-archive-item__link {
    position: relative;
    display: block;
}
.common-works-archive-item__img {
    overflow: hidden;
}
.common-works-archive-item__img > .img {
    transform: scale(1.01);
    transition: transform .31s;
}
.common-works-archive-item__link:hover .common-works-archive-item__img > .img {
    transform: scale(1.07);
}
.common-works-archive-item__cover {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    padding: 3.2rem 2rem 2rem;
    backdrop-filter: blur(0px);
    background-color: rgba(0,0,0,0);
    transition: backdrop-filter .29s linear, background-color .29s;
}
.common-works-archive-item__link:hover .common-works-archive-item__cover {
    backdrop-filter: blur(20px);
    background-color: rgba(0,0,0,0.15);
}
.common-works-archive-item__cover-inner {
    position: relative;
    height: 100%;
    opacity: 0;
    transition: opacity .3s;
}
.common-works-archive-item__link:hover .common-works-archive-item__cover-inner {
    opacity: 1;
}
.common-works-archive-item__date-and-category-wrap {
    padding-bottom: 0.5rem;
    font-size: 1.6rem;
    line-height: 1.8;
    color: #fff;
}
.common-works-archive-item__title {
    font-size: 2.1rem;
    line-height: 1.66;
    letter-spacing: 0.075em;
    color: #fff;
}
.common-works-archive-item__button-text {
    position: absolute;
    bottom: 0;
    right: 0;
    text-decoration: underline;
    text-underline-offset: 5px;
    font-size: 1.6rem;
    line-height: 1.8;
    color: #fff;
}
/* ----- common-works-archive responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .common-works-archive {}
    /* common-works-archive-item  */
    .common-works-archive-item {
        width: calc(100% / 2);
    }
    .common-works-archive-item__link::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
        display: block;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0);
        transition: background-color .3s;
    }
}
/* ----- common-works-archive responsive (750) ----- */
@media screen and (max-width: 750px) {
    .common-works-archive {}
    .common-works-archive-item__cover {
        display: none;
    }
}
/* ===== End common-works-archive ===== */
/* ===== common-category ===== */
.common-category {}
.common-category__list {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}
.common-category__link {
    position: relative;
    display: inline-block;
    padding-bottom: 0.8rem;
    font-size: 1.8rem;
    color: #aaaaaa;
    transition: .3s;
}
.common-category__link:hover {
    opacity: 0.7;
}
/* .common-category__link.-on, */
.common-category__link.active  {
    border-bottom:1px solid #222;
    color: #222;
}
/* ----- common-category responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .common-category__list {
        gap: 1.5rem 2rem;
    }
    .common-category__link {
        font-size: 1.5rem;
        padding-bottom: 0.5rem;
    }
}
/* ===== End common-category ===== */
/* ===== common-topics-archive ===== */
.common-topics-archive {}
.common-topics-archive__list {
    display: flex;
    flex-direction: column;
}
/* common-topics-archive-item */
.common-topics-archive-item {}
.common-topics-archive-item__link {
    display: flex !important;
    display: flex;
    flex-direction: column;
	width: 100%;
    padding: 3.6rem 0 4.2rem;
    border-bottom: 1px solid #eeeeee;
    opacity: 1;
    transition: opacity .3s;
}
.common-topics-archive-item:first-child .common-topics-archive-item__link {
    padding: 0 0 4.2rem;
}
@media (hover: hover) {
    .common-topics-archive-item__link:hover {
        opacity: .7;
    }
}
.common-topics-archive-item__title {
    overflow: hidden;
    position: relative;
    font-size: 3rem;
    line-height: 1.67;
    letter-spacing: 0.075em;
    color: #222222;
}
/* common-topics-archive-item-date */
.common-topics-archive-item-date {
    padding-top: 1rem;
    font-size: 1.4rem;
    color: #9b9b9b;
}
/* ----- common-topics-archive responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .common-topics-archive {}
    /* common-topics-archive-item */
    .common-topics-archive-item {}
    .common-topics-archive-item__link {
        padding: 2.2rem 0 3.2rem;
    }
    .common-topics-archive-item:first-child .common-topics-archive-item__link {
        padding: 0 0 3rem;
    }
    .common-topics-archive-item__title {
        font-size: 2rem;
    }
    /* common-topics-archive-item-date */
    .common-topics-archive-item-date {
        padding-top: 1.3rem;
    }
}
/* ===== End common-topics-archive ===== */
/* ===== pagination ===== */
.pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    font-family: "TsukuGoPro-B-HelveticaNowTextMedium", "Noto Sans JP", "Arial", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Meiryo", sans-serif;
    font-optical-sizing: auto;
    font-size: 1.8rem;
    line-height: 1.7;
}
.page-numbers {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 2rem;
    padding-bottom: 4px;
    color: #aaaaaa;
    opacity: 1;
    transition: opacity .3s;
}
.page-numbers.current {
    color: #222;
    opacity: 1;
}
a.page-numbers:hover {
    opacity: 0.7;
}
span.page-numbers::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 0);
    display: block;
    width: 10px;
    padding-top: 1px;
    background-color: #222;
}
/* ----- pagination responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .pagination {
        gap: 1rem;
    }
}
/* ===== End pagination ===== */
/* ==================== End Other Common Modules ==================== */
/* ============================== End Common Component Classes ============================== */
/* ======================================== End Common ======================================== */
/* ======================================== Pages ======================================== */
/* ==================== Home (Index) ==================== */
.home {
    background-color: transparent;
}
/* ========== loading ========== */
.loading {
    position: fixed;
    inset: 0;
    z-index: 10000;
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    opacity: 1;
    visibility: visible;
    transition: opacity 1s, visibility 1s;
}
.loading.-end {
    opacity: 0;
    visibility: hidden;
}
.loading__img {
    width: 7.2rem;
    animation: loading .8s linear infinite;
}
@keyframes loading {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }
}
/* ========== End loading ========== */
/* ========== home-kv ========== */
.home-kv {
    overflow: hidden;
    position: relative;
    background-color: transparent;
}
:root {
    --kv-height: 65vw;
    --kv-mim-height: 64rem;
    --kv-max-height: calc(100vh - 0rem);
}
.home-kv__video {
    position: relative;
    height: var(--kv-height);
    max-height: var(--kv-max-height);
}
.home-kv__video::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-image: linear-gradient( to left, rgba(0,0,0,0), rgba(0,0,0,0.3));
}
.home-kv__video > .video {
    position: fixed;
    inset: 0;
    z-index: -1;
    height: var(--kv-height);
    max-height: var(--kv-max-height);
    object-fit: cover;
}
.home-kv__button-area {
    position: absolute;
    bottom: 12rem;
    left: 0;
    z-index: 2;
    width: 100%;
}
/* ===== home-kv-button ===== */
.home-kv-button {
    display: flex;
    flex-direction: column;
    align-items: start;
    text-align: left;
}
.home-kv-button__icon {
    display: inline-block;
    width: 66px;
    height: 66px;
}
.home-kv-button__text-wrap {
    padding-top: 2rem;
}
.home-kv-button__text {
    color: #fff;
}
.home-kv-button__large-text {
    display: inline-block;
    font-size: 5rem;
    line-height: 1.18;
}
.home-kv-button__small-text {
    display: inline-block;
    padding: 0.6rem 0 0 1rem;
    font-size: 4.5rem;
    line-height: 1.11;
    letter-spacing: 0.075em;
}
/* ===== home-marquee ===== */
.home-marquee {
    overflow: hidden;
    box-sizing: border-box;
    position: relative;
    display: block;
    width: 100%;
    height: 4rem;
    white-space: nowrap;
    background-color: #fff050;
}
.home-marquee__strong-text {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 8rem;
    height: 4rem;
    font-size: 1.4rem;
    line-height: 4rem;
    color: #fff050;
    background-color: #222;
}
.home-marquee__text {
    display: inline-block;
    font-size: 1.4rem;
    line-height: 4rem;  
    color: #222;
}
/* ===== End home-marquee ===== */
/* ===== modal ===== */
.modal {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10000;
    width: 100%;
    height: 100dvh;
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s;
}
.modal.-open {
    opacity: 1;
    visibility: visible;
}
.modal__close-button {
    cursor: pointer;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    display: block;
    width: 8rem;
    height: 8rem;
    background-color: transparent;
}
.modal__close-button::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    transform: translate(-50%, -50%) rotate(45deg);
    display: block;
    width: 3.2rem;
    height: 1px;
    background-color: #fff;
}
.modal__close-button::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    transform: translate(-50%, -50%) rotate(-45deg);
    display: block;
    width: 3.2rem;
    height: 1px;
    background-color: #fff;
}
.modal__bg {
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    background-color: #222;
    opacity: 0.95;
}
.modal__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}
.modal__video {
    position: relative;
    z-index: 1;
    width: 87.5%;
    max-width: 100vmin;
}
.modal__video iframe {
    width: 100%;
    aspect-ratio: 16/9;
}
/* ===== End modal ===== */
/* ========== End home-kv ========== */
/* ========== home-intro ========== */
.home-intro {
    background-color: #fff;
}
.home-intro__sec {
    padding: 8rem 0 7.6rem;
}
.home-intro__link-wrap {
    padding-top: 4.2rem;
}
/* ========== End home-intro ========== */
/* ========== home-works ========== */
.home-works {
    background-color: #fff;
}
.home-works__sec {
    padding: 0 0 10rem;
}
/* ========== End home-works ========== */
/* ========== home-topics ========== */
.home-topics {
    background-color: #fff;
}
.home-topics__sec {
    padding: 0 0 11rem;
}
.home-topics__title {
    font-size: 5.5rem;
    color: #222;
}
.home-topics__list-area {
    max-width: 104rem;
    padding-top: 4.5rem;
}
.home-topics__link-wrap {
    margin-top: 4.4rem;
}
/* ========== End home-topics ========== */
/* ========== home-access ========== */
.home-access {}
.home-access__link {
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    z-index: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    min-height: 50vw;
    padding: 26rem 0 27rem;
}
@media screen and (min-width: 1700px) {
    .home-access__link {
        min-height: unset;
        height: 85rem;
    }
}
.home-access__title-area {
    position: relative;
    z-index: 1;
}
.home-access__title {
    font-size: 5.5rem;
    color: #fff;
}
.home-access__link-wrap {
    padding-top: 3rem;
}
.home-access__bgi {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
}
.home-access__bgi::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    background-image: linear-gradient( to left,rgba(0,0,0,0), rgba(0,0,0,0.3));
}
.home-access__bgi::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0);
    transition: background-color .3s;
}
.home-access__link:hover .home-access__bgi::after {
    background-color: rgba(0,0,0,0.5);
}
/* ========== End home-access ========== */
/* -------------------- Home (Index) responsive (1000) -------------------- */
@media screen and (max-width: 1000px) {
    /* ========== loading ========== */
    .loading {}
    /* ========== End loading ========== */
    /* ========== home-kv ========== */
    :root {
        --kv-height: 150vw;
    }
    .home-kv {}
    .home-kv__button-area {
        bottom: 9rem;
    }
    /* home-kv-button */
    .home-kv-button {}
    .home-kv-button__icon {
        width: 52px;
        height: 52px;
    }
    .home-kv-button__text-wrap {
        padding-top: 1.2rem;
    }
    .home-kv-button__large-text {
        font-size: 3.3rem;
        line-height: 1.28;
    }
    .home-kv-button__small-text {
        padding: 0.7rem 0 0;
        font-size: 3rem;
    }
    /* ===== modal ===== */
    .modal {}
    .modal__close-button {
        width: 6rem;
        height: 6rem;
    }
    .modal__close-button::before {
        width: 2.8rem;
    }
    .modal__close-button::after {
        width: 2.8rem;
    }
    .modal__video {
        width: 100%;
    }
    /* ===== End modal ===== */
    /* ========== End home-kv ========== */
    /* ========== home-intro ========== */
    .home-intro {}
    .home-intro__sec {
        padding: 4.2rem 0 6.5rem;
        border-bottom: 1px solid #eeeeee;
    }
    .home-intro__link-wrap {
        padding-top: 3.5rem;
    }
    /* ========== End home-intro ========== */
    /* ========== home-works ========== */
    .home-works {}
    .home-works__sec {
        padding: 5rem 0 8rem;
    }
    /* ========== End home-works ========== */
    /* ========== home-topics ========== */
    .home-topics {}
    .home-topics__sec {
        padding: 0 0 7.3rem;
    }
    .home-topics__title {
        font-size: 3.5rem;
    }
    .home-topics__list-area {
        padding-top: 4rem;
    }
    .home-topics__link-wrap {
        margin-top: 3.5rem;
    }
    /* ========== End home-topics ========== */
    /* ========== home-access ========== */
    /* ========== End home-access ========== */
}
/* ==================== End Home (Index) ==================== */
/* ==================== Company ==================== */
.company {}
/* ========== company-kv ========== */
.company-kv {
    overflow: hidden;
    position: relative;
    background-color: transparent;
}
.company-kv__img {
    position: relative;
    height: var(--kv-height);
    max-height: var(--kv-max-height);
}
.company-kv__img::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 37.5%;
    background-image: linear-gradient( to bottom,rgba(0,0,0,0), rgba(0,0,0,0.3));
}
.company-kv__img > .img {
    position: fixed;
    inset: 0;
    z-index: -1;
    height: var(--kv-height);
    max-height: var(--kv-max-height);
    object-fit: cover;
}
.company-kv__title-wrap {
    position: absolute;
    bottom: 8rem;
    left: 0;
    z-index: 2;
    width: 100%;
}
.company-kv__title {
    font-size: 6rem;
    color: #fff;
}
/* ========== End company-kv ========== */
/* ========== company-section ========== */
.company-section {
    padding: 8rem 0 9.5rem;
    background-color: #fff;
}
.company-section__inner {
    max-width: 88rem;
}
.company-section__texts {
    padding-top: 4rem;
}
.company-section__date-wrap {
    padding-top: 3rem;
    text-align: right;
}
/* ========== End company-section ========== */
/* ========== parallax ========== */
.parallax-unit {}
.parallax-frame {
    overflow: hidden;
    position: relative;
    background-color: #fff;
}
.parallax-visible-space {
    width: 100%;
    aspect-ratio: 1280 / 640;
}
.parallax-img {
    position: absolute;
    top: -15%;
    left: 0;
    display: block;
    width: 100%;
    height: 130%;
    object-fit: cover;
    transition: transform 0.6s ease-out;
    will-change: transform;
}
.parallax-img > .img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.parallax-img.--img1-object-position > .img {
    object-position: left;
}
@media screen and (max-width: 750px) {
    .parallax-visible-space {
        aspect-ratio: 300 / 250;
    }
    .parallax-img {
        top: -15%;
        height: 120%;
    }
    .parallax-img.--img1-object-position > .img {
        object-position: right;
    }
}
/* ========== End parallax ========== */
/* ========== company-works ========== */
.company-works {}
.company-works__sec {
    padding: 8rem 0 10rem;
    border-top: 1px solid #eeeeee;
    background-color: #fff;
}
/* ========== End company-works ========== */
/* ========== company-jobs ========== */
.company-jobs {}
.company-jobs__sec {
    padding: 9rem 0 8rem;
    background-color: #fff;
}
.company-jobs__img-area {
    max-width: 120rem;
    display: flex;
    justify-content: center;
    padding: 0;
    margin-top: 4.5rem;
    /* background-color: #eeeeee; */
}
.company-jobs__img {
    max-width: 100%;
}
/* ========== End company-jobs ========== */
/* ========== company-members ========== */
.company-members {}
.company-members__sec {
    padding-bottom: 7.3rem;
    background-color: #fff;
}
.company-members__sec + .company-members__sec {
    padding-bottom: 12rem;
}
.company-members__list-area {
    padding-top: 3.8rem;
}
.company-members__list {
    display: flex;
    flex-wrap: wrap;
    gap: 4rem 6%;
}
/* company-members-item */
.company-members-item {
    width: calc((100% - 6% * 2) / 3);
}
.company-members-item__img {
    width: 70%;
    max-width: 25rem;
    margin: 0 auto 3rem;
}
.company-members-item__title {
    font-size: 2rem;
    line-height: 1.75;
}
:root {
    --profile-text-fz: 1.4rem;
    --profile-text-lh: 2;
}
.company-members-item__position {
    font-size: var(--profile-text-fz);
    line-height: var(--profile-text-lh);
}
.company-members-item__texts {
    padding-top: 2rem;
}
.company-members-item__text {
    font-size: var(--profile-text-fz);
    line-height: var(--profile-text-lh);
}
.company-members-item__links {
    padding-top: 2rem;
}
.company-members-item__link {
    text-decoration: underline;
    font-size: var(--profile-text-fz);
    line-height: var(--profile-text-lh);
}
/* ========== End company-members ========== */
/* ========== company-info ========== */
.company-info {}
.company-info__sec {
    padding: 0 0 12.3rem;
    background-color: #fff;
}
.company-info__table-area {
    padding-top: 4rem;
}
/* ========== End company-info ========== */
/* -------------------- Company responsive (1000) -------------------- */
@media screen and (max-width: 1000px) {
    .company {}
    /* ========== company-kv ========== */
    .company-kv {}
    .company-kv__title-wrap {
        bottom: 5.5rem;
    }
    .company-kv__title {
        font-size: 4rem;
    }
    /* ========== End company-kv ========== */
    /* ========== company-section ========== */
    .company-section {
        padding: 4rem 0 5rem;
    }
    .company-section__texts {
        padding-top: 2rem;
    }
    .company-section__date-wrap {
        padding-top: 2.5rem;
    }
    /* ========== End company-section ========== */
    /* ========== company-works ========== */
    .company-works {}
    .company-works__sec {
        padding: 5rem 0 8rem;
    }
    /* ========== End company-works ========== */
    /* ========== company-jobs ========== */
    .company-jobs {}
    .company-jobs__sec {
        padding: 5.2rem 0 6rem;
    }
    .company-jobs__img-area {
        /* padding: 6.8rem 2rem 6.2rem; */
        max-width: 50rem;
        margin-top: 3rem;
    }
    /* ========== End company-jobs ========== */
    /* ========== company-members ========== */
    .company-members {}
    .company-members__sec {
        padding-bottom: 6rem;
    }
    .company-members__sec + .company-members__sec {
        padding-bottom: 6.5rem;
    }
    .company-members__list-area {
        padding-top: 3rem;
    }
    .company-members__list {
        gap: 3.2rem 6%;
    }
    /* company-members-item */
    .company-members-item {
        width: calc((100% - 6%) / 2);
    }
    .company-members-item__img {
        margin: 0 auto 2.4rem;
    }
    .company-members-item__title {
        font-size: 1.8rem;
    }
    .company-members-item__texts {
        padding-top: 2rem;
    }
    .company-members-item__links {
        padding-top: 2rem;
    }
    /* ========== End company-members ========== */
    /* ========== company-info ========== */
    .company-info {}
    .company-info__sec {
        padding: 0 0 7.5rem;
    }
    .company-info__table-area {
        padding-top: 3.3rem;
    }
    /* ========== End company-info ========== */
}
/* ==================== End Company ==================== */
/* ==================== Works ==================== */
.works {}
.works__category-area {
    padding-top: 4rem;
}
.works__list-area {
    padding: 8rem 0 12rem var(--wrapper-left-margin);
}
.works__pagination-area {
    padding: 8rem 0 0;
}
/* -------------------- Works responsive (1000) -------------------- */
@media screen and (max-width: 1000px) {
    .works {}
    .works__category-area {
        padding-top: 3rem;
    }
    .works__list-area {
        padding: 3.8rem 0 7rem var(--wrapper-left-margin);
    }
    .works__pagination-area {
        padding: 4rem 0 0;
    }
}
/* ==================== End Works ==================== */
/* ==================== Works Single ==================== */
.works-single {}
/* ========== works-single-slider ========== */
.works-single-slider {}
.works-single-slider__list {
    /* overflow: hidden; */
    /* display: flex; */
    padding: 0 0 1.2rem;
}
.works-single-slider__item {
    cursor: grab;
}
.works-single-slider__item:active {
    cursor: grabbing;
}
.is-single-slide .works-single-slider__item {
    cursor: auto;
}
.is-single-slide .works-single-slider__item:active {
    cursor: auto;
}
.works-single-slider__nav-area {
    padding: 2.4rem 3rem 0;
}
.swiper__dots-area {
    padding: 1.2rem 3rem 0;
}
/* works-single-slider swiper-dots */
/* 修正中 */
.works-single-slider .swiper-dots {
    display: flex;
    justify-self: end;
    width: 15rem;
    margin: 0 0 0 auto;
}
.works-single-slider .swiper-dots .swiper-dot {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 10px;
    font-size: 0;
    opacity: .2;
    transition: opacity .3s;
}
.works-single-slider .swiper-dots .swiper-dot::before {
    content: '';
    position: absolute;
    top: 2px;
    left: 0;
    display: inline-block;
    width: 100%;
    height: 1px;
    background-color: #222;
}
.works-single-slider .swiper-dots .swiper-dot.is-active {
    opacity: 1;
}
/*　End 修正中 */
/* ========== End works-single-slider ========== */
/* ========== works-single-intro ========== */
.works-single-intro {
    padding: 5.2rem 0 11.5rem;
}
.works-single-intro__inner {
    max-width: 88rem;
}
.works-single-intro__date {
    margin-bottom: -1rem;
    font-size: 1.6rem;
    line-height: 2;
}
.works-single-intro__title {
    font-size: 4.5rem;
    line-height: 1.4;
    padding-top: 1.5rem;
}
.works-single-intro__link-wrap {
    padding-top: 1.6rem;
}
.works-single-intro__texts-area {
    padding-top: 4.4rem;
}
.works-single-intro__texts-area p {
    font-size: 1.5rem;
    line-height: 2;
}
.works-single-intro__creators-area {
    padding-top: 4rem;
}
.works-single-intro__creator {
    font-size: 1.5rem;
    line-height: 2;
    color: #9b9b9b;
}
/* ========== End works-single-intro ========== */
/* ========== works-single-designs ========== */
.works-single-designs {
    padding: 10rem 0 11rem;
    background-color: #f5f5f3;
}
.works-single-designs__list {
    display: flex;
    flex-wrap: wrap;
    gap: 8rem;
}
.works-single-designs__list + .works-single-designs__list {
    padding-top: 8rem;
}
.works-single-designs__list.--2columns .works-single-designs__item {
    width: calc((100% - 8rem) / 2);
}
.works-single-designs__list.--4columns .works-single-designs__item {
    width: calc((100% - 8rem * 3) / 4);
}
.works-single-designs__item.--blank {
    background-color: #ececec;
}
/* ========== End works-single-designs ========== */
/* ========== works-single-other ========== */
.works-single-other {}
.works-single-other__sec {
    padding: 6.5rem 0 10rem;
}
.works-single-intro  + .works-single-other .works-single-other__sec {
    padding: 0 0 10rem;
}
/* ========== End works-single-other ========== */
/* -------------------- Works Single responsive (1000) -------------------- */
@media screen and (max-width: 1000px) {
    .works-single {
        padding-top: 10rem;
    }
    /* ========== works-single-slider ========== */
    .works-single-slider{}
    .works-single-slider__nav-area {
        padding: 1.5rem 2rem 0;
    }
    /* works-single-slider swiper-dots */
    .works-single-slider .swiper-dots {
        width: 12rem;
    }
    /* ========== End works-single-slider ========== */
    /* ========== works-single-intro ========== */
    .works-single-intro {
        padding: 1.8rem 0 5.5rem;
    }
    .works-single-intro__date {
        margin-bottom: -0.3rem;
        font-size: 1.5rem;
    }
    .works-single-intro__title {
        font-size: 2.8rem;
        line-height: 1.5;
        padding-top: 0.5rem;
    }
    .works-single-intro__link-wrap {
        padding-top: 1.2rem;
    }
    .works-single-intro__texts-area {
        padding-top: 3rem;
    }
    .works-single-intro__creators-area {
        padding-top: 2rem;
    }
    .works-single-intro__creator {
        font-size: 1.4rem;
    }
    /* ========== End works-single-intro ========== */
    /* ========== works-single-designs ========== */
    .works-single-designs {
        padding: 5rem 0 6rem;
    }
    .works-single-designs__list {
        gap: 2rem;
    }
    .works-single-designs__list + .works-single-designs__list {
        padding-top: 5.2rem;
    }
    .works-single-designs__list.--2columns .works-single-designs__item {
        width: calc((100% - 2rem) / 2);
    }
    .works-single-designs__list.--4columns .works-single-designs__item {
        width: calc((100% - 2rem * 3) / 4);
    }
    /* ========== End works-single-designs ========== */
    /* ========== works-single-other ========== */
    .works-single-other {}
    .works-single-other__sec {
        padding: 5rem 0 8rem;
    }
    .works-single-intro  + .works-single-other .works-single-other__sec {
        padding: 0 0 8rem;
    }
    /* ========== End works-single-other ========== */
}
/* ==================== End Works Single ==================== */
/* ==================== Topics ==================== */
.topics {
    padding-bottom: 12rem;
}
.topics__list-area {
    padding: 6rem 0 0;
}
.topics__pagination-area {
    padding: 7.5rem 0 0;
}
/* -------------------- Topics responsive (1000) -------------------- */
@media screen and (max-width: 1000px) {
    .topics {
        padding-bottom: 7rem;
    }
    .topics__list-area {
        padding: 3.5rem 0 0;
    }
    .topics__pagination-area {
        padding: 4rem 0 0;
    }
}
/* ==================== End Topics ==================== */
/* ==================== Topics Single ==================== */
.topics-single {}
.topics-single__inner {
    max-width: 72%;
}
.topics-single__title-area {
    padding: 26.5rem 0 8rem;
}
.topics-single__title {
    font-size: 4rem;
    line-height: 1.5;
}
.topics-single__date {
    padding-top: 2rem;
    font-size: 1.5rem;
    color: #9b9b9b;
}
.topics-single__contents {
    padding-bottom: 12rem;
}
.topics-single__archive-link-wrap {
    padding-top: 3rem;
}
/* ----- responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .topics-single {}
    .topics-single__inner {
        max-width: 100%;
    }
    .topics-single__title-area {
        padding: 15.2rem 0 4rem;
    }
    .topics-single__title {
        font-size: 2.8rem;
        line-height: 1.6;
    }
    .topics-single__date {
        padding-top: 1rem;
        font-size: 1.4rem;
    }
    .topics-single__contents {
        padding-bottom: 5rem;
    }
    .topics-single__archive-link-wrap {
        padding-top: 1rem;
    }
}
/* ==================== End Topics Single ==================== */
/* ==================== Thinking ==================== */
.thinking {}
/* ========== thinking-kv ========== */
.thinking-kv {
    overflow: hidden;
    position: relative;
    background-color: transparent;
}
.thinking-kv__img {
    position: relative;
    height: var(--kv-height);
    max-height: var(--kv-max-height);
}
.thinking-kv__img::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 37.5%;
    background-image: linear-gradient( to bottom,rgba(0,0,0,0), rgba(0,0,0,0.3));
}
.thinking-kv__img > .img {
    position: fixed;
    inset: 0;
    z-index: -1;
    height: var(--kv-height);
    max-height: var(--kv-max-height);
    object-fit: cover;
}
.thinking-kv__title-wrap {
    position: absolute;
    bottom: 8rem;
    left: 0;
    z-index: 2;
    width: 100%;
}
.thinking-kv__title {
    font-size: 6rem;
    color: #fff;
}
/* ========== End thinking-kv ========== */
/* ========== thinking-intro ========== */
.thinking-intro {
    padding: 8rem 0 9.5rem;
    background-color: #fff;
}
.thinking-intro__inner {
    max-width: 88rem;
}
.thinking-intro__texts {
    margin-bottom: 6rem;
}
/* ===== thinking-index ===== */
.thinking-index {
    background-color: #fff;
}
.thinking-index__title {
    font-size: 3.6rem;
}
.thinking-index__list-area {
    margin-top: 3rem;
}
.thinking-index__list {
    counter-reset: index-item;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.thinking-index__item {
    position: relative;
    padding-left: 1.5em;
    font-size: 1.6rem;
    line-height: 2;
    letter-spacing: 0.075em;
}
.thinking-index__item::before {
    content: counter(index-item) ". "; /* カウンター値を既定のスタイル（10 進数）で表示 */
    counter-increment: index-item;
    position: absolute;
    top: 0;
    left: 0;
    display: inline;
}
.thinking-index__link {
    text-decoration: underline;
}
/* ===== End thinking-index ===== */
/* ========== End thinking-intro ========== */
/* ========== thinking-section ========== */
.thinking-section {
    padding: 0 0 9.5rem;
    background-color: #fff;
}
.thinking-section__inner {
    max-width: 88rem;
}
.thinking-section__img {
    margin-bottom: 5.5rem;
}
.thinking-section__texts {
    padding-top: 4rem;
}
.thinking-section__date-wrap {
    padding-top: 3rem;
    text-align: right;
}
/* ========== End thinking-section ========== */
/* -------------------- Thinking responsive (1000) -------------------- */
@media screen and (max-width: 1000px) {
    .thinking {}
    /* ========== thinking-kv ========== */
    .thinking-kv {}
    .thinking-kv__title-wrap {
        bottom: 5.5rem;
    }
    .thinking-kv__title {
        font-size: 4rem;
    }
    /* ========== End thinking-kv ========== */
    /* ========== thinking-intro ========== */
    .thinking-intro {
        padding: 4rem 0 5.5rem;
    }
    .thinking-intro__inner {
        max-width: 88rem;
    }
    .thinking-intro__texts {
        margin-bottom: 6rem;
    }
    /* ===== thinking-index ===== */
    .thinking-index {}
    .thinking-index__title {
        font-size: 2.6rem;
    }
    .thinking-index__list-area {
        margin-top: 2.5rem;
    }
    .thinking-index__item {
        font-size: 1.5rem;
    }
    /* ===== End thinking-index ===== */
    /* ========== End thinking-intro ========== */
    /* ========== thinking-section ========== */
    .thinking-section {
        padding: 0 0 5rem;
    }
    .thinking-section__img {
        margin: 0 calc(-5.5% * 100 / 89) 4rem;
    }
    .thinking-section.--1 .thinking-section__img,
    .thinking-section.--6 .thinking-section__img {
        margin: 0 0 4rem;
    }
    .thinking-section__texts {
        padding-top: 2rem;
    }
    .thinking-section__date-wrap {
        padding-top: 2.5rem;
    }
    /* ========== End thinking-section ========== */
}
/* ==================== End Thinking ==================== */
/* ==================== Access ==================== */
.access {}
/* access-map */
.access-map {
    padding-top: 8rem;
}
.access-map__google-map-area {
    padding-left: 7.5%;
}
.access-map__google-map {
    width: 100%;
    height: 54rem;
}
.access-map__text-wrap {
    padding-top: 4rem;
}
/* contact */
.contact {
    padding-top: 4rem;
    margin-top: -4rem;
}
.contact__sec {
    max-width: 92rem;
    padding: 7rem 0 12rem;
}
.confirm .contact__sec {
    max-width: 92rem;
    padding: 6rem 0 12rem;
}
.contact__title {
    font-size: 4.5rem;
    line-height: 1.75;
}
.contact__form-area {
    padding-top: 3.5rem;
}
.confirm .contact__form-area {
    padding-top: 6.5rem;
}
/* form */
.contact form {}
.contact form table {
    width: 100%;
}
.contact form table tr {
    display: flex;
    padding: 13px 0 14px;
    align-items: flex-start;
    border-bottom: 1px solid #222;
}
.contact form table tr:first-child {
    border-top: 1px solid #222;
}
.contact form table tr th,
.contact form table tr td {
    font-family: "TsukuGoPro-B-HelveticaNowTextMedium", "Noto Sans JP", "Arial", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Meiryo", sans-serif !important;
    font-size: 1.5rem;
    line-height: 2;
}
.contact form table tr th {
    width: 215px;
    font-weight: 600;
}
.contact form table tr td {
    width: calc(100% - 215px);
}
.contact form input,
.contact form textarea,
.contact form label {
    font-family: "TsukuGoPro-B-HelveticaNowTextMedium", "Noto Sans JP", "Arial", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Meiryo", sans-serif !important;
    font-family: sans-serif !important;
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 2;
}
.contact form input,
.contact form textarea {
    border: none;
    background-color: transparent;
    width: 100%;
}
.contact form input[type="radio"] {
    display: none;
}
.contact form input[type="radio"]+label {
    display: inline-block;
    position: relative;
    padding-left: 30px;
    cursor: pointer;
}
.contact form label:not(:last-of-type) {
    margin-right: 45px;
}
.contact form input[type="radio"]+label::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    box-sizing: border-box;
    width: 18px;
    height: 18px;
    border: 1px solid #222;
    border-radius: 50%;
}
.contact form input[type="radio"]+label::after {
    content: '';
    display: block;
    position: absolute;
    left: 9px;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 7px;
    height: 7px;
    background: #222;
    border-radius: 50%;
    opacity: 0;
    transition: .2s;
}
.contact form input[type="radio"]:checked+label::after {
    opacity: 1;
}
.contact form textarea {
    height: 200px;
    resize: vertical;
}
.contact__button-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 5rem;
    padding-top: 5.5rem;
}
/* contact-button */
.contact-button {
    pointer-events: auto;
    display: inline-block;
    min-width: 26rem;
    padding: 1.6rem 2rem 2rem;
    border-radius: 9999px;
    text-align: center;
    text-decoration: none;
    font-size: 1.6rem;
    line-height: 1;
    color: #fff;
    background-color: #222;
    opacity: 1;
    transition: opacity .3s;
}
.contact-button:hover {
    opacity: .7;
}
.contact-button.--back {
    color: #fff;
    background-color: #888;
}
.contact__error {
    padding: 5rem 0 0;
}
.contact__error p {
    font-size: 1.5rem;
    line-height: 2;
}
/* -------------------- Access responsive (1000) -------------------- */
@media screen and (max-width: 1000px) {
    .access {}
    /* access-map */
    .access-map {
        padding-top: 4.5rem;
    }
    .access-map__google-map-area {
        padding-left: 5.5%;
    }
    .access-map__google-map {
        height: 30rem;
    }
    .access-map__text-wrap {
        padding-top: 2.7rem;
    }
    /* contact */
    .contact {}
    .contact__sec {
        padding: 4rem 0 5.5rem;
    }
    .confirm .contact__sec {
        padding: 4rem 0 5.5rem;
    }
    .contact__title {
        font-size: 3.5rem;
    }
    .contact__form-area {
        padding-top: 1.5rem;
    }
    .confirm .contact__form-area {
        padding-top: 3.5rem;
    }
    /* form */
    .contact form {}
    .contact form table tr {
        flex-direction: column;
        padding: 13px 0 14px;
        align-items: flex-start;
    }
    .contact form table tr th {
        width: 100%;
    }
    .contact form table tr td {
        width: 100%;
    }
    .contact form input[type="radio"]+label {
        padding-left: 25px;
    }
    .contact form label:not(:last-of-type) {
        margin-right: 25px;
    }
    .contact form input[type="radio"]+label::before {
        width: 16px;
        height: 16px;
    }
    .contact form input[type="radio"]+label::after {
        left: 8px;
        top: 50%;
        width: 6px;
        height: 6px;
    }
    .contact form textarea {
        height: 122px;
    }
    .contact__button-wrap {
        gap: 2rem;
        /* padding-top: 5.5rem; */
    }
    /* contact-button */
    .contact-button {
        width: 100%;
        min-width: unset;
    }
    .contact__error {
        padding: 5rem 0 0;
    }
    .contact__error p {
        font-size: 1.5rem;
        line-height: 2;
    }
}
/* ==================== End Access ==================== */
/* ==================== Error404 ==================== */
.error404 {}
.error404__contents-area {
    padding: 6rem 0 12rem;
}
.error404__link-wrap {
    padding: 5rem 0 0;
}
/* -------------------- Error404 responsive (1000) -------------------- */
@media screen and (max-width: 1000px) {
    .error404 {}
    .error404__contents-area {
        padding: 3.5rem 0 7rem;
    }
    .error404__link-wrap {
        padding: 4rem 0 0;
    }
}
/* ==================== End Error404 ==================== */
/* ======================================== End Pages ======================================== */