:root {
  --cl_cyan: #5CC5F2;
  --cl_red_sweet: #FF6060;
  --cl_main: #0F376E;
}

.p_work {
  position: relative;
  z-index: 0;
}

@media screen and (min-width: 768px) {
  .c_pmv .c_pmv__thumb {
    margin-top: 38px;
  }
}

@media screen and (min-width: 768px) {
  .c_mttl .c_mttl__ja {
    left: 5px;
  }
}

.p_work_mttl {
  font-weight: 500;
  letter-spacing: 0.05em;
  font-size: 1.75rem;
  line-height: 1.75;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p_work_mttl {
    position: relative;
    left: 5px;
    letter-spacing: 0.15em;
    font-size: clamp(1.75rem,
        5.8544303797vw + -1.0601265823rem,
        4.0625rem);
    line-height: 1.4;
  }
}

.p_work_catch {
  padding-inline: 40px;
  margin-top: 75px;
}
@media screen and (min-width: 768px) {
  .p_work_catch {
    margin-top: min(98px, 5.1041666667vw);
  }
}
.p_work_catch__txt {
  color: #000000;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-align: center;
  font-size: 1.125rem;
  line-height: 1.9444444444;
  margin-top: 22px;
}
@media screen and (min-width: 768px) {
  .p_work_catch__txt {
    font-size: clamp(1.125rem,
        1.582278481vw + 0.3655063291rem,
        1.75rem);
    line-height: 1.8571428571;
    margin-top: 36px;
  }
}

.p_work_nav {
  padding-inline: 23px;
  margin-top: 70px;
}
@media screen and (min-width: 768px) {
  .p_work_nav {
    margin-top: min(105px, 5.46875vw);
  }
}
.p_work_nav .c_work_nav__item:last-child .c_work_nav__button {
  font-feature-settings: "palt";
  letter-spacing: 0;
}
@media screen and (min-width: 768px) {
  .p_work_nav .c_work_nav__item:last-child .c_work_nav__button {
    font-feature-settings: normal;
  }
}

.p_work_tabs {
  max-width: 1517px;
  width: calc(100% - 42px);
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 63px;
}
@media screen and (min-width: 768px) {
  .p_work_tabs {
    padding-bottom: 137px;
  }
}

.p_work_tab:first-child {
  padding-top: 55px;
}
@media screen and (min-width: 768px) {
  .p_work_tab:first-child {
    padding-top: 122px;
  }
}
.p_work_tab:nth-child(2) {
  padding-top: 22px;
}
@media screen and (min-width: 768px) {
  .p_work_tab:nth-child(2) {
    padding-top: 39px;
    margin-bottom: -15px;
  }
  .p_work_tab:nth-child(2) .p_work_box__lists {
    margin-top: 85px;
  }
}
.p_work_tab:nth-child(2) .p_work_box__catch02 {
  letter-spacing: 0;
}
@media screen and (min-width: 768px) {
  .p_work_tab:nth-child(2) .p_work_box__catch02 {
    letter-spacing: 0.15em;
  }
}
.p_work_tab:nth-child(2) .sp_palt {
  font-feature-settings: "palt";
}
@media screen and (min-width: 768px) {
  .p_work_tab:nth-child(2) .sp_palt {
    font-feature-settings: normal;
  }
}
.p_work_tab:nth-child(2) .p_work_box__catch {
  letter-spacing: 0;
  line-height: 1.7222222222;
}
.p_work_tab:nth-child(3) {
  padding-top: 23px;
}
.p_work_tab:nth-child(3) .p_work_box:first-of-type {
  margin-top: 47px;
}
.p_work_tab:nth-child(3) .p_work_box:first-of-type .p_work_box__catch {
  letter-spacing: 0;
  margin-inline: -4px;
}
@media screen and (min-width: 768px) {
  .p_work_tab:nth-child(3) .p_work_box:first-of-type .p_work_box__catch {
    margin-inline: 0;
    letter-spacing: 0.15em;
  }
}
.p_work_tab:nth-child(3) .p_work_box:nth-of-type(2) .p_work_box__catch, .p_work_tab:nth-child(3) .p_work_box:nth-of-type(3) .p_work_box__catch {
  letter-spacing: 0.05em;
}
@media screen and (min-width: 768px) {
  .p_work_tab:nth-child(3) .p_work_box:nth-of-type(2) .p_work_box__catch, .p_work_tab:nth-child(3) .p_work_box:nth-of-type(3) .p_work_box__catch {
    margin-inline: 0;
    letter-spacing: 0.15em;
  }
}
@media screen and (min-width: 768px) {
  .p_work_tab:nth-child(3) {
    padding-top: 67px;
    margin-bottom: -25px;
  }
  .p_work_tab:nth-child(3) .p_work_box__lists {
    margin-top: 55px;
  }
  .p_work_tab:nth-child(3) .p_work_box:first-of-type {
    margin-top: 112px;
  }
}

.p_work_box + .p_work_box {
  margin-top: 65px;
}
@media screen and (min-width: 768px) {
  .p_work_box + .p_work_box {
    margin-top: clamp(5rem,
        9.4936708861vw + 0.4430379747rem,
        8.75rem);
  }
}
.p_work_box__ttl {
  font-size: 1.375rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
  font-weight: 600;
  letter-spacing: 0.05em;
  border: 2px solid #0F376E;
  border-radius: 19px;
  height: 45px;
  width: min(315px, 80.1526717557vw);
}
@media screen and (min-width: 768px) {
  .p_work_box__ttl {
    letter-spacing: 0.15em;
    border: 3px solid #0F376E;
    border-radius: 29.36px;
    width: 470px;
    height: 65px;
    font-size: clamp(1.375rem,
        0.6329113924vw + 1.0712025316rem,
        1.625rem);
  }
}
.p_work_box__ttl .sm {
  font-size: 1.125rem;
  letter-spacing: inherit;
}
@media screen and (min-width: 768px) {
  .p_work_box__ttl .sm {
    font-size: clamp(1.375rem,
        0.6329113924vw + 1.0712025316rem,
        1.625rem);
  }
}
.p_work_box__catch {
  text-align: center;
  font-weight: 500;
  color: #000000;
  letter-spacing: 0.15em;
  font-size: 1.125rem;
  line-height: 1.7222222222;
  margin-top: 25px;
}
@media screen and (min-width: 768px) {
  .p_work_box__catch {
    font-size: 1.3125rem;
    line-height: 1.9047619048;
    margin-top: 35px;
  }
}
@media screen and (min-width: 768px) {
  .p_work_box__catch.fz_28 {
    font-size: 1.75rem;
  }
}
.p_work_box__catch02 {
  text-align: center;
  font-weight: 500;
  color: #000000;
  font-size: 1.125rem;
  line-height: 1.7222222222;
  margin-inline: -25px;
  letter-spacing: 0.15em;
}
@media screen and (min-width: 768px) {
  .p_work_box__catch02 {
    margin-inline: 0;
    font-size: clamp(1.125rem,
        1.582278481vw + 0.3655063291rem,
        1.75rem);
    line-height: 1.8571428571;
  }
}
.p_work_box__lists {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3px;
  margin-top: 26px;
}
@media screen and (min-width: 768px) {
  .p_work_box__lists {
    gap: clamp(1.25rem,
        5.3797468354vw + -1.332278481rem,
        3.375rem);
    margin-top: 55px;
  }
}
.p_work_box__item {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}
.p_work_box__item:hover::before {
  opacity: 0.45;
  height: 150%;
}
.p_work_box__item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background: #0F376E;
  opacity: 0;
  mix-blend-mode: multiply;
  transition: 400ms ease;
  width: 100%;
  height: 100%;
  clip-path: polygon(0 0, 100% 0, 100% 78%, 0% 100%);
}
@media screen and (min-width: 768px) {
  .p_work_box__item::before {
    width: 100%;
    height: 50%;
  }
}
.p_work_box__img_box img {
  aspect-ratio: 1;
  object-fit: cover;
}
@media screen and (min-width: 768px) {
  .p_work_box__img_box img {
    aspect-ratio: 47/35;
  }
}

.p_work_lg {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.5s ease-in-out;
}
.p_work_lg.lg_open {
  opacity: 1;
  pointer-events: all;
  z-index: 100;
  position: relative;
}
.p_work_lg__container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.p_work_lg__content {
  position: relative;
  z-index: 1;
  height: fit-content;
  min-width: 1px;
  max-height: 52.8169014085vh;
  aspect-ratio: 350/450;
}
@media screen and (min-width: 768px) {
  .p_work_lg__content {
    aspect-ratio: 0;
    margin-left: auto;
    margin-right: auto;
    max-height: 765px;
    max-width: 1683px;
    width: calc(100% - 60px);
  }
}
.p_work_lg__content .swiper_control {
  border-radius: 50%;
  z-index: 1;
  top: 50%;
  width: 44px;
  height: 44px;
  background-color: #000;
}
@media screen and (min-width: 768px) {
  .p_work_lg__content .swiper_control {
    top: calc(50% + min(31px, 1.6145833333vw));
    transform: translateY(-50%);
  }
}
.p_work_lg__content .swiper_control::after {
  font-size: 0;
  width: 12px;
  height: 22px;
}
@media screen and (min-width: 768px) {
  .p_work_lg__content .swiper_control::after {
    width: min(36px, 1.875vw);
    height: min(62px, 3.2291666667vw);
  }
}
@media screen and (min-width: 768px) {
  .p_work_lg__content .swiper_control {
    width: clamp(3.125rem,
        10.917721519vw + -2.1155063291rem,
        7.4375rem);
    height: clamp(3.125rem,
        10.917721519vw + -2.1155063291rem,
        7.4375rem);
    background-color: rgba(0, 0, 0, 0.6);
  }
}
.p_work_lg__content .swiper-button-prev {
  left: -8px;
}
@media screen and (min-width: 768px) {
  .p_work_lg__content .swiper-button-prev {
    left: 0;
  }
}
.p_work_lg__content .swiper-button-prev::after {
  background-image: url("../images/common/icon_chev_left.svg");
  background-repeat: no-repeat;
  background-size: contain;
}
.p_work_lg__content .swiper-button-next {
  right: -8px;
}
@media screen and (min-width: 768px) {
  .p_work_lg__content .swiper-button-next {
    right: 0;
  }
}
.p_work_lg__content .swiper-button-next::after {
  background-image: url("../images/common/icon_chev_right.svg");
  background-repeat: no-repeat;
  background-size: contain;
}
.p_work_lg__slide {
  height: 100%;
  max-width: 350px;
  position: relative;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 768px) {
  .p_work_lg__slide {
    max-width: 1160px;
    width: calc(100% - clamp(7.5rem,
        13.0208333333vw + 1.25rem,
        16.875rem));
  }
}
.p_work_lg__slide_item {
  display: flex;
  justify-content: center;
  align-items: center;
  height: auto;
  max-height: 52.8169014085vh;
}
@media screen and (min-width: 768px) {
  .p_work_lg__slide_item {
    max-height: 765px;
  }
}
.p_work_lg__slide_item img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
  aspect-ratio: 350/450;
  border-radius: 20px;
}
@media screen and (min-width: 768px) {
  .p_work_lg__slide_item img {
    border-radius: unset;
    aspect-ratio: unset;
  }
}
.p_work_lg__slide .swiper {
  background-color: #000;
  max-width: 100%;
  height: 100%;
  border-radius: 20px;
}
@media screen and (min-width: 768px) {
  .p_work_lg__slide .swiper {
    border-radius: 0;
  }
}
.p_work_lg__close {
  position: absolute;
  z-index: 1;
  width: 15%;
  max-width: 53px;
  top: -85px;
  right: 2px;
}
@media screen and (min-width: 768px) {
  .p_work_lg__close {
    top: 0;
    right: 10px;
    max-width: 100px;
    width: clamp(2.5rem,
        9.4936708861vw + -2.0569620253rem,
        6.25rem);
    height: clamp(2.5rem,
        9.4936708861vw + -2.0569620253rem,
        6.25rem);
  }
}

.p_work_backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000000;
  mix-blend-mode: multiply;
  opacity: 0.67;
}
/*# sourceMappingURL=work.css.map */