/*------------------------------------------------------------------------------
>>> TABLE OF CONTENTS:
--------------------------------------------------------------------------------
1.0.0.0 INITIALIZE STYLE
	1.1.0.0 REVIEW LIST
		1.1.1.0 REVIW CART BUTTON
		1.1.2.0 REVIEW PAGER
	1.2.0.0 REVIEW LOGIN
		1.2.1.0 REVIEW LOGIN HEADLINE
		1.2.2.0 REVIEW LOGIN REQUIRE
		1.2.3.0 REVIEW LOGIN FORM
	1.3.0.0 REVIEW POST
		1.3.1.0 REVIEW POST MAIN
		1.3.2.0 REVIEW POST RATING
		1.3.3.0 REVIEW POST INPUT AREA
	1.4.0.0 REVIEW CONFIRMATION
	1.5.0.0 REVIEW THANKYOU
2.0.0.0 CONTENTS
3.0.0.0 TABLET WIDTH 960px
4.0.0.0 PC WIDTH 1000px
------------------------------------------------------------------------------*/


/*------------------------------------------------------------------------------
// 1.0.0.0 CONTENTS
------------------------------------------------------------------------------*/
main .wrap{
	margin:auto;
	width:768px;
}

.item-title{
	margin:16px auto;
}

article h1{
	margin-top:16px;
	line-height:1.3;
	font-size:32px;
}

article h1 span{
	display:block;
	margin-bottom:4px;
	font-size:18px;
}

article h2{
	margin:16px auto;
	/* width:1500px; */
	font-size:32px;
}


/*--------------------------------------1.1.0.0 ------------------REVIEW LIST */
.list-review{
	margin-top:48px;
}

.list-review li:not(:first-child){
	margin-top:32px;
}

.list-review .primary{
	display:none;
}

.list-review .no_review{
	margin-top:24px;
	font-size:24px;
}

/* TITLE ---------------------------------------------------------------------*/
.list-review .title{
	line-height:1.3;
	font-size:20px;
}

/* RATING STAR ---------------------------------------------------------------*/
.list-review .rating span{
	position:relative;
	display:inline-block;
	margin-top:8px;
	color:var(--gray);
}

.list-review .rating span::before,
.list-review .rating span::after{
	content:'★★★★★';
	display:inline-block;
	font-size:24px;
	overflow:hidden;
}

.list-review .rating span::after{
	position:absolute;
	top:0;
	left:0;
	color:#f9bf3b;
}

.list-review .rating span[data-rate^='1']::after{
	width:20%;
}

.list-review .rating span[data-rate^='2']::after{
	width:40%;
}

.list-review .rating span[data-rate^='3']::after{
	width:60%;
}

.list-review .rating span[data-rate^='4']::after{
	width:80%;
}

.list-review .rating span[data-rate^='5']::after{
	width:100%;
}


/* USER NAME -----------------------------------------------------------------*/
.list-review .name{
	margin:8px 16px;
	font-size:12px;
	text-align:right;

	a{
		display:inline;
	}
}

/* USER COMMENT --------------------------------------------------------------*/
.list-review .comment{
	padding:16px;
	line-height:1.7;
	border-radius:8px;
	background:var(--surface);
}

/* USER USEFUL ---------------------------------------------------------------*/
.list-review .useful{
	display:flex;
	margin-top:8px;
	align-items:center;
	justify-content:flex-end;
}

.list-review .useful p{}

.list-review .useful p span{
	font-size:16px;
}

.list-review .useful a{
	margin-left:16px;
	padding:8px;
	font-size:12px;
	border:1px solid var(--gray);
	border-radius:4px;
	background:var(--surface);
}
/* 
.review_link.plus a{
	margin:16px auto;
	padding:8px;
	width:80%;
	font-size:20px;
	border:1px solid var(--accent);
	border-radius:8px;
	text-align:center;
}

.review_link.plus a::after{
	content:url(/img/pc/arrow_next.svg);
	display:inline-block;
	margin-left:8px;
	padding:4px;
	width:16px;
	height:16px;
	background:var(--accent);
	border-radius:50%;
	vertical-align:middle;
}

.review_link.minus a{
	color:#999;
	text-align:right;
	text-decoration:underline;
} */

.rate-box{
	display:flex;
	margin-top:16px;
	align-items:center;
	justify-content:space-between;
}

.rate-box a{
	margin-top:0;
	width:50%;
}

.review-rate{
	position:relative;
	display:flex;
	align-items:baseline;
}

.review-rate::before,
.review-rate::after{
	content:'★★★★★';
	display:block;
	width:160px;
	font-size:32px;
	color:#ddd;
	overflow:hidden;
}

.review-rate::after{
	position:absolute;
	top:0;
	left:0;
	width:160px;
	color:#f9bf3b;
}

.review-rate[data-rate='1.0']::after{
	width:calc(160px * .20);
}

.review-rate[data-rate='1.1']::after{
	width:calc(160px * .22);
}

.review-rate[data-rate='1.2']::after{
	width:calc(160px * .24);
}

.review-rate[data-rate='1.3']::after{
	width:calc(160px * .26);
}

.review-rate[data-rate='1.4']::after{
	width:calc(160px * .28);
}

.review-rate[data-rate='1.5']::after{
	width:calc(160px * .30);
}

.review-rate[data-rate='1.6']::after{
	width:calc(160px * .32);
}

.review-rate[data-rate='1.7']::after{
	width:calc(160px * .34);
}

.review-rate[data-rate='1.8']::after{
	width:calc(160px * .36);
}

.review-rate[data-rate='1.9']::after{
	width:calc(160px * .38);
}

.review-rate[data-rate='2.0']::after{
	width:calc(160px * .40);
}

.review-rate[data-rate='2.1']::after{
	width:calc(160px * .42);
}

.review-rate[data-rate='2.2']::after{
	width:calc(160px * .44);
}

.review-rate[data-rate='2.3']::after{
	width:calc(160px * .46);
}

.review-rate[data-rate='2.4']::after{
	width:calc(160px * .48);
}

.review-rate[data-rate='2.5']::after{
	width:calc(160px * .50);
}

.review-rate[data-rate='2.6']::after{
	width:calc(160px * .52);
}

.review-rate[data-rate='2.7']::after{
	width:calc(160px * .54);
}

.review-rate[data-rate='2.8']::after{
	width:calc(160px * .56);
}

.review-rate[data-rate='2.9']::after{
	width:calc(160px * .58);
}

.review-rate[data-rate='3.0']::after{
	width:calc(160px * .60);
}

.review-rate[data-rate='3.1']::after{
	width:calc(160px * .62);
}

.review-rate[data-rate='3.2']::after{
	width:calc(160px * .64);
}

.review-rate[data-rate='3.3']::after{
	width:calc(160px * .66);
}

.review-rate[data-rate='3.4']::after{
	width:calc(160px * .68);
}

.review-rate[data-rate='3.5']::after{
	width:calc(160px * .70);
}

.review-rate[data-rate='3.6']::after{
	width:calc(160px * .72);
}

.review-rate[data-rate='3.7']::after{
	width:calc(160px * .74);
}

.review-rate[data-rate='3.8']::after{
	width:calc(160px * .76);
}

.review-rate[data-rate='3.9']::after{
	width:calc(160px * .78);
}

.review-rate[data-rate='4.0']::after{
	width:calc(160px * .80);
}

.review-rate[data-rate='4.1']::after{
	width:calc(160px * .82);
}

.review-rate[data-rate='4.2']::after{
	width:calc(160px * .84);
}

.review-rate[data-rate='4.3']::after{
	width:calc(160px * .86);
}

.review-rate[data-rate='4.4']::after{
	width:calc(160px * .88);
}

.review-rate[data-rate='4.5']::after{
	width:calc(160px * .90);
}

.review-rate[data-rate='4.6']::after{
	width:calc(160px * .92);
}

.review-rate[data-rate='4.7']::after{
	width:calc(160px * .94);
}

.review-rate[data-rate='4.8']::after{
	width:calc(160px * .96);
}

.review-rate[data-rate='4.9']::after{
	width:calc(160px * .98);
}

/* .review-rate[data-rate='5.0']::after{
	width:calc(160px * .10)%;
} */

.review-rate span:first-child{
	margin-left:8px;
	font-size:16px;
}

.review-rate span:first-child::after{
	content:'点';
	font-size:12px;
}

.review-rate span:last-child{
	margin-left:16px;
	padding:6px 4px 4px;
	border:1px solid var(--gray);
	border-radius:4px;
	background:var(--surface);
}

.review-rate span:last-child::before{
	content:'クチコミ：';
}

.review-rate span:last-child::after{
	content:'件';
}

/*--------------------------------------1.2.0.0 ------------------BREAD CRUMB */
.breadcrumb{
	display:flex;
	margin:0 0 16px;
	overflow:hidden;
}

.breadcrumb li{
	margin-right:16px;
}

.breadcrumb li span{
	display:block;
	position:relative;
	padding:2px 4px;
}

.breadcrumb li span span{
	display:inline-block;
	padding:0 0 0 4px;
	font-size:10px;
}

.breadcrumb li a span{
	color:var(--accent);
	text-decoration:underline;
}

.breadcrumb li:first-child a span{
	color:var(--back);
	background:var(--accent);
	text-decoration:none;
}

.breadcrumb li a span:before,
.breadcrumb li a span:after{
	content:'';
	display:block;
	position:absolute;
	top:0;
	width:0;
	height:0;
	z-index:1;
}

.breadcrumb li a span:before{
	right:-18px;
	border:9px solid transparent;
	border-left:9px solid var(--back);
	z-index:2;
}

.breadcrumb li:nth-child(1) a span:before{
	border-left:9px solid var(--accent);
}

.breadcrumb li:nth-child(n+2) a span:after{
	top:-1px;
	right:-20px;
	border:10px solid transparent;
	border-left:10px solid var(--gray);
}

.breadcrumb li:last-child a span::before,
.breadcrumb li:last-child a span::after{
	content:none;
}


.button-text2{
	margin-top:16px;
    padding:8px;
    /* border:1px solid var(--accent);
    border-radius:8px; */
	text-align:right;
}

.button-text2::before{
    content:url(/img/pc/arrow_next.svg);
    display:inline-block;
    margin-right:8px;
    padding:4px;
    width:12px;
    height:12px;
    background:var(--accent);
    border-radius:50%;
    vertical-align:middle;
	transform:rotate(180deg);
}


/*----------------------------------------1.1.1.0 ---------REVIEW CART BUTTON */
.review_cart{
	display:flex;
	position:sticky;
	bottom:0;
	left:0;
	margin-top:32px;
	padding:8px;
	background:rgba(255,255,255,0.9);
	justify-content:space-between;
}

.review_cart>div{
	display:flex;
	width:40%;
	align-items:center;
}

.review_cart>div:first-child{
	width:55%;
}

/* THUMBNAIL -----------------------------------------------------------------*/
.review_cart>div .thumb{
	width:80px;
}

.review_cart>div .thumb img{
	width:auto;
	height:80px;
}

/* ITEM NAME -----------------------------------------------------------------*/
.review_cart>div p,
.review_cart>div p a{
	margin-left:8px;
	line-height:1.3;
	font-size:24px;
	font-weight:bold;
	flex:1;
}

/* FORM ----------------------------------------------------------------------*/
.review_cart form{
	width:300px;
}

.form-select-chips{
	display:flex;
	flex-wrap:wrap;
}

.form-select-chips:not(:first-of-type){
	margin-top:16px;
}

.form-select-chips li{
	width:calc((100% - 16px) / 3);
}

.form-select-chips li:nth-child(3n+2){
	margin:0 8px;
}

.form-select-chips li:nth-child(n+4){
	margin-top:8px;
}

.form-select-chips label{
	display:flex;
	padding:0 8px;
	width:100%;
	height:56px;
	line-height:1.2;
	font-size:12px;
	border:2px solid var(--gray);
	border-radius:8px;
	cursor:pointer;
	align-items:center;
	justify-content:center;
	text-align:center;
}

.form-select-chips label.stock3,
.form-select-chips label.stock2,
.form-select-chips label.stock1,
.form-select-chips label.stock0{
	text-align:left;
}

.form-select-chips label.stock3::before,
.form-select-chips label.stock2::before,
.form-select-chips label.stock1::before,
.form-select-chips label.stock0::before{
	margin-right:4px;
}

.form-select-chips label.stock3::before{
	content:'◎'
}

.form-select-chips label.stock2::before{
	content:'○'
}

.form-select-chips label.stock1::before{
	content:'△'
}

.form-select-chips label.stock0::before{
	content:'×'
}

.form-select-chips input:disabled+label{
	color:var(--gray);
	border:2px solid var(--surface);
	background:var(--surface);
}

.form-select-chips input:checked+label{
	color:var(--main);
	color:var(--back);
	border:2px solid var(--main);
	background:var(--main);
}

.review_cart form input[type='submit']{
	margin:16px 0 0;
	padding:8px 0;
	width:100%;
	height:60px;
	font-size:20px;
	font-family:'fontello';
	color:#fff;
	border:1px solid #c77800;
	border-radius:8px;
	background:#00B16A;
	background:linear-gradient(to bottom, #FCC314, #f90);
	cursor:pointer;
	text-shadow:0px -1px 1px #c77800;
}


/*----------------------------------------1.1.2.0 ---------------REVIEW PAGER */
.pager ul{
	margin:32px auto 0;
	justify-content:center;
}

.pager li{
	padding:8px;
	background:var(--surface);
}

.pager li:first-child{
	border-radius:8px 0 0 8px;
}

.pager li:last-child{
	border-radius:0 8px 8px 0;
}

.pager ul li span,
.pager ul li a{
	width:50px;
	height:50px;
	line-height:50px;
	font-size:16px;
	border-radius:0;
	background:none;
}

.pager ul li:first-child span,
.pager ul li:first-child a{
	border-right:1px solid var(--gray);	
}

.pager ul li:last-child span,
.pager ul li:last-child a{
	border-left:1px solid var(--gray);
}

.pager ul li.on span{
	background:var(--gray);
}

.pager ul li a{
	color:var(--accent);
}


/*--------------------------------------1.2.0.0 -----------------REVIEW LOGIN */
#review-login .wrap{
	width:1024px;
}

/*----------------------------------------1.3.2.0 ------REVIEW LOGIN HEADLINE */
#review-login h1{
	padding:0 32px;
}

#review-login h1+p{
	margin:16px 32px 0;
	line-height:1.7;
	font-size:18px;
}

#review-login h1+p span{
	font-size:18px;
	font-weight:bold;
	color:#d00;
}

#review-login h2{
	margin:0 0 24px;
	width:100%;
	text-align:center;
}


/*----------------------------------------1.3.3.0 -------REVIEW LOGIN REQUIRE */
#review-login ul{
	display:flex;
	margin-bottom:16px;
	width:100%;
	justify-content:center;
	align-items: center;
}

#review-login li{
	margin:8px;
	padding:8px 16px;
	font-size:18px;
	color:var(--main);
	border:1px solid var(--main);
	border-radius:8px;
}

#review-login .review-terms{
	margin:24px auto;
	width:720px;
	line-height:1.6;
	font-size:16px;
}

#review-login .review-terms span{
	font-size:12px;
}

/*----------------------------------------1.3.3.0 -----------REVIEW LOGIN FORM */
#review-login form{
	margin:24px 32px 0;
	padding:16px;
	border:1px solid var(--gray);
	border-radius:8px;
	background:var(--surface);
}

#review-login .review-login-form{
	display:flex;
	margin:auto;
	width:720px;
	flex-wrap:wrap;
	justify-content:space-between;
}

/* LOGIN ---------------------------------------------------------------------*/
#review-login .review-login-form>div{
	width:calc(50% - 8px);
}

#review-login label{
	display:block;
	margin-top:16px;
}

#review-login label:first-of-type{
	margin-top:0;
}

#review-login label input{
	margin-top:8px;
	padding:8px;
	width:100%;
	height:40px;
	border:1px solid var(--gray);
	border-radius:8px;
	background:var(--back);
}

#review-login .review-button{
}

#review-login input[type='submit']{
	margin:24px auto 0;
	padding:16px;
	width:100%;
	font-size:18px;
	color:#fff;
	border:1px solid #c77800;
	border-radius:8px;
	background:linear-gradient(to bottom,#FCC314,#f90);
	text-shadow:0px -1px 1px #c77800;	
}

#review-login .button-border{
	display:flex;
	margin:0;
	/* width:calc(50% - 8px); */
	width:100%;
	height:80px;
	font-size:18px;
	align-items:center;
	justify-content:center;
}

#review-login .button-border::after{
	width:16px;
	height:16px;
}

#review-login .button-border+p{
	margin-top:16px;
	font-size:12px;
}


/*--------------------------------------1.3.0.0 ------------------REVIEW POST */
#review-post h1{
	padding:0 32px;
}

#review-post .wrap{
	width:1024px;
}

#review-post form{
	display:flex;
	margin-top:24px;
	padding:0 32px;
	justify-content:space-between;
}

#review-post .supplement{
	display:flex;
	margin:32px 0 8px;
	align-items:center;
}

#review-post .supplement.mandatory::before{
	content:'必須';
	display:block;
	margin-right:8px;
	padding:4px;
	font-size:12px;
	color:var(--back);
	border-radius:4px;
	background:#d00;
}

#review-post form>div:last-of-type .supplement:first-of-type{
	margin-top:0;
}

#review-post .login_user{
	margin:0 32px;
	padding:16px;
	border:1px solid var(--gray);
	border-radius:8px;
	background:var(--surface);
}

#review-post .login_user p:first-child{
	font-size:24px;
	font-weight:bold;
}

#review-post .login_user p:first-child span{
	font-size:24px;
	font-weight:bold;
	color:#d00;
}

#review-post .login_user p:last-child{
	margin-top:16px;
}

#review-post .error{
	margin:24px 32px;
	padding:8px;
	color:var(--back);
	background:#f00;
}


/*----------------------------------------1.3.1.0 -----------REVIEW POST MAIN */
#review-post form>div:first-of-type .thumb{
	position:sticky;
	top:0;
	width:250px;
}

#review-post form>div:first-of-type .thumb img{
	margin:auto;
	width:auto;
	height:250px;
}

#review-post form>div:first-of-type a{
	margin-top:16px;
	font-size:21px;
}


/*----------------------------------------1.3.2.0 ---------REVIEW POST RATING */
#review-post .rating{
	display:flex;
	width:250px;
	flex-direction:row-reverse;
	justify-content:space-between;
}

#review-post .rating label::before{
	content:'★';
	display:block;
	font-size:40px;
	color:var(--gray);
}

#review-post .rating :checked~label::before{
	color:#f9bf3b;
}


/*----------------------------------------1.3.3.0 -----REVIEW POST INPUT AREA */
#review-post form>div:last-of-type{
	margin-left:24px;
	flex:1;
}
 
#review-post textarea{
	padding:8px;
	width:100%;
	height:100px;
	border:1px solid var(--gray);
	border-radius:6px;
	background:var(--back);
}

#review-post input[type="text"]{
	padding:8px;
	width:100%;
	border:1px solid var(--gray);
	border-radius:6px;
	background:var(--back);
}

#review-post input[type="submit"]{
	margin:24px auto 0;
	padding:16px;
	width:500px;
	font-size:18px;
	color:#fff;
	border:1px solid #c77800;
	border-radius:8px;
	background:linear-gradient(to bottom,#FCC314,#f90);
	text-shadow:0px -1px 1px #c77800;	
}


/*--------------------------------------1.4.0.0 ----------REVIEW CONFIRMATION */
#review-confirm h1{
	padding:0 32px;
}

#review-confirm .wrap{
	width:1024px;
}

#review-confirm form{
	display:flex;
	margin-top:24px;
	padding:0 32px;
	justify-content:space-between;
}


/*----------------------------------------1.4.1.0 --------REVIEW CONFIRM MAIN */
#review-confirm form>div:first-of-type .thumb{
	position:sticky;
	top:0;
	width:250px;
}

#review-confirm form>div:first-of-type .thumb img{
	margin:auto;
	width:auto;
	height:250px;
}

#review-confirm form>div:first-of-type a{
	margin-top:16px;
	font-size:21px;
}


/*----------------------------------------1.4.2.0 -------REVIEW CONFIRM RATIO */
#review-confirm .rating{
	display:flex;
	width:250px;
	flex-direction:row-reverse;
	justify-content:space-between;
}

#review-confirm .rating label::before{
	content:'★';
	display:block;
	font-size:40px;
	color:var(--gray);
}

#review-confirm .rating :checked~label::before{
	color:#f9bf3b;
}

#review-confirm form>div:last-of-type{
	margin-left:24px;
	flex:1;
}


/*----------------------------------------1.4.4.0 -----REVIEW CONFIRM MESSAGE */
#review-confirm h3{
	margin-top:24px;
	font-size:24px;
}

#review-confirm h3:first-of-type{
	margin-top:0;
}

#review-confirm h3+p{
	padding:8px;
	font-size:18px;
}

#review-confirm .attention{
	margin-top:32px;
	padding:16px;
	line-height:1.6;
	font-size:14px;
	border:1px solid var(--gray);
	border-radius:8px;
	background:var(--surface);
}

#review-confirm input[type="submit"]{
	margin:24px auto 0;
	padding:16px;
	width:500px;
	font-size:18px;
	color:#fff;
	border:1px solid #c77800;
	border-radius:8px;
	background:linear-gradient(to bottom,#FCC314,#f90);
	text-shadow:0px -1px 1px #c77800;	
}


/*--------------------------------------1.5.0.0 --------------REVIEW THANKYOU */
#review-thankyou h1{
	padding:0 32px;
}

#review-thankyou h1+p{
	padding:16px 32px 32px;
	line-height:1.6;
	font-size:16px;
}

#review-confirm .wrap{
	width:768px;
}

#review-thankyou .button-border{
	margin:auto;
	width:300px;
	text-align:center;
}


/*------------------------------------------------------------------------------
// 4.0.0.0 PC WIDTH 1000px
------------------------------------------------------------------------------*/
@media screen and (min-width:1500px){
	/*----------------------------------------------------------------------------
	// 1.0.0.0 INITIALIZE STYLE
	----------------------------------------------------------------------------*/
	main .wrap{
		width:768px;
	}

	article h1{
		font-size:40px;
	}


	/*------------------------------------1.1.0.0 -----------------FLEXIBLE BOX */
	.cart-area .primary{
		display:flex;
	}


	/*------------------------------------1.2.0.0 ------------------BREAD CRUMB */
	.breadcrumb{
		margin:0 auto;
	}


	/*--------------------------------------1.3.0.0 -----------------MAIN SECTION */
	.main-section{
		margin:32px 0 0;
	}

	.item-image{
		margin-right:24px;
	}

	.item-purchase{
		width:708px;
	}


	/*----------------------------------------1.3.1.0 -----------------ITEM IMAGE */
	.item-image>div{
		width:640px;
		height:640px;
		order:2;
	}

	.item-image>div img{
		margin:auto;
		width:auto;
		max-width:640px;
		/* height:auto;
		max-height:640px; */
		height:640px;
	}

	.item-image>ul{
		width:64px;
		width:128px;
		order:1;
	}

	.item-image li{
		margin:8px 8px 0 0;
		width:56px;
		height:56px;
		border:1px solid var(--gray);
	}

	.item-image li:nth-child(-n+2){
		margin-top:0;
	}

	.item-image li:nth-child(2n+2){
		margin-right:0;
	}


	/*----------------------------------------1.3.2.0 -----------ITEM DESCRIPTION */
	.catchcopy{
		margin-top:16px;
		line-height:1.7;
		font-size:16px;
	}


	/*------------------------------------------1.3.2.1 -----MAIN EVALUATION STAR */
	.star-area{
		margin-left:8px;
	}

	.star-area input{
		width:32px;
		height:32px;
		background:url('/js/star-rating/star.svg') left / 64px no-repeat;
		overflow:hidden;
	}

	.star-area .on{
		background:url('/js/star-rating/star.svg') right / 64px no-repeat;
	}


	/*------------------------------------------1.3.2.2 --MAIN AVERAGE EVALUATION */
	.star-area span{
		margin-left:8px;
		font-size:16px;
	}

	.star-area span::after{
		content:'点';
		font-size:12px;
	}


	/*------------------------------------------1.3.2.3 -------------TOTAL REVIEW */
	.star-area a{
		margin-left:16px;
		padding:6px 4px 4px;
		border:1px solid var(--gray);
		border-radius:4px;
		background:var(--surface);
	}

	.star-area a::before{
		content:'クチコミ：';
	}

	.star-area a::after{
		content:'件';
	}

	.star-area a:empty{
		display:none;
	}


	/*----------------------------------------1.3.3.0 ------------------CART AREA */
	.cart-area{
		margin-top:24px;
	}


	/*------------------------------------------1.3.3.1 ---------------STOCK DATA */
	.in{
		margin-bottom:24px;
		padding:4px 8px;
		font-size:24px;
		border:1px solid var(--gray);
		border-radius:8px;
		background:var(--surface);
	}

	.in.full::before,
	.in.med::before,
	.in.low::before{
		content:'';
		display:inline-block;
		margin-right:10px;
		width:50px;
		height:50px;
		background:url("/img/sp/item/stock.svg") 0 0 / auto 50px no-repeat;
		vertical-align:middle;
	}

	.in.med::before{
		background-position:-50px 0;
	}

	.in.low::before{
		background-position:-100px 0;
	}


	/*------------------------------------------1.3.3.2 --------------------PRICE */
	.cart-area .primary>div:first-child{
		margin-right:24px;
		width:340px;
	}

	.regular-price span{
		display:inline-block;
		margin-right:8px;
		padding:6px;
		font-size:12px;
		border:1px solid var(--gray);
		border-radius:4px;
		background:var(--surface);
	}

	.regular-price s{
		text-decoration:line-through;
	}

	/* NORMAL PRICE --------------------------------------------------------------*/
	.price-area .price{
		font-size:24px;
	}

	.price-area .price span{
		display:inline-block;
		margin-right:8px;
		padding:4px;
		font-size:13px;
		border:1px solid var(--text);
		border-radius:4px;
	}

	/* PRICE OFF -----------------------------------------------------------------*/
	.price-area .discount{
		margin-left:8px;
	}

	.price-area .discount span{
		margin-right:4px;
		font-weight:bold;
	}

	/* POINT ---------------------------------------------------------------------*/
	.price-area .point{
		font-size:16px;
	}

	.price-area .point::before{
		content:'ポイント';
		display:inline-block;
		margin-right:4px;
		padding:4px;
		font-size:12px;
		border:1px solid var(--gray);
		border-radius:4px;
	}

	.price-area .point span{
		margin-left:8px;
		font-size:12px;
	}


	/*------------------------------------------1.3.3.3 -------------SELECT CHIPS */
	.form-select-chips:not(:first-of-type){
		margin-top:16px;
	}

	.form-select-chips li{
		width:calc((100% - 16px) / 3);
	}

	.form-select-chips li:nth-child(3n+2){
		margin:0 8px;
	}

	.form-select-chips li:nth-child(n+4){
		margin-top:8px;
	}

	.form-select-chips label{
		height:56px;
		font-size:12px;
	}

	.form-select-chips input:disabled+label{
		color:var(--gray);
		border:2px solid var(--surface);
		background:var(--surface);
	}

	.form-select-chips input:checked+label{
		color:var(--main);
		color:var(--back);
		border:2px solid var(--main);
		background:var(--main);
	}


	/*------------------------------------------1.3.3.4 ----------PURCHASE BUTTON */
	#buyform input[type='submit']{
		margin:16px 0 0;
		padding:8px 0;
		width:100%;
		height:60px;
		font-size:20px;
		font-family:'fontello';
		color:#fff;
		border:1px solid #c77800;
		border-radius:8px;
		background:#00B16A;
		background:linear-gradient(to bottom, #FCC314, #f90);
		cursor:pointer;
		text-shadow:0px -1px 1px #c77800;
	}

	.goods_status{
		font-size:20px;
		text-align:center;
	}


	/*------------------------------------------1.3.3.5 --------------WISH BUTTON */
	.wish-list{
		margin-top:16px;
	}

	.wish-list a{
		padding:8px;
		border:1px solid var(--gray);
		border-radius:8px;
		background:var(--surface);
		text-align:center;
	}


	/*----------------------------------------1.3.4.0 -------SHIPPING STATUS AREA */
	.cart-area .secondary{
		position:static;
		display:block;
		margin-top:32px;
		width:auto;
	}

	.cart-area .secondary>div:first-child,
	.cart-area .secondary>div:last-child{
		margin:0;
		width:auto;
	}


	/*------------------------------------------1.3.4.1 ----------SHIPPING STATUS */
	.shipping{
		line-height:1.4;
		font-size:16px;
		text-align:center;
	}

	.shipping span{
		font-size:24px;
	}


	/*------------------------------------------1.3.4.2 ---------GENERAL DELIVERY */
	.shipping+.button-border{
		margin-top:8px;
	}


	/*------------------------------------------1.3.4.3 --SHIPPING SCHEDULED DATE */
	.cart-area .secondary h3{
		margin-top:24px;
		font-size:20px;
	}

	.cart-area .secondary .deli-check{
		position:relative;
		/* margin:0 8px; */
		padding:16px;
		width:100%;
		border:1px solid var(--gray);
		border-radius:8px;
	}

	.cart-area .secondary .deli-check>div:first-child{
		/* width:calc((100% - 16px) / 2); */
		width:calc(55% - 8px);
	}

	.cart-area .secondary .deli-check>div:last-child{
		/* width:calc((100% - 16px) / 2); */
		width:calc(45% - 8px);
	}

	.cart-area .secondary .deli-check div:first-child>p:first-child{
		font-size:12px;
	}

	.cart-area .secondary form{
		margin-top:8px;
	}

	.cart-area .secondary form #delivery_code{
		margin-right:8px;
		padding:8px;
		width:264px;
		font-size:16px;
		border:1px solid var(--gray);
		border-radius:4px;
	}

	.cart-area .secondary form #delivery_send{
		width:90px;
		color:var(--back);
		border-radius:4px;
		background:var(--accent);
	}

	.cart-area .secondary .deli-check>div:last-child{
		padding:16px 0;
		border-radius:8px;
		background:var(--surface);
	}

	.cart-area .secondary .deli-check>div:last-child p{
		font-size:20px;
		text-align:center;
	}

	.cart-area .secondary .deli-check>div:last-child p:first-child{
		margin-bottom:8px;
	}


	.cart-area .secondary .deli-check>div:last-child #address,
	.cart-area .secondary .deli-check>div:last-child #expected{
		font-size:24px;
		font-weight:bold;
	}


	/* LONG SLIDE LIST ---------------------------------------------------------*/
	.list-long>div{
		overflow:hidden;
	}
	
	.list-long ul{
		margin:8px 64px;
	}

	.list-long li{
		width:190px;
	}

	/* SCROLL BUTTON ------------------------------------------------------------*/
	.list-long .button-prev-scroll,
	.list-long .button-next-scroll{
		width:60px;
	}
	
	/* LONG SLIDE LIST ---------------------------------------------------------*/
	.list-long .thumb img{
		margin:auto;
		width:auto;
		height:190px;
	}
	
	/*--------------------------------------4.2.3.4 --------------PRODUCT PRICE */
	.list-long .price{
		margin-top:16px;
		font-size:20px;
	}

	.list-long .price s{
		margin-right:8px;
		font-size:13px;
		text-decoration:line-through;
	}
	

}









.list-review{
	.staff_comment{
		display:flex;
		/* margin:5px 5px 0; */
		/* background:#efefef; */
		flex-wrap:wrap;;
		padding:16px;
		border-radius:8px;
	}
	
	.staff_prof{
		display:flex;
		margin-right:16px;
		flex-direction:column;
		align-items:center;

		.staff_img{
			width:40px;
			border-radius:50%;
			/* margin-right:10px; */
		}
		.staff_name{
			margin-top:8px !important;
			font-size:12px;
			color:#555;
			margin:0;
		}
	}
	.staff_message{
		position:relative;
		margin:0;
		padding:16px 0 16px 16px;
		line-height:1.7;
		font-size:12px;
		border-radius:8px;
		background:#f3f3f3;
		flex:1;

		a{
		  text-decoration: underline;
		}

		&::before{
			content:'';
			position:absolute;
			top:16px;
			left:-20px;
			display:block;
			width:0;
			height:0;
			border:8px solid transparent;
			border-right:12px solid #f3f3f3;
		}
	}
	.staff_time{
		display:block;
		padding:8px 0 0;
		width:100%;
		font-size:10px;
		color:#363540;
		text-align:right;
	}
}