@charset "UTF-8";

body { margin: 0; }

.l-container { width: 100%; }
.l-footer,.pc-footer { margin: 0; padding: 0; }
.l-container::after { content: ""; }
sup, sub { position: static; top: auto; }

html { scroll-behavior: smooth; font-size: 1.3333333vw; }

html.js-anim .js-reveal { opacity: 0; transition: opacity 1s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
html.js-anim .js-reveal.is-inview { opacity: 1; }
.is-noanim .js-reveal, .is-noanim .js-anime { transition: none !important; opacity: 1 !important; }
@media (prefers-reduced-motion: reduce) {
  html:not(.is-forceanim) .js-reveal, html:not(.is-forceanim) .js-anime { transition: none !important; opacity: 1 !important; }
  html:not(.is-forceanim) { scroll-behavior: auto; }

  html:not(.is-forceanim) .dog-tilt { animation: none; }
}

.feature { box-sizing: border-box; color: #4c4c4c; margin: 0 auto; position: relative; width: 100%;

  font-family: "Noto Sans JP", sans-serif;
  font-weight: 300; font-style: normal;
  font-size: 2rem;
  text-spacing-trim: space-all;
  line-break: strict;

  text-autospace: normal;
  background: #fff; }
.feature * { margin: 0; padding: 0; border: 0; vertical-align: baseline; box-sizing: border-box; scroll-margin-top: 50px; }
.feature h1, .feature h2, .feature h3, .feature h4, .feature h5, .feature h6,
.feature strong, .feature b { font-weight: inherit; }
.feature .pc { display: none; }
.feature a { color: #4c4c4c; text-decoration: none; }
@media (hover: hover) {
  .feature a img, .feature a:not(:has(img:not([alt=""]))), .feature button { transition: opacity .3s; }
  .feature a:has(img:not([alt=""])):hover img { opacity: .7; }
  .feature a:not(:has(img:not([alt=""]))):hover, .feature button:hover { opacity: .7; text-decoration: none; }
}
.feature img { display: block; vertical-align: bottom; max-width: 100%; height: auto; }
.feature ul { list-style: none; }

.feature .frame-main__inner { display: flow-root; width: 100%; margin: auto; background: #fff; }

.feature .intro__ttl, .feature .toc__num, .feature .ch-head__num, .feature .ch-head__ttl, .feature .sub-head {
  font-family: "ivypresto-display-1", serif; }

.feature { --ink-jp: .48em; --ink-jp175: .41em; --ink-jp135: .22em; --ink-jp115: .13em; --ink-ivy: .085em; }
.feature .intro__lead, .feature .intro__txt, .feature .ch-head__jp, .feature .sub-head__txt, .feature .card__catch {
  position: relative; top: calc(-1 * var(--ink-jp)); }
.feature .sub-head__txt.-lh135 { top: calc(-1 * var(--ink-jp135)); }
.feature .card__lead, .feature .card__body, .feature .card__howto > p, .feature .card__note {
  position: relative; top: calc(-1 * var(--ink-jp175)); }
.feature .card__term { position: relative; top: calc(-1 * var(--ink-jp115)); }
.feature .intro__ttl, .feature .ch-head__num, .feature .ch-head__ttl, .feature .sub-head {
  position: relative; top: calc(-1 * var(--ink-ivy)); }

.feature .sub-head > img { margin-top: var(--ink-ivy); }

.feature .fv { position: relative; }
.feature .fv > img { width: 100%; }
.feature .fv__logo { position: absolute; top: 6.09rem; left: 17.365rem; width: 42.391rem; }
.feature .fv__logo img { width: 100%; }

.feature .intro__ttl { font-weight: 300; font-size: 5.839rem; line-height: 1.118; letter-spacing: .08em; text-align: center; }

.feature .ls-none { letter-spacing: 0; }
.feature .ls-wide { letter-spacing: .03em; }

.feature .ls-comma { letter-spacing: .4em; }
.feature .intro__lead { font-size: 3rem; line-height: 1.93; text-align: center; }
.feature .intro__txt { font-size: 2.4rem; line-height: 1.93; text-align: center; }
.feature .intro__dogs { width: 57.579rem; margin-left: auto; margin-right: auto; }
.feature .intro__dogs img { width: 100%; }

.feature .toc { font-size: 1rem; }
.feature .toc__list { width: 75em; }
.feature .toc__link { position: relative; display: flex; align-items: center; height: 7.5em; color: #4c4c4c; }
.feature .toc__main { background: #f2e5da; padding-left: 10.57em; gap: 2.8em; }
.feature li:has(.toc__main) + li > .toc__main { box-shadow: inset 0 1px 0 #faf3eb; }
.feature .toc__num { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 2.26087em;
  font-weight: 300; font-size: 4.6em; line-height: 1.118; text-align: center; }
.feature .toc__en { font-size: 3.4em; line-height: 1.93; white-space: nowrap; }
.feature .toc__jp { font-size: 2.6em; line-height: 1.93; white-space: nowrap; }
.feature .toc__main::after { content: ""; position: absolute; right: 3.974em; top: 50%; width: 3.531em; height: 1.636em; margin-top: -.818em;
  background: url(../img/look-05.png) no-repeat center / contain; }

.feature .toc__sub { font-size: 2.6em; height: 2.88462em; line-height: 1.93; padding-left: 5.37692em; background: #fcf9f5; white-space: nowrap; }
.feature li:has(.toc__sub) + li > .toc__sub { box-shadow: inset 0 1px 0 #f2e5da; }
.feature .toc__sub::before { content: ""; position: absolute; left: 4.24192em; top: .89231em; width: .55769em; height: .55769em;
  background: url(../img/look-07.svg) no-repeat center / contain; }
.feature .toc__sub::after { content: ""; position: absolute; right: 4.63346em; top: 50%; width: .74154em; height: .34346em; margin-top: -.17173em;
  background: url(../img/look-08.svg) no-repeat center / contain; }

.feature .ch-head__num { font-weight: 300; font-size: 4.8rem; line-height: 1.118; text-align: center; }
.feature .ch-head__ttl { font-weight: 300; font-size: 7.5rem; line-height: 1.118; text-align: center; }
.feature .ch-head__ttl.-regular { font-weight: 400; line-height: 1.129; }
.feature .ch-head__jp { font-size: 3.2rem; line-height: 1.93; text-align: center; }
.feature .ch-head__jp.-tight { letter-spacing: -.04em; }

.feature .sub-head { position: relative; font-weight: 400; font-size: 4.5rem; line-height: 1.129; text-align: center; }

.feature .sub-head.-ls-wide { letter-spacing: .018em; }
.feature .sub-head .paw { position: absolute; top: var(--t); left: var(--l); width: 2.767rem; }
.feature .sub-head__txt { font-size: 2.6rem; line-height: 1.93; text-align: center; }
.feature .sub-head__txt.-lh135 { line-height: 1.35; }

.feature .photo { display: block; margin-left: auto; margin-right: auto; }
.feature .photo img { width: 100%; }
.feature .photo.-l { width: 68.5rem; }
.feature .photo.-m { width: 33.5rem; }
.feature .photo.-s { width: 22rem; }
.feature .photo-row { position: relative; display: flex; justify-content: space-between; width: 68.5rem; margin-left: auto; margin-right: auto; }
.feature .photo-row .photo { margin: 0; }
.feature .photo-wrap { position: relative; width: 68.5rem; margin-left: auto; margin-right: auto; }

.feature .dog-tilt { position: absolute; z-index: 1; top: var(--t); left: var(--l); width: var(--w);
  animation: dog-tilt .8s steps(2, end) 0s infinite alternate;
  pointer-events: none;  }
@keyframes dog-tilt { 0% { transform: rotate(4deg); } 100% { transform: rotate(-8deg); } }

.feature .btn { position: relative; display: flex; align-items: center; justify-content: center; width: 55rem; height: 8rem;
  margin-left: auto; margin-right: auto; background: #f2dcd1; color: #4c4c4c; font-size: 2.6rem; line-height: 1.93;
  font-weight: 400; }
.feature .btn::after { content: ""; position: absolute; right: 2.092rem; top: 50%; width: .893rem; height: 1.928rem; margin-top: -.964rem;
  background: url(../img/look-43.svg) no-repeat center / contain; }
.feature .btn.-s { width: 30.7rem; height: 6.5rem; font-size: 2.2rem; }
.feature .btn.-s::after { right: 2.06rem; }
.feature .btn.-form { background: #f2cabd; color: #424242; font-size: 3rem; }

.feature .sec-bg { display: flow-root; background: #f7f4ed; }
.feature .campaign { display: flow-root; background: #fcefed; }
.feature .campaign.-cream { background: #fceed9; }

.feature .items { display: flex; justify-content: space-between; width: 68.4rem; margin-left: auto; margin-right: auto; }
.feature .items__box { position: relative; width: 22rem; height: 25.7rem; border: max(1px, .1rem) solid #ddd; background: #fff; }
.feature .items__box a { position: absolute; inset: 0; display: block; }
.feature .items__box img { position: absolute; top: var(--t); left: var(--l); width: var(--w); }

.feature .brand { display: flex; justify-content: space-between; width: 68.504rem; margin-left: auto; margin-right: auto; }
.feature .brand__card { position: relative; width: 33.5rem; border: max(1px, .1rem) solid #ddd; background: #fff; }
.feature .brand__card.-tall { height: 66.9rem; }
.feature .brand__card.-short { height: 22.9rem; }
.feature .brand__logo img { position: absolute; top: var(--t); left: 50%; transform: translateX(-50%); width: var(--w); }
.feature .brand__photo { position: absolute; top: 9.99rem; left: 50%; transform: translateX(-50%); width: 31.338rem; }
.feature .brand__photo img { width: 100%; }
.feature .brand__btn { position: absolute; top: var(--t); left: 50%; margin-left: -15.35rem; }

.feature .card { display: flow-root; width: 71rem; margin-left: auto; margin-right: auto; background: #fff;
  border-radius: 2.8rem; }
.feature .card__catch { font-size: 3.6rem; line-height: 1.93; text-align: center; }
.feature .card__catch.-s { font-size: 2.6rem; letter-spacing: .004em; }
.feature .card__img { width: 58.569rem; margin-left: auto; margin-right: auto; }
.feature .card__img img { width: 100%; }
.feature .card__lead { font-size: 2.6rem; line-height: 1.75; letter-spacing: -.08em; text-align: center; }
.feature .card__body, .feature .card__howto, .feature .card__note { width: 66.5rem; margin-left: auto; margin-right: auto; line-height: 1.75; letter-spacing: .004em; }
.feature .card__body, .feature .card__howto { font-size: 2.4rem; }
.feature .card__note { font-size: 2.2rem; }
.feature .card__howto { position: relative; }

.feature .card__howto-lead { text-align: center; }
.feature .card__howto-steps { margin-top: 1.75em; }

.feature .card__howto-cont { display: block; margin-top: -.2083em; }
.feature .card__phones { position: absolute; top: 17.45rem; left: 42.19rem; width: 25.034rem; }
.feature .card__term { font-size: 2.4rem; line-height: 1.153; letter-spacing: .004em; text-align: center; }
.feature .em-red { color: #f00; }

.feature .label { display: flex; align-items: center; justify-content: center; height: 4rem; margin-left: auto; margin-right: auto;
  border: max(1px, .1rem) solid #666; border-radius: 2rem; background: #fff; color: #424242; font-size: 2.6rem; line-height: 1; }
.feature .label.-w257 { width: 25.694rem; }
.feature .label.-w190 { width: 19rem; }
.feature .label.-w390 { width: 38.951rem; }
.feature .label.-w196 { width: 19.632rem; }
.feature .label.-w374 { width: 37.439rem; }
.feature .label.-w332 { width: 33.199rem; }

.feature .acc__open, .feature .acc__close { display: flex; align-items: center; justify-content: center; width: 59.9rem; height: 7.4rem;
  margin-left: auto; margin-right: auto; border: max(1px, .1rem) solid #666; background: #fff; color: #424242;
  font-family: inherit; font-weight: 400; font-size: 2.6rem; letter-spacing: .004em; cursor: pointer;
  padding-bottom: .6rem; }
.feature .acc.is-open .acc__open { display: none; }

.feature .acc__open.-condensed { letter-spacing: -.09em; }

.feature .acc__panel .label { margin-top: 6.04rem; }
.feature .acc__panel .label.-first { margin-top: 6rem; }
.feature .acc__panel .label.-trail { margin-top: 9.89rem; }
.feature .acc__txt { width: 66.5rem; margin: 2.5rem auto 0; font-size: 2.2rem; line-height: 1.75; letter-spacing: .004em; }
.feature .acc__txt.-ls { letter-spacing: -.016em; }
.feature .acc__txt a { text-decoration: underline; }
.feature .acc__close { margin-top: 6rem; }

.feature .paw.p-l28 { --t: .8rem; --l: 9.673rem; }
.feature .paw.p-l29 { --t: .8rem; --l: 62.493rem; }
.feature .paw.p-l32 { --t: .83rem; --l: 18.404rem; }
.feature .paw.p-l33 { --t: .83rem; --l: 53.955rem; }
.feature .paw.p-l36 { --t: .72rem; --l: 14.119rem; }
.feature .paw.p-l37 { --t: .72rem; --l: 58.373rem; }
.feature .paw.p-l62 { --t: .92rem; --l: 16.118rem; }
.feature .paw.p-l63 { --t: .92rem; --l: 55.98rem; }
.feature .paw.p-l81 { --t: .78rem; --l: 23.346rem; }
.feature .paw.p-l82 { --t: .66rem; --l: 48.921rem; }
.feature .paw.p-l91 { --t: .7rem; --l: 6.765rem; }
.feature .paw.p-l92 { --t: .7rem; --l: 65.596rem; }
.feature .paw.p-l127 { --t: .91rem; --l: 11.16rem; }
.feature .paw.p-l128 { --t: .86rem; --l: 57.12rem; }
.feature .paw.p-l137 { --t: .91rem; --l: 9.279rem; }
.feature .paw.p-l138 { --t: .92rem; --l: 58.757rem; }
.feature .dog-tilt.p-dog-bell { --t: -6.09rem; --l: -0.442rem; --w: 9.223rem; }
.feature .dog-tilt.p-dog-rice { --t: -6.09rem; --l: -1.931rem; --w: 9.242rem; }
.feature .dog-tilt.p-dog-mugi { --t: .94rem; --l: 63.106rem; --w: 9.232rem; }
.feature .p-l100 { --t: 1.33rem; --l: 2.214rem; --w: 17.271rem; }
.feature .p-l97 { --t: 0rem; --l: 0rem; --w: 22rem; }
.feature .p-l99 { --t: .69rem; --l: 1.887rem; --w: 18.226rem; }
.feature .p-l105 { --t: 4.06rem; --w: 18.949rem; }
.feature .p-l106 { --t: 4.62rem; --w: 16.813rem; }
.feature .p-l120 { --t: 5.58rem; --w: 20.196rem; }
.feature .p-l119 { --t: 3rem; --w: 11.895rem; }
.feature .btn.p-t47_3 { --t: 47.3rem; }
.feature .btn.p-t55_83 { --t: 55.83rem; }
.feature .btn.p-t12_87 { --t: 12.87rem; }

.feature .dm-look01 { margin-top: 0.048rem; }
.feature .dm-txt05 { margin-top: 9.248rem; }
.feature .dm-txt06 { margin-top: 1.705rem; }
.feature .dm-txt07 { margin-top: 0.436rem; }
.feature .dm-look03 { margin-top: 5.145rem; }
.feature .dm-toc { margin-top: 8.979rem; }
.feature .dm-txt32 { margin-top: 15.396rem; }
.feature .dm-txt33 { margin-top: 1.864rem; }
.feature .dm-txt34 { margin-top: 0.549rem; }
.feature .dm-txt35 { margin-top: 2.39rem; }
.feature .dm-txt36 { margin-top: 1.179rem; }
.feature .dm-look30 { margin-top: 3.314rem; }
.feature .dm-look31 { margin-top: 5.988rem; }
.feature .dm-txt38 { margin-top: 14.462rem; }
.feature .dm-txt39 { margin-top: 0.937rem; }
.feature .dm-look34 { margin-top: 3.41rem; }
.feature .dm-look35 { margin-top: 6.009rem; }
.feature .dm-txt41 { margin-top: 14.428rem; }
.feature .dm-txt42 { margin-top: 1.21rem; }
.feature .dm-look38 { margin-top: 3.43rem; }
.feature .dm-row1 { margin-top: 1.22rem; }
.feature .dm-look42 { margin-top: 5.996rem; }
.feature .dm-s2top { margin-top: 14.999rem; }
.feature .dm-txt44 { margin-top: 14.454rem; }
.feature .dm-txt45 { margin-top: 2.559rem; }
.feature .dm-txt46 { margin-top: -1.626rem; }
.feature .dm-txt47 { margin-top: 4.175rem; }
.feature .dm-look46 { margin-top: 4.892rem; }
.feature .dm-look47 { margin-top: 6.042rem; }
.feature .dm-look49 { margin-top: 5.991rem; }
.feature .dm-s2end { margin-top: 14.998rem; }
.feature .dm-txt50 { margin-top: 14.471rem; }
.feature .dm-txt51 { margin-top: 1.974rem; }
.feature .dm-txt52 { margin-top: 0.464rem; }
.feature .dm-row2 { margin-top: 2.84rem; }
.feature .dm-row3 { margin-top: 1.499rem; }
.feature .dm-look55 { margin-top: 6.094rem; }
.feature .dm-look58 { margin-top: 6.02rem; }
.feature .dm-s4top { margin-top: 15.001rem; }
.feature .dm-txt55 { margin-top: 14.47rem; }
.feature .dm-txt56 { margin-top: 1.87rem; }
.feature .dm-txt57 { margin-top: 0.605rem; }
.feature .dm-txt58 { margin-top: 2.536rem; }
.feature .dm-txt59 { margin-top: 0.684rem; }
.feature .dm-row4 { margin-top: 3.372rem; }
.feature .dm-row5 { margin-top: 1.5rem; }
.feature .dm-look69 { margin-top: 6.011rem; }
.feature .dm-row6 { margin-top: 14.979rem; }
.feature .dm-look73 { margin-top: 6.028rem; }
.feature .dm-look75 { margin-top: 15rem; }
.feature .dm-row7 { margin-top: 1.5rem; }
.feature .dm-look78 { margin-top: 6rem; }
.feature .dm-txt63 { margin-top: 14.473rem; }
.feature .dm-txt64 { margin-top: 1.298rem; }
.feature .dm-look83 { margin-top: 3.443rem; }
.feature .dm-row8 { margin-top: 1.5rem; }
.feature .dm-look86 { margin-top: 1.5rem; }
.feature .dm-look87 { margin-top: 5.98rem; }
.feature .dm-look89 { margin-top: 6.045rem; }
.feature .dm-txt67 { margin-top: 14.47rem; }
.feature .dm-txt68 { margin-top: 1.257rem; }
.feature .dm-look93 { margin-top: 3.502rem; }
.feature .dm-items { margin-top: 1.201rem; }
.feature .dm-look101 { margin-top: 6rem; }
.feature .dm-s4end { margin-top: 15.002rem; }
.feature .dm-txt70 { margin-top: 14.475rem; }
.feature .dm-txt71 { margin-top: 1.928rem; }
.feature .dm-txt72 { margin-top: 0.502rem; }
.feature .dm-brand1 { margin-top: 2.77rem; }
.feature .dm-brand2 { margin-top: 6.5rem; }
.feature .dm-s6top { margin-top: 14.996rem; }
.feature .dm-txt79 { margin-top: 14.458rem; }
.feature .dm-txt80 { margin-top: 2.177rem; }
.feature .dm-txt81 { margin-top: 0.418rem; }
.feature .dm-c1top { margin-top: 6.937rem; }
.feature .dm-txt82 { margin-top: 9.539rem; }
.feature .dm-txt83 { margin-top: 1.157rem; }
.feature .dm-look129 { margin-top: 2.484rem; }
.feature .dm-txt84 { margin-top: 6.018rem; }
.feature .dm-look130 { margin-top: 4.44rem; }
.feature .dm-txt86 { margin-top: 2.5rem; }
.feature .dm-look131 { margin-top: 4.636rem; }
.feature .dm-txt88 { margin-top: 2.5rem; }
.feature .dm-look132 { margin-top: 9.736rem; }
.feature .dm-look134 { margin-top: 10rem; }
.feature .dm-c1end { margin-top: 15.004rem; }
.feature .dm-s6end { margin-top: 14.992rem; }
.feature .dm-s7top { margin-top: 0.003rem; }
.feature .dm-c2top { margin-top: 15rem; }
.feature .dm-txt91 { margin-top: 14.468rem; }
.feature .dm-txt92 { margin-top: 1.294rem; }
.feature .dm-txt93 { margin-top: 3.35rem; }
.feature .dm-lab3 { margin-top: 5.251rem; }
.feature .dm-txt97 { margin-top: 2.499rem; }
.feature .dm-txt98 { margin-top: 5.585rem; }
.feature .dm-look141 { margin-top: 4.524rem; }
.feature .dm-c2end { margin-top: 14.997rem; }
.feature .dm-s7end { margin-top: 15rem; }

.feature .dm-c1item { margin-top: 4.636rem; }
.feature .dm-look131 { margin-top: 6rem; }
.feature .dm-look132 { margin-top: 5.836rem; }
.feature .dm-look134 { margin-top: 6rem; }

@media screen and (min-width: 751px) {

  html { font-size: 0.476190vw; }

  .feature .pc { display: block; }
  .feature .sp { display: none; }
  .feature .frame > .pc { display: contents; }
  .feature { --pcu: 0.0714286vw; --rail-top: 80px; }

  .feature * { scroll-margin-top: 80px; }

  .feature .frame { display: flex; align-items: stretch; justify-content: center; }

  .feature .frame-main { flex: 0 0 auto; width: calc(500 * (100vw / 1400)); }

  .feature .frame-side { position: relative; flex: 1 1 0; min-width: 0; }
  .feature .frame-side__inner { position: sticky; top: var(--rail-top); height: calc(100vh - var(--rail-top)); }

  .feature .leftcont__thum { height: 100%; }
  .feature .leftcont__thum img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }

  .feature .frame-side.-toc { background: #f3ece2; }
  .feature .frame-side.-toc .frame-side__inner { display: flex; align-items: center; justify-content: center; }
  .feature .rail-toc { font-size: calc(4 * var(--pcu)); width: calc(340 * var(--pcu)); background: #fcf9f5;
    padding: calc(36 * var(--pcu)) calc(20 * var(--pcu)) calc(34 * var(--pcu)); }

  .feature .pc-tocgap { margin-top: -1.08rem; }
}