/*--------------------------------------------------------------------------*/
/*	section05-shija
/*--------------------------------------------------------------------------*/
.section05-shija {
  border-top: 1px solid #000;
  position: relative;
  padding: 160px 0;
  background-image: radial-gradient(at 0% 0%, #f2e5e3, #edc8be, #d8b5aa);
  overflow: hidden;
}
.section05-shija .site-width {
  display: flex;
  justify-content: space-between;
  gap: 24px;
}
.section05-shija .site-width > div {
  width: 48%;
}
.section05-shija .site-width .feature-text {
  display: inline-block;
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  z-index: 2;
  margin-bottom: 32px;
}
.section05-shija .site-width .feature-text .feature-decoration {
  display: flex;
  align-items: self-start;
  justify-content: space-between;
}
.section05-shija .site-width .feature-text .feature-decoration .icon01 {
  position: relative;
}
.section05-shija .site-width .feature-text .feature-decoration .icon01::after {
  content: "";
  width: 48px;
  height: 1px;
  background-color: #000;
  position: absolute;
  top: 16px;
  left: 12px;
}
.section05-shija
  .site-width
  .feature-text
  .feature-decoration
  .icon01
  .star-kyupeen[data-item="icon-01"]
  .icon-star {
  width: 32px;
  height: 32px;
}
.section05-shija
  .site-width
  .feature-text
  .feature-decoration
  > span:last-of-type {
  font-size: clamp(96px, 9.6vw, 128px);
  line-height: 1;
  font-family: "cofo-raffine", sans-serif;
  font-weight: bold;
  margin-right: -48px;
  opacity: 0.8;
}
.section05-shija .site-width .feature-text .feature-title .feature-copy {
  font-size: clamp(20px, 1.9vw, 24px);
  font-family: "Zen Old Mincho", serif;
  line-height: 1.8;
  margin-bottom: 32px;
}
.section05-shija .site-width .feature-text .feature-title > div {
  display: flex;
  margin-bottom: 24px;
}
.section05-shija .site-width .feature-text .feature-title > div h3 {
  font-size: clamp(64px, 6.4vw, 104px);
  font-family: "Bellefair", serif;
  letter-spacing: -4px;
  font-weight: 400;
  line-height: 1;
}
.section05-shija
  .site-width
  .feature-text
  .feature-title
  > div
  .peace-guarantee__sub {
  position: absolute;
  right: -56px;
  bottom: -20px;
}
.section05-shija .site-width span .feature-img {
  width: 100%;
  border-radius: 8px;
  border: 1px solid;
  box-shadow: 6px 6px 0 0 #000;
}
.section05-shija .site-width .feature-lead {
  line-height: 1.8;
  width: 64%;
  text-align: justify;
  top: -32px;
  position: relative;
}
.section05-shija .section05-01-shija {
  position: relative;
  margin-bottom: 160px;
}
.section05-shija .section05-01-shija::before {
  content: "";
  position: absolute;
  top: -12%;
  left: 70%;
  width: 90%;
  height: 90%;
  background-image: radial-gradient(at 40% 10%, #d86f56 20%, #dadabf, #b6cbc4);
  border-radius: 50%;
  filter: blur(64px);
  opacity: 0.8;
}
.section05-shija .section05-01-shija .concept-left {
  width: 65%;
  margin-bottom: 160px;
}
@media screen and (max-width: 832px) {
  .section05-shija .section05-01-shija .concept-left {
    margin-bottom: 80px;
  }
}
.section05-shija .section05-01-shija .concept-left > div:first-of-type {
  display: flex;
}
.section05-shija
  .section05-01-shija
  .concept-left
  > div:first-of-type
  .peace-guarantee__sub {
  position: absolute;
  top: -32px;
  left: -24px;
  z-index: 1;
}
.section05-shija .section05-01-shija .concept-left > div:first-of-type .icon02 {
  margin-top: 24px;
}
.section05-shija
  .section05-01-shija
  .concept-left
  > div:first-of-type
  .concept-left-title {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  font-size: clamp(112px, 10.4vw, 160px);
  line-height: 1;
  letter-spacing: -14px;
  font-family: "Bellefair", serif;
  color: #e2ddc8;
  filter: drop-shadow(0 0 4px #fb6026) drop-shadow(0 0 10px #fb6026);
  position: relative;
  z-index: 0;
  margin-bottom: 16px;
  margin-left: 0;
  margin-right: 48px;
}
.section05-shija
  .section05-01-shija
  .concept-left
  > div:first-of-type
  .concept-left-title::before {
  content: "CONCEPT";
  line-height: 1;
  position: absolute;
  top: 0;
  left: 0;
  color: transparent;
  -webkit-text-stroke: 1.6px rgb(254, 224, 224);
  text-stroke: 1.6px rgb(254, 224, 224);
  filter: drop-shadow(0 0 2px #fb6026) drop-shadow(0 0 2px #fb6026)
    drop-shadow(0 0 2px #fb6026) drop-shadow(0 0 2px #fb6026);
  z-index: 1;
}
.section05-shija
  .section05-01-shija
  .concept-left
  > div:first-of-type
  .concept-left-title::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 120%;
  background-image: radial-gradient(at 80% 80%, #f8ad9a 80%, #f0c8b7);
  border-radius: 50%;
  filter: blur(24px);
  opacity: 0.1;
  z-index: -1;
}
.section05-shija .section05-01-shija .concept-left .copy-design-container {
  margin-left: -16px;
  margin-bottom: 64px;
}
.section05-shija .section05-01-shija .concept-left .copy-design-container img {
  width: clamp(368px, 36vw, 480px);
  position: relative;
  z-index: 1;
}
.section05-shija .section05-01-shija .concept-left > p {
  margin-left: 32px;
  line-height: 1.8;
}
.section05-shija .section05-01-shija .concept-right {
  width: 35%;
  position: relative;
  left: -6%;
  top: 0%;
  /*----------------------------------*/
  /*	1088px */
  /*----------------------------------*/
  /*----------------------------------*/
  /*	960px */
  /*----------------------------------*/
}
.section05-shija .section05-01-shija .concept-right::before,
.section05-shija .section05-01-shija .concept-right::after {
  content: "";
  position: absolute;
  left: 40vw;
  width: 72vw;
  height: 40vw;
  border: 1px solid #000;
  border-radius: 50%;
  transform: translateX(-50%) rotate(-25deg) skewX(10deg);
}
.section05-shija .section05-01-shija .concept-right::before {
  top: 0vw;
  background: #fff;
  opacity: 0.3;
}
.section05-shija .section05-01-shija .concept-right::after {
  top: -2vw;
  background: transparent;
  opacity: 0.6;
}
.section05-shija .section05-01-shija .concept-right > div {
  position: absolute;
  z-index: 1;
  top: 6vw;
  right: -24vw;
  width: clamp(592px, 72vw, 1184px);
}
.section05-shija .section05-01-shija .concept-right > div img {
  width: 100%;
}
.section05-shija .section05-01-shija .concept-right > div::after {
  content: "";
  position: absolute;
  background-image: url("/wp/wp-content/uploads/feature/shija/section05-shija/circular-badge.webp");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 0;
  width: 214px;
  height: 214px;
  top: 100%;
  right: 40%;
}
@media screen and (max-width: 1088px) {
  .section05-shija .section05-01-shija .concept-right > div {
    top: 8vw;
    right: -28vw;
    transition: top 0.6s ease, right 0.6s ease, transform 0.6s ease;
  }
}
@media screen and (max-width: 960px) {
  .section05-shija .section05-01-shija .concept-right > div {
    top: 10vw;
    right: -36vw;
    transition: top 0.6s ease, right 0.6s ease, transform 0.6s ease;
  }
}
.section05-shija .section05-02-shija {
  align-items: flex-end;
}
.section05-shija .section05-02-shija .feature-text .feature-title h3 span {
  display: inline-block;
  color: #d86f56;
}
.section05-shija .section05-02-shija .feature-left {
  position: relative;
  width: 40%;
}
.section05-shija .section05-02-shija .feature-left::before {
  content: "";
  position: absolute;
  top: 40%;
  left: -24%;
  width: 256px;
  height: 256px;
  background: rgba(215, 110, 85, 0.5);
  border-radius: 50%;
  filter: blur(64px);
}
.section05-shija .section05-02-shija .feature-left::after {
  content: "";
  position: absolute;
  bottom: -16%;
  left: -24%;
  width: 240px;
  height: 240px;
  background: rgba(155, 115, 160, 0.2);
  border-radius: 50%;
  filter: blur(32px);
}
.section05-shija .section05-02-shija .feature-left div {
  margin-left: -202px;
}
.section05-shija .section05-02-shija .feature-left div img {
  width: 100%;
  z-index: 1;
  position: relative;
}
.section05-shija .section05-02-shija .feature-right {
  width: 50%;
  display: flex;
  flex-direction: column;
  position: relative;
}
.section05-shija .section05-02-shija .feature-right::before,
.section05-shija .section05-02-shija .feature-right::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  filter: blur(64px);
}
.section05-shija .section05-02-shija .feature-right::before {
  top: 14%;
  left: -16%;
  width: 240px;
  height: 240px;
  background: rgba(215, 110, 85, 0.3);
}
.section05-shija .section05-02-shija .feature-right::after {
  bottom: -30%;
  right: -35%;
  width: 320px;
  height: 320px;
  background: rgba(215, 111, 85, 0.4);
}
.section05-shija .section05-02-shija .feature-right > span::before,
.section05-shija .section05-02-shija .feature-right > span::after {
  content: "";
  position: absolute;
  width: 480px;
  height: 256px;
  border: 1px solid #000;
  border-radius: 50%;
  transform: translateX(-50%) rotate(-25deg) skewX(10deg);
  background: transparent;
  z-index: -1;
}
.section05-shija .section05-02-shija .feature-right > span::before {
  top: -22%;
  left: 75%;
}
.section05-shija .section05-02-shija .feature-right > span::after {
  top: -25%;
  left: 75%;
}
.section05-shija .section05-02-shija .feature-right > span .feature-img02 {
  position: relative;
  width: 100%;
  border: 1px solid #000;
  border-radius: 16px;
  box-shadow: 8px 8px 0px black;
  overflow: hidden;
}
.section05-shija .section05-02-shija .feature-right > span .feature-img02 img {
  width: 100%;
  display: block;
  border-radius: inherit;
  -o-object-fit: cover;
  object-fit: cover;
  transform: scale(1.2);
  transform-origin: 0% 50%;
}
.section05-shija .section05-02-shija .feature-right > span .icon01 {
  position: absolute;
  top: -32px;
  left: -32px;
}

/*----------------------------------*/
/*	767px */
/*----------------------------------*/
@media screen and (max-width: 767px) {
  .section05-shija {
    padding: 96px 0;
  }
  .section05-shija .site-width {
    flex-direction: column;
  }
  .section05-shija .site-width .feature-lead {
    width: 100%;
    top: 0px;
  }
  .section05-shija .site-width .feature-text {
    margin-bottom: 16px;
  }
  .section05-shija .site-width .feature-text .feature-title .feature-copy {
    margin-bottom: 16px;
  }
  .section05-shija
    .site-width
    .feature-text
    .feature-title
    > div
    .peace-guarantee__sub {
    right: -40px;
    bottom: -12px;
  }
  .section05-shija
    .site-width
    .feature-text
    .feature-title
    > div
    .peace-guarantee__sub
    img {
    width: 80px;
  }
  .section05-shija .section05-01-shija {
    margin-bottom: 80px;
  }
  .section05-shija .section05-01-shija .concept-left {
    width: 100%;
  }
  .section05-shija
    .section05-01-shija
    .concept-left
    > div:first-of-type
    .peace-guarantee__sub {
    top: -20px;
    left: -8px;
  }
  .section05-shija
    .section05-01-shija
    .concept-left
    > div:first-of-type
    .peace-guarantee__sub
    img {
    width: 64px;
  }
  .section05-shija
    .section05-01-shija
    .concept-left
    > div:first-of-type
    .icon02 {
    margin-top: 8px;
  }
  .section05-shija
    .section05-01-shija
    .concept-left
    > div:first-of-type
    .icon02
    .icon-container
    .line {
    width: 12px;
  }
  .section05-shija
    .section05-01-shija
    .concept-left
    > div:first-of-type
    .concept-left-title {
    font-size: 72px;
    letter-spacing: -8px;
    margin-right: 24px;
  }
  .section05-shija .section05-01-shija .concept-left .copy-design-container {
    margin-top: 268px;
    z-index: 1;
    position: relative;
  }
  .section05-shija
    .section05-01-shija
    .concept-left
    .copy-design-container
    .copy-design {
    font-size: 20px;
    line-height: 2.8;
  }
  .section05-shija
    .section05-01-shija
    .concept-left
    .copy-design-container
    .copy-design
    img {
    width: clamp(288px, 56vw, 512px);
  }
  .section05-shija .section05-01-shija .concept-left > p {
    margin-left: 0px;
    position: relative;
  }
  .section05-shija .section05-01-shija .concept-left > p br {
    display: none;
  }
  .section05-shija .section05-01-shija .concept-right {
    width: 100%;
    position: static;
  }
  .section05-shija .section05-01-shija .concept-right::before,
  .section05-shija .section05-01-shija .concept-right::after {
    left: 78vw;
    width: 88vw;
    height: 48vw;
  }
  .section05-shija .section05-01-shija .concept-right::before {
    top: 4vw;
  }
  .section05-shija .section05-01-shija .concept-right::after {
    top: 6vw;
  }
  .section05-shija .section05-01-shija .concept-right > div {
    top: 14vw;
    left: clamp(8px, 4.2vw, 48px);
  }
  .section05-shija .section05-01-shija .concept-right > div::after {
    width: 128px;
    height: 128px;
    top: 100%;
    left: 56vw;
  }
  .section05-shija .section05-01-shija .concept-right > div img {
    width: clamp(512px, 94vw, 752px);
  }
  .section05-shija .section05-02-shija {
    flex-direction: column-reverse;
  }
  .section05-shija .section05-02-shija .feature-left {
    width: 100%;
  }
  .section05-shija .section05-02-shija .feature-left div {
    margin-left: 0px;
  }
  .section05-shija .section05-02-shija .feature-right {
    width: 100%;
  }
  .section05-shija .section05-02-shija .feature-right > span::before,
  .section05-shija .section05-02-shija .feature-right > span::after {
    width: 256px;
    height: 160px;
  }
  .section05-shija .section05-02-shija .feature-right > span::before {
    top: -22%;
    left: 75%;
  }
  .section05-shija .section05-02-shija .feature-right > span::after {
    top: -25%;
    left: 75%;
  }
  .section05-shija .section05-02-shija .feature-right > span img {
    border-radius: 8px;
    filter: drop-shadow(4px 4px 0px black);
  }
  .section05-shija .section05-02-shija .feature-right > span img + .icon01 {
    position: absolute;
    top: -16px;
    left: -16px;
  }
  .section05-shija
    .section05-02-shija
    .feature-right
    > span
    img
    + .icon01
    .icon-star {
    width: 32px;
    height: 32px;
  }
}
/*----------------------------------*/
/*	640px */
/*----------------------------------*/
@media screen and (max-width: 640px) {
  .section05-shija .section05-01-shija .concept-left .copy-design-container {
    margin-top: 260px;
  }
  .section05-shija
    .section05-01-shija
    .concept-left
    .copy-design-container
    .copy-design
    img {
    width: clamp(272px, 56vw, 512px);
  }
}
/*----------------------------------*/
/*	430px */
/*----------------------------------*/
@media screen and (max-width: 430px) {
  .section05-shija .section05-01-shija .concept-right::before,
  .section05-shija .section05-01-shija .concept-right::after {
    left: 78vw;
    width: 88vw;
    height: 48vw;
  }
  .section05-shija .section05-01-shija .concept-right::before {
    top: 24vw;
  }
  .section05-shija .section05-01-shija .concept-right::after {
    top: 22vw;
  }
  .section05-shija .section05-01-shija .concept-right > div {
    top: 24vw;
    right: -56vw;
  }
  .section05-shija .section05-01-shija .concept-right > div::after {
    width: 128px;
    height: 128px;
  }
  .section05-shija .section05-01-shija .concept-right > div img {
    width: 78%;
  }
}
/*----------------------------------*/
/*	375px */
/*----------------------------------*/
@media screen and (max-width: 375px) {
  .section05-shija .section05-01-shija .concept-right > div {
    top: 32vw;
    right: -70vw;
  }
  .section05-shija .section05-01-shija .concept-right > div::after {
    width: 128px;
    height: 128px;
    top: 100%;
    right: 42%;
  }
  .section05-shija .section05-01-shija .concept-right > div img {
    width: 72%;
  }
} /*# sourceMappingURL=concept.css.map */