@charset "UTF-8";
/* CSS Document */
/*20210114追加*/

/*　STORE
================================================================*/

/* STORE　[store.html]
=======================================*/

.page-store-box{
  margin-top: 65px;
  max-width: 1100px;
}
.wb_title{
  font-size: 1.28em;
  border-bottom: 1px solid #b6b8b7;
}
/*20210125変更_1（追加）*/
.page-store-box p.att-link{
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  margin-top: 25px;
  padding-left: 1.5em
}
.page-store-box p.att-link a{
  color: #dc1721;
  font-weight: 600;
  padding-bottom: 2px;
}
.page-store-box p.att-link a::before{
  content: "";
  display: block;
  width: calc(100% + .8em);
  height: 1px;
  background: #dc1721;
  position: absolute;
  left: 0;
  bottom: -2px;
}
.page-store-box p.att-link a::after{
  content: "";
  display: block;
  width: .35em;
  height: .35em;
  border: 1px solid;
  border-color: #dc1721 #dc1721 transparent transparent;
  position: absolute;
  top: 50%;
   right: -.5em;
  transform: translateY(-50%) rotate(45deg);
}
/*END/20210125変更_1（追加）*/

.wb_title p{
  padding-bottom: .5em;
}
.shop-item-box{
  margin-top: 30px;/*20210125変更_2*/
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -o-flex-wrap: wrap;
  flex-wrap: wrap;
  padding-bottom: 60px;
}
.shop-item-box > div + div:nth-child(n+5){
  margin-top: 5%;
}
.shop-item-box .item-cat{
  width: 25%;
  padding: 0 1.5%;
}
.item-cat > a{
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.item-cat .thumb{
  width: 100%;
  overflow: hidden;
  background: #161616;
  box-shadow: 0 6px 12px 0 rgba(0,0,0,.3);
}
.item-cat .thumb::after{
  content: "";
  display: block;
  padding-top: 103%;
}
.item-cat .thumb p{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -ms-align-items: center;
  align-items: center;
  justify-content: center;
}
.item-cat .thumb p img{
  width: auto;
  max-height: 100%;
}
.item-cat .item-data{
  margin-top: 1em;
  font-size: .92em;
  line-height: 1.4;
}
.item-cat .item-data p.item-price{
  color: #106acd;
}
.cart-btm{
  margin-top: 85px;
  padding-bottom: 85px;
  justify-content: space-between;
}
.cart-btm > div{
  width: 48%;
}
.cart-btm .wb_title{
  margin-bottom: 20px;
}
.cart-btm > div .cmnt{
  padding: 0 20px;
}
.cart-btm .user-data .cmnt{
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -o-flex-wrap: wrap;
  flex-wrap: wrap;
  justify-content: space-between;
}
.cart-btm .user-data .cmnt .txt p{
  padding-left: .85em;
  line-height: 1.4;
}
.cart-btm .user-data .cmnt .txt p.intitle{
  margin-bottom: .5em;
  font-weight: 600;
}
.cart-btm .user-data .cmnt .txt p.intitle::before{
  content: "・";
  position: absolute;
  left: 0;
  top: 0;
}
.cart-btm .user-data .cmnt .txt p.intxt{
  margin-bottom: 2em;
}
.cart-btm .user-data .cmnt .btn a{
  display: block;
  color: #fff;
  background: #1069cd;
  padding: .35em 1em .15em;
}
.cart-btm .user-data .cmnt .att{
  width: 100%;
  border: 1px solid #50626e;
  padding: 15px 25px;
  line-height: 1.6;
  color: #ed0978;
  font-weight: 600;
}
.cart-btm .check-data ul.price-list li{
  justify-content: space-between;
}
.cart-btm .check-data ul.price-list li:nth-child(2){
  margin: .5em 0 1em;
}
.cart-btm .check-data ul.price-list li.total{
  padding-top: 1em;
  border-top: 1px solid #50626e;
}
.cart-btm .check-data ul.price-list li.total p{
  font-size: 1.14em;
}
.cart-btn-set{
  margin-top: 2em;
}
.cart-btn-set a{
  display: flex;
  width: 100%;
  -ms-align-items: center;
  align-items: center;
}
.cart-btn-set a + a{
  margin-top: 20px;
}
.cart-btn-set a p{
  width: 100%;
  font-size: 1.14em;
  font-weight: 600;
  padding: .65em .5em .5em;
  text-align: center;
}
.cart-btn-set a.pay-select{
  background: #1069cd;
}
.cart-btn-set a.next-item{
  background: #50626e;
}
/*商品説明　[item_detail.html]
==============================*/

.item-detail-box{
  margin-top: 40px;
  padding-bottom: 80px;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -o-flex-wrap: wrap;
  flex-wrap: wrap;
}
.item-detail-box .item-thumb{
  width: 43%;
  overflow: hidden;
  background: #161616;
  box-shadow: 0 6px 12px 0 rgba(0,0,0,.3);
}
.item-detail-box .item-thumb::after{
  content: "";
  display: block;
  padding-top: 104%;
}
.item-detail-box .item-thumb p{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -ms-align-items: center;
  align-items: center;
  justify-content: center;
}
.item-detail-box .item-thumb p img{
  width: auto;
  max-height: 100%;
}
.item-detail-box .item-data{
  width: 57%;
  padding-left: 5%;
}
.item-detail-box .item-data p.item-name{
  font-size: 1.07em;
  font-weight: 600;
  line-height: 1.4;
}
.item-detail-box .item-data .item-cmnt{
  padding: 45px 0 60px;
  line-height: 1.6;
  border-bottom: 1px solid #50626e;
}
.item-detail-box .item-data .item-cmnt p{
  text-align: justify;
}
.item-detail-box .item-price{
  justify-content: space-between;
  -ms-align-items: center;
  align-items: center;
  padding-top: 20px;
}
.item-detail-box .item-price p.in-price{
  color:#3b9cfd;
  font-size: 1.07em;
  font-weight: 600;
}
.item-detail-box .item-price .cart-btn a{
  display: block;
  background: #106acd;
  color: #fff;
  padding: .7em 2.44em .5em;
  
}
.item-detail-box .link-btn{
  margin: 80px auto 0;
}

/* カート　[cart.html]
=============================*/

.cart-box{
  margin-top: 40px;
}
.cart-box > div + div{
  padding-top: 20px;
  border-top: 1px solid #57616a;
}
.cart-item{
  padding-bottom: 20px;
  padding-left: 10px;
  -ms-align-items: flex-start;
  align-items: flex-start;
}
.cart-item .thumb{
  width: 13%;
  overflow: hidden;
  background: #161616;
}
.cart-item .thumb::before{
  content: "";
  display: block;
  padding-top: 100%;
}
.cart-item .thumb p{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -ms-align-items: center;
  align-items: center;
  justify-content: center;
}
.cart-item .thumb p img{
  width: auto;
  max-height: 100%;
}
.cart-data{
  width: 87%;
  padding-left: 30px;
  padding-right: 3em;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -ms-align-items: flex-start;
  align-items: flex-start;
  font-size: 1.07em;
}
.cart-data p.item-name{
  line-height: 1.4;
}
.cart-data p.price{
  color: #3895f2;
  padding: 1em 0;
}
.cart-data .count{
  -ms-align-items: center;
  align-items: center;
}
.cart-data .count .select-warp{
  width: 160px;
  margin-left: 10px;
}
.cart-data .count .select-warp select{
  border-radius: 0;
  border: 2px solid #1069cd;
  border-right-width: 35px;
  padding: .4em 1.5em .4em .5em;
}
.cart-data .count .select-warp label::after{
  color: #fff;
  width: 32px;
}
.delete-item{
  position: absolute;
  top: 0;
  right: 0;
  color: #fff;
  background: #da056f;
}
.delete-item p{
  font-size: .88em;
  padding: .35em .5em .25em 2em;
}
.delete-item p::before
,.delete-item p::after{
  content: "";
  display: block;
  position: absolute;
  top: 52%;
  left: 1em;
  width: 1px;
  height: 1em;
  background: #fff;
}
.delete-item p::before{
  transform: translateY(-50%) rotate(45deg);
}
.delete-item p::after{
  transform: translateY(-50%) rotate(-45deg);
}

/*modal*/
#modal_pay{
  display: none;
}
.mdl_ttl{
  text-align: center;
  font-size: 2em;
  color: #d8056e;
  font-weight: 600;
}
.mdl_pay_list{
  margin-top: 40px;
  margin-bottom: 30px;
  font-size: 1.28em;
}
.mdl_pay_list li{
  border-bottom: 1px solid #50626e;
  padding: 20px 10px;
}
.mdl_pay_list li:first-child{
  border-top: 1px solid #50626e;
}
.mdl_pay_list li a{
  display: block;
  padding-left: .75em;
}
.mdl_pay_list li a::before{
  content: "-";
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.mdl_pay_list li a::after{
  content: "";
  display: block;
  position: absolute;
  right: 0;
  top: 50%;
  width: 8px;
  height: 8px;
  border: 2px solid;
  border-color: #e9f6fe #e9f6fe transparent transparent;
  border-radius: 2px;
  transform: translateY(-50%) rotate(45deg);
}
.mdl_att p{
  font-size: 1.14em;
  color: #d8056e;
  line-height: 1.6;
  font-weight: 600;
}

/* 商品購入履歴　[user_history.html]
=======================================*/

.sec-user-history{
  margin-top: 60px;
  max-width: 985px;
  width: 100%;
  margin: 0 auto;
}
/*20210125変更_3(追加）*/
.sec-user-history > div + div{
  margin-top: 40px;
}
.user-history-list{
  margin-bottom: 10px;
}
/*END/20210125変更_3(追加）*/

.user-history-list li{
  padding-bottom: 20px;
  border-bottom: 1px solid #57616a;
  padding-left: 10px;
  -ms-align-items: center;
  align-items: center;
}
.user-history-list li + li{
  padding-top: 20px;
}
.user-history-list li .thumb{
  width: 13%;
  overflow: hidden;
  background:  #161616;
  
}
.user-history-list li .thumb::after{
  content: "";
  display: block;
  padding-top: 103%;
}
.user-history-list li .thumb p{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -ms-align-items: center;
  align-items: center;
  justify-content: center;
}
.user-history-list li .thumb p img{
  width: auto;
  max-height: 100%;
}
.user-history-list li .item-data{
  width: 87%;/*20210125変更_4*/
  padding: 0 30px;
}
.user-history-list li .item-data p.date{
  font-size: .88em;
  padding-bottom: 1em;
}
.user-history-list li .item-data p.title{
  font-weight: 600;
  line-height: 1.4;
  font-size: 1.07em;
}
.user-history-list li .item-data p.price{
  color: #106acd;
  padding-top: .85em;
  font-weight: 600;
  font-size: 1.14em;
}
/*20210125変更_5（追加）*/
.user-history-cat .price-box{
  background: #1d262b;
  padding: .5em;
  -ms-align-items: flex-end;
  align-items: flex-end;
}
.user-history-cat .price-box p:not(:last-child)::after{
  content: "/";
  padding: 0 .25em;
}
.user-history-cat .price-box p.total{
  font-size: 1.24em;
  font-weight: 600;
}
/*END/20210125変更_5（追加）*/

/*購入決済完了 [buy_completed.html]
=======================================*/

.page-completed-blc{
  padding-bottom: 80px;
}
.post-form-box.comp .comptxt{
  padding-top: 80px;
  padding-bottom: 120px;
}

/*銀行振り込み　[bank_detail.html]
=======================================*/

.page-bank-box{
  margin-top: 50px;
}
.page-bank-box p.top-txt{
  text-align: center;
  font-size: 1.28em;
  line-height: 1.6;
}
.bank-acc-box{
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -ms-align-items: center;
  align-items: center;
  width: 530px;
  max-width: 100%;
  margin: 60px auto 0;
  padding-bottom: 90px;
}
.bank-acc-box > p.top-title{
  font-size: 1.28em;
  padding-bottom: .5em;
  width: 100%;
  border-bottom: 1px solid #b6b8b7;
  text-align: center;
}

.bank-acc-list
,.bank-acc-box p.att
,.bank-att-box
,.bank-acc-box .min-att{
  width: 92%;
  margin: 0 auto;
  font-size: 1.07em;
}

.bank-acc-list{
  margin: 30px auto;
  border: 1px solid #50626e;
}
.bank-acc-list li p{
  width: 50%;
  padding: .85em 1.25em;
}
.bank-acc-list li p + p{
  border-left: 1px solid #394a52;
}
.bank-acc-list li p.in-title{
  background: #2f3d46;
}
.bank-acc-list li + li{
  border-top: 1px solid #50626e;
}
.bank-acc-box p.att 
,.bank-acc-box .min-att{
  line-height: 1.6;
  letter-spacing: .045em;
  text-align: justify;
}
.bank-acc-box p.att span{
  color: #ff0101;
  font-weight: 600;
}
.bank-userid{
  margin: 30px 0;
}
.bank-userid p{
  font-size: 1.28em;
  padding: .85em 2.5em .75em;
  letter-spacing: .05em;
  background: #2f3d46;
}

.bank-att-box{
  border: 1px solid #4f636c;
  background: #154762;
  padding: 0 1em 1em;
  margin-top: 40px;
}
.bank-att-box p.att-title{
  font-size: 1.07em;
  text-align: center;
  padding-top: 1em;
  padding-bottom: 1em;
}
.bank-att-box p.att-txt{
  line-height: 1.6;
}
.bank-acc-box .min-att{
  padding-top: 1em;
  color: #919ca2;
}

/*代金引き換え確認 [cod_check.html]
====================================*/

.page-cod-box{
  margin-top: 50px;
}
.page-cod-box p.cod-txt{
  text-align: center;
  font-size: 1.14em;
  line-height: 1.6;
  letter-spacing: .05em;
}
.page-cod-box p.cod-txt span{
  color: #ff0101;
  font-weight: 600;
}
.cart-btm.cod-cat{
  margin-top: 65px;
}
.cart-btm.cod-cat .cmnt > p{
  line-height: 1.6;
}

/*20210125変更_6（変更+ 追加）*/
.cod-btn-box{
  width: 485px;
  max-width: 100%;
  margin: 0 auto;
  padding-bottom: 80px;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -webkit-flex-direction: column;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -o-flex-direction: column;
  flex-direction: column;
  -ms-align-items: center;
  align-items: center;
}

.cod-btn-box a.user-data-link{
  font-size: 1.21em;
  margin-bottom: 2em;
  font-weight: 600;
}
.cod-btn-box a.user-data-link::before{
  content: "";
  width: calc(100% + 12px);
  height: 1px;
  background: #fff;
  display: block;
  position: absolute;
  left: 0;
  bottom: -2px;
}
.cod-btn-box a.user-data-link::after{
  content: "";
  display: block;
  width: 5px;
  height: 5px;
  border: 1px solid;
  border-color: #dceef9 #dceef9 transparent transparent;
  position: absolute;
  top: 50%;
  right: -10px;
  transform: 
    translateY(-50%) rotate(45deg);
}
/*END/20210125変更_6（変更+追加）*/

.cod-btn-box .codbtn{
  display: block;
  text-align: center;
  width: 100%;
  font-size: 1.28em;
  background: #1069cd;
  padding: .65em 1em .5em;
  font-weight: 600;
  letter-spacing: .05em;
}

ul.cod-price{
  margin-top: 30px;
  border: 1px solid #50626e;
}
ul.cod-price li + li{
  border-top: 1px solid #50626e;
}
ul.cod-price li > p{
  width: 50%;
  padding: .65em 1em .5em;
  line-height: 1.2;
}
ul.cod-price li > p + p{
  border-left: 1px solid #2f3e43;
}
ul.cod-price li:not(:first-child) p{
  font-size: .92em;
  padding: .95em 1em .85em;
}
ul.cod-price li.title{
  background: #2f3d46;
}
ul.cod-price li.title p + p{
  border-left: 1px solid #3a4851;
}


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

/* 商品購入履歴　[user_history.html]
=======================================*/
  
  .user-history-list li{
    padding-left: 0;
  }
 
  .user-history-list li .item-data{
    /*width: 65%;*/ /*20210125変更_7（削除）*/
    padding: 0 15px;
  }

  
/*カート [cart.html]
=========================*/
  
  .cart-data{
    padding-top: 2em;
    padding-right: 0;
  }
  .delete-item{
  }
  
}
@media screen and (max-width:480px) {
    
/* STORE　[store.html]
=======================================*/
  
  /*20210125変更_8（追加）*/
  .page-store-box p.att-link{
    padding-left: 0;
  }
  /*END/20210125変更_8（追加）*/
  
  .page-store-box{
    margin-top: 40px;
  }
  .shop-item-box{
    justify-content: space-between;
  }
  .shop-item-box > div + div:nth-child(n+3){
    margin-top: 5%;
    
  }
  .shop-item-box .item-cat{
    width: 48%;
    padding: 0;
  }
  
/*商品説明　[item_detail.html]
==============================*/
  
  .item-detail-box{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
  }
  .item-detail-box .item-thumb{
    width: 100%;
  }
  .item-detail-box .item-data{
    width: 100%;
    padding-left: 0;
    margin-top: 30px;
  }
  .item-detail-box .item-data .item-cmnt{
    padding: 30px 0;
  }

/* 商品購入履歴　[user_history.html]
=======================================*/
  .sec-user-history{
    margin-top: 40px;
  }
  .user-history-list li{
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .user-history-list li .thumb{
    width: 25%;
  }
  .user-history-list li .item-data{
    width: 75%;
    padding-right: 0;
  }
  
  /*20210125変更_9（削除）*/
  /*.user-history-list li .item-price{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
  .user-history-list li .item-price p:nth-child(2){
    margin-top: 0;
    margin-left: 1em;
  }
  .user-history-list li .item-price p.total{
    width: 100%;
    justify-content: flex-end;
  }
  .user-history-list li .item-price p span:first-child{
    padding-right: .5em;
  }
  */
  /*END_20210125変更_9（削除）*/
/*カート [cart.html]
=========================*/
  
  .cart-item{
    padding-left: 0;
  }
  .cart-item .thumb{
    width: 25%;
  }
  .cart-data{
    width: 75%;
    padding-left: 15px;
  }
  .cart-btm{
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    margin-top: 50px;
    padding-bottom: 50px;
  }
  .cart-btm > div{
    width: 100%;
  }
  .cart-btm > div + div{
    margin-top: 50px;
  }
  .cart-btm > div .cmnt{
    padding: 0;
  }
  .cart-btm .user-data .cmnt {
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    -ms-align-items: center;
    align-items: center;
  }
  .cart-btm .user-data .cmnt div.txt{
    width: 100%;
  }
  .cart-btm .user-data .cmnt .btn{
    margin-bottom: 2em;
  }
  
  .modaal-content-container{
    padding: 50px 20px;
  }
  .mdl_ttl{
    font-size: 1.44em;
  }
  .mdl_pay_list{
    font-size: 1.14em;
  }
  .mdl_att p{
    font-size: 1em;
  }
  .mdl_pay_list li{
    padding: 10px;
  }
  .mdl_pay_list li a::after{
    width: 5px;
    height: 5px;
  }
  .modaal-close{
    right: 0;
    top: 0;
  }
  
/*銀行振り込み　[bank_detail.html]
=======================================*/
  
  .page-bank-box p.top-txt{
    text-align: justify;
  }
  
  .bank-acc-list,
  .bank-acc-box p.att,
  .bank-att-box,
  .bank-acc-box .min-att{
    width: 100%;
  }
  .bank-acc-list li p{
    padding: .85em 1em;
  }
  .bank-acc-list li p.in-title{
    width: 40%;
  }
  .bank-acc-list li p.in-data{
    width: 60%;
  }
  
/*代金引き換え確認 [cod_check.html]
====================================*/
  
  .page-cod-box p.cod-txt{
    text-align: justify;
  }
  ul.cod-price li > p{
    font-size: .92em;
  }
  ul.cod-price li > p:first-child{
    width: 55%;
  }
  ul.cod-price li > p:last-child{
    width: 45%;
  }
  ul.cod-price li:not(:first-child) p{
    padding: .95em .5em .85em;
  }
  
}

	/* STORE */	
  .bank-att-box .pay_all {	
    padding: 0 0 10px;	
    font-size: 22px;	
    text-align: center;	
    color: #e9c421;	
    line-height: 1.6;	
  }