@charset "UTF-8";

/*common*/
.row:before, .row:after { width:0px; }

.letter-space{
	letter-spacing:0.2rem;
}
a{
	color:#222!important;
}
a:hover{
	color:#555!important;
	cursor:pointer;
	opacity:0.8;
}
body{

}

.pc{
	dicplay:block;
}
.sp{
	display:none;
}
.tb{
	display:none;
}
.img-100{
	width:100%;
}



/*ヘッダー　メイン画像*/
.slider-top{
	display:flex;
	height:300px;
}
.slide-image{
	width:50%;
	height: auto;
    overflow: hidden;
    position: relative;
}
.main_img {
    z-index:-2;
    opacity: 0;
    width: 100%;
    height: 320px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-animation: HMKanime 40s 0s infinite;
    animation: HMKanime 40s 0s infinite;
}
.main_img:nth-of-type(2) {
      -webkit-animation-delay: 10s;
      animation-delay: 10s; }
.main_img:nth-of-type(3) {
      -webkit-animation-delay: 20s;
      animation-delay: 20s; }
.main_img:nth-of-type(4) {
      -webkit-animation-delay: 30s;
      animation-delay: 30s; }
@keyframes HMKanime {
  0% {
        opacity: 0;
    }
    14% {
        opacity: 1;
    }
    25% {
        opacity: 1;
		transform: scale(1.1) ;
        z-index:9;
    }
    44% { opacity: 0 ;z-index:9;}
	100% { opacity: 0 ;z-index:9;}
}

.slide-text{
	width:50%;
	background:#f0dc6d;
	padding:30px 0 40px 40px;
}
.slide-text p{
	width:66%;
	font-size:1.4rem;
	font-weight:bold;
	color:#222222;
}
.slide-text img{
	width:340px;
	height:110px;
}

/*ハンモック一覧 */
/*メインエリア*/
.hmk-top-main{
	background:url("https://www.rakuten.ne.jp/gold/auc-susabi/cat/img/hammock/new/bg-01.jpg") no-repeat;
	background-size:contain;
	width:100%;
}
.hmk-top-maintxt{
	max-width:800px;
	text-align:center;
	margin:4rem auto 3rem;
	font-weight:bold;
}
.hmk-top-maintxt h1{
	font-size:0;
	width:480px;
	margin:70px auto 40px;
}

.hmk-top-maintxt p{
	font-size:1.6rem;
	line-height:2;
	color:#222;
}
.hmk-top-btnarea{
	width:400px;
	height:141;
	margin:auto;
	margin-top:4rem;
}

.arrow-y-down{
	display:block;
	width:104px;
	height:37px;
	margin:3rem auto 2rem;
	transition: .3s ease;
	cursor: pointer;
	background:url(https://www.rakuten.ne.jp/gold/auc-susabi/cat/img/hammock/new/arrow-y-down.png);
	background-size:contain;
}
.arrow-y-down:hover{
	transform: translateY(6px)!important;
}

/*一覧1*/
.hmk-top-ichiran1 h2.ttl-torituke{
	display:block;
	width:325px;
	height:96px;
	margin:8rem auto 6rem;
	font-size:0;
}
.hmk-top-ichiran1 h2.ttl-tokucyo{
	display:block;
	width:561px;
	height:113px;
	margin:8rem auto 6rem;
	font-size:0;
}
.hmk-top-ichiran1 img{
	width:100%;
}
.hmk-top-ichiran2 img{
	width:100%;
}
/*一覧2*/
.hmk-top-ichiran2 {
	width:100%;
	background-color:#f0dc6d;
	background-image:url("https://www.rakuten.ne.jp/gold/auc-susabi/cat/img/hammock/new/bg-wave-01.gif"),url("https://www.rakuten.ne.jp/gold/auc-susabi/cat/img/hammock/new/bg-wave-02.gif");
	background-size:contain;
	background-repeat: no-repeat;
	background-position:top center, bottom center;
	padding:1rem 0 8rem 0;
}
.hmk-top-ichiran2 h2.ttl-zensyohin{
	display:block;
	width:612px;
	height:66px;
	margin:12rem auto 4rem;
	font-size:0;
}
.hmk-top-ichiran2 h3{
	font-size: 2.6rem;
	display: flex;
	justify-content: center;
	align-items: center;
	margin:6rem auto 4rem;
}
.hmk-top-ichiran2 h3:before, .hmk-top-ichiran2 h3:after {
	content: "";
	flex-grow: 1;
	height: 2px;
	background: #222;
	display: block;
	max-width:200px;
	margin:0 1rem;
}

.item-list-ul{
	text-align:center;
	height: auto;
    line-height:auto;
}
.item-box-center{
	text-align:center;
	margin:1rem 0 4rem;
	display:inline-block;
	padding:0 15px;
	box-sizing:border-box;
	width:22%;
	max-width:22%;
	vertical-align: top;
}
.hmk-top-ichiran2 .item-box-center img{
	border-radius:20px;
}


.syouhinmei{
	margin:6px 0 6px 6px;
	font-size:1.8rem;
	line-height:1.3;
	font-weight:bold;
	text-align:left;
}
.kakaku{
	margin:0 0 1rem 6px;
	font-size:1.4rem;
	line-height:1.5;
	text-align:left;
	font-weight:bold;
}
.syouhin-tags{
	display:inline-block;
	font-size:1.2rem;
	line-height:1.5;
	font-weight:bold;
	text-align:center;
	width:46%;
	margin-right:1%;
	margin-bottom:2%;
	padding:6px 0;
	border-radius:10px;
	background-color:#f0dc6d;
}
.syouhin-tags-group{
	margin-bottom:1.8rem;
	text-align:left;
}
.btn-syohin{
	display:block;
	border:#222 solid 2px;
	border-radius:30px;
	padding:4px;
	width:98%;
	font-weight:bold;
	text-align:center;
	color:#222;
	max-width:400px;
	margin:0.5rem auto;
	transition: .3s ease;
	cursor: pointer;
}
.btn-syohin:hover{
	border:#555 solid 2px;
	color:#555!important;
	transform: translateY(-4px);
}
@media screen and ( max-width:800px) {
	.slide-text p{
		width:84%;
	}
}
@media screen and ( max-width:640px) {
	.pc{
	display:none;
	}
	.sp{
		display:block;
	}
	.tb{
		display:block;
	}
	.hmk-top-main{
		width:100%;
		margin:0;
		padding:0;
	}
	.slider-top{
		display:block;
		height:auto;
	}
	.slide-image{
		display:block;
		width:100%;
		height:300px;
	}
	.slide-text{
		display:block;
		width:100%;
		height:auto;
		background:#f0dc6d;
		padding:2.6rem 0;
		text-align: center;
	}
	.slide-text p{
		width:90%;
		font-size:1.6rem;
		font-weight:bold;
		color:#222222;
		margin:1rem auto;
	}
	.slide-text img{
		width:300px;
		height:97px;
		margin:auto;
	}

	.hmk-top-maintxt p{
		max-width:100%;
		text-align:center;
		margin:4rem auto 3rem;
		font-weight:bold;
		text-shadow: 2px 2px 1px #fff,
					-2px 2px 1px #fff,
					2px -2px 1px #fff,
					-2px -2px 1px #fff;
	}
	.hmk-top-maintxt h1{
		font-size:0;
		width:100%;
		margin:4rem auto 2rem;
		padding:0 1rem;
	}

	/*メインエリア*/

	.hmk-top-main{
		background:url("https://www.rakuten.ne.jp/gold/auc-susabi/cat/img/hammock/new/bg-01-sp.jpg") no-repeat;
		background-size:contain;
		background-position:top 4rem;
		width:100%;
	}
	/*商品一覧*/

	.hmk-top-ichiran1 h2 {
		display: block;
		width: 90%;
		height: auto;
		margin: 6rem auto 4rem;
	}
	.hmk-top-ichiran1 h2.ttl-torituke {
		display: block;
		width: 90%;
		height: auto;
		margin: 6rem auto 4rem;

	}
	.hmk-top-ichiran1 h2.ttl-tokucyo {
		display: block;
		width: 90%;
		height: auto;
		margin: 6rem auto 4rem;

	}
	.hmk-top-ichiran2 h2.ttl-zensyohin {
		display: block;
		width: 90%;
		height: auto;
		margin: 8rem auto 4rem;
	}

}
@media screen and ( max-width:960px)and (min-width:600px){

		.item-box-center{
		text-align:center;
		margin:1rem auto 4rem;
		display:inline-block;
		padding:0 15px;
		box-sizing:border-box;
		width:48%;
		max-width:300px;
		vertical-align: top;
	}
}
@media screen and (max-width:599px){
	.item-box-center{
		text-align:center;
		margin:1rem auto 4rem;
		display:inline-block;
		padding:0 15px;
		box-sizing:border-box;
		width:100%;
		max-width:300px;
		vertical-align: top;
	}
	.hmk-top-ichiran2 h3:before, .hmk-top-ichiran2 h3:after {
		display:none;
	}
}
@media screen and ( max-width:375px) {
	.hmk-top-maintxt p{
			font-size:1.4rem;
	}
	.hmk-top-ichiran2 h3{
		font-size: 2.2rem;
		display: block;
		width:100%;
		margin:6rem auto 4rem;
		text-align:center;
	}

}
