﻿@charset "UTF-8";
#cntsSct {
  padding-top: min(33.5vw, 192.8px);
  /* min-height: 100svh; */
}
@media screen and (min-width: 768px) {
  #cntsSct {
    padding-top: min(23.5vw, 206px);
  }
}
@media screen and (min-width: 961px) {
  #cntsSct {
    padding-top: min(18.49vw, 240px);
  }
}
/* ==================================================
mainSct
================================================== */
@media screen and (min-width: 768px) {
  #mainSct {
    width: 90%;
    margin: 0 auto;
  }
}

.enFont {
  font-family: "Shadows Into Light Two", cursive;
}

/* ==================================================
商品一覧
================================================== */
.prdArea {
  width: 95%;
  display: flex;
  flex-flow: wrap;
  justify-content: center;
  margin: 0 auto 8rem;
}
.prdArea .imgSet {
  transition: 0.4s all ease-in-out;
  width: 50%;
}
.prdArea .imgSet + .imgSet {
}
.prdArea .imgSet .imgObj {
  cursor: pointer;
  overflow: hidden;
  position: relative;
}
.prdArea .imgSet .imgObj img {
  transition: all 0.3s ease;
}
.prdArea .imgSet .imgObj:hover img {
  transform: scale(1.01);
  transition: all 0.3s ease;
}
.prdArea .imgSet .txtGlp {
  display: none;
}
.prdArea .imgSet .txtGlp .prdName {
  width: 100%;
  font-weight: 600;
  line-height: 1;
  margin: 0 0 0.5em;
}
.prdArea .imgSet .txtGlp .prdSpec {
  margin: 0 0.5em 0 0;
}
.prdArea .imgSet .txtGlp .prdYear {
}
.prdArea .imgSet .txtGlp .prdPrice {
  width: 100%;
  line-height: 1;
}
.prdArea .imgSet .txtGlp .prdComment {
  display: none;
}

.prdArea .imgSet .imgObj.sold,
.prdArea .imgSet .imgObj.reserved,
.prdArea .imgSet .imgObj.reserve {
}
.prdArea .imgSet .imgObj.sold::before,
.prdArea .imgSet .imgObj.reserved::before,
.prdArea .imgSet .imgObj.reserve::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(217, 217, 217, 0.7);
  z-index: 1;
}
.prdArea .imgSet .imgObj.sold::after,
.prdArea .imgSet .imgObj.reserved::after,
.prdArea .imgSet .imgObj.reserve::after {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  font-family: "Shadows Into Light Two", cursive;
  font-weight: 400;
  font-style: normal;
  -webkit-text-stroke-width: 0.12em;
  letter-spacing: 0.1em;
  font-size: 2.2rem;
  z-index: 2;
}

.prdArea .imgSet .imgObj.sold::after {
  content: "SOLD";
  color: rgba(206, 11, 11, 1);
}
.prdArea .imgSet .imgObj.reserved::after,
.prdArea .imgSet .imgObj.reserve::after {
  content: "RESERVED";
  color: rgba(215, 96, 203, 0.97);
}

.backBtn {
  width: 100%;
}
.backBtn a {
  text-align: center;
  color: #fff;
  text-decoration: none;
  border: 2px solid;
  padding: 0.4em 1em;
  width: 100%;
  border-radius: 100px;
  max-width: 320px;
}

@media screen and (min-width: 768px) {
  .prdArea {
  }
  .prdArea .imgSet {
    width: 30%;
    margin: 0 1.5% 3%;
  }
  .prdArea .imgSet + .imgSet {
    margin: 0 0.5% 3%;
  }
  .prdArea .imgSet .imgObj {
  }
  .prdArea .imgSet .txtGlp {
  }
  .prdArea .imgSet .txtGlp .prdName {
  }
  .prdArea .imgSet .txtGlp .prdSpec {
  }
  .prdArea .imgSet .txtGlp .prdName {
  }
  .prdArea .imgSet .txtGlp .prdPrice {
  }
  .prdArea .backBtn {
  }
  .prdArea .backBtn a {
    font-size: 16px;
  }
  .prdArea .imgSet .imgObj.sold::after,
  .prdArea .imgSet .imgObj.reserved::after {
    font-size: 1.6rem;
  }
}
@media screen and (min-width: 961px) {
  .prdArea {
    max-width: 1240px;
  }
  .prdArea .imgSet {
    width: calc(100% / 4 - 1%);
    /* aspect-ratio: 1; */
    margin: 0 0.5% 1%;
    /* background: #fff; */
    overflow: hidden;
    /* display: flex; */
    /* align-items: center; */
  }
  .prdArea .imgSet + .imgSet {
  }
  .prdArea .imgSet .imgObj {
  }
  .prdArea .imgSet .txtGlp {
  }
  .prdArea .imgSet .txtGlp .prdName {
  }
  .prdArea .imgSet .txtGlp .prdSpec {
  }
  .prdArea .imgSet .txtGlp .prdName {
  }
  .prdArea .imgSet .txtGlp .prdPrice {
  }
  .backBtn {
  }
  .backBtn a {
  }
  .backBtn a:hover {
    opacity: 1;
    background: #fff;
    color: #000;
  }
  .prdArea .imgSet .imgObj.sold::after,
  .prdArea .imgSet .imgObj.reserved::after,
  .prdArea .imgSet .imgObj.reserve::after {
    font-size: 1.4rem;
  }
}
/* ==================================================
モーダル
================================================== */
#modal {
}
#modal .modal__overlay {
}
#modal .modal__content {
}
#modal .imgSet {
}
#modal .imgSet .imgObj {
  overflow: hidden;
}
#modal .imgSet .imgObj img {
  /* max-height: 100%; */ /* object-fit: contain; */
}
#modal .imgSet .txtGlp {
  margin: 10% auto 0 8%;
  text-align: left;
}
#modal .imgSet .txtGlp .prdName {
}
#modal .imgSet .txtGlp .prdSpec {
  margin: 1em 0 0;
}
#modal .imgSet .txtGlp .prdName {
  font-weight: 600;
}
#modal .imgSet .txtGlp .prdPrice {
}

#modal .imgSet .imgObj.sold,
#modal .imgSet .imgObj.reserved {
}

#modal .imgSet .imgObj.sold::after,
#modal .imgSet .imgObj.reserved::after,
#modal .imgSet .imgObj.reserve::after {
  position: absolute;
  left: 0;
  top: 0;
  font-family: "Shadows Into Light Two", cursive;
  font-weight: 400;
  font-style: normal;
  -webkit-text-stroke-width: 0.12em;
  letter-spacing: 0.1em;
  font-size: 1.6rem;
  color: #fff;
  padding: 0.5em 0.8em;
}

#modal .imgSet .imgObj.sold::after {
  content: "SOLD";
  background: rgba(206, 11, 11, 1);
}
#modal .imgSet .imgObj.reserved::after,
#modal .imgSet .imgObj.reserve::after {
  content: "RESERVED";
  background: rgba(215, 96, 203, 0.97);
}

#modal .contactBlk {
  position: absolute;
  top: 60%;
  right: 5%;
  z-index: 10;
}

#modal .contactBlk a {
  text-decoration: none;
  color: #fff;
  background: #000;
  padding: 0.85em 1.5em;
  border-radius: 100px;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  #modal {
  }
  #modal .modal__overlay {
  }
  #modal .modal__content {
    margin: auto;
    width: 90%;
  }
  #modal .imgSet {
    display: flex;
    flex-flow: wrap;
    align-items: center;
  }
  #modal .imgSet .imgObj {
    width: 65%;
    height: auto;
  }
  #modal .imgSet .txtGlp {
    width: 30%;
    margin: auto auto auto 0;
    padding: 0 3% 0 3%;
  }
  #modal .imgSet .txtGlp .prdName {
  }
  #modal .imgSet .txtGlp .prdSpec {
  }
  #modal .imgSet .txtGlp .prdName {
  }
  #modal .imgSet .txtGlp .prdPrice {
  }
  #modal .contactBlk {
    right: 0;
    width: 32%;
    display: flex;
    bottom: 18%;
    top: auto;
  }
  #modal .imgSet .imgObj.sold::after,
  #modal .imgSet .imgObj.reserved::after,
  #modal .imgSet .imgObj.reserve::after {
    font-size: 1.3rem;
  }
}
@media screen and (min-width: 961px) {
  #modal {
  }
  #modal .modal__overlay {
  }
  #modal .modal__content {
  }
  #modal .imgSet {
  }
  #modal .imgSet .imgObj {
  }
  #modal .imgSet .txtGlp {
  }
  #modal .imgSet .txtGlp .prdName {
  }
  #modal .imgSet .txtGlp .prdSpec {
  }
  #modal .imgSet .txtGlp .prdName {
  }
  #modal .imgSet .txtGlp .prdPrice {
  }
  #modal .contactBlk {
  }
  #modal .imgSet .imgObj.sold::after,
  #modal .imgSet .imgObj.reserved::after,
  #modal .imgSet .imgObj.reserve::after {
    font-size: 19px;
  }
}
/* ==================================================
pricelist
================================================== */

#formContainer {
  margin: 10% auto 30%;
}
#formContainer .imgObj {
  width: 53%;
  margin: 0 auto 15%;
}
#formContainer .errorTxt {
  color: rgba(206, 11, 11, 1);
  font-weight: 500;
  margin: 0 0 0.51em;
}

#passwordForm {
  width: 60%;
  margin: 0 auto;
}

#passwordForm input {
  background: none;
  border: 2px solid #fff;
  padding: 0.5em;
  border-radius: 6px;
  width: 100%;
  text-align: center;
  color: #fff;
  letter-spacing: 0.25em;
  line-height: 1;
  display: block;
  position: relative;
}
#passwordForm input::placeholder {
  color: #3f3f3f;
}
#passwordForm.errorEf {
}
#passwordForm.errorEf input {
  border: 1px solid rgba(206, 11, 11, 1);
}
#passwordForm button {
  background: none;
  border: none;
  width: 100%;
  padding: 0;
  margin: 10% auto 0;
}
#passwordForm button:selection {
  background: none;
}
@media screen and (min-width: 768px) {
  #formContainer {
    width: 60%;
    margin: 5% auto;
  }
  #formContainer .imgObj {
  }
  #formContainer .errorTxt {
  }

  #passwordForm {
  }
  #passwordForm input {
  }
  #passwordForm button {
  }
}
@media screen and (min-width: 961px) {
  #formContainer {
    width: 40%;
    max-width: 450px;
  }
  #formContainer .imgObj {
  }
  #formContainer .errorTxt {
  }

  #passwordForm {
  }
  #passwordForm input {
  }
  #passwordForm button {
  }
}

@keyframes moveB {
  0% {
    transform: translateX(0);
  }
  7% {
    transform: translateX(-5px);
  }
  14% {
    transform: translateX(5px);
  }
  20% {
    transform: translateX(-5px);
  }
  32% {
    transform: translateX(5px);
  }
  40% {
    transform: translateX(0px);
  }
}

/* フラッシュアニメーションを適用するクラス */
.moveB {
  animation: moveB 1.2s linear;
}

.idxcloseBtn {
  order: 1;
  position: relative;
  pointer-events: auto;
  z-index: 1000;
  cursor: pointer;
}
.idxcloseBtn a {
}
