@charset "UTF-8";

html {
  font-size: 62.5%;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

html::-webkit-scrollbar {
  display:none;
}

body {
  -webkit-tap-highlight-color: transparent;
}

#Wrap {
  width: auto;
}

#FooterWrap {
  position: relative;
  z-index: 1;
}

.p-feature {
  --base-font-color: #212121;
  --color-accent: #c35254;
  --color-bg: #FBFAF6;
  --color-secondary: #f8f0ea;
  --color-border: #b1b1b1;

  --lp-font-ja: "Zen Kaku Gothic New", sans-serif;
  --lp-font-en: "big-caslon-fb", serif;
  --lp-font-dialogue: "tk-takumi-okiraku-markertaip", sans-serif;
}


.lp_contents * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 1;
  letter-spacing: .05em;
}

.lp_contents {
  width: 100%;
  font-family: var(--lp-font-ja);
  color: var(--color_regular);
  overflow-x: clip;
  opacity: 0;
  transition: opacity 1s;
}

.lp_contents.active {
  opacity: 1;
}

.project-samplingcp {
  position: relative;
  z-index: 1;
  background: var(--color-bg);
  min-height: 100vh;
}

.lp_contents a {
  display: block;
}

.lp_contents a:hover {
  opacity: 1 !important;
}

.lp_contents img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}

.lp_contents sup {
  margin-right: calc(2 * (60rem / 390));
  font-size: calc(10 * (60rem / 390));
  letter-spacing: -.03em;
}

.lp_contents .txt_eng {
  font-family: var(--lp-font-en);
}

/*レスポンシブ対応-------------------------------*/
@media screen and (max-width: 1600px) and (min-width: 769px) {
  html {
    font-size: calc(10 * (100vw / 1600));
  }
}

@media screen and (max-width: 768px) {
  html {
    font-size: calc(10 * (100vw / 600));
  }
}
/*-------------------------------レスポンシブ＆タブレット対応*/

/*shareボタン、shareテキスト---------------------------*/
@media screen and  (max-width:768px) {
#share {
  z-index: 10 !important;
  transition: translate .3s;
  display: none !important;
}

#share.move {
  translate: 0 calc(-70 * (60rem / 390));
}

.share-txt {
  display: none;
}

.only_pc {
  display: none;
}

}
/*---------------------------shareボタン、shareテキスト*/

/*
.drawing {
  position: absolute;
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  width: 100%;
  scale: -1 1;
}
  */

.drawing_wrap {
  position: relative;
  z-index: 1;
  display: flex;
  justify-content: center;
}

.drawing {
  position: absolute;
  z-index: -1;
}

.drawing path {
  stroke-dasharray: 350;
  stroke-dashoffset: 350;
  fill: none;
  stroke: var(--color-accent);
  stroke-linecap: round;
  stroke-linejoin: round;
}

.drawing_wrap.active .drawing path {
  animation: line-stroke .8s linear forwards;
}

@keyframes line-stroke {
  0% {
    stroke-dashoffset: 350;
  }
  100% {
    stroke-dashoffset: 0;
  }
}

.main_nav .drawing {
  bottom: 0;
  right: 0;
  width: calc(80 * (60rem / 390));
}

.main_nav .drawing:nth-of-type(1) {
  margin: 0 calc(45 * (60rem / 390)) calc(-5 * (60rem / 390)) 0;
}

.main_nav .drawing:nth-of-type(2) {
  margin: 0 calc(40 * (60rem / 390)) calc(-9 * (60rem / 390)) 0;
}

.main_nav .drawing path {
  stroke-width: 2.5px;
}

.main_nav .drawing_wrap.active .drawing:nth-of-type(2) path {
  animation-delay: .2s;
}

#StaffManzaki .section-staff__catch .drawing {
  bottom: 0;
  left: 50%;
  translate: -50% 0;
  width: calc(310 * (60rem / 390));
  margin-bottom: calc(-2 * (60rem / 390));
}

#StaffManzaki .section-staff__catch .drawing path {
  stroke-width: 4px;
}

#StaffManzaki .section-staff__pick:nth-of-type(1) .section-staff__pick-tag .drawing {
  top: 0;
  left: 0;
  width: calc(65 * (60rem / 390));
}

#StaffManzaki .section-staff__pick:nth-of-type(1) .section-staff__pick-tag .drawing:nth-of-type(1) {
  margin: calc(27 * (60rem / 390)) 0 0 calc(160 * (60rem / 390));
}

#StaffManzaki .section-staff__pick:nth-of-type(1) .section-staff__pick-tag .drawing:nth-of-type(2) {
  margin: calc(30 * (60rem / 390)) 0 0 calc(165 * (60rem / 390));
}

#StaffManzaki .section-staff__pick:nth-of-type(1) .section-staff__pick-tag .drawing path {
  stroke-width: 2.5px;
}

#StaffManzaki .section-staff__pick:nth-of-type(1) .section-staff__pick-tag .drawing_wrap.active .drawing:nth-of-type(2) path {
  animation-delay: .3s;
}

#StaffManzaki .section-staff__pick:nth-of-type(1) .section-staff__pick-catch + .drawing {
  bottom: 0;
  left: 0;
  width: calc(170 * (60rem / 390));
  margin: 0 0 calc(13 * (60rem / 390)) calc(45 * (60rem / 390));
}

#StaffManzaki .section-staff__pick:nth-of-type(1) .section-staff__pick-catch + .drawing path {
  stroke-width: 3px;
}

#StaffManzaki .section-staff__pick:nth-of-type(1) .drawing_wrap.active .section-staff__pick-catch + .drawing path {
  animation-delay: .3s;
}

#StaffManzaki .section-staff__pick:nth-of-type(2) .section-staff__pick-tag .drawing {
  top: 0;
  left: 0;
  width: calc(60 * (60rem / 390));
  margin: calc(2 * (60rem / 390)) 0 0 calc(75 * (60rem / 390));
}

#StaffManzaki .section-staff__pick:nth-of-type(2) .section-staff__pick-tag .drawing path {
  stroke-width: 2px;
}

#StaffManzaki .section-staff__pick:nth-of-type(2) .section-staff__pick-catch + .drawing {
  bottom: 0;
  left: 0;
  width: calc(175 * (60rem / 390));
  margin: 0 0 calc(13 * (60rem / 390)) calc(15 * (60rem / 390));
}

#StaffManzaki .section-staff__pick:nth-of-type(2) .section-staff__pick-catch + .drawing path {
  stroke-width: 3px;
}

#StaffManzaki .section-staff__pick:nth-of-type(2) .drawing_wrap.active .section-staff__pick-catch + .drawing path {
  animation-delay: .3s;
}

#StaffTakada .section-staff__catch .drawing {
  bottom: 0;
  left: 50%;
  translate: -50% 0;
}

#StaffTakada .section-staff__catch .drawing:nth-of-type(1) {
  width: calc(280 * (60rem / 390));
  margin-bottom: calc(30 * (60rem / 390));
}

#StaffTakada .section-staff__catch .drawing:nth-of-type(2) {
  width: calc(180 * (60rem / 390));
  margin-bottom: calc(-2 * (60rem / 390));
}

#StaffTakada .section-staff__catch .drawing:nth-of-type(1) path {
  stroke-width: 4px;
}

#StaffTakada .section-staff__catch .drawing:nth-of-type(2) path {
  stroke-width: 3px;
}

#StaffTakada .section-staff__catch .drawing_wrap.active .drawing:nth-of-type(2) path {
  animation-delay: .4s;
}

#StaffTakada .section-staff__pick:nth-of-type(1) .each_pick_heading_wrap .drawing {
  top: 0;
  left: 0;
  width: calc(110 * (60rem / 390));
}

#StaffTakada .section-staff__pick:nth-of-type(1) .each_pick_heading_wrap .drawing:nth-of-type(1) {
  margin: calc(34 * (60rem / 390)) 0 0 calc(69 * (60rem / 390));
}

#StaffTakada .section-staff__pick:nth-of-type(1) .each_pick_heading_wrap .drawing:nth-of-type(2) {
  margin: calc(37 * (60rem / 390)) 0 0 calc(74 * (60rem / 390));
}

#StaffTakada .section-staff__pick:nth-of-type(1) .each_pick_heading_wrap .drawing path {
  stroke-width: 1.5px;
}

#StaffTakada .section-staff__pick:nth-of-type(1) .each_pick_heading_wrap .drawing_wrap.active .drawing:nth-of-type(2) path {
  animation-delay: .3s;
}

#StaffTakada .section-staff__pick:nth-of-type(2) .section-staff__pick-tag .drawing {
  bottom: 0;
  left: 0;
  width: calc(178 * (60rem / 390));
  margin: 0 0 calc(3 * (60rem / 390)) calc(20 * (60rem / 390));
}

#StaffTakada .section-staff__pick:nth-of-type(2) .section-staff__pick-tag .drawing path {
  stroke-width: 2.5px;
}

#StaffTakada .section-staff__pick:nth-of-type(2) .section-staff__pick-catch + .drawing {
  top: 0;
  left: 0;
  width: calc(105 * (60rem / 390));
  margin: calc(38 * (60rem / 390)) 0 0 calc(48 * (60rem / 390));
}

#StaffTakada .section-staff__pick:nth-of-type(2) .section-staff__pick-catch + .drawing path {
  stroke-width: 2px;
}

#StaffTakada .section-staff__pick:nth-of-type(2) .drawing_wrap.active .section-staff__pick-catch + .drawing path {
  animation-delay: .3s;
}

.section-staff__recommend .drawing_wrap:has(.section-staff__recommend-ttl) .drawing {
  top: 0;
  left: 50%;
  translate: -50% 0;
  width: calc(130 * (60rem / 390));
}

.section-staff__recommend .drawing_wrap:has(.section-staff__recommend-ttl) .drawing:nth-of-type(1) {
  margin: calc(23 * (60rem / 390)) 0 0 calc(-30 * (60rem / 390));
}

.section-staff__recommend .drawing_wrap:has(.section-staff__recommend-ttl) .drawing:nth-of-type(2) {
  margin: calc(26 * (60rem / 390)) 0 0 calc(30 * (60rem / 390));
}

.section-staff__recommend .drawing_wrap:has(.section-staff__recommend-ttl) .drawing path {
  stroke-width: 3px;
}

.section-staff__recommend .drawing_wrap.active:has(.section-staff__recommend-ttl) .drawing:nth-of-type(2) path {
  animation-delay: .3s;
}





/* ========================================================
                      * Mainvisual *
=========================================================== */
.project-samplingcp__hero {
  position: relative;
}

.project-samplingcp__hero .mv {
  position: relative;
}

.project-samplingcp__hero .mv figure {
  position: absolute;
  top: 0;
  left: 0;
}

.project-samplingcp__hero .mv .floating:nth-of-type(1) {
  animation: floating 4s ease-in-out infinite alternate;
}

.project-samplingcp__hero .mv .floating:nth-of-type(2) {
  animation: floating 4.4s ease-in-out infinite alternate-reverse;
}

.project-samplingcp__hero .mv .floating:nth-of-type(3) {
  animation: floating 3.8s ease-in-out infinite alternate;
}

.project-samplingcp__hero .mv .floating:nth-of-type(4) {
  animation: floating 3.6s ease-in-out infinite alternate-reverse;
}

@keyframes floating {
  0% {
    transform: translateY(calc(-3 * (60rem / 390)));
  }

  100% {
    transform: translateY(calc(3 * (60rem / 390)));
  }
}


.project-samplingcp__lead {
  margin: calc(35 * (60rem / 390)) 0;
  font-size: calc(15 * (60rem / 390));
  font-weight: 500;
  line-height: 2;
  text-align: center;
}

.main_nav {
  margin-top: calc(40 * (60rem / 390));
}

.project-samplingcp__intro-ttl {
  font-size: calc(18 * (60rem / 390));
  font-weight: 700;
  text-align: center;
}


.project-samplingcp__staff-preview {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(10 * (60rem / 390));
  margin-top: calc(25 * (60rem / 390));
  padding: 0 calc(20 * (60rem / 390));

  & a {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: calc(8 * (60rem / 390));
    height: calc(210 * (60rem / 390));
    border: solid var(--color-border) 1px;
    font-size: calc(15 * (60rem / 390));
    text-align: center;
    padding-bottom: calc(15 * (60rem / 390));
  }

  & a::before {
    position: absolute;
    bottom: 0;
    left: 50%;
    translate: -50% 0;
    width: calc(10 * (60rem / 390));
    height: calc(10 * (60rem / 390));
    margin-bottom: calc(13 * (60rem / 390));
    border-bottom: solid var(--base-font-color) 1px;
    border-right: solid var(--base-font-color) 1px;
    box-sizing: border-box;
    rotate: 45deg;
    content: "";
  }

  & figure {
    width: calc(90 * (60rem / 390));
    border-radius: 50%;
    overflow: clip;
  }

  & .txt_S {
    display: block;
    margin-bottom: calc(8 * (60rem / 390));
    line-height: 1.4;
    font-weight: 400;
  }

  & p {
    font-weight: 700;
  }
}

/* ========================================================
                      * Section: Staff *
========================================================= */
.section-staff {
  position: relative;
  padding-top: calc(60 * (60rem / 390));
  margin-top: calc(60 * (60rem / 390));
}

.section-staff::before {
  position: absolute;
  top: 0;
  left: 50%;
  translate: -50% 0;
  width: calc(350 * (60rem / 390));
  height: 1px;
  background: var(--color-border);
  content: "";
}

.section-staff__profile {
  display: flex;
  align-items: center;
  gap: calc(20 * (60rem / 390));
  padding: 0 calc(20 * (60rem / 390));

  & figure {
    width: calc(130 * (60rem / 390));
  }
}

.section-staff__profile-body {
  flex: 1;
}

.section-staff__profile-label {
  font-size: calc(24 * (60rem / 390));
  font-weight: 700;
}

.section-staff__profile-label .txt_eng {
  position: relative;
  padding-right: calc(32 * (60rem / 390));
  font-size: calc(20 * (60rem / 390));
  vertical-align: .1em;
}

.section-staff__profile-label .txt_eng::before {
  position: absolute;
  top: 50%;
  right: 0;
  translate: 0 -50%;
  width: calc(12 * (60rem / 390));
  height: 1px;
  margin-right: calc(10 * (60rem / 390));
  background: var(--base-font-color);
  content: "";
}

.section-staff__profile-shop {
  margin-top: calc(10 * (60rem / 390));
  font-size: calc(15 * (60rem / 390));
  font-weight: 500;
}

.section-staff__detail-link {
  position: relative;
  width: fit-content;
  margin-top: calc(10 * (60rem / 390));
  padding-right: calc(12 * (60rem / 390));
  font-size: calc(15 * (60rem / 390));
  font-weight: 800;
  color: var(--color-accent);
  text-decoration: underline;
}

.section-staff__detail-link::before {
  position: absolute;
  top: 50%;
  right: 0;
  translate: 0 -50%;
  width: calc(8 * (60rem / 390));
  height: calc(8 * (60rem / 390));
  margin-top: calc(1 * (60rem / 390));
  box-sizing: border-box;
  border-top: solid var(--color-accent) 1px;
  border-right: solid var(--color-accent) 1px;
  rotate: 45deg;
  content: "";
}

.section-staff__catch {
  width: calc(350 * (60rem / 390));
  margin: calc(15 * (60rem / 390)) auto calc(50 * (60rem / 390));
  padding: calc(25 * (60rem / 390)) calc(20 * (60rem / 390));
  border-radius: calc(10 * (60rem / 390));
  background: var(--color-secondary);
}

.section-staff__catch-ttl {
  font-family: var(--lp-font-dialogue);
  font-size: calc(25 * (60rem / 390));
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}

.section-staff__catch-txt {
  margin-top: calc(10 * (60rem / 390));
  font-size: calc(14 * (60rem / 390));
  line-height: 1.75;
  text-align: justify;
}

.section-staff__pick {
  position: relative;
  margin-top: calc(36 * (60rem / 390));
}

.section-staff__pick:nth-of-type(n+2) {
  margin-top: calc(70 * (60rem / 390));
}

.section-staff__bestcosme-badge {
  position: absolute;
  top: calc(-14 * (60rem / 390));
  right: 0;
  width: calc(60 * (60rem / 390));
  height: auto;
  z-index: 2;
}

.each_pick_heading_wrap {
  padding: 0 calc(20 * (60rem / 390));
}

.each_pick_heading {
  border: solid var(--color-border) 1px;
}

.section-staff__pick-tag {
  display: flex;
  border-bottom: solid 1px var(--color-border);
  height: calc(65 * (60rem / 390));
}

.section-staff__pick-tag .pick_num {
  display: block;
  width: calc(65 * (60rem / 390));
}

.section-staff__pick-tag-txt {
  flex: 1;
  display: flex;
  align-items: center;
  padding: 0 calc(20 * (60rem / 390));
  border-left: solid var(--color-border) 1px;
}

.section-staff__pick-tag-txt span {
  font-size: calc(17 * (60rem / 390));
  font-weight: 500;
  line-height: 1.4;
}

.section-staff__pick-catch {
  padding: calc(15 * (60rem / 390)) 0;
  font-family: var(--lp-font-dialogue);
  font-size: calc(22 * (60rem / 390));
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}

.each_pick_heading_wrap .notes {
  margin-top: calc(8 * (60rem / 390));
  font-size: calc(10 * (60rem / 390));
  opacity: .5;
  text-align: right;
}

.section-staff__pick-item {
  display: flex;
  align-items: center;
  gap: calc(10 * (60rem / 390));
  margin-top: calc(10 * (60rem / 390));
  padding: 0 calc(20 * (60rem / 390));

  & figure {
    width: calc(180 * (60rem / 390));
  }
}

.section-staff__pick-item.blockStack {
  flex-direction: column;
  justify-content: center;
  gap: calc(10 * (60rem / 390));
  margin-top: calc(25* (60rem / 390));

  & figure {
    width: calc(300 * (60rem / 390));
  }
}



.section-staff__recommend .section-staff__pick-item {
  gap: 0;
  justify-content: center;
  padding-right: calc(40 * (60rem / 390));

  & figure {
    width: calc(160 * (60rem / 390));
  }
}

.section-staff__pick-item-body {
  flex: 1;
}

.section-staff__recommend .section-staff__pick-item-body  {
  flex: 0 1 auto;
  width: fit-content;
}

.section-staff__pick-item-body.moveUp {
  padding-bottom: calc(20 * (60rem / 390));
}

.section-staff__pick-item-brand {
  font-family: var(--lp-font-en);
  font-size: calc(16 * (60rem / 390));
  font-weight: 700;
}

.section-staff__pick-item-brand.font-sans-serif {
  font-family: var(--lp-font-ja);
  font-weight: 500;
}

.section-staff__pick-item-name {
  margin-top: calc(6 * (60rem / 390));
  font-size: calc(16 * (60rem / 390));
  font-weight: 500;
  line-height: 1.3;
}

.section-staff__pick-item-body .flexStack {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(18 * (60rem / 390));
  margin-top: calc(8 * (60rem / 390));
}

.section-staff__pick-item-price {
  margin-top: calc(10 * (60rem / 390));
  font-size: calc(15 * (60rem / 390));
  font-weight: 500;
}

.section-staff__pick-item-body .flexStack .section-staff__pick-item-price {
  margin-top: 0;
}

.section-staff__pick-item-price .txt_S {
  margin-left: calc(3 * (60rem / 390));
  font-size: calc(10 * (60rem / 390));
}

.section-staff__buy-btn {
  display: grid !important;
  place-items: center;
  width: calc(90 * (60rem / 390));
  height: calc(30 * (60rem / 390));
  margin-top: calc(15 * (60rem / 390));
  padding-bottom: calc(2 * (60rem / 390));
  border-radius: calc(100 * (60rem / 390));
  background: var(--base-font-color);
  color: #fff;
  font-size: calc(15 * (60rem / 390));
  font-weight: 500;
  text-align: center;
}

.section-staff__pick-item-body .flexStack .section-staff__buy-btn {
  margin-top: 0;
}

.section-staff__howto_wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc(5 * (60rem / 390));
  margin-top: calc(30 * (60rem / 390));
}

.section-staff__howto_wrap figure {
  width: calc(90 * (60rem / 390));
}

.section-staff__howto {
  padding-bottom: calc(10 * (60rem / 390));
  font-size: calc(14 * (60rem / 390));
  line-height: 1.5;

  & span {
    display: block;
    margin-bottom: calc(10 * (60rem / 390));
    padding: calc(3 * (60rem / 390)) 0;
    border-radius: calc(3 * (60rem / 390));
    background: #ECD0BA;
    font-size: calc(13 * (60rem / 390));
    font-weight: 500;
    white-space: nowrap;
    text-align: center;
  }
}

.section-staff__mini-slider {
  margin-top: calc(16 * (60rem / 390));
  padding-bottom: calc(24 * (60rem / 390));

  & img {
    width: 100%;
    aspect-ratio: 350 / 230;
    border-radius: calc(6 * (60rem / 390));
    object-fit: cover;
  }
}

.section-staff__comment_wrap {
  padding-top: calc(10 * (60rem / 390));
}

.section-staff__recommend .section-staff__comment_wrap {
  padding-top: 0;
  overflow: clip;
}

.section-staff__comment_wrap .review_img {
  width: calc(160 * (60rem / 390));
  margin: calc(-10 * (60rem / 390)) 0 0 calc(15 * (60rem / 390));
  float: right;
}

.section-staff__recommend .section-staff__comment_wrap .review_img {
  margin-top: 0;
}

.section-staff__comment {
  margin-top: calc(20 * (60rem / 390));
  padding: calc(20 * (60rem / 390)) calc(20 * (60rem / 390)) calc(30 * (60rem / 390));
  background: var(--color-secondary);
}

.section-staff__comment .staff_img {
  float: left;
  width: calc(55 * (60rem / 390));
  margin-right: calc(10 * (60rem / 390));
  border-radius: 50%;
  overflow: clip;
}

.section-staff__comment p {
  padding-top: calc(10 * (60rem / 390));
  font-size: calc(15 * (60rem / 390));
  line-height: 1.75;
}

.section-staff__comment p .notes {
  opacity: .5;
  font-size: calc(10 * (60rem / 390));
  line-height: 1.3;
}

.section-staff__recommend .section-staff__comment p .notes  {
  display: flex;
  margin-top: calc(8 * (60rem / 390));
}

.section-staff__recommend {
  margin-top: calc(50 * (60rem / 390));
}

.section-staff__recommend-ttl {
  margin-bottom: calc(20 * (60rem / 390));
  font-size: calc(22 * (60rem / 390));
  font-weight: 700;
  text-align: center;
}

.section-staff__recommend-slider {
  position: relative;

  & .swiper-pagination {
    position: relative;
    margin-top: calc(15 * (60rem / 390));
  }

  & .swiper-pagination-bullet {
    width: calc(8 * (60rem / 390));
    height: calc(8 * (60rem / 390));
    margin: 0 calc(4 * (60rem / 390)) !important;
    border: solid var(--base-font-color) 1px;
    background: var(--base-font-color);
    opacity: 1;
  }

  & .swiper-pagination-bullet-active {
    background: transparent;
  }

  & .swiper-button-prev,
  & .swiper-button-next {
    top: calc(80 * (60rem / 390));
    width: calc(20 * (60rem / 390));
    height: calc(20 * (60rem / 390));
    border: none;
    background: none;
    rotate: 45deg;

    &::after {
      display: none;
    }
  }

  & .swiper-button-prev {
    left: calc(15 * (60rem / 390));
    border-bottom: solid var(--base-font-color) 1px;
    border-left: solid var(--base-font-color) 1px;
  }

   & .swiper-button-next {
    right: calc(15 * (60rem / 390));
    border-top: solid var(--base-font-color) 1px;
    border-right: solid var(--base-font-color) 1px;
  }

  & .swiper-slide {
    width: calc(390 * (60rem / 390));
    margin-right: calc(20 * (60rem / 390));
  }
}

/* ========================================================
                      * Section: SamplePresent *
========================================================= */
.project-samplingcp__present {
  margin-top: calc(40 * (60rem / 390));
  padding-top: calc(40 * (60rem / 390));
  text-align: center;
}

.project-samplingcp__present-ttl {
  margin-bottom: calc(-10 * (60rem / 390));
  font-family: var(--lp-font-en);
  font-size: calc(36 * (60rem / 390));
  font-weight: 700;
  letter-spacing: 0;
  color: var(--color-accent);
}

.project-samplingcp__present-band {
  padding: calc(40 * (60rem / 390)) calc(15 * (60rem / 390)) calc(50 * (60rem / 390));
  background: #EDD1BB;
}

.project-samplingcp__present-lead {
  font-size: calc(17 * (60rem / 390));
  font-weight: 500;

  & small {
    font-size: calc(10 * (60rem / 390));
  }
}

.project-samplingcp__present-card {
  margin-top: calc(15 * (60rem / 390));
  padding: calc(10 * (60rem / 390)) 0 calc(20 * (60rem / 390));
  border-radius: calc(16 * (60rem / 390));
  background: #fff;
}

.project-samplingcp__present-card-mark {
  font-size: calc(13 * (60rem / 390));
  font-style: italic;
  color: var(--color-accent);
}

.project-samplingcp__present-card-ttl {
  margin-top: calc(8 * (60rem / 390));
  margin-bottom: calc(20 * (60rem / 390));
  font-size: calc(19 * (60rem / 390));
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-accent);
}

.project-samplingcp__present-caution {
  margin-top: calc(8 * (60rem / 390));
  font-size: calc(11 * (60rem / 390));
  opacity: .5;
  text-align: right;
}

.project-samplingcp__present-set-label {
  position: relative;
  display: block;
  width: calc(100 * (60rem / 390));
  margin: calc(15 * (60rem / 390)) auto 0;
  padding: calc(4 * (60rem / 390)) 0;
  font-size: calc(12 * (60rem / 390));
}

.project-samplingcp__present-set-label::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: solid var(--base-font-color) 1px;
  opacity: .5;
  box-sizing: border-box;
  content: "";
}

.project-samplingcp__present-set-list {
  width: calc(300 * (60rem / 390));
  margin: calc(15 * (60rem / 390)) auto 0;
  font-size: calc(14 * (60rem / 390));

  & div + div {
    margin-top: calc(20 * (60rem / 390));
    padding-top: calc(20 * (60rem / 390));
    border-top: 1px dashed var(--color-border);
  }

  & dt {
    margin-bottom: calc(10 * (60rem / 390));
    font-family: var(--lp-font-en);
    font-weight: 700;
  }

  & dd {
    line-height: 1.4;
  }

  & dd:nth-of-type(n+2) {
    margin-top: calc(6 * (60rem / 390));
  }
}

/* ========================================================
                      * Section: CheckAgain *
========================================================= */
.project-samplingcp__checkagain {
  margin-top: calc(70 * (60rem / 390));
  padding-bottom: calc(60 * (60rem / 390));
}

.project-samplingcp__checkagain-ttl {
  margin-bottom: calc(20 * (60rem / 390));
  font-family: var(--lp-font-en);
  font-size: calc(20 * (60rem / 390));
  font-weight: 700;
  text-align: center;
}

.project-samplingcp__checkagain .project-samplingcp__staff-preview a {
  padding: calc(15 * (60rem / 390)) 0 0;
}

.project-samplingcp__checkagain .project-samplingcp__staff-preview a::before {
  bottom: auto;
  top: 0;
  rotate: -135deg;
  margin: calc(13 * (60rem / 390)) 0 0;
}


/* ========================================================
                      * Section *
========================================================= */

.fixed_nav {
  position: fixed;
  z-index: 3;
  bottom: 0;
  width: 100%;
  background: var(--color-bg);
  translate: 0 100%;
  transition: translate .3s;
}

.fixed_nav.active {
  translate: unset;
  box-shadow: 0 calc(-3 * (60rem / 390)) calc(6 * (60rem / 390)) rgba(0, 0, 0, .1);
}

.project-samplingcp__anchor-tab {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.project-samplingcp__anchor-tab li:nth-of-type(n+2) {
  border-left: 1px solid var(--color-border);
}

.project-samplingcp__anchor-tab li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: calc(8 * (60rem / 390));
  height: calc(70 * (60rem / 390));
  text-align: center;
}

.project-samplingcp__anchor-tab-copy {
  font-family: var(--lp-font-dialogue);
  font-size: calc(24 * (60rem / 390));
  font-weight: 700;
  letter-spacing: 0;
  color: var(--color-accent);
}

.project-samplingcp__anchor-tab-staff {
  font-size: calc(13 * (60rem / 390));
  font-weight: 700;

  & .txt_S {
    margin-right: calc(6 * (60rem / 390));
    font-size: calc(10 * (60rem / 390));
    font-weight: 400;
    vertical-align: .1em;
  }
}

.project-samplingcp__campaign-badge {
  position: fixed;
  z-index: 3;
  bottom: 0;
  right: 0;
  width: calc(78 * (60rem / 390));
  height: calc(78 * (60rem / 390));
  margin: 0 calc(10 * (60rem / 390)) calc(15 * (60rem / 390)) 0;
  padding-top: calc(5 * (60rem / 390));
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--color-accent);
  transition: translate .3s;
}

.project-samplingcp__campaign-badge.move {
  translate: 0 calc(-70 * (60rem / 390));
}

.project-samplingcp__campaign-badge p {
  color: #fff;
  font-family: var(--lp-font-en);
  font-size: calc(11 * (60rem / 390));
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  letter-spacing: 0;
}

.project-samplingcp__campaign-badge figure {
  width: calc(50 * (60rem / 390));
  margin-top: calc(-2 * (60rem / 390));
  filter: drop-shadow(0 calc(5 * (60rem / 390)) calc(6 * (60rem / 390))) rgba(0, 0, 0, .1);
}


/*PC------------------------------------------------------*/
@media screen and  (min-width:769px) {
  .only_sp {
    display: none !important;
  }

  .project-samplingcp {
    position: relative;
    z-index: 1;
    width: 60rem;
    min-height: 100vh;
    margin: -100vh auto 0;
    overflow: clip;
    box-shadow: 0 0 10px rgba(0, 0, 0, .2);
  }

  .fixed_area {
    position: sticky;
    top: 0;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 100vh;
    margin: 0 auto;
    background: var(--color-bg);
  }
  
  .fixed_left,
  .fixed_right {
    display: grid;
    place-items: center;
    width: calc((100% - 60rem) / 2);
    height: 100%;
  }

  .ttl_pc {
    width: 36rem;
  }

  .pc_nav .project-samplingcp__anchor-tab {
    display: block;
  }

  .pc_nav .project-samplingcp__anchor-tab li:nth-of-type(n+2) {
    border-top: solid var(--color-border) 1px;
    border-left: none;
  }

.pc_nav .project-samplingcp__anchor-tab li a {
  gap: 1rem;
  height: 12rem;
}

.pc_nav .project-samplingcp__anchor-tab-copy {
  font-size: 3.2rem;
}

.pc_nav .project-samplingcp__anchor-tab-staff {
  font-size: 1.7rem;

  & .txt_S {
    margin-right: .8rem;
    font-size: 1.5rem;
  }
}

.fixed_left .project-samplingcp__campaign-badge {
  position: static;
  width: 15rem;
  height: 15rem;
  margin: 4rem auto 0;
  padding-top: 1rem;
}

.fixed_left .project-samplingcp__campaign-badge p {
  font-size: 2rem;
}

.fixed_left .project-samplingcp__campaign-badge figure {
  width: 9rem;
  margin-top: 0;
}
}

/*------------------------------------------------------PC*/