/* ========================================================================
ResetCss
======================================================================== */
/* 要素 フォントサイズ・マージン・パディングをリセット */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  font-weight: normal;
  vertical-align:baseline;
  background:transparent;
}

/* 行の高=フォントサイズ */
body {
  line-height:1;
}

/* 新規追加要素をブロック要素化 */
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
  display:block;
}

/* ulのマーカー非表示 */
ol, ul {
  list-style: none;
}

/* 引用符の非表示 */
blockquote, q {
  quotes:none;
}

/* blockquote要素、q要素の前後にコンテンツ非表示 */
blockquote:before, blockquote:after,
q:before, q:after {
  content:'';
  content:none;
}

/* フォントサイズ　リセット フォントの縦方向 ベースライン揃え 点線削除 */
a {
  margin:0;
  padding:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
  outline: none;
  text-decoration: none;
}

/* ins要素 デフォルトセット 色を変える場合はここで変更 */
ins {
  background-color:#ff9;
  color:#000;
  text-decoration:none;
}

/* mark要素 デフォルトセット 色やフォントスタイルを変える場合はここで変更 */
mark {
  background-color:#ff9;
  color:#000;
  font-style:italic;
  font-weight:bold;
}

/* テキスト 打ち消し線 */
del {
  text-decoration: line-through;
}

/* IE　デフォルトで点線を下線表示設定　下線設定 マウスオーバー時 ヘルプカーソル表示可 */
abbr[title], dfn[title] {
  border-bottom:1px dotted;
  cursor:help;
}

/*　隣接するセルのボーダーを重ねて表示　*/
table {
  border-collapse:collapse;
  border-spacing:0;
}

/* 水平罫線デフォルトリセット */
hr {
  display:block;
  height:1px;
  border:0;
  border-top:1px solid #cccccc;
  margin:1em 0;
  padding:0;
}

/* 縦方向の揃え 中央揃え */
input, select {
  vertical-align:middle;
}

/* 画像を縦に並べた時に余白0 */
img {
  vertical-align: top;
  font-size: 0;
  line-height: 0;
}

/*box-sizingを全ブラウザに対応*/
*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

/*画像レスポンシブ*/
img {
  max-width: 100%;
  height: auto;
}

/*改行のweb際のBR高さバグ修正*/
br {
  line-height: inherit;
}

/*  レスポンシブ用
-------------------------------------------------------------*/
/*  pcのみ  */
.sp-only {display: none !important;}
.pc-only {display: block !important;}

/*  spのみ  */
@media screen and (max-width: 768px) {
  .pc-only {display: none !important;}
  .sp-only {display: block !important;}
}

/*  共通
-------------------------------------------------------------*/
html {
	width: 100%;
	height: 100%;
	font-size: 62.5%;
}

@media screen and (max-width: 1199px) {
	html {
		font-size: 0.8333333vw;
	}
}

@media (max-width: 768px) {
	html {
		font-size: 2.6666667vw;
	}
}


body{
  font-family: "Zen Old Mincho", serif;
  background: none;
  width: 100%;
  position: relative;
  margin: 0px;
  line-height: normal;
  font-size: 1.4rem;
  counter-reset: number 0;
  color: #272727;
}

a {transition: all .2s; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; color: #505050;}
a:hover {opacity: 0.7; transition:.2s all; text-decoration: none;}
a img {transition:.2s all;}
a img:hover {opacity: 0.7; transition:.2s all;}
button {transition:.2s all; font-family: "Zen Old Mincho", serif;}
button:hover {opacity: 0.7; transition:.2s all;}
form {margin: 0;}

.inner {width: 100%; max-width: 120rem; margin: 0 auto; position: relative;}
.inner.small {max-width: 1100px;}
.list {display: flex; flex-wrap: wrap;}

@media screen and (max-width: 768px) {
 .list {flex-direction: column;}
}

.cmn-title {font-family: "Kalnia", serif; font-size: 3.6rem; display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 2.2rem; line-height: 1;}
.cmn-title .sub {color: #8F8F8F; font-size: 1.6rem;}

@media screen and (max-width: 768px) {
  .cmn-title {font-size: 3.2rem; gap: 2rem; text-align: center;}
  .cmn-title .sub {font-size: 1.4rem;}
}


/* パンクズ
-------------------------------------------------------------*/
.breadcrumbs {display: flex; align-items: flex-start; gap: 1em; width: 100%; max-width: 132rem; margin: 0 auto 1.5rem;}

@media screen and (max-width: 1199px) {
  .breadcrumbs {padding: 0 2rem; font-size: 1.3rem; flex-wrap: wrap; margin: 0 auto 2rem;}
}


/* =================================================================
ヘッダー
=================================================================*/
.top-message {background: #009A80; color: #FFFFFF; display: flex; justify-content: center; align-items: center; height: 3rem; position: relative; z-index: 1;}
.top-message p {font-size: 1.4rem;}
.l-header.is-fixed {background: #fff;}
.l-header {background: none;}
.l-header-main {height: 10rem; padding: 0;}
.l-header-main__in {height: 10rem; padding: 0;}
.l-menu-btn {width: 8rem; height: 10rem; top: auto;}
.l-menu-btn span {width: 3rem; height: .1rem; left: 4rem;}
.l-menu-btn span:nth-of-type(1) {top: 4.5rem;}
.l-menu-btn span:nth-of-type(2) {top: 5.5rem;}

.l-menu-btn.is-on span:nth-of-type(1) {top: 4rem; transform: rotate(-45deg);}
.l-menu-btn.is-on span:nth-of-type(2) {top: 4rem; transform: rotate(45deg); width: 3rem; opacity: 1;}

.l-header-logo__img {padding: 0; height: 6rem;}
.l-header-logo__img img {height: 6rem; width: auto;}
.l-header-logo__txt {max-width: none; font-size: 1.4rem;}

.l-header-search {top: 2.7rem; right: 11.4rem;}
.l-header-search__btn {padding: .2rem 0 0 0; width: 5rem; height: 4.5rem;}
.l-header-search__btn img {width: 1.9rem;}

.l-header-cart {top: 2.7rem; right: 3.6rem}
.l-header-cart-btn {width: 4.5rem; height: 4.5rem;}
.l-header-cart-btn img {width: 2rem;}
.l-header-cart-btn__count {top: 1.2rem; right: .6rem; height: 1.2rem; min-width: 1.2rem; font-size: .9rem; background: #009A80; display: flex; justify-content: center; align-items: center; padding: 0 .2rem;}

.l-header-fav {position: absolute; top: 2.7rem; right: 7.5rem}
.l-header-fav-btn {width: 4.5rem; height: 4.5rem; display: flex; align-items: center; justify-content: center;}
.l-header-fav-btn img {width: 2.2rem;}

.l-main-navi .fav {display: none;}
.l-header-sp-sns-list {display: none;}

.all-item-link {width: 100%; max-width: 120rem; margin: auto; font-size: 1.8rem; padding-top: 4.7rem;} 
.all-item-link a {color: #272727;}

.l-main-navi__wrap {display: grid; grid-template-columns: 19rem 1fr 19rem 19rem; column-gap: 4rem; align-items: start; padding: 4.4rem 0rem 4rem; max-width: 120rem;}
.l-header-sp-sns-list {display: none;}

.l-main-navi.is-open {top: 13rem; padding: 0;}
.l-main-navi-list__link {display: none;}
.l-main-navi-list {margin: 0; padding: 0; list-style: none; display: contents;}
.l-main-navi-list__item {padding: 0; width: auto;}
.l-main-navi-list__item:nth-child(1) {grid-column: 1; grid-row: 1;}
.l-main-navi-list__item:nth-child(2) {grid-column: 1; grid-row: 2; margin-top: 4rem;}
.l-main-navi-list__item:nth-child(3) {grid-column: 2; grid-row: 1 / 3;}
.l-main-navi-list__item:nth-child(4) {grid-column: 3; grid-row: 1;}
.l-main-navi-list__item:nth-child(5) {grid-column: 4; grid-row: 1;}
.l-main-navi-list__item:nth-child(6) {grid-column: 4; grid-row: 2; margin-top: 4rem;}
.l-main-navi-list__ttl {font-size: 1.8rem; padding-bottom: 1.6rem; border-bottom: 1px solid rgba(0,0,0,.35); margin-bottom: 2rem; font-weight: normal;}
.l-main-navi-list__item .js-toggle-contents {display: block; padding: 0; background: transparent;}

.l-dropdown-menu-list {margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 1.4rem; margin-bottom: 0;}
.l-dropdown-menu-list__item {margin: 0;}
.l-dropdown-menu-list__link {font-size: 1.6rem; line-height: 1; text-decoration: none; color: #272727;}
.l-dropdown-menu-list__link:hover {opacity: .7;}
.l-main-navi-list__item:nth-child(3) .l-dropdown-menu-list {display: grid; grid-auto-flow: column; grid-template-rows: repeat(12, auto); column-gap: 6rem; row-gap: 1.4rem;}

.l-header-help {margin-top: 0; padding: 4.5rem 0 0; background-color: #CDEDE9;}
.l-header-help-box {width: 100%; max-width: 120rem; margin: auto; display: flex; flex-direction: column; gap: 2.2rem;}
.l-header-help-list {width: 100%; display: flex; gap: 3rem;}

.l-main-navi__overlay {background: #CDEDE9;}
.header-sp-contact {display: none;}

.l-dropdown-menu-list__link:hover {opacity: 1; color: #009A80;}
.l-header-help-list__link:hover {opacity: 1; color: #009A80;}

@media screen and (max-width: 768px) {
  .top-message {overflow-x: scroll; padding: .5rem 2rem; justify-content: flex-start; z-index: 1000; position: relative; height: auto;}
  .top-message p {white-space: nowrap;}

  .l-header-main {height: 6rem;}
  .l-header-main__in {height: 6rem;}

  .l-menu-btn {height: 6rem;}
  .l-menu-btn span {left: 2rem;}
  .l-menu-btn span:nth-of-type(1) {top: 2.5rem;}
  .l-menu-btn span:nth-of-type(2) {top: 3.5rem;}

  .l-menu-btn.is-on span:nth-of-type(1) {top: 3rem;}
  .l-menu-btn.is-on span:nth-of-type(2) {top: 3rem;}

  .l-header-search {top: .8rem; right: 5.9rem}
  .l-header-search__btn {width: 3.6rem;}
  .l-header-cart {top: .8rem; right: 2rem;}
  .l-header-cart-btn {width: 3.6rem;}
  .l-header-fav {display: none;}

  .l-main-navi-list__link {font-size: 1.8rem; display: block; border-bottom: 1px solid #D0D0D0;}
  .l-main-navi-list__link:before {
    content: "";
    position: absolute;
    top: 60%;
    right: 1rem;
    margin-top: -1rem;
    width: .8rem;
    height: .8rem;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
    transform: rotate(45deg);
    transition: all cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s;
 }

  .l-main-navi .fav {font-size: 1.8rem; display: flex; align-items: center; padding: 18px 45px 16px 0px; position: relative;}
  .l-main-navi .fav img {margin-right: .9rem;}
  .l-main-navi .fav::before {
    content: "";
    position: absolute;
    top: 60%;
    right: 1rem;
    margin-top: -1rem;
    width: .8rem;
    height: .8rem;
    border-right: 1px solid #000;
    border-bottom: 1px solid #000;
    transform: rotate(315deg);
    transition: all cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s;
 }

  .l-main-navi.is-open {top: 11rem;}
  .l-main-navi__overlay {background: #fff;}

  .all-item-link {background-color: #CDEDE9;  padding: 4.5rem 2rem 0;}

  .l-main-navi__wrap {display: block; padding: 4.5rem 2rem; background-color: #CDEDE9;}
  .l-main-navi-list {display: flex; flex-direction: column;}

  .l-main-navi-list__item:nth-child(1) {order: 1;}
  .l-main-navi-list__item:nth-child(2) {order: 3;}
  .l-main-navi-list__item:nth-child(3) {order: 2;}
  .l-main-navi-list__item:nth-child(4) {order: 4;}
  .l-main-navi-list__item:nth-child(5) {order: 5;}

  .l-main-navi-list__item:nth-child(2),
  .l-main-navi-list__item:nth-child(6) {margin-top: 0;}
  .l-main-navi-list__item.sns {display: none;}
  .l-main-navi-list__item:nth-child(3) .l-dropdown-menu-list {display: flex; flex-direction: column; gap: 1.4rem;}

  .l-main-navi-list__item .js-toggle-contents {display: none;}

  .l-dropdown-menu-list {padding-top: 2rem;}
  .l-dropdown-menu-list__link {padding: 2rem 0 0 2rem;}

  .l-header-help {padding: 0 2rem 10rem; border-top: 0;}
  .l-header-help-box {border-top: 1px solid #009A80; padding: 3rem 0 0;}
  .l-header-help-list {flex-direction: column;}
  .l-header-help-list__link {padding: 0; font-size: 1.4rem; padding: 0;}


  .header-sp-contact {display: flex; flex-direction: column; gap: 1.4rem; margin-top: 3.3rem;}
  .header-sp-contact a {display: flex; justify-content: center; align-items: center; gap: 1rem; border: 1px solid #272727; height: 7rem; font-size: 1.8rem; background: #fff;}
  .header-sp-contact .mail img {width: 2.7rem;}
  .header-sp-contact .line img {width: 2.7rem;}

  .l-header-sp-sns-list {display: flex; margin-top: 6.8rem;}
  .l-header-sp-sns-list a {border-bottom: 1px solid #272727; display: flex; gap: .6rem; align-items: center;}
  .l-header-sp-sns-list a:after {content: ""; display: block; width: .9rem; height: .9rem; background-image: url(https://file003.shop-pro.jp/PA01420/031/img/common/footer-link_bg.svg); background-size: cover;}

}


/* =================================================================
フッター
=================================================================*/
.float {position: fixed; z-index: 1000; bottom: 1.5rem; right: 1rem; display: flex; flex-direction: column; gap: .4rem;}
.float a {display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem; border: 1px solid #8F8F8F; background: #fff; border-radius: 100%; width: 8rem; height: 8rem; line-height: 1; text-align: center;}
.float .line {border-color: #4CC764;}

footer {background: #F6F6F6; background-size: cover;}
footer .inner {display: flex; padding: 11.5rem 0; gap: 5rem;}
footer .footer-logo img {width: 16rem; height: auto;}
footer .left-box {width: 30.1rem;}
footer .sns {display: flex; gap: 1.9rem; margin-top: 2rem; width: 16rem; justify-content: center;}
footer .sns a {display: block}
footer .copy {margin-top: 4rem; font-size: 1.4rem; color: #8F8F8F;}

footer .right-box {display: flex; flex-direction: column; gap: 3.7rem;}
footer .right-box .list {display: flex; gap: 1.9rem;}
footer .right-box .list a {line-height: 1;}
footer .right-box .list a:hover {color: #009A80;}

@media screen and (max-width: 768px) {
  .float {flex-direction: row; bottom: .5rem;}
  .float a  {width: 7rem; height: 7rem; gap: .4rem;}

  footer .inner {justify-content: center; padding: 6rem 0 10rem;}
  footer .left-box {width: 100%; display: flex; flex-direction: column; align-items: center;}
  footer .right-box {display: none;}
}


/* =================================================================
blog
=================================================================*/
.blog {display: flex;  background: #F6F6F6; padding: 12rem 0;}
.blog .text-box {width: 35.714%; background: #F6F6F6; padding-left: 10rem; position: relative; z-index: 100;}
.blog .text-box .cmn-title {align-items: flex-start; margin-bottom: 6rem;}
.blog .text-box .button {color: #8F8F8F; display: block; width: 20.2rem; height: 2.4rem; background-image: url(https://file003.shop-pro.jp/PA01420/031/img/top/button-bg_gray.svg); background-size: 100%; background-repeat: no-repeat; background-position: bottom;}
.blog .tab-menu {padding-left: 2rem; display: inline-flex; flex-direction: column; gap: 2rem; margin-bottom: 6rem; font-size: 1.6rem;}
.blog .tab {cursor: pointer; position: relative;}
.blog .tab.tab.is-active {color: #009A80;}
.blog .tab.tab.is-active::before {content: ""; width: .8rem; height: .8rem; display: block; background: #009A80; transform: rotate(45deg); position: absolute; left: -1.9rem; top: 0; bottom: 0; margin: auto;}
.blog .tab-wrap {width: 64.286%; display: flex;}
.blog .tab-contents {width: 100%; display: none;}
.blog .tab-contents:nth-child(1) {display: block;}
.blog .tab-inner {width: 70rem; position: relative;}

.blog .swiper-blog {width: 70rem; overflow: visible; margin: 0;}
.blog .swiper-slide {background: #fff; padding: 3rem;}
.blog .swiper-slide img:hover {opacity: 1;}
.blog .swiper-slide .text {margin-top: 3rem;}
.blog .swiper-slide .text h3 {margin-top: 1.6rem; height: 3em; font-size: 1.6rem;}
.blog .swiper-slide .text .tag {margin-top: 1.6rem; font-size: 1.4rem; color: #009A80;}

.blog .blog-swiper-nav {position: absolute; top: 0; bottom: 0; margin: auto; width: 100%;}

.blog .swiper-button-next,
.blog .swiper-button-prev {height: 5rem; width: 5rem; z-index: 100;}
.blog .swiper-button-next {right: -3.1rem;}
.blog .swiper-button-prev {left: -3.1rem;}

.blog .swiper-button-next:after,
.blog .swiper-button-prev:after {content: ""; height: 5rem; width: 5rem; display: block; background-repeat: no-repeat; background-position: center;}

.blog .swiper-button-next:after {background-image: url(https://file003.shop-pro.jp/PA01420/031/img/top/icon-next.svg);}
.blog .swiper-button-prev:after {background-image: url(https://file003.shop-pro.jp/PA01420/031/img/top/icon-prev.svg);}
.blog .more {display: none;}

.blog .blog-select-wrap {display: none;}
.blog .blog-select {width: 100%; height: 4.5rem; padding: 0 4.5rem 0 1.6rem; font-size: 1.6rem; color: #272727; background: #fff url(https://file003.shop-pro.jp/PA01420/031/img/common/icon-arrow_down.svg) no-repeat right 1.6rem center / 1.2rem auto; border: 0px; border-bottom: 1px solid #8F8F8F; border-radius: 0; appearance: none; -webkit-appearance: none; -moz-appearance: none; outline: none; font-family: "Zen Old Mincho", serif;}
.blog .blog-select::-ms-expand {display: none;}

@media screen and (max-width: 768px) {
  .blog {flex-direction: column; padding: 10rem 0;}
  .blog .text-box {width: 100%; padding: 0;}
  .blog .text-box .cmn-title {align-items: center; margin-bottom: 0rem;}
  .blog .text-box .button {display: none;}
  .blog .tab-wrap {padding-top: 2.5rem;}
  .blog .tab-menu-wrap {overflow-x: scroll;}
  .blog .tab-menu {display: flex; justify-content: flex-start; flex-direction: row; flex-shrink: 0; width: 100%; max-width: 120rem; margin: 5rem auto 2.5rem; padding: 0 2rem;}
  .blog .tab-menu .tab {height: 4.5rem; display: flex; justify-content: center; font-size: 1.8rem; cursor: pointer;border-bottom: 1px solid #272727; position: relative; white-space: nowrap;}
  .blog .tab-menu .tab:hover {color: #009A80;}
  .blog .tab-menu .tab.is-active {color: #009A80; border-bottom: 2px solid #009A80;}
  .blog .tab-menu .tab.is-active:after {content: ""; display: block; width: 1.2rem; height: 1.2rem; transform: rotate(45deg); background: #009A80; position: absolute; left: 0; right: 0; bottom: -7.314px; margin: auto;}
  .blog .tab.tab.is-active::before {display: none;}

  .blog .tab-wrap {width: 100%; display: block;}

  .blog .tab-inner {width: 100%;}
  .blog .swiper-blog {width: 100%;}

  .blog .swiper-button-prev {height: 3.4rem; width: 3.4rem;}
  .blog .swiper-button-prev {left: 2rem;}
  .blog .swiper-button-next {right: 2rem;}

  .blog .swiper-button-next:after,
  .blog .swiper-button-prev:after {height: 3.4rem; width: 3.4rem; background-size: 100%;}

  .blog .swiper-button-next:after {background-image: url(https://file003.shop-pro.jp/PA01420/031/img/top/icon-next_sp.svg);}
  .blog .swiper-button-prev:after {background-image: url(https://file003.shop-pro.jp/PA01420/031/img/top/icon-prev_sp.svg);}

  .blog .more {color: #8F8F8F; display: block; width: 20.2rem; height: 2.4rem; background-image: url(https://file003.shop-pro.jp/PA01420/031/img/top/button-bg_gray.svg); background-size: 100%; background-repeat: no-repeat; background-position: bottom; margin: 5rem auto 0;}

  .blog .tab-menu-wrap {display: none;}
	.blog .blog-select-wrap {display: block; width: calc(100% - 4rem); margin: 5rem auto 0;}
}

/* =================================================================
CONTACT
=================================================================*/
.contact-area {background: url(https://file003.shop-pro.jp/PA01420/031/img/top/contact-bg.jpg); background-size: cover; padding: 10rem 0;}
.contact-area .cmn-title {color: #fff;}
.contact-area .cmn-title .sub {color: #fff;}
.contact-area .inner {display: flex; justify-content: space-between; margin-top: 7.5rem;}
.contact-area .box {width: 55rem; height: 32rem; background: #fff; border-top: .4rem solid #009A80; border-bottom: .4rem solid #009A80; display: flex; flex-direction: column; align-items: center;}
.contact-area .box h3 {font-size: 2.6rem; display: flex; flex-direction: column; align-items: center; gap: 2rem; line-height: 1;}
.contact-area .box .tel {font-size: 4.8rem; margin-top: 3.5rem; line-height: 0.9;}
.contact-area .box .time {font-size: 1.6rem; margin-top: 2.2rem; line-height: 0.9;}
.contact-area .box .button {display: flex; justify-content: center; align-items: center; border: 1px solid #000000; width: 34rem; height: 7rem; margin-top: 4.6rem; font-size: 1.8rem;}

.contact-area .box:nth-child(1) {padding-top: 5.8rem;}
.contact-area .box:nth-child(2) {padding-top: 6.5rem;}

@media screen and (max-width: 768px) {
  .contact-area {background: url(https://file003.shop-pro.jp/PA01420/031/img/top/contact-bg_sp2.jpg);}
  .contact-area .inner {flex-direction: column; align-items: center; gap: 2rem;}
  .contact-area .box {width: 31.3rem; height: auto; padding: 2.1rem 0;}
  .contact-area .box h3 {flex-direction: row; align-items: center; font-size: 1.8rem; gap: 1rem;}
  .contact-area .box h3 img {width: 2.4rem;}
  .contact-area .box .tel {font-size: 3.6rem; margin-top: 2rem;}
  .contact-area .box .time {font-size: 1.4rem;}

  .contact-area .box:nth-child(1) {padding-top: 2.2rem;}
  .contact-area .box:nth-child(2) {padding-top: 2.2rem;}
  .contact-area .box:nth-child(2) img {width: 2.7rem;}

  .contact-area .box .button {width: 25rem; height: 5rem; margin-top: 2rem; font-size: 1.4rem;}
}

/* =================================================================
ショッピングガイド
=================================================================*/
.p-shopguide {gap: 5.8rem;}
.shopguide .c-section__body {margin-top: 6rem;}
.p-shopguide-box__ttl {text-align: left; font-size: 2.2rem; border-bottom: 1px solid #009A80; padding-bottom: 1.6rem; line-height: 1; margin-bottom: 3rem;}
.p-shopguide__ttl {font-family: "Zen Old Mincho", serif; font-size: 1.8rem;}
.p-shopguide__body {font-family: "Zen Old Mincho", serif; font-size: 1.6rem; line-height: 1.8; margin-bottom: 3rem;}
.p-shopguide__body .link {color: #272727; border-bottom: 1px solid #272727;}
.p-shopguide__body .card {width: 27.6rem; margin: 1rem auto;}

@media screen and (max-width: 768px) {
  .shopguide .c-section__container--compact {gap: 0;}
  .shopguide .c-section__body {margin-top: 5rem;}
  .p-shopguide {gap: 1.6rem;}
  .p-shopguide-box__ttl {font-size: 1.8rem; margin-bottom: 2.4rem;}
  .p-shopguide__ttl {font-size: 1.6rem;}
  .p-shopguide__body {font-size: 1.4rem; margin-bottom: 2.4rem;}
}