@charset "UTF-8";

#membership .point-history .pagination .page-block a.page-link::before,
#membership .point-history .pagination .page-block span.current::before,
.about-info-box .about-info-img.is-none::before {
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: 100%;
  height: 100%;
  z-index: -1;
  opacity: 0.08;
  background: var(--font-clr);
  content: "";
}

#membership .point-history .content .card + .card::before,
.product-detail .review01 .review01__tabWrap::before,
.product-detail .review01 .review01__tabWrap::after {
  position: absolute;
  top: 0;
  left: 0;
  background: var(--font-clr);
  width: 100%;
  height: 1px;
  opacity: 0.25;
  content: "";
  display: block;
}

.ttl-h1 {
  padding: 0;
  margin: 1.666em 0 0.833em 0;
  font-size: 24px;
  font-size: 2.4rem;
  text-align: left;
  line-height: 1.4;
  color: #e8652b;
}

.ttl-h1:first-child {
  margin-top: 0;
}

@media only screen and (min-width: 768px) {
  .ttl-h1 {
    font-size: 32px;
    font-size: 3.2rem;
    margin: 1.25em 0 0.625em 0;
  }
}

#pageMembershipGuide .draft .content h2.heading,
#pageMembershipGuide .guide .content h2.heading,
#pageMembershipGuide .draft .register .heading,
#pageMembershipGuide .guide .register .heading,
#pageMembershipMyPage .draft .heading,
#pageMembershipMyPage .mypage .heading,
#pageMembershipLogin .login .heading,
#membership .point-history .content .point-name,
#pageCommunity .community-wrap .communityPrice h3,
#pageCommunity .community-wrap .limited .communityItemHeader,
.blogDetail .blog_title h2,
.product-detail .review01 .review01__title,
.ttl-h2 {
  margin: 1.818em 0;
  font-size: 22px;
  font-size: 2.2rem;
  text-align: center;
  line-height: 1.4;
  letter-spacing: 1px;
  font-weight: 600;
  color: #e8652b;
}

@media only screen and (min-width: 768px) {
  #pageMembershipGuide .draft .content h2.heading,
  #pageMembershipGuide .guide .content h2.heading,
  #pageMembershipGuide .draft .register .heading,
  #pageMembershipGuide .guide .register .heading,
  #pageMembershipMyPage .draft .heading,
  #pageMembershipMyPage .mypage .heading,
  #pageMembershipLogin .login .heading,
  #membership .point-history .content .point-name,
  #pageCommunity .community-wrap .communityPrice h3,
  #pageCommunity .community-wrap .limited .communityItemHeader,
  .blogDetail .blog_title h2,
  .product-detail .review01 .review01__title,
  .ttl-h2 {
    font-size: 26px;
    font-size: 2.6rem;
    margin-bottom: 2.461em;
    letter-spacing: 3px;
  }
}

@media only screen and (min-width: 1024px) {
  #pageMembershipGuide .draft .content h2.heading,
  #pageMembershipGuide .guide .content h2.heading,
  #pageMembershipGuide .draft .register .heading,
  #pageMembershipGuide .guide .register .heading,
  #pageMembershipMyPage .draft .heading,
  #pageMembershipMyPage .mypage .heading,
  #pageMembershipLogin .login .heading,
  #membership .point-history .content .point-name,
  #pageCommunity .community-wrap .communityPrice h3,
  #pageCommunity .community-wrap .limited .communityItemHeader,
  .blogDetail .blog_title h2,
  .product-detail .review01 .review01__title,
  .ttl-h2 {
    margin-bottom: 3.076em;
  }
}

#pageMembershipGuide .draft .register .link-wrapper button.link,
#pageMembershipGuide .guide .register .link-wrapper button.link,
#pageMembershipLogin .login .link-wrapper a.link,
.contact-wrap input[type="submit"],
#inquiryCompleteSection a,
.product-data .purchaseButton .purchaseButton__btn {
  display: inline-block;
  padding: 1.428em;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: normal;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  color: var(--font-clr);
  background: none;
  border: solid 1px var(--font-clr);
  border-radius: 3px;
  opacity: 1 !important;
  -webkit-transition: 0.5s opacity;
  transition: 0.5s opacity;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#pageMembershipGuide .draft .register .link-wrapper button.link:hover,
#pageMembershipGuide .guide .register .link-wrapper button.link:hover,
#pageMembershipLogin .login .link-wrapper a.link:hover,
.contact-wrap input[type="submit"]:hover,
#inquiryCompleteSection a:hover,
.product-data .purchaseButton .purchaseButton__btn:hover {
  cursor: pointer;
  opacity: 0.5 !important;
  -webkit-transition: 0.5s opacity;
  transition: 0.5s opacity;
}

.product-data #itemAttention .preOrder .preOrder__label,
.product-data #itemAttention .communityLabel .communityLabel__title,
.product-data #itemAttention .lottery .lottery__label,
.product-data #itemAttention .takeout .takeout__label {
  display: inline-block;
  padding: 0 0.833em;
  font-size: 12px !important;
  font-size: 1.2rem !important;
  font-weight: normal;
  color: #fff;
  line-height: 1.5;
  background: #ccc;
  border-radius: 2px;
}

.about-info-box .about-info-map::after,
#topPickInfoSlider li .more a::after,
.top-concept .btn span::after {
  position: absolute;
  right: -1.75em;
  top: 0.375em;
  display: inline-block;
  content: "";
  height: 0.4em;
  width: 1.4em;
  background-color: #e8652b;
  -webkit-mask: url("data:image/svg+xml;charset=utf8,<svg width='16' height='6' viewBox='0 0 16 6' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M0 5H14L9.69231 1' stroke='black'/></svg>");
  -webkit-mask-image: url("data:image/svg+xml;charset=utf8,<svg width='16' height='6' viewBox='0 0 16 6' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M0 5H14L9.69231 1' stroke='black'/></svg>");
  mask-image: url("data:image/svg+xml;charset=utf8,<svg width='16' height='6' viewBox='0 0 16 6' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M0 5H14L9.69231 1' stroke='black'/></svg>");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}

.law-wrap,
.priv-wrap,
#pageMembershipGuide .draft .content,
#pageMembershipGuide .guide .content,
#pageMembershipGuide .draft .about-point,
#pageMembershipGuide .guide .about-point,
#pageMembershipGuide .reward-list,
#pageMembershipMyPage .draft,
#pageMembershipMyPage .mypage,
.membership .draft .heading-wrapper,
#pageMembershipLogin .men-login-wrap,
#membership .point-history .content,
#pageCommunity .community-wrap,
.blog-wrap,
.contact-wrap,
.about-wrap,
.product-detail,
.product-detail .item-desc .item-desc-custom,
.product-relate,
.top-info,
.top-concept,
.top-info-important,
.foot-guide {
  margin: 0 auto;
  width: 100%;
  max-width: 86.4em;
}

.bread-wrap,
.items-wrap,
.product-bgwrap,
.product-data,
.top-pick-area,
.top-blog {
  margin: 0 auto;
  width: 100%;
  max-width: 126.4em;
}

html {
  font-size: 100%;
  font-size: 62.5%;
}

body {
  padding: 0;
  margin: 0;
  border: 0;
  letter-spacing: 0.075em;
  font-family: "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium",
    "YuGothic", "游ゴシック体", "ヒラギノ角ゴ", "メイリオ", sans-serif;
  -webkit-font-feature-settings: "palt";
  font-feature-settings: "palt";
  color: var(--font-clr);
  background: #fff;
  letter-spacing: 2px;
}

ul,
li,
dt,
dd,
p,
h1,
h2,
h3,
h4,
h5,
h6 {
  list-style: none;
  margin: 0;
  padding: 0;
  color: #e8652b;
}

p {
  font-size: 14px;
  font-size: 1.4rem;
  color: #873610;
}

a {
  color: inherit;
}

a:link,
a:visited {
  opacity: 1;
}

a:hover,
a:active {
  opacity: 0.5;
  -webkit-transition: 0.5s opacity;
  transition: 0.5s opacity;
}

:root {
  --comingsoon: #90cf80;
  --community: #e7af5b;
  --takeout: #ab99bd;
  --preOrder: #90cf80;
  --lottery: #79bfc3;
  --discount: #c36f6f;
}

.gothic,
.gothic input,
.gothic textarea,
.gothic select,
.gothic button {
  font-family: "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium",
    "YuGothic", "游ゴシック体" !important;
}

.red {
  color: var(--clr-red);
}

#pageIndex #headNav {
  background-color: transparent;
}

.body-wrap {
  position: relative;
  overflow: clip;
}

#headNav {
  position: sticky;
  background-color: var(--nav-bg-clr);
  top: 0;
  z-index: 5;
}

#headNav.is-solid {
  -webkit-animation-name: bgAnime;
  animation-name: bgAnime;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(10px);
}

@-webkit-keyframes bgAnime {
  0% {
    background-color: transparent;
  }

  100% {
    background-color: var(--nav-bg-clr);
  }
}

@keyframes bgAnime {
  0% {
    background-color: transparent;
  }

  100% {
    background-color: var(--nav-bg-clr);
  }
}

.head-wrap {
  display: grid;
  grid-template-columns: 1fr auto auto;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  min-height: 5em;
  font-size: 10px;
  font-size: 1rem;
}

.head-wrap a {
  text-decoration: none;
}

.head-wrap .head-menu,
.head-wrap .head-mypage,
.head-wrap #baseMenu .base {
  display: none;
}

.head-wrap #btnOpen {
  -webkit-box-ordinal-group: 4;
  -ms-flex-order: 3;
  order: 3;
}

.head-wrap .head-logo {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1;
}

.head-wrap .head-nav {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
}

.head-wrap .head-logo {
  padding-left: 1.6em;
  overflow-wrap: break-word;
  word-break: break-word;
}

@media only screen and (min-width: 768px) {
  .head-wrap .head-logo {
    padding-left: 3.2em;
  }
}

@media only screen and (min-width: 1024px) {
  .head-wrap .head-logo {
    padding-left: 4.8em;
  }
}

.head-wrap #btnOpen {
  font-size: 10px;
  font-size: 1rem;
  padding: 0 1.6em;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.head-wrap #btnOpen:hover {
  cursor: pointer;
  opacity: 0.5;
  -webkit-transition: 0.5s opacity;
  transition: 0.5s opacity;
}

.head-wrap #btnOpen.is-active .border1,
.head-wrap #btnOpen.is-active .border2 {
  -webkit-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
}

.head-wrap #btnOpen.is-active .border1 {
  -webkit-transform: translate(4px, -2px) rotate(45deg);
  transform: translate(4px, -2px) rotate(45deg);
}

.head-wrap #btnOpen.is-active .border2 {
  -webkit-transform: translate(-4px, 2px) rotate(-45deg);
  transform: translate(-4px, 2px) rotate(-45deg);
}

@media only screen and (min-width: 768px) {
  .head-wrap #btnOpen {
    padding: 0 3.2em 0 2em;
  }
}

@media only screen and (min-width: 1024px) {
  .head-wrap #btnOpen {
    padding: 0 4.8em 0 2.6em;
  }
}

.head-wrap #baseMenu {
  font-size: 10px;
  font-size: 1rem;
  height: 100%;
}

.head-wrap #baseMenu .clearfix {
  display: block;
  height: 100%;
}

.head-wrap #baseMenu li {
  display: block;
  text-align: center;
  height: 100%;
}

.head-wrap #baseMenu li svg {
  margin-top: 1px;
  width: 2.2em;
}

.head-wrap #baseMenu li a {
  padding: 0 1.4em;
  height: 5em;
  display: block;
  line-height: 4.5;
}

@media only screen and (min-width: 1024px) {
  .head-wrap #baseMenu li a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: auto;
    height: 100%;
    line-height: 1;
  }
}

@media only screen and (min-width: 1024px) {
  .head-wrap {
    min-height: 7.5em;
  }

  .head-wrap .head-menu,
  .head-wrap .head-mypage {
    display: block;
  }

  .head-wrap #btnOpen {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
  }

  .head-wrap .head-logo {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
  }

  .head-wrap .head-nav {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
  }

  .head-wrap .head-logo {
    text-align: left;
  }

  .head-wrap .head-nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-height: 5em;
  }

  .head-wrap .head-menu {
    border: solid 1px blue;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  .head-wrap .head-menu li {
    font-size: 14px;
    font-size: 1.4rem;
    margin-left: 1.428em;
  }

  .head-wrap .head-menu li:first-child {
    margin: 0;
  }
}

.head-wrap.nav-clr-wh #baseMenu svg path {
  stroke: #fff;
}

.head-wrap.nav-clr-wh #btnOpen .border1,
.head-wrap.nav-clr-wh #btnOpen .border2 {
  stroke: #fff;
}

.head-wrap.nav-clr-bk #baseMenu svg path {
  stroke: #222;
}

.head-wrap.nav-clr-bk #btnOpen .border1,
.head-wrap.nav-clr-bk #btnOpen .border2 {
  stroke: #222;
}

.nc-int-icon-rotate {
  --animation-duration: 0.4s;
}

.nc-int-icon {
  position: relative;
}

.nc-int-icon-b {
  position: absolute;
  top: calc(50% - 0.5em);
  left: calc(50% - 0.5em);
  opacity: 0;
}

.nc-int-icon-rotate .nc-int-icon-a,
.nc-int-icon-rotate .nc-int-icon-b {
  -webkit-transition: opacity 0s calc(var(--animation-duration) / 2),
    -webkit-transform var(--animation-duration);
  transition: opacity 0s calc(var(--animation-duration) / 2),
    -webkit-transform var(--animation-duration);
  transition: opacity 0s calc(var(--animation-duration) / 2),
    transform var(--animation-duration);
  transition: opacity 0s calc(var(--animation-duration) / 2),
    transform var(--animation-duration),
    -webkit-transform var(--animation-duration);
  -webkit-transform-origin: center center;
  transform-origin: center center;
}

.nc-int-icon-rotate .nc-int-icon-b {
  -webkit-transform: rotate(90deg) scale(0.6);
  transform: rotate(90deg) scale(0.6);
}

.nc-int-icon-state-b .nc-int-icon-a {
  opacity: 0;
}

.nc-int-icon-state-b .nc-int-icon-b {
  opacity: 1;
}

.nc-int-icon-rotate.nc-int-icon-state-b .nc-int-icon-a {
  -webkit-transform: rotate(-90deg) scale(0.6);
  transform: rotate(-90deg) scale(0.6);
}

.nc-int-icon-rotate.nc-int-icon-state-b .nc-int-icon-b {
  -webkit-transform: rotate(0);
  transform: rotate(0);
}

.head-logo {
  font-size: 10px;
  font-size: 1rem;
}

.head-logo .logoText {
  display: inline-block;
  font-size: 21px;
  font-size: 2.1rem;
  word-break: break-all;
  line-height: 1.2;
}

@media only screen and (min-width: 768px) {
  .head-logo .logoText {
    font-size: 24px;
    font-size: 2.4rem;
  }
}

.head-logo .logoImage {
  max-width: 100%;
  max-height: 8em;
  height: auto;
  width: auto;
  font-size: 10px;
  font-size: 1rem;
}

@media only screen and (min-width: 768px) {
  .head-logo .logoImage {
    max-height: 6em;
  }
}

/*デザインオプションメニュー*/
.overlay {
  display: block;
  width: 0;
  height: 100%;
  text-align: center;
  position: fixed;
  top: 0;
  z-index: 5;
  overflow-y: hidden;
  opacity: 0;
  -webkit-transition: opacity 0.5s 0s, width 0s 0.5s;
  transition: opacity 0.5s 0s, width 0s 0.5s;
}

.overlay.is-active {
  width: 100%;
  opacity: 1;
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

#spNav {
  position: fixed;
  top: 0;
  right: -100vw;
  height: 100vh;
  width: 100vw;
  padding: 6.5em 3.5em;
  font-size: 16px;
  font-size: 1.6rem;
  color: #fff;
  background: #ffffffd1;
  -webkit-transition: 0.5s all;
  transition: 0.5s all;
  z-index: 20;
  overflow-y: scroll;
  opacity: 0;
}

#spNav #spNavClose {
  position: absolute;
  right: 1.6em;
  top: 1.9em;
  font-size: 10px;
  font-size: 1rem;
  z-index: 20;
}

#spNav #spNavClose:hover {
  cursor: pointer;
}

#spNav.is-active {
  right: 0 !important;
  -webkit-transition: 0.5s all;
  transition: 0.5s all;
  opacity: 1;
}

@media only screen and (min-width: 768px) {
  #spNav {
    padding: 7.2em 6em;
  }

  #spNav #spNavClose {
    top: 3em;
    right: 3em;
  }
}

@media only screen and (min-width: 1024px) {
  #spNav {
    width: 50vw;
    padding: 6.428em 5.142em;
    left: auto;
    right: -50vw;
    scrollbar-color: #fff;
  }

  #spNav::-webkit-scrollbar {
    width: 0.1em;
  }

  #spNav::-webkit-scrollbar-track {
    background: var(--header-bg);
    border-radius: 0.1em;
  }

  #spNav::-webkit-scrollbar-thumb {
    background: var(--header-bg);
    border-radius: 0.1em;
  }

  #spNav.is-active {
    left: auto !important;
    right: 0 !important;
  }

  #spNav #spNavClose {
    top: 4em;
    right: 4em;
  }
}

@media only screen and (min-width: 1200px) {
  #spNav {
    padding: 7.428em 8.571em;
  }
}

@media only screen and (min-width: 768px) {
  #spNav:not(:has(.cat-list)) {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}

.nav-ttl {
  margin-bottom: 0.5em;
  font-size: 16px;
  font-size: 1.6rem;
}

.cat-list li {
  position: relative;
  padding-left: 1.25em;
  padding: 0.807em 0 0.807em 1.25em;
  font-size: 13px;
  font-size: 1.3rem;
  line-height: 1.5;
}

.cat-list li:first-child {
  margin-top: 0;
}

.cat-list li::before {
  z-index: 2;
  position: absolute;
  display: block;
  width: 0.8em;
  height: 1px;
  background-color: #fff;
  content: "";
  top: 1.5em;
  left: 0;
}

.cat-list a {
  text-decoration: none;
}

.nav-list {
  position: relative;
  font-size: 16px;
  font-size: 1.6rem;
}

.nav-list > li {
  line-height: 1.5;
  margin-bottom: 1.5em;
  word-wrap: break-word;
}

.nav-list > li > a {
  display: block;
  text-decoration: none;
  word-wrap: break-word;
}

.nav-list .head-menu-sub {
  position: relative;
  margin-top: 1.5em;
  font-size: 13px;
  font-size: 1.3rem;
}

.nav-list .head-menu-sub > li {
  position: relative;
  padding-left: 1.25em;
}

.nav-list .head-menu-sub > li a {
  text-decoration: none;
}

.nav-list .head-menu-sub > li span {
  position: relative;
  padding-left: 1.25em;
}

.nav-list .head-menu-sub > li span::before {
  z-index: 2;
  position: absolute;
  display: block;
  width: 0.8em;
  height: 1px;
  background-color: #fff;
  content: "";
  top: 0.75em;
  left: 0;
}

.side-mypage {
  margin-top: 1.428em;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.4;
}

.side-mypage a {
  text-decoration: none;
}

@media only screen and (min-width: 768px) {
  #navList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: wrap;
    -ms-flex: wrap;
    flex: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 3em;
  }

  #navList .nav-shop-info,
  #navList .cat-ttl-wrap {
    width: 50%;
    -webkit-box-flex: wrap;
    -ms-flex: wrap;
    flex: wrap;
  }

  #navList:not(:has(.cat-list)) {
    -webkit-box-flex: 100%;
    -ms-flex: 100%;
    flex: 100%;
  }

  #navList:not(:has(.cat-list)) .nav-list li {
    text-align: center;
  }

  #navList:not(:has(.cat-list)) + .search-wrap {
    left: auto;
    margin: 0 auto;
  }

  .nav-list {
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: 600;
  }

  .nav-list .head-menu-sub {
    font-size: 16px;
    font-size: 1.6rem;
  }
}

@media only screen and (min-width: 1024px) {
  .nav-shop-info {
    margin-bottom: 14em;
  }
}

.search-wrap {
  margin-top: 2em;
  padding-bottom: 4em;
}

.search-wrap form {
  font-size: 10px;
  font-size: 1rem;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr auto;
  caret-color: #fff;
}

.search-wrap input {
  border: none;
  border-bottom: solid 1px #fff;
  font-size: 16px;
  font-size: 1.6rem;
  width: 100%;
  line-height: 1.4;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  background-color: #222;
  color: #fff;
  border-radius: 0;
}

.search-wrap input::-webkit-input-placeholder {
  color: #fff;
}

.search-wrap input::-moz-placeholder {
  color: #fff;
}

.search-wrap input:-ms-input-placeholder {
  color: #fff;
}

.search-wrap input::-ms-input-placeholder {
  color: #fff;
}

.search-wrap input::placeholder {
  color: #fff;
}

.search-wrap input:focus-visible {
  outline: 0;
}

.search-wrap input:focus {
  background: #222;
}

.search-wrap button {
  border: none;
  border-bottom: 1px solid #fff;
  font-size: 10px;
  font-size: 1rem;
  position: relative;
  color: #fff;
  background-color: transparent;
  cursor: pointer;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.search-wrap button::-webkit-input-placeholder {
  color: #fff;
}

.search-wrap button::-moz-placeholder {
  color: #fff;
}

.search-wrap button:-ms-input-placeholder {
  color: #fff;
}

.search-wrap button::-ms-input-placeholder {
  color: #fff;
}

.search-wrap button::placeholder {
  color: #fff;
}

.search-wrap button svg {
  font-size: 14px;
  font-size: 1.4rem;
  display: block;
  fill: none;
  stroke: #fff;
  width: 1.571em;
}

@media only screen and (min-width: 768px) {
  .search-wrap {
    width: 50%;
    left: 3.5em;
    padding-bottom: 2em;
  }
}

.app-info-wrap {
  font-size: 10px;
  font-size: 1rem;
}

.app-info-wrap a {
  text-decoration: none;
}

.app-info-wrap .informationBannerArrow {
  font-size: 14px;
  font-size: 1.4rem;
}

.app-info-wrap .informationBannerIcon i {
  font-size: 18px;
  font-size: 1.8rem;
}

.app-info-wrap button:hover {
  cursor: pointer;
}

#footNav {
  font-size: 10px;
  font-size: 1rem;
  color: var(--font-clr);
  background-color: #fff;
  border-top: 1px solid #e9e9e9;
}

.foot-guide {
  padding: 8em 1.6em;
}

.foot-guide .ttl-h2 {
  margin-top: 0;
}

@media only screen and (min-width: 768px) {
  .foot-guide {
    padding: 10.4em 3.2em;
  }
}

@media only screen and (min-width: 1024px) {
  .foot-guide {
    padding: 13.2em 3.2em;
  }
}

.guide-contents {
  margin-bottom: 3.2em;
}

.guide-contents .ttl {
  position: relative;
  margin-bottom: 0.444em;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 2;
  letter-spacing: 2px;
}

.guide-contents .ttl::before {
  position: absolute;
  bottom: -0.445em;
  width: 100%;
  height: 1px;
  content: "";
  background-color: #222;
  opacity: 0.5;
}

.guide-contents p {
  margin-top: 1.142em;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
  letter-spacing: 2px;
}

@media only screen and (min-width: 768px) {
  .guide-contents {
    margin-bottom: 4.8em;
  }
}

.foot-setting-wrap {
  padding: 3.2em 0;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: #fff;
}

@media only screen and (min-width: 768px) {
  .foot-setting-wrap {
    padding: 4.8em 3.2em;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }
}

.foot-setting {
  font-size: 10px;
  font-size: 1rem;
}

.foot-setting #i18 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.foot-setting #i18::before,
.foot-setting #i18::after {
  content: normal;
}

.foot-setting .lang,
.foot-setting .currency {
  position: relative;
  min-width: 10em;
  margin-left: 0.5em;
  font-size: 10px;
  font-size: 1rem;
}

.foot-setting .lang:first-child,
.foot-setting .currency:first-child {
  margin: 0;
}

.foot-setting .lang::before,
.foot-setting .currency::before {
  content: "";
  border-left: 0.4em solid transparent;
  border-right: 0.4em solid transparent;
  border-top: 0.5em solid #222;
  position: absolute;
  right: 0.9em;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 0.5;
  pointer-events: none;
}

.foot-setting select {
  border: solid 1px rgba(34, 34, 34, 0.5);
  width: 100%;
  height: auto !important;
  margin: 0 !important;
  padding: 0.714em 1.785em 0.714em 0.714em !important;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.4;
  color: #222;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 2px;
}

.foot-setting select option {
  padding: 0.357em 1.785em 0.357em 0.357em !important;
  background: #fff;
  color: #222;
}

.foot-icon ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.foot-icon .cart {
  display: none;
}

.foot-icon .base {
  display: inline-block;
  font-size: 10px;
  font-size: 1rem;
  padding: 0.9em;
  background: #fff;
}

.foot-icon .base img {
  height: 2em;
}

.foot-icon.dark-mode .base {
  background: #333333;
}

.foot-icon.dark-mode .base img {
  -webkit-filter: brightness(275%);
  filter: brightness(275%);
}

.foot-menu-wrap {
  padding: 3.2em;
  border-top: 1px solid #e9e9e9;
}

@media only screen and (min-width: 768px) {
  .foot-menu-wrap {
    position: relative;
    padding: 4.8em 3.2em;
  }
}

@media only screen and (min-width: 1024px) {
  .foot-menu-wrap {
    display: grid;
    grid-template-columns: 1fr 34em;
    grid-template-areas: "menu sns" "copy copy";
  }

  .foot-menu-wrap .foot-menu {
    grid-area: menu;
  }

  .foot-menu-wrap .foot-sns {
    grid-area: sns;
  }

  .foot-menu-wrap .foot-copy {
    grid-area: copy;
  }
}

.foot-menu {
  margin-bottom: 2em;
  font-size: 10px;
  font-size: 1rem;
}

.foot-menu li {
  margin-bottom: 1.714em;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.4;
  text-align: center;
  color: #222;
  letter-spacing: 2px;
}

.foot-menu a {
  position: relative;
  text-decoration: none;
}

.foot-menu a:hover {
  opacity: 1;
}

.foot-menu a:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

.foot-menu a::before {
  position: absolute;
  left: 0;
  display: block;
  content: "";
  width: 100%;
  height: 1px;
  background-color: #222;
  bottom: -7px;
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: center top;
  transform-origin: center top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

@media only screen and (min-width: 768px) {
  .foot-menu {
    margin-bottom: 2.4em;
    text-align: center;
  }

  .foot-menu li {
    margin: 0 0 1.714em 1.428em;
    display: inline-block;
  }
}

@media only screen and (min-width: 1024px) {
  .foot-menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 0;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .foot-menu li {
    display: block;
    text-align: left;
    margin-left: 0;
    margin-right: 1.428em;
    margin-bottom: 0;
    margin-top: 0.5em;
  }

  .foot-menu li:nth-child(3),
  .foot-menu li:nth-child(2),
  .foot-menu li:nth-child(1) {
    width: auto;
  }
}

.foot-sns {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-bottom: 2em;
  font-size: 10px;
  font-size: 1rem;
}

.foot-sns li {
  margin-left: 1.6em;
  margin-top: 1em;
  font-size: 10px;
  font-size: 1rem;
}

.foot-sns li a {
  display: block;
  height: 0;
  width: 3.3em;
  padding-top: 3.3em;
  overflow: hidden;
}

.foot-sns li:first-child {
  margin-left: 0;
}

@media only screen and (min-width: 1024px) {
  .foot-sns {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-bottom: 0;
  }

  .foot-sns li {
    margin-top: 0;
  }

  .foot-sns li a {
    width: 2.5em;
    padding-top: 2.5em;
  }
}

.foot-sns .line a {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22320%22%20height%3D%22320%22%20viewBox%3D%220%200%20320%20320%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2306c755%3B%7D.cls-2%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22Layer_2%22%20data-name%3D%22Layer%202%22%3E%3Cg%20id%3D%22LINE_LOGO%22%20data-name%3D%22LINE%20LOGO%22%3E%3Crect%20class%3D%22cls-1%22%20width%3D%22320%22%20height%3D%22320%22%20rx%3D%2272.14%22%2F%3E%3Cpath%20class%3D%22cls-2%22%20d%3D%22M266.66%2C144.92c0-47.74-47.86-86.58-106.69-86.58S53.28%2C97.18%2C53.28%2C144.92c0%2C42.8%2C38%2C78.65%2C89.22%2C85.42%2C3.48.75%2C8.21%2C2.29%2C9.4%2C5.26%2C1.08%2C2.7.71%2C6.93.35%2C9.65%2C0%2C0-1.25%2C7.53-1.52%2C9.13-.47%2C2.7-2.15%2C10.55%2C9.24%2C5.76s61.44-36.18%2C83.82-61.95h0C259.25%2C181.24%2C266.66%2C164%2C266.66%2C144.92Z%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M231.16%2C172.49h-30a2%2C2%2C0%2C0%2C1-2-2v0h0V123.94h0v0a2%2C2%2C0%2C0%2C1%2C2-2h30a2%2C2%2C0%2C0%2C1%2C2%2C2v7.57a2%2C2%2C0%2C0%2C1-2%2C2H210.79v7.85h20.37a2%2C2%2C0%2C0%2C1%2C2%2C2V151a2%2C2%2C0%2C0%2C1-2%2C2H210.79v7.86h20.37a2%2C2%2C0%2C0%2C1%2C2%2C2v7.56A2%2C2%2C0%2C0%2C1%2C231.16%2C172.49Z%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M120.29%2C172.49a2%2C2%2C0%2C0%2C0%2C2-2v-7.56a2%2C2%2C0%2C0%2C0-2-2H99.92v-37a2%2C2%2C0%2C0%2C0-2-2H90.32a2%2C2%2C0%2C0%2C0-2%2C2v46.53h0v0a2%2C2%2C0%2C0%2C0%2C2%2C2h30Z%22%2F%3E%3Crect%20class%3D%22cls-1%22%20x%3D%22128.73%22%20y%3D%22121.85%22%20width%3D%2211.64%22%20height%3D%2250.64%22%20rx%3D%222.04%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M189.84%2C121.85h-7.56a2%2C2%2C0%2C0%2C0-2%2C2v27.66l-21.3-28.77a1.2%2C1.2%2C0%2C0%2C0-.17-.21v0l-.12-.12%2C0%2C0-.11-.09-.06%2C0-.11-.08-.06%2C0-.11-.06-.07%2C0-.11%2C0-.07%2C0-.12%2C0-.08%2C0-.12%2C0h-.08l-.11%2C0h-7.71a2%2C2%2C0%2C0%2C0-2%2C2v46.56a2%2C2%2C0%2C0%2C0%2C2%2C2h7.57a2%2C2%2C0%2C0%2C0%2C2-2V142.81l21.33%2C28.8a2%2C2%2C0%2C0%2C0%2C.52.52h0l.12.08.06%2C0%2C.1.05.1%2C0%2C.07%2C0%2C.14%2C0h0a2.42%2C2.42%2C0%2C0%2C0%2C.54.07h7.52a2%2C2%2C0%2C0%2C0%2C2-2V123.89A2%2C2%2C0%2C0%2C0%2C189.84%2C121.85Z%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E")
    center center no-repeat;
  background-size: contain;
}

.foot-sns .twitter a {
  background: url("data:image/svg+xml;utf8,<svg viewBox='0 0 1200 1227' xmlns='http://www.w3.org/2000/svg'><path d='m714.163 519.284 446.727-519.284h-105.86l-387.893 450.887-309.809-450.887h-357.328l468.492 681.821-468.492 544.549h105.866l409.625-476.152 327.181 476.152h357.328l-485.863-707.086zm-144.998 168.544-47.468-67.894-377.686-540.2396h162.604l304.797 435.9906 47.468 67.894 396.2 566.721h-162.604l-323.311-462.446z'/></svg>")
    center center no-repeat;
  background-size: 90% auto;
}

.foot-sns .facebook a {
  background: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201024%201024%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23fff%3B%7D.cls-2%7Bfill%3A%231877f2%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpath%20class%3D%22cls-2%22%20d%3D%22m1024%2C512C1024%2C229.23%2C794.77%2C0%2C512%2C0S0%2C229.23%2C0%2C512c0%2C255.55%2C187.23%2C467.37%2C432%2C505.78v-357.78h-130v-148h130v-112.8c0-128.32%2C76.44-199.2%2C193.39-199.2%2C56.02%2C0%2C114.61%2C10%2C114.61%2C10v126h-64.56c-63.6%2C0-83.44%2C39.47-83.44%2C79.96v96.04h142l-22.7%2C148h-119.3v357.78c244.77-38.41%2C432-250.22%2C432-505.78Z%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22m711.3%2C660l22.7-148h-142v-96.04c0-40.49%2C19.84-79.96%2C83.44-79.96h64.56v-126s-58.59-10-114.61-10c-116.95%2C0-193.39%2C70.88-193.39%2C199.2v112.8h-130v148h130v357.78c26.07%2C4.09%2C52.78%2C6.22%2C80%2C6.22s53.93-2.13%2C80-6.22v-357.78h119.3Z%22%2F%3E%3C%2Fsvg%3E")
    center center no-repeat;
  background-size: contain;
}

.foot-sns .tiktok a {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%201%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201024%201024%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%2325f4ee%3B%7D.cls-2%7Bfill%3A%23fe2c55%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M412.07%2C405.17V364.3a309.46%2C309.46%2C0%2C0%2C0-41.77-3c-170.94%2C0-310%2C139.07-310%2C310%2C0%2C104.88%2C52.4%2C197.69%2C132.34%2C253.81C141.05%2C869.69%2C110.43%2C795.49%2C110.43%2C714%2C110.43%2C545.53%2C244.52%2C409.08%2C412.07%2C405.17Z%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M419.39%2C856.45c76.26%2C0%2C139.36-61.53%2C142.2-137.12l.64-674%2C122.23%2C0-.19-1a234.31%2C234.31%2C0%2C0%2C1-4-42.74H511.87l-.27%2C675c-2.83%2C75.59-65%2C136.25-141.3%2C136.25a140.53%2C140.53%2C0%2C0%2C1-65.67-16.26C330.36%2C832.24%2C372.15%2C856.45%2C419.39%2C856.45Z%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M914.6%2C275.47V235.93A232.87%2C232.87%2C0%2C0%2C1%2C787%2C198C819.72%2C235.57%2C864.16%2C264.68%2C914.6%2C275.47Z%22%2F%3E%3Cpath%20class%3D%22cls-2%22%20d%3D%22M787%2C198A233.27%2C233.27%2C0%2C0%2C1%2C729.38%2C44.36H683.5C695.38%2C108.53%2C734.23%2C163.58%2C787%2C198Z%22%2F%3E%3Cpath%20class%3D%22cls-2%22%20d%3D%22M370.3%2C528.41c-78.06%2C0-142.51%2C64.79-142.51%2C142.86%2C0%2C54.36%2C31.77%2C101.59%2C76.84%2C125.31A140.63%2C140.63%2C0%2C0%2C1%2C277.81%2C714c0-78.07%2C63.52-141.58%2C141.58-141.58A139.38%2C139.38%2C0%2C0%2C1%2C461.16%2C579V407a307.72%2C307.72%2C0%2C0%2C0-41.77-3c-2.46%2C0-4.88.13-7.32.18l-.65%2C0L411%2C534.37A132%2C132%2C0%2C0%2C0%2C370.3%2C528.41Z%22%2F%3E%3Cpath%20class%3D%22cls-2%22%20d%3D%22M914.6%2C273.46l-.78-.16%2C0%2C130.05c-87.33%2C0-168.47-28.75-234.52-76.16l0%2C344.08c0%2C170.93-138.08%2C309.13-309%2C309.13-66.06%2C0-127.31-20-177.66-55.32%2C56.64%2C60.8%2C137.3%2C98.92%2C226.75%2C98.92%2C170.93%2C0%2C310-139.06%2C310-310V371.74A400.59%2C400.59%2C0%2C0%2C0%2C963.7%2C447.09V278.67A234.45%2C234.45%2C0%2C0%2C1%2C914.6%2C273.46Z%22%2F%3E%3Cpath%20d%3D%22M680.29%2C671.27V329A400.52%2C400.52%2C0%2C0%2C0%2C914.6%2C404.35V273.46A234.42%2C234.42%2C0%2C0%2C1%2C787%2C198%2C234.76%2C234.76%2C0%2C0%2C1%2C684.27%2C44.36H561l-.27%2C675c-2.83%2C75.59-65%2C136.25-141.3%2C136.25a141.34%2C141.34%2C0%2C0%2C1-114.76-59%2C141.65%2C141.65%2C0%2C0%2C1-75.91-125.31c0-78.07%2C63.52-141.58%2C141.58-141.58a139.07%2C139.07%2C0%2C0%2C1%2C41.77%2C6.55v-132C244.52%2C408.11%2C109.39%2C545.53%2C109.39%2C714a308.81%2C308.81%2C0%2C0%2C0%2C83.25%2C211.07A308.18%2C308.18%2C0%2C0%2C0%2C370.3%2C981.26C541.23%2C981.26%2C680.29%2C842.2%2C680.29%2C671.27Z%22%2F%3E%3C%2Fsvg%3E")
    center center no-repeat;
  background-size: contain;
}

.foot-sns .insta a {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%201%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201024%201024%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3Aurl(%23%E5%90%8D%E7%A7%B0%E6%9C%AA%E8%A8%AD%E5%AE%9A%E3%82%B0%E3%83%A9%E3%83%87%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3_62)%3B%7D.cls-2%7Bfill%3Aurl(%23%E5%90%8D%E7%A7%B0%E6%9C%AA%E8%A8%AD%E5%AE%9A%E3%82%B0%E3%83%A9%E3%83%87%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3_51)%3B%7D.cls-3%7Bfill%3Aurl(%23%E5%90%8D%E7%A7%B0%E6%9C%AA%E8%A8%AD%E5%AE%9A%E3%82%B0%E3%83%A9%E3%83%87%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3_25)%3B%7D%3C%2Fstyle%3E%3ClinearGradient%20id%3D%22%E5%90%8D%E7%A7%B0%E6%9C%AA%E8%A8%AD%E5%AE%9A%E3%82%B0%E3%83%A9%E3%83%87%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3_62%22%20x1%3D%22146.19%22%20y1%3D%22878.01%22%20x2%3D%22867.48%22%20y2%3D%22156.72%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23fdb71b%22%2F%3E%3Cstop%20offset%3D%220.08%22%20stop-color%3D%22%23fb9115%22%2F%3E%3Cstop%20offset%3D%220.19%22%20stop-color%3D%22%23fa630d%22%2F%3E%3Cstop%20offset%3D%220.25%22%20stop-color%3D%22%23f9520a%22%2F%3E%3Cstop%20offset%3D%220.28%22%20stop-color%3D%22%23f6450f%22%2F%3E%3Cstop%20offset%3D%220.4%22%20stop-color%3D%22%23ed201f%22%2F%3E%3Cstop%20offset%3D%220.49%22%20stop-color%3D%22%23e80928%22%2F%3E%3Cstop%20offset%3D%220.55%22%20stop-color%3D%22%23e6012c%22%2F%3E%3Cstop%20offset%3D%220.61%22%20stop-color%3D%22%23de0143%22%2F%3E%3Cstop%20offset%3D%220.7%22%20stop-color%3D%22%23d6005b%22%2F%3E%3Cstop%20offset%3D%220.77%22%20stop-color%3D%22%23d2006a%22%2F%3E%3Cstop%20offset%3D%220.84%22%20stop-color%3D%22%23d0006f%22%2F%3E%3Cstop%20offset%3D%220.85%22%20stop-color%3D%22%23ce0075%22%2F%3E%3Cstop%20offset%3D%220.89%22%20stop-color%3D%22%23c80086%22%2F%3E%3Cstop%20offset%3D%220.94%22%20stop-color%3D%22%23c50091%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23c40094%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22%E5%90%8D%E7%A7%B0%E6%9C%AA%E8%A8%AD%E5%AE%9A%E3%82%B0%E3%83%A9%E3%83%87%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3_51%22%20x1%3D%22325.26%22%20y1%3D%22699.15%22%20x2%3D%22695.95%22%20y2%3D%22328.46%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23f94f0c%22%2F%3E%3Cstop%20offset%3D%220.58%22%20stop-color%3D%22%23ed0019%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23de0045%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22%E5%90%8D%E7%A7%B0%E6%9C%AA%E8%A8%AD%E5%AE%9A%E3%82%B0%E3%83%A9%E3%83%87%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3_25%22%20x1%3D%22741.48%22%20y1%3D%22282.88%22%20x2%3D%22828.05%22%20y2%3D%22196.32%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23d7005d%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23cd0179%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M512.29%2C93.68c136.35%2C0%2C152.49.61%2C206.1%2C3%2C49.85%2C2.2%2C76.74%2C10.56%2C94.7%2C17.54%2C23.73%2C9.19%2C40.85%2C20.35%2C58.59%2C38.09%2C18%2C17.95%2C28.89%2C34.89%2C38.27%2C58.62%2C7%2C18%2C15.34%2C45%2C17.54%2C94.7%2C2.4%2C53.83%2C3%2C70%2C3%2C206.13s-.6%2C152.49-3%2C206.14c-2.2%2C49.85-10.55%2C76.74-17.54%2C94.69-9.18%2C23.73-20.32%2C40.86-38.08%2C58.59-18%2C18-34.89%2C28.9-58.59%2C38.28-18%2C7-45.07%2C15.34-94.7%2C17.54-53.84%2C2.39-70%2C3-206.13%2C3s-152.49-.61-206.14-3c-49.85-2.2-76.74-10.56-94.69-17.54-23.73-9.19-40.86-20.32-58.63-38.09-18-18-28.89-34.89-38.27-58.59-7-17.95-15.34-45.06-17.54-94.69-2.4-53.84-3-70-3-206.14s.6-152.49%2C3-206.13c2.2-49.86%2C10.55-76.74%2C17.54-94.7%2C9.18-23.73%2C20.35-40.86%2C38.08-58.62%2C18-18%2C34.89-28.9%2C58.62-38.28%2C18-7%2C45-15.34%2C94.7-17.54%2C53.61-2.39%2C69.79-3%2C206.14-3Zm0-91.88c-138.55%2C0-155.87.6-210.32%2C3C247.75%2C7.19%2C210.47%2C16%2C178.19%2C28.52%2C144.51%2C41.66%2C116%2C59%2C87.7%2C87.53c-28.51%2C28.32-45.86%2C56.8-59%2C90.29C16.13%2C210.32%2C7.36%2C247.39%2C5%2C301.61c-2.39%2C54.63-3%2C71.95-3%2C210.5S2.58%2C668%2C5%2C722.43c2.39%2C54.22%2C11.16%2C91.5%2C23.73%2C123.78%2C13.17%2C33.68%2C30.49%2C62.19%2C59%2C90.48C116%2C965%2C144.51%2C982.56%2C178%2C995.51c32.5%2C12.56%2C69.56%2C21.34%2C123.78%2C23.73%2C54.41%2C2.39%2C71.76%2C3%2C210.32%2C3s155.9-.61%2C210.31-3c54.22-2.39%2C91.51-11.17%2C123.78-23.73%2C33.49-13%2C62-30.49%2C90.3-58.82s45.86-56.8%2C58.81-90.29c12.57-32.5%2C21.34-69.56%2C23.73-123.78%2C2.39-54.42%2C3-71.77%2C3-210.32s-.61-155.87-3-210.31c-2.39-54.22-11.16-91.51-23.73-123.78-12.57-33.91-29.92-62.39-58.4-90.71-28.29-28.29-56.8-45.87-90.29-58.82C814.11%2C16.12%2C777.05%2C7.35%2C722.82%2C5c-54.6-2.58-72-3.19-210.5-3.19h0Z%22%2F%3E%3Cpath%20class%3D%22cls-2%22%20d%3D%22M512.29%2C250c-144.71%2C0-262.15%2C117.4-262.15%2C262.14S367.55%2C774.25%2C512.29%2C774.25s262.14-117.4%2C262.14-262.14S657%2C250%2C512.29%2C250Zm0%2C432.17a170%2C170%2C0%2C1%2C1%2C170-170A170%2C170%2C0%2C0%2C1%2C512.29%2C682.14Z%22%2F%3E%3Cpath%20class%3D%22cls-3%22%20d%3D%22M846%2C239.6a61.21%2C61.21%2C0%2C1%2C1-61.21-61.2A61.2%2C61.2%2C0%2C0%2C1%2C846%2C239.6Z%22%2F%3E%3C%2Fsvg%3E")
    center center no-repeat;
  background-size: contain;
}

.foot-sns .youtube a {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%201%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201024%201024%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3Ared%3B%7D.cls-2%7Bfill%3A%23fff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M1000.91%2C264.78A128.2%2C128.2%2C0%2C0%2C0%2C910.69%2C174C831.11%2C152.52%2C512%2C152.52%2C512%2C152.52s-319.11%2C0-398.69%2C21.46a128.2%2C128.2%2C0%2C0%2C0-90.22%2C90.8C1.76%2C344.88%2C1.76%2C512%2C1.76%2C512s0%2C167.12%2C21.33%2C247.22A128.2%2C128.2%2C0%2C0%2C0%2C113.31%2C850C192.89%2C871.48%2C512%2C871.48%2C512%2C871.48s319.11%2C0%2C398.69-21.46a128.2%2C128.2%2C0%2C0%2C0%2C90.22-90.8c21.33-80.1%2C21.33-247.22%2C21.33-247.22S1022.24%2C344.88%2C1000.91%2C264.78Z%22%2F%3E%3Cpolygon%20class%3D%22cls-2%22%20points%3D%22407.63%20663.73%20674.35%20512%20407.63%20360.27%20407.63%20663.73%22%2F%3E%3C%2Fsvg%3E")
    center center no-repeat;
  background-size: contain;
}

.foot-sns .abema a {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%201%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201024%201024%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%232e8d3c%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M863.87%2C734.72c-62-30.46-59.64-107.78-51.2-183.81a382.65%2C382.65%2C0%2C0%2C0%2C5.67-66.61%2C394.27%2C394.27%2C0%2C0%2C0-17.15-115.38l.73%2C2.79c-16.89-56.32-48.13-88.06-48.13-149v-148C753.79%2C19.46%2C728.19%2C0%2C705.67%2C0c-73.22%2C0-97%2C125.44-193.8%2C125.44h0C415.11%2C125.44%2C391.3%2C0%2C318.59%2C0c-22.27%2C0-48.38%2C19.46-48.38%2C74.75V222c0%2C60.93-31.23%2C92.67-48.13%2C149-10.52%2C33.86-16.58%2C72.8-16.58%2C113.14a396.71%2C396.71%2C0%2C0%2C0%2C5.92%2C68.43l-.35-2.37c8.2%2C76.8%2C10.76%2C153.6-51.2%2C183.81-48.38%2C23.81-79.36%2C64-57.08%2C98.31%2C27.9%2C43.26%2C80.89-6.4%2C106.49%2C0s-1.53%2C45%2C41%2C45c22.27%2C0%2C27.91-67.84%2C49.15-62.46%2C14.08%2C3.33%2C17.67%2C45.57%2C3.59%2C78.33-6.4%2C14.85-63.23%2C51.2-56.32%2C88.07S284%2C1024%2C327.3%2C1024H441a59.2%2C59.2%2C0%2C0%2C0%2C55-44.91l.08-.4c0-17.92-25.6-57.86%2C15.36-57.86h0c40.19%2C0%2C15.62%2C39.94%2C15.62%2C57.86A59%2C59%2C0%2C0%2C0%2C583%2C1024H696.45c43.52%2C0%2C73.73-6.14%2C80.9-43.26S727.43%2C908%2C721%2C893.44c-13.83-32.77-10.5-75.26%2C3.58-78.85%2C21.25-5.37%2C26.88%2C62.47%2C49.15%2C62.47%2C42.5%2C0%2C11.78-39.43%2C41-45.06s78.59%2C44.29%2C106.5%2C0c22.27-33.28-8.71-73.47-57.35-97.28ZM668%2C301.82h.26a28.42%2C28.42%2C0%2C1%2C1-28.42%2C28.42h0A28.43%2C28.43%2C0%2C0%2C1%2C668%2C301.82Zm-312.32%2C0a28.42%2C28.42%2C0%2C1%2C1-28.41%2C28.42h0a28.42%2C28.42%2C0%2C0%2C1%2C28.41-28.42Zm156.16%2C580.1A129.54%2C129.54%2C0%2C1%2C1%2C641.41%2C752.38h0A129.54%2C129.54%2C0%2C0%2C1%2C511.87%2C881.92ZM616.58%2C566.27C566.91%2C566.27%2C551%2C512%2C511.87%2C512s-55%2C55-104.7%2C55-88.58-23-88.58-85.25c0-76.8%2C111.62-128%2C193.28-128s193.54%2C49.67%2C193.54%2C128C705.41%2C543.23%2C665.47%2C566.27%2C616.58%2C566.27Z%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M511.87%2C370.94c-35.33%2C0-63.74%2C21.51-63.74%2C47.88s28.41%2C48.12%2C63.74%2C48.12%2C64-21.5%2C64-48.12S547.2%2C370.94%2C511.87%2C370.94Z%22%2F%3E%3C%2Fsvg%3E")
    center center no-repeat;
  background-size: contain;
}

.foot-sns .note a {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22a%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20215%20360%22%3E%3Cpath%20d%3D%22m.572%2C75.56c41.19%2C0%2C97.6-2.09%2C138.1-1.04%2C54.34%2C1.39%2C74.76%2C25.06%2C75.45%2C83.53.69%2C33.06%2C0%2C127.73%2C0%2C127.73h-58.79c0-82.83.35-96.5%2C0-122.6-.69-22.97-7.25-33.92-24.9-36.01-18.69-2.09-71.07-.35-71.07-.35v158.96H.572V75.56h0Z%22%20style%3D%22fill%3A%23040000%3B%20stroke-width%3A0px%3B%22%2F%3E%3Crect%20width%3D%22215%22%20height%3D%22360%22%20style%3D%22fill%3Anone%3B%20stroke-width%3A0px%3B%22%2F%3E%3C%2Fsvg%3E")
    center center no-repeat;
  background-size: contain;
}

.foot-copy {
  margin-top: 2em;
  font-size: 10px;
  font-size: 1rem;
  color: #222;
}

.foot-copy small {
  display: block;
  font-size: 14px;
  font-size: 1.4rem;
  text-align: center;
}

@media only screen and (min-width: 1024px) {
  .foot-copy small {
    text-align: left;
  }
}

@media only screen and (min-width: 768px) {
  .foot-copy {
    margin-top: 2.4em;
  }
}

.msg_messenger .msg_smsAuth__formArea {
  display: grid;
  grid-template-columns: 1fr auto;
}

.msg_messenger .msg_smsAuth__formArea > input {
  width: 100%;
}

.is-app-message {
  display: block;
  font-size: 10px;
  font-size: 1rem;
  height: 10em;
}

@media only screen and (min-width: 479px) {
  .is-app-message {
    display: inline;
    height: 0;
  }
}

:root {
  --comingsoon: #4071bb;
  --community: #d4a600;
  --takeout: #854cb1;
  --preOrder: #4071bb;
  --lottery: #2fbd9b;
  --discount: var(--clr-red);
}

a {
  opacity: 1;
  -webkit-transition: 0.5s opacity;
  transition: 0.5s opacity;
}

a:hover,
a:active {
  opacity: 0.5;
  -webkit-transition: 0.5s opacity;
  transition: 0.5s opacity;
}

.mincho {
  font-family: "Shippori Mincho", "Noto Serif JP", serif;
  font-weight: 500;
}

.gothic {
  font-family: "Noto Sans JP", sans-serif;
}

.maru-gothic {
  font-family: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
}

.ff-lato,
.logo-lato {
  font-family: "Lato", "IBM Plex Sans JP", sans-serif !important;
  font-weight: 700 !important;
}

.ff-cor,
.logo-cor {
  font-family: "Cormorant", "Noto Serif JP", serif !important;
  font-weight: 700 !important;
}

.ff-pla,
.logo-pla {
  font-family: "Playball", "Noto Serif JP", serif !important;
  font-weight: 400 !important;
}

.ff-osw,
.logo-osw {
  font-family: "Oswald", "Noto Sans", sans-serif !important;
  font-weight: 700 !important;
}

.ff-mp,
.logo-mp {
  font-family: "Zen Maru Gothic", "Noto Sans", sans-serif !important;
  font-weight: 600 !important;
}

.ff-saw,
.logo-saw {
  font-family: "Shippori Mincho", "Noto Serif JP", serif !important;
  font-weight: 400 !important;
}

.ff-spr,
.logo-spr {
  font-family: "Shippori Mincho", "Noto Serif JP", serif !important;
  font-weight: 500 !important;
}

.ff-noto,
.logo-noto {
  font-family: "Noto Sans JP", sans-serif !important;
  font-weight: 800 !important;
}

.ff-zen,
.logo-zen {
  font-family: "Zen Antique", "Noto Serif JP", serif !important;
  font-weight: 400 !important;
}

.btn {
  font-size: 10px;
  font-size: 1rem;
  display: block;
}

.btn a {
  display: block;
  font-size: 14px;
  font-size: 1.4rem;
  text-align: center;
  text-decoration: none;
  color: var(--font-clr);
}

.bread-wrap {
  overflow-x: auto;
}

.bread-wrap::-webkit-scrollbar {
  display: none;
}

.breadcrumb {
  width: 1000vw;
  margin-right: -900vw;
  margin-left: -2em;
  width: -moz-fit-content;
  width: -webkit-fit-content;
  width: fit-content;
  padding: 0 0.5em 0 2em;
  color: var(--font-clr);
}

.breadcrumb li {
  position: relative;
  display: inline-block;
  display: inline;
  margin-right: 0.714em;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.4;
}

.breadcrumb li + li {
  margin: 0 0.714em 0 1.428em;
}

.breadcrumb li + li:last-child {
  margin-right: 1.428em;
}

.breadcrumb li + li::before {
  content: "";
  position: absolute;
  left: -1.429em;
  top: 0.571em;
  display: block;
  width: 0.428em;
  height: 0.428em;
  border-top: solid 1px;
  border-left: solid 1px;
  border-color: var(--font-clr);
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}

.breadcrumb a {
  display: inline;
  text-decoration: none;
}

@media only screen and (min-width: 768px) {
  .breadcrumb {
    padding: 0 0.5em 0 2em;
  }
}

@media only screen and (min-width: 1024px) {
  .breadcrumb {
    width: 100%;
    margin-right: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

#notShop {
  font-size: 10px;
  font-size: 1rem;
  text-align: center;
  padding: 4em 2em;
  border: solid 1px var(--clr-red);
}

#notShop p {
  font-size: 14px;
  font-size: 1.4rem;
  color: var(--clr-red);
}

.slidein {
  opacity: 0;
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  -webkit-transition: all 1s;
  transition: all 1s;
  -webkit-transform: translate(0, 30px);
  transform: translate(0, 30px);
}

.slidein.scrollin {
  -webkit-transform: translate(0, 0) !important;
  transform: translate(0, 0) !important;
  opacity: 1 !important;
}

.menu-JP.setting-eng .en {
  display: none;
}

.menu-ENG-upper.setting-eng .jp,
.menu-ENG-lower.setting-eng .jp {
  display: none;
}

.items-wrap {
  padding: 0 1.6em 8em;
}

@media only screen and (min-width: 768px) {
  .items-wrap {
    padding: 0 3.2em 10.4em;
  }

  .items-wrap .ttl-h2 {
    margin-bottom: 2.461em;
  }
}

@media only screen and (min-width: 1024px) {
  .items-wrap {
    padding-bottom: 13.6em;
  }

  .items-wrap .ttl-h2 {
    margin-bottom: 2.461em;
  }
}

.items-wrap .items-tags {
  margin-bottom: 4em;
}

.items-wrap .items-tags > li {
  display: inline-block;
  line-height: 2;
  letter-spacing: 2px;
}

.items-wrap .items-tags > li > a {
  position: relative;
  padding: 0.5em 1.333em;
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1.5;
  text-decoration: none;
  display: block;
}

.items-wrap .items-tags > li > a:hover {
  opacity: 1;
}

.items-wrap .items-tags > li > a:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

.items-wrap .items-tags > li > a::before {
  position: absolute;
  left: 1.333em;
  content: "";
  width: calc(100% - 32px);
  height: 1px;
  background-color: var(--font-clr);
  bottom: -1px;
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: center top;
  transform-origin: center top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

@media only screen and (min-width: 768px) {
  .items-wrap .items-tags > li > a {
    padding: 1em 1.142em;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 2;
  }

  .items-wrap .items-tags > li > a::before {
    left: 1.142em;
  }
}

@media only screen and (min-width: 768px) {
  .items-wrap .items-tags {
    margin-bottom: 6em;
  }
}

@media only screen and (min-width: 1024px) {
  .items-wrap .items-tags {
    text-align: center;
    margin-bottom: 8em;
  }
}

.items-wrap .btn {
  margin-top: 4.8em;
  text-align: center;
}

@media only screen and (min-width: 768px) {
  .items-wrap .btn {
    margin-top: 6.4em;
  }
}

@media only screen and (min-width: 1024px) {
  .items-wrap .btn {
    margin-top: 8em;
  }
}

.items-wrap .btn a {
  margin: 0 auto;
  position: relative;
  padding: 0.8em 4em;
  text-decoration: none;
  display: inline-block;
  border: 1px solid var(--font-clr);
}

@media only screen and (min-width: 768px) {
  .items-wrap .btn a {
    padding: 1.142em 5.714em;
  }

  .items-wrap .btn a::before {
    width: 4em;
    left: -2em;
  }

  .items-wrap .btn a:hover::before {
    left: -1.5em;
  }
}

.items-list > li {
  position: relative;
  font-size: 10px;
  font-size: 1rem;
}

.items-list > li a {
  display: block;
  text-decoration: none;
  padding-bottom: 2.4em;
}

@media only screen and (min-width: 768px) {
  .items-list > li a {
    padding-bottom: 3.2em;
  }
}

@media only screen and (min-width: 1024px) {
  .items-list > li a {
    padding-bottom: 4.8em;
  }
}

.items-list > li .label_image {
  position: absolute;
  left: 0;
  top: 0;
  width: 5em;
  z-index: 1;
}

.items-list > li .items-img {
  width: 100%;
  height: auto;
  overflow: hidden;
  position: relative;
}

.items-list > li .items-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  vertical-align: bottom;
}

.items-list > li .items-img .items-soldout {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.25);
  display: grid;
  place-items: center;
}

.items-list > li .items-img .items-soldout::after {
  font-size: 14px;
  font-size: 1.4rem;
  color: #fff;
  content: "SOLD OUT";
}

.img-sq .items-list > li .items-img {
  aspect-ratio: 1/1;
}

.img-la-gold .items-list > li .items-img {
  aspect-ratio: 1.618/1;
}

.img-la-screen .items-list > li .items-img {
  aspect-ratio: 4/3;
}

.img-pt-gold .items-list > li .items-img {
  aspect-ratio: 1/1.618;
}

.img-pt-screen .items-list > li .items-img {
  aspect-ratio: 3/4;
}

.items-list > li .items-title {
  margin-top: 1.142em;
  margin-bottom: 0.571em;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.4;
  word-break: break-all;
  font-weight: 600;
  letter-spacing: 2px;
}

@media only screen and (min-width: 768px) {
  .items-list > li .items-title {
    margin-top: 1.5em;
  }
}

.items-list > li .items-price {
  font-size: 13px;
  font-size: 1.3rem;
  text-align: right;
  line-height: 2;
  letter-spacing: 2px;
  overflow-wrap: anywhere;
}

.items-list > li .items-price .default {
  color: var(--font-clr);
}

.items-list > li .items-price .discount {
  color: var(--clr-red);
  overflow-wrap: anywhere;
}

.items-list > li .items-price .ratio {
  padding: 0 0.5em;
  font-size: 10px;
  font-size: 1rem;
  color: var(--clr-red);
  border: solid 1px var(--clr-red);
  vertical-align: 0.2em;
  display: none;
}

@media only screen and (min-width: 768px) {
  .items-list > li .items-price {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

.items-list > li .items-status {
  margin-top: 1em;
  font-size: 10px;
  font-size: 1rem;
}

.items-list > li .items-status li {
  display: inline-block;
  padding: 0 0.4em;
  margin-bottom: 0.8em;
  font-size: 10px;
  font-size: 1rem;
  color: #fff;
  line-height: 1.5;
  border-radius: 2px;
}

@media only screen and (min-width: 768px) {
  .items-list > li .items-status li {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.items-list > li .items-status li + li {
  margin-left: 0.5em;
}

.items-list > li .items-status .discount {
  background: var(--clr-red);
}

.items-list > li .items-status .community {
  background: var(--community);
}

.items-list > li .items-status .coming-soon {
  background: var(--comingsoon);
}

.items-list > li .items-status .takeout {
  background: var(--takeout);
}

.items-list > li .items-status .pre-order {
  background: var(--preOrder);
}

.items-list > li .items-status .lottery {
  background: var(--lottery);
}

.items-list > li .items-status .soldout {
  background: #777;
}

.items-list {
  font-size: 10px;
  font-size: 1rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-column-gap: 1em;
  grid-row-gap: 2.2em;
}

@media only screen and (min-width: 768px) {
  .items-list {
    grid-template-columns: repeat(2, 1fr);
    grid-column-gap: 3.2em;
    grid-row-gap: 4.8em;
  }
}

@media only screen and (min-width: 1024px) {
  .items-list.items-clm-pc3 {
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 6.4em;
    grid-row-gap: 8em;
  }

  .items-list.items-clm-pc4 {
    grid-template-columns: repeat(4, 1fr);
    grid-column-gap: 3.2em;
    grid-row-gap: 8em;
  }
}

.item-related .items-list {
  grid-template-columns: repeat(3, 1fr);
  grid-column-gap: 0.8em;
}

.item-related .items-list li .items-title {
  font-size: 13px;
  font-size: 1.3rem;
}

@media only screen and (min-width: 768px) {
  .item-related .items-list li .items-title {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

@media only screen and (min-width: 768px) {
  .item-related .items-list {
    grid-column-gap: 3.2em;
    grid-row-gap: 4.8em;
  }
}

.items-load {
  height: 1.5em;
  font-size: 10px;
  font-size: 1rem;
}

.loader,
.loader:before,
.loader:after {
  border-radius: 50%;
  width: 1.5em;
  height: 1.5em;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation: load7 1.8s infinite ease-in-out;
  animation: load7 1.8s infinite ease-in-out;
}

.loader {
  position: relative;
  margin: 0 auto;
  color: var(--font-clr);
  font-size: 10px;
  font-size: 1rem;
  text-indent: -9999em;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
  -webkit-transform: translateY(-2.6em);
  transform: translateY(-2.6em);
}

.loader:before,
.loader:after {
  content: "";
  position: absolute;
  top: 0;
}

.loader:before {
  left: -2.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.loader:after {
  left: 2.5em;
}

@-webkit-keyframes load7 {
  0%,
  80%,
  100% {
    -webkit-box-shadow: 0 2.5em 0 -1.3em;
    box-shadow: 0 2.5em 0 -1.3em;
  }

  40% {
    -webkit-box-shadow: 0 2.5em 0 0;
    box-shadow: 0 2.5em 0 0;
  }
}

@keyframes load7 {
  0%,
  80%,
  100% {
    -webkit-box-shadow: 0 2.5em 0 -1.3em;
    box-shadow: 0 2.5em 0 -1.3em;
  }

  40% {
    -webkit-box-shadow: 0 2.5em 0 0;
    box-shadow: 0 2.5em 0 0;
  }
}

.mail-wrap {
  font-size: 10px;
  font-size: 1rem;
  padding: 6.4em 1.6em;
  text-align: center;
  position: relative;
  z-index: 0;
}

@media only screen and (min-width: 768px) {
  .mail-wrap {
    padding: 9.2em 3.2em 10.4em;
  }
}

@media only screen and (min-width: 1024px) {
  .mail-wrap {
    padding: 12em 6.4em 13.2em;
  }
}

.mail-wrap .mail-img {
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #343434;
}

.mail-wrap .mail-img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -webkit-filter: brightness(50%);
  filter: brightness(50%);
}

.mail-wrap .ttl-h2 {
  font-size: 22px;
  font-size: 2.2rem;
  line-height: 2;
  margin: 0;
  margin-bottom: 1.909em;
  color: #fff;
}

.mail-wrap .mail-txt {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
  letter-spacing: 2px;
  margin-bottom: 3em;
  text-shadow: 0px 0px 8px rgba(0, 0, 0, 0.5);
  color: #fff;
}

.mail-wrap div.x_mailMagazineSubscribe_field {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: 1fr;
  grid-column-gap: 8px;
}

.mail-wrap button.x_mailMagazineSubscribe_submit {
  height: 2.461em;
  padding: 0 1.23em;
  font-size: 13px;
  font-size: 1.3rem;
  text-align: center;
  color: #fff;
  background: #000;
  border: 1px solid #222;
  cursor: pointer;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 3px;
  letter-spacing: 2px;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  width: auto;
}

.mail-wrap button.x_mailMagazineSubscribe_submit:hover {
  background-color: #333;
}

.mail-wrap input.mailMagazineSubscribe_input {
  height: 2.461em;
  padding: 0 0.769em;
  font-size: 13px;
  font-size: 1.3rem;
  color: #949494;
  background: rgba(255, 255, 255, 0.9);
  border: none;
  margin: 0;
  border-radius: 3px;
}

.mail-wrap input.mailMagazineSubscribe_input:focus {
  outline: none;
  border: 1px solid #222;
}

.mailMagazineSubscribe_confirm {
  color: #fff;
  font-size: 14px;
  font-size: 1.4rem;
  margin: 0 -10em;
}

.mailMagazineSubscribe_form {
  margin: 0 auto;
  width: 100%;
  max-width: 32.6em;
}

.top-mv {
  position: relative;
  margin-top: -8em;
  /* margin-bottom: -8em; */
}

@media only screen and (min-width: 1024px) {
  .top-mv {
    margin-top: -7.5em;
  }
}

.top-mv.dots-clr-wh #topMvSlider .slick-dots li button:before {
  color: #fff;
}

.top-mv.dots-clr-bk #topMvSlider .slick-dots li button:before {
  color: #222;
}

.top-mv-slide {
  font-size: 10px;
  font-size: 1rem;
}

#topMvSlider .top-mv-box {
  position: relative;
  max-width: 100%;
  height: 100svh;
}

#topMvSlider .top-mv-box img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 1024px) {
  #topMvSlider .top-mv-box img.is-sp {
    display: none;
  }
}

#topMvSlider .top-mv-box img.is-pc {
  display: none;
}

@media only screen and (min-width: 1024px) {
  #topMvSlider .top-mv-box img.is-pc {
    display: block;
  }
}

#topMvSlider .top-mv-box a:hover {
  opacity: 1;
}

#topMvSlider .slick-dots {
  position: absolute;
  display: inline-block;
  top: 0;
  bottom: 0;
  left: auto;
  margin: auto;
  right: 1.6em;
  width: auto;
  height: 1em;
}

#topMvSlider .slick-dots li {
  position: relative;
  top: -8em;
  display: block;
}

#topMvSlider .slick-dots li button:before {
  font-size: 16px;
  font-size: 1.6rem;
  content: "■";
  width: 2em;
  height: 2em;
}

@media only screen and (min-width: 768px) {
  #topMvSlider .slick-dots {
    right: 3.2em;
  }
}

@media only screen and (min-width: 1024px) {
  #topMvSlider .slick-dots {
    right: 4.6em;
  }
}

/*====== 9-1-1 縦線が動いてスクロールを促す =======*/
/*スクロールダウン全体の場所*/
.scrolldown {
  position: absolute;
  left: 50%;
  bottom: 1em;
  height: 5em;
}

.scrolldown > span {
  position: absolute;
  left: -1.5em;
  top: -1.5em;
  color: #222;
  font-size: 16px;
  font-size: 1.6rem;
  letter-spacing: 0.05em;
}

.scrolldown::after {
  position: absolute;
  top: 0;
  content: "";
  width: 1px;
  height: 3em;
  background: #222;
  -webkit-animation: pathmove 1.4s ease-in-out infinite;
  animation: pathmove 1.4s ease-in-out infinite;
  opacity: 0;
}

.top-mv.dots-clr-bk .scrolldown > span {
  color: #222;
}

.top-mv.dots-clr-bk .scrolldown::after {
  background: #222;
}

.top-mv.dots-clr-wh .scrolldown > span {
  color: #fff;
}

.top-mv.dots-clr-wh .scrolldown::after {
  background: #fff;
}

@-webkit-keyframes pathmove {
  0% {
    height: 0;
    top: 0;
    opacity: 0;
  }

  30% {
    height: 30px;
    opacity: 1;
  }

  100% {
    height: 0;
    top: 50px;
    opacity: 0;
  }
}

@keyframes pathmove {
  0% {
    height: 0;
    top: 0;
    opacity: 0;
  }

  30% {
    height: 30px;
    opacity: 1;
  }

  100% {
    height: 0;
    top: 50px;
    opacity: 0;
  }
}

.top-concept {
  padding: 9em 1.6em 8em;
  overflow: hidden;
}

.top-concept .text-wrap {
  width: 100%;
  padding-bottom: 2em;
  margin-top: 8em;
}

@media only screen and (min-width: 768px) {
  .top-concept .text-wrap {
    padding-bottom: 4em;
    text-align: left;
    scrollbar-color: rgba(34, 34, 34, 0.2235294118) transparent;
    scrollbar-width: thin;
  }

  .top-concept .text-wrap::-webkit-scrollbar {
    background: transparent;
    height: 3px;
  }
}

.top-concept .ttl {
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.4;
  font-weight: bold;
  margin-bottom: 2.666em;
  letter-spacing: 2px;
  color: #;
}

.top-concept .txt {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.8;
  letter-spacing: 2px;
}

.top-concept .txt span {
  display: block;
  margin-bottom: 2em;
}

.top-concept .txt a {
  text-decoration: overline;
}

.top-concept .btn {
  position: relative;
  margin-top: 1.6em;
  line-height: 0;
}

.top-concept .btn a {
  display: inline-block;
  width: 100%;
}

.top-concept .btn a:hover {
  opacity: 1;
}

.top-concept .btn a:hover span::after {
  right: -2em;
}

.top-concept .btn span {
  position: relative;
  margin-left: -0.7em;
  color: #e8652b;
}

@media only screen and (min-width: 768px) {
  .top-concept .btn {
    margin-top: 3em;
  }
}

@media only screen and (min-width: 768px) {
  .top-concept {
    padding: 9em 3.2em 8em;
  }
}

.top-concept.is-mv-non {
  padding-top: 6em;
}

@media only screen and (min-width: 768px) {
  .top-concept.is-mv-non {
    padding-top: 9em;
  }
}

/*縦書き*/
@media only screen and (min-width: 768px) {
  .top-concept.text-vertical .text-wrap {
    overflow-x: scroll;
    max-height: 46em;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    text-orientation: upright;
  }

  .top-concept.text-vertical .txt {
    margin-right: 3.428em;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    text-orientation: upright;
  }

  .top-concept.text-vertical .txt span {
    display: block;
    height: 100%;
    margin-bottom: 0;
    margin-left: 2em;
    max-height: 46em;
    word-break: break-all;
  }

  .top-concept.text-vertical .txt a {
    text-decoration: overline;
  }
}

/*横書き*/
@media only screen and (min-width: 768px) {
  .top-concept.text-horizontal {
    padding: 9.6em 3.2em 8em;
  }
}

@media only screen and (min-width: 1024px) {
  .top-concept.text-horizontal {
    padding: 14.8em 3.2em 8em;
    overflow: visible;
  }
}

@media only screen and (min-width: 1024px) {
  .top-concept.text-horizontal.is-mv-non {
    padding-top: 10.8em;
  }
}

.top-concept-img {
  margin-top: 8em;
  width: 110%;
  margin-left: -20px;
}

.top-concept-img .img {
  width: 100%;
  text-align: center;
}

.top-concept-img .img img {
  margin: 0 auto;
  max-width: 100%;
  height: auto;
  max-height: 57.142em;
}

.top-concept-img .img .is-pc {
  display: none;
}

@media only screen and (min-width: 1024px) {
  .top-concept-img .img .is-pc {
    display: block;
  }

  .top-concept-img .img .is-sp {
    display: none;
  }
}

@media only screen and (min-width: 768px) {
  .top-concept-img {
    margin-top: 10em;
  }
}

.marquee {
  white-space: nowrap;
  position: relative;
  width: 100%;
  height: 20vw; /* 画面幅に対して高さを決める (例：20%) */
  max-height: 150px; /* 上限を設ける */
  overflow: visible;
  margin-left: -20vw;
}

.marquee-content {
  display: inline-block;
  white-space: nowrap;
  animation: marquee 60s linear infinite;
}

.marquee-content img {
  height: 100%;
  vertical-align: middle;
}

/* 無限スクロールのアニメーション */
@keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
  .marquee {
    height: 30vw; /* スマホでは少し高くする */
    max-height: 120px;
  }
}

@media (max-width: 480px) {
  .marquee {
    height: 40vw;
    max-height: 100px;
  }
}

.top-info-important {
  padding: 0 1.6em 8em;
}

.top-info-important.is-concept-non {
  margin-top: 13.6em;
}

.top-info-important .link {
  position: relative;
  padding: 0.65em 1.6em;
  background-color: var(--clr-gray);
  text-align: center;
}

.top-info-important .link .info-txt {
  position: relative;
  padding-left: 1.65em;
  text-decoration: none;
  display: inline-block;
}

.top-info-important .link .info-txt::before {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  content: "";
  display: block;
  width: 1.3em;
  height: 1.3em;
  background-color: #e8652b;
  -webkit-mask: url("data:image/svg+xml;charset=utf8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><circle cx='12' cy='12' r='11' stroke='black'/><path d='M11.538 13.626L11.258 8.194L11.216 6.528H12.77L12.728 8.194L12.448 13.626H11.538ZM12 17.07C11.496 17.07 11.09 16.72 11.09 16.16C11.09 15.6 11.496 15.222 12 15.222C12.49 15.222 12.896 15.6 12.896 16.16C12.896 16.72 12.49 17.07 12 17.07Z' fill='black'/></svg>");
  -webkit-mask-image: url("data:image/svg+xml;charset=utf8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><circle cx='12' cy='12' r='11' stroke='black'/><path d='M11.538 13.626L11.258 8.194L11.216 6.528H12.77L12.728 8.194L12.448 13.626H11.538ZM12 17.07C11.496 17.07 11.09 16.72 11.09 16.16C11.09 15.6 11.496 15.222 12 15.222C12.49 15.222 12.896 15.6 12.896 16.16C12.896 16.72 12.49 17.07 12 17.07Z' fill='black'/></svg>");
  mask-image: url("data:image/svg+xml;charset=utf8,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><circle cx='12' cy='12' r='11' stroke='black'/><path d='M11.538 13.626L11.258 8.194L11.216 6.528H12.77L12.728 8.194L12.448 13.626H11.538ZM12 17.07C11.496 17.07 11.09 16.72 11.09 16.16C11.09 15.6 11.496 15.222 12 15.222C12.49 15.222 12.896 15.6 12.896 16.16C12.896 16.72 12.49 17.07 12 17.07Z' fill='black'/></svg>");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.top-info-important .link .info-txt:hover {
  cursor: pointer;
}

@media only screen and (min-width: 768px) {
  .top-info-important {
    padding: 0 3.2em 10.4em;
  }
}

.top-rank {
  border: solid 3px blue;
  padding: 1em;
  max-width: 100em;
  margin: 0 auto;
  font-size: 10px;
  font-size: 1rem;
}

.top-info {
  padding: 4em 1.6em 8em;
}

@media only screen and (min-width: 768px) {
  .top-info {
    padding: 8em 3.2em 10.4em;
  }
}

@media only screen and (min-width: 768px) and (min-width: 1024px) {
  .top-info {
    padding-bottom: 13.6em;
  }

  .top-info + .top-blog {
    padding-top: 10.4em;
  }
}

.top-info .top-info-list {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
}

.top-info .top-info-list > li {
  letter-spacing: 2px;
}

.top-info .top-info-list > li + li {
  margin-top: 1.714em;
}

@media only screen and (min-width: 768px) {
  .top-info .top-info-list .top-info-data {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 1em;
  }

  .top-info .top-info-list .top-info-data .date {
    width: 21.333%;
  }

  .top-info .top-info-list .top-info-data .ttl {
    width: 78.667%;
  }
}

.top-info .top-info-list .top-info-data .ttl a {
  position: relative;
  text-decoration: none;
  display: inline-block;
}

.top-info .top-info-list .top-info-data .ttl a:hover {
  opacity: 1;
}

.top-info .top-info-list .top-info-data .ttl a:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

.top-info .top-info-list .top-info-data .ttl a::after,
.top-info .top-info-list .top-info-data .ttl a::before {
  position: absolute;
  left: 0;
  content: "";
  width: 100%;
  height: 1px;
  background-color: var(--font-clr);
  bottom: -7px;
}

.top-info .top-info-list .top-info-data .ttl a::after {
  opacity: 0.2;
}

.top-info .top-info-list .top-info-data .ttl a::before {
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

.top-info .ttl-h2 {
  margin-top: 0;
}

.banner {
  font-size: 14px;
  font-size: 1.4rem;
  text-align: center;
  padding: 4.285em 1.428em;
}

.banner img {
  max-width: 100%;
  height: auto;
}

@media only screen and (min-width: 768px) {
  .banner {
    padding: 7.142em 2.857em;
  }
}

.banner + .main-contents {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.banner + .main-contents .main-area > .item-wrapper:first-child {
  margin-top: 0 !important;
}

.top-blog {
  padding: 8em 1.6em;
}

@media only screen and (min-width: 768px) {
  .top-blog {
    padding: 10.4em 3.2em;
  }
}

@media only screen and (min-width: 1024px) {
  .top-blog {
    padding: 13.6em 3.2em;
  }
}

.top-blog .ttl-h2 {
  margin-top: 0;
}

.top-blog .btn {
  margin-top: 4em;
  text-align: center;
  display: none;
}

.top-blog .btn a {
  position: relative;
  padding: 0.8em 4em;
  text-decoration: none;
  display: inline-block;
  border: 1px solid var(--font-clr);
  letter-spacing: 2px;
}

.top-blog .btn a::before {
  position: absolute;
  display: block;
  top: 0;
  bottom: 0;
  margin: auto;
  left: -1.5em;
  content: "";
  width: 3em;
  height: 1px;
  background-color: var(--font-clr);
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.top-blog .btn a:hover {
  opacity: 1;
}

.top-blog .btn a:hover::before {
  left: -1em;
}

@media only screen and (min-width: 768px) {
  .top-blog .btn {
    margin-top: 6.4em;
  }

  .top-blog .btn a {
    padding: 1.142em 5.714em;
  }

  .top-blog .btn a::before {
    width: 4em;
    left: -2em;
  }

  .top-blog .btn a:hover::before {
    left: -1.5em;
  }
}

@media only screen and (min-width: 1024px) {
  .top-blog .btn {
    margin-top: 8em;
  }
}

.top-blog-list {
  font-size: 10px;
  font-size: 1rem;
}

@media only screen and (min-width: 768px) {
  .top-blog-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 2.4em;
    grid-row-gap: 1.6em;
  }
}

@media only screen and (min-width: 1024px) {
  .top-blog-list {
    grid-column-gap: 6.4em;
  }
}

.top-blog-list li {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 0 !important;
  opacity: 1;
  -webkit-transition: 0.5s opacity;
  transition: 0.5s opacity;
}

.top-blog-list li:hover {
  opacity: 0.5;
  -webkit-transition: 0.5s opacity;
  transition: 0.5s opacity;
}

.top-blog-list li a {
  display: grid;
  text-decoration: none;
  grid-template-rows: 1fr 5em;
  grid-template-columns: 40% 1fr;
  grid-template-areas: "areaA areaB" "areaA areaC";
}

@media only screen and (min-width: 768px) {
  .top-blog-list li a {
    display: block;
  }
}

.top-blog-list li .blog-ttl {
  margin: 0 0 0.5em !important;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 1.8;
  letter-spacing: 2px;
  font-weight: bold;
  grid-area: areaB;
}

@media only screen and (min-width: 768px) {
  .top-blog-list li .blog-ttl {
    margin: 1.5em 0 0.5em !important;
    line-height: 2;
  }
}

.top-blog-list li .blog-date {
  margin: 0.833em 0 0 0 !important;
  font-size: 12px;
  font-size: 1.2rem;
  letter-spacing: 2px;
  color: var(--font-clr);
  opacity: 0.7;
  grid-area: areaC;
}

@media only screen and (min-width: 768px) {
  .top-blog-list li .blog-date {
    padding-bottom: 4em;
  }
}

.top-blog-list li .blog-img {
  position: relative;
  padding-right: 1.5em;
  width: 100%;
  height: auto;
  overflow: hidden;
  border-radius: 3px;
  grid-area: areaA;
}

.top-blog-list li .blog-img img {
  width: 100%;
  height: auto;
  -o-object-fit: cover;
  object-fit: cover;
  vertical-align: bottom;
  margin-bottom: 2em;
}

@media only screen and (min-width: 768px) {
  .top-blog-list li .blog-img {
    padding-right: 0;
    margin-bottom: 0;
  }

  .top-blog-list li .blog-img img {
    margin-bottom: 0;
  }
}

.img-sq .top-blog-list li .blog-img img {
  aspect-ratio: 1/1;
}

.img-la-gold .top-blog-list li .blog-img img {
  aspect-ratio: 1.618/1;
}

.img-la-screen .top-blog-list li .blog-img img {
  aspect-ratio: 4/3;
}

.img-pt-gold .top-blog-list li .blog-img img {
  aspect-ratio: 1/1.618;
}

.img-pt-screen .top-blog-list li .blog-img img {
  aspect-ratio: 3/4;
}

.top-pick {
  overflow: hidden;
}

.top-pick-area {
  position: relative;
  padding: 4em 1.6em 8em;
}

@media only screen and (min-width: 768px) {
  .top-pick-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 10.4em 3.2em 10.4em;
    gap: 0 2.4em;
  }
}

#topPickImgSlider {
  position: relative;
  width: 100%;
}

#topPickImgSlider img {
  margin: auto;
  width: 100%;
  height: 100vh;
  max-width: 100svw;
  max-height: calc(100svw - 32px);
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  #topPickImgSlider img {
    max-height: 46.95svw;
    overflow: hidden;
    -o-object-fit: cover;
    object-fit: cover;
    text-align: left;
  }
}

@media only screen and (min-width: 1024px) {
  #topPickImgSlider img {
    max-height: 29.53svw;
    max-width: 29.53svw;
  }
}

@media only screen and (min-width: 768px) {
  #topPickImgSlider {
    width: auto;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
  }

  #topPickImgSlider p {
    width: auto;
    padding-right: 1.714em;
  }
}

@media only screen and (min-width: 1024px) {
  #topPickImgSlider p {
    padding-right: 3.428em;
  }
}

.slick-num {
  z-index: 2;
  position: absolute;
  top: 0.15em;
  right: 1em;
  font-size: 20px;
  font-size: 2rem;
  letter-spacing: 2px;
}

.slick-num .now-count {
  font-size: 40px;
  font-size: 4rem;
}

.slick-num .all-count {
  font-size: 20px;
  font-size: 2rem;
}

@media only screen and (min-width: 768px) {
  .slick-num {
    top: 5em;
    right: auto;
    left: 1.6em;
  }

  .slick-num .now-count {
    font-size: clamp(20px, -1.8181818182px + 6.8181818182vw, 80px);
    line-height: 1;
  }

  .slick-num .all-count {
    font-size: 16px;
    font-size: 1.6rem;
  }
}

@media only screen and (min-width: 1024px) {
  .slick-num {
    top: 5.2em;
  }

  .slick-num .all-count {
    font-size: 24px;
    font-size: 2.4rem;
  }
}

#topPickInfoSlider li .ttl {
  margin-top: 1em;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 2;
}

#topPickInfoSlider li .text {
  margin-top: 1.142em;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  /* 任意の行数を指定 */
}

@media only screen and (min-width: 768px) {
  #topPickInfoSlider li .text {
    -webkit-line-clamp: 4;
    /* 任意の行数を指定 */
  }
}

@media only screen and (min-width: 1300px) {
  #topPickInfoSlider li .text {
    -webkit-line-clamp: 5;
    /* 任意の行数を指定 */
  }
}

#topPickInfoSlider li .more {
  margin-top: 1.714em;
  text-align: right;
}

#topPickInfoSlider li .more a {
  position: relative;
  left: -2em;
  text-decoration: none;
  display: inline-block;
}

#topPickInfoSlider li .more a:hover {
  opacity: 1;
}

#topPickInfoSlider li .more a:hover::after {
  right: -2em;
}

@media only screen and (min-width: 768px) {
  #topPickInfoSlider {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    width: 28.78%;
  }

  #topPickInfoSlider li {
    width: auto;
  }

  #topPickInfoSlider li .ttl {
    margin-top: 4.444em;
  }
}

@media only screen and (min-width: 1024px) {
  #topPickInfoSlider li .ttl {
    margin-top: clamp(80px, -176px + 25vw, 124px);
  }
}

.slider-arrow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin: 4em 0 0;
  position: relative;
}

@media only screen and (min-width: 768px) {
  .slider-arrow {
    position: absolute;
    bottom: 10.4em;
    left: 3.2em;
    z-index: 5;
  }
}

.prev-arrow,
.next-arrow {
  display: block;
  width: 4em;
  height: 4em;
  background: transparent;
  border-radius: 50%;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  cursor: pointer;
  position: relative;
  border: 1px solid var(--font-clr);
}

.prev-arrow {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  margin-right: 1.5em;
}

.prev-arrow::before,
.next-arrow::before {
  position: absolute;
  content: "";
  width: 0.8em;
  height: 0.8em;
  border-right: 1px solid var(--font-clr);
  border-top: 1px solid var(--font-clr);
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.product-bgwrap-all {
  background-color: var(--item-bg-clr);
  padding: 4em 0;
}

@media only screen and (min-width: 768px) {
  .product-bgwrap-all {
    padding: 8em 0;
  }
}

@media only screen and (min-width: 1024px) {
  .product-bgwrap-all {
    padding: 10.4em 0;
  }
}

.product-bgwrap {
  width: 100%;
  padding: 0 1.6em;
}

.product-bgwrap * {
  min-height: 0;
  min-width: 0;
}

@media only screen and (min-width: 768px) {
  .product-bgwrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0 2.4em;
    padding: 0 3.2em;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
  }
}

@media only screen and (min-width: 1024px) {
  .product-bgwrap {
    gap: 0 6%;
  }
}

.product-imgs {
  position: relative;
  display: block;
}

@media only screen and (min-width: 768px) {
  .product-imgs {
    width: 54.166%;
  }
}

.product-imgs img {
  width: 100%;
}

.product-imgs .label_image {
  font-size: 10px;
  font-size: 1rem;
  position: absolute;
  width: 6em;
  height: auto;
  max-height: 40em;
  top: 0;
  left: 0;
  z-index: 1;
}

.product-imgs .item-none {
  display: grid;
  place-items: center;
  height: 50vh;
  font-size: 14px;
  font-size: 1.4rem;
  border: solid 1px var(--item-font-clr);
}

.product-imgs #itemSlider {
  margin: 0;
}

.product-imgs .slick-track {
  line-height: 0;
  font-size: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.product-imgs .slick-track img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}

.product-imgs .slick-prev,
.product-imgs .slick-next {
  position: absolute;
  top: calc(50% - 3em);
  height: 0;
  width: 4em;
  padding-top: 6em;
  font-size: 10px;
  font-size: 1rem;
  border: 0;
  background: none;
  -webkit-transform: none;
  transform: none;
  z-index: 1;
}

.product-imgs .slick-prev::before,
.product-imgs .slick-next::before {
  position: absolute;
  top: 1em;
  content: "";
  display: block;
  width: 1em;
  height: 1em;
  border-top: solid 2px var(--item-font-clr);
  border-right: solid 2px var(--item-font-clr);
}

.product-imgs .slick-prev:hover,
.product-imgs .slick-next:hover {
  cursor: pointer;
}

.product-imgs .slick-prev {
  left: 0;
}

.product-imgs .slick-prev::before {
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
  left: 0.6em;
}

.product-imgs .slick-next {
  right: 0;
}

.product-imgs .slick-next::before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  right: 0.6em;
}

.product-imgs #itemThumb {
  margin-top: 2em;
  font-size: 10px;
  font-size: 1rem;
}

.product-imgs .thumbs-list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-column-gap: 0.5em;
  grid-row-gap: 0.5em;
  font-size: 10px;
  font-size: 1rem;
}

.product-imgs .thumbs-list li {
  padding-top: 100%;
  opacity: 0.5;
  -webkit-transition: 0.5s opacity;
  transition: 0.5s opacity;
}

.product-imgs .thumbs-list li:hover {
  cursor: pointer;
  opacity: 1;
  -webkit-transition: 0.5s opacity;
  transition: 0.5s opacity;
}

.product-imgs .thumbs-list li.slick-active {
  opacity: 1;
}

@media only screen and (min-width: 768px) {
  .product-imgs {
    max-width: 65em;
  }

  .product-imgs .thumbs-list {
    grid-template-columns: repeat(10, 1fr);
  }
}

.product-data {
  margin-top: 3.2em;
  color: var(--item-font-clr);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.product-data > * {
  width: 100%;
}

@media only screen and (min-width: 768px) {
  .product-data {
    margin-top: 0;
    width: 39.666%;
  }
}

.product-data .item-soldout {
  margin-bottom: 1.111em;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.4;
  color: var(--clr-red);
}

.product-data .item-ttl {
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.4;
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1;
}

.product-data .item-ttl .item-filename {
  display: block;
  margin-top: 1em;
  font-size: 10px;
  font-size: 1rem;
  opacity: 0.5;
}

.product-data .item-tags {
  margin-bottom: 3.2em;
}

.product-data .item-tags li {
  display: inline-block;
  padding: 0.4em 0.8em;
  font-size: 10px;
  font-size: 1rem;
  color: #fff;
  line-height: 1.5;
  border-radius: 2px;
  background-color: #777;
}

@media only screen and (min-width: 768px) {
  .product-data .item-tags li {
    font-size: 12px;
    font-size: 1.2rem;
  }
}

.product-data .item-price {
  margin-top: 2em;
  font-size: 10px;
  font-size: 1rem;
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
}

.product-data .item-price .default,
.product-data .item-price .discount {
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 2;
  letter-spacing: 2px;
}

.product-data .item-price .discount {
  color: var(--clr-red);
  display: block;
  font-weight: bold;
}

.product-data .item-price .ratio {
  margin-left: 0.5em;
  display: inline-block;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1;
  color: var(--clr-red);
  border-radius: 2px;
}

.product-data .item-price:has(.ratio) .default {
  font-size: 14px;
  font-size: 1.4rem;
  text-decoration: line-through;
}

.product-data .bnplBanner {
  -webkit-box-ordinal-group: 4;
  -ms-flex-order: 3;
  order: 3;
  margin-top: 20px;
}

.product-data .ageVerificationWarning {
  font-size: 19px;
  font-size: 1.9rem;
  color: var(--clr-red);
  letter-spacing: 2px;
  line-height: 1.8;
}

.product-data .ageVerificationWarning i.si-attentionTriangle {
  font-size: 85%;
  margin-right: 0.1em;
}

.product-data .item-comin {
  color: var(--comingsoon);
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: normal;
  margin-bottom: 0.3em;
}

.product-data .item-comin-wrapper {
  background-color: #dde7f5;
  padding: 1.6em;
}

.product-data .item-comin-wrapper p {
  color: var(--comingsoon);
  letter-spacing: 2px;
}

.product-data .communityModal {
  color: #222;
}

.product-data #itemAttention {
  margin-top: 3.428em;
}

.product-data #itemAttention > div {
  margin-bottom: 3.428em;
}

.product-data #itemAttention .attention {
  margin-top: 0.416em;
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 2;
}

.product-data #itemAttention .attention:first-child {
  margin-top: 0;
}

.product-data #itemAttention .attention a {
  font-weight: normal;
  line-height: 2;
}

.product-data #itemAttention .salesPeriod--willStart::before {
  content: "※";
}

.product-data #itemAttention .preOrder .preOrder__label {
  margin-bottom: 0.416em;
  background: var(--preOrder);
}

.product-data #itemAttention .preOrder .preOrder__data {
  margin: 0.666em 0 0 0;
  font-size: 12px !important;
  font-size: 1.2rem !important;
  letter-spacing: 2px;
}

.product-data #itemAttention .preOrder .preOrder__data::before {
  content: "※";
}

.product-data #itemAttention .membershipPoint .membershipPoint__amountWrapper {
  color: var(--clr-red);
}

.product-data #itemAttention .membershipPoint .membershipPoint__amount {
  position: relative;
  padding-left: 1.277em;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.4;
  font-weight: normal;
}

.product-data #itemAttention .membershipPoint .membershipPoint__amount::before {
  position: absolute;
  left: 0;
  top: 0.307em;
  width: 1.384em;
  height: 1.384em;
  font-size: 13px;
  font-size: 1.3rem;
  display: inline-block;
  content: "";
  line-height: 1.4;
  background-color: var(--clr-red);
  -webkit-mask: url("data:image/svg+xml;charset=utf8,<svg width='17' height='18' viewBox='0 0 17 18' fill='none' xmlns='http://www.w3.org/2000/svg'><circle cx='8.5' cy='9' r='8' stroke='red'/><path d='M6.3 14.5V4.971H9.017C11.149 4.971 12.592 5.686 12.592 7.779C12.592 9.781 11.162 10.717 9.069 10.717H7.509V14.5H6.3ZM7.509 9.742H8.926C10.59 9.742 11.396 9.131 11.396 7.779C11.396 6.388 10.551 5.959 8.861 5.959H7.509V9.742Z' fill='black'/></svg>");
  -webkit-mask-image: url("data:image/svg+xml;charset=utf8,<svg width='17' height='18' viewBox='0 0 17 18' fill='none' xmlns='http://www.w3.org/2000/svg'><circle cx='8.5' cy='9' r='8' stroke='red'/><path d='M6.3 14.5V4.971H9.017C11.149 4.971 12.592 5.686 12.592 7.779C12.592 9.781 11.162 10.717 9.069 10.717H7.509V14.5H6.3ZM7.509 9.742H8.926C10.59 9.742 11.396 9.131 11.396 7.779C11.396 6.388 10.551 5.959 8.861 5.959H7.509V9.742Z' fill='black'/></svg>");
  mask-image: url("data:image/svg+xml;charset=utf8,<svg width='17' height='18' viewBox='0 0 17 18' fill='none' xmlns='http://www.w3.org/2000/svg'><circle cx='8.5' cy='9' r='8' stroke='red'/><path d='M6.3 14.5V4.971H9.017C11.149 4.971 12.592 5.686 12.592 7.779C12.592 9.781 11.162 10.717 9.069 10.717H7.509V14.5H6.3ZM7.509 9.742H8.926C10.59 9.742 11.396 9.131 11.396 7.779C11.396 6.388 10.551 5.959 8.861 5.959H7.509V9.742Z' fill='black'/></svg>");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.product-data #itemAttention .membershipPoint .membershipPoint__pointName {
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: normal;
  line-height: 1.4;
}

.product-data #itemAttention .communityLabel {
  padding: 0;
  position: relative;
  background: none;
}

.product-data #itemAttention .communityLabel .communityLabel__title {
  background: var(--community);
}

.product-data #itemAttention .communityLabel .communityLabel__note {
  margin: 0.666em 0 0 0;
  font-size: 12px !important;
  font-size: 1.2rem !important;
  color: var(--item-font-clr);
}

.product-data #itemAttention .communityLabel .communityLabel__note::before {
  content: "※";
}

.product-data #itemAttention .communityLabel .communityLabel__note::after {
  content: "。";
}

.product-data #itemAttention .communityLabel:hover .communityLabel__note {
  opacity: 1;
}

.product-data #itemAttention .lottery .lottery__label {
  margin-bottom: 0.357em;
  background: var(--lottery);
}

.product-data #itemAttention .lottery .lottery__data {
  margin: 0.416em 0 0 0;
  font-size: 12px !important;
  font-size: 1.2rem !important;
}

.product-data #itemAttention .lottery .lottery__data::before {
  content: "※";
}

.product-data #itemAttention .takeout .takeout__label {
  background: var(--takeout);
}

.product-data #itemAttention .takeout .takeout__data {
  margin: 0.416em 0 0 0;
  font-size: 12px !important;
  font-size: 1.2rem !important;
}

.product-data #itemAttention .takeout .takeout__data::before {
  content: "※";
}

.product-data #itemAttention .salesPeriod--term::before {
  content: "※";
}

.product-data #itemSelect .purchaseElement,
.product-data #itemSelect .itemOptionElement {
  font-size: 10px;
  font-size: 1rem;
  margin-top: 2.4em;
  color: #a43045;
}

.product-data #itemSelect label[for="valiationSelect"],
.product-data #itemSelect label.itemOption__name,
.product-data #itemSelect label[for="amountSelect"] {
  display: block;
  margin-bottom: 0.666em;
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1.5;
}

.product-data #itemSelect .itemOption__caption {
  position: relative;
  padding: 0 0 0 1.666em;
  margin: 0.666em 0;
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1.4;
}

.product-data #itemSelect .itemOption__caption::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.666em;
  display: block;
  width: 1.25em;
  height: 1px;
  background: var(--item-font-clr);
  opacity: 0.5;
}

.product-data #itemSelect select#valiationSelect,
.product-data #itemSelect select.itemOption__select,
.product-data #itemSelect select#amountSelect {
  min-width: 6.666em;
  padding: 0.416em 2.5em 0.416em 0.833em !important;
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1.4;
  color: #222;
  letter-spacing: 2px;
  border: solid 1px var(--item-font-clr);
  border-radius: 2px;
}

.product-data #itemSelect input.itemOption__input {
  padding: 0.416em 0.833em;
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1.4;
  color: #222;
  border: solid 1px var(--item-font-clr);
  border-radius: 2px;
}

.product-data #itemSelect .itemOption__caption--error {
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1.4;
  color: var(--clr-red);
}

.product-data #itemSelect .itemOption__count {
  margin-top: 0.416em;
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1.4;
  color: var(--item-font-clr);
}

.product-data .purchaseButton {
  margin-top: 4.8em;
  margin-bottom: 2.4em;
}

.product-data .purchaseButton .purchaseButton__btn {
  margin: 0;
  color: #fff;
  background-color: #222;
  border: none;
  width: 100%;
  line-height: 2;
  font-size: 16px;
  font-size: 1.6rem;
  padding: 1em;
  letter-spacing: 2px;
}

.product-data
  .purchaseButton
  .purchaseButton__btn.purchaseButton__btn--addToCart:hover,
.product-data
  .purchaseButton
  .purchaseButton__btn.purchaseButton__btn--requestRestockMail:hover {
  cursor: pointer;
}

.product-data
  .purchaseButton
  .purchaseButton__btn.purchaseButton__btn--requestRestockMail {
  background: #4071bb;
}

.product-data .purchaseButton .purchaseButton__btn:disabled,
.product-data
  .purchaseButton
  .purchaseButton__btn.purchaseButton__btn--disabled,
.product-data
  .purchaseButton
  .purchaseButton__btn.purchaseButton__btn--notApplying {
  background: #a8a4a4;
}

.product-data .purchaseButton .purchaseButton__btn:disabled:hover,
.product-data
  .purchaseButton
  .purchaseButton__btn.purchaseButton__btn--disabled:hover,
.product-data
  .purchaseButton
  .purchaseButton__btn.purchaseButton__btn--notApplying:hover {
  cursor: default;
  opacity: 1 !important;
}

#purchase_form {
  -webkit-box-ordinal-group: 5;
  -ms-flex-order: 4;
  order: 4;
}

.attention-wrap-all p {
  line-height: 2;
  font-size: 12px;
  font-size: 1.2rem;
}

.item-desc-default {
  margin-top: 4.8em;
  -webkit-box-ordinal-group: 6;
  -ms-flex-order: 5;
  order: 5;
}

.item-desc-default p {
  letter-spacing: 2px;
  line-height: 2;
}

#postageOpen {
  position: relative;
}

#postageOpen:hover {
  opacity: 1;
}

#postageOpen::before {
  content: "(";
}

#postageOpen::after {
  content: ")";
}

.product-detail {
  padding: 4em 1.6em;
}

@media only screen and (min-width: 768px) {
  .product-detail {
    padding: 8em 3.2em;
  }
}

.product-detail .item-desc .item-desc-default p {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
}

.product-detail .item-desc .item-desc-custom .appsItemDetailCustomTag_heading {
  font-size: 16px;
  font-size: 1.6rem;
  letter-spacing: 2px;
  font-weight: bold;
}

@media only screen and (min-width: 768px) {
  .product-detail
    .item-desc
    .item-desc-custom
    .appsItemDetailCustomTag_heading {
    font-size: 18px;
    font-size: 1.8rem;
  }
}

.product-detail
  .item-desc
  .item-desc-custom
  .appsItemDetailCustomTag_description {
  margin: 1.714em 0 !important;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
}

.product-detail .item-desc .item-desc-custom img.appsItemDetailCustomTag_image {
  margin: 2.4em auto !important;
  font-size: 10px;
  font-size: 1rem;
  width: auto;
  max-width: 100%;
  height: auto;
}

.product-detail .item-desc .item-desc-custom .appsItemDetailCustomTag_slider {
  margin: 2.4em 0 !important;
  font-size: 10px;
  font-size: 1rem;
}

.product-detail
  .item-desc
  .item-desc-custom
  .appsItemDetailCustomTag_slider
  img {
  max-width: 100%;
}

.product-detail .item-desc .item-desc-custom .appsItemDetailCustomTag_youtube {
  margin: 2.4em 0 !important;
  font-size: 10px;
  font-size: 1rem;
}

.product-detail
  .item-desc
  .item-desc-custom
  .appsItemDetailCustomTag_youtube
  iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
}

.product-detail .review01 {
  margin-top: 9.6em;
  clear: none !important;
}

@media only screen and (min-width: 768px) {
  .product-detail .review01 {
    margin-top: 13.6em;
  }
}

.product-detail .review01 .review01__title {
  margin: 0;
  text-align: left;
  letter-spacing: 2px;
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 1.5em;
}

.product-detail .review01 .review01__tabWrap {
  position: relative;
  border: none;
}

.product-detail .review01 .review01__tabWrap::before {
  height: 2px;
}

.product-detail .review01 .review01__tabWrap::after {
  top: auto;
}

.product-detail
  .review01
  .review01__tabChild:first-child
  .review01__radio
  + label {
  line-height: 1.4;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.product-detail .review01 .review01__trigger:before {
  border-right: 2px solid var(--font-clr);
  border-bottom: 2px solid var(--font-clr);
  opacity: 0.5;
}

.item-foot {
  margin-top: 4.8em;
  -webkit-box-ordinal-group: 8;
  -ms-flex-order: 7;
  order: 7;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.item-report {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.4;
}

.item-report a {
  position: relative;
  text-decoration: none;
}

.item-report a:hover {
  opacity: 1;
}

.item-report a:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

.item-report a::after,
.item-report a::before {
  position: absolute;
  left: 0;
  content: "";
  width: 100%;
  height: 1px;
  background-color: var(--item-font-clr);
  bottom: -7px;
}

.item-report a::after {
  opacity: 0.2;
}

.item-report a::before {
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

.item-sns {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1;
}

.item-sns li {
  font-size: 11px;
  font-size: 1.1rem;
  display: inline-block;
}

.item-sns li + li {
  margin-left: 0.5em;
}

.item-sns a {
  display: inline-block;
  text-decoration: none;
  line-height: 1;
  padding: 0.454em 0.909em 0.454em 2.363em;
  color: #fff;
  background-repeat: no-repeat;
  border-radius: 2px;
}

.item-sns .tw a {
  background-color: #222222;
  background-image: url("data:image/svg+xml;utf8,<svg viewBox='0 0 1200 1227' xmlns='http://www.w3.org/2000/svg'><path fill='%23ffffff' d='m714.163 519.284 446.727-519.284h-105.86l-387.893 450.887-309.809-450.887h-357.328l468.492 681.821-468.492 544.549h105.866l409.625-476.152 327.181 476.152h357.328l-485.863-707.086zm-144.998 168.544-47.468-67.894-377.686-540.2396h162.604l304.797 435.9906 47.468 67.894 396.2 566.721h-162.604l-323.311-462.446z'/></svg>");
  background-size: 1em auto;
  background-position: 0.727em 0.454em;
}

.item-sns .fb a {
  background-color: #1877f2;
  background-image: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%201024%201024%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%231877f2%3B%7D.cls-2%7Bfill%3A%23ffffff%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpath%20class%3D%22cls-2%22%20d%3D%22m1024%2C512C1024%2C229.23%2C794.77%2C0%2C512%2C0S0%2C229.23%2C0%2C512c0%2C255.55%2C187.23%2C467.37%2C432%2C505.78v-357.78h-130v-148h130v-112.8c0-128.32%2C76.44-199.2%2C193.39-199.2%2C56.02%2C0%2C114.61%2C10%2C114.61%2C10v126h-64.56c-63.6%2C0-83.44%2C39.47-83.44%2C79.96v96.04h142l-22.7%2C148h-119.3v357.78c244.77-38.41%2C432-250.22%2C432-505.78Z%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22m711.3%2C660l22.7-148h-142v-96.04c0-40.49%2C19.84-79.96%2C83.44-79.96h64.56v-126s-58.59-10-114.61-10c-116.95%2C0-193.39%2C70.88-193.39%2C199.2v112.8h-130v148h130v357.78c26.07%2C4.09%2C52.78%2C6.22%2C80%2C6.22s53.93-2.13%2C80-6.22v-357.78h119.3Z%22%2F%3E%3C%2Fsvg%3E");
  background-size: 1.272em auto;
  background-position: 0.727em 0.363em;
}

.product-relate {
  padding: 8em 1.6em;
}

@media only screen and (min-width: 768px) {
  .product-relate {
    padding: 10.4em 3.2em;
  }
}

@media only screen and (min-width: 1024px) {
  .product-relate {
    padding: 13.6em 3.2em;
  }
}

.product-relate .ttl-h2 {
  margin: 0;
  font-size: 22px;
  font-size: 2.2rem;
  margin-bottom: 2.461em;
  letter-spacing: 3px;
}

@media only screen and (min-width: 768px) {
  .product-relate .ttl-h2 {
    font-size: 26px;
    font-size: 2.6rem;
  }
}

@media only screen and (min-width: 1024px) {
  .product-relate .ttl-h2 {
    margin-bottom: 3.076em;
  }
}

#takeoutModal .takeoutModal__title,
.purchaseButtonModal__title {
  line-height: 1.5 !important;
  padding: 2em !important;
}

.communityBox .communityModal {
  width: initial;
  max-height: 90%;
  overflow: scroll;
  /*スクロールバー非表示（IE・Edge）*/
  -ms-overflow-style: none;
  /*スクロールバー非表示（Firefox）*/
  scrollbar-width: none;
}

.communityBox .communityModal::-webkit-scrollbar {
  display: none;
}

.communityBox .communityModal .communityOverview {
  max-height: none;
}

.communityBox .communityModal .communityRegisterButtons {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.communityBox .communityModal .communityRegisterButtons .button {
  margin: 0;
  width: 49%;
}

@media only screen and (min-width: 1024px) {
  .communityBox .communityModal {
    overflow: auto;
  }
}

@media screen and (max-width: 480px) {
  .communityBox .communityModal .communityRegisterButtons {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }

  .communityBox .communityModal .communityRegisterButtons .button {
    margin-top: 8px;
    width: 100%;
  }
}

.si-information,
.purchaseButtonModal__ageVerificationWarningText {
  color: #a43045;
}

.purchaseButtonModal__inputAreaLabel {
  color: #222;
}

.ageVerificationModal__error {
  color: #a43045;
}

/*デザインオプションの設定*/
.product-data.cv-btn-green
  .purchaseButton
  .purchaseButton__btn.purchaseButton__btn--addToCart {
  background-color: #73b96c;
}

.product-data.cv-btn-orange
  .purchaseButton
  .purchaseButton__btn.purchaseButton__btn--addToCart {
  background-color: #e8652b;
}

#communityPurchase {
  position: relative;
  z-index: 1;
}

#communityPurchase::before {
  z-index: -1;
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  content: "";
  background-color: var(--item-font-clr);
  opacity: 0.1;
  mix-blend-mode: multiply;
}

#communityPurchase .communitySignin.buttonPayid__signin {
  border: none;
}

.bread-wrap {
  padding: 0 1.6em;
}

@media only screen and (min-width: 768px) {
  .bread-wrap {
    padding: 0 3.2em;
  }
}

.bread-wrap .breadcrumb li {
  font-size: 12px;
  font-size: 1.2rem;
}

.bread-wrap .breadcrumb li a {
  padding: 1.333em 0;
  display: inline-block;
  letter-spacing: 2px;
}

@media only screen and (min-width: 768px) {
  .bread-wrap .breadcrumb li a {
    padding: 3.333em 0;
  }
}

.items-wrap {
  padding-top: 8em;
}

.items-wrap .ttl-h1 {
  letter-spacing: 3px;
  margin-bottom: 2.4em;
  font-size: 20px;
  font-size: 2rem;
  text-align: center;
}

@media only screen and (min-width: 768px) {
  .items-wrap .ttl-h1 {
    font-size: 24px;
    font-size: 2.4rem;
  }
}

#pageCategory .items-tags,
#pageSearch .items-tags {
  margin-bottom: 4em;
  text-align: center;
}

#pageCategory .items-tags > li,
#pageSearch .items-tags > li {
  margin-bottom: 2.5em;
  display: inline-block;
  line-height: 2;
  letter-spacing: 2px;
}

#pageCategory .items-tags > li > a,
#pageSearch .items-tags > li > a {
  position: relative;
  padding: 1em 1.333em;
  font-size: 12px;
  font-size: 1.2rem;
  line-height: 1.5;
  text-decoration: none;
}

#pageCategory .items-tags > li > a:hover,
#pageSearch .items-tags > li > a:hover {
  opacity: 1;
}

#pageCategory .items-tags > li > a:hover::before,
#pageSearch .items-tags > li > a:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

#pageCategory .items-tags > li > a::before,
#pageSearch .items-tags > li > a::before {
  position: absolute;
  left: 1.333em;
  content: "";
  width: calc(100% - 32px);
  height: 1px;
  background-color: var(--font-clr);
  bottom: -1px;
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: center top;
  transform-origin: center top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

@media only screen and (min-width: 768px) {
  #pageCategory .items-tags > li > a,
  #pageSearch .items-tags > li > a {
    padding: 1em 1.142em;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 2;
  }

  #pageCategory .items-tags > li > a::before,
  #pageSearch .items-tags > li > a::before {
    left: 1.142em;
  }
}

@media only screen and (min-width: 768px) {
  #pageCategory .items-tags,
  #pageSearch .items-tags {
    margin-bottom: 6em;
  }
}

@media only screen and (min-width: 1024px) {
  #pageCategory .items-tags,
  #pageSearch .items-tags {
    margin-bottom: 8em;
  }
}

.about-main-img {
  width: 100%;
}

.about-main-img img {
  width: 100%;
  height: 32.8vw;
  -o-object-fit: cover;
  object-fit: cover;
  max-height: 43.2em;
}

.about-wrap {
  padding: 8em 1.6em;
}

.about-wrap .ttl-h1 {
  margin-top: 0;
  margin-bottom: 1.6em;
  text-align: center;
  line-height: 1.8;
  letter-spacing: 3px;
  font-size: 20px;
  font-size: 2rem;
}

@media only screen and (min-width: 768px) {
  .about-wrap .ttl-h1 {
    font-size: 24px;
    font-size: 2.4rem;
  }
}

.about-wrap .ttl-h1 + p {
  margin-bottom: 5.714em;
}

.about-wrap .txt {
  margin-bottom: 2em;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
  letter-spacing: 2px;
}

.about-wrap .txt span {
  margin-bottom: 1.5em;
  display: block;
}

@media only screen and (min-width: 768px) {
  .about-wrap {
    padding: 8em 3.2em;
  }
}

@media only screen and (min-width: 1024px) {
  .about-wrap {
    padding: 10.4em 3.2em 13.2em;
  }
}

.concept-slider .slick-slide {
  padding: 0 12px;
  box-sizing: border-box;
}
.concept-slider .slick-list {
  margin: 0 -12px;
}

.about-concept figure {
  margin: 0;
  padding: 0;
  line-height: 1;
  vertical-align: bottom;
}

.about-concept figure img {
  max-width: 100%;
  height: auto;
}

.about-concept figure + .txt {
  margin-top: 1.428em;
}

@media only screen and (min-width: 768px) {
  .about-concept {
    padding-bottom: 8em;
  }
}

.concept-inner {
  padding-top: 4em;
}

@media only screen and (min-width: 768px) {
  .concept-inner {
    padding-top: 10.4em;
  }
}

.concept-inner .ttl-h2 {
  line-height: 1.8;
  font-size: 20px;
  font-size: 2rem;
  margin-bottom: 1.6em;
}

@media only screen and (min-width: 768px) {
  .concept-inner .ttl-h2 {
    font-size: 24px;
    font-size: 2.4rem;
  }
}

.concept-inner + .concept-inner {
  margin-top: 0;
  padding-top: 8em;
}

@media only screen and (min-width: 1024px) {
  .concept-inner + .concept-inner {
    padding-top: 10.4em;
  }
}

.concept-inner figure {
  text-align: center;
}

.concept-inner img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 80em;
  border-radius: 24px;
  -o-object-fit: contain;
  object-fit: contain;
}

@media only screen and (min-width: 768px) {
  .concept-inner__img {
    max-width: 480px !important;
  }
}

.about-info {
  padding: 16em 0 8em;
}

.about-info .ttl-h2 {
  margin-top: 0;
  margin-bottom: 2.4em;
  font-size: 20px;
  font-size: 2rem;
  letter-spacing: 3px;
}

@media only screen and (min-width: 768px) {
  .about-info {
    padding: 10.4em 0 8em;
  }

  .about-info .ttl-h2 {
    font-size: 24px;
    font-size: 2.4rem;
    margin-bottom: 3.333em;
  }
}

.about-info-box {
  font-size: 10px;
  font-size: 1rem;
}

.about-info-box + .about-info-box {
  margin-top: 2em;
}

.about-info-box .about-info-img {
  width: 100%;
  margin: 0 0 3.2em 0;
  font-size: 10px;
  font-size: 1rem;
  overflow: hidden;
}

.about-info-box .about-info-img img {
  width: 100%;
  height: auto;
  line-height: 1;
  vertical-align: bottom;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
  object-fit: cover;
}

.about-info-box .about-info-img.is-none {
  position: relative;
  font-size: 10px;
  font-size: 1rem;
  z-index: 1;
}

.about-info-box .about-info-img.is-none:has(.logoImage) {
  min-height: 24.7em;
  aspect-ratio: 4/3;
}

.about-info-box .about-info-img.is-none:has(.logoImage) img {
  position: absolute;
  left: 50%;
  top: 50%;
  width: auto;
  max-height: 12em;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  border-radius: 0 !important;
  -o-object-fit: contain;
  object-fit: contain;
}

.about-info-box .about-info-img.is-none:has(.logoText) {
  min-height: 24.7em;
  aspect-ratio: 4/3;
}

.about-info-box .about-info-img.is-none:has(.logoText) span {
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  width: 100%;
  max-width: 100%;
  font-size: 30px;
  font-size: 3rem;
  word-wrap: break-word;
  color: inherit !important;
  text-align: center;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.about-info-box .about-info-data *:first-child {
  margin-top: 0;
}

.about-info-box .name {
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: bold;
  letter-spacing: 2px;
}

.about-info-box table {
  margin-top: 0.8em;
  font-size: 10px;
  font-size: 1rem;
  margin-bottom: 3.2em;
}

.about-info-box th,
.about-info-box td {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
  text-align: left;
  vertical-align: top;
  letter-spacing: 2px;
}

.about-info-box th {
  width: 6em;
  font-weight: normal;
}

.about-info-box td {
  white-space: pre-wrap;
}

.about-info-box .about-info-map {
  position: relative;
  display: inline-block;
  text-decoration: none;
}

.about-info-box .about-info-map::after {
  top: 0.5em;
  right: -1.5em;
}

.about-info-box .about-info-map:hover {
  opacity: 1;
}

.about-info-box .about-info-map:hover::after {
  right: -1.75em;
}

.about-info-box .gmap {
  text-align: center;
}

.about-info-box + .about-info-box {
  margin-top: 6.4em;
}

@media only screen and (min-width: 768px) {
  .about-info-box-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 3.2em;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  .about-info-box-area .about-info-box {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 calc(50% - 1.6em);
    flex: 0 0 calc(50% - 1.6em);
    min-width: 0;
  }

  .about-info-box-area .about-info-box + .about-info-box {
    margin-top: 0;
  }
}

@media only screen and (min-width: 1024px) {
  .about-info-box-area {
    gap: 6.4em;
  }

  .about-info-box-area .about-info-box {
    -ms-flex: 0 0 calc(50% - 3.2em);
    flex: 0 0 calc(50% - 3.2em);
  }
}

.about-qa {
  padding: 4em 0 8em;
}

@media only screen and (min-width: 768px) {
  .about-qa {
    padding: 10.4em 0 8em;
  }
}

@media only screen and (min-width: 1024px) {
  .about-qa {
    padding: 10.4em 0 5.2em;
  }
}

.about-qa .ttl-h2 {
  margin-top: 0;
  font-size: 20px;
  font-size: 2rem;
  line-height: 1.8;
  margin-bottom: 2.4em;
  letter-spacing: 3px;
}

@media only screen and (min-width: 768px) {
  .about-qa .ttl-h2 {
    font-size: 24px;
    font-size: 2.4rem;
    margin-bottom: 3.333em;
  }
}

/* Accordion Item */
.about-qa-item {
  border-bottom: 1px solid rgba(34, 34, 34, 0.1);
}

.about-qa-item + .about-qa-item {
  margin-top: 0;
}

/* Question (Summary) */
.about-qa-question {
  display: flex;
  align-items: flex-start;
  gap: 1em;
  padding: 1.5em 0;
  cursor: pointer;
  list-style: none;
  position: relative;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1.8;
  letter-spacing: 2px;
  transition: opacity 0.3s ease;
}

.about-qa-question::-webkit-details-marker {
  display: none;
}

.about-qa-question:hover {
  opacity: 0.7;
}

/* Q Badge */
.about-qa-q {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 2em;
  height: 2em;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: normal;
  color: #fff;
  background-color: #222;
  border: 1px solid rgba(255, 255, 255, 0.5333333333);
  border-radius: 50%;
}

/* Question Text */
.about-qa-question-text {
  flex: 1;
  padding-top: 0.2em;
}

/* Accordion Icon */
.about-qa-icon {
  position: relative;
  flex-shrink: 0;
  width: 1.5em;
  height: 1.5em;
  margin-top: 0.4em;
}

.about-qa-icon::before,
.about-qa-icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background-color: #333;
  transition: transform 0.3s ease;
}

.about-qa-icon::before {
  width: 100%;
  height: 2px;
  transform: translate(-50%, -50%);
}

.about-qa-icon::after {
  width: 2px;
  height: 100%;
  transform: translate(-50%, -50%);
}

details[open] .about-qa-icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

/* Answer */
.about-qa-answer {
  display: flex;
  gap: 1em;
  padding: 0 0 2em 0;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
  letter-spacing: 2px;
  color: #222;
  animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* A Badge */
.about-qa-a {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 2em;
  height: 2em;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: normal;
  color: var(--font-clr);
  background-color: var(--clr-gray);
  border: 1px solid var(--clr-gray);
  border-radius: 50%;
}

/* Answer Text */
.about-qa-answer-text {
  flex: 1;
  margin: 0;
  padding-top: 0.2em;
}

/* Tablet and Desktop */
@media only screen and (min-width: 768px) {
  .about-qa-question {
    padding: 2em 0;
    gap: 1.5em;
  }

  .about-qa-answer {
    padding: 0 0 2.5em 0;
    gap: 1.5em;
  }

  .about-qa-icon {
    width: 2em;
    height: 2em;
  }
}

.about-qa-txt {
  margin-top: 1.428em;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
}

@media only screen and (min-width: 768px) {
  .about-qa-txt {
    margin-top: 4em;
  }
}

.about-qa-txt a {
  position: relative;
  text-decoration: none;
}

.about-qa-txt a:hover {
  opacity: 1;
}

.about-qa-txt a:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

.about-qa-txt a::after {
  position: absolute;
  left: 2px;
  content: "";
  width: calc(100% - 4px);
  height: 1px;
  background-color: var(--font-clr);
  bottom: -7px;
  opacity: 0.2;
}

.about-qa-txt a::before {
  z-index: 1;
  position: absolute;
  left: 2px;
  content: "";
  width: calc(100% - 4px);
  height: 1px;
  background-color: var(--font-clr);
  bottom: -7px;
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

.contact-wrap {
  padding: 8em 1.6em;
}

@media only screen and (min-width: 768px) {
  .contact-wrap {
    padding: 10.4em 3.2em;
  }
}

.contact-wrap .main {
  font-size: 10px;
  font-size: 1rem;
}

.contact-wrap .main h1 {
  display: none;
}

.contact-wrap .main h1 + p {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
  margin-bottom: 3.428em;
  text-align: center;
}

@media only screen and (min-width: 768px) {
  .contact-wrap .main h1 + p {
    margin-bottom: 4.571em;
  }
}

.contact-wrap form {
  display: block;
  padding: 3.2em 2.4em;
  font-size: 10px;
  font-size: 1rem;
  background-color: var(--clr-gray);
}

@media only screen and (min-width: 768px) {
  .contact-wrap form {
    padding: 6.4em;
  }
}

.contact-wrap dl > dt,
.contact-wrap dl > dd {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
}

.contact-wrap dl > dt {
  margin-bottom: 0.714em;
  font-weight: 600;
}

.contact-wrap dl > dd {
  margin-bottom: 1.428em;
}

.contact-wrap dl > dd.error {
  color: var(--clr-red);
}

.contact-wrap input[type="text"],
.contact-wrap textarea {
  font-size: 14px;
  font-size: 1.4rem;
  width: 100%;
  padding: 0.571em;
  font-family: inherit;
  border: solid 1px rgba(0, 0, 0, 0.1725490196);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 1;
  border-radius: 3px;
}

.contact-wrap input[type="text"] {
  line-height: 1;
}

.contact-wrap textarea {
  line-height: 1.5;
  resize: vertical;
}

.contact-wrap .control-panel {
  text-align: center;
}

.contact-wrap input[type="submit"] {
  padding: 1.428em;
  letter-spacing: 2px;
  width: 14.285em;
  background-color: #222;
  border: none;
  color: #fff;
  border-radius: 3px;
}

.contact-wrap .ttl-h1 {
  text-align: center;
  font-size: 20px;
  font-size: 2rem;
  margin-bottom: 2.4em;
}

@media only screen and (min-width: 768px) {
  .contact-wrap .ttl-h1 {
    font-size: 24px;
    font-size: 2.4rem;
    margin-bottom: 2.666em;
  }
}

dd.error-red input[type="text"] {
  border: 1px solid var(--clr-red);
}

#inquiryConfirmSection dl > dd {
  border-bottom: solid 1px #ccc;
  padding-bottom: 1.428em;
}

#inquiryCompleteSection {
  display: block;
  position: relative;
  margin-top: 2em;
  font-size: 10px;
  font-size: 1rem;
  text-align: center;
}

#inquiryCompleteSection p {
  margin-bottom: 2.285em;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
}

@media only screen and (min-width: 768px) {
  #inquiryCompleteSection p {
    margin-bottom: 4.571em;
  }
}

#inquiryCompleteSection a {
  padding: 1.428em;
  letter-spacing: 2px;
  border-radius: 3px;
}

@media only screen and (min-width: 768px) {
  #inquiryCompleteSection p {
    text-align: center;
  }
}

.blogListMain {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-column-gap: 1em;
  grid-row-gap: 1.6em;
  font-size: 10px;
  font-size: 1rem;
}

.blogListMain .paginate-wrp {
  grid-column: 1/3;
}

@media only screen and (min-width: 768px) {
  .blogListMain {
    grid-column-gap: 4.8em;
    grid-row-gap: 6.4em;
  }
}

@media only screen and (min-width: 1024px) {
  .blogListMain {
    grid-column-gap: 6.4em;
    grid-row-gap: 8em;
  }
}

.blogListMain .blog_inner {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 0 !important;
  opacity: 1;
  -webkit-transition: 0.5s opacity;
  transition: 0.5s opacity;
  border: 0 !important;
}

.blogListMain .blog_inner:hover {
  opacity: 0.5;
  -webkit-transition: 0.5s opacity;
  transition: 0.5s opacity;
}

.blogListMain .blog_inner a {
  text-decoration: none;
}

.blogListMain .blog_inner .blog_title {
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
}

.blogListMain .blog_inner .blog_title h2 {
  margin-top: 1.142em;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.8;
  letter-spacing: 2px;
}

@media only screen and (min-width: 768px) {
  .blogListMain .blog_inner .blog_title h2 {
    margin-top: 1.5em;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 2;
  }
}

.blogListMain .blog_inner .blog_publish {
  -webkit-box-ordinal-group: 4;
  -ms-flex-order: 3;
  order: 3;
  margin: 0.8em 0 4.8em !important;
  font-size: 10px;
  font-size: 1rem;
}

.blogListMain .blog_inner .blog_publish .publish_date {
  font-size: 12px;
  font-size: 1.2rem;
  opacity: 0.7;
  letter-spacing: 1px;
}

.blogListMain .blog_inner .blog_head_image {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1;
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}

.blogListMain .blog_inner .blog_head_image img {
  width: 100%;
  height: auto;
  -o-object-fit: cover;
  object-fit: cover;
  vertical-align: bottom;
  aspect-ratio: 4/3;
  border-radius: 3px;
}

.blogListMain .blog_inner .blog_contents {
  height: 0 !important;
}

.blogListMain .blog_inner .blog_contents .blog_body {
  display: none;
}

.blogListMain .blog_inner .read_more {
  position: static !important;
}

.blogListMain .blog_inner .read_more a {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  text-indent: -1000%;
  overflow: hidden;
  z-index: 1;
}

.blogListMain .paginate-wrp {
  padding-top: 2em;
  margin: 0 !important;
}

.blogListMain .paginate {
  padding: 0;
  display: block !important;
  text-align: center;
  font-size: 0;
}

.blogListMain .paginate li {
  position: relative;
  display: inline-block;
  margin: 0 0 0 0.714em !important;
  font-size: 14px;
  font-size: 1.4rem;
  border: 0 !important;
  background: none !important;
}

.blogListMain .paginate li:first-child {
  margin: 0;
}

.blogListMain .paginate .current a {
  background: var(--font-clr);
  color: var(--clr-gray);
}

.blogListMain .paginate a {
  display: grid;
  place-items: center;
  min-width: 3.428em;
  height: 3.428em;
  padding: 0 !important;
  font-size: 14px !important;
  font-size: 1.4rem !important;
  font-weight: normal;
  text-decoration: none;
  border: solid 1px var(--font-clr);
  border-radius: 3px;
}

.blogListMain .paginate a:link,
.blogListMain .paginate a:visited {
  color: var(--font-clr);
  -webkit-transition: 0.5s background-color, 0.5s color;
  transition: 0.5s background-color, 0.5s color;
}

.blogListMain .paginate a:hover {
  opacity: 1;
  background: var(--font-clr);
  color: var(--clr-red);
  -webkit-transition: 0.5s background-color, 0.5s color;
  transition: 0.5s background-color, 0.5s color;
}

.blogListMain .paginate .prev a,
.blogListMain .paginate .next a {
  padding: 0 1.428em !important;
}

.blog-wrap:has(.blogListMain) + .blog-back {
  display: none;
}

.blog-wrap {
  padding: 8em 1.6em;
}

@media only screen and (min-width: 768px) {
  .blog-wrap {
    padding: 10.4em 3.2em;
  }
}

@media only screen and (min-width: 1024px) {
  .blog-wrap {
    padding: 10.4em 3.2em 13.4em;
  }
}

.blog-wrap .ttl-h1 {
  margin-bottom: 2.181em;
  text-align: center;
  font-size: 22px;
  font-size: 2.2rem;
  letter-spacing: 3px;
}

@media only screen and (min-width: 768px) {
  .blog-wrap .ttl-h1 {
    font-size: 24px;
    font-size: 2.4rem;
    margin-bottom: 2.666em;
  }
}

@media only screen and (min-width: 1024px) {
  .blog-wrap .ttl-h1 {
    margin-bottom: 3.333em;
  }
}

.blogDetail .blog_inner {
  padding: 0 !important;
  border: 0 !important;
}

.blogDetail .blog_title {
  padding: 0 !important;
}

.blogDetail .blog_title h2 {
  font-size: 18px;
  font-size: 1.8rem;
  text-align: left;
  margin-top: 0;
  margin-bottom: 0.444em;
}

.blogDetail .blog_title h2 a {
  text-decoration: none;
}

.blogDetail .blog_publish {
  margin: 2em 0 !important;
  font-size: 10px;
  font-size: 1rem;
  padding: 0 !important;
}

.blogDetail .blog_publish .publish_date {
  margin-bottom: 3.428em;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1;
  color: var(--font-clr);
  opacity: 0.7;
}

.blogDetail .blog_body {
  font-size: 14px;
  font-size: 1.4rem;
}

.blogDetail .blog_body div {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
  height: auto;
}

.blogDetail .blog_body img {
  font-size: 10px;
  font-size: 1rem;
  margin: 0 !important;
}

.blogDetail .blog_body h3 {
  font-size: 18px;
  font-size: 1.8rem;
}

.blogDetail .blog_body .blog-img-block {
  display: block;
  margin: 2em 0;
  font-size: 10px;
  font-size: 1rem;
}

.blogDetail .blog_body .blog-img-block:first-child {
  margin-top: 0;
}

.blogDetail .blog_body .blog-img-inline {
  display: inline;
}

.blogDetail .social {
  margin: 4.8em 0 0 0 !important;
  font-size: 10px;
  font-size: 1rem;
  padding: 0 !important;
  text-align: center;
}

.blogDetail .social li {
  padding-bottom: 0.5em;
  font-size: 10px;
  font-size: 1rem;
  display: inline-block;
}

.blogDetail .social li + li {
  margin-left: 1.6em;
}

.blogDetail .social li.tw {
  position: relative;
}

.blogDetail .social li.tw img {
  z-index: 1;
  position: relative;
  margin-top: 6px;
  height: 19px;
  width: 19px;
}

.blogDetail .social li.tw::before {
  z-index: 0;
  position: absolute;
  top: 1px;
  left: -6px;
  content: "";
  width: 3em;
  height: 3em;
  background-color: #fff;
  border-radius: 50%;
}

@media only screen and (min-width: 768px) {
  .blogDetail .social {
    margin: 6.4em 0 0 0 !important;
  }
}

.blog-back {
  margin-top: -3.2em;
  font-size: 10px;
  font-size: 1rem;
  text-align: center;
  margin-bottom: 8em;
}

.blog-back a {
  position: relative;
  padding: 0.8em 4em;
  text-decoration: none;
  display: inline-block;
  border: 1px solid var(--font-clr);
  letter-spacing: 2px;
  font-size: 14px;
  font-size: 1.4rem;
}

.blog-back a::before {
  position: absolute;
  display: block;
  top: 0;
  bottom: 0;
  margin: auto;
  left: -1.5em;
  content: "";
  width: 3em;
  height: 1px;
  background-color: var(--font-clr);
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.blog-back a:hover {
  opacity: 1;
}

.blog-back a:hover::before {
  left: -1em;
}

@media only screen and (min-width: 768px) {
  .blog-back {
    margin-top: -4em;
    margin-bottom: 10.4em;
  }
}

@media only screen and (min-width: 1024px) {
  .blog-back {
    margin-top: -6.8em;
    margin-bottom: 13.2em;
  }
}

.blog_youtube_wrap iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
}

#pageCommunity .community-wrap {
  padding: 0 1.6em;
}

#pageCommunity .community-wrap .communityMain {
  width: 100%;
  margin-bottom: 10.4em;
  padding: 0;
}

@media only screen and (min-width: 768px) {
  #pageCommunity .community-wrap .communityMain {
    margin-bottom: 13.4em;
  }
}

#pageCommunity .community-wrap .communityMain .flashMessage {
  margin: 1em 0;
  padding: 0.5em 0.75em;
  font-size: 14px;
  font-size: 1.4rem;
}

#pageCommunity .community-wrap .communityMain .communityContent {
  border: none;
}

#pageCommunity .community-wrap .communityMain .communityNotExists {
  margin: 8em 0;
}

#pageCommunity .community-wrap .communityTitle {
  margin-top: 4em;
  margin-bottom: 2.4em;
  font-size: 20px;
  font-size: 2rem;
  text-align: center;
}

@media only screen and (min-width: 768px) {
  #pageCommunity .community-wrap .communityTitle {
    font-size: 26px;
    font-size: 2.6rem;
  }
}

#pageCommunity .community-wrap .communityContent {
  display: block;
  padding: 0;
  margin: 0;
}

#pageCommunity .community-wrap .communityOverview {
  width: 100%;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
}

#pageCommunity .community-wrap .communityNav {
  z-index: 0;
  width: 100%;
  padding: 4.8em 1.6em;
  margin: 4.8em 0 0 0;
  font-size: 10px;
  font-size: 1rem;
  background-color: var(--clr-gray);
}

@media only screen and (min-width: 768px) {
  #pageCommunity .community-wrap .communityNav {
    padding: 10.4em 9.6em;
  }
}

#pageCommunity .community-wrap .communityPrice {
  text-align: center;
}

#pageCommunity .community-wrap .communityPrice h3 {
  letter-spacing: 3px;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 600;
  margin: 0;
}

#pageCommunity .community-wrap .communityPrice h3 + p {
  font-size: 34px;
  font-size: 3.4rem;
  font-weight: bold;
}

#pageCommunity .community-wrap .communityButton {
  text-decoration: none;
  border-radius: 3px;
  display: block;
  padding: 1.428em 1.428em;
  width: 100%;
  font-size: 14px;
  font-size: 1.4rem;
  text-align: center;
  color: #fff;
}

#pageCommunity .community-wrap .communityButton .communityButtonPayid__icon {
  display: inline-block;
}

#pageCommunity .community-wrap .communityTerm,
#pageCommunity .community-wrap .communityTextNotice {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
}

#pageCommunity .community-wrap .communityTerm a,
#pageCommunity .community-wrap .communityTextNotice a {
  color: inherit;
}

#pageCommunity .community-wrap .payidLogoutText {
  margin-top: 1.428em;
  font-size: 14px;
  font-size: 1.4rem;
  text-align: center;
}

#pageCommunity .community-wrap .communitySignin {
  z-index: 2;
  position: relative;
  padding: 3.2em 1.6em;
  font-size: 10px;
  font-size: 1rem;
  border: none;
  border-radius: 0;
  margin-top: 3.2em;
  margin-top: 3.2em;
  background: var(--clr-gray);
}

#pageCommunity .community-wrap .communitySignin::before {
  z-index: -1;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  content: "";
  background: color-mix(in srgb, var(--clr-gray) 30%, transparent);
  mix-blend-mode: multiply;
}

#pageCommunity .community-wrap .communitySignin p {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
}

@media only screen and (min-width: 768px) {
  #pageCommunity .community-wrap .communitySignin {
    padding: 3.2em;
  }
}

#pageCommunity .community-wrap .communityButtonPayid__pay {
  margin-top: 2.285em;
  margin-bottom: 2.285em;
  background-color: #000535;
  color: #fff;
}

#pageCommunity .community-wrap .communityButton__guest {
  margin-top: 1.142em;
  margin-bottom: 1.714em;
  text-align: center;
  background-color: #222;
}

#pageCommunity
  .community-wrap
  .communityButtonPayid__signin
  .communityButtonPayid__pay {
  margin-top: 0.714em;
}

#pageCommunity .community-wrap .limited {
  width: 100%;
}

@media only screen and (min-width: 768px) {
  #pageCommunity .community-wrap {
    padding: 0 3.2em;
  }
}

.img-sq .communityImageResize {
  aspect-ratio: 1/1;
}

.img-la-gold .communityImageResize {
  aspect-ratio: 1.618/1;
}

.img-la-screen .communityImageResize {
  aspect-ratio: 4/3;
}

.img-pt-gold .communityImageResize {
  aspect-ratio: 1/1.618;
}

.img-pt-screen .communityImageResize {
  aspect-ratio: 3/4;
}

#pageCommunity .community-wrap .limited {
  width: 100%;
}

#pageCommunity .community-wrap .limited .communityItemHeader,
#pageCommunity .community-wrap .limited .communityUrlHeader {
  margin: 0;
  margin-top: 4.444em;
  margin-bottom: 1.777em;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
  letter-spacing: 2px;
  text-align: left;
}

#pageCommunity .community-wrap .limited .communityItemHeader + p,
#pageCommunity .community-wrap .limited .communityUrlHeader + p {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
}

#pageCommunity .community-wrap #productsLimitedItem .communityImageContainer {
  aspect-ratio: 4/3;
}

#pageCommunity .community-wrap #productsLimitedItem img {
  width: 100%;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
  object-fit: cover;
}

#pageCommunity .community-wrap #productsLimitedItem a {
  text-decoration: none;
}

#pageCommunity .community-wrap #productsLimitedItem .communityItemTitle {
  margin-top: 1.142em;
  margin-bottom: 0;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.8;
  letter-spacing: 2px;
  font-weight: 600;
  width: 100%;
}

@media only screen and (min-width: 768px) {
  #pageCommunity .community-wrap #productsLimitedItem .communityItemTitle {
    margin-top: 1.5em;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 2;
  }
}

#pageCommunity .community-wrap #productsLimitedItem .communityItemPrice {
  font-size: 14px;
  font-size: 1.4rem;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  width: 100%;
}

#pageCommunity
  .community-wrap
  #productsLimitedItem
  .communityItemPrice.discount {
  color: var(--clr-red);
}

#pageCommunity
  .community-wrap
  #productsLimitedItem
  .communityItemPrice.discount
  .discount {
  padding: 0 0.5em;
  display: inline-block;
  background-color: var(--clr-red);
  color: #fff;
  font-size: 12px;
  font-size: 1.2rem;
  border-radius: 2px;
}

#pageCommunity .community-wrap #productsLimitedItem .communityItems {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-column-gap: 1em;
  grid-row-gap: 4.8em;
}

#pageCommunity
  .community-wrap
  #productsLimitedItem
  .communityItems
  .communityItem {
  position: relative;
  margin-left: 0;
}

#pageCommunity
  .community-wrap
  #productsLimitedItem
  .communityItems
  .communityItem
  .communityImageContainer {
  width: auto;
  height: auto;
}

#pageCommunity
  .community-wrap
  #productsLimitedItem
  .communityItems
  .communityItem
  .communityItemTitle {
  overflow: visible;
  max-height: none;
}

#pageCommunity
  .community-wrap
  #productsLimitedItem
  .communityItems
  .communityItem
  .communityItemPrice.soldOut {
  text-decoration: none;
}

#pageCommunity
  .community-wrap
  #productsLimitedItem
  .communityItems
  .communityLabelImage {
  position: absolute;
  top: 0;
  left: 0;
  width: 5em;
  height: 5em;
  -o-object-fit: contain;
  object-fit: contain;
}

@media only screen and (min-width: 768px) {
  #pageCommunity .community-wrap #productsLimitedItem .communityItems {
    grid-column-gap: 3.2em;
    grid-row-gap: 6.4em;
  }
}

@media only screen and (min-width: 1024px) {
  #pageCommunity .community-wrap #productsLimitedItem .communityItems {
    grid-template-columns: repeat(3, 1fr);
    grid-row-gap: 8em;
  }
}

#pageCommunity
  .community-wrap
  #productsLimitedItem
  .communityItems
  .communityItemMeta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 0.8em 0.5em;
}

#pageCommunity
  .community-wrap
  #productsLimitedItem
  .communityItems
  .communityItemTitle {
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1;
}

#pageCommunity
  .community-wrap
  #productsLimitedItem
  .communityItems
  .communityItemPrice {
  -webkit-box-ordinal-group: 6;
  -ms-flex-order: 5;
  order: 5;
}

#pageCommunity
  .community-wrap
  #productsLimitedItem
  .communityItems
  .communityItemLabel {
  -webkit-box-ordinal-group: 5;
  -ms-flex-order: 4;
  order: 4;
}

#pageCommunity
  .community-wrap
  #productsLimitedItem
  .communityItems
  .communityItemLabel {
  padding: 0 0.363em 1px;
  display: inline-block;
  font-size: 11px;
  font-size: 1.1rem;
  line-height: 1.5;
  border-radius: 2px;
}

#pageCommunity
  .community-wrap
  #productsLimitedItem
  .communityItems
  .communityItemLabel.soldOutText {
  color: #fff;
  background-color: #868686;
}

#pageCommunity
  .community-wrap
  #productsLimitedItem
  .communityItems
  .communityItemLabelBlock {
  padding: 0 0.363em;
  display: inline-block;
  color: #fff;
  background: var(--community);
  font-size: 11px;
  font-size: 1.1rem;
  line-height: 1.5;
  border-radius: 2px;
}

#pageCommunity .community-wrap #productsLimitedUrl {
  font-size: 10px;
  font-size: 1rem;
  display: block;
}

#pageCommunity .community-wrap #productsLimitedUrl .urlBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin: 1.6em 0 0;
  padding: 2em;
  width: auto;
  font-size: 10px;
  font-size: 1rem;
  border: none;
  border-radius: 0;
  background: var(--clr-gray);
}

@media only screen and (min-width: 768px) {
  #pageCommunity .community-wrap #productsLimitedUrl .urlBox {
    margin: 2.4em 0 0;
  }
}

#pageCommunity .community-wrap #productsLimitedUrl .title {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.4;
  font-weight: 600;
  margin-bottom: 0.25em;
}

#pageCommunity .community-wrap #productsLimitedUrl .url {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.4;
}

@media only screen and (min-width: 768px) {
  #pageCommunity .community-wrap #productsLimitedUrl {
    grid-template-columns: calc(50% - 1em) calc(50% - 1em);
    grid-column-gap: 2em;
    grid-row-gap: 1em;
  }
}

.communityMain .communityItems .communityItem .communityItemMetaSub {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

#pageCommunity .community-wrap .communityLogout {
  margin: 2.857em 0 0 0;
  font-size: 14px;
  font-size: 1.4rem;
  text-align: center;
}

#pageCommunity .community-wrap .communityLogout a {
  position: relative;
  color: var(--font-clr);
  text-decoration: none;
}

#pageCommunity .community-wrap .communityLogout a:hover {
  opacity: 1;
}

#pageCommunity .community-wrap .communityLogout a:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

#pageCommunity .community-wrap .communityLogout a::after,
#pageCommunity .community-wrap .communityLogout a::before {
  position: absolute;
  left: 0;
  content: "";
  width: 100%;
  height: 1px;
  background-color: var(--font-clr);
  bottom: -7px;
}

#pageCommunity .community-wrap .communityLogout a::after {
  opacity: 0.2;
}

#pageCommunity .community-wrap .communityLogout a::before {
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

#pageCommunity .community-wrap .openLeaveModal {
  position: relative;
  display: inline-block;
  margin: 2.857em auto;
  font-size: 14px;
  font-size: 1.4rem;
  color: var(--font-clr);
  opacity: 1;
  -webkit-transition: opacity 1s;
  transition: opacity 1s;
  top: 0%;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  text-decoration: none;
}

#pageCommunity .community-wrap .openLeaveModal:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

#pageCommunity .community-wrap .openLeaveModal::after,
#pageCommunity .community-wrap .openLeaveModal::before {
  position: absolute;
  left: 0;
  content: "";
  width: 100%;
  height: 1px;
  background-color: var(--font-clr);
  bottom: -7px;
}

#pageCommunity .community-wrap .openLeaveModal::after {
  opacity: 0.2;
}

#pageCommunity .community-wrap .openLeaveModal::before {
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

#pageCommunity .community-wrap .communityModal .communityModalHeader {
  color: #222;
}

#pageCommunity .community-wrap .communityModal .communityModalTable {
  padding: 5px 15px !important;
  background: #f0f1f4 !important;
}

#pageCommunity .community-wrap .communityModal .communityModalTable p {
  color: #222;
}

#pageCommunity
  .community-wrap
  .communityModal
  .communityModalButtons
  .communityModalButton
  + .communityModalButton {
  margin-top: 10px !important;
}

@media only screen and (min-width: 1024px) {
  #pageCommunity .community-wrap .communityLogout {
    margin-top: 4.285em;
  }
}

#membership {
  padding: 0 !important;
  overflow: hidden;
}

#membership .flash-message {
  max-width: 57.142em;
}

#membership .flash-message.error {
  margin: 0 auto;
}

#pageMembershipGuide .draft .img-wrapper,
#pageMembershipGuide .guide .img-wrapper {
  height: auto;
  margin: 0;
}

#pageMembershipGuide .draft .img-wrapper .img,
#pageMembershipGuide .guide .img-wrapper .img {
  width: 100%;
  height: 32.8vw;
  -o-object-fit: cover;
  object-fit: cover;
  max-height: 43.2em;
}

#pageMembershipGuide .draft .content,
#pageMembershipGuide .guide .content {
  padding: 8em 1.6em;
}

@media only screen and (min-width: 768px) {
  #pageMembershipGuide .draft .content,
  #pageMembershipGuide .guide .content {
    padding: 10.4em 3.2em;
  }
}

#pageMembershipGuide .draft .content h2.heading,
#pageMembershipGuide .guide .content h2.heading {
  margin: 0;
  font-size: 22px;
  font-size: 2.2rem;
  letter-spacing: 3px;
  margin: 0;
  margin-bottom: 1.454em;
}

@media only screen and (min-width: 768px) {
  #pageMembershipGuide .draft .content h2.heading,
  #pageMembershipGuide .guide .content h2.heading {
    font-size: 26px;
    font-size: 2.6rem;
    margin-bottom: 3.076em;
  }
}

#pageMembershipGuide .draft .content .description p,
#pageMembershipGuide .guide .content .description p {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
  letter-spacing: 2px;
}

#pageMembershipGuide .draft .about-point,
#pageMembershipGuide .guide .about-point {
  padding: 0 1.6em 8em;
  margin: 0 auto;
  font-size: 10px;
  font-size: 1rem;
}

@media only screen and (min-width: 768px) {
  #pageMembershipGuide .draft .about-point,
  #pageMembershipGuide .guide .about-point {
    padding: 0 3.2em 8em;
  }
}

#pageMembershipGuide .draft .about-point h2,
#pageMembershipGuide .guide .about-point h2 {
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 1.4;
  padding: 0;
  letter-spacing: 2px;
}

#pageMembershipGuide .draft .about-point h2::before,
#pageMembershipGuide .guide .about-point h2::before {
  content: "？";
  display: inline-block;
  height: 1.428em;
  width: 1.428em;
  padding: 0 0 0.142em 0.071em;
  margin-right: 0.357em;
  font-size: 14px;
  font-size: 1.4rem;
  text-align: center;
  line-height: 1.285em;
  border: solid 1px var(--font-clr);
  border-radius: 50%;
}

#pageMembershipGuide .draft .about-point .description,
#pageMembershipGuide .guide .about-point .description {
  margin: 1.6em 0 0 0;
  font-size: 10px;
  font-size: 1rem;
  letter-spacing: 2px;
  line-height: 2;
}

#pageMembershipGuide .draft .about-point .description li,
#pageMembershipGuide .guide .about-point .description li {
  position: relative;
  padding-left: 1.428em;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.4;
}

#pageMembershipGuide .draft .about-point .description li + li,
#pageMembershipGuide .guide .about-point .description li + li {
  margin-top: 0.357em;
}

#pageMembershipGuide .draft .about-point .description li::before,
#pageMembershipGuide .guide .about-point .description li::before {
  font-size: 14px;
  font-size: 1.4rem;
  content: "";
  position: absolute;
  top: 50%;
  top: 0.714em;
  left: -0.143em;
  width: 0.428em;
  height: 0.428em;
  border-top: 1px solid var(--font-clr);
  border-right: 1px solid var(--font-clr);
  -webkit-transform: rotate(45deg) translateY(-0.358em);
  transform: rotate(45deg) translateY(-0.358em);
}

#pageMembershipGuide .draft .register,
#pageMembershipGuide .guide .register {
  background: none;
  font-size: 10px;
  font-size: 1rem;
  margin: 0 1.6em 10.4em;
  padding: 4.8em 1.6em;
  max-width: 80em;
  background-color: var(--clr-gray);
}

@media only screen and (min-width: 768px) {
  #pageMembershipGuide .draft .register,
  #pageMembershipGuide .guide .register {
    margin: 0 3.2em 13.6em;
    padding: 10.4em 9.6em;
  }
}

@media only screen and (min-width: 864px) {
  #pageMembershipGuide .draft .register,
  #pageMembershipGuide .guide .register {
    margin: 0 auto 13.6em;
  }
}

#pageMembershipGuide .draft .register .heading,
#pageMembershipGuide .guide .register .heading {
  margin: 0;
  font-size: 18px;
  font-size: 1.8rem;
  letter-spacing: 3px;
  margin-bottom: 1.777em;
}

#pageMembershipGuide .draft .register .description-wrapper,
#pageMembershipGuide .guide .register .description-wrapper {
  margin: 0;
}

#pageMembershipGuide .draft .register .description-wrapper p,
#pageMembershipGuide .guide .register .description-wrapper p {
  margin: 0;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
  text-align: left;
  letter-spacing: 2px;
}

@media only screen and (min-width: 768px) {
  #pageMembershipGuide .draft .register .description-wrapper p,
  #pageMembershipGuide .guide .register .description-wrapper p {
    text-align: center;
  }
}

#pageMembershipGuide .draft .register form.mail-magazine,
#pageMembershipGuide .guide .register form.mail-magazine {
  font-size: 0;
}

#pageMembershipGuide .draft .register .mail-magazine-wrapper,
#pageMembershipGuide .guide .register .mail-magazine-wrapper {
  margin: 3.2em 0;
  width: 100%;
  font-size: 10px;
  font-size: 1rem;
}

#pageMembershipGuide .draft .register .mail-magazine-wrapper input.checkbox,
#pageMembershipGuide .guide .register .mail-magazine-wrapper input.checkbox {
  font-size: 10px;
  font-size: 1rem;
  background: none !important;
  border: solid 1px var(--font-clr);
  -webkit-transition: 0.5s background-color;
  transition: 0.5s background-color;
}

#pageMembershipGuide
  .draft
  .register
  .mail-magazine-wrapper
  input.checkbox:checked,
#pageMembershipGuide
  .guide
  .register
  .mail-magazine-wrapper
  input.checkbox:checked {
  background: #222 !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  -webkit-transition: 0.5s background-color;
  transition: 0.5s background-color;
}

#pageMembershipGuide
  .draft
  .register
  .mail-magazine-wrapper
  input.checkbox::after,
#pageMembershipGuide
  .guide
  .register
  .mail-magazine-wrapper
  input.checkbox::after {
  background: none;
  top: 0.5em;
  width: 1.2em;
  height: 0.8em;
  border-left: solid 2px #fff;
  border-bottom: solid 2px #fff;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#pageMembershipGuide .draft .register .mail-magazine-wrapper .label,
#pageMembershipGuide .guide .register .mail-magazine-wrapper .label {
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: normal;
  color: var(--font-clr);
}

#pageMembershipGuide .draft .register .link-wrapper,
#pageMembershipGuide .guide .register .link-wrapper {
  margin: 0;
  margin: 0 !important;
}

#pageMembershipGuide .draft .register .link-wrapper button.link,
#pageMembershipGuide .guide .register .link-wrapper button.link {
  width: 100%;
  max-width: pxEm(360, 14);
  border-radius: 3px;
  background-color: #222;
  color: #fff;
  border: none;
}

#pageMembershipGuide .draft .register .login,
#pageMembershipGuide .guide .register .login {
  margin: 2.285em 0 0 0;
  font-size: 14px;
  font-size: 1.4rem;
}

#pageMembershipGuide .draft .register .login a,
#pageMembershipGuide .guide .register .login a {
  color: inherit;
}

#pageMembershipGuide .draft .register a,
#pageMembershipGuide .guide .register a {
  position: relative;
  color: inherit;
  text-decoration: none;
}

#pageMembershipGuide .draft .register a:hover,
#pageMembershipGuide .guide .register a:hover {
  opacity: 1;
}

#pageMembershipGuide .draft .register a:hover::before,
#pageMembershipGuide .guide .register a:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

#pageMembershipGuide .draft .register a::after,
#pageMembershipGuide .draft .register a::before,
#pageMembershipGuide .guide .register a::after,
#pageMembershipGuide .guide .register a::before {
  position: absolute;
  left: 0;
  content: "";
  width: 100%;
  height: 1px;
  background-color: var(--font-clr);
  bottom: -7px;
}

#pageMembershipGuide .draft .register a::after,
#pageMembershipGuide .guide .register a::after {
  opacity: 0.2;
}

#pageMembershipGuide .draft .register a::before,
#pageMembershipGuide .guide .register a::before {
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

#pageMembershipGuide .draft .register > .box p.content,
#pageMembershipGuide .guide .register > .box p.content {
  padding: 0;
}

#pageMembershipGuide .draft .mypage-link,
#pageMembershipGuide .guide .mypage-link {
  margin-bottom: 10.4em;
  text-align: center;
}

#pageMembershipGuide .draft .mypage-link a.link,
#pageMembershipGuide .guide .mypage-link a.link {
  position: relative;
  padding: 0.8em 2em;
  text-decoration: none;
  display: inline-block;
  border: 1px solid var(--font-clr);
  letter-spacing: 2px;
  font-size: 14px;
  font-size: 1.4rem;
  background-color: transparent;
  border-radius: 0;
  color: var(--font-clr);
  max-width: 18em;
}

#pageMembershipGuide .draft .mypage-link a.link::before,
#pageMembershipGuide .guide .mypage-link a.link::before {
  position: absolute;
  display: block;
  top: 0;
  bottom: 0;
  margin: auto;
  left: -1.5em;
  content: "";
  width: 3em;
  height: 1px;
  background-color: var(--font-clr);
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

#pageMembershipGuide .draft .mypage-link a.link:hover,
#pageMembershipGuide .guide .mypage-link a.link:hover {
  opacity: 1;
}

#pageMembershipGuide .draft .mypage-link a.link:hover::before,
#pageMembershipGuide .guide .mypage-link a.link:hover::before {
  left: -1em;
}

@media only screen and (min-width: 768px) {
  #pageMembershipGuide .draft .mypage-link a.link,
  #pageMembershipGuide .guide .mypage-link a.link {
    padding: 1.142em;
  }

  #pageMembershipGuide .draft .mypage-link a.link::before,
  #pageMembershipGuide .guide .mypage-link a.link::before {
    width: 4em;
    left: -2em;
  }

  #pageMembershipGuide .draft .mypage-link a.link:hover::before,
  #pageMembershipGuide .guide .mypage-link a.link:hover::before {
    left: -1.5em;
  }
}

#pageMembershipGuide .reward-list {
  padding: 0 1.6em;
}

@media only screen and (min-width: 768px) {
  #pageMembershipGuide .reward-list {
    padding: 0 3.2em;
  }
}

#pageMembershipGuide .reward-list h3 {
  font-size: 18px;
  font-size: 1.8rem;
  letter-spacing: 2px;
}

#pageMembershipGuide .reward-list .bar {
  margin: 1.6em 0;
}

#pageMembershipGuide .reward-list .description {
  letter-spacing: 2px;
}

#pageMembershipGuide .reward-list .reward-card-list {
  margin-top: 3.2em;
  margin-bottom: 8em;
}

@media only screen and (min-width: 768px) {
  #pageMembershipGuide .reward-list .reward-card-list {
    margin-bottom: 13.4em;
  }
}

#pageMembershipGuide .reward-detail-wrapper {
  margin-left: 0;
}

#pageMembershipGuide .exchange-point-wrapper {
  position: relative;
  padding-left: 1.5em;
  color: var(--clr-red);
  margin-left: 0;
  padding-left: 1.65em;
}

#pageMembershipGuide .exchange-point-wrapper svg {
  display: none;
}

#pageMembershipGuide .exchange-point-wrapper::before {
  position: absolute;
  left: 0;
  top: 0;
  width: 1.384em;
  height: 1.384em;
  font-size: 13px;
  font-size: 1.3rem;
  display: inline-block;
  content: "";
  line-height: 1.4;
  background-color: var(--clr-red);
  -webkit-mask: url("data:image/svg+xml;charset=utf8,<svg width='17' height='18' viewBox='0 0 17 18' fill='none' xmlns='http://www.w3.org/2000/svg'><circle cx='8.5' cy='9' r='8' stroke='red'/><path d='M6.3 14.5V4.971H9.017C11.149 4.971 12.592 5.686 12.592 7.779C12.592 9.781 11.162 10.717 9.069 10.717H7.509V14.5H6.3ZM7.509 9.742H8.926C10.59 9.742 11.396 9.131 11.396 7.779C11.396 6.388 10.551 5.959 8.861 5.959H7.509V9.742Z' fill='black'/></svg>");
  -webkit-mask-image: url("data:image/svg+xml;charset=utf8,<svg width='17' height='18' viewBox='0 0 17 18' fill='none' xmlns='http://www.w3.org/2000/svg'><circle cx='8.5' cy='9' r='8' stroke='red'/><path d='M6.3 14.5V4.971H9.017C11.149 4.971 12.592 5.686 12.592 7.779C12.592 9.781 11.162 10.717 9.069 10.717H7.509V14.5H6.3ZM7.509 9.742H8.926C10.59 9.742 11.396 9.131 11.396 7.779C11.396 6.388 10.551 5.959 8.861 5.959H7.509V9.742Z' fill='black'/></svg>");
  mask-image: url("data:image/svg+xml;charset=utf8,<svg width='17' height='18' viewBox='0 0 17 18' fill='none' xmlns='http://www.w3.org/2000/svg'><circle cx='8.5' cy='9' r='8' stroke='red'/><path d='M6.3 14.5V4.971H9.017C11.149 4.971 12.592 5.686 12.592 7.779C12.592 9.781 11.162 10.717 9.069 10.717H7.509V14.5H6.3ZM7.509 9.742H8.926C10.59 9.742 11.396 9.131 11.396 7.779C11.396 6.388 10.551 5.959 8.861 5.959H7.509V9.742Z' fill='black'/></svg>");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

#pageMembershipMyPage .draft,
#pageMembershipMyPage .mypage {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

#pageMembershipMyPage .draft .heading-wrapper,
#pageMembershipMyPage .mypage .heading-wrapper {
  padding: 8em 1.6em 4.8em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin: 0;
  -webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
  width: 100%;
}

@media only screen and (min-width: 768px) {
  #pageMembershipMyPage .draft .heading-wrapper,
  #pageMembershipMyPage .mypage .heading-wrapper {
    padding: 10.4em 3.2em 8em;
  }
}

#pageMembershipMyPage .draft .heading,
#pageMembershipMyPage .mypage .heading {
  margin: 0;
  font-size: 22px;
  font-size: 2.2rem;
  letter-spacing: 3px;
}

@media only screen and (min-width: 768px) {
  #pageMembershipMyPage .draft .heading,
  #pageMembershipMyPage .mypage .heading {
    font-size: 26px;
    font-size: 2.6rem;
  }
}

#pageMembershipMyPage .draft .logout-wrapper,
#pageMembershipMyPage .mypage .logout-wrapper {
  margin: 0 0 0 2em;
  font-size: 10px;
  font-size: 1rem;
}

#pageMembershipMyPage .draft .logout-wrapper button.logout,
#pageMembershipMyPage .mypage .logout-wrapper button.logout {
  position: relative;
  padding: 0.357em;
  font-size: 14px;
  font-size: 1.4rem;
  text-decoration: none;
  line-height: 1;
  border: none;
  background-color: transparent;
  color: var(--font-clr);
  letter-spacing: 2px;
  cursor: pointer;
}

#pageMembershipMyPage .draft .logout-wrapper button.logout:hover::before,
#pageMembershipMyPage .mypage .logout-wrapper button.logout:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

#pageMembershipMyPage .draft .logout-wrapper button.logout::after,
#pageMembershipMyPage .draft .logout-wrapper button.logout::before,
#pageMembershipMyPage .mypage .logout-wrapper button.logout::after,
#pageMembershipMyPage .mypage .logout-wrapper button.logout::before {
  position: absolute;
  left: 5px;
  content: "";
  width: calc(100% - 10px);
  height: 1px;
  background-color: var(--font-clr);
  bottom: -7px;
}

#pageMembershipMyPage .draft .logout-wrapper button.logout::after,
#pageMembershipMyPage .mypage .logout-wrapper button.logout::after {
  opacity: 0.2;
}

#pageMembershipMyPage .draft .logout-wrapper button.logout::before,
#pageMembershipMyPage .mypage .logout-wrapper button.logout::before {
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

#pageMembershipMyPage .draft .img-wrapper,
#pageMembershipMyPage .mypage .img-wrapper {
  position: relative;
  -webkit-box-ordinal-group: 2;
  -ms-flex-order: 1;
  order: 1;
  height: auto;
  margin: 0 calc(50% - 50vw);
  width: 100vw;
  left: 0;
}

#pageMembershipMyPage .draft .img-wrapper img,
#pageMembershipMyPage .mypage .img-wrapper img {
  height: 32.8vw;
  -o-object-fit: cover;
  object-fit: cover;
  max-height: 43.2em;
  width: 100%;
}

#pageMembershipMyPage .draft .info,
#pageMembershipMyPage .mypage .info {
  padding: 0 1.6em;
  -webkit-box-ordinal-group: 4;
  -ms-flex-order: 3;
  order: 3;
  width: 100%;
}

@media only screen and (min-width: 768px) {
  #pageMembershipMyPage .draft .info,
  #pageMembershipMyPage .mypage .info {
    padding: 0 3.2em;
    display: block;
  }
}

#pageMembershipMyPage .draft .info .card,
#pageMembershipMyPage .mypage .info .card {
  padding: 4.8em 1.6em;
  max-width: none;
  max-height: none;
  min-height: auto;
  margin-bottom: 4.8em;
  margin-right: 0;
  font-size: 10px;
  font-size: 1rem;
  border-radius: 0;
  background-color: var(--clr-gray);
  text-align: center;
  font-weight: 600;
  border-radius: 3px;
  border: none;
}

@media only screen and (min-width: 768px) {
  #pageMembershipMyPage .draft .info .card,
  #pageMembershipMyPage .mypage .info .card {
    padding: 10.4em 3.2em;
    margin-bottom: 8em;
  }
}

#pageMembershipMyPage .draft .info .card .logo-text,
#pageMembershipMyPage .mypage .info .card .logo-text {
  font-size: 20px;
  font-size: 2rem;
  line-height: 1.4;
}

#pageMembershipMyPage .draft .info .card .membership-name,
#pageMembershipMyPage .mypage .info .card .membership-name {
  margin: 1.142em 0 0 0;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.4;
}

#pageMembershipMyPage .draft .info .card .join-date,
#pageMembershipMyPage .mypage .info .card .join-date {
  margin: 1.142em 0 0 0;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.4;
}

@media only screen and (min-width: 768px) {
  #pageMembershipMyPage .draft .info .content,
  #pageMembershipMyPage .mypage .info .content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 0 3.2em;
  }

  #pageMembershipMyPage
    .draft
    .info
    .content:not(:has(.about-wrapper))
    .definition-list,
  #pageMembershipMyPage
    .mypage
    .info
    .content:not(:has(.about-wrapper))
    .definition-list {
    width: 100%;
  }
}

#pageMembershipMyPage .draft .info .content .customer-info-wrapper,
#pageMembershipMyPage .mypage .info .content .customer-info-wrapper {
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
}

#pageMembershipMyPage .draft .info .content .customer-info-wrapper + hr,
#pageMembershipMyPage .mypage .info .content .customer-info-wrapper + hr {
  color: var(--clr-gray);
  margin: 1.6em 0 2.4em;
  width: 100%;
}

#pageMembershipMyPage .draft .info .content .customer-info,
#pageMembershipMyPage .mypage .info .content .customer-info {
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.4;
}

#pageMembershipMyPage .draft .info .content .edit-wrapper,
#pageMembershipMyPage .mypage .info .content .edit-wrapper {
  margin: 0 0 0 2em;
  font-size: 10px;
  font-size: 1rem;
  letter-spacing: 2px;
}

#pageMembershipMyPage .draft .info .content .edit-wrapper a.edit,
#pageMembershipMyPage .mypage .info .content .edit-wrapper a.edit {
  position: relative;
  padding: 0.357em;
  font-size: 14px;
  font-size: 1.4rem;
  text-decoration: none;
  letter-spacing: 2px;
  color: var(--font-clr);
  letter-spacing: 2px;
}

#pageMembershipMyPage .draft .info .content .edit-wrapper a.edit:hover,
#pageMembershipMyPage .mypage .info .content .edit-wrapper a.edit:hover {
  opacity: 1;
}

#pageMembershipMyPage .draft .info .content .edit-wrapper a.edit:hover::before,
#pageMembershipMyPage
  .mypage
  .info
  .content
  .edit-wrapper
  a.edit:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

#pageMembershipMyPage .draft .info .content .edit-wrapper a.edit::after,
#pageMembershipMyPage .draft .info .content .edit-wrapper a.edit::before,
#pageMembershipMyPage .mypage .info .content .edit-wrapper a.edit::after,
#pageMembershipMyPage .mypage .info .content .edit-wrapper a.edit::before {
  position: absolute;
  left: 5px;
  content: "";
  width: calc(100% - 12px);
  height: 1px;
  background-color: var(--font-clr);
  bottom: -3px;
}

#pageMembershipMyPage .draft .info .content .edit-wrapper a.edit::after,
#pageMembershipMyPage .mypage .info .content .edit-wrapper a.edit::after {
  opacity: 0.2;
}

#pageMembershipMyPage .draft .info .content .edit-wrapper a.edit::before,
#pageMembershipMyPage .mypage .info .content .edit-wrapper a.edit::before {
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

#pageMembershipMyPage .draft .info .content .definition-list,
#pageMembershipMyPage .mypage .info .content .definition-list {
  margin: 0;
}

@media only screen and (min-width: 768px) {
  #pageMembershipMyPage .draft .info .content .definition-list,
  #pageMembershipMyPage .mypage .info .content .definition-list {
    width: 59.75%;
  }
}

#pageMembershipMyPage .draft .info .content .definition-list .definition-term,
#pageMembershipMyPage .mypage .info .content .definition-list .definition-term {
  padding: 1em;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: normal;
  line-height: 1;
  background-color: #222;
  color: #fff;
  text-align: center;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}

#pageMembershipMyPage
  .draft
  .info
  .content
  .definition-list
  .definition-description,
#pageMembershipMyPage
  .mypage
  .info
  .content
  .definition-list
  .definition-description {
  display: block;
  font-size: 14px;
  font-size: 1.4rem;
  padding: 1.714em;
  position: relative;
  border: 1px solid #222;
  background: #fff;
  color: #222;
  text-align: center;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  margin-top: 0;
}

#pageMembershipMyPage
  .draft
  .info
  .content
  .definition-list
  .definition-description
  + .definition-term,
#pageMembershipMyPage
  .mypage
  .info
  .content
  .definition-list
  .definition-description
  + .definition-term {
  margin-top: 1.428em;
}

#pageMembershipMyPage .draft .info .content .definition-list .mail-address,
#pageMembershipMyPage .draft .info .content .definition-list .point-amount,
#pageMembershipMyPage .mypage .info .content .definition-list .mail-address,
#pageMembershipMyPage .mypage .info .content .definition-list .point-amount {
  padding: 0;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1;
  text-align: center;
}

#pageMembershipMyPage .draft .info .content .definition-list .point-amount,
#pageMembershipMyPage .mypage .info .content .definition-list .point-amount {
  font-size: 26px;
  font-size: 2.6rem;
  font-weight: bold;
  margin-bottom: 0.615em;
}

#pageMembershipMyPage .draft .info .content .definition-list + .about-wrapper,
#pageMembershipMyPage .mypage .info .content .definition-list + .about-wrapper {
  margin-top: 2.4em;
  display: block;
}

@media only screen and (min-width: 768px) {
  #pageMembershipMyPage .draft .info .content .definition-list + .about-wrapper,
  #pageMembershipMyPage
    .mypage
    .info
    .content
    .definition-list
    + .about-wrapper {
    margin-top: 0;
  }
}

#pageMembershipMyPage .draft .info .content .definition-list + .about-wrapper a,
#pageMembershipMyPage
  .mypage
  .info
  .content
  .definition-list
  + .about-wrapper
  a {
  position: relative;
  text-decoration: none;
  color: var(--font-clr);
  font-size: 14px;
  font-size: 1.4rem;
}

#pageMembershipMyPage
  .draft
  .info
  .content
  .definition-list
  + .about-wrapper
  a:hover,
#pageMembershipMyPage
  .mypage
  .info
  .content
  .definition-list
  + .about-wrapper
  a:hover {
  opacity: 1;
}

#pageMembershipMyPage
  .draft
  .info
  .content
  .definition-list
  + .about-wrapper
  a:hover::before,
#pageMembershipMyPage
  .mypage
  .info
  .content
  .definition-list
  + .about-wrapper
  a:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

#pageMembershipMyPage
  .draft
  .info
  .content
  .definition-list
  + .about-wrapper
  a::after,
#pageMembershipMyPage
  .draft
  .info
  .content
  .definition-list
  + .about-wrapper
  a::before,
#pageMembershipMyPage
  .mypage
  .info
  .content
  .definition-list
  + .about-wrapper
  a::after,
#pageMembershipMyPage
  .mypage
  .info
  .content
  .definition-list
  + .about-wrapper
  a::before {
  position: absolute;
  left: 0;
  content: "";
  width: 100%;
  height: 1px;
  background-color: var(--font-clr);
  bottom: -8px;
}

#pageMembershipMyPage
  .draft
  .info
  .content
  .definition-list
  + .about-wrapper
  a::after,
#pageMembershipMyPage
  .mypage
  .info
  .content
  .definition-list
  + .about-wrapper
  a::after {
  opacity: 0.2;
}

#pageMembershipMyPage
  .draft
  .info
  .content
  .definition-list
  + .about-wrapper
  a::before,
#pageMembershipMyPage
  .mypage
  .info
  .content
  .definition-list
  + .about-wrapper
  a::before {
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

#pageMembershipMyPage
  .draft
  .info
  .content
  .definition-list
  + .about-wrapper
  .point-history,
#pageMembershipMyPage
  .mypage
  .info
  .content
  .definition-list
  + .about-wrapper
  .point-history {
  margin-bottom: 1.6em;
}

#pageMembershipMyPage
  .draft
  .info
  .content
  .definition-list
  + .about-wrapper
  .point-history
  a,
#pageMembershipMyPage
  .mypage
  .info
  .content
  .definition-list
  + .about-wrapper
  .point-history
  a {
  font-weight: 400;
}

#pageMembershipMyPage .draft .leave-wrapper,
#pageMembershipMyPage .mypage .leave-wrapper {
  margin: 4.8em 0 10.4em 0;
  font-size: 10px;
  font-size: 1rem;
  -webkit-box-ordinal-group: 5;
  -ms-flex-order: 4;
  order: 4;
  width: 100%;
}

@media only screen and (min-width: 768px) {
  #pageMembershipMyPage .draft .leave-wrapper,
  #pageMembershipMyPage .mypage .leave-wrapper {
    margin: 2em 0 13.6em 0;
  }
}

#pageMembershipMyPage .draft .leave-wrapper button.leave,
#pageMembershipMyPage .mypage .leave-wrapper button.leave {
  position: relative;
  color: var(--font-clr) !important;
  text-decoration: none !important;
  background-color: transparent;
}

#pageMembershipMyPage .draft .leave-wrapper button.leave:hover::before,
#pageMembershipMyPage .mypage .leave-wrapper button.leave:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

#pageMembershipMyPage .draft .leave-wrapper button.leave::after,
#pageMembershipMyPage .draft .leave-wrapper button.leave::before,
#pageMembershipMyPage .mypage .leave-wrapper button.leave::after,
#pageMembershipMyPage .mypage .leave-wrapper button.leave::before {
  position: absolute;
  left: 6px;
  content: "";
  width: calc(100% - 12px);
  height: 1px;
  background-color: var(--font-clr);
  bottom: -8px;
}

#pageMembershipMyPage .draft .leave-wrapper button.leave::after,
#pageMembershipMyPage .mypage .leave-wrapper button.leave::after {
  opacity: 0.2;
}

#pageMembershipMyPage .draft .leave-wrapper button.leave::before,
#pageMembershipMyPage .mypage .leave-wrapper button.leave::before {
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

#pageMembershipMyPage .draft .leave-modal-wrapper,
#pageMembershipMyPage .mypage .leave-modal-wrapper {
  -webkit-box-ordinal-group: 6;
  -ms-flex-order: 5;
  order: 5;
}

#pageMembershipMyPage .draft .reward-list,
#pageMembershipMyPage .mypage .reward-list {
  margin-top: 4.8em;
  padding: 0 1.6em;
  -webkit-box-ordinal-group: 5;
  -ms-flex-order: 4;
  order: 4;
}

@media only screen and (min-width: 768px) {
  #pageMembershipMyPage .draft .reward-list,
  #pageMembershipMyPage .mypage .reward-list {
    margin-top: 8em;
    padding: 0 3.2em;
  }
}

#pageMembershipMyPage .draft .reward-list .exchange-point-icon,
#pageMembershipMyPage .mypage .reward-list .exchange-point-icon {
  display: none;
}

#pageMembershipMyPage .draft .reward-list .exchange-point,
#pageMembershipMyPage .mypage .reward-list .exchange-point {
  position: relative;
  color: var(--clr-red);
  margin-left: 0;
  padding-left: 1.65em;
}

#pageMembershipMyPage .draft .reward-list .exchange-point::before,
#pageMembershipMyPage .mypage .reward-list .exchange-point::before {
  position: absolute;
  left: 0;
  top: 0;
  width: 1.384em;
  height: 1.384em;
  font-size: 13px;
  font-size: 1.3rem;
  display: inline-block;
  content: "";
  line-height: 1.4;
  background-color: var(--clr-red);
  -webkit-mask: url("data:image/svg+xml;charset=utf8,<svg width='17' height='18' viewBox='0 0 17 18' fill='none' xmlns='http://www.w3.org/2000/svg'><circle cx='8.5' cy='9' r='8' stroke='red'/><path d='M6.3 14.5V4.971H9.017C11.149 4.971 12.592 5.686 12.592 7.779C12.592 9.781 11.162 10.717 9.069 10.717H7.509V14.5H6.3ZM7.509 9.742H8.926C10.59 9.742 11.396 9.131 11.396 7.779C11.396 6.388 10.551 5.959 8.861 5.959H7.509V9.742Z' fill='black'/></svg>");
  -webkit-mask-image: url("data:image/svg+xml;charset=utf8,<svg width='17' height='18' viewBox='0 0 17 18' fill='none' xmlns='http://www.w3.org/2000/svg'><circle cx='8.5' cy='9' r='8' stroke='red'/><path d='M6.3 14.5V4.971H9.017C11.149 4.971 12.592 5.686 12.592 7.779C12.592 9.781 11.162 10.717 9.069 10.717H7.509V14.5H6.3ZM7.509 9.742H8.926C10.59 9.742 11.396 9.131 11.396 7.779C11.396 6.388 10.551 5.959 8.861 5.959H7.509V9.742Z' fill='black'/></svg>");
  mask-image: url("data:image/svg+xml;charset=utf8,<svg width='17' height='18' viewBox='0 0 17 18' fill='none' xmlns='http://www.w3.org/2000/svg'><circle cx='8.5' cy='9' r='8' stroke='red'/><path d='M6.3 14.5V4.971H9.017C11.149 4.971 12.592 5.686 12.592 7.779C12.592 9.781 11.162 10.717 9.069 10.717H7.509V14.5H6.3ZM7.509 9.742H8.926C10.59 9.742 11.396 9.131 11.396 7.779C11.396 6.388 10.551 5.959 8.861 5.959H7.509V9.742Z' fill='black'/></svg>");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.membership .draft .content {
  -webkit-box-ordinal-group: 4;
  -ms-flex-order: 3;
  order: 3;
  padding: 4.8em 1.6em;
  margin-bottom: 4.8em;
}

@media only screen and (min-width: 768px) {
  .membership .draft .content {
    padding: 10.4em 3.2em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 0 3.2em;
  }

  .membership .draft .content:not(:has(.about-wrapper)) .definition-list {
    width: 100%;
  }

  .membership .draft .content .customer-info-wrapper {
    margin: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
  }

  .membership .draft .content .customer-info-wrapper + hr {
    color: var(--clr-gray);
    margin: 1.6em 0 2.4em;
    width: 100%;
  }

  .membership .draft .content .customer-info {
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 1.4;
  }
}

.membership .draft .content .message {
  margin-bottom: 3em !important;
  margin-top: 0 !important;
  font-size: 16px;
  font-size: 1.6rem;
  letter-spacing: 2px;
  width: 100%;
  background-color: var(--clr-gray);
  padding: 8em 1em;
}

@media only screen and (min-width: 768px) {
  .membership .draft .content .message {
    margin: 0 0 3em 0 !important;
  }
}

.membership .draft .content .definition-list {
  margin: 0;
}

@media only screen and (min-width: 768px) {
  .membership .draft .content .definition-list {
    margin-top: 0 !important;
    width: 59.75%;
  }
}

.membership .draft .content .definition-list .definition-term {
  padding: 1em;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: normal;
  line-height: 1;
  background-color: #222;
  color: #fff;
  text-align: center;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}

.membership .draft .content .definition-list .definition-description {
  display: block;
  font-size: 14px;
  font-size: 1.4rem;
  padding: 1.714em;
  position: relative;
  border: 1px solid #222;
  background: #fff;
  color: #222;
  text-align: center;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  margin-top: 0;
}

.membership
  .draft
  .content
  .definition-list
  .definition-description
  + .definition-term {
  margin-top: 1.428em;
}

.membership .draft .content .definition-list .mail-address,
.membership .draft .content .definition-list .point-amount {
  padding: 0;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1;
  text-align: center;
}

.membership .draft .content .definition-list .point-amount {
  font-size: 26px;
  font-size: 2.6rem;
  font-weight: bold;
  margin-bottom: 0.615em;
}

.membership .draft .content .definition-list + .about-wrapper {
  margin-top: 2.4em;
  display: block;
}

@media only screen and (min-width: 768px) {
  .membership .draft .content .definition-list + .about-wrapper {
    margin-top: 0;
  }
}

.membership .draft .content .definition-list + .about-wrapper a {
  position: relative;
  text-decoration: none;
  color: var(--font-clr);
  font-size: 14px;
  font-size: 1.4rem;
}

.membership .draft .content .definition-list + .about-wrapper a:hover {
  opacity: 1;
}

.membership .draft .content .definition-list + .about-wrapper a:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

.membership .draft .content .definition-list + .about-wrapper a::after,
.membership .draft .content .definition-list + .about-wrapper a::before {
  position: absolute;
  left: 0;
  content: "";
  width: 100%;
  height: 1px;
  background-color: var(--font-clr);
  bottom: -8px;
}

.membership .draft .content .definition-list + .about-wrapper a::after {
  opacity: 0.2;
}

.membership .draft .content .definition-list + .about-wrapper a::before {
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

.membership .draft .content .definition-list + .about-wrapper .point-history {
  margin-bottom: 1.6em;
}

.membership .draft .content .definition-list + .about-wrapper .point-history a {
  font-weight: 400;
}

.membership .draft .content .point-info-login {
  text-align: center;
  width: 100%;
}

.membership .draft .content .point-info-login-link {
  position: relative;
  color: var(--font-clr) !important;
  text-decoration: none !important;
}

.membership .draft .content .point-info-login-link:hover {
  opacity: 1;
}

.membership .draft .content .point-info-login-link:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

.membership .draft .content .point-info-login-link::after,
.membership .draft .content .point-info-login-link::before {
  position: absolute;
  left: 0;
  content: "";
  width: 100%;
  height: 1px;
  background-color: var(--font-clr);
  bottom: -8px;
}

.membership .draft .content .point-info-login-link::after {
  opacity: 0.2;
}

.membership .draft .content .point-info-login-link::before {
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

.membership .draft .heading-wrapper {
  margin: 4.8em 0;
  padding: 0 1.6em;
}

@media only screen and (min-width: 768px) {
  .membership .draft .heading-wrapper {
    padding: 0 3.2em;
  }
}

.membership .draft .logout-wrapper {
  margin: 0 0 0 2em;
  font-size: 10px;
  font-size: 1rem;
}

.membership .draft .logout-wrapper button.logout {
  position: relative;
  padding: 0.357em;
  font-size: 14px;
  font-size: 1.4rem;
  text-decoration: none;
  line-height: 1;
  border: none;
  background-color: transparent;
  color: var(--font-clr);
  letter-spacing: 2px;
  cursor: pointer;
}

.membership .draft .logout-wrapper button.logout:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

.membership .draft .logout-wrapper button.logout::after,
.membership .draft .logout-wrapper button.logout::before {
  position: absolute;
  left: 5px;
  content: "";
  width: calc(100% - 10px);
  height: 1px;
  background-color: var(--font-clr);
  bottom: -7px;
}

.membership .draft .logout-wrapper button.logout::after {
  opacity: 0.2;
}

.membership .draft .logout-wrapper button.logout::before {
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

.membership .draft .leave-wrapper {
  margin: 4.8em 0 10.4em 0;
  font-size: 10px;
  font-size: 1rem;
  -webkit-box-ordinal-group: 5;
  -ms-flex-order: 4;
  order: 4;
  width: 100%;
}

@media only screen and (min-width: 768px) {
  .membership .draft .leave-wrapper {
    margin: 2em 0 13.6em 0;
  }
}

.membership .draft .leave-wrapper button.leave {
  position: relative;
  color: var(--font-clr) !important;
  text-decoration: none !important;
  background-color: transparent;
}

.membership .draft .leave-wrapper button.leave:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

.membership .draft .leave-wrapper button.leave::after,
.membership .draft .leave-wrapper button.leave::before {
  position: absolute;
  left: 6px;
  content: "";
  width: calc(100% - 12px);
  height: 1px;
  background-color: var(--font-clr);
  bottom: -8px;
}

.membership .draft .leave-wrapper button.leave::after {
  opacity: 0.2;
}

.membership .draft .leave-wrapper button.leave::before {
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

#pageMembershipMyPage .draft .heading-wraper {
  margin: 8em 0 0 !important;
  padding-bottom: 0;
}

@media only screen and (min-width: 768px) {
  #pageMembershipMyPage .draft .heading-wraper {
    margin: 10.4em 0 0 !important;
  }
}

#pageMembershipMyPage .draft .content {
  margin-top: 8em;
  padding-top: 4.8em;
}

@media only screen and (min-width: 768px) {
  #pageMembershipMyPage .draft .content {
    margin-bottom: 0;
  }
}

#pageMembershipMyPage .draft .heading-wrapper + .content {
  margin-top: 0;
  padding-top: 0;
}

#pageMembershipMyPage .mypage .leave-wrapper {
  margin-top: 4.8em;
}

@media only screen and (min-width: 768px) {
  #pageMembershipMyPage .mypage .leave-wrapper {
    margin-top: 8em;
  }
}

#pageMembershipGuide .draft .heading-wrapper {
  margin: 8em 0 0 !important;
}

@media only screen and (min-width: 768px) {
  #pageMembershipGuide .draft .heading-wrapper {
    margin-top: 10.4em !important;
  }
}

#pageMembershipGuide .draft .content {
  margin-top: 8em;
  padding-top: 4.8em;
}

@media only screen and (min-width: 768px) {
  #pageMembershipGuide .draft .content {
    margin-top: 8em;
  }
}

#pageMembershipGuide .draft .heading-wrapper + .content {
  margin-top: 4.8em;
}

#pageMembershipLogin .login .heading {
  letter-spacing: 3px;
  margin: 3.076em 0 1.846em;
}

@media only screen and (min-width: 768px) {
  #pageMembershipLogin .login .heading {
    margin: 4em 0 3.076em;
  }
}

#pageMembershipLogin .login .link-wrapper {
  margin: 0 1.6em;
  padding: 4.8em 1.6em 0;
  background-color: var(--clr-gray);
  text-align: center;
}

@media only screen and (min-width: 768px) {
  #pageMembershipLogin .login .link-wrapper {
    margin: 0 3.2em;
    padding: 10.4em 1.6em 0;
  }
}

@media only screen and (min-width: 865px) {
  #pageMembershipLogin .login .link-wrapper {
    margin: 0 auto;
  }
}

#pageMembershipLogin .login .link-wrapper a.link {
  width: 100%;
  padding: 1.428em;
  border-radius: 3px;
  background-color: #000535;
  color: #fff;
  letter-spacing: 2px;
  max-width: 25.714em;
  border: none;
}

#pageMembershipLogin .login .link-wrapper a.link img {
  margin-bottom: -2px;
  margin-right: 0.285em;
}

#pageMembershipLogin .login .register-description {
  margin: 0 1.142em 7.428em;
  padding: 1.428em 1.25em 3.428em;
  background-color: var(--clr-gray);
  text-align: center;
  font-size: 14px;
  font-size: 1.4rem;
  max-width: 61.714em;
}

@media only screen and (min-width: 768px) {
  #pageMembershipLogin .login .register-description {
    margin: 0 2.285em 7.428em;
    padding-bottom: 7.428em;
  }
}

#pageMembershipLogin .login .register-description a {
  position: relative;
  color: inherit;
  text-decoration: none;
}

#pageMembershipLogin .login .register-description a:hover {
  opacity: 1;
}

#pageMembershipLogin .login .register-description a:hover::before {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}

#pageMembershipLogin .login .register-description a::after,
#pageMembershipLogin .login .register-description a::before {
  position: absolute;
  left: 0;
  content: "";
  width: 100%;
  height: 1px;
  background-color: var(--font-clr);
  bottom: -4px;
}

#pageMembershipLogin .login .register-description a::after {
  opacity: 0.2;
}

#pageMembershipLogin .login .register-description a::before {
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
}

@media only screen and (min-width: 865px) {
  #pageMembershipLogin .login .register-description {
    margin: 0 auto 9.714em;
  }
}

#pageMembershipLogin .membership .draft .content .message {
  background-color: transparent;
}

#membership .point-history .content {
  margin-bottom: 10.4em;
  padding: 0 1.6em;
}

@media only screen and (min-width: 768px) {
  #membership .point-history .content {
    padding: 0 3.2em;
    margin-bottom: 13.6em;
  }
}

#membership .point-history .content .point-history-summary {
  font-size: 10px;
  font-size: 1rem;
  margin-bottom: 4.8em;
}

#membership .point-history .content .point-name {
  text-align: left;
  margin-bottom: 1.2em;
  color: var(--font-clr);
  margin-top: 4em;
}

@media only screen and (min-width: 768px) {
  #membership .point-history .content .point-name {
    margin-top: 5.2em;
  }
}

#membership .point-history .content .description {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.8;
  color: var(--font-clr);
}

#membership .point-history .content .point-history-empty-text {
  border: 0;
  padding: 1.142em;
  font-size: 14px;
  font-size: 1.4rem;
  position: relative;
  background: #fff;
  color: #222;
  border: solid 1px rgba(34, 34, 34, 0.15);
}

#membership .point-history .content .point-history-list {
  position: relative;
  padding: 1.6em;
  font-size: 10px;
  font-size: 1rem;
  color: #222;
  border: solid 1px var(--clr-gray);
  background-color: #fff;
}

#membership .point-history .content .card {
  font-size: 10px;
  font-size: 1rem;
  border: 0;
  padding: 1.6em 0 0 0;
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: repeat(3, auto);
  grid-column-gap: 2em;
}

#membership .point-history .content .card:first-child {
  padding-top: 0;
}

#membership .point-history .content .card + .card {
  margin-top: 1.8em;
  position: relative;
}

#membership .point-history .content .card + .card::before {
  background: #222;
}

#membership .point-history .content .card .caption {
  margin: 0;
  grid-area: 1/1/4/2;
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: #222;
}

#membership .point-history .content .card .caption .action-type {
  display: inline-block;
  font-size: 11px;
  font-size: 1.1rem;
  background: #999;
  color: #fff;
  padding: 0.454em 0.909em 0.545em 0.909em;
  border-radius: 0.181em;
}

#membership .point-history .content .card .point {
  margin: 0;
  grid-area: 1/2/2/3;
  font-size: 24px;
  font-size: 2.4rem;
  line-height: 1.4;
  text-align: right;
  color: #222;
}

#membership .point-history .content .card .order-header-unique-key {
  margin: 0;
  grid-area: 2/2/3/3;
  font-size: 11px;
  font-size: 1.1rem;
  line-height: 1.4;
  text-align: right;
  color: #222;
}

#membership .point-history .content .card .reward-name {
  grid-area: 3/2/4/3;
  font-size: 11px;
  font-size: 1.1rem;
  line-height: 1.4;
  text-align: right;
  color: #222;
}

#membership .point-history .content .card.is-get .caption .action-type {
  background: #c05d5d;
}

#membership .point-history .content .card.is-get .point {
  color: #c05d5d;
}

#membership .point-history .content .card.is-return .caption .action-type {
  background: #1e3d77;
}

#membership .point-history .content .card.is-return .point {
  color: #1e3d77;
}

@media only screen and (min-width: 768px) {
  #membership .point-history .content .point-name {
    margin-bottom: 1.333em;
  }

  #membership .point-history .content .description {
    font-size: 16px;
    font-size: 1.6rem;
  }

  #membership .point-history .content .point-history-empty-text {
    padding: 2em;
    font-size: 16px;
    font-size: 1.6rem;
  }

  #membership .point-history .content .point-history-list {
    padding: 3.2em;
  }

  #membership .point-history .content .card {
    padding: 3em 0 0 0;
  }

  #membership .point-history .content .card + .card {
    margin-top: 3.2em;
  }

  #membership .point-history .content .card .caption {
    font-size: 16px;
    font-size: 1.6rem;
  }

  #membership .point-history .content .card .caption .action-type {
    font-size: 13px;
    font-size: 1.3rem;
    padding: 0.384em 0.769em;
    border-radius: 0.153em;
  }

  #membership .point-history .content .card .point {
    font-size: 27px;
    font-size: 2.7rem;
  }

  #membership .point-history .content .card .order-header-unique-key {
    font-size: 13px;
    font-size: 1.3rem;
  }

  #membership .point-history .content .card .reward-name {
    font-size: 13px;
    font-size: 1.3rem;
  }
}

@media only screen and (min-width: 1024px) {
  #membership .point-history .content .point-name {
    margin-bottom: 1.714em;
  }

  #membership .point-history .content .point-history-summary {
    margin-bottom: 6.4em;
  }

  #membership .point-history .content .point-history-empty-text {
    padding: 3em;
  }

  #membership .point-history .content .point-history-list {
    padding: 4.8em;
  }
}

#membership .point-history .pagination {
  font-size: 10px;
  font-size: 1rem;
  margin: 4.8em 0;
}

#membership .point-history .pagination .page-block a.page-link,
#membership .point-history .pagination .page-block span.current {
  position: relative;
  margin: 0 0.071em;
  padding: 0.714em;
  min-width: 3.857em;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: normal;
  line-height: 1.85;
  background: none;
  border: 0;
  border-radius: 0.428em;
}

#membership .point-history .pagination .page-block a.page-link::before,
#membership .point-history .pagination .page-block span.current::before {
  border-radius: 0.357em;
}

#membership .point-history .pagination .page-block span.current {
  color: var(--clr-th-white);
}

#membership .point-history .pagination .page-block span.current::before {
  opacity: 1;
  background: var(--clr-th-black);
}

#membership .point-history .pagination .page-block a.page-link {
  color: var(--clr-th-black);
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  z-index: 0;
  background: var(--clr-th-white);
}

#membership .point-history .pagination .page-block a.page-link::before {
  background: none;
  border: solid 1px var(--clr-th-black);
  opacity: 0.15;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

#membership .point-history .pagination .page-block a.page-link:hover {
  color: var(--clr-th-white);
  opacity: 1;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

#membership .point-history .pagination .page-block a.page-link:hover::before {
  opacity: 1;
  background: var(--clr-th-black);
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

#membership .point-history .pagination .page-block span.ellipses {
  color: var(--clr-th-black);
  opacity: 0.5;
}

@media only screen and (min-width: 768px) {
  #membership .point-history .pagination .pagination {
    margin: 3.2em 0;
  }
}

@media only screen and (min-width: 1024px) {
  #membership .point-history .pagination .pagination {
    margin: 6.4em 0;
  }
}

#pageLaw h2 {
  font-size: 20px;
  font-size: 2rem;
  letter-spacing: 3px;
}

@media only screen and (min-width: 768px) {
  #pageLaw h2 {
    font-size: 26px;
    font-size: 2.6rem;
  }
}

#pageLaw h3 {
  font-size: 16px;
  font-size: 1.6rem;
  margin-top: 1.5em;
}

@media only screen and (min-width: 768px) {
  #pageLaw h3 {
    margin-top: 3em;
  }
}

#pageLaw p {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
}

#pageLaw .atobaraiTerm,
#pageLaw .bnplTerm {
  position: relative;
  margin-top: 2.4em;
  padding: 2em;
  font-size: 10px;
  font-size: 1rem;
  background-color: var(--clr-gray);
}

#pageLaw .atobaraiTerm__title,
#pageLaw .bnplTerm__title {
  font-weight: bold;
}

#pageLaw .telnumValid__txt {
  color: #222;
}

#privacy h2 {
  font-size: 22px;
  font-size: 2.2rem;
  letter-spacing: 3px;
  margin-bottom: 3.2em;
}

@media only screen and (min-width: 768px) {
  #privacy h2 {
    font-size: 26px;
    font-size: 2.6rem;
  }
}

#privacy .privacy_intro {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
}

#privacy dl {
  margin-top: 8em;
}

#privacy dl > dt {
  font-size: 20px;
  font-size: 2rem;
  line-height: 1.4;
  margin-bottom: 1.6em;
  letter-spacing: 3px;
}

#privacy dl > dd {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
  letter-spacing: 2px;
  margin-bottom: 5.714em;
}

@media only screen and (min-width: 768px) {
  #privacy dl > dd {
    margin-bottom: 7.428em;
  }
}

#privacy dl ul {
  margin-top: 2em;
  padding: 2em;
  font-size: 10px;
  font-size: 1rem;
  border: solid 1px var(--font-clr);
}

#privacy dl ul li {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 2;
}

#privacy dl ul li + li {
  margin-top: 0.714em;
}

.law-wrap,
.priv-wrap {
  padding: 8em 1.6em 0;
}

@media only screen and (min-width: 768px) {
  .law-wrap,
  .priv-wrap {
    padding: 10.4em 3.2em 0;
  }
}

.law-wrap .ttl-h1,
.priv-wrap .ttl-h1 {
  font-size: 22px;
  font-size: 2.2rem;
  letter-spacing: 3px;
  margin-bottom: 1.09em;
  text-align: center;
}

@media only screen and (min-width: 768px) {
  .law-wrap .ttl-h1,
  .priv-wrap .ttl-h1 {
    font-size: 26px;
    font-size: 2.6rem;
    margin-bottom: 1.846em;
  }
}

@media only screen and (min-width: 1024px) {
  .law-wrap .ttl-h1,
  .priv-wrap .ttl-h1 {
    margin-bottom: 3.076em;
  }
}

.law-wrap {
  padding-bottom: 8em;
}

@media only screen and (min-width: 768px) {
  .law-wrap {
    padding-bottom: 10.4em;
  }
}

@media only screen and (min-width: 1024px) {
  .law-wrap {
    padding-bottom: 13.6em;
  }
}

.mt-16 {
  margin-top: 1.6rem;
}

.mt-24 {
  margin-top: 2.4rem;
}

.mt-40 {
  margin-top: 4rem;
}

@media only screen and (min-width: 768px) {
  .pc-none {
    display: none;
  }
}
