/* ------------------------------
メイン
------------------------------ */
.cart{
padding:18rem 0 12rem 0;
}

.empty-cart{
padding:18rem 0 12rem 0;
}


/* ------------------------------
カート　左右レイアウト
------------------------------ */
.cart-layout{
display:grid;
grid-template-columns:1fr 36rem;
gap:4rem;
align-items:start;
}

@media (max-width: 1000px){
.cart-layout{
grid-template-columns:1fr;
}

}


/* ------------------------------
アイテム複数
------------------------------ */
.cart-items{
display:grid;
gap:2rem;

}


/* ------------------------------
アイテム個別
------------------------------ */
.cart-item{
display:grid;
grid-template-columns:22rem 1fr;
gap:3rem;
background:var(--bg2);
border:1px solid var(--color-line1);
padding:3rem;
}

/* 画像 */
.cart-item__image{
margin:0;
}

.cart-item__image img{
display:block;
width:100%;
aspect-ratio:1 / 1;
object-fit:cover;
}

/* 左右カラム用 */
.cart-item__body{
}

/* 商品名 */
.cart-item__head{
display:flex;
justify-content:space-between;
gap:2rem;
padding-bottom:2.5rem;
border-bottom:1px solid var(--color-line3);
margin-bottom:2.5rem;
}

.cart-item__code{
font-size:1.2rem;
margin:0 0 1rem 0;
letter-spacing:.08em;
color:var(--color-gray3);
}

.cart-item__title{
font-size:2rem;
line-height:1.6;
font-family:"mincho", serif;
}

.cart-item__variation{
margin:.3rem 0 0 0;
color:var(--color-gray2);
font-family:"mincho", serif;
}

/* 価格 */
.cart-item__price{
margin:0;
text-align:right;
white-space:nowrap;
font-family:"number", serif;
}

.cart-item__price span{
display:block;
font-size:2rem;
line-height:1;
}

.cart-item__price small{
padding-left:.2rem;
}

/* SP*/
@media(max-width:600px){
.cart-item{
grid-template-columns:1fr;
padding:2rem;
}

.cart-item__head{
display:block;
}

.cart-item__price span,
.cart-item__price small{
display:inline-block;
}

}


/* ------------------------------
カート　アイテム詳細
------------------------------ */
.table-list th,
.table-list td{
font-size:1.4rem;
}


/* ------------------------------
カート　アイテム小計
------------------------------ */
.cart-item__foot{
display:grid;
grid-template-columns:1fr 3fr;
align-items:start;
gap:2rem;
margin-top:2.5rem;
border-top:1px solid var(--color-line3);
padding-top:2.5rem;
}

.cart-item__qty{
font-size:2rem;
font-family:"mincho", serif;
}

.cart-item__total{
text-align:right;
font-family:"mincho", serif;
}

.cart-item__total small{
padding-left:.2rem;
}

.cart-item__total span:nth-of-type(1){
display:block;
font-size:2rem;
line-height:1.6;
}
.cart-item__total span:nth-of-type(2){
display:block;
font-size:2rem;
line-height:1;
}
.cart-item__total span:nth-of-type(3){
display:block;
font-size:2.3rem;
line-height:2;
padding:1rem 0 1rem 0;
}


/* ------------------------------
カート　アイテム処理
------------------------------ */
.cart-item__actions{
display:grid;
grid-template-columns:1fr 3fr;
gap:1rem;
margin-top:2.5rem;
}

.cart-item__actions a{
padding:1rem;
}


/* SP */
@media (max-width: 600px){

.cart-item__actions{
margin-top:3rem;
}
}


/* ------------------------------
注釈
------------------------------ */
.cart-note{
display:grid;
gap:.4rem;
padding:0 0 2rem 0;
}

.cart-note p{
margin:0;
font-size:1.4rem;
line-height:1.6;
color:var(--color-gray3);
padding-left:1.6rem;
position:relative;
}

.cart-note p:before{
content:'✓';
display:block;
position:absolute;
left:0;
}


/* ------------------------------
合計
------------------------------ */
.cart-sticky{
position:sticky;
top:10rem;
}

.cart-summary{
padding:3rem;
background:var(--bg3);
border:1px solid var(--color-line2);
}

.cart-summary h2{
margin:0 0 2.5rem 0;
font-family:"mincho", serif;
font-size:2rem;
font-weight:400;
}

.cart-summary th,
.cart-summary td{
display:table-cell !important;
padding-top:1rem  !important;
}

.cart-summary td{
text-align:right;
}

.cart-summary__total{
display:flex;
justify-content:space-between;
align-items:flex-end;
gap:2rem;
padding:3rem 0;
font-family:"number", serif;
line-height:1;
border-top:1px var(--color-line3) solid;
}

.cart-summary__total span{
}

.cart-summary__total strong{
font-family:"number", serif;
font-size:3rem;
font-weight:400;
line-height:1;
}

.cart-continue{
margin-top:1rem;
}

.cart-summary__note{
margin-top:2rem;
padding:2rem;
border:1px solid var(--color-line2);
border-radius:.3rem;
}

.cart-summary__note h3{
margin:0 0 1rem 0;
font-family:"mincho", serif;
font-size:1.8rem;
font-weight:400;
}

.cart-summary__note p{
margin:0;
font-size:1.4rem;
line-height:1.8;
color:var(--color-gray3);
}



/* SP */
@media (max-width: 1000px){
.cart-summary{
position:static;
}
}

@media (max-width: 600px){
.cart-summary{
padding:2rem;
}
}