@charset "UTF-8";

/* common
===================================================== */
html,
body {
  letter-spacing: 0;
  line-height: 1.6;
  color: #00040d;
  font-family: cardo, serif;
  font-weight: 400;
  font-style: normal;
}

@media screen and (min-width: 768px) {

  html,
  body {
    font-size: 14px;
  }
}

@media screen and (max-width: 767px) {

  html,
  body {
    font-size: 12px;
  }
}

.wrapper {
  overflow-x: hidden;
}

* {
  box-sizing: border-box;
}

*:focus {
  outline: none;
}

a {
  text-decoration: none;
}

a:hover {
  color: #fff;
}

a:hover img {
  opacity: 1;
}

img {
  width: 100%;
  display: block;
}

@media screen and (min-width: 768px) {
  .pc-none {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .pc-none {
    display: block;
  }
}

@media screen and (min-width: 768px) {
  .sp-none {
    display: block;
  }
}

@media screen and (max-width: 767px) {
  .sp-none {
    display: none;
  }
}

/* .top
===================================================== */
@media screen and (min-width: 768px) {
  .top {
    padding-top: 0;
    position: relative;
    /* margin-left: 10.625vw; */
    margin-bottom: min(11.4023591088vw, 87px);
  }
}

@media screen and (max-width: 767px) {
  .top {
    padding-top: 17.3333333333vw;
    margin-bottom: 11.2vw;
  }
}

@media screen and (min-width: 768px) {
  .top-title {
    width: 13vw;
    position: absolute;
    top: 7vw;
    left: 2px;
  }
}

@media screen and (max-width: 767px) {
  .top-title {
    width: 20vw;
    margin-bottom: 37.0666666667vw;
    /* margin-left: 11.7333333333vw; */
  }
}

.top-img {
  position: relative;
}

@media screen and (min-width: 768px) {
  .top-img {
    padding-bottom: 4.5138888889vw;
  }
}

.top-img__gray {
  position: absolute;
  z-index: 1;
  opacity: 0.25;
}

@media screen and (min-width: 768px) {
  .top-img__gray {
    width: 400px;
    bottom: 0;
    right: 0;
  }
}

@media screen and (max-width: 767px) {
  .top-img__gray {
    top: -15%;
    left: 0;
  }
}

.top-img__gray img {
  filter: grayscale(100%);
}

.top-img__color {
  position: relative;
  z-index: 2;
}

@media screen and (min-width: 768px) {
  .top-img__color {
    width: 500px;
    margin-left: auto;
  }
}

@media screen and (max-width: 767px) {
  .top-img__color {
    margin-left: 11.7333333333vw;
  }
}

@media screen and (min-width: 768px) {
  .top-logo {
    width: 6.1111111111vw;
    position: absolute;
    bottom: 4.5138888889vw;
    left: 0;
  }
}

.information_area {
  border: 1px solid #333;
  padding: 20px;
  text-align: center;
  margin: 30px auto;
  line-height: 2;
  font-size: 16px;
}

.information_area .sale_txt {
  font-size: 22px;
  font-weight: bold;
  color: #c50000;
  display: block;
}

.information_area .date {
  font-size: 18px;
  font-weight: bold;
}

/* .sec
===================================================== */
@media screen and (min-width: 768px) {
  .sec {
    margin-top: 150px;
    margin-bottom: min(35.3866317169vw, 220px);
  }
}

@media screen and (max-width: 767px) {
  .sec {
    margin-top: 150px;
    margin-bottom: 59.4666666667vw;
  }
}

@media screen and (min-width: 768px) {
  .sec2 {
    margin-top: 150px;
    margin-bottom: min(35.3866317169vw, 100px);
  }
}

@media screen and (max-width: 767px) {
  .sec2 {
    margin-top: 150px;
    margin-bottom: 59.4666666667vw;
  }
}

@media screen and (min-width: 768px) {
  .sec:nth-of-type(odd) .sec-mainarea-num {
    left: max(-1.9230769231vw, -20px);
  }
}

@media screen and (max-width: 767px) {
  .sec:nth-of-type(odd) .sec-mainarea-num {
    left: 0;
  }
}

.sec:nth-of-type(odd) .sec-mainarea-img__gray {
  right: 0;
}

.sec:nth-of-type(odd) .sec-mainarea-img__color {
  margin-right: auto;
}

@media screen and (min-width: 768px) {
  .sec:nth-of-type(even) .sec-mainarea-num {
    right: max(-1.9230769231vw, -20px);
  }
}

@media screen and (max-width: 767px) {
  .sec:nth-of-type(even) .sec-mainarea-num {
    right: 5.3333333333vw;
  }
}

.sec:nth-of-type(even) .sec-mainarea-img__gray {
  left: 0;
}

.sec:nth-of-type(even) .sec-mainarea-img__color {
  margin-left: auto;
}

/* .sec-mainarea
===================================================== */
.sec-mainarea {
  position: relative;
}

@media screen and (min-width: 768px) {
  .sec-mainarea {
    margin-bottom: min(7.2083879423vw, 55px);
    width: 480px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media screen and (max-width: 767px) {
  .sec-mainarea {
    margin-bottom: 5.6vw;
  }
}

.sec-mainarea-num {
  font-family: magneta, serif;
  font-weight: 200;
  font-style: italic;
  line-height: 1;
  color: rgba(117, 118, 115, 0.59);
  position: absolute;
  z-index: 1;
  letter-spacing: 0;
}

@media screen and (min-width: 768px) {
  .sec-mainarea-num {
    font-size: min(19.9213630406vw, 152px);
    top: max(-10.8653846154vw, -113px);
  }
}

@media screen and (max-width: 767px) {
  .sec-mainarea-num {
    font-size: 35.8666666667vw;
    top: -26.6666666667vw;
  }
}

.sec-mainarea-brand {
  position: absolute;
  z-index: 4;
  font-family: cardo, serif;
  font-weight: 400;
  font-style: italic;
  letter-spacing: -0.038em;
}

.sec-mainarea-kana {
  font-family: cardo, serif;
  font-weight: 400;
  font-style: normal;
  position: absolute;
  z-index: 4;
  letter-spacing: 0.05em;
}

@media screen and (min-width: 768px) {
  .sec-mainarea-kana {
    font-size: min(1.7038007864vw, 13px);
  }
}

@media screen and (max-width: 767px) {
  .sec-mainarea-kana {
    font-size: 2.9333333333vw;
  }
}

.sec-mainarea-link {
  display: block;
}

.sec-mainarea-link a:hover img {
  opacity: 0.22;
}

@media screen and (min-width: 768px) {
  .sec-mainarea-link:hover .sec-mainarea-img__color img {
    transform: scale(1.1) !important;
  }
}

@media screen and (min-width: 768px) {
  .sec-mainarea-link:hover:hover .sec-mainarea-credit__buy {
    background-color: #ECE7E0;
    color: #333;
  }
}

.sec-mainarea-img {
  position: relative;
  width: 100%;
}

@media screen and (min-width: 768px) {
  .sec-mainarea-img {
    margin-bottom: min(9.1743119266vw, 70px);
  }
}

@media screen and (max-width: 767px) {
  .sec-mainarea-img {
    margin-bottom: 16.1333333333vw;
  }
}

.sec-mainarea-img__gray {
  position: absolute;
  z-index: 1;
}

@media screen and (min-width: 768px) {
  .sec-mainarea-img__gray {
    width: min(53.4731323722vw, 408px);
    bottom: max(-5.5769230769vw, -58px);
  }
}

@media screen and (max-width: 767px) {
  .sec-mainarea-img__gray {
    width: 84.8vw;
    bottom: -12.2666666667vw;
  }
}

.sec-mainarea-img__gray img {
  filter: grayscale(100%);
  opacity: 0.22 !important;
}

.sec-mainarea-img__color {
  z-index: 2;
  position: relative;
  overflow: hidden;
}

@media screen and (min-width: 768px) {
  .sec-mainarea-img__color {
    width: min(53.4731323722vw, 408px);
  }
}

@media screen and (max-width: 767px) {
  .sec-mainarea-img__color {
    width: 84.8vw;
  }
}

@media screen and (min-width: 768px) {
  .sec-mainarea-img__color img {
    transition: transform 0.7s;
  }
}

.sec-mainarea-credit {
  text-align: right;
}

@media screen and (min-width: 768px) {
  .sec-mainarea-credit {
    display: flex;
    justify-content: flex-end;
  }
}

@media screen and (max-width: 767px) {
  .sec-mainarea-credit {
    margin-right: 5.3333333333vw;
  }
}

.sec-mainarea-credit__item {
  font-family: cardo, serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.05em;
  color: #333;
}

@media screen and (min-width: 768px) {
  .sec-mainarea-credit__item {
    font-size: min(1.5727391874vw, 12px);
  }
}

@media screen and (max-width: 767px) {
  .sec-mainarea-credit__item {
    font-size: 2.8vw;
    margin-bottom: 1.0666666667vw;
  }
}

.sec-mainarea-credit__price {
  display: inline-block;
}

@media screen and (min-width: 768px) {
  .sec-mainarea-credit__price {
    margin-left: min(1.5727391874vw, 12px);
  }
}

@media screen and (max-width: 767px) {
  .sec-mainarea-credit__price {
    margin-left: 2.6666666667vw;
  }
}

.sec-mainarea-credit__buy {
  text-transform: uppercase;
  border: 1px solid #00040d;
  text-align: center;
  margin-left: auto;
  font-family: cardo, serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.064em;
  transition: all 0.7s;
}

@media screen and (min-width: 768px) {
  .sec-mainarea-credit__buy {
    width: min(7.2083879423vw, 55px);
    line-height: min(2.3591087811vw, 18px);
    font-size: min(1.3106159895vw, 10px);
    margin-left: min(1.5727391874vw, 12px);
  }
}

@media screen and (max-width: 767px) {
  .sec-mainarea-credit__buy {
    width: 14vw;
    line-height: 4.4vw;
    font-size: 2.6666666667vw;
  }
}

.sec-staffarea-come__text {
  font-size: 12px;
}

/* .sec-staffarea
===================================================== */
.sec-staffarea {
  font-family: cardo, serif;
  font-weight: 400;
  font-style: normal;
}

@media screen and (min-width: 768px) {
  .sec-staffarea {
    width: min(62.9095674967vw, 480px);
    margin-left: auto;
    margin-right: auto;
    margin-bottom: min(13.7614678899vw, 80px);
  }
}

@media screen and (max-width: 767px) {
  .sec-staffarea {
    margin-bottom: 17.4666666667vw;
  }
}

.sec-staffarea-catch {
  display: grid;
  place-items: center;
  letter-spacing: 0.062em;
}

@media screen and (min-width: 768px) {
  .sec-staffarea-catch {
    font-size: min(2.621231979vw, 20px);
    line-height: 1.8;
    margin-left: min(7.8636959371vw, 60px);
    margin-bottom: min(3.2765399738vw, 25px);
    padding-bottom: 10px;
  }
}

@media screen and (max-width: 767px) {
  .sec-staffarea-catch {
    font-size: 4.5333333333vw;
    line-height: 1.8235294118;
    margin-left: 13.3333333333vw;
    margin-bottom: 7.2vw;
  }
}

.sec-staffarea-come {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  letter-spacing: 0.097em;
  text-align: justify;
  word-break: break-all;
}

@media screen and (min-width: 768px) {
  .sec-staffarea-come {
    font-size: min(1.6382699869vw, 12.5px);
    line-height: 2.3;
    width: min(40.498034076vw, 365px);
    margin-bottom: min(11.7955439056vw, 90px);
  }
}

@media screen and (max-width: 767px) {
  .sec-staffarea-come {
    font-size: 3.0666666667vw;
    width: 61.0666666667vw;
    line-height: 2.2;
    margin-bottom: 20vw;
  }
}

.sec-staffarea-come__kakko {
  content: "";
  display: block;
  position: absolute;
}

@media screen and (min-width: 768px) {
  .sec-staffarea-come__kakko--right {
    width: min(3.0144167759vw, 23px);
    top: max(-3.3653846154vw, -35px);
    right: max(-4.8076923077vw, -50px);
  }
}

@media screen and (max-width: 767px) {
  .sec-staffarea-come__kakko--right {
    width: 5.0666666667vw;
    top: -9.3333333333vw;
    right: -10vw;
  }
}

@media screen and (min-width: 768px) {
  .sec-staffarea-come__kakko--left {
    width: min(19.003931848vw, 145px);
    bottom: max(-5.4807692308vw, -57px);
    left: max(-3.8461538462vw, -40px);
  }
}

@media screen and (max-width: 767px) {
  .sec-staffarea-come__kakko--left {
    width: 32.2666666667vw;
    bottom: -13.3333333333vw;
    left: -9.3333333333vw;
  }
}

.sec-staffarea-staff {
  display: flex;
  align-items: center;
}

@media screen and (min-width: 768px) {
  .sec-staffarea-staff {
    margin-left: min(9.1743119266vw, 70px);
  }
}

@media screen and (max-width: 767px) {
  .sec-staffarea-staff {
    margin-left: 14.4vw;
  }
}

@media screen and (min-width: 768px) {
  .sec-staffarea-staff__icon {
    width: min(11.7955439056vw, 90px);
    margin-right: min(3.0144167759vw, 23px);
    justify-content: center;
  }
}

@media screen and (max-width: 767px) {
  .sec-staffarea-staff__icon {
    width: 22.4vw;
    margin-right: 6.1333333333vw;
  }
}

.sec-staffarea-staff__data span {
  display: block;
}

.sec-staffarea-staff__aff {
  font-family: cardo, serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0;
}

@media screen and (min-width: 768px) {
  .sec-staffarea-staff__aff {
    font-size: min(1.3106159895vw, 10px);
    margin-bottom: min(0.7863695937vw, 6px);
  }
}

@media screen and (max-width: 767px) {
  .sec-staffarea-staff__aff {
    font-size: 2.9333333333vw;
    margin-bottom: 0.8vw;
  }
}

.sec-staffarea-staff__name {
  font-family: cardo, serif;
  font-weight: 400;
  font-style: normal;
  display: flex;
  align-items: center;
  letter-spacing: 0;
}

@media screen and (min-width: 768px) {
  .sec-staffarea-staff__name {
    font-size: min(2.0969855832vw, 16px);
  }
}

@media screen and (max-width: 767px) {
  .sec-staffarea-staff__name {
    font-size: 4vw;
  }
}

@media screen and (min-width: 768px) {
  .sec-staffarea-staff__inst {
    width: min(1.5727391874vw, 12px);
    margin-left: min(1.3106159895vw, 10px);
  }
}

@media screen and (max-width: 767px) {
  .sec-staffarea-staff__inst {
    width: 3.0666666667vw;
    margin-left: 3.3333333333vw;
  }
}

.sec-staffarea-staff__stasta {
  font-family: cardo, serif;
  font-weight: 400;
  font-style: normal;
  text-decoration: underline;
  letter-spacing: 0;
}

@media screen and (min-width: 768px) {
  .sec-staffarea-staff__stasta {
    font-size: min(1.3106159895vw, 10px);
  }
}

@media screen and (max-width: 767px) {
  .sec-staffarea-staff__stasta {
    font-size: 2.4vw;
  }
}

/* .sec-styling
===================================================== */
.sec-styling {
  color: #333 !important;
}

@media screen and (min-width: 768px) {
  .sec-styling {
    padding: 0 20px 75px;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 11px;
    overflow: hidden;
  }
}

@media screen and (max-width: 767px) {
  .sec-styling {
    padding-top: 21.0666666667vw;
    padding-bottom: 26.6666666667vw;
  }
}

.sec-styling .sec-styling__inner {
  position: relative;
}

@media screen and (min-width: 768px) {
  .sec-styling .sec-styling__inner {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .sec-styling .sec-styling__inner {
    padding: 0 10.5333333333vw;
  }
}

.sec-styling-img {
  width: 100%;
}

@media screen and (min-width: 768px) {
  .sec-styling-img {
    margin-bottom: min(3.9318479685vw, 30px);
    width: min(53.4731323722vw, 520px);
    margin-left: auto;
    margin-right: auto;
  }
}

@media screen and (max-width: 767px) {
  .sec-styling-img {
    margin-bottom: 5.3333333333vw;
  }
}

.sec-styling-credit {
  display: flex;
  font-family: cardo, serif;
  font-weight: 700;
  font-style: normal;
}

@media screen and (min-width: 768px) {
  .sec-styling-credit {
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: max(1.9230769231vw, 20px);
    /*  width: 100%; */
    margin-left: auto;
    margin-right: auto;
  }
}

@media screen and (max-width: 767px) {
  .sec-styling-credit {
    flex-direction: column;
    margin-top: -4vw;
  }
}

@media screen and (min-width: 768px) {
  .sec-styling-credit__item {
    margin-top: min(2.621231979vw, 20px);
    width: calc((100% - min(10.4849279161vw, 80px)) / 2);
    list-style: none !important;
  }
}

@media screen and (max-width: 767px) {
  .sec-styling-credit__item {
    margin-top: 4vw;
    width: 100%;
    list-style: none !important;
  }
}

.sec-styling-credit__link {
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: flex-start;
}

@media screen and (min-width: 768px) {
  .sec-styling-credit__link:hover .sec-styling-credit__buy:not(.sec-styling-credit__buy--coming) {
    background-color: #2C2C2C;
    color: #dbd8d3;
  }
}

.sec-styling-credit__img {
  flex-shrink: 0;
}

@media screen and (min-width: 768px) {
  .sec-styling-credit__img {
    width: min(7.6015727392vw, 58px);
  }
}

@media screen and (max-width: 767px) {
  .sec-styling-credit__img {
    width: 13.0666666667vw;
  }
}

.sec-styling-credit__date {
  width: 100%;
  margin-right: auto;
  letter-spacing: 0;
  color: #333;
}

@media screen and (min-width: 768px) {
  .sec-styling-credit__date {
    padding: 0 min(2.4901703801vw, 19px);
    font-size: min(1.4416775885vw, 11px);
    color: #333;
  }
}

@media screen and (max-width: 767px) {
  .sec-styling-credit__date {
    padding: 0 3.7333333333vw;
    font-size: 2.6666666667vw;
    color: #333;
  }
}

.sec-styling-credit__date:has(.sec-styling-credit__sale) .sec-styling-credit__line {
  text-decoration: line-through;
}

.sec-styling-credit__date:has(.sec-styling-credit__sale) .sec-styling-credit__sale {
  text-transform: uppercase;
  margin-left: 5px;
  color: #950909;
}

.sec-styling-credit__buy {
  flex-shrink: 0;
  background-color: #dbd8d3;
  color: #2C2C2C;
  text-transform: uppercase;
  text-align: center;
  transition: all 0.7s;
}

@media screen and (min-width: 768px) {
  .sec-styling-credit__buy {
    width: min(7.3394495413vw, 56px);
    font-size: min(1.3106159895vw, 10px);
    line-height: min(2.621231979vw, 20px);
    letter-spacing: 0.019em;
  }
}

@media screen and (max-width: 767px) {
  .sec-styling-credit__buy {
    width: 13.0666666667vw;
    font-size: 2.4vw;
    line-height: 4.9333333333vw;
    letter-spacing: 0.064em;
  }
}

.sec-styling-credit__buy--coming {
  background-color: transparent;
  border: 1px solid #00040d;
}

@media screen and (min-width: 768px) {
  .sec-styling-credit__buy--coming {
    width: min(15.0720838794vw, 115px);
  }
}

@media screen and (max-width: 767px) {
  .sec-styling-credit__buy--coming {
    width: 28vw;
  }
}

@media screen and (min-width: 768px) {

  .sec-styling-credit__date,
  .sec-styling-credit__buy {
    margin-top: min(0.9174311927vw, 7px);
  }
}

@media screen and (max-width: 767px) {

  .sec-styling-credit__date,
  .sec-styling-credit__buy {
    margin-top: 1.3333333333vw;
  }
}

.sec-styling-subcredit {
  font-family: cardo, serif;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 0;
}

@media screen and (min-width: 768px) {
  .sec-styling-subcredit {
    font-size: min(1.1795543906vw, 9px);
    margin-top: min(3.2765399738vw, 25px);
    width: min(100vw, 763px);
    margin-left: auto;
    margin-right: auto;
  }
}

@media screen and (max-width: 767px) {
  .sec-styling-subcredit {
    font-size: 2.4vw;
    margin-top: 4.5333333333vw;
  }
}

/* .sec-brandbtn
===================================================== */
.sec-brandbtn__link {
  display: block;
  font-family: cardo, serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0;
  text-align: center;
  border: 1px solid #00040d;
  background-color: #dbd8d3;
  color: #00040d;
  margin-left: auto;
  margin-right: auto;
  transform: translateY(-50%);
  transition: all 0.7s;
}

@media screen and (min-width: 768px) {
  .sec-brandbtn__link {
    font-size: min(1.7038007864vw, 13px);
    width: min(51.24508519vw, 391px);
    line-height: min(8.125819135vw, 62px);
  }
}

@media screen and (max-width: 767px) {
  .sec-brandbtn__link {
    font-size: 4vw;
    width: 80.4vw;
    line-height: 17.8666666667vw;
  }
}

@media screen and (min-width: 768px) {
  .sec-brandbtn__link:hover {
    background-color: #00040d;
    color: #dbd8d3;
  }
}

/* #sec--1
===================================================== */
#sec--1 .sec-mainarea-brand {
  bottom: 92%;
  right: 1%;
}

@media screen and (min-width: 768px) {
  #sec--1 .sec-mainarea-brand {
    font-size: min(5.1114023591vw, 50px);
  }
}

@media screen and (max-width: 767px) {
  #sec--1 .sec-mainarea-brand {
    font-size: 8.8vw;
  }
}

#sec--1 .sec-mainarea-kana {
  bottom: 91%;
  right: 3%;
}

/* #sec--2
===================================================== */
#sec--2 .sec-mainarea-brand {
  bottom: 92%;
  left: 0;
}
@media screen and (min-width: 768px) {
#sec--2 .sec-mainarea-brand {
    font-size: min(8.7811271298vw, 50px);
}
}
@media screen and (max-width: 767px) {
#sec--2 .sec-mainarea-brand {
    font-size: 12.5333333333vw;
}
}

#sec--2 .sec-mainarea-kana {
  bottom: 91%;
  left: 3%;
}

/* #sec--3
===================================================== */
#sec--3 .sec-mainarea-brand {
  bottom: 96%;
  right: 1%;
}

@media screen and (min-width: 768px) {
  #sec--3 .sec-mainarea-brand {
    font-size: min(5.1114023591vw, 50px);
  }
}

@media screen and (max-width: 767px) {
  #sec--3 .sec-mainarea-brand {
    font-size: 8.8vw;
  }
}

#sec--3 .sec-mainarea-kana {
  bottom: 95%;
  right: 3%;
}

/* スタイリングエリア
===================================================== */
.codeitem {
  background-color: #f9f9f9;
  margin: 0 0 20px;
  padding: 20px 0px 0px 10px;
  width: 100%;
  box-sizing: border-box;
  display: inline-block;
}
.codeitem h2 {
  font-size: 116%;
  font-weight: bold;
  margin: 0 0 15px 10px;
}

.codeitem section {
  margin: 0px 13px;
  _margin: 0 14px;
  width: 122px;
  display: inline;
  float: left;
  height: 335px;
}

.codeitem section figure a img {
  border: 0;
  /*border:#d4d3d2 1px solid;*/
  padding: 1px;
}

.codeitem section figure a img:hover {
  border: 0;
  /*border:#d4d3d2 1px solid;*/
}

.codeitem section figure a:hover {
  color: #333;
}

.codeitem section figure figcaption {
  line-height: 1.3;
  margin-top: 2px;
}

.codeitem section figure figcaption div {
  color: #999;
  font-weight: bold;
}
.codeitem section figure figcaption p.name {
  line-height: 1.3;
  font-size: 10px;
  margin-bottom: 0px;
}

.codeitem section figure figcaption p.name {
  color: #333;
}

.codeitem section figure figcaption p.kakaku {
  color: #333;
  font-weight: bold;
  margin-top: 5px;
}
.codeitem section figure figcaption p.kakaku.sale {
  color: #c50000;
}

.codeitem section figure figcaption p a {
  line-height: 1.5;
  font-size: 12px;
  color: #333;
}

.codeitem section figure figcaption p img {
  margin-right: 1px;
  border: 0;
  padding: 0;
}

.codeitem section figure figcaption p img a {
  border: 0;
  padding: 0;
}
.codeitem section figure figcaption p img:hover {
  margin-right: 1px;
  border: 0;
  padding: 0;
}

.codeitem section figure figcaption .wt_hide {
  visibility: hidden;
}
.codeitem section figure figcaption .wt_hide IMG {
  visibility: visible;
}

.codeitem_02 {
  background-color: #f9f9f9;
  margin: 0 0 20px;
  padding: 20px 0px 0px 10px;
  width: 100%;
  box-sizing: border-box;
  display: inline-block;
}
.codeitem_02 .coordinate-content {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  justify-content: center;
}
.codeitem_02 h2 {
  font-size: 116%;
  font-weight: bold;
  margin: 0 0 15px 10px;
}

.codeitem_02 section {
  margin: 0px 13px;
  display: inline;
  height: 240px;
}

.codeitem_02 section:nth-child(n+5) {
  justify-self: start;
}

.codeitem_02 section figure a img {
  border: 0;
  /*border:#d4d3d2 1px solid;*/
  padding: 1px;
}

.codeitem_02 section figure a img:hover {
  border: 0;
  /*border:#d4d3d2 1px solid;*/
}

.codeitem_02 section figure a:hover {
  color: #333;
}

.codeitem_02 section figure figcaption {
  line-height: 1.3;
  margin-top: 2px;
}

.codeitem_02 section figure figcaption div {
  color: #999;
  font-weight: bold;
}
.codeitem_02 section figure figcaption p.name {
  line-height: 1.3;
  font-size: 10px;
  margin-bottom: 0px;
}

.codeitem_02 section figure figcaption p.name {
  color: #333;
}

.codeitem_02 section figure figcaption p.kakaku {
  color: #333;
  font-weight: bold;
  margin-top: 5px;
}
.codeitem_02 section figure figcaption p.kakaku.sale {
  color: #c50000;
}

.codeitem_02 section figure figcaption p a {
  line-height: 1.5;
  font-size: 12px;
  color: #333;
}

.codeitem_02 section figure figcaption p img {
  margin-right: 1px;
  border: 0;
  padding: 0;
}

.codeitem_02 section figure figcaption p img a {
  border: 0;
  padding: 0;
}
.codeitem_02 section figure figcaption p img:hover {
  margin-right: 1px;
  border: 0;
  padding: 0;
}

.codeitem_02 section figure figcaption .wt_hide {
  visibility: hidden;
}
.codeitem_02 section figure figcaption .wt_hide IMG {
  visibility: visible;
}

.othColorContainer1 {
  width: 126px;
  overflow: hidden;
  height: auto;
}
.othColorContainer1 .other_color {
  height: 42px;
}
.othColorContainer1 .other_color {
  height: 42px;
}
.othColorContainer1 .other_color {
  display: inline;
  margin-right: 2px;
  width: 36px;
  text-decoration: none;
  border: 1px solid #d4d3d2;
  padding: 1px;
  height: auto;
}

@media screen and (min-width: 481px) {
  .kikaku .codeitem section img.itemimg {
    width: 122px;
  }
}

.center {
  text-align: center;
}

.codeitem_02 {
  background: #FFF;
}