@charset "utf-8";
@media all{
.deatail h3{
	font-size:16px;
	margin-bottom:15px;
	color: rgba(102,204,204,1);
}
.sell{
	clear:both;
	text-align:center;
	margin:10px 0px;
	overflow:hidden;
}
.sell dl {
    display: flex;
    flex-wrap: wrap;
}

.sell dt {
    width: 28%;
    margin: 10px 25px 10px 0px;
    overflow: hidden;
}
.sell dd {
	text-align:left;
    width: 60%;
    margin: 10px 0px 10px 0px;
    overflow: hidden;
}
.fdbox{
	width:100%;
	height:100%;
	overflow:hidden;
	text-align:center;
}
.fdbox dl{
	clear:both;
	width:100%;
	height:100%;
	overflow:hidden;
	margin: 10px -10px 0px;
}

.fdbox dd{
	float:left;
	margin-bottom:10px;
	overflow:hidden;
}
.fdbox table{
	width:100%;
	border-spacing:0px 1rem;
	margin: 10px -15px 10px;
	overflow:hidden;
}
.visually-hidden{
	position:absolute;
	width:1px;
	height:1px;
	overflow:hidden;
	clip:rect(0,0,0,0);
}
.fdbox input[type="text"] {
	-webkit-appearance: none;
	appearance: none;

	color: rgba(0,0,0,1);
	font-size: 14px;

	border: 1px rgba(200,200,200,1) solid;
	border-radius: 3px;
	overflow:hidden;

	width:40px;
	text-align : center;
	padding:5px 0px;

	margin: 0px 2px 1px 4px;
}

.fdbox input[type="submit"] {
	-webkit-appearance: none;
	appearance: none;

	background: linear-gradient(
		to bottom,
		rgba(255, 255, 255, 1),
		rgba(235, 235, 235, 1)
	);
	background-repeat: no-repeat;
	
	color: rgba(0,0,0,1);
	font-size: 14px;

	border: 1px rgba(200,200,200,1) solid;
	border-radius: 3px;
	overflow: hidden;

	width:100px;
	padding:5px 0px;

	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.8),
		0 1px 0 rgba(180, 180, 180, 1);
	transition: 
		transform 0.08s ease,
		box-shadow 0.08s ease,
		opacity 0.08s ease;

	cursor: pointer;
	touch-action: manipulation;
}

.fdbox input[type="submit"]:active {
	transform: translateY(1px);
	background: linear-gradient(
		to bottom,
		rgba(235, 235, 235, 1),
		rgba(255, 255, 255, 1)
	);

	box-shadow:
		inset 0 1px 2px rgba(180, 180, 180, 0.6),
		0 0 0 rgba(0, 0, 0, 0);
}
.fdbox input[type="submit"] {
	cursor: pointer;
	touch-action: manipulation;
}
.fdbox input[type="submit"]:focus {
	outline: none;
}
.fdbox input[type="submit"]:hover {
	opacity: 0.8;
}

.cel_color_name{
	width:35%;
}
.cel_volume{
	width:25%;
}
.cel_price{
	width:20%;
}
.cel_color{
	width:15%;
}
.cel_quantity{
	width:15%;
}
.cel_botton{
	width:30%;
}
.colsambnu{
	width:15%;
	padding:5px 0px;
	background-color: rgba(243,216,197,1);
}

.colsambpe{
	width:15%;
	padding:5px 0px;
	background-color: rgba(250,222,211,1);
}
.colsamccp{
	width:15%;
	padding:5px 0px;
	background-color: rgba(253,238,235,1);
}
.colsampfb211{
	width:15%;
	padding:5px 0px;
	background-color: rgba(253,217,159,1);
}
.colsampfp210{
	width:15%;
	padding:5px 0px;
	background-color: rgba(250,205,174,1);
}
.colsampfb212{
	width:15%;
	padding:5px 0px;
	background-color: rgba(232,190,150,1);
}

.colsamrpnu{
	width:15%;
	padding:4px 0px;
	border:1px solid rgba(204,204,204,1);
	background-color: rgba(251,248,247,1);
}
.colsamrpna{
	width:15%;
	padding:5px 0px;
	background-color: rgba(244,209,170,1);
}
.colsammlnp{
	width:15%;
	padding:5px 0px;
	background-color: rgba(181,112,104,1);
}
.colsamsFDme{
	width:15%;
	padding:5px 0px;
	background-color: rgba(237,204,173,1);
}
.colsamsFDli{
	width:15%;
	padding:5px 0px;
	background-color: rgba(246,226,215,1);
}
.product-right dt{
	font-weight:700;
	margin:15px 0px 5px;
	overflow:hidden;
}
.product-right dd{
	margin:0px 0px 10px;
	overflow:hidden;
}
.explanation p{
	margin-bottom:10px;
	overflow:hidden
}

}
@media screen and (max-width:640px){
.deatail{
	width:100%;
	height:100%;
	overflow:hidden;
}

.deatail h2{
	width:93%;
	height:100%;
	overflow:hidden;
	font-size:90%;
	border-left:10px rgba(102,204,204,1) solid;
	border-bottom:2px rgba(102,204,204,1) solid;
	padding:5px;
	margin-bottom:10px;
}
/*
.deatail h3{
	margin-bottom:15px;
	color: rgba(102,204,204,1);
}
*/
.deatail ul{
	overflow:hidden;
}
.deatail li{
	padding-top:10px;
	width:99%;
	color: rgba(102,102,102,1);
	font-size:14px;
	margin-bottom: 10px;
}

.ldl{
	text-align:left;
	clear:both;
	float:left;
	width:35%;
	margin-left:10px;
}
.ldr{
	text-align:left;
	float:left;
	width:60%;
	margin-bottom:10px;
}
.ldw{
	clear:both;
	width:90%;
	margin-bottom:10px;
}
.img30{
	width:30%;
	height:auto;
}
.product-left, .product-right{
	padding:10px 10px;
	line-height:1.4em;
}
}

@media screen and (min-width: 641px){

.smlF{
	font-size:90%;
}

.deatail{
	width:100%;
	height:100%;
	overflow:hidden;
}

.deatail h2{
	width:97%;
	height:100%;
	overflow:hidden;
	font-size:16px;
	border-left:10px rgba(102,204,204,1) solid;
	border-bottom:2px rgba(102,204,204,1) solid;
	padding:5px;
	margin-bottom:10px;
}
.deatail ul{
	overflow:hidden;
}
.deatail li{
	padding-top:10px;
	width:48%;
	float:left;
	color: rgba(102,102,102,1);
	font-size:14px;
	margin-bottom: 10px;
	line-height:18px;
}
.product-left, .product-right{
	padding-top:10px;
	width:48%;
	float:left;
	color: rgba(102,102,102,1);
	font-size:14px;
	margin-bottom: 10px;
	line-height:18px;
}

.ldl{
	font-weight:normal;
	text-align:left;
	clear:both;
	float:left;
	width:28%;
	margin-left:25px;
}
.ldr{
	text-align:left;
	float:left;
	width:60%;
}
.ldw{
	clear:both;
	width:100%;
}

}