@charset "utf-8";

.s-hitokoto {
  font-size:0.77em;
  display:inline-block;
  color:#fff;
  background-color:rgba(0,0,0,0.8);
  line-height:1.4;
  padding:0.25em 0.5em;
}

.s-souryou,
.s-cool {
  font-size:0.88em;
  display:inline-block;
  line-height:1.4;
  padding:0.25em 0.5em;
  border-width:1px;
  border-style:solid;
  margin-right:0.5em;
}

.s-souryou .p-icon { margin-right:0.75rem; }
.s-cool .p-icon { margin-right:0.25rem; }

.s-souryou { color:#00af96; border-color:#00af96; }
.s-cool { color:#23a5d7; border-color:#23a5d7; }

.s-rprice { color:#848993; font-size:0.7em; display:inline-block; }
.s-rprice-line { text-decoration:line-through; margin-left:0.25em; }


/*----------------------------------------------------------------------------------------------------

  一覧
  
----------------------------------------------------------------------------------------------------*/

.list {
  text-align:left;
}

@media print,screen and (min-width:641px) {
  .sec-list {
    padding-bottom:100px;
  }

  .list {
    width:100%;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
  }
}

@media screen and (max-width:640px) {
  .sec-list {
    padding-bottom:2.5em;
  }
}

/*--------------------------------------------------------------------------------
  メイン
--------------------------------------------------------------------------------*/

@media print,screen and (min-width:641px) {
  .list__main {
    -webkit-box-flex:1;
    -ms-flex:1;
    flex:1;
    padding-left:5%;
    padding-top:70px;
  }
}

.list-sort {
  list-style:none;
  text-align:left;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  line-height:1;
  padding-top:0.5em;
  font-size:0.95em;
}

.list-sort a,
.list-sort a:visited,
.list-sort a:hover { text-decoration:none; }
.list-sort li.is-active a,
.list-sort li.is-active a:visited,
.list-sort li.is-active a:hover { color:inherit; }

.list-sort li {
  padding-top:1em;
  padding-right:1em;
}

.list-sort a {
  display:block;
  position:relative;
  padding-right:1em;
}

.list-sort li:not(:last-child) a:before {
  content:"";
  width:1px;
  height:0.8em;
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%);
  background-color:rgba(15,30,60,0.15);
}

.list-err {
  padding-top:1.25em;
}

.item-list {
  width:100%;
  list-style:none;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  -webkit-box-align:start;
  -ms-flex-align:start;
  align-items:flex-start;
}

.item-list li {
  line-height:1.6;
}

.item-list .photo {
  margin-bottom:0.75em;
  position:relative;
  background-color:#fff;
}

.item-list .photo img {
  width:100%;
  height:100%;
  object-fit:cover;
  font-family:'object-fit: cover;';
}

.item-list .photo .s-hitokoto {
  position:absolute;
  left:0;
  top:0;
}

.item-list .hinmei {
  display:block;
  padding-bottom:0.5em;
}

.item-list .comt {
  padding-bottom:0.5em;
}

.item-list dl.price {
  width:100%;
  line-height:1.4;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
}

.item-list dl.price:not(:first-of-type) {
  padding-top:0.25em;
}

.item-list .price dt {
  padding-right:0.5em;
  font-size:0.8em;
  padding-top:0.44em;
}

.item-list .price dd {
  -ms-flex-item-align:flex-end;
  align-self:flex-end;
}

.item-list .price dd .s-rprice {
  padding-top:0.6em;
}

@media print,screen and (min-width:641px) {
  .item {
    margin-left:-1.65%;
    margin-right:-1.65%;
    padding-bottom:60px;
    font-size:1.1em;
  }

  .item-list li {
    width:50%;
    padding-left:1.65%;
    padding-right:1.65%;
    margin-top:50px;
  }
  
  .item-list li:nth-child(n+3) {
    margin-top:80px;
  }
  
  .item-list .photo {
    height:-webkit-calc(340 / 1280 * 100vw);
    height:calc(340 / 1280 * 100vw);
    max-height:340px;
    min-height:270px;
  }
}

@media screen and (max-width:640px) {
  .item {
    margin-left:-0.75em;
    margin-right:-0.75em;
  }
  
  .list-sort li {
    padding-right:0.75em;
  }
  
  .list-sort a {
    padding-right:0.75em;
  }

  .item-list li {
    width:50%;
    padding-left:0.75em;
    padding-right:0.75em;
    margin-top:2.5em;
  }
  
  .item-list .photo {
    height:-webkit-calc(220 / 640 * 100vw);
    height:calc(220 / 640 * 100vw);
    max-height:220px;
    min-height:110px;
  }
}


/*--------------------------------------------------------------------------------
  カテゴリ・価格帯
--------------------------------------------------------------------------------*/

@media print,screen and (min-width:641px) {
  .list__side {
    width:260px;
  }

  .sideMenu {
    padding-top:60px;
  }
  
  .sideMenu:first-of-type {
    padding-top:80px;
  }
  
  .sideMenu-hdLine {
    padding-bottom:0.75em;
    border-bottom:1px solid rgba(10,20,40,0.8);
  }
}

@media screen and (max-width:640px) {
  .list__side {
    padding-top:2.5em;
    padding-bottom:2.5em;
  }

  .sideMenu-hdLine {
    cursor:pointer;
    background:rgba(231,224,206,0.7);
    padding:0.9em 0.75em 0.9em 0.9em;
    margin-bottom:1px;
    font-size:100%;
    position:relative;
    width:100%;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:justify;
    -ms-flex-pack:justify;
    justify-content:space-between;
  }
  
  .sideMenu.is-active .sideMenu-hdLine {
    margin-bottom:0;
  }
  
  .sideMenu-hdLine .icon {
    width:1em;
    height:1em;
    line-height:1;
    background:url(../../image/icon/plusC_brown.svg) no-repeat center center;
    background-size:cover;
    display:block;
    align-self:center;
    position:relative;
    transition:0.4s cubic-bezier(0.2, 0.6, 0.3, 1.1);
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    tap-highlight-color:rgba(0, 0, 0, 0);
  }
  
  .sideMenu.is-active .sideMenu-hdLine .icon {
    transform:rotate(45deg);
  }
}

.sideMenu-hdLine {
  line-height:1.4;
}

.list__side ul {
  list-style:none;
  line-height:1.4;
  font-size:0.95em;
}

.list__side li a {
  color:inherit;
  display:block;
  text-decoration:none;
}

.list__side li a,
.list__side li a:visited,
.list__side li a:hover { color:inherit; text-decoration:none; }
.list__side li.is-active > a,
.ua-pc .list__side li a:hover { color:#848993; text-decoration:none; }

.sideMenu-firstList > li {
  border-bottom:1px solid rgba(15,30,60,0.15);
}

.sideMenu-firstList > li > a {
  padding:0.75em 1.75em 0.75em 0;
  position:relative;
}

.sideMenu-firstList > li > a:before {
  content:"";
  width:0;
  height:0;
  border-style:solid;
  border-width:2px 0 2px 5px;
  border-color:transparent transparent transparent #0a1428;
  display:inline-block;
  position:absolute;
  top:50%;
  right:0.4em;
  transform:translateY(-50%);
}

.ua-pc .sideMenu-firstList > li > a:hover:before { right:0.2em; }
.ua-pc .sideMenu-firstList > li > a:before { transition:border-color 0.2s ease-out, right 0.3s cubic-bezier(.23, 1, .32, 1); }

.sideMenu-secondList {
  padding-bottom:1em;
}

.sideMenu-secondList > li > a {
  padding:0.25em 0 0.25em 2em;
  position:relative;
}

.sideMenu-secondList > li > a:before {
  content:"";
  width:0;
  height:0;
  border-style:solid;
  border-width:2px 0 2px 5px;
  border-color:transparent transparent transparent #0a1428;
  display:inline-block;
  position:absolute;
  top:0.85em;
  left:1.25em;
}

.ua-pc .sideMenu-secondList > li > a:hover { padding-left:2.2em; }
.ua-pc .sideMenu-secondList > li > a { transition:padding 0.3s cubic-bezier(.23, 1, .32, 1); }

@media print,screen and (min-width:641px) {
  .sideMenu-firstList {
    margin-top:0.5em;
  }
  
  .list__side ul {
    display:inherit;
  }
}

@media screen and (max-width:640px) {
  .sideMenu-firstList {
    display:none;
    background-color:#fff;
  }

  .sideMenu-firstList > li {
    border-bottom:1px solid rgba(15,30,60,0.08);
  }
  
  .sideMenu-firstList > li:last-child {
    border-bottom:0;
  }
  
  .sideMenu-firstList > li > a {
    padding-left:1em;
    padding-right:2.75em;
  }
  
  .sideMenu-firstList > li > a:before { right:1em; }
  .ua-pc .sideMenu-firstList > li > a:hover:before { right:0.8em; }
  
  .sideMenu-secondList > li > a {
    padding-left:3em;
    padding-right:1em;
  }
  
  .sideMenu-secondList > li > a:before { left:2.25em; }
  .ua-pc .sideMenu-secondList > li > a:hover { padding-left:3.2em; }
}


/*----------------------------------------------------------------------------------------------------

  詳細
  
----------------------------------------------------------------------------------------------------*/

@media print,screen and (min-width:641px) {
  .sec-detail {
    padding-top:80px;
    padding-bottom:100px;
  }
}

@media screen and (max-width:640px) {
  .sec-detail {
    padding-top:2.5em;
    padding-bottom:2.5em;
  }
}

.sec-detail {
  text-align:left;
}

.detail {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
}

.detail-photos {
  overflow:hidden;
}

.detail-photos ul {
  list-style:none;
}

.detail-photos .photos-slide { opacity:0; }
.detail-photos .photos-slide.slick-initialized { opacity:1; }

.detail-photos .photos-slide li img,
.detail-photos .photos-slide--thumb li img {
  width:100%;
  height:100%;
  object-fit:cover;
  font-family:'object-fit: cover;';
}

.detail-photos .photos-slide .cp {
  line-height:1.4;
  font-size:0.95em;
  padding-top:0.75em;
  padding-bottom:0.5em;
}

.detail-photos .photos-slide--noimg li {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  -webkit-box-pack:center;
  -ms-flex-pack:center;
  justify-content:center;
  background-color:#fff;
}

.detail-photos .photos-thumb {
  margin-left:-0.5em;
  margin-right:-0.5em;
}

.detail-photos .photos-thumb ul {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  padding-top:0.5em;
}

.detail-photos .photos-thumb li {
  width:-webkit-calc(100% / 3);
  width:calc(100% / 3);
  padding-top:1em;
  padding-left:0.5em;
  padding-right:0.5em;
}

.detail-photos .photos-thumb li img {
  cursor:pointer;
  width:100%;
  height:100%;
  object-fit:cover;
  font-family:'object-fit: cover;';
}

.detail-hinmei {
  padding-bottom:1.5em;
}

.detail .s-hitokoto {
  margin-bottom:1em;
  background-color:#000;
}

.detail-ct .comt {
  padding-bottom:2.5em;
}

.detail-ct .comt ul,
.detail-ct .comt ol {
  margin-left:1.2em;
}

.detail-ct .buy-guide {
  list-style:none;
  padding-top:1.5em;
}

.detail-ct .buy-guide li {
  padding-top:0.25em;
}

.detail-ct .buy-item {
  padding-top:1.5em;
}

.detail-ct .buy-item dl {
  background-color:#fff;
  border-top:1px solid rgba(10,20,40,0.8);
}

.detail-ct .buy-item dt {
  width:100%;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  padding:1em;
}

.detail-ct .buy-item .hinmei {
  -webkit-box-flex:1;
  -ms-flex-positive:1;
  flex-grow:1;
}

.detail-ct .buy-item .price {
  white-space:nowrap;
  text-align:right;
  -ms-flex-item-align:end;
	align-self:flex-end;
  padding-left:1em;
  line-height:1.2;
}

.detail-ct .buy-item dd {
  border-top:1px dotted rgba(10,20,40,0.3);
  padding-left:1em;
  padding-right:1em;
  padding-bottom:1em;
}

.detail-ct .buy-item dd form {
  width:100%;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
}

.detail-ct .buy-item dd .buy-item__select select {
  margin-top:1em;
}

.detail-ct .buy-item dd .buy-item__select select:not(:last-of-type) {
  margin-right:0.5em;
}

.detail-ct .buy-item dd .buy-item__select select:last-of-type {
  margin-right:1em;
}

.detail-ct .buy-item dd .buy-item__btn {
  padding-top:1em;
  -webkit-box-flex:1;
  -ms-flex:1;
  flex:1;
  white-space:nowrap;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
}

.detail-ct .buy-item dd .buy-item__btn .kosu {
  margin-right:1em;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
}

.detail-ct .buy-item dd .buy-item__btn .kosu input[type="text"] {
  width:3em;
  margin:0 0.25em;
}

.detail-ct .buy-item .cartin_kosu-changeBtn {
  width:1.75em;
  padding:0.3em;
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  border:none;
  margin:0;
  outline:none;
  text-align:center;
  text-decoration:none;
  cursor:pointer;
  line-height:1.2;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(15,30,60,0.25);
  background-color:#f3f3f4;
  transition:background-color ease-out  0.15s, border-color ease-out  0.15s;
}

.ua-pc .detail-ct .cartin_kosu-changeBtn:hover {
  background-color:#fff;
}

.detail-ct .buy-item .cartin_kosu-changeBtn[disabled] {
  background-color:#e6e7e9;
  border-color:#e6e7e9;
}

.detail-ct .buy-item .cartin_kosu-changeBtn .icon {
  display:inline-block;
  margin-bottom:-0.2em;
}

.detail-ct .buy-item .cartin_kosu-changeBtn .icon:before {
  content:"";
  width:0.6em;
  height:0.6em;
  display:inline-block;
  background-position:left center;
  background-repeat:no-repeat;
  background-size:contain;
  vertical-align:middle;
  margin-bottom:0.2em;
}

.detail-ct .buy-item .cartin_kosu-changeBtn .icon[icon="minus"]:before {
  background-image:url(../image/icon/minus.svg);
}

.detail-ct .buy-item .cartin_kosu-changeBtn .icon[icon="plus"]:before {
  background-image:url(../image/icon/plus.svg);
}

.detail-ct .buy-item .cartin_kosu-changeBtn[disabled] .icon[icon="minus"]:before {
  background-image:url(../image/icon/minus_white.svg);
}

.detail-ct .buy-item .cartin_kosu-changeBtn[disabled] .icon[icon="plus"]:before {
  background-image:url(../image/icon/plus_white.svg);
}

.detail-ct .buy-item dd .buy-item__btn .cartin {
  margin-left:auto;
}

.detail-ct .buy-item form input[type="text"],
.detail-ct .buy-item form select,
.detail-ct .buy-item form textarea {
  padding:0.3em;
  border:1px solid rgba(15,30,60,0.25);
  background-color:#fff;
  transition:background-color ease-out  0.15s, border-color ease-out  0.15s;
}

.ua-pc .detail-ct .buy-item form input[type="text"]:focus,
.ua-pc .detail-ct .buy-item form select[type="text"]:focus,
.ua-pc .detail-ct .buy-item form textarea[type="text"]:focus {
  border-color:rgba(15,30,60,0.8);
}

@media print,screen and (min-width:641px) {
  .detail-photos {
    width:50%;
  }
  
  .detail-photos .photos-slide li img,
  .detail-photos .photos-slide--thumb li img {
    max-height:500px;
  }
  
  .detail-photos .photos-thumb li {
    height:160px;
  }
  
  .detail-photos .photos-slide--noimg li {
    height:-webkit-calc(420 / 1180 * 100vw);
    height:calc(420 / 1180 * 100vw);
    max-height:420px;
    min-height:360px;
  }
  
  .detail-ct {
    margin-left:60px;
    width:50%;
  }
}

@media print,screen and (min-width:1015px) and (max-width:1280px) {
  .detail-ct {
    margin-left:-webkit-calc(60 / 1280 * 100vw);
    margin-left:calc(60 / 1280 * 100vw);
  }
}

@media print,screen and (min-width:641px) and (max-width:1014px) {
  .detail-ct {
    margin-left:48px;
  }
}

@media screen and (max-width:640px) {
  .detail {
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column;
  }
  
  .detail-photos .photos-thumb,
  .detail-photos .photos-slide--thumb {
    padding-bottom:2em;
  }
  
  .detail-photos .photos-slide--noimg li {
    display:none;
  }
  
  .detail-photos .photos-slide li img,
  .detail-photos .photos-slide--thumb li img {
    height:-webkit-calc(420 / 640 * 100vw);
    height:calc(420 / 640 * 100vw);
    min-height:220px;
  }
  
  .detail-photos .photos-thumb li {
    height:-webkit-calc(160 / 640 * 100vw);
    height:calc(160 / 640 * 100vw);
    min-height:80px;
  }
  
  .detail-ct .buy-item dd .buy-item__select {
    width:100%;
  }
}

@media screen and (max-width:380px) {
  .detail-ct .buy-item dd .buy-item__btn .kosu input[type="text"] {
    width:2.5em;
  }
  
  .detail-ct .buy-item dd .buy-item__btn .cartin .p-btn {
    padding-left:1em;
    padding-right:1em;
  }
}

@media print,screen and (min-width:641px) {
  .detail-comt .p-glog:first-of-type {
    padding-top:80px;
  }
  
  .sec-detail .back {
    padding-top:80px;
  }
}

@media screen and (max-width:640px) {
  .detail-comt .p-glog:first-of-type {
    padding-top:3em;
  }
  
  .sec-detail .back {
    padding-top:3em;
  }
}


/*--------------------------------------------------------------------------------
  カートエラー
--------------------------------------------------------------------------------*/

.cartin-err {
  list-style:none;
  color:#e64632;
  padding-bottom:1em;
}

.cartin-input-err {
  border-color:#fd5d49;
  background-color:#ffeeec;
}

