@charset "UTF-8";


/* sass */
/* -------------------------------------------------------------------------------------- frecious共通パーツ（追加） --------------------------------------------------------------------------------------- */
@import url("https://fonts.googleapis.com/css2?family=Shippori+Mincho+B1:wght@400;500;600&display=swap");
.uc-page-header.fixed { position: static; }

.l-head > .l-inner { max-width: 1920px; margin-inline: auto; }

.l-head .head-top { padding: 8px 190px 7px; background: #FFF; }

.l-head .head-top .corp-logo { text-align: left; line-height: 1; }

.l-head .head-top .corp-logo a { display: inline-block; }

.l-head .head-top .corp-logo img[src$='.svg'], .l-head .head-top .corp-logo img { width: 90px; height: auto; }

.l-head .head-main { position: relative; padding: 22px 128px; }

.l-head .head-main .hdg-logo a { transition: all 0.3s; }

.l-head .head-main .hdg-logo a:hover { opacity: 0.75; }

.l-head .head-main .hdg-logo img { width: 190px; height: auto; text-align: center; }

.l-head .menu-wrap { display: flex; justify-content: center; margin-top: 40px; }

.l-head .menu-wrap .wrap-list + .wrap-list { margin-left: 60px; }

.l-head .menu-wrap .wrap-list .list-ttl { color: #fff; font-size: 2rem; font-family: "Shippori Mincho B1", serif; font-weight: 500; text-align: center; background: #000; border-top: 1px solid #c7b17b; padding: 6px; margin-bottom: 30px; }

.l-head .menu-wrap .wrap-list .list-ttl.pt-dog { background: #d5522a; }

.l-head .menu-wrap .wrap-list .list-ttl.pt-cat { background: #ca3f4b; }

.l-head .menu-wrap .wrap-list .list-lead { display: block; padding: 20px; border-bottom: 1px solid #a67f54; margin-bottom: 20px; }

.l-head .menu-wrap .wrap-list .list-link { display: block; }

.l-head .menu-wrap .wrap-list .list-link::after { content: ""; display: inline-block; width: 16px; height: 16px; background: url(/content/dam/sites/jp_unicharmpet_com/frecious/css/icon_arw_br.png); background-size: contain; margin-left: 5px; }

.l-head .menu-wrap .wrap-list .list-category { display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 0.5fr); grid-column-gap: 30px; grid-row-gap: 30px; }

.l-head .menu-wrap .wrap-list .list-category .category1 { grid-area: 1 / 1 / 2 / 2; }

.l-head .menu-wrap .wrap-list .list-category .category2 { grid-area: 1 / 2 / 2 / 3; }

.l-head .menu-wrap .wrap-list .list-category .category3 { grid-area: 2 / 2 / 3 / 3; }

.l-head .menu-wrap .wrap-list .list-category.pt-cat { display: block; }

.l-head .menu-wrap .wrap-list .list-menu { color: #3c3c3c; font-size: 1.8rem; font-family: "Shippori Mincho B1", serif; font-weight: 500; min-width: 300px; }

.l-head .menu-wrap .wrap-list .list-menu > li * { display: block; margin: 10px 0; }

.l-head .menu-btn { position: absolute; top: 0; right: 65px; bottom: 0; margin: auto; font-size: 0; height: 52px; }

.l-head .menu-btn span { display: block; width: 52px; height: 3px; background: #4c0000; }

.l-head .menu-btn:before, .l-head .menu-btn::after { content: ""; display: block; width: 52px; height: 3px; background: #4c0000; transition: all 0.3s; }

.l-head .menu-btn:before { margin-bottom: 12px; }

.l-head .menu-btn::after { margin-top: 12px; }

.l-head .menu-area { display: none; }

.l-head.scrollwatchScrolled { position: fixed; top: 0; left: 0; right: 0; z-index: 999; background: #fff; }

.l-head.scrollwatchScrolled .head-top { height: 0; opacity: 0; padding: 0; }

.menu-open .l-head { position: fixed; inset: 0; margin: auto; width: 100%; height: 100vh; overflow-y: auto; background: #f0ede9; z-index: 999; -ms-overflow-style: none; scrollbar-width: none; }

.menu-open .l-head::-webkit-scrollbar { display: none; }

.menu-open .l-head > .l-inner { padding: 54px 0 100px; }

.menu-open .l-head .head-top { display: none; }

.menu-open .l-head .head-main .hdg-logo a { pointer-events: none; }

.menu-open .l-head .head-main .hdg-logo a:hover { opacity: 1; }

.menu-open .l-head .menu-btn span { height: 0; }

.menu-open .l-head .menu-btn:before, .menu-open .l-head .menu-btn::after { position: absolute; inset: 0; margin: auto; }

.menu-open .l-head .menu-btn:before { -webkit-transform: rotate(45deg); transform: rotate(45deg); }

.menu-open .l-head .menu-btn::after { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

.menu-open .l-head .menu-area { display: block; }

#sdgs { color: #FFF; font-size: 1.6rem; font-weight: 500; line-height: 1.5; background: #bf8b2e; margin: 0 -50vw; padding: 80px 50vw 100px; }

#sdgs strong { display: block; font-size: 2rem; font-family: "Shippori Mincho B1", serif; margin-bottom: 60px; }

#sdgs a { color: #FFF; }

#sdgs p { color: #FFF; font-family: YuGothic, 'Yu Gothic', sans-serif; font-weight: 400; }

#sdgs .txt-pt { display: block; margin-block: 30px; }

#sdgs .br-pc { display: block; }

#sdgs .br-sp { display: none; }

.wrap-sns { background-color: #f5f5f3; padding: 50px 0; }

.wrap-sns .txt-sns { border-bottom: 3px solid #490400; color: #490400; display: inline-block; font-size: 2.2rem; margin-bottom: 20px; }

.wrap-sns .uc-mod-sns-01 ul { display: flex; justify-content: center; }

.wrap-sns .uc-mod-sns-01 ul > li { padding: 0 10px; }

.wrap-sns .uc-mod-sns-01 ul > li a span { width: 48px; height: 48px; }

.company-site-01 { background-color: #f7f7f7; list-style: none; margin: 0; text-align: center; }

.company-site-01 > .section:nth-child(1) { border-top: 1px solid #e0e0e0; padding: 25px 0; }

.company-site-01 section { align-items: center; display: flex; justify-content: center; }

.company-site-01 section > .CMP-CM10-text p { line-height: 1.3; }

.company-site-01 section > .CMP-CM30-link-list { text-align: left; }

.company-site-01 li { display: inline-block; margin: 0 18px; }

.company-site-01 li a, .company-site-01 li span { color: #000; font-size: 2rem; text-decoration: none; transition: all 0,3s; }

.company-site-01 li a:hover, .company-site-01 li span:hover { opacity: 0.75; text-decoration: underline; }

.btn-fixed-ec { position: fixed; right: 0; bottom: 300px; z-index: 888; background: #FFF; border-radius: 12px 0 0 12px; }

.btn-fixed-ec a { position: relative !important; display: block !important; color: #FFF; font-size: 2.4rem; font-family: "Shippori Mincho B1", serif; background: #d5006e !important; border: 1px solid #bda66b !important; border-right: none !important; padding: 30px 20px !important; border-radius: 12px 0 0 12px !important; margin: 0 !important; width: 213px; text-indent: 1em; transition: all 0.3s; }

.btn-fixed-ec a::after { content: ""; display: inline-block; width: 15px; height: 15px; background: url(/content/dam/sites/jp_unicharmpet_com/frecious/css/icon_arw_w.png); background-size: contain; margin-left: 4px; position: absolute; right: 40px; bottom: 40px; }

.btn-fixed-ec a imgcart { display: none; }

.btn-fixed-ec a { color: #FFF !important; }

.btn-fixed-ec a:hover { opacity: 0.75; text-decoration: none; }

.wrap-page-top .smooth-scroll { bottom: 63px; position: fixed; right: 20px; width: 60px; z-index: 49; }

.txt-trademark { padding-block: 50px; }

.txt-trademark p { font-size: 1.4rem; font-weight: 500; }

.wrap-line-cnt { position: relative; padding-block: 50px; margin-top: 0; }

.wrap-line-cnt .pc { display: inline-block; }

.wrap-line-cnt .sp { display: none; }

.add-quality-content { background-color: #f0ede9; position: relative; margin: 50px 90px 0; padding: 30px; }

.add-quality-content * { position: relative; z-index: 1; }

.add-quality-content::before { content: ""; display: block; background: url(/content/dam/sites/jp_unicharmpet_com/gran-deli/frecious/add_content_bg.jpg); background-size: cover; background-repeat: repeat-y; position: absolute; inset: 0; width: 100%; mix-blend-mode: multiply; }

.add-quality-content .hdg-sec { position: relative; color: #550400; font-size: 4.6rem; line-height: 1.5; margin-bottom: 20px; }

.add-quality-content .hdg-sec .ttl-main { display: block; }

.add-quality-content .hdg-sec .ttl-sub { position: relative; display: inline-block; font-size: 3.2rem; }

.add-quality-content .hdg-sec .ttl-sub:before { content: ""; background: url(/content/dam/sites/jp_unicharmpet_com/gran-deli/frecious/add_content_hdg_line.png) no-repeat; background-size: contain; background-position: center; display: block; margin: auto; width: 173px; height: 3px; }

.add-quality-content .txt { color: #4b0000; font-size: 2rem; font-weight: 600; text-align: left; }

.add-quality-content .txt + .txt { margin-top: 40px; }

.add-quality-content .txt a { color: #0015FF; text-decoration: underline; transition: all 0.3s; }

.add-quality-content .txt a:hover { text-decoration: none; opacity: 0.75; }

.add-frecious-brand-story { background-color: #f0ede9; padding: 80px 0; position: relative; }

.add-frecious-brand-story:before { content: ""; display: block; background: url(/content/dam/sites/jp_unicharmpet_com/gran-deli/frecious/add_content_bg.jpg); background-size: contain; background-repeat: repeat-y; position: absolute; inset: 0; width: calc(100% + 50vw); margin: auto -25vw; mix-blend-mode: multiply; }

.add-frecious-brand-story > * { isolation: isolate; }

.add-frecious-brand-story .hdg-sec { position: relative; color: #550400; font-size: 4.6rem; font-family: "Shippori Mincho B1", serif; font-weight: 500; line-height: 1.5; margin-bottom: 55px; }

.add-frecious-brand-story .hdg-sec .ttl-main { display: block; }

.add-frecious-brand-story .hdg-sec .ttl-sub { position: relative; display: inline-block; font-size: 3.2rem; }

.add-frecious-brand-story .hdg-sec .ttl-sub:before { content: ""; display: block; margin: auto; height: 3px; }

.add-frecious-brand-story .hdg-sec.pt-l .ttl-sub:before { width: 173px; background: url(/content/dam/sites/jp_unicharmpet_com/gran-deli/frecious/add_content_hdg_line.png) no-repeat; background-size: contain; background-position: center; }

.add-frecious-brand-story .hdg-sec.pt-logo .ttl-sub::before { -webkit-transform: translateY(2em); transform: translateY(2em); }

.add-frecious-brand-story .hdg-sec.pt-logo .ttl-logo { display: block; margin-top: 60px; }

.add-frecious-brand-story .hdg-sec.pt-logo .ttl-logo img { width: auto; height: 80px; }

.add-frecious-brand-story .lead-brand-story { color: #3c3c3c; font-size: 3.2rem; font-family: "Shippori Mincho B1", serif; font-weight: 500; }

.add-frecious-brand-story .wrap-img-brand-story { max-width: 518px; margin: 50px auto 40px; }

.add-frecious-brand-story .txt-brand-story { color: #3c3c3c; font-size: 2rem; font-family: "Shippori Mincho B1", serif; font-weight: 500; margin-top: 30px; }

.add-frecious-brand-story .txt-brand-story p { font-weight: 500; line-height: 1.75; }

.add-frecious-brand-story .txt-trademark { padding-block: 50px; }

.add-frecious-brand-story .txt-trademark p { color: #503c3c; font-family: 'Noto Sans JP', sans-serif; font-size: 1.4rem; font-weight: 500; }

@media (max-width: 960px) { .l-head > .l-inner { max-width: none; }
  .l-head .head-top { padding: 8px 20px; }
  .l-head .head-top img[src$='.svg'], .l-head .head-top img { width: 78px; }
  .l-head .head-main { padding: 22px 20px; }
  .l-head .head-main .hdg-logo a:hover { opacity: 1; }
  .l-head .head-main .hdg-logo img { width: 98px; }
  .l-head .menu-wrap { display: block; margin-top: 0; padding-inline: 20px; }
  .l-head .menu-wrap .wrap-list + .wrap-list { margin-left: 0; }
  .l-head .menu-wrap .wrap-list .list-ttl { font-size: 1.8rem; padding: 6px; margin: 0 -20px; }
  .l-head .menu-wrap .wrap-list .list-lead { font-size: 1.6rem; margin-bottom: 0; }
  .l-head .menu-wrap .wrap-list .list-lead:has(.list-link) { padding: 0; }
  .l-head .menu-wrap .wrap-list .list-lead:has(.list-link) .list-link { padding: 20px 30px 20px 0; }
  .l-head .menu-wrap .wrap-list .list-link { position: relative; font-size: 1.6rem; border-top: none; padding-right: 30px; }
  .l-head .menu-wrap .wrap-list .list-link::after { position: absolute; top: 0; right: 10px; bottom: 0; margin: auto; }
  .l-head .menu-wrap .wrap-list .list-link.pt-bdr { border-bottom: 1px solid #a67f54; }
  .l-head .menu-wrap .wrap-list .list-category { display: block; }
  .l-head .menu-wrap .wrap-list .list-category > li a:hover { text-decoration: none; }
  .l-head .menu-wrap .wrap-list .list-category .category2 { border-top: none; }
  .l-head .menu-wrap .wrap-list .list-category .category3 { margin-bottom: 58px; }
  .l-head .menu-wrap .wrap-list .list-category.pt-cat > li:last-child .list-menu { border-bottom: none; }
  .l-head .menu-wrap .wrap-list .list-menu { font-size: 1.6rem; padding: 8px 0 16px; margin-bottom: 0; border-bottom: 1px solid #a67f54; min-width: auto; }
  .l-head .menu-wrap .wrap-list .list-menu a:hover { text-decoration: none; }
  .l-head .menu-btn { right: 20px; margin: auto; height: 42px; }
  .l-head .menu-btn span { width: 42px; height: 1px; }
  .l-head .menu-btn:before, .l-head .menu-btn::after { width: 42px; height: 1px; }
  .l-head .menu-btn:before { margin-bottom: 10px; }
  .l-head .menu-btn::after { margin-top: 10px; }
  .l-head .js-acd-area { display: none; }
  .l-head .js-acd-area.accordionActive { display: block; }
  .l-head .js-acd-wrap .js-acd-btn { position: relative; }
  .l-head .js-acd-wrap .js-acd-btn:before, .l-head .js-acd-wrap .js-acd-btn:after { content: ""; display: block; width: 16px; height: 1px; background: #4c0000; position: absolute; top: 0; right: 0; bottom: 0; margin: auto; transition: all 0.3s; }
  .l-head .js-acd-wrap .js-acd-btn::before { -webkit-transform: rotate(90deg); transform: rotate(90deg); }
  .l-head .js-acd-wrap .js-acd-btn.accordionActive::before { -webkit-transform: rotate(0); transform: rotate(0); }
  .menu-open .l-head { position: fixed; }
  .menu-open .l-head > .l-inner { padding: 58px 0 0; }
  .menu-open .l-head .head-main { padding-bottom: 16px; }
  .menu-open .l-head .menu-btn span { height: 0; }
  .menu-open .l-head .menu-btn:before, .menu-open .l-head .menu-btn::after { position: absolute; inset: 0; margin: auto; }
  .uc-page-footer { padding-bottom: 30px; }
  #sdgs { font-size: 1.4rem; margin: 0; padding: 40px 30px; text-align: left; }
  #sdgs strong { font-size: 1.6rem; margin-bottom: 30px; text-align: center; }
  #sdgs .txt-pt { margin-block: 30px; }
  #sdgs .br-pc { display: none; }
  #sdgs .br-sp { display: block; }
  .company-site-01 { background-color: #fff; padding: 0; }
  .company-site-01 section { display: block; }
  .company-site-01 section > .CMP-CM10-text { border-radius: 0; padding: 4% 3%; text-align: left; width: auto; }
  .company-site-01 section > .CMP-CM10-text p { display: inline; }
  .company-site-01 li { display: block; margin: 0; text-align: left; }
  .company-site-01 li a, .company-site-01 li span { border-bottom: 1px solid #cecece; display: block; font-size: 1.4rem; padding: 4%; }
  .company-site-01 li a:hover, .company-site-01 li span:hover { opacity: 1; text-decoration: none; }
  .company-site-01 li:last-child a, .company-site-01 li:last-child span { border-bottom: none; }
  .company-site-01 > .section:nth-child(1) { border-bottom: none; margin-bottom: 0; padding: 0; }
  .company-site-01 ul { line-height: 1; }
  .wrap-page-top .smooth-scroll { bottom: 70px; right: 2.8%; width: 32px; }
  .wrap-page-top .smooth-scroll a.js-scroll { display: block; }
  .wrap-line-cnt .pc { display: none; }
  .wrap-line-cnt .sp { display: inline-block; }
  .add-quality-content { margin: 14.667vw 0 0; padding: 30px 10px; }
  .add-quality-content .hdg-sec { font-size: 2.8rem; }
  .add-quality-content .hdg-sec .ttl-sub { font-size: 1.8rem; }
  .add-quality-content .hdg-sec .ttl-sub:before { width: 87px; }
  .add-quality-content .txt { font-size: 1.6rem; font-weight: 400; text-align: center; }
  .add-quality-content .txt + .txt { margin-top: 30px; }
  .add-quality-content .txt a:hover { text-decoration: underline; opacity: 1; }
  .add-frecious-brand-story { padding: 30px 15px 20px; }
  .add-frecious-brand-story .hdg-sec { font-size: 2.8rem; margin-bottom: 28px; }
  .add-frecious-brand-story .hdg-sec .ttl-sub { font-size: 1.8rem; letter-spacing: 0; }
  .add-frecious-brand-story .hdg-sec.pt-l .ttl-sub:before { width: 87px; }
  .add-frecious-brand-story .hdg-sec.pt-logo .ttl-logo { margin-top: 30px; }
  .add-frecious-brand-story .lead-brand-story { font-size: 1.8rem; }
  .add-frecious-brand-story .wrap-img-brand-story { max-width: none; margin: 25px auto; }
  .add-frecious-brand-story .txt-brand-story { font-size: 1.3rem; margin-top: 15px; text-align: left; letter-spacing: -.75px; }
  .add-frecious-brand-story .txt-trademark { padding-block: 25px; }
  .add-frecious-brand-story .txt-trademark p { font-size: 1.2rem; } }