.header {
  box-shadow: 0 3px 4px rgba(0, 0, 0, 0.05);
  padding: 0 50px;
  height: 74px;
}
.header .container {
  display: flex;
  background-color: var(--white);
  justify-content: space-between;
  align-items: center;
  height: 100%;
}

.header .brand {
  height: 25px;
}

.header .btn {
  background-color: var(--blue-dark);
  color: var(--white);
  height: 44px;
  line-height: 44px;
  padding: 0 32px;
  border-radius: 44px;
}

/* fv-section */
.fv-section {
  height: 565px;
}

.fv-section .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
}

.fv-section .heading-wrapper {
  display: flex;
  flex-direction: column;
}

.fv-section h1 {
  color: var(--blue-dark);
  line-height: 1.5;
  margin-bottom: 60px;
}

.fv-section .hashtag {
  margin-right: 8px;
}

.fv-section .video-container {
  padding-bottom: 30px;
}
.fv-section .video {
  height: 320px;
}

/* fv-bottom */
.fv-bottom-part {
  background-image: url('/assets/image/fv-bottom.svg');
  height: 15.642vw;
  width: 100%;
  background-size: 100% auto;
  background-repeat: no-repeat;
  position: relative;
}

.fv-bottom-part .image {
  position: absolute;
  left: 4vw;
  top: 50%;
  transform: translateY(-50%);
  height: 260px;
}

.fv-bottom-part h3 {
  position: absolute;
  left: 50%;
  top: calc(65%);
  transform: translate(-50%, -50%);
  color: var(--white);
}

/* effect-section */
.effect-section {
  padding: 100px 0 60px;
}

.effect-section .fukudashi-wrapper .desc {
  padding: 16px 46px 28px;
}

.effect-section .fukudashi-wrapper .desc p {
  line-height: 1.8;
}

/* question-part */
.question-part {
  background-image: url('/assets/image/question-bg.svg');
  height: 19.428vw;
  width: 100%;
  background-size: 100% auto;
  background-repeat: no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 50px;
}

/* combination-section */
.combination-section .one-point-sub-heading {
  margin-bottom: 70px;
}

.combination-section > .heading-wrapper {
  margin-bottom: 100px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.combination-section .first-heading {
  color: var(--blue-dark);
}

.combination1,
.combination2 {
  width: 100%;
  background-size: 100% auto;
  background-repeat: no-repeat;
}

.combination1 {
  background-image: url('/assets/image/combination1.png');
  margin-bottom: 50px;
}

.combination2 {
  background-image: url('/assets/image/combination2.png');
  margin-bottom: 20px;
}

.combination-desc-wrapper {
  height: 18.3vw;
  background-repeat: no-repeat;
  background-size: auto 100%;
  width: 27.57484vw;
  display: flex;
  justify-content: center;
  align-items: center;
}

.combination1 .combination-desc-wrapper {
  background-image: url('/assets/image/combination-desc1.svg');
  margin-left: auto;
  padding-left: 2.5%;
}

.combination2 .combination-desc-wrapper {
  background-image: url('/assets/image/combination-desc2.svg');
  margin-right: auto;
  padding-right: 2.5%;
}

.combination-desc-wrapper .desc {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  align-items: stretch;
}

.combination-desc-wrapper .desc .rect-block {
  /* margin-bottom: 0px; */
}

.combination-desc-wrapper .desc h3 {
  text-align-last: justify;
  color: var(--blue-dark);
  line-height: 1.8;
}

.combination-desc-wrapper .desc h3 .number-text {
  font-size: 2.2em;
}

.combination-section .down-arrow-wrapper {
  margin-bottom: 0;
}

.combination-complete {
  background-color: var(--blue-dark);
  color: var(--white);
  padding: 40px 0 60px;
  position: relative;
}

.combination-complete .heading {
  text-align: center;
  line-height: 2.4;
}

.combination-complete .number-text {
  font-size: 2.0rem;
  font-weight: 700;
}

.combination-complete .image {
  position: absolute;
  left: 3vw;
  top: 0px;
  transform: translateY(-50%);
  height: 280px;
}

/* cta1 */
.cta1 {
  background-color: var(--grey);
  padding: 48px 0;
}

.cta1 p {
  margin-bottom: 34px;
}

.cta1 .btn .icon {
  margin-right: 10px;
}

/* cta2 */
.cta2 {
  background-color: var(--blue);
  padding: 48px 0;
}

.cta2 p {
  color: var(--white);
  margin-bottom: 34px;
}

/* service-section */
.service-section {
  padding: 80px 0 120px;
}

.service-section > .heading-wrapper {
  margin-bottom: 120px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.service6-wrapper {
  position: relative;
  margin-bottom: 120px;
}

.service6 {
  border-radius: 50%;
  border: 3px solid var(--blue-dark);
  text-align: center;
  position: absolute;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: var(--grey-light);
  width: 340px;
  height: 340px;
  z-index: 2;
}

.service6 .image {
  margin-bottom: 24px;
}

.service6 .num-of-list {
  margin-right: 12px;
}

.service6 .heading {
  color: var(--blue-dark);
  margin-bottom: 24px;
  font-weight: 700;
}

.service6 p {
  color: var(--black-light);
  padding-bottom: 20px;
  line-height: 1.5;
}

.service6-wrapper .connection-lines {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.service6-wrapper .connection-lines path {
  stroke: var(--blue-dark);
  stroke-width: 3px;
  fill: none;
}

.service6-wrapper .heading-wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.service6-wrapper .heading-wrapper .icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding-bottom: 20px;
  z-index: -1;
}

.step-wrapper {
  position: relative;
  display: flex;
  margin-bottom: 120px;
  padding-right: 20px;
}

.step-wrapper .step {
  width: 100%;
  height: 80px;
  background-size: 100% auto;
  background-repeat: no-repeat;
  color: var(--white);
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-left: 10px;
}

.step-wrapper .step::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -20px; /* 三角形の位置を調節します。必要に応じて値を変更してください */
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 40px 0 40px 20px; /* 三角形のサイズを調節します。必要に応じて値を変更してください */
  transform: translateY(-50%);
  z-index: 9;
}

.step-wrapper .step1 {
  background-color: var(--blue-light);
  color: var(--blue-dark);
}

.step-wrapper .step1::after {
  border-color: transparent transparent transparent var(--blue-light);
}

.step-wrapper .step2 {
  background-color: var(--blue);
}

.step-wrapper .step2::after {
  border-color: transparent transparent transparent var(--blue);
}

.step-wrapper .step3 {
  background-color: var(--blue-dark);
}

.step-wrapper .step3::after {
  border-color: transparent transparent transparent var(--blue-dark);
}

.step-wrapper .step4 {
  background-color: var(--black);
}

.step-wrapper .step4::after {
  border-color: transparent transparent transparent var(--black);
}

/* ad-type-section */
.ad-type-section {
  padding: 120px 0;
  background-image: url('/assets/image/colored-bg.png');
  background-repeat: no-repeat;
  background-size: cover;
  text-align: center;
}

.ad-type-section .container {
  background-image: url('/assets/image/hexagon-box.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  padding: 60px 0 80px;
  position: relative;
}

.ad-type-section .heading-wrapper {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: var(--blue-dark);
}

.ad-type-section .heading-wrapper .heading {
  color: var(--white);
  line-height: 3;
  padding: 0 30px;
  white-space: nowrap;
}
.ad-type-section .desc {
  line-height: 2;
}

/* contact-section */
.contact-section {
  padding: 80px 0 100px;
}
.contact-section .heading-wrapper {
  background-color: var(--grey);
  padding: 40px 0;
  position: relative;
  margin-bottom: 100px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.contact-section .heading-wrapper .heading {
  color: var(--blue-dark);
  line-height: 2.5;
}

.contact-section .heading-wrapper .double-underline::before,
.contact-section .heading-wrapper .double-underline::after {
  background-color: var(--blue-dark);
}

.contact-section .heading-wrapper .down-arrow-wrapper {
  position: absolute;
}

.contact-section .heading-wrapper .down-arrow-wrapper:nth-of-type(1) {
  left: var(--s-main);
  top: -50px;
}

.contact-section .heading-wrapper .down-arrow-wrapper:nth-of-type(2) {
  right: var(--s-main);
  bottom: -50px;
}

/* footer */
.footer {
  background-color: var(--black);
  padding: 40px 0;
}
.footer .container {
  color: var(--white);
  display: flex;
  justify-content: space-between;
}