@charset "utf-8";

:root {
    --color-white: #FFFFFF;
    --color-black: #000000;
    --color-gray01: #888383;
    --color-gray02: #C6BEAC;
    --color-gray03: #343434;

    --font-a1: "A1 Gothic R", sans-serif;
    --font-pg: 'PostGrotesk';
}

body {
    position: relative;
    width: 100%;
    font-family: "PostGrotesk", "A1 Gothic R", sans-serif;
    color: var(--color-white);
    background: var(--color-black);
}

body.no-scroll {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
    overflow: hidden;
}

.l-main {
    overflow: hidden;
}

.f-a1 {
    font-family: var(--font-a1);
}
.f-pg {
    font-family: var(--font-pg);
}

.br-pc {
    display: block;
}
.br-tb,
.br-sp {
    display: none;
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .br-pc {
        display: none;
    }
    .br-tb {
        display: block;
    }
}
@media screen and (max-width: 767px) {
    .br-pc {
        display: none;
    }
    .br-sp {
        display: block;
    }
}

.a-fi {
    display: none;
}

.op0 {
    opacity: 0;
}

/*------------------------------
* common
------------------------------*/

.c-container_md {
    position: relative;
    width: 1200px;
    margin: 0 auto;
}
.c-container_sm {
    position: relative;
    width: 980px;
    margin: 0 auto;
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .c-container_md {
        width: 93.75%;
    }
    .c-container_sm {
        width: 76.563vw;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .c-container_md {
        width: 89.756%;
    }
    .c-container_sm {
        width: 76.564vw;
    }
}
@media screen and (max-width: 767px) {
    .c-container_md {
        width: 100%;
    }
    .c-container_sm {
        width: 84.267%;
    }
}

.c-sec__title {
    font-size: 25px;
    line-height: 1;
    font-weight: 700;
    color: var(--color-gray01);
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .c-sec__title {
        font-size: 1.954vw;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .c-sec__title {
        font-size: 2.44vw;
        line-height: 1.25;
    }
}
@media screen and (max-width: 767px) {
    .c-sec__title {
        font-size: 5.334vw;
        line-height: 1.25;
    }
}


.c-link {
    display: inline-block;
}
.c-link a {
    display: flex;
    position: relative;
    padding-left: 33px;
    font-size: 14px;
    line-height: 1.643;
    font-weight: 500;
    color: var(--color-white);
    text-decoration: none;
    cursor: pointer;
}
.c-link a::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 20px;
    height: 18px;
    background: url(../img/common/link-arrow.svg);
    background-repeat: no-repeat;
    background-size: contain;
}
.c-link.prev a::before {
    transform: translateY(-50%) rotate(180deg);
}
.c-link a[target="_blank"] {
    padding-right: 28px;
}
.c-link a[target="_blank"]::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 17px;
    height: 14px;
    background: url(../img/common/link-target.svg);
    background-repeat: no-repeat;
    background-size: contain;
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .c-link a {
        padding-left: 2.578vw;
        font-size: 1.094vw;
    }
    .c-link a::before {
        width: 1.563vw;
        height: 1.407vw;
    }
    .c-link a[target="_blank"] {
        padding-right: 2.188vw;
    }
    .c-link a[target="_blank"]::after {
        width: 1.329vw;
        height: 1.094vw;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .c-link a {
        padding-left: 4.025vw;
        font-size: 1.464vw;
        line-height: 1.917;
    }
    .c-link a::before {
        width: 1.83vw;
        height: 1.707vw;
    }
    .c-link a[target="_blank"] {
        padding-right: 3.415vw;
    }
    .c-link a[target="_blank"]::after {
        width: 2.074vw;
        height: 1.586vw;
    }
}
@media screen and (max-width: 767px) {
    .c-link a {
        padding-left: 8vw;
        font-size: 4.267vw;
        line-height: 1.438;
    }
    .c-link a::before {
        width: 4.534vw;
        height: 3.734vw;
    }
    .c-link a[target="_blank"] {
        padding-right: 7.467vw;
    }
    .c-link a[target="_blank"]::after {
        width: 4.534vw;
        height: 3.467vw;
    }
}

.c-mail {
    cursor: pointer;
}


/* loader */
.l-load {
    display: flex;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: var(--color-black);
    z-index: 990;
}
.l-load .p-load__line {
    margin: 30px 0;
}
.l-load .p-load__text {
    font-size: 11px;
    line-height: 1.455;
    font-weight: 300;
}
.l-load .p-load__text b {
    font-weight: 700;
    font-style: normal;
}
.l-load .p-load__text span {
    font-style: italic;
}
.l-load .p-load__brand {
    margin-top: 16px;
}
.l-load .p-load-bar {
    position: relative;
    margin-top: 80px;
    width: 100%;
    height: 1px;
    background: #888383;
}
.l-load .p-load-bar .p-load-bar__line {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background: var(--color-white);
    animation: bar-action 4s ease-in-out forwards;
}
@keyframes bar-action {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .l-load .p-load__line {
        margin: 2.344vw 0;
    }
    .l-load .p-load__text {
        font-size: 0.86vw;
    }
    .l-load .p-load__brand {
        margin-top: 1.25vw;
    }
    .l-load .p-load-bar {
        margin-top: 6.25vw;
        height: 1px;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .l-load .p-load__logo {
        width: 11.342vw;
        height: 6.829vw;
    }
    .l-load .p-load__line {
        margin: 3.171vw 0;
    }
    .l-load .p-load__text {
        font-size: 0.976vw;
        line-height: 1.5;
        transform: scale(0.8);
        transform-origin: 0 0;
    }
    .l-load .p-load__brand {
        margin-top: 2.927vw;
    }
    .l-load .p-load__brand img:nth-of-type(1){
        width: 5.366vw;
        height: 2.683vw;
    }
    .l-load .p-load__brand img:nth-of-type(2){
        width: 1.22vw;
        height: 2.683vw;
    }
    .l-load .p-load__brand img:nth-of-type(3){
        width: 7.317vw;
        height: 2.683vw;
    }
    .l-load .p-load-bar {
        margin-top: 12.195vw;
    }
}
@media screen and (max-width: 767px) {
    .l-load .p-load__content{
        width: 61.867vw;
        margin: 0 auto;
    }
    .l-load .p-load__logo img {
        width: 24.267vw;
        height: 14.667vw;
    }
    .l-load .p-load__line {
        margin: 7.467vw 0;
    }
    .l-load .p-load__text {
        font-size: 2.4vw;
        line-height: 1.556;
        transform: scale(0.9);
        transform-origin: 0 0;
    }
    .l-load .p-load__brand {
        margin-top: 5.334vw;
    }
    .l-load .p-load__brand img:nth-of-type(1){
        width: 10.667vw;
        height: 5.334vw;
    }
    .l-load .p-load__brand img:nth-of-type(2){
        width: 2.667vw;
        height: 5.334vw;
    }
    .l-load .p-load__brand img:nth-of-type(3){
        width: 14.934vw;
        height: 5.334vw;
    }
    .l-load .p-load-bar {
        margin-top: 30.934vw;
    }
}


/* header */
.l-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 40px 40px 28px;
    background: var(--color-black);
    z-index: 1000;
    box-sizing: border-box;
    animation: slideDown 0.6s ease-in-out;
}
@keyframes slideDown {
    0% {
      transform: translateY(-100%);
    }
    100% {
      transform: translateY(0%);
    }
  }
.l-header.__inactive {
    display: none;
    opacity: 0;
    visibility: hidden;
}
.l-header .g-header-left {
    display: flex;
    align-items: flex-end;
} 
.l-header .g-header__logo {
    -webkit-filter: brightness(1);
    filter: brightness(1);
} 
.l-header .g-header__logo img {
    width: 40px;
} 
.l-header .g-header__logo.active {
    -webkit-filter: brightness(0);
    filter: brightness(0);
} 
.l-header .g-header__text {
    margin-left: 28px;
    font-size: 10px;
    line-height: 1.4;
    font-weight: 300;
} 
.l-header .g-header__text b {
    font-weight: 700;
}
.l-header .g-header__text span {
    font-style: italic;
}
.l-header .g-menu__btn {
    position: relative;
    width: 43px;
    height: 23px;
    z-index: 10010;
    cursor: pointer;
}
.l-header .g-menu__btn .g-menu__line {
    position: relative;
    display: block;
    width: 43px;
    height: 1px;
    background: var(--color-white);
    transition: 0.4s;
}
.l-header .g-menu__btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 43px;
    height: 1px;
    background: var(--color-white);
    transform-origin: right;
    transition: 0.4s;
}
.l-header .g-menu__btn::after {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 22px;
    height: 1px;
    background: var(--color-white);
    transform-origin: right;
    transition: 0.4s;
}
.l-header .g-menu__btn[aria-expanded="true"] .g-menu__line {
    opacity: 0;
}
.l-header .g-menu__btn[aria-expanded="true"]::before {
    transform: rotate(-30deg);
    background: var(--color-black);
}
.l-header .g-menu__btn[aria-expanded="true"]::after {
    width: 43px;
    transform: rotate(30deg);
    background: var(--color-black);
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .l-header {
        padding: 3.125vw 3.125vw 2.188vw;
    }
    .l-header .g-header__logo {
        width: 3.125vw;
    }
    .l-header .g-header__text {
        margin-left: 2.188vw;
        font-size: 0.782vw;
    } 
    .l-header .g-menu__btn {
        width: 3.36vw;
        height: 1.797vw;
    }
    .l-header .g-menu__btn .g-menu__line {
        width: 3.36vw;
    }
    .l-header .g-menu__btn::before {
        width: 3.36vw;
    }
    .l-header .g-menu__btn::after {
        width: 1.719vw;
    }
    .l-header .g-menu__btn[aria-expanded="true"]::after {
        width: 3.36vw;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .l-header {
        padding: 5.244vw 4.878vw 3.537vw;
    }
    .l-header .g-header__logo {
        width: 4.878vw;
        height: 2.927vw;
    } 
    .l-header .g-header__text {
        margin-left: 3.659vw;
        font-size: 1.22vw; 
        line-height: 1.4;
    } 
    .l-header .g-menu__btn {
        width: 5.244vw;
        height: 2.805vw;
    }
    .l-header .g-menu__btn .g-menu__line {
        width: 5.244vw;
    }
    .l-header .g-menu__btn::before {
        width: 5.244vw;
    }
    .l-header .g-menu__btn::after {
        width: 2.683vw;
    }
    .l-header .g-menu__btn[aria-expanded="true"]::after {
        width: 5.244vw;
    }
}
@media screen and (max-width: 767px) {
    .l-header {
        padding: 6.4vw 8vw 5.867vw;
    }
    .l-header .g-header-left {
        display: flex;
        align-items: flex-end;
    } 
    .l-header .g-header__logo {
        position: relative;
        z-index: 10010;
    } 
    .l-header .g-header__logo img {
        width: 12.533vw;
        height: 7.467vw;
    } 
    .l-header .g-header__text {
        display: none;
    } 
    .l-header .g-menu__btn {
        width: 9.334vw;
        height: 5.867vw;
    }
    .l-header .g-menu__btn .g-menu__line {
        width: 9.334vw;
    }
    .l-header .g-menu__btn::before {
        width: 9.334vw;
    }
    .l-header .g-menu__btn::after {
        width: 5.867vw;
    }
    .l-header .g-menu__btn[aria-expanded="true"]::before {
        transform: translateY(1.5px) rotate(-30deg);
    }
    .l-header .g-menu__btn[aria-expanded="true"]::after {
        transform: translateY(-1.5px) rotate(30deg);
        width: 9.334vw;
    }
}


/* menu */
.l-menu__back {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 9990;
    width: 100%;
    height: 100vh;
    background: transparent;
    transition: 0.3s;
}
.l-menu__back.active{
    display: block;
}
.l-menu {
    display: none;
    /* display: flex; */
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100dvh;
    background: var(--color-gray02);
    z-index: 10000;
}
.l-menu .p-menu__content {
    position: relative;
    display: flex;
    align-items: flex-start;
}
.l-menu .p-menu__content .p-menu-detail {
    width: 50%;
}
.l-menu .p-menu__content .p-menu-detail .p-menu__logo {
    display: inline-block;
    filter: brightness(0);
}
.l-menu .p-menu__content .p-menu-detail .p-menu__line {
    margin: 25px 0;
    color: var(--color-black);
}
.l-menu .p-menu__content .p-menu-detail .p-menu__text {
    font-size: 11px;
    line-height: 1.455;
    font-weight: 300;
    color: var(--color-black);
}
.l-menu .p-menu__content .p-menu-detail .p-menu__text b {
    font-weight: 700;
    font-style: normal;
}
.l-menu .p-menu__content .p-menu-detail .p-menu__text span {
    font-style: italic;
}
.l-menu .p-menu__content .p-menu-detail .p-menu__brand {
    display: inline-flex;
    margin-top: 16px;
    gap: 0px 10px;
    filter: brightness(0);
}
.l-menu .p-menu__content .p-menu-nav {
    position: relative;
    width: 50%;
}
.l-menu .p-menu__content .p-menu-nav::before {
    content: "index";
    position: absolute;
    top: -6px;
    left: -48px;
    font-size: 10px;
    line-height: 2.223;
    font-weight: 300;
    color: var(--color-black);
    transform: scale(0.9);
    transform-origin: 0,0;
}
.l-menu .p-menu__content .p-menu-nav .p-menu-nav__list {
    display: flex;
    flex-direction: column;
    gap: 25px 0;
}
.l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li:nth-of-type(5) {
    margin-top: 25px;
}
.l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li {
    overflow: hidden;
}
.l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a {
    display: inline-block;
    font-size: 24px;
    line-height: 1;
    font-weight: 500;
    color: var(--color-black);
    text-decoration: none;
    transform: translateY(200%);
}
.l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a.portfolio {
    position: relative;
    padding-right: 30px;
    font-size: 16px;
    /* line-height: 3.223; */
    line-height: 1;
    font-weight: 500;
}
.l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a.portfolio::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 14px;
    height: 18px;
    background: url(../../assets/img/common/dl.svg);
    background-repeat: no-repeat;
    background-size: contain;
}
.l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a.policy {
    font-size: 16px;
    /* line-height: 3.223; */
    line-height: 1;
    font-weight: 500;
}
.l-menu .p-menu__content .instagram {
    position: absolute;
    bottom: 0;
    left: 0;
    filter: brightness(0);
}
.l-menu small {
    position: absolute;
    top: 50%;
    right: 42px;
    transform: translateY(-50%);
    width: 12px;
    height: 198px;
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .l-menu .p-menu__content .p-menu-detail .p-menu__logo {
        width: 8.125vw;
        height: 4.922vw;
    }
    .l-menu .p-menu__content .p-menu-detail .p-menu__line {
        margin: 1.953vw 0;
    }
    .l-menu .p-menu__content .p-menu-detail .p-menu__text {
        font-size: 0.86vw;
    }
    .l-menu .p-menu__content .p-menu-detail .p-menu__brand {
        margin-top: 1.25vw;
        gap: 0px 0.781vw;
    }
    .l-menu .p-menu__content .p-menu-detail .p-menu__brand img:nth-of-type(1){
        width: 4.063vw;
        height: 2.032vw;
    }
    .l-menu .p-menu__content .p-menu-detail .p-menu__brand img:nth-of-type(2){
        width: 0.782vw;
        height: 2.032vw;
    }
    .l-menu .p-menu__content .p-menu-detail .p-menu__brand img:nth-of-type(3){
        width: 5.782vw;
        height: 2.032vw;
    }
    .l-menu .p-menu__content .p-menu-nav::before {
        top: -0.469vw;
        left: -3.75vw;
        font-size: 0.782vw;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list {
        gap: 1.953vw 0;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li:nth-of-type(5) {
        margin-top: 1.953vw;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a {
        font-size: 1.875vw;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a.portfolio {
        padding-right: 1.644vw;
        font-size: 1.25vw;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a.portfolio::after {
        width: 1.094vw;
        height: 1.407vw;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a.policy {
        font-size: 1.25vw;
    }
    .l-menu .p-menu__content .instagram {
        width: 2.344vw;
        height: 2.344vw;
    }
    .l-menu small {
        right: 3.125vw;
        width: 0.938vw;
        height: 15.469vw;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .l-menu .p-menu__content .p-menu-detail .p-menu__logo {
        width: 11.342vw;
        height: 6.829vw;
    }
    .l-menu .p-menu__content .p-menu-detail .p-menu__line {
        margin: 3.171vw 0;
    }
    .l-menu .p-menu__content .p-menu-detail .p-menu__text {
        font-size: 0.976vw;
        line-height: 1.5;
        transform: scale(0.8);
        transform-origin: 0 0;
    }
    .l-menu .p-menu__content .p-menu-detail .p-menu__brand {
        margin-top: 2.927vw;
    }
    .l-menu .p-menu__content .p-menu-detail .p-menu__brand img:nth-of-type(1){
        width: 5.366vw;
        height: 2.683vw;
    }
    .l-menu .p-menu__content .p-menu-detail .p-menu__brand img:nth-of-type(2){
        width: 1.22vw;
        height: 2.683vw;
    }
    .l-menu .p-menu__content .p-menu-detail .p-menu__brand img:nth-of-type(3){
        width: 7.317vw;
        height: 2.683vw;
    }
    .l-menu .p-menu__content .p-menu-nav {
        position: relative;
        width: 50%;
        padding-left: 6.586vw;
    }
    .l-menu .p-menu__content .p-menu-nav::before {
        top: -0.732vw;
        left: 0;
        font-size: 1.098vw;
        line-height: 2.223;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list {
        gap: 3.171vw 0;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a {
        font-size: 2.683vw;
        line-height: 1;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li:nth-of-type(5) {
        margin-top: 4.878vw;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a.portfolio {
        padding-right: 3.171vw;
        font-size: 1.952vw;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a.portfolio::after {
        width: 1.708vw;
        height: 2.196vw;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a.policy {
        font-size: 1.952vw;
    }
    .l-menu .p-menu__content .instagram {
        width: 3.049vw;
        height: 3.049vw;
    }
    .l-menu small {
        right: 4.878vw;
        width: 0.976vw;
        height: 19.512vw;
    }
}
@media screen and (max-width: 767px) {
    .l-menu .p-menu__content {
        flex-direction: column;
    }
    .l-menu .p-menu__content .p-menu-detail {
        display: none;
    }
    .l-menu .p-menu__content .p-menu-nav {
        position: relative;
        margin-top: 13.334vw;
        padding-top: 13.334vw;
        padding-bottom: 26.667vw;
        width: 100%;
    }
    .l-menu .p-menu__content .p-menu-nav::before {
        top: 0;
        left: 0;
        font-size: 3.734vw;
        line-height: 1.429;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list {
        display: flex;
        flex-direction: column;
        gap: 8.534vw 0;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li:nth-of-type(5) {
        margin-top: 11.2vw;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a {
        font-size: 5.867vw;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a.portfolio {
        position: relative;
        padding-right: 30px;
        font-size: 4.267vw;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a.portfolio::after {
        width: 3.734vw;
        height: 4.8vw;
    }
    .l-menu .p-menu__content .p-menu-nav .p-menu-nav__list li a.policy {
        font-size: 4.267vw;
    }
    .l-menu .p-menu__content .instagram img {
        width: 6.667vw;
        height: 6.667vw;
    }
    .l-menu small {
        right: 8vw;
        width: 2.667vw;
        height: 53.334vw;
    }
}


.l-footer {
    padding: 32px 40px 30px;
    border-top: 1px solid var(--color-gray02);
}
.l-footer .p-footer__content {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.l-footer .p-footer__content .p-footer__mail {
    display: flex;
    align-items: flex-start;
}
.l-footer .p-footer__content .p-footer__mail span {
    font-size: 11px;
    line-height: 1.455;
    font-weight: 700;
    color: var(--color-gray02);
}
.l-footer .p-footer__content .p-footer__mail span:nth-of-type(1) {
    display: inline-block;
    width: 24px;
}
.l-footer .p-footer__content .p-footer__mail span:nth-of-type(2) {
    width: calc(100% - 24px);
    font-weight: 300;
}
.l-footer .p-footer__content .p-footer__address {
    display: flex;
    align-items: flex-start;
}
.l-footer .p-footer__content .p-footer__address span {
    font-size: 11px;
    line-height: 1.455;
    font-weight: 700;
    color: var(--color-gray02);
}
.l-footer .p-footer__content .p-footer__address span:nth-of-type(1) {
    display: inline-block;
    width: 24px;
}
.l-footer .p-footer__content .p-footer__address span:nth-of-type(2) {
    width: calc(100% - 24px);
    font-weight: 300;
}
.l-footer .p-footer__content small {
    display: inline-block;
    margin-top: 20px;
    font-size: 10px;
    line-height: 1.778;
    font-weight: 300;
    color: var(--color-gray02);
    transform: scale(0.9);
    transform-origin: 0 0;
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .l-footer {
        padding: 2.5vw 3.125vw 2.344vw;
        border-top: 1px solid var(--color-gray02);
    }
    .l-footer .p-footer__content .p-footer__mail span {
        font-size: 0.86vw;
    }
    .l-footer .p-footer__content .p-footer__mail span:nth-of-type(1) {
        width: 1.875vw;
    }
    .l-footer .p-footer__content .p-footer__mail span:nth-of-type(2) {
        width: calc(100% - 1.875vw);
    }
    .l-footer .p-footer__content .p-footer__address span {
        font-size: 0.86vw;
    }
    .l-footer .p-footer__content .p-footer__address span:nth-of-type(1) {
        width: 1.875vw;
    }
    .l-footer .p-footer__content .p-footer__address span:nth-of-type(2) {
        width: calc(100% - 1.875vw);
    }
    .l-footer .p-footer__content small {
        margin-top: 1.563vw;
        font-size: 0.782vw;
    }
    .l-pageTop a {
        display: inline-block;
    }
    .l-pageTop a img {
        width: 3.438vw;
        height: 5.704vw;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .l-footer {
        padding: 2.44vw 4.878vw 1.951vw;
        border-top: 1px solid var(--color-gray02);
    }
    .l-footer .p-footer__content .p-footer__mail span {
        font-size: 1.098vw;
        line-height: 1.667;
        transform: scale(0.9);
        transform-origin: 0 0;
    }
    .l-footer .p-footer__content .p-footer__mail span:nth-of-type(1) {
        width: 1.952vw;
    }
    .l-footer .p-footer__content .p-footer__mail span:nth-of-type(2) {
        width: calc(100% - 1.952vw);
    }
    .l-footer .p-footer__content .p-footer__address span {
        font-size: 1.098vw;
        line-height: 1.667;
        transform: scale(0.9);
        transform-origin: 0 0;
    }
    .l-footer .p-footer__content .p-footer__address span:nth-of-type(1) {
        width: 1.952vw;
    }
    .l-footer .p-footer__content .p-footer__address span:nth-of-type(2) {
        width: calc(100% - 1.952vw);
    }
    .l-footer .p-footer__content small {
        margin-top: 3.659vw;
        font-size: 1.098vw;
        line-height: 1.667;
    }
    .l-pageTop a {
        display: inline-block;
        /* width: 5.976vw;
        height: 8.171vw; */
    }
    .l-pageTop a img {
        width: 5.976vw;
        height: 8.171vw;
    }
}
@media screen and (max-width: 767px) {
    .l-footer {
        padding: 6.934vw 8vw 6.4vw;
        border-top: 1px solid var(--color-gray02);
    }
    .l-footer .p-footer__content .p-footer__mail span {
        font-size: 2.934vw;
    }
    .l-footer .p-footer__content .p-footer__mail span:nth-of-type(1) {
        width: 5.334vw;
    }
    .l-footer .p-footer__content .p-footer__mail span:nth-of-type(2) {
        width: calc(100% - 5.334vw);
    }
    .l-footer .p-footer__content .p-footer__address span {
        font-size: 2.934vw;
    }
    .l-footer .p-footer__content .p-footer__address span:nth-of-type(1) {
        width: 5.334vw;
    }
    .l-footer .p-footer__content .p-footer__address span:nth-of-type(2) {
        width: calc(100% - 5.334vw);
        font-weight: 300;
    }
    .l-footer .p-footer__content small {
        margin-top: 5.334vw;
        font-size: 2.4vw;
        transform: scale(0.9);
        transform-origin: 0 0;
    }
    .l-pageTop a {
        display: inline-block;
        /* width: 13.333vw;
        height: 24.534vw; */
    }
    .l-pageTop a img {
        width: 13.333vw;
        height: 24.534vw;
    }
}


.mt-1em {
    margin-top: 1em;
}

#pagetop.fixed {
    height: 100%;
    overflow: hidden;
}


/*------------------------------
* index
------------------------------*/

/* index */
.l-index {
    position: relative;
    padding: 40px 0 58px;
    min-height: 100%;
}
.l-index .p-index__content {
    display: flex;
    align-items: flex-start;
    padding-top: 60px;
}
.l-index .p-index__content .p-index-detail {
    position: relative;
    width: 50%;
    z-index: 999;
}
.l-index .p-index__content .p-index-detail .p-index__line {
    margin: 25px 0;
}
.l-index .p-index__content .p-index-detail .p-index__text {
    font-size: 11px;
    line-height: 1.455;
    font-weight: 300;
}
.l-index .p-index__content .p-index-detail .p-index__text b {
    font-weight: 700;
    font-style: normal;
}
.l-index .p-index__content .p-index-detail .p-index__text span {
    font-style: italic;
}
.l-index .p-index__content .p-index-detail .p-index__brand {
    display: inline-flex;
    gap: 0 10px;
    margin-top: 16px;
}
.l-index .p-index__content .p-index-nav {
    padding-left: 50%;
    width: 50%;
}
.l-index .p-index__content .p-index-nav .p-index-nav__list {
    /* opacity: 0; */
    display: flex;
    flex-direction: column;
    gap: 36px 0;
}
.l-index .p-index__content .p-index-nav .p-index-nav__list li {
    overflow: hidden;
}
.l-index .p-index__content .p-index-nav .p-index-nav__list li a {
    display: inline-block;
    font-size: 24px;
    /* line-height: 2.417; */
    line-height: 1;
    font-weight: 500;
    color: var(--color-gray02);
    text-decoration: none;
    transform: translateY(200%);
    /* overflow: hidden; */
}
.l-index .p-index__content .p-index-nav .p-index-nav__list li a.portfolio {
    position: relative;
    padding-right: 30px;
    font-size: 18px;
    /* line-height: 3.223; */
    line-height: 1;
    font-weight: 500;
}
.l-index .p-index__content .p-index-nav .p-index-nav__list li a.portfolio::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 14px;
    height: 18px;
    background: url(../../assets/img/common/dl.svg);
    background-repeat: no-repeat;
    background-size: contain;
    filter: invert(72%) sepia(6%) saturate(583%) hue-rotate(4deg) brightness(103%) contrast(100%);
}
.l-index .p-index__content .p-index-nav .p-index-nav__mail {
    margin-top: 56px;
    display: flex;
    align-items: flex-start;
}
.l-index .p-index__content .p-index-nav .p-index-nav__mail span {
    font-size: 14px;
    line-height: 1.714;
    font-weight: 700;
}
.l-index .p-index__content .p-index-nav .p-index-nav__mail span:nth-of-type(1) {
    display: inline-block;
    width: 24px;
}
.l-index .p-index__content .p-index-nav .p-index-nav__mail span:nth-of-type(2) {
    width: calc(100% - 24px);
    font-weight: 300;
}
.l-index .p-index__content .p-index-nav .p-index-nav__address {
    display: flex;
    align-items: flex-start;
    white-space: nowrap;
}
.l-index .p-index__content .p-index-nav .p-index-nav__address span {
    font-size: 14px;
    line-height: 1.714;
    font-weight: 700;
}
.l-index .p-index__content .p-index-nav .p-index-nav__address span:nth-of-type(1) {
    display: inline-block;
    width: 24px;
}
.l-index .p-index__content .p-index-nav .p-index-nav__address span:nth-of-type(2) {
    font-weight: 300;
}
.l-index .p-index__content .p-index-nav small {
    display: inline-block;
    margin-top: 20px;
    font-size: 11px;
    line-height: 2.364;
    font-weight: 300;
    transform-origin: left bottom;
}
.l-index .dotcom {
    position: absolute;
    top: 40px;
    left: 40px;
    width: 9px;
    height: 77px;
}
.l-index .instagram {
    position: absolute;
    top: 40px;
    right: 40px;
    filter: brightness(0) invert(1);
}
.l-index .p-index__content .scroll {
    position: absolute;
    bottom: 0;
    left: -18px;
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .l-index {
        padding: 3.125vw 0 4.532vw;
    }
    .l-index .p-index__content {
        padding-top: 4.688vw;
    }
    .l-index .p-index__content .p-index-detail .p-index__logo img {
        width: 8.125vw;
        height: 4.844vw;
    }
    .l-index .p-index__content .p-index-detail .p-index__line {
        margin: 1.953vw 0;
    }
    .l-index .p-index__content .p-index-detail .p-index__text {
        font-size: 0.86vw;
    }
    .l-index .p-index__content .p-index-detail .p-index__brand {
        margin-top: 1.25vw;
        gap: 0 0.782vw;
    }
    .l-index .p-index__content .p-index-detail .p-index__brand img:nth-of-type(1) {
        width: 4.063vw;
        height: 2.032vw;
    }
    .l-index .p-index__content .p-index-detail .p-index__brand img:nth-of-type(2) {
        width: 0.782vw;
        height: 2.032vw;
    }
    .l-index .p-index__content .p-index-detail .p-index__brand img:nth-of-type(3) {
        width: 5.782vw;
        height: 2.032vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__list {
        gap: 2.813vw 0;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__list li a {
        font-size: 1.875vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__list li a.portfolio {
        padding-right: 2.344vw;
        font-size: 1.406vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__list li a.portfolio::after {
        width: 1.094vw;
        height: 1.406vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__mail {
        margin-top: 4.375vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__mail span {
        font-size: 1.094vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__mail span:nth-of-type(1) {
        width: 1.875vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__address span {
        font-size: 1.094vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__address span:nth-of-type(1) {
        width: 1.875vw;
    }
    .l-index .p-index__content .p-index-nav small {
        margin-top: 1.563vw;
        font-size: 0.86vw;
    }
    .l-index .dotcom {
        top: 3.125vw;
        left: 3.125vw;
        width: 0.704vw;
        height: 6.016vw;
    }
    .l-index .instagram {
        top: 3.125vw;
        right: 3.125vw;;
    }
    .l-index .instagram img {
        width: 2.344vw;
        height: 2.344vw;
    }
    .l-index .p-index__content .scroll {
        left: -1.406vw;
    }
    .l-index .p-index__content .scroll img {
        width: 8.36vw;
        height: 3.75vw;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .l-index {
        padding: 5.122vw 0 7.074vw;
    }
    .l-index .p-index__content {
        padding-top: 4.634vw;
        width: 76.564vw;
    }              
    .l-index .p-index__content .p-index-detail .p-index__logo img {
        width: 11.342vw;
        height: 6.83vw;
    }     
    .l-index .p-index__content .p-index-detail .p-index__line {
        margin: 1.707vw 0;
        font-size: 0.976vw;
        line-height: 1.5;
        transform: scale(0.8);
        transform-origin: 0 0;
    }
    .l-index .p-index__content .p-index-detail .p-index__text {
        font-size: 0.976vw;
        line-height: 1.5;
        transform: scale(0.8);
        transform-origin: 0 0;
    }
    .l-index .p-index__content .p-index-detail .p-index__brand {
        margin-top: 1.464vw;
    }
    .l-index .p-index__content .p-index-detail .p-index__brand img:nth-of-type(1) {
        width: 5.366vw;
        height: 2.927vw;
    }
    .l-index .p-index__content .p-index-detail .p-index__brand img:nth-of-type(2) {
        width: 1.22vw;
        height: 2.927vw;
    }
    .l-index .p-index__content .p-index-detail .p-index__brand img:nth-of-type(3) {
        width: 7.805vw;
        height: 2.927vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__list {
        gap: 3.903vw 0;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__list li a {
        font-size: 2.683vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__list li a.portfolio {
        padding-right: 1.412vw;
        font-size: 1.707vw
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__list li a.portfolio::after {
        width: 1.059vw;
        height: 1.412vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__mail {
        margin-top: 6.83vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__mail span {
        font-size: 1.22vw;
        line-height: 1.6;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__mail span:nth-of-type(1) {
        width: 2.196vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__mail span:nth-of-type(2) {
        font-weight: 300;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__address {
        white-space: normal;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__address span {
        font-size: 1.22vw;
        line-height: 1.6;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__address span:nth-of-type(1) {
        width: 2.196vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__address span:nth-of-type(2) {
        font-weight: 300;
    }
    .l-index .p-index__content .p-index-nav small {
        margin-top: 2.439vw;
        font-size: 0.976vw;
        line-height: 2;
        transform: scale(0.8);
    }
    .l-index .dotcom {
        width: 1.22vw;
        height: 7.074vw;
    }
    .l-index .instagram img {
        width: 3.049vw;
        height: 3.049vw;
    }
    .l-index .p-index__content .scroll {
        left: -2.2vw;
        width: 12.805vw;
        height: 5.61vw;
    }
}
@media screen and (max-width: 767px) {
    .l-index {
        padding: 8vw 0 13.867vw;
        display: flex;
        /* align-items: center; */
        max-height: none;
    }
    .l-index .c-container_md {
        width: 84.267%;
    }
    .l-index .p-index__content {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        width: 61.867vw;
        margin: 0 auto;
        padding-top: 16vw;
        padding-bottom: 26.667vw;
    }
    .l-index .p-index__content .p-index-detail {
        width: 100%;
    }
    .l-index .p-index__content .p-index-detail .p-index__logo img {
        width: 24.267vw;
        height: 14.667vw;
    }
    .l-index .p-index__content .p-index-detail .p-index__line {
        margin: 6.667vw 0;
    }
    .l-index .p-index__content .p-index-detail .p-index__text {
        font-size: 2.4vw;
        line-height: 1.556;
        transform: scale(0.9);
        transform-origin: 0 0;
        white-space: nowrap;
    }
    .l-index .p-index__content .p-index-detail .p-index__brand {
        margin-top: 5.334vw;
        gap: 0 2.667vw;
    }
    .l-index .p-index__content .p-index-detail .p-index__brand img:nth-of-type(1) {
        width: 11.2vw;
        height: 5.334vw;
    }
    .l-index .p-index__content .p-index-detail .p-index__brand img:nth-of-type(2) {
        width: 2.667vw;
        height: 5.334vw;
    }
    .l-index .p-index__content .p-index-detail .p-index__brand img:nth-of-type(3) {
        width: 16vw;
        height: 5.334vw;
    }
    .l-index .p-index__content .p-index-nav {
        /* margin-top: 11.2vw; */
        padding-top: 72vw;
        padding-left: 0;
        width: 100%;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__list {
        display: flex;
        flex-direction: column;
        gap: 8.534vw 0;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__list li a {
        font-size: 5.867vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__list li a.portfolio {
        padding-right: 6.4vw;
        font-size: 4.267vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__list li a.portfolio::after {
        width: 3.734vw;
        height: 4.8vw;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__mail {
        display: none;
    }
    .l-index .p-index__content .p-index-nav .p-index-nav__address {
        display: none;
    }
    .l-index .p-index__content .p-index-nav small {
        display: none;
    }
    .l-index .dotcom {
        top: 5.667vw;
        left: 5.667vw;
        width: 2.134vw;
        height: 17.067vw;
    }
    .l-index .instagram {
        top: 5.667vw;
        right: 5.667vw;
    }
    .l-index .instagram img {
        width: 6.667vw;
        height: 6.667vw;
    }
    .l-index .p-index__content .scroll {
        left: -5.8vw;
    }
    .l-index .p-index__content .scroll img {
        width: 32.534vw;
        height: 15.734vw;
    }
}


/* project */
#project {
    margin-top: -100px;
    padding-top: 100px;
}
.l-project {
    position: relative;
    overflow: hidden;
}
.l-project .p-project__list {
    display: flex;
    flex-direction: column;
    margin: 0 auto;
    gap: 3px 0;
    width: 980px;
}
.l-project .p-project__list li {
    position: relative;
    z-index: 0;
}
.l-project .p-project__list li a {
    color: var(--color-white);
}
.l-project .p-project__list li .p-project__thumb {
    position: relative;
    width: 100vw;
    margin: 0 calc(50% - 50vw);
    background: rgba(203, 203, 203, 0.5);
    overflow: hidden;
}
.l-project .p-project__list li .p-project__thumb img {
    transition: transform 0.4s;
}
.l-project .p-project__list li .p-project__thumb:hover img {
    transform: scale(1.1);
}
.l-project .p-project__list li .p-project__thumb img {
    mix-blend-mode: multiply;
}
.l-project .p-project__list li .p-project__title {
    position: absolute;
    top: 45px;
    font-size: 18px;
    line-height: 1.389;
    font-weight: 500;
}
.l-project .p-project__list li .p-project__sub {
    position: absolute;
    top: 70px;
    font-size: 14px;
    line-height: 1.786;
    font-weight: 300;
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .l-project .p-project__list {
        gap: 0.235vw 0;
        width: 76.563%;
    }
    .l-project .p-project__list li .p-project__title {
        top: 3.516vw;
        font-size: 1.407vw;
    }
    .l-project .p-project__list li .p-project__sub {
        top: 5.469vw;
        font-size: 1.094vw;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .l-project .p-project__list {
        gap: 0.244vw 0;
        width: 76.563%;
    }
    .l-project .p-project__list li .p-project__title {
        top: 4.878vw;
        font-size: 1.952vw;
        line-height: 0.875;
        font-weight: 500;
    }
    .l-project .p-project__list li .p-project__sub {
        top: 8.537vw;
        font-size: 1.464vw;
        line-height: 0.858;
        font-weight: 300;
    }
}
@media screen and (max-width: 767px) {
    #project {
        margin-top: -19.734vw;
        padding-top: 19.734vw;
    }
    .l-project .p-project__list {
        gap: 0.534vw 0;
        width: 84.267%;
    }
    .l-project .p-project__list li .p-project__title {
        top: 8vw;
        font-size: 3.2vw;
        line-height: 1.917;
    }
    .l-project .p-project__list li .p-project__sub {
        top: 14.4vw;
        font-size: 2.667vw;
        line-height: 2.3;
    }
}


/* about */
#about {
    margin-top: -100px;
    padding-top: 100px;
}
.l-about {
    padding: 190px 0 70px;
}
.l-about .p-about__lead {
    margin-top: 64px;
}
.l-about .p-about__text {
    font-size: 20px;
    line-height: 2.143;
    font-weight: 300;
}
.l-about .p-about__text span {
    font-weight: 700;
}
.l-about .p-about__text:nth-of-type(2) {
    margin-top: 40px;
    font-size: 14px;
}
.l-about .p-about__text:nth-of-type(2) span {
    font-weight: 300;
}
.l-about .p-about-detail {
    display: flex;
    align-items: flex-start;
    margin-top: 80px;
}
.l-about .p-about-detail .p-about-detail__left {
    width: 420px;
}
.l-about .p-about-detail .p-about-detail__right {
    width: calc(100% - 420px);
}
.l-about .p-about-detail .p-about-detail__title {
    font-size: 14px;
    line-height: 2.143;
    font-weight: 300;
    font-style: italic;
    color: var(--color-gray02);
}
.l-about .p-about-detail .p-about-detail__list {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    margin-top: 30px;
    gap: 4px 0;
    font-size: 14px;
    line-height: 2.143;
    font-weight: 400;
}
.l-about .p-about-detail .p-about-detail__left .p-about-detail__list dt {
    width: 130px;
    font-weight: 300;
    font-style: italic;
}
.l-about .p-about-detail .p-about-detail__left .p-about-detail__list dd {
    width: calc(100% - 130px);
}
.l-about .p-about-detail .p-about-detail__right .p-about-detail__list dt {
    width: 100px;
}
.l-about .p-about-detail .p-about-detail__right .p-about-detail__list dd {
    width: calc(100% - 100px);
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .l-about {
        padding: 14.844vw 0 5.469vw;
    }
    .l-about .p-about__lead {
        margin-top: 5vw;
    }
    .l-about .p-about__text {
        font-size: 1.563vw;
        line-height: 1.6;
    }
    .l-about .p-about__text:nth-of-type(2) {
        margin-top: 3.125vw;
        font-size: 1.094vw;
    }
    .l-about .p-about-detail {
        margin-top: 6.25vw;
    }
    .l-about .p-about-detail .p-about-detail__left {
        width: 32.813vw;
    }
    .l-about .p-about-detail .p-about-detail__right {
        width: calc(100% - 32.813vw);
    }
    .l-about .p-about-detail .p-about-detail__title {
        font-size: 1.094vw;
    }
    .l-about .p-about-detail .p-about-detail__list {
        margin-top: 2.344vw;
        gap: 0.313vw 0;
        font-size: 1.094vw;
    }
    .l-about .p-about-detail .p-about-detail__left .p-about-detail__list dt {
        width: 10.157vw;
    }
    .l-about .p-about-detail .p-about-detail__left .p-about-detail__list dd {
        width: calc(100% - 10.157vw);
    }
    .l-about .p-about-detail .p-about-detail__right .p-about-detail__list dt {
        width: 7.813vw;
    }
    .l-about .p-about-detail .p-about-detail__right .p-about-detail__list dd {
        width: calc(100% - 7.813vw);
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .l-about {
        padding: 11.708vw 0 6.096vw;
    }
    .l-about .p-about__lead {
        margin-top: 5.854vw;
    }
    .l-about .p-about__text {
        font-size: 1.707vw;
        line-height: 1.714;
    }
    .l-about .p-about__text span {
        font-weight: 700;
    }
    .l-about .p-about__text:nth-of-type(2) {
        margin-top: 2.927vw;
        font-size: 1.464vw;
        line-height: 2.084;
    }
    .l-about .p-about-detail {
        flex-direction: column;
        margin-top: 8.537vw;
    }
    .l-about .p-about-detail .p-about-detail__left {
        width: 100%;
    }
    .l-about .p-about-detail .p-about-detail__right {
        margin-top: 8.537vw;
        width: 100%;
    }
    .l-about .p-about-detail .p-about-detail__title {
        font-size: 1.464vw;
        line-height: 2.084;
    }
    .l-about .p-about-detail .p-about-detail__list {
        margin-top: 3.659vw;
        gap: 1.22vw 0;
        font-size: 1.464vw;
        line-height: 2.084;
    }
    .l-about .p-about-detail .p-about-detail__left .p-about-detail__list dt {
        width: 13.659vw;
    }
    .l-about .p-about-detail .p-about-detail__left .p-about-detail__list dd {
        width: calc(100% - 13.659vw);
    }
    .l-about .p-about-detail .p-about-detail__right .p-about-detail__list dt {
        width: 12.195vw;
    }
    .l-about .p-about-detail .p-about-detail__right .p-about-detail__list dd {
        width: calc(100% - 12.195vw);
    }
}
@media screen and (max-width: 767px) {
    #about {
        margin-top: -19.734vw;
        padding-top: 19.734vw;
    }
    .l-about {
        padding: 40vw 0 13.334vw;
    }
    .l-about .p-about__lead {
        margin-top: 13.334vw;
    }
    .l-about .p-about__text {
        font-size: 3.734vw;
        line-height: 1.786;
    }
    .l-about .p-about__text span {
        font-weight: 300;
    }
    .l-about .p-about__text:nth-of-type(2) {
        margin-top: 11.2vw;
        font-size: 3.2vw;
        line-height: 2.084;
        font-weight: 400;
    }
    .l-about .p-about-detail {
        flex-direction: column;
        margin-top: 16.534vw;
    }
    .l-about .p-about-detail .p-about-detail__left {
        width: 100%;
    }
    .l-about .p-about-detail .p-about-detail__right {
        margin-top: 16.534vw;
        width: 100%;
    }
    .l-about .p-about-detail .p-about-detail__title {
        font-size: 3.734vw;
        line-height: 1.786;
    }
    .l-about .p-about-detail .p-about-detail__list {
        margin-top: 8vw;
        gap: 0;
        font-size: 3.2vw;;
        line-height: 2.084;
    }
    .l-about .p-about-detail .p-about-detail__left .p-about-detail__list dt {
        width: 33.067vw;
        font-size: 3.734vw;
    }
    .l-about .p-about-detail .p-about-detail__left .p-about-detail__list dd {
        width: calc(100% - 33.067vw);
    }
    .l-about .p-about-detail .p-about-detail__right .p-about-detail__list dt {
        width: 22vw;
    }
    .l-about .p-about-detail .p-about-detail__right .p-about-detail__list dd {
        width: calc(100% - 22vw);
    }
}



/* member */
.l-member {
    padding: 70px 0;
}
.l-member article {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-top: 64px;
}
.l-member article .p-member__image {
    width: 270px;
}
.l-member article .p-member-detail {
    width: calc(100% - 270px - 60px);
}
.l-member article .p-member-detail .p-member-detail__en {
    font-size: 25px;
    line-height: 1;
    font-weight: 300;
}
.l-member article .p-member-detail .p-member-detail__ja {
    margin-left: 16px;
    font-size: 12px;
    line-height: 1.917;
    font-weight: 400;
}
.l-member article .p-member-detail .p-member-detail__position {
    margin-top: 10px;
    font-size: 16px;
    line-height: 1.563;
    font-weight: 300;
    font-style: italic;
}
.l-member article .p-member-detail .p-member-detail__text {
    margin-top: 36px;
    font-size: 14px;
    line-height: 2.143;
    font-weight: 400;
}
.l-member .p-member-slider {
    margin-top: 115px;
}
.l-member .p-member-slider .slick-slide {
    height: auto;
}
.l-member .p-member-slider .slick-prev:before,
.l-member .p-member-slider .slick-next:before {
    display: none;
}
.l-member .p-member-slider .slick-next {
    display: flex;
    align-items: center;
    justify-content: center;
    top: 46px;
    right: -55px;
    transform: translateY(0);
    width: 50px;
    height: 50px;
    z-index: 1;
}
.l-member .p-member-slider .slick-prev {
    display: flex;
    align-items: center;
    justify-content: center;
    top: 46px;
    left: -55px;
    transform: translateY(0);
    width: 50px;
    height: 50px;
    z-index: 1;
}
.l-member .p-member-slider .slick-next img,
.l-member .p-member-slider .slick-prev img {
    width: 19px;
    height: 37px;
}
.l-member .p-member-slider .p-member-slide__card {
    position: relative;
    width: 182px;
    margin-right: 18px;
}
.l-member .p-member-slider .p-member-slide__card .p-member-slide__en {
    display: inline-block;
    margin-top: 24px;
    font-size: 16px;
    line-height: 1.875;
    font-weight: 300;
}
.l-member .p-member-slider .p-member-slide__card .p-member-slide__ja {
    font-size: 12px;
    line-height: 1.917;
    font-weight: 400;
}
.l-member .p-member-slider .p-member-slide__card .p-member-slide__position {
    margin-top: 24px;
    font-size: 12px;
    line-height: 2.5;
    font-weight: 300;
}
.l-member .c-link {
    margin-top: 32px;
    margin-bottom: 27px;
}
.l-member .c-link a[target="_blank"]::after{
    display: none;
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .l-member {
        padding: 5.469vw 0;
    }
    .l-member article {
        margin-top: 5vw;
    }
    .l-member article .p-member__image {
        width: 21.094vw;
    }
    .l-member article .p-member-detail {
        width: calc(100% - 21.094vw - 4.688vw);
    }
    .l-member article .p-member-detail .p-member-detail__en {
        font-size: 1.953vw;
    }
    .l-member article .p-member-detail .p-member-detail__ja {
        margin-left: 1.25vw;
        font-size: 0.938vw;
    }
    .l-member article .p-member-detail .p-member-detail__position {
        margin-top: 0.782vw;
        font-size: 1.25vw;
    }
    .l-member article .p-member-detail .p-member-detail__text {
        margin-top: 2.813vw;
        font-size: 1.094vw;
    }
    .l-member .p-member-slider {
        margin-top: 11.5vw;
    }
    .l-member .p-member-slider .slick-next {
        top: 3.732vw;
        right: -4.297vw;
        width: 3.906vw;
        height: 3.906vw;
    }
    .l-member .p-member-slider .slick-prev {
        top: 3.732vw;
        left: -4.297vw;
        width: 3.906vw;
        height: 3.906vw;
    }
    .l-member .p-member-slider .slick-next img,
    .l-member .p-member-slider .slick-prev img {
        width: 1.485vw;
        height: 2.891vw;
    }
    .l-member .p-member-slider .p-member-slide__card {
        width: 14.219vw;
        margin-right: 1.406vw;
    }
    .l-member .p-member-slider .p-member-slide__card .p-member-slide__en {
        margin-top: 1.875vw;
        font-size: 1.25vw;
    }
    .l-member .p-member-slider .p-member-slide__card .p-member-slide__ja {
        font-size: 0.938vw;
    }
    .l-member .p-member-slider .p-member-slide__card .p-member-slide__position {
        margin-top: 1.875vw;
        font-size: 0.938vw;
    }
    .l-member .c-link {
        margin-top: 2.5vw;
        margin-bottom: 2.7vw;
    }
    .l-member .c-link img {
        width: 4.532vw;
        height: 2.266vw;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .l-member {
        padding: 6.098vw 0;
    }
    .l-member article {
        margin-top: 5.854vw;
    }
    .l-member article .p-member__image {
        width: 21.342vw;
    }
    .l-member article .p-member-detail {
        width: calc(100% - 21.342vw - 3.659vw);
    }
    .l-member article .p-member-detail .p-member-detail__en {
        font-size: 2.196vw;
        line-height: 1.333;
    }
    .l-member article .p-member-detail .p-member-detail__ja {
        margin-left: 1.952vw;
        font-size: 1.22vw;
        line-height: 2.4;
    }
    .l-member article .p-member-detail .p-member-detail__position {
        margin-top: 1.22vw;
        font-size: 1.464vw;
        line-height: 2vw;
    }
    .l-member article .p-member-detail .p-member-detail__text {
        margin-top: 4.39vw;
        font-size: 1.464vw;
    }
    .l-member .p-member-slider {
        margin-top: 10.488vw;
    }
    .l-member .p-member-slider .slick-next {
        top: 3.09vw;
        right: -5.859vw;
        width: 6.098vw;
        height: 6.098vw;
    }
    .l-member .p-member-slider .slick-prev {
        top: 3.09vw;
        left: -5.859vw;
        width: 6.098vw;
        height: 6.098vw;
    }
    .l-member .p-member-slider .slick-next img,
    .l-member .p-member-slider .slick-prev img {
        width: 1.464vw;
        height: 2.927vw;
    }
    .l-member .p-member-slider .p-member-slide__card {
        width: 14.39vw;
        margin-right: 1.22vw;
    }
    .l-member .p-member-slider .p-member-slide__card .p-member-slide__en {
        display: inline-block;
        margin-top: 1.464vw;
        font-size: 1.464vw;
        line-height: 1.25vw;
        white-space: nowrap;
    }
    .l-member .p-member-slider .p-member-slide__card .p-member-slide__ja {
        margin-top: 1.22vw;
        font-size: 1.22vw;
        line-height: 1.1vw;
    }
    .l-member .p-member-slider .p-member-slide__card .p-member-slide__position {
        margin-top: 1.22vw;
        font-size: 1.22vw;
        line-height: 1.3;
    }
    .l-member .c-link {
        margin-top: 3.903vw;
        margin-bottom: 1.2vw;
    }
    .l-member .c-link img {
        width: 5.61vw;
        height: 2.683vw;
    }
}
@media screen and (max-width: 767px) {
    .l-member {
        padding: 13.334vw 0;
    }
    .l-member article {
        flex-direction: column-reverse;
        margin-top: 14.4vw;
    }
    .l-member article .p-member__image {
        width: 53.867vw;
    }
    .l-member article .p-member-detail {
        width: 100%;
        margin-top: 9.6vw;
    }
    .l-member article .p-member-detail .p-member-detail__en {
        font-size: 5.334vw;
        line-height: 1.25;
    }
    .l-member article .p-member-detail .p-member-detail__ja {
        margin-left: 4.267vw;
        font-size: 3.2vw;
        line-height: 2.084;
    }
    .l-member article .p-member-detail .p-member-detail__position {
        margin-top: 2.667vw;
        font-size: 3.734vw;
        line-height: 1.786;
    }
    .l-member article .p-member-detail .p-member-detail__text {
        margin-top: 9.6vw;
        font-size: 3.2vw;;
        line-height: 2.084;
    }
    .l-member .p-member-slider {
        margin: 20.533vw auto 0;
        width: 72vw;
    }
    .l-member .p-member-slider::before {
        content: "";
        position: absolute;
        top: 0;
        right: 102%;
        width: 18vw;
        height: 100%;
        background: var(--color-black);
        z-index: 1;
    }
    .l-member .p-member-slider .slick-list {
        overflow: visible;
    }
    .l-member .p-member-slider .slick-next {
        top: 13.134vw;
        right: 6.467vw;
        width: 13.334vw;
        height: 13.334vw;
    }
    .l-member .p-member-slider .slick-prev {
        top: 13.134vw;
        left: -11.134vw;
        width: 13.334vw;
        height: 13.334vw;
    }
    .l-member .p-member-slider .slick-next img,
    .l-member .p-member-slider .slick-prev img {
        width: 2.667vw;
        height: 5.334vw;
    }
    .l-member .p-member-slider .p-member-slide__card {
        width: 47.734vw;
        margin-right: 6.667vw;
    }
    .l-member .p-member-slider .p-member-slide__card:not(.slick-current)::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
    }
    .l-member .p-member-slider .p-member-slide__card .p-member-slide__en {
        margin-top: 4.534vw;
        font-size: 3.734vw;
        line-height: 1.786;
    }
    .l-member .p-member-slider .p-member-slide__card .p-member-slide__ja {
        font-size: 3.2vw;
        line-height: 2.5;
    }
    .l-member .p-member-slider .p-member-slide__card .p-member-slide__position {
        margin-top: 2.667vw;
        font-size: 3.2vw;
        line-height: 2.084;
    }
    .l-member .c-link {
        margin-top: 10.134vw;
        margin-bottom: 1.8667vw;
    }
    .l-member .c-link img {
        width: 15.2vw;
        height: 7.2vw;
    }
}



/* office */
.l-office {
    padding: 70px 0;
}
.l-office .p-office__title {
    font-size: 16px;
    line-height: 1.563;
    font-weight: 300;
    font-style: italic;
    color: var(--color-gray02);
}
.l-office .p-office__image {
    width: 100vw;
    margin: 24px calc(50% - 50vw) 0;
}
.l-office .p-office__add {
    margin-top: 40px;
    font-size: 14px;
    line-height: 1.643;
    font-weight: 400;
}
.l-office .c-link {
    margin-top: 16px;
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .l-office {
        padding: 5.469vw 0;
    }
    .l-office .p-office__title {
        font-size: 1.25vw;
    }
    .l-office .p-office__image {
        margin: 1.875vw calc(50% - 50vw) 0;
    }
    .l-office .p-office__add {
        margin-top: 3.125vw;
        font-size: 1.094vw;
    }
    .l-office .c-link {
        margin-top: 1.25vw;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .l-office {
        padding: 6.098vw 0;
    }
    .l-office .p-office__title {
        font-size: 1.464vw;
        line-height: 2.084;
    }
    .l-office .p-office__image {
        width: 100vw;
        margin: 2.927vw calc(50% - 50vw) 0;
    }
    .l-office .p-office__add {
        margin-top: 3.903vw;
        font-size: 1.464vw;
        line-height: 2.084;
    }
    .l-office .c-link {
        margin-top: 1.952vw;
    }
}
@media screen and (max-width: 767px) {
    .l-office {
        padding: 13.334vw 0;
    }
    .l-office .p-office__title {
        font-size: 3.734vw;
        line-height: 2.143;
    }
    .l-office .p-office__image {
        margin: 8.534vw calc(50% - 50vw) 0;
    }
    .l-office .p-office__add {
        margin-top: 7.2vw;
        font-size: 3.2vw;
        line-height: 2.084;
    }
    .l-office .c-link {
        margin-top: 7.467vw;
    }
}


/* contact */
#contact {
    margin-top: -100px;
    padding-top: 100px;
}
.l-contact {
    padding: 70px 0;
}
.l-contact .p-contact__sub {
    margin-left: 16px;
    font-size: 18px;
    line-height: 1.389;
    font-weight: 700;
}
.l-contact .p-contact__text {
    margin-top: 32px;
    font-size: 14px;
    line-height: 2.143;
    font-weight: 400;
}
.l-contact .p-contact__btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 24px;
    width: 100%;
    height: 56px;
    border: 1px solid var(--color-gray02);
    font-size: 20px;
    line-height: 1.25;
    font-weight: 300;
    font-style: italic;
    color: var(--color-gray02);
    text-decoration: none;
    box-sizing: border-box;
    transition: 0.4s;
    cursor: pointer;
}
.l-contact .p-contact__btn span:first-of-type {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}
.l-contact .p-contact__btn::before {
    content: "";
    position: absolute;
    top: 10px;
    right: 10px;
    width: 17px;
    height: 15px;
    background: url(../img/common/contact-arrow.svg);
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 2;
}
.l-contact .p-contact__btn:hover {
    opacity: 0.5;
}
.l-contact .p-contact__btn.active {
    opacity: 1;
}
.l-contact .p-contact__btn.active::before {
    filter: brightness(0);
}
.l-contact .p-contact__btn .copied {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    color: var(--color-black);
    background: var(--color-gray02);
    display: none;
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .l-contact {
        padding: 5.469vw 0;
    }
    .l-contact .p-contact__sub {
        margin-left: 1.25vw;
        font-size: 1.406vw;
    }
    .l-contact .p-contact__text {
        margin-top: 2.5vw;
        font-size: 1.094vw;
    }
    .l-contact .p-contact__btn {
        margin-top: 1.875vw;
        height: 4.375vw;
        font-size: 1.563vw;
    }
    .l-contact .p-contact__btn::before {
        top: 0.782vw;
        right: 0.782vw;
        width: 1.328vw;
        height: 1.172vw;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .l-contact {
        padding: 8.537vw 0;
    }
    .l-contact .p-contact__sub {
        display: none;
    }
    .l-contact .p-contact__text {
        margin-top: 3.903vw;
        font-size: 1.464vw;
        line-height: 2.084;
    }
    .l-contact .c-link {
        margin-top: 1.952vw;
    }
    .l-contact .p-contact__btn {
        margin-top: 2.927vw;
        height: 4.878vw;
        font-size: 1.952vw;
        line-height: 1;
    }
    .l-contact .p-contact__btn::before {
        top: 0.976vw;
        right: 0.976vw;
        width: 1.586vw;
        height: 1.341vw;
    }
}
@media screen and (max-width: 767px) {
    #contact {
        margin-top: -19.734vw;
        padding-top: 19.734vw;
    }
    .l-contact {
        padding: 13.334vw 0;
    }
    .l-contact .p-contact__sub {
        display: block;
        margin-left: 0;
        font-size: 4.267vw;
        line-height: 1.563;
    }
    .l-contact .p-contact__text {
        margin-top: 8.534vw;
        font-size: 3.2vw;
        line-height: 1.667;
    }
    .l-contact .p-contact__btn {
        margin-top: 6.4vw;
        height: 16.8vw;
        font-size: 5.334vw;
    }
    .l-contact .p-contact__btn::before {
        top: 2.134vw;
        right: 2.134vw;
        width: 3.2vw;
        height: 3.2vw;
    }
}


/* policy */
.l-policy {
    padding: 20px 0 190px;
}
.l-policy .c-link {
    margin-top: 36px;
}
.l-policy .c-link:not(:first-of-type) {
    margin-left: 72px;
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .l-policy {
        padding: 1.563vw 0 14.844vw;
    }
    .l-policy .c-link {
        margin-top: 2.813vw;
    }
    .l-policy .c-link:not(:first-of-type) {
        margin-left: 5.625vw;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .l-policy {
        padding: 0 0 18.293vw;
    }
    .l-policy .c-link {
        margin-top: 4.39vw;
    }
    .l-policy .c-link:not(:first-of-type) {
        margin-left: 8.78vw;
    }
}
@media screen and (max-width: 767px) {
    .l-policy {
        padding: 13.334vw 0 39.467vw;
    }
    .l-policy .c-link {
        margin-top: 8vw;
    }
    .l-policy .c-link:not(:first-of-type) {
        margin-top: 5.334vw;
        margin-left: 0;
    }
    .l-policy .c-link a {
        font-size: 3.2vw;
        line-height: 1.917;
        font-weight: 400;
    }
}


/*------------------------------
* track
------------------------------*/

.l-track {
    padding: 58px 0 150px;
}
.l-track .p-track__image {
    overflow: hidden;
    transform: translateY(2%);
}
.l-track .p-track__title {
    margin-top: 64px;
    font-size: 20px;
    line-height: 1.65;
    font-weight: 500;
}
.l-track .p-track__sub {
    font-size: 12px;
    line-height: 1.667;
    font-weight: 300;
}
.l-track .p-track-detail {
    margin-top: 72px;
}
.l-track .p-track-detail p {
    margin-top: 24px;
    font-size: 14px;
    line-height: 2;
    font-weight: 300;
}
.l-track .p-track__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px 0;
    margin-top: 120px;
}
.l-track .p-track__list li {
    max-width: 486px;
    width: 49.592%;
}
.l-track .p-track__list li .youtube {
    width: 100%;
    height: 100%;
}
.l-track .p-track__list li .youtube iframe {
    width: 100%;
    height: 100%;
}
.l-track .c-link {
    margin-top: 64px;
}

.l-other {
    padding: 96px 0 0;
}
.l-other .p-other__title {
    font-size: 14px;
    line-height: 1.643;
    font-weight: 300;
    font-style: italic;
    color: var(--color-gray02);
}
.l-other .p-other__list {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 20px;
}
.l-other .p-other__list li {
    position: relative;
    max-width: 486px;
    width: 49.592%;
    z-index: 0;
}
.l-other .p-other__list li a {
    color: var(--color-white);
}
.l-other .p-other__list li .p-other__thumb {
    position: relative;
    /* background: rgba(0, 0, 0, 0.5); */
}
.l-other .p-other__list li .p-other__thumb::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% + 1px);
    background: rgba(0, 0, 0, 0.5);
}
.l-other .p-other__list li .p-other__thumb img {
    /* mix-blend-mode: multiply; */
}
.l-other .p-other__list li .p-other__name {
    position: absolute;
    top: 24px;
    left: 20px;
    font-size: 14px;
    line-height: 0.786;
    font-weight: 500;
}
.l-other .p-other__list li .p-other__sub {
    position: absolute;
    top: 48px;
    left: 20px;
    font-size: 12px;
    line-height: 0.917;
    font-weight: 300;
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .l-track {
        padding: 4.532vw 0 11.719vw;
    }
    .l-track .p-track__title {
        margin-top: 5vw;
        font-size: 1.563vw;
    }
    .l-track .p-track__sub {
        font-size: 0.938vw;
    }
    .l-track .p-track-detail {
        margin-top: 5.625vw;
    }
    .l-track .p-track-detail p {
        margin-top: 1.875vw;
        font-size: 1.094vw;
    }
    .l-track .p-track__list {
        gap: 0.625vw 0;
        margin-top: 9.375vw;
    }
    .l-track .p-track__list li {
        /* width: 37.969vw; */
    }
    .l-track .c-link {
        margin-top: 5vw;
    }
    
    .l-other {
        padding: 7.5vw 0 0;
    }
    .l-other .p-other__title {
        font-size: 1.094vw;
    }
    .l-other .p-other__list {
        margin-top: 1.563vw;
    }
    .l-other .p-other__list li {
        /* width: 37.969vw; */
    }
    .l-other .p-other__list li .p-other__name {
        top: 1.875vw;
        left: 1.563vw;
        font-size: 1.094vw;
    }
    .l-other .p-other__list li .p-other__sub {
        top: 3.75vw;
        left: 1.563vw;
        font-size: 0.938vw;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .l-track {
        padding: 4.879vw 0 18.293vw;
    }
    .l-track .p-track__title {
        margin-top: 4.878vw;
        font-size: 2.439vw;
        line-height: 1.65;
        font-weight: 500;
    }
    .l-track .p-track__sub {
        font-size: 1.464vw;
        line-height: 1.667;
        font-weight: 300;
    }
    .l-track .p-track-detail {
        margin-top: 4.878vw;
    }
    .l-track .p-track-detail p {
        margin-top: 1.952vw;
        font-size: 1.464vw;
        line-height: 2.084;
        font-weight: 400;
    }
    .l-track .p-track__list {
        gap: 0.488vw 0;
        margin-top: 12.196vw;
    }
    .l-track .p-track__list li {
        max-width: 312px;
        width: 49.682%;
    }
    .l-track .c-link {
        margin-top: 8.781vw;
    }
    
    .l-other {
        padding: 12.196vw 0 0;
    }
    .l-other .p-other__title {
        font-size: 1.22vw;
        line-height: 2.3;
        font-weight: 300;
    }
    .l-other .p-other__list {
        margin-top: 1.707vw;
    }
    .l-other .p-other__list li {
        max-width: 312px;
        width: 49.682%;
        z-index: 0;
    }
    .l-other .p-other__list li .p-other__name {
        top: 2.196vw;
        left: 2.196vw;
        font-size: 1.464vw;
        line-height: 0.584;
        font-weight: 500;
    }
    .l-other .p-other__list li .p-other__sub {
        top: 4.391vw;
        left: 2.196vw;
        font-size: 1.22vw;
        line-height: 0.6;
        font-weight: 300;
    }
}
@media screen and (max-width: 767px) {
    .l-track {
        padding: 8vw 0 41.067vw;
    }
    .l-track .p-track__image {
        width: 100vw;
        margin: 0 calc(50% - 50vw);
    }
    .l-track .p-track__title {
        margin-top: 6.667vw;
        font-size: 5.334vw;
    }
    .l-track .p-track__sub {
        font-size: 3.2vw;
    }
    .l-track .p-track-detail {
        margin-top: 14.4vw;
    }
    .l-track .p-track-detail p {
        margin-top: 4.267vw;
        font-size: 3.2vw;
        line-height: 2.084;
    }
    .l-track .p-track__list {
        flex-direction: column;
        gap: 0.8vw 0;
        margin-top: 19.2vw;
    }
    .l-track .p-track__list li {
        max-width: none;
        width: 100%;
    }
    .l-track .p-track__list li .youtube {
        width: 100%;
        aspect-ratio: 316 / 176;
    }
    .l-track .p-track__list li img {
        width: 100%;
        aspect-ratio: 316 / 176;
    }
    .l-track .c-link {
        margin-top: 18.667vw;
    }
    
    .l-other {
        padding: 27.734vw 0 0;
    }
    .l-other .p-other__title {
        font-size: 3.734vw;
    }
    .l-other .p-other__list {
        flex-direction: column;
        margin-top: 7.467vw;
        gap: 0.8vw 0;
    }
    .l-other .p-other__list li {
        max-width: none;
        width: 100%;
    }
    .l-other .p-other__list li .p-other__name {
        top: 5.334vw;
        left: 5.334vw;
        font-size: 3.2vw;
        line-height: 1.917;
    }
    .l-other .p-other__list li .p-other__sub {
        top: 10.667vw;
        left: 5.334vw;
        font-size: 2.667vw;
        line-height: 2.3;
    }
}



/* guideline */
.l-guideline {
    padding: 58px 0 150px;
}
.l-guideline .p-guideline__title {
    font-size: 25px;
    line-height: 1.32;
    font-weight: 500;
    color: var(--color-gray02);
}
.l-guideline .p-guideline__text {
    margin-top: 40px;
    font-size: 14px;
    line-height: 2.143;
    font-weight: 400;
}
.l-guideline .p-guideline__list {
    margin-top: 54px;
    border-top: 1px solid var(--color-gray02);
}
.l-guideline .p-guideline__list div:not([class]) {
    margin-top: 54px;
}
.l-guideline .p-guideline__list div:not([class]) dt {
    font-size: 14px;
    line-height: 1.643;
    font-weight: 500;
}
.l-guideline .p-guideline__list div:not([class]) dd {
    margin-top: 16px;
    font-size: 12px;
    line-height: 2.084;
    font-weight: 400;
}
.l-guideline .p-guideline__list div:not([class]):not(:last-child) dd ul li {
    position: relative;
    padding-left: 30px;
}
.l-guideline .p-guideline__list div:not([class]) dd ul li span:not([class]) {
    position: absolute;
    left: 0;
}
.l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social a {
    display: inline-flex;
    align-items: center;
    gap: 0 16px;
    margin-top: 16px;
    text-decoration: none;
}
.l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social span:nth-of-type(1) {
    display: flex;
}
.l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social span:nth-of-type(2) {
    font-size: 14px;
    line-height: 2.143;
    font-weight: 300;
    color: var(--color-gray02);
}
.l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social span:nth-of-type(2) b {
    font-size: 14px;
    line-height: 2.143;
    font-weight: 500;
}
.l-guideline .c-link {
    margin-top: 64px;
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .l-guideline {
        padding: 4.532vw 0 11.719vw;
    }
    .l-guideline .p-guideline__title {
        font-size: 1.954vw;
    }
    .l-guideline .p-guideline__text {
        margin-top: 3.125vw;
        font-size: 1.094vw;
    }
    .l-guideline .p-guideline__list {
        margin-top: 4.219vw;
        border-top: 1px solid var(--color-gray02);
    }
    .l-guideline .p-guideline__list div:not([class]) {
        margin-top: 4.219vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dt {
        font-size: 1.094vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dd {
        margin-top: 1.25vw;
        font-size: 0.938vw;
    }
    .l-guideline .p-guideline__list div:not([class]):not(:last-child) dd ul li {
        padding-left: 2.344vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social a {
        gap: 0 1.25vw;
        margin-top: 1.25vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social span:nth-of-type(1) {
        width: 1.563vw;
        height: 1.563vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social span:nth-of-type(2) {
        font-size: 1.094vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social span:nth-of-type(2) b {
        font-size: 1.094vw;
    }
    .l-guideline .c-link {
        margin-top: 5vw;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .l-guideline {
        padding: 4.879vw 0 18.293vw;
    }
    .l-guideline .p-guideline__title {
        font-size: 2.439vw;
        line-height: 1.65;
    }
    .l-guideline .p-guideline__text {
        margin-top: 4.878vw;
        font-size: 1.464vw;
        line-height: 2.084;
        font-weight: 400;
    }
    .l-guideline .p-guideline__list {
        margin-top: 54px;
        border-top: 1px solid var(--color-gray02);
    }
    .l-guideline .p-guideline__list div:not([class]) {
        margin-top: 4.878vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dt {
        font-size: 1.708vw;
        line-height: 1.429;
        font-weight: 400;
    }
    .l-guideline .p-guideline__list div:not([class]) dd {
        margin-top: 1.952vw;
        font-size: 1.464vw;
        line-height: 2.084;
        font-weight: 400;
    }
    .l-guideline .p-guideline__list div:not([class]):not(:last-child) dd ul li {
        padding-left: 3.659vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social a {
        gap: 0 1.952vw;
        margin-top: 2.927vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social span:nth-of-type(1) {
        width: 2.196vw;
        height: 2.196vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social span:nth-of-type(2) {
        font-size: 1.342vw;
        line-height: 2.182;
        font-weight: 300;
    }
    .l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social span:nth-of-type(2) b {
        font-size: 1.342vw;
        line-height: 2.182;
        font-weight: 500;
    }
    .l-guideline .c-link {
        margin-top: 8.781vw;
    }
}
@media screen and (max-width: 767px) {
    .l-guideline {
        padding: 8vw 0 41.067vw;
    }
    .l-guideline .p-guideline__title {
        font-size: 5.334vw;
        line-height: 1.5;
    }
    .l-guideline .p-guideline__text {
        margin-top: 8.534vw;
        font-size: 3.2vw;
        line-height: 2.084;
    }
    .l-guideline .p-guideline__list {
        margin-top: 10.667vw;;
        border-top: 1px solid var(--color-gray02);
    }
    .l-guideline .p-guideline__list div:not([class]) {
        margin-top: 10.667vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dt {
        font-size: 3.734vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dd {
        margin-top: 4.267vw;
        font-size: 3.2vw;
        line-height: 2.084;
    }
    .l-guideline .p-guideline__list div:not([class]):not(:last-child) dd ul li {
        padding-left: 8vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social a {
        gap: 0 4.267vw;
        margin-top: 6.4vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social span:nth-of-type(1) {
        width: 4.267vw;
        height: 4.267vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social span:nth-of-type(2) {
        font-size: 3.734vw;
    }
    .l-guideline .p-guideline__list div:not([class]) dd .p-guideline__social span:nth-of-type(2) b {
        font-size: 3.734vw;
    }
    .l-guideline .c-link {
        margin-top: 18.667vw
    }
}


/* Animation */
.eachTextAnime {
    position: relative;
    overflow: hidden;
}
.eachTextAnime .split {
    display: inline-block;
    opacity: 0;
}
.eachTextAnime.appeartext .split { 
    animation: text_anime_on 1s ease-out forwards;
}
@keyframes text_anime_on {
	0% {
        opacity: 0;
        transform: translateY(100%);
    }
	100% {
        opacity: 1;
        transform: translateY(0);
    }
}

#index .float {
    position: absolute;
    top: 25vh;
    left: 0;
    padding-top: 60px;
}
#index .float.on { 
    animation: float_on 2s ease-out forwards;
}
@keyframes float_on {
	0% {
        top: 25vh;
    }
	100% {
        top: 0;
    }
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    #index .float {
        top: 25vh;
        padding-top: 4.688vw;
    }
    #index .float.on { 
        animation: float_on 2s ease-out forwards;
    }
    @keyframes float_on {
        0% {
            top: 25vh;
        }
        100% {
            top: 0;
        }
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    #index .float {
        top: 30vh;
        padding-top: 4.634vw;
    }
    #index .float.on { 
        animation: float_on 2s ease-out forwards;
    }
    @keyframes float_on {
        0% {
            top: 30vh;
        }
        100% {
            top: 0;
        }
    }
}
@media screen and (max-width: 767px) {
    #index .float {
        top: 20vh;
        padding-top: 16vw;
    }
    #index .float.on { 
        animation: float_on 2s ease-out forwards;
    }
    @keyframes float_on {
        0% {
            top: 20vh;
        }
        100% {
            top: 0;
        }
    }
}

/* .floatContent {
    transform: translateY(100%);
} */
.floatContent.on { 
    animation: float_anime_on 2s cubic-bezier(0,.96,.41,.99) forwards;
}
@keyframes float_anime_on {
	0% {
        transform: translateY(200%);
    }
	100% {
        transform: translateY(0);
    }
}


.fadeIn {
    opacity: 0;
    transition: 2s ease-in-out;
}
.fadeIn.show { 
    opacity: 1;
}
@media screen and (max-width: 767px) {
    .fadeIn {
        opacity: 0;
        transition: 1s ease-in-out;
    }
}

.fadeFirst {
    opacity: 0;
    transition: 2s ease-in-out;
}
.fadeFirst.show { 
    opacity: 1;
}
.fadeSecond {
    opacity: 0;
    transition: 1s ease-in-out 0.4s;
}
.fadeSecond.show { 
    opacity: 1;
}


.fadeInUp {
    opacity: 0;
    transform: translateY(2%);
}
.fadeInUp.on { 
    animation: fadeInUp_on 0.4s ease-out forwards;
}
@keyframes fadeInUp_on {
	0% {
        opacity: 0;
        transform: translateY(2%);
    }
	100% {
        opacity: 1;
        transform: translateY(0);
    }
}


/* 20230905 ADD */
.p-index-detail.off::before,
.p-index-detail.off::after {
    opacity: 0;
    visibility: hidden;
}
.p-index-detail.def::before {
    content: "";
    position: absolute;
    bottom: -60px;
    left: 0;
    width: 980px;
    height: 1px;
    background: #888383;
}
.p-index-detail.def::after {
    content: "";
    position: absolute;
    bottom: -60px;
    left: 0;
    height: 1px;
    background: var(--color-white);
    animation: bar-action 4s ease-in-out forwards;
}
@keyframes bar-action {
    0% {
        width: 0;
    }
    100% {
        width: 980px;
    }
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .p-index-detail.def::before {
        width: 76.563vw;
    }
    @keyframes bar-action {
        0% {
            width: 0;
        }
        100% {
            width: 76.563vw;
        }
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .p-index-detail.def::before {
        width: 76.564vw;
    }
    @keyframes bar-action {
        0% {
            width: 0;
        }
        100% {
            width: 76.564vw;
        }
    }
}
@media screen and (max-width: 767px) {
    .p-index-detail.def::before {
        width: 100%;
    }
    @keyframes bar-action {
        0% {
            width: 0;
        }
        100% {
            width: 100%;
        }
    }
}



/* 20240105 ADD */
.l-notfound {
    padding: 58px 0 150px;
}
.p-notfound__title {
    font-size: 80px;
    line-height: 1;
    letter-spacing: -0.02em;
    font-weight: 300;
    margin-left: -7px;
    color: var(--color-gray03);
}
.p-notfound__text {
    font-size: 25px;
    line-height: 1.32;
    font-weight: 500;
    color: var(--color-gray03);
}
.l-notfound .c-link {
    display: none;
    max-width: 100px;
    position: fixed;
    bottom: 285px;
    left: calc(calc(100vw - 980px)/2);
    transition: 0.4s;
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .l-notfound {
        padding: 4.532vw 0 11.719vw;
    }
    .p-notfound__title {
        margin-left: -0.73vw;
    }
    .p-notfound__text {
        line-height: 1.43;
    }
    .l-notfound .c-link {
        left: calc(23.437vw / 2);
    }
}

@media screen and (min-width: 768px) and (max-width: 820px) {
    .l-notfound {
        padding: 4.879vw 0 18.293vw;
    }
    .p-notfound__title {
        font-size: 9.756vw;
        margin-left: -0.73vw;
    }
    .p-notfound__text {
        font-size: 1.707vw;
        line-height: 1.43;
    }
    .l-notfound .c-link {
        left: calc(23.436vw / 2);
    }
}

@media screen and (max-width: 767px) {
    .l-notfound {
        padding: 8vw 0 41.067vw;
    }
    .p-notfound__title {
        font-size: 18.6vw;
    }
    .p-notfound__text {
        font-size: 5.32vw;
        line-height: 1.2;
    }
    .l-notfound .c-link {
        max-width: 250px;
        left: calc(15.733vw / 2);
    }
}

/* 404ではfooter fix化 */
.error404{
    width: 100vw;
    height: 100vh;
    overflow: hidden;
}

.error404 footer{
    position: fixed;
    width: 100%;
    bottom: 0;
}

.error404 .l-footer{
    box-sizing: border-box;
}


/* 20240716 ADD */
.l-awards {
    padding-block: 70px;
}
.p-awards__list {
    display: flex;
    flex-direction: column;
    row-gap: 30px;
    margin-top: 33px;
}
.p-awards__list dt {
    font-size: 14px;
    line-height: 1.715;
    font-weight: 500;
}
.p-awards__list dd {
    margin-top: 14px;
}
.p-awards__list dd p.f-pg {
    font-size: 14px;
    line-height: 1.715;
    font-weight: 300;
}
.p-awards__list dd p.f-a1 {
    font-size: 12px;
    line-height: 2;
    font-weight: 400;
}
@media screen and (min-width: 821px) and (max-width: 1280px) {
    .l-awards {
        padding-block: 5.469vw;
    }
    .p-awards__list {
        row-gap: 2.344vw;
        margin-top: 2.579vw;
    }
    .p-awards__list dt {
        font-size: 1.094vw;
    }
    .p-awards__list dd {
        margin-top: 1.094vw;
    }
    .p-awards__list dd p.f-pg {
        font-size: 1.094vw;
    }
    .p-awards__list dd p.f-a1 {
        font-size: 0.938vw;
    }
}
@media screen and (min-width: 768px) and (max-width: 820px) {
    .l-awards {
        padding-block: 6.096vw;
    }
    .p-awards__list {
        row-gap: 3.659vw;
        margin-top: 4.025vw;
    }
    .p-awards__list dt {
        font-size: 1.708vw;
    }
    .p-awards__list dd {
        margin-top: 1.708vw;
    }
    .p-awards__list dd p.f-pg {
        font-size: 1.708vw;
    }
    .p-awards__list dd p.f-a1 {
        font-size: 0.1.464vw;
    }
}
@media screen and (max-width: 767px) {
    .l-awards {
        padding-block: 11.734vw;
    }
    .p-awards__list {
        row-gap: 9.334vw;
        margin-top: 9.867vw;
    }
    .p-awards__list dt {
        font-size: 3.734vw;
    }
    .p-awards__list dd {
        margin-top: 3.734vw;
    }
    .p-awards__list dd p.f-pg {
        font-size: 3.734vw;
    }
    .p-awards__list dd p.f-a1 {
        font-size: 3.2vw;
    }
}