@charset "euc-jp";
/* ///////////////////////////////


ラグマット特集

PC用

///////////////////////////////
*/
body,html{
min-width:1150;
}
#pageContents.ragmatCnt{width: 950px !important;	float: none !important;background:#dbdbdb;padding-bottom: 50px;}
#pageContents.ragmatCnt a{color:#333}
#pageContents.ragmatCnt p {margin: 0;font-size: 13px;line-height:2.0em;}
#pageContents .ttlCnt{margin:0}
.ttlCnt p{ padding:10px 4% 20px!important; text-align:center; font-weight:500; font-size:14px}


.ctgCnt{margin-top:50px; overflow:hidden; font-family: "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif; font-weight:500}
.ctgCnt h2{margin:0; padding:0; background:#515151; display:block; line-height:0}

.ragpoint{margin:20px; background:#fff; padding:30px 20px;filter: drop-shadow(1px 1px 1px rgba(0,0,0,0.6));}
.ragpoint h2{margin:0 0 0 20px; padding:0; line-height:0}
.ragpoint ul{overflow:hidden;}
.ragpoint ul li{float:left; width:25%}
#pageContents.ragmatCnt .ragpoint p{padding: 5px 20px 20px;line-height: 1.8em; font-weight:500; letter-spacing:-0.8px}

.itembox{background:#fff; overflow:hidden; float:left;}
.itembox h3{line-height:0;/* font-weight:bold; */}
.itembox a.imgbox{padding:4px; float:left; position:relative; line-height:0}
.itembox .infobox{ overflow:hidden;  color:#000}
.itembox .infobox .Catch{float:left;
font-family: "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif; font-weight:bold; font-size:24px; line-height:38px; padding:5px 0 5px 10px;}
.itembox .infobox .Color{float:right}
.itembox .sceneimg{width: 100%; object-fit: cover;}/*トリミング　高さ固定img*/




.itembox a p.icon{position:absolute;bottom: 6px;left: 15px;z-index:9999999;}
.itembox a p.icon img{border-radius:5px; margin-right:0px; width:53px}


.itembox ul{width: 100%; overflow:hidden; padding:20px 0 }
.itembox ul li{border-top: dashed #999 1px;padding:0px 0px 0px;overflow:hidden;}
.itembox ul li a{ display:block}
.itembox ul li .size{float:left;width:50%;/* padding-left:15px; */margin-bottom:5px; font-size:15px; font-weight:bold }
.itembox ul li .price{float:right;width:42%; margin-top:3px; text-align:right;  font-size:15px; color:#544078}
.itembox ul li .price small{font-size:10px}


/*横1*/
.itembox.clm1{margin:0 20px;}
.itembox.clm1 .infobox{float:left; width:408px;padding:40px 20px 0}
.itembox.clm1 .sceneimg{width: 454px; height: 300px;}
.itembox.clm1 h3{background:#dbdbdb; display:block}


/*横2*/
.itembox.clm2{width:445px; margin:50px 0 50px 20px;}
.itembox.clm2 .infobox{padding:10px 20px 0}
.itembox.clm2 .sceneimg{width: 437px; height: 220px;}
.itembox.clm2 ul{padding-top:0px}
.itembox.clm2 h3{background:#dbdbdb; display:block}

/*横3*/
.itembox.clm3{width:290px; margin:20px 0 0 20px;}
.itembox.clm3 .Catch{width:100%; font-size:21px; line-height:34px; }
.itembox.clm3 h3{float:left;line-height: 20px;margin: 10px 0 0 10px;font-size: 14px;}
.itembox.clm3 .Color img{float:right; height:40px; margin-top:10px}
.itembox.clm3 .infobox{padding:0px 10px 0}
.itembox.clm3 .sceneimg{width: 282px; height: 194px;}
.itembox.clm3 ul{padding-top:10px; height:110px}
.itembox.clm3 a p.icon img{border-radius:5px; border:1px solid #fff; margin-right:0px; width:42px}


#ctg03 .itembox.clm3 ul{padding-top:10px; height:30px}


#original{}
#original .itembox{margin-top:0;position: relative;}
#original h2{background:none!important;}
#original h3{font-size: 16px; font-weight:bold; margin:0px 10px 0px 0;line-height: 1.5em;background: none;padding: 0;}
#original .sceneimg2{width:48.8%; margin:0.4% 0 auto;}/*トリミング　高さ固定img*/
#original .Catch{font-weight: normal;font-size: 14px;width: 46%;position: absolute;left: 10px;top: 317px;line-height: 1.7em;}
#original .Color{width:30%; float:right; overflow:hidden}
#original .Color img{width:42%; float:left;margin: 3%;}

#original .itembox.clm1 .infobox{padding:30px 20px 30px}
#original img.newicon{position: absolute;top: 266px;right: 100px;z-index: 99;width: 77px;}


/*ブロックごとに現れる 用*/
.animate_item{position: absolute; top: 0; left: 0;z-index:996;opacity:0;}
.animate_item.fadeIn{-webkit-animation-duration: 2.4s; animation-duration: 2.4s; -webkit-animation-fill-mode: both; animation-fill-mode: both;
-webkit-animation-name: fadeIn; animation-name: fadeIn; z-index:997;}
.animate_item.fadeOut{ -webkit-animation-duration: 2s; animation-duration: 2s; -webkit-animation-fill-mode: both; animation-fill-mode: both;
-webkit-animation-name: fadeOut; animation-name: fadeOut; z-index:996;}

@-webkit-keyframes fadeIn{
	from{opacity: 0;}
	to{opacity: 1;}
}
@keyframes fadeIn{
	from{opacity: 0;}
	to{opacity: 1;}
}
@-webkit-keyframes fadeOut{
	from{opacity: 1;}
	to{opacity: 0;}
}
@keyframes fadeOut{
	from{opacity: 1;}
	to{opacity: 0;}
}
.movebox{transition: 0.8s; opacity: 0; transform: translate(0,60px); -webkit-transform: translate(0,60px); }
.moveboxon{opacity: 1.0; transform: translate(0,0); -webkit-transform: translate(0,0);}

@keyframes fadein {
from {opacity:0;}
to {}
}