/* About・Benefit。スマホ版、PC版。 */

/* 全数値は元のraw宣言。QA未合格の外部候補。 */

@media (max-width: 1023px) {
  .sp-about-intro {
    height: 610px;
  }
}

@media (max-width: 1023px) {
  .sp-about-benefit {
    height: 625px;
  }
}

@media (max-width: 1023px) {
  .sp-about-intro figure {
    margin: 0;
  }
}

@media (max-width: 1023px) {
  .sp-about-leaves {
    position: absolute;
    z-index: 0;
    width: 116px;
    pointer-events: none;
    opacity: .86;
  }
}

@media (max-width: 1023px) {
  .sp-about-leaves--intro-top {
    right: -46px;
    top: 10px;
    width: 132px;
  }
}

@media (max-width: 1023px) {
  .sp-about-leaves--intro-bottom {
    left: -65px;
    top: 530px;
    width: 106px;
    transform: rotate(165deg);
  }
}

@media (max-width: 1023px) {
  .sp-about-leaves--benefit-top {
    left: -40px;
    top: -6px;
    width: 106px;
    transform: rotate(-12deg);
  }
}

@media (max-width: 1023px) {
  .sp-about-leaves--benefit-side {
    right: -40px;
    top: 354px;
    width: 100px;
    transform: scaleX(-1) rotate(15deg);
  }
}

@media (max-width: 1023px) {
  .sp-about-heading {
    position: absolute;
    top: 18px;
    left: 15px;
    right: 15px;
    padding-top: 26px;
    z-index: 2;
  }
}

@media (max-width: 1023px) {
  .sp-about-heading .script {
    left: 15px;
    font-size: 38px;
  }
}

@media (max-width: 1023px) {
  .sp-about-heading h2 {
    font-size: 27px;
    line-height: 1.3;
    font-weight: 900;
    text-align: center;
    letter-spacing: -.055em;
  }
}

@media (max-width: 1023px) {
  .sp-about-main-photo {
    position: absolute;
    top: 120px;
    left: 21px;
    width: 303px;
    height: 176px;
    transform: rotate(-1.5deg);
    z-index: 1;
  }
}

@media (max-width: 1023px) {
  .sp-about-main-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

@media (max-width: 1023px) {
  .sp-about-small-photo {
    position: absolute;
    left: 208px;
    top: 220px;
    width: 168px;
    height: 114px;
    transform: rotate(3deg);
    z-index: 3;
  }
}

@media (max-width: 1023px) {
  .sp-about-small-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

@media (max-width: 1023px) {
  .sp-about-small-photo::before {
    left: 58%;
  }
}

@media (max-width: 1023px) {
  .sp-about-furniture-note {
    position: absolute;
    bottom: 5px;
    right: 5px;
    left: 5px;
    margin: 0;
    background: rgba(255,255,255,.9);
    font: 500 10px/1.2 "Noto Sans JP", sans-serif;
    text-align: right;
  }
}

@media (max-width: 1023px) {
  .sp-about-family-cloud {
    position: absolute;
    left: 45px;
    top: 277px;
    z-index: 4;
    font-size: 13px;
    line-height: 1.45;
  }
}

@media (max-width: 1023px) {
  .sp-about-family-cloud > span {
    white-space: nowrap;
  }
}

@media (max-width: 1023px) {
  .sp-about-family-cloud::after {
    right: -30px;
    bottom: 8px;
    transform: rotate(-28deg);
  }
}

@media (max-width: 1023px) {
  .sp-about-features {
    position: absolute;
    left: 15px;
    right: 15px;
    top: 355px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: 52px;
    gap: 12px 10px;
    z-index: 2;
  }
}

@media (max-width: 1023px) {
  .sp-about-features li {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    font-size: 14.5px;
    font-weight: 700;
    line-height: 1.5;
    word-break: keep-all; /* 旧ブラウザ向けの既存fallback */
    word-break:auto-phrase;
  }
}

@media (max-width: 1023px) {
  .sp-about-feature-icon {
    display: grid;
    place-items: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border: 1px solid var(--c-camel);
    border-radius: 50%;
    color: var(--c-dusty-blue);
  }
}

@media (max-width: 1023px) {
  .sp-about-feature-icon .icon {
    width: 24px;
    height: 24px;
  }
}

@media (max-width: 1023px) {
  .sp-about-features .sp-num {
    font-size: 24px;
  }
}

@media (max-width: 1023px) {
  .sp-about-hours {
    white-space: nowrap;
    font-size: 14px;
  }
}

@media (max-width: 1023px) {
  .sp-about-promise {
    position: absolute;
    top: 547px;
    left: 42px;
    right: 15px;
    z-index: 2;
    font: 600 17px/1.45 "Klee One", sans-serif;
    text-align: center;
    white-space: nowrap;
  }
}

@media (max-width: 1023px) {
  .sp-about-promise > span {
    display: inline-block;
    position: relative;
  }
}

@media (max-width: 1023px) {
  .sp-about-promise > span::after {
    content: "";
    position: absolute;
    height: 7px;
    border-bottom: 2px solid var(--c-camel);
    border-radius: 0 0 50% 40%;
    left: -5px;
    right: -5px;
    bottom: -5px;
  }
}

@media (max-width: 1023px) {
  .sp-about-benefit-heading {
    position: absolute;
    top: 16px;
    left: 15px;
    right: 15px;
    padding-top: 26px;
    z-index: 2;
  }
}

@media (max-width: 1023px) {
  .sp-about-benefit-heading .script {
    left: 82px;
    font-size: 34px;
  }
}

@media (max-width: 1023px) {
  .sp-about-benefit-heading h3 {
    font-size: 23px;
    line-height: 1.3;
    font-weight: 900;
    text-align: center;
    letter-spacing: -.04em;
  }
}

@media (max-width: 1023px) {
  .sp-about-gift {
    position: absolute;
    top: 94px;
    left: 20px;
    right: 20px;
    height: 166px;
    padding: 14px 12px 0;
    text-align: center;
    transform: rotate(-.5deg);
  }
}

@media (max-width: 1023px) {
  .sp-about-paperclip {
    position: absolute;
    top: -12px;
    right: 2px;
    width: 12px;
    height: 29px;
    border: 1.5px solid var(--c-camel);
    border-radius: 7px;
    transform: rotate(28deg);
    z-index: 3;
  }
}

@media (max-width: 1023px) {
  .sp-about-paperclip::after {
    content: "";
    position: absolute;
    top: 3px;
    bottom: 3px;
    left: 3px;
    right: 2px;
    border-left: 1px solid var(--c-camel);
    border-bottom: 1px solid var(--c-camel);
    border-radius: 0 0 4px 4px;
  }
}

@media (max-width: 1023px) {
  .sp-about-gift-eyebrow {
    font-size: 17px;
    font-weight: 900;
    line-height: 1.4;
  }
}

@media (max-width: 1023px) {
  .sp-about-gift-name {
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 26px;
    font-weight: 900;
    line-height: 1.35;
    letter-spacing: -.055em;
    white-space: nowrap;
  }
}

@media (max-width: 1023px) {
  .sp-about-gift-value {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 5px;
    position: relative;
    padding-top: 0;
    border-top: 1px solid var(--c-camel);
    color: var(--c-terracotta);
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 22px;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
  }
}

@media (max-width: 1023px) {
  .sp-about-gift-value .sp-num {
    font-size: 72px;
    line-height: .98;
  }
}

@media (max-width: 1023px) {
  .sp-about-gift-value::before {
    content: "";
    position: absolute;
    width: 18px;
    height: 32px;
    top: 18px;
    background: linear-gradient(32deg,transparent 44%,var(--c-camel) 46% 51%,transparent 53%) left top/18px 10px no-repeat, linear-gradient(var(--c-camel),var(--c-camel)) left center/15px 1.5px no-repeat, linear-gradient(-32deg,transparent 44%,var(--c-camel) 46% 51%,transparent 53%) left bottom/18px 10px no-repeat;
    left: 3px;
  }
}

@media (max-width: 1023px) {
  .sp-about-gift-value::after {
    content: "";
    position: absolute;
    width: 18px;
    height: 32px;
    top: 18px;
    background: linear-gradient(32deg,transparent 44%,var(--c-camel) 46% 51%,transparent 53%) left top/18px 10px no-repeat, linear-gradient(var(--c-camel),var(--c-camel)) left center/15px 1.5px no-repeat, linear-gradient(-32deg,transparent 44%,var(--c-camel) 46% 51%,transparent 53%) left bottom/18px 10px no-repeat;
    right: 3px;
    transform: scaleX(-1);
  }
}

@media (max-width: 1023px) {
  .sp-about-benefit-houses {
    position: absolute;
    top: 239px;
    left: 7px;
    right: 7px;
    height: 110px;
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    align-items: end;
    gap: 0;
    z-index: 2;
    background: url("../assets/deco/watercolor-sky-trees-mobile.webp") center bottom/100% 120px no-repeat;
  }
}

@media (max-width: 1023px) {
  .sp-about-benefit-houses > div {
    position: relative;
    min-width: 0;
    height: 110px;
    display: flex;
    align-items: flex-end;
  }
}

@media (max-width: 1023px) {
  .sp-about-benefit-houses img {
    width: 100%;
    height: 105px;
    object-fit: contain;
    object-position: center bottom;
    filter: drop-shadow(3px 5px 4px rgba(34,57,92,.1));
  }
}

@media (max-width: 1023px) {
  .sp-about-benefit-houses .sp-badge {
    position: absolute;
    top: -1px;
    left: 0;
    z-index: 2;
    width: 30px;
    height: 30px;
  }
}

@media (max-width: 1023px) {
  .sp-about-benefit-houses .sp-badge .script {
    font-size: 12px;
  }
}

@media (max-width: 1023px) {
  .sp-about-benefit-houses .sp-badge .sp-num {
    font-size: 16px;
  }
}

@media (max-width: 1023px) {
  .sp-about-merits {
    position: absolute;
    left: 17px;
    right: 17px;
    top: 358px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
}

@media (max-width: 1023px) {
  .sp-about-merit {
    height: 120px;
    padding: 10px 8px 8px;
    text-align: center;
  }
}

@media (max-width: 1023px) {
  .sp-about-merit h4 {
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 17px;
    font-weight: 900;
    line-height: 1.35;
  }
}

@media (max-width: 1023px) {
  .sp-about-merit--fee > p:nth-child(2) {
    line-height: .95;
    border-bottom: 1px solid var(--c-camel);
    margin: 1px 8px 4px;
  }
}

@media (max-width: 1023px) {
  .sp-about-merit--fee > p:nth-child(2) .sp-num {
    font-size: 64px;
  }
}

@media (max-width: 1023px) {
  .sp-about-merit--fee > p:nth-child(2) > span:last-child {
    font-size: 24px;
    font-weight: 900;
  }
}

@media (max-width: 1023px) {
  .sp-about-merit--fee > p:last-child {
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
  }
}

@media (max-width: 1023px) {
  .sp-about-merit--loan > p:nth-child(2) {
    font-size: 12px;
    font-weight: 700;
    margin-top: 6px;
  }
}

@media (max-width: 1023px) {
  .sp-about-merit--loan > p:last-child {
    display: flex;
    justify-content: center;
    align-items: baseline;
    gap: 1px;
    margin-top: 7px;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
  }
}

@media (max-width: 1023px) {
  .sp-about-merit--loan > p:last-child .sp-num {
    font-size: 40px;
    letter-spacing: -.05em;
  }
}

@media (max-width: 1023px) {
  .sp-about-merit--loan > p:last-child > span:last-child {
    font-size: 15px;
  }
}

@media (max-width: 1023px) {
  .sp-about-benefit-note {
    position: absolute;
    top: 485px;
    left: 17px;
    right: 17px;
    font-size: 12px;
    line-height: 1.5;
    z-index: 2;
  }
}

@media (max-width: 1023px) {
  .sp-about-cta {
    position: absolute;
    top: 530px;
    left: 15px;
    right: 15px;
    z-index: 3;
  }
}

@media(max-width:1023px) {
  [data-artwork="callout-about-family"] {
    width:180px;
    height:80px;
  }
}

@media(max-width:1023px) {
  [data-artwork="comment-about-promise"] {
    height:55px;
  }
}

@media(max-width:1023px) {
  .sp-about-heading>[data-ornament="english-about"] {
    top:-12px;
    --orn-w:100px!important; /* 理由: 元inline切り抜き値より優先する既存装飾寸法 */
    --orn-h:38px!important; /* 理由: 元inline切り抜き値より優先する既存装飾寸法 */
    width:100px;
    height:38px;
  }
}

@media(max-width:1023px) {
  .sp-about-benefit-heading>[data-ornament="english-benefit"] {
    top:-14px;
    --orn-w:100px!important; /* 理由: 元inline切り抜き値より優先する既存装飾寸法 */
    --orn-h:40px!important; /* 理由: 元inline切り抜き値より優先する既存装飾寸法 */
    width:100px;
    height:40px;
  }
}

@media(max-width:1023px) {
  .sp-about-benefit-houses > div:first-child > .sp-badge {
    left:1px;
  }
}

@media (min-width: 1024px) {
  .pc-about {
    height: 960px;
  }
}

@media (min-width: 1024px) {
  .pc-about img {
    max-width: 100%;
  }
}

@media (min-width: 1024px) {
  .pc-about .pc-leaves {
    position: absolute;
    width: 180px;
    pointer-events: none;
    z-index: 1;
  }
}

@media (min-width: 1024px) {
  .pc-about-main::before {
    content: "";
    position: absolute;
    top: -10px;
    left: 42%;
    width: 72px;
    height: 23px;
    background: rgba(235,220,195,.86);
    transform: rotate(-3deg);
    z-index: 4;
  }
}

@media (min-width: 1024px) {
  .pc-about-inset::before {
    content: "";
    position: absolute;
    top: -10px;
    left: 42%;
    width: 72px;
    height: 23px;
    background: rgba(235,220,195,.86);
    transform: rotate(-3deg);
    z-index: 4;
  }
}

@media (min-width: 1024px) {
  .pc-about-main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

@media (min-width: 1024px) {
  .pc-about-inset img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}

@media (min-width: 1024px) {
  .pc-about-furniture-note {
    position: absolute;
    right: 8px;
    left: 8px;
    bottom: 8px;
    padding: 1px 3px;
    background: rgba(255,255,255,.95);
    text-align: right;
    font: 500 12px/1.35 "Noto Sans JP", sans-serif;
  }
}

@media (min-width: 1024px) {
  .pc-about-paperclip {
    position: absolute;
    top: -16px;
    right: 28px;
    width: 22px;
    height: 60px;
    background: url("../assets/deco/paperclip.svg") center/contain no-repeat;
    transform: rotate(17deg);
    z-index: 5;
  }
}

@media (min-width: 1024px) {
  .pc-about-leaves--top {
    left: -42px;
    top: 112px;
    transform: rotate(-12deg);
  }
}

@media (min-width: 1024px) {
  .pc-about-leaves--bottom {
    right: -90px;
    bottom: 70px;
    transform: rotate(14deg);
  }
}

@media (min-width: 1024px) {
  .pc-about-inset {
    position: absolute;
    padding: 8px;
    background: white;
    box-shadow: 0 6px 14px rgba(34,57,92,.12);
    left: 32.64%;
    top: 286px;
    width: 20.14%;
    height: 212px;
    transform: rotate(2.5deg);
    z-index: 4;
  }
}

@media (min-width: 1024px) {
  .pc-about-cloud > span {
    white-space: nowrap;
  }
}

@media (min-width: 1024px) {
  .pc-about-cloud {
    position: absolute;
    font: 600 clamp(17px,1.53vw,22px)/1.5 "Klee One", sans-serif;
    z-index: 5;
    text-align: center;
  }
}

@media (min-width: 1024px) {
  .pc-about-cloud::after {
    right: 17px;
    bottom: -18px;
    transform: rotate(98deg);
  }
}

@media (min-width: 1024px) {
  .pc-about-heading {
    position: absolute;
    left: 54.17%;
    right: 40px;
    top: 40px;
    padding-top: 64px;
    z-index: 2;
  }
}

@media (min-width: 1024px) {
  .pc-about-heading .script {
    left: -18px;
    font-size: 72px;
  }
}

@media (min-width: 1024px) {
  .pc-about-heading h2 {
    font-size: clamp(32px,3.33vw,48px);
    line-height: 1.27;
    font-weight: 900;
    letter-spacing: -.055em;
    white-space: nowrap;
  }
}

@media (min-width: 1024px) {
  .pc-about-heading h2 .accent {
    font-size: 1.12em;
  }
}

@media (min-width: 1024px) {
  .pc-about-features {
    position: absolute;
    top: 282px;
    left: 54.17%;
    right: 40px;
    display: grid;
    grid-template: repeat(3,60px)/1fr 1fr;
    grid-auto-flow: column;
    gap: 20px 28px;
    z-index: 3;
  }
}

@media (min-width: 1024px) {
  .pc-about-features::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: calc(50% - 1px);
    border-left: 1px dotted var(--c-camel);
  }
}

@media (min-width: 1024px) {
  .pc-about-features li {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
  }
}

@media (min-width: 1024px) {
  .pc-about-icon {
    display: grid;
    place-items: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: var(--c-dusty-blue);
    background: rgba(235,220,195,.62);
  }
}

@media (min-width: 1024px) {
  .pc-about-icon .icon {
    width: 27px;
    height: 27px;
  }
}

@media (min-width: 1024px) {
  .pc-about-features .pc-num {
    font-size: 30px;
    line-height: 1;
  }
}

@media (min-width: 1024px) {
  .pc-about-promise {
    position: absolute;
    left: 54.17%;
    right: 40px;
    font: 600 clamp(13px,1.39vw,20px)/1.7 "Klee One", sans-serif;
    white-space: nowrap;
    border-bottom: 1px solid var(--c-camel);
    z-index: 3;
  }
}

@media (min-width: 1024px) {
  .pc-about-gift {
    position: absolute;
    left: 2.78%;
    width: 50%;
    height: 378px;
    top: 556px;
    padding: 18px 24px 0;
    text-align: center;
    transform: rotate(-.6deg);
    z-index: 2;
  }
}

@media (min-width: 1024px) {
  .pc-about-gift-eyebrow {
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 26px;
    font-weight: 900;
    line-height: 1.4;
    display: inline-block;
    padding: 0 32px 8px;
    border-bottom: 1px solid var(--c-camel);
  }
}

@media (min-width: 1024px) {
  .pc-about-gift-name {
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: clamp(25px,2.23vw,32px);
    font-weight: 900;
    line-height: 1.3;
    white-space: nowrap;
  }
}

@media (min-width: 1024px) {
  .pc-about-gift-value {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 7px;
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 30px;
    font-weight: 900;
    line-height: 1;
  }
}

@media (min-width: 1024px) {
  .pc-about-gift-value .pc-num {
    font-size: 110px;
    line-height: 1;
  }
}

@media (min-width: 1024px) {
  .pc-about-gift-houses {
    position: absolute;
    bottom: 8px;
    left: 0;
    right: 0;
    height: 150px;
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 0;
    z-index: 2;
  }
}

@media (min-width: 1024px) {
  .pc-about-gift-houses > div {
    min-width: 0;
    height: 150px;
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background: url("../assets/deco/watercolor-sky-trees.webp") center bottom/100% 100% no-repeat;
  }
}

@media (min-width: 1024px) {
  .pc-about-gift-houses img {
    width: 100%;
    height: 142px;
    object-fit: contain;
    object-position: center bottom;
    filter: drop-shadow(2px 4px 3px rgba(34,57,92,.1));
  }
}

@media (min-width: 1024px) {
  .pc-about-gift-houses .pc-badge {
    position: absolute;
    left: 9px;
    top: -6px;
    width: 59px;
    height: 59px;
    z-index: 3;
  }
}

@media (min-width: 1024px) {
  .pc-about-gift-houses .pc-badge .script {
    font-size: 22px;
  }
}

@media (min-width: 1024px) {
  .pc-about-gift-houses .pc-badge .pc-num {
    font-size: 27px;
  }
}

@media (min-width: 1024px) {
  .pc-about-merits {
    position: absolute;
    left: 55.56%;
    right: 40px;
    top: 584px;
    display: grid;
    grid-template-columns: .93fr 1.07fr;
    gap: 18px;
    z-index: 2;
  }
}

@media (min-width: 1024px) {
  .pc-about-merit {
    height: 214px;
    padding: 18px 13px 10px;
    text-align: center;
  }
}

@media (min-width: 1024px) {
  .pc-about-merit h3 {
    font-size: 24px;
    font-weight: 900;
    line-height: 1.35;
    border-bottom: 1px solid var(--c-camel);
    padding-bottom: 9px;
    white-space: nowrap;
  }
}

@media (min-width: 1024px) {
  .pc-about-merit--fee > p:nth-child(2) {
    display: flex;
    justify-content: center;
    align-items: baseline;
    line-height: 1;
    margin-top: 0;
  }
}

@media (min-width: 1024px) {
  .pc-about-merit--fee > p:nth-child(2) > .pc-num {
    font-size: 110px;
    line-height: 1;
  }
}

@media (min-width: 1024px) {
  .pc-about-merit--fee > p:nth-child(2) > span:last-child {
    font-size: 34px;
    font-weight: 900;
  }
}

@media (min-width: 1024px) {
  .pc-about-merit--fee > p:last-child {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
  }
}

@media (min-width: 1024px) {
  .pc-about-merit--loan > p:nth-child(2) {
    font-size: 15px;
    font-weight: 700;
    margin-top: 12px;
  }
}

@media (min-width: 1024px) {
  .pc-about-merit--loan > p:last-child {
    display: flex;
    justify-content: center;
    align-items: baseline;
    white-space: nowrap;
    font-size: 18px;
    font-weight: 900;
    line-height: 1.1;
    margin-top: 12px;
  }
}

@media (min-width: 1024px) {
  .pc-about-merit--loan > p:last-child > .pc-num {
    font-size: clamp(48px,4.45vw,64px);
    letter-spacing: -.055em;
  }
}

@media (min-width: 1024px) {
  .pc-about-benefit-note {
    position: absolute;
    top: 810px;
    left: 55.56%;
    right: 40px;
    font-size: 12px;
    line-height: 1.5;
    z-index: 2;
  }
}

@media (min-width: 1024px) {
  .pc-about-cta {
    position: absolute;
    left: 55.56%;
    right: 40px;
    top: 850px;
    z-index: 5;
  }
}

@media (min-width: 1024px) {
  @media (max-width: 1279px) {
    .pc-about-features {
      gap: 20px 15px;
    }
  }
}

@media (min-width: 1024px) {
  @media (max-width: 1279px) {
    .pc-about-features li {
      gap: 7px;
      font-size: 14px;
    }
  }
}

@media (min-width: 1024px) {
  @media (max-width: 1279px) {
    .pc-about-inset {
      height: 180px;
      top: 305px;
    }
  }
}

@media (min-width: 1024px) {
  @media (max-width: 1279px) {
    .pc-about-merits {
      gap: 12px;
    }
  }
}

@media (min-width: 1024px) {
  @media (max-width: 1279px) {
    .pc-about-merit {
      padding-inline: 8px;
    }
  }
}

@media (min-width: 1024px) {
  @media (max-width: 1279px) {
    .pc-about-merit h3 {
      font-size: 20px;
    }
  }
}

@media (min-width: 1024px) {
  @media (max-width: 1279px) {
    .pc-about-gift-eyebrow {
      font-size: 22px;
    }
  }
}

@media(min-width:1024px) {
  .pc-about-heading>[data-pc-ornament] {
    top:-14px;
    --pc-word-w:230px;
    --pc-word-h:70px;
  }
}

@media(min-width:1024px) and (max-width:1250px) {
  .pc-about-heading>[data-pc-ornament] {
    --pc-word-w:200px;
    --pc-word-h:60px;
  }
}

@media(min-width:1024px) {
  .pc-about-promise[data-pc-artwork] {
    top:500px;
    height:58px!important; /* 理由: 同時適用するimportant宣言との元の勝者を維持: [data-pc-artwork] */
    --pc-art-fit-h:58px;
  }
}

@media (min-width: 1024px) {
  .pc-about-main {
    position: absolute;
    padding: 8px;
    background: white;
    box-shadow: 0 6px 14px rgba(34,57,92,.12);
    width: 44.45%;
    height: 426px;
    transform: rotate(-2.5deg);
    z-index: 2;
    left:calc(5.42% + 40px);
    top:92px;
  }
}

@media(min-width:1024px) {
  .pc-about-cloud[data-pc-artwork] {
    left:8px;
    top:10px;
    width:210px;
    height:130px!important; /* 理由: 同時適用するimportant宣言との元の勝者を維持: [data-pc-artwork] */
    --pc-art-fit-h:130px;
  }
}

@media (min-width:1024px) and (max-width:1279px) {
  .pc-about-main {
    width:40.9%;
    height:368px;
  }
}