@charset "UTF-8";
/* CSS Document */
/* sub_main */
.sub_main {
  background-image: linear-gradient(34deg, rgba(218, 65, 151, 1) 16%, rgba(236, 147, 163, 1) 36%, rgba(255, 231, 175, 1) 76%);
  height: 110px;
  position: relative;
  &::before {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 50%;
    transform: translateX(-50%);
    background-image: url("../img/sub/sub_main_bg.webp");
    background-position: top center;
    background-repeat: no-repeat;
    width: 101%;
    height: 64px;
  }
}

/* sub_ttl */
.sub_ttl .inner {
  padding: 20px 40px 0;
  h1,
  .sub_ttl {
    font-size: var(--font-xl-minus);
    font-family: var(--font-family-mincho);
    letter-spacing: var(--letter-spacing-wider);
    line-height: var(--line-height-sm);
    font-weight: var(--font-weight-semi-mid);
  }
}

/* breadArea */
.breadArea .inner,
.breadArea02 .inner {
	display: flex;
	justify-content: flex-end;
	padding: 30px 40px;
	li {
		display: flex;
		justify-content: flex-start;
		&:first-of-type {
			position: relative;
			padding-right: 26px;
			&::before {
				content: ">";
				position: absolute;
				top: 0;
				right: 0;
			}
		}
	}
}
.breadArea .inner li:nth-of-type(2) {
	padding-left: 16px;
}
.breadArea02 .inner li {
	&:nth-of-type(2) {
		padding: 0 16px;
	}
	&:nth-of-type(3) {
		position: relative;
		padding-left: 26px;
		&::before {
			content: ">";
			position: absolute;
			top: 0;
			left: 0;
		}
	}
}
.breadArea .inner li,
.breadArea .inner li a,
.breadArea02 .inner li,
.breadArea02 .inner li a {
  font-family: var(--font-sm);
	color: var(--color-text);
}
.breadArea .inner li a:hover,
.breadArea02 .inner li a:hover {
	color: var(--color-secondary);
}

/* sub_inner */
.sub_inner {
	max-width: 1080px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}

@media screen and (max-width: 1000px) {
/* sub_main */
.sub_main {
  height: 90px;
  &::before {
    background-image: url("../img/sub/sub_main_bg_sp.webp");
    height: 44px;
  }
}

/* sub_ttl */
.sub_ttl .inner {
  padding: 60px 6vw 0;
  h1,
  .sub_ttl {
      font-size: clamp(1.75rem, 1.338rem + 2.06vw, 2.625rem);
    }
  }

/* breadArea */
  .breadArea,
  .breadArea02 {
    display: none;
  }

/* sub_inner */
	.sub_inner {
		width: 100%;
		max-width: 100%;
	}
}

@media screen and (max-width: 600px) {
/* sub_main */
  .sub_main {
    height: 86px;
    &::before {
      background-image: url("../img/sub/sub_main_bg_sp2.webp");
      height: 32px;
    }
  }

/* sub_ttl */
  .sub_ttl .inner {
    padding-top: 42px;
  }
}