@charset "utf-8";
/* CSS Document */
/* - shop.css - */


/* -------------------------------------------- */
.shop__textbox {
  box-sizing: border-box;
  padding: calc(30 / 750 * 100%) calc(30 / 750 * 100%) 0;
  margin: 0 auto;
}
.shop__textbox h2 {
  background: url(img/dot_line_or_long.svg) no-repeat bottom left;
  -webkit-background-size: auto 2px;
  background-size: auto 2px;
  box-sizing: border-box;
  padding-bottom: .5em;
  font-size: var(--fs-28);
  font-weight: 700;
  margin:  calc(60 / 690 * 100%)  auto calc(10 / 690 * 100%);
}
.shop__textbox p {
  line-height: calc(26 / 16 * 1em);
  font-size: var(--fs-26);
}
.shop__textbox p + p {
  margin-top: 1.5em;
}

.shop__textbox a {
  display: inline;
  position: relative;
  border-bottom: 1px solid var(--c-or);
  line-height: 1.25em;
}
/* -------------------------------------------- */
@media screen and (min-width:1000px){
.shop__textbox {
  box-sizing: border-box;
  padding: 30px 10px;
  max-width: 1120px;
  margin: 0 auto;
}
.shop__textbox h2 {
  background: url(img/dot_line_or_long.svg) no-repeat bottom left;
  -webkit-background-size: auto 3px;
  background-size: auto 3px;
  box-sizing: border-box;
  padding-bottom: .5em;
  font-size: var(--fs-20);
  font-weight: 700;
  margin: 60px auto 10px;
}
.shop__textbox p {
  line-height: calc(26 / 16 * 1em);
  font-size: var(--fs-16);
}
.shop__textbox p + p {
  margin-top: 1.5em;
}

  
}



/* -------------------------------------------- */
.shop-content {
  display: table;
  width: calc(670 / 750 * 100%);
  margin: 0 auto ;
  max-width: 1100px;
}
.shop-content ul {
  display: block;
  text-align: center;
  margin: calc(40 / 670 * 100%) auto;
}
.shop-content ul.title {
  display: none;
}
.shop-content .shop-item li:first-child {
  background-color: var(--c-br);
  color: #fff;
  text-align: center;
  padding: 0.5em;
  box-sizing: border-box;
  margin-bottom: 1em;
}
.shop-content .shop-item li:empty {
  display: none;
}
.shop-item {
  background: url(../shared/img/dot_line_gray_700.svg) no-repeat bottom left;
  -webkit-background-size: auto 2px;
  background-size: auto 2px;
  padding-bottom: 1em;
}
#shop-selector {
  
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -ms-align-items: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: center;
  margin: calc(120 / 750 * 100%) auto 0;
  gap: 1em;
}
#shop-selector span {
  display: block;
  font-weight: 700;
}
#shop-selector select {
  border: 1px solid var(--c-br);
  padding: 1px 1em;
  box-sizing: border-box;
  border-radius: 10px;
}
.shop-item[style*="height: 0px;"]{
  display: none;
}
/* -------------------------------------------- */
@media screen and (min-width:1000px){
.shop-content {
  display: table;
  width: 100%;
  margin: 20px auto 0;
  max-width: 1100px;
  border: 1px solid var(--c-gr);
  font-size: var(--fs-14);
  line-height: calc(24 / 14 * 1em);
}
.shop-content ul.title {
  display: table-row;
  background: var(--c-lgr);
}
.shop-item {
  background: none;
}
.shop-content ul {
  display: table-row;
}
.shop-content .shop-item li:first-child {
  background: none;
  color: var(--c-br);
}
.shop-content .shop-item li:empty,
.shop-content li {
  display: table-cell;
  position: relative;
  vertical-align: middle;
  box-sizing: border-box;
  padding: 20px 10px;
}
  .shop-content ul + ul li {
    border-top: 1px solid var(--c-gr);
  }
  .shop-content ul li + li {
    border-left: 1px solid var(--c-gr);
  }
  .shop-content ul li:empty {
    border-top: none;
  }
.shop-content ul li:nth-of-type(1){
  width: calc(220 / 1100 * 100%);
}
.shop-content ul li:nth-of-type(2){
  width: calc(240 / 1100 * 100%);
}
.shop-content ul li:nth-of-type(3){
  width: calc(400 / 1100 * 100%);
}
.shop-content ul li:nth-of-type(4){
  width: calc(240 / 1100 * 100%);
}
  #shop-selector {
    margin: 120px auto 40px;
  }  
#shop-selector span {
  font-size: var(--fs-22);
}
#shop-selector select {
  line-height: 1.75em;
}
}