@charset "UTF-8";

/* sass */
@import url("https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@400;500;700&display=swap");
.add-ucpet-product-all { margin-right: -20px; margin-left: -20px; padding: 20px 20px 30px; }

.add-ucpet-product-hdg-lv2 { margin-top: 40px; }

.add-ucpet-product-hdg-lv2 h2 { font-size: 2.4rem; display: flex; align-items: center; }

.add-ucpet-product-hdg-lv2.mgt0 { margin-top: 0; }

.add-ucpet-product-hdg-lv2.txt-c h2 { justify-content: center; }

.add-ucpet-product-hdg-lv2.icon-dog-food h2::before { content: ""; background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-dog-food.svg) no-repeat top left; background-size: contain; display: inline-block; margin-right: 8px; min-width: 48px; width: 48px; height: 48px; }

.add-ucpet-product-hdg-lv2.icon-dog-toiletcare h2::before { content: ""; background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-dog-toiletcare.svg) no-repeat top left; background-size: contain; display: inline-block; margin-right: 8px; min-width: 48px; width: 48px; height: 48px; }

.add-ucpet-product-hdg-lv2.icon-cat-food h2::before { content: ""; background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-cat-food.svg) no-repeat top left; background-size: contain; display: inline-block; margin-right: 8px; min-width: 48px; width: 48px; height: 48px; }

.add-ucpet-product-hdg-lv2.icon-cat-toiletcare h2::before { content: ""; background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-cat-toiletcare.svg) no-repeat top left; background-size: contain; display: inline-block; margin-right: 8px; min-width: 48px; width: 48px; height: 48px; }

.add-ucpet-product-box-all.mgb40-80 { margin-bottom: 40px; }

.add-ucpet-product-box-inner { box-shadow: 2px 2px 8px 0px #00000014; background-color: #fff; padding: 10px; }

.add-ucpet-product-box-inner > .uc-lyt-grid-col-flex { flex: auto; max-width: unset; padding: 0; }

.add-ucpet-product-box-inner > .uc-lyt-grid-col-flex > .uc-lyt-box-advance > .parsys { display: flex; }

.add-ucpet-product-box-inner > .uc-lyt-grid-col-flex > .uc-lyt-box-advance > .parsys > .section:has(.add-ucpet-product-l) { margin-left: 5px; width: calc(100% - 133px); }

.add-ucpet-product-box-inner > .uc-lyt-grid-col-flex > .uc-lyt-box-advance > .parsys > .section:has(.add-ucpet-product-r) { width: 133px; }

.add-ucpet-product-box-inner.vertical > .uc-lyt-grid-col-flex > .uc-lyt-box-advance > .parsys { flex-direction: column; }

.add-ucpet-product-box-inner .add-ucpet-product-r .food p { margin-bottom: 0; }

.add-ucpet-product-box-inner .add-ucpet-product-l { display: flex; flex-direction: column; height: 100%; }

.add-ucpet-product-box-inner .add-ucpet-product-txt-name p { font-weight: 700; font-size: 1.8rem; line-height: 1.5; }

.add-ucpet-product-box-inner .add-ucpet-product-txt-lead p { font-size: 1.4rem; line-height: 1.5; margin-top: 4px; }

.add-ucpet-product-box-inner .add-ucpet-product-link { margin-top: 20px; }

.add-ucpet-product-box-inner .add-ucpet-product-link > ul > li { list-style: none; }

.add-ucpet-product-box-inner .add-ucpet-product-link > ul > li > a { color: #1F23A8; font-weight: 700; display: flex; align-items: center; }

.add-ucpet-product-box-inner .add-ucpet-product-link > ul > li > a::before { content: ""; background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-arrow-sp-03.png) no-repeat top left; background-size: contain; display: inline-block; min-width: 11px; width: 11px; height: 11px; }

.CMP-CM40-grid-advance :has(> .add-ucpet-product-box-inner) { margin-top: 10px; }

.add-ucpet-w100.ttl-text img { width: 100%; }

.add-ucpet-mgt0-80 { margin-top: 0 !important; }

.add-ucpet-mgt80-120 { margin-top: 80px !important; }

.add-ucpet-bnbtn-list .uc-lyt-box-advance > .parsys > .section:has(> .add-ucpet-bnbtn) { margin-top: 10px; }

.add-ucpet-bnbtn-list .add-ucpet-bnbtn a { box-sizing: content-box; border: 1px solid #d9d9d9; display: block; position: relative; margin: 0 auto; width: 335px; height: 90px; }

.add-ucpet-bnbtn-list .add-ucpet-bnbtn a img { object-fit: cover; height: 90px; }

.add-ucpet-bnbtn-list .add-ucpet-bnbtn a::after { content: ''; width: 24px; height: 24px; display: block; background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/btn-next.png) no-repeat 0 0; background-size: contain; position: absolute; top: 0; bottom: 0; right: 10px; margin: auto; }

.add-ucpet-wrap-ranking-all { margin-bottom: 30px; }

.add-ucpet-wrap-ranking-all > .section:has(> .add-ucpet-wrap-ranking) { margin-top: 20px; }

.add-ucpet-wrap-ranking-all > .section:has(> .add-ucpet-wrap-ranking):first-child { margin-top: 0; }

.add-ucpet-wrap-ranking .add-ucpet-ranking-img { border: 1px solid #d9d9d9; margin-bottom: 12px; }

.add-ucpet-wrap-ranking .add-ucpet-ranking-img img { object-fit: cover; object-position: 95% 0; width: 100%; height: 216px; }

.add-ucpet-wrap-ranking .add-ucpet-ranking-content { display: flex; }

.add-ucpet-wrap-ranking .add-ucpet-ranking-content > .section { margin-right: 16px; }

.add-ucpet-wrap-ranking .content-inner .wrap-tag { display: flex; }

.add-ucpet-wrap-ranking .content-inner .wrap-tag > .section:has(.tag) + .section:has(.tag) { margin-left: 10px; }

.add-ucpet-wrap-ranking .content-inner .tag { background-color: #F27931; font-size: 1.2rem; line-height: 1.5; padding: 0 4px; }

.add-ucpet-wrap-ranking .content-inner .tag.col2 { background-color: #FBAE32; }

.add-ucpet-wrap-ranking .content-inner .txt { margin-top: 8px; }

.add-ucpet-wrap-ranking .content-inner .txt > p { font-size: 1.8rem; font-weight: bold; line-height: 1.3; }

.add-ucpet-wrap-ranking .num-ranking { background-color: #D5D6FB; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 7px 0 0 6px; min-width: 36px; min-height: 36px; width: 36px; height: 36px; }

.add-ucpet-wrap-ranking .num-ranking > p { font-size: 1.6rem; font-weight: bold; }

.add-ucpet-wrap-ranking .num-ranking.icn { background-color: unset; margin: 0; min-width: 48px; min-height: 48px; width: 48px; height: 48px; }

.add-ucpet-wrap-ranking .num-ranking.icn > p { font-size: 0; }

.add-ucpet-wrap-ranking .num-ranking.icn::before { content: ""; display: inline-block; width: 48px; height: 48px; }

.add-ucpet-wrap-ranking .num-ranking.icn.pt1 { background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-ranking01.svg) no-repeat top left; background-size: contain; }

.add-ucpet-wrap-ranking .num-ranking.icn.pt2 { background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-ranking02.svg) no-repeat top left; background-size: contain; }

.add-ucpet-wrap-ranking .num-ranking.icn.pt3 { background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-ranking03.svg) no-repeat top left; background-size: contain; }

.add-ucpet-sns-follow-wrap { padding: 0 35px; }

.add-ucpet-sns-follow-wrap .uc-sns-list > ul > li { padding: 0.5rem 0.6rem 0; }

.add-ucpet-disp-b-n { display: block; }

.add-ucpet-product-all-pt2 { margin-top: 0; padding: 20px 20px 30px; }

.add-ucpet-list-anchor { display: flex; flex-wrap: wrap; margin-left: -10px; }

.add-ucpet-list-anchor > li { background-color: #fff; border: 1px solid #D9D9D9; margin-top: 10px; margin-left: 10px; width: calc(50% - 10px); }

.add-ucpet-list-anchor > li:nth-child(-n+2) { margin-top: 0; }

.add-ucpet-list-anchor > li > a { display: flex; align-items: center; font-size: 1.2rem; line-height: 1.3; padding: 16px 30px 16px 10px; }

.add-ucpet-list-anchor > li .icon::before { content: ""; display: inline-block; margin-right: 10px; min-width: 32px; width: 32px; height: 32px; }

.add-ucpet-list-anchor > li .icon.dog-food::before { background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-dog-food.svg) no-repeat top left; background-size: contain; }

.add-ucpet-list-anchor > li .icon.dog-toiletcare::before { background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-dog-toiletcare.svg) no-repeat top left; background-size: contain; }

.add-ucpet-list-anchor > li .icon.cat-food::before { background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-cat-food.svg) no-repeat top left; background-size: contain; }

.add-ucpet-list-anchor > li .icon.cat-toiletcare::before { background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-cat-toiletcare.svg) no-repeat top left; background-size: contain; }

@media screen and (min-width: 769px) { .add-ucpet-disp-b-n { display: none; } .add-ucpet-product-all { margin-right: auto; margin-left: auto; max-width: 1240px; padding: 40px 40px 60px; }
  .add-ucpet-product-hdg-lv2 h2 { font-size: 2.4rem; }
  .add-ucpet-product-hdg-lv2.icon-dog-food h2::before { content: ""; background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-dog-food.svg) no-repeat top left; background-size: contain; display: inline-block; margin-right: 16px; min-width: 64px; width: 64px; height: 64px; }
  .add-ucpet-product-hdg-lv2.icon-dog-toiletcare h2::before { content: ""; background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-dog-toiletcare.svg) no-repeat top left; background-size: contain; display: inline-block; margin-right: 16px; min-width: 64px; width: 64px; height: 64px; }
  .add-ucpet-product-hdg-lv2.icon-cat-food h2::before { content: ""; background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-cat-food.svg) no-repeat top left; background-size: contain; display: inline-block; margin-right: 16px; min-width: 64px; width: 64px; height: 64px; }
  .add-ucpet-product-hdg-lv2.icon-cat-toiletcare h2::before { content: ""; background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/icon-cat-toiletcare.svg) no-repeat top left; background-size: contain; display: inline-block; margin-right: 16px; min-width: 64px; width: 64px; height: 64px; }
  .add-ucpet-product-box-all > .uc-lyt-grid-col-flex { flex: auto; max-width: unset; padding: 0; }
  .add-ucpet-product-box-all > .uc-lyt-grid-col-flex > .uc-lyt-box-advance > .parsys { display: flex; flex-wrap: wrap; margin-left: -30px; margin-top: -10px; }
  .add-ucpet-product-box-all > .uc-lyt-grid-col-flex > .uc-lyt-box-advance > .parsys > .section { display: flex; flex-direction: column; margin-left: 30px; width: calc(100% / 3 - 30px); }
  .add-ucpet-product-box-all.mgb40-80 { margin-bottom: 80px; }
  .add-ucpet-product-box-inner { align-items: center; flex-grow: 1; }
  .add-ucpet-product-box-inner > .uc-lyt-grid-col-flex { height: 100%; }
  .add-ucpet-product-box-inner > .uc-lyt-grid-col-flex > .uc-lyt-box-advance > .parsys { display: flex; height: 100%; }
  .CMP-CM40-grid-advance:has(> .add-ucpet-product-box-inner) { margin-top: 30px; }
  .add-ucpet-box-inner { max-width: 1030px; margin: 0 auto; }
  .add-ucpet-mgt0-80 { margin-top: 80px !important; }
  .add-ucpet-mgt80-120 { margin-top: 120px !important; }
  .add-ucpet-row1-2 > .uc-lyt-grid-col-flex > .uc-lyt-box-advance > .parsys { display: flex; flex-wrap: wrap; margin-left: -30px; }
  .add-ucpet-row1-2 > .uc-lyt-grid-col-flex > .uc-lyt-box-advance > .parsys > .section { margin-top: 30px; margin-left: 30px; width: calc(50% - 30px); }
  .add-ucpet-row1-2 > .uc-lyt-grid-col-flex > .uc-lyt-box-advance > .parsys > .section > .ttl-text { margin-bottom: 0; }
  .add-ucpet-row1-2 > .uc-lyt-grid-col-flex > .uc-lyt-box-advance > .parsys > .section > .ttl-text img { margin-top: 0; }
  .add-ucpet-row1-2 > .uc-lyt-grid-col-flex > .uc-lyt-box-advance > .parsys > .section .btn-03 a { display: block; padding: 0; }
  .add-ucpet-row1-2.jc-c > .uc-lyt-grid-col-flex > .uc-lyt-box-advance > .parsys { justify-content: center; }
  .add-ucpet-bnbtn-list .add-ucpet-bnbtn a { margin: 0; width: auto; height: auto; }
  .add-ucpet-bnbtn-list .add-ucpet-bnbtn a img { height: auto; }
  .add-ucpet-bnbtn-list .add-ucpet-bnbtn a::after { content: ''; width: 40px; height: 40px; }
  .add-ucpet-bnbtn-list .add-ucpet-bnbtn a:hover { border: 1px solid #1e22aa; color: #1e22aa; opacity: 1; }
  .add-ucpet-bnbtn-list .add-ucpet-bnbtn a:hover::after { background: url(/content/dam/sites/jp_unicharmpet_com/pet/share/btn-next-over.png) no-repeat 0 0/cover; }
  .add-ucpet-wrap-ranking-all { margin: 0 auto 0; width: 816px; }
  .add-ucpet-wrap-ranking-all > .section:has(> .add-ucpet-wrap-ranking) { margin-top: 10px; }
  .add-ucpet-wrap-ranking .parsys:has(> .section > .add-ucpet-ranking-img) { display: flex; }
  .add-ucpet-wrap-ranking .add-ucpet-ranking-img { margin-bottom: 0; width: 100%; height: 100%; }
  .add-ucpet-wrap-ranking .add-ucpet-ranking-img img { min-width: 287px; width: 287px; height: 186px; }
  .add-ucpet-wrap-ranking .add-ucpet-ranking-content { display: block; margin-left: 30px; position: relative; }
  .add-ucpet-wrap-ranking .add-ucpet-ranking-content > .section { margin-right: 0; }
  .add-ucpet-wrap-ranking .add-ucpet-ranking-content > .section > .content-inner { margin-top: -19px; }
  .add-ucpet-wrap-ranking .content-inner .wrap-tag { margin-left: 64px; }
  .add-ucpet-wrap-ranking .content-inner .tag { padding: 0 3px; }
  .add-ucpet-wrap-ranking .content-inner .txt { margin-top: 17px; }
  .add-ucpet-wrap-ranking .num-ranking { margin: 0; }
  .add-ucpet-product-all-pt2 { max-width: 1240px; padding: 40px 40px 60px; }
  .add-ucpet-list-anchor { flex-wrap: wrap; margin-left: -20px; }
  .add-ucpet-list-anchor > li { margin-top: 20px; margin-left: 20px; width: calc(25% - 20px); }
  .add-ucpet-list-anchor > li:nth-child(-n+4) { margin-top: 0; }
  .add-ucpet-list-anchor > li > a { justify-content: center; font-size: 1.4rem; padding: 23px; }
  .add-ucpet-btn-03 a { width: 100%; height: 104px; }
  .add-ucpet-btn-03 a * { display: block; width: 100%; height: 100%; }
  .add-ucpet-btn-03 a::after { right: 10px; }
  .add-ucpet-btn-03.full a { padding: 0; } }
