@import url('particles.css');
@import url('owl.carousel.min.css');
@import url('owl.theme.default.min.css');
#mv img,.topbanner img,.newproducts img{
	width:100%;
}
#mv a:hover img{
	opacity:1;
}
#mv{
	position:relative;
}
#mv >.mainvisual{
	background:#ffffff;
	opacity:0;
	transition:opacity 1.5s;
}
#mv >.mainvisual.active{
	position:relative;
	z-index:1;
	opacity:1;

}
#mv >.mainvisual:not(.active){
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
}


.more_btn{
	border-radius:50px;
	line-height:1;
	box-shadow:0 0 4px rgba(0,0,0,0.4);
	letter-spacing:0.06em;
	background:#ffffff;
	text-align:center;
	font-weight:500;
}
.more_btn a,a .more_btn{
	position:relative;
}
.more_btn a{
	display:block;
}
.more_btn i,.essential .more_btn2 a i{
	vertical-align:middle;
	margin-right:5px;
	font-size:1.2em;
}
#topbnr{
	width:100%;
	overflow:hidden;
}
.newproducts .bnr_box{
	display:table;
	width:100%;
}
#topbnr .youtube_movie{
	position:relative;
}
#topbnr .youtube_movie .movie_btn{
	position:absolute;
	background:#ffffff;
	text-align:center;
	line-height:1;
	border-radius:100%;
	font-size:0.929em;
	z-index:50;
	box-shadow:0 0 5px rgba(0,0,0,.3);
}
#topbnr .youtube_movie .movie_btn span{
	display:block;
	color:#94c5e1;
	letter-spacing:0.02em;
	font-size:2.000em;
}
#topbnr .youtube_movie .movie_btn i{
	display:block;
}
#topbnr .movie{
	position: relative;
	height: 0;
	overflow: hidden;
	padding-top: 61.7647%;
}
#topbnr .movie iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}
.newproducts .bnr_box li{
	display:table-cell;
	width:50%;	
}
.newproducts .bnr_box{
	line-height:0;
}
#recommended{
	position:relative;
	overflow:hidden;
}
#recommended:before{
	content:"";
	display:block;
	width:100%;
	height:7px;
	background: rgb(0,0,0);
	background: linear-gradient(180deg, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0) 100%);
	position:absolute;
	top:0;
	right:0;
	left:0;
	z-index:1;
}
#recommended >section{
	z-index:11;
	position:relative;
}
#recommended #item_search{
	background:none;
	z-index:10;
	position:relative;
}
.recommend h3{
	display:block;
	text-align:center;
}
.pickup .pu_bnr{
	overflow:hidden;
	clear:both;
}
.pu_bnr .slick-list{ margin-bottom: 20px; overflow: visible;}
/*.pickup .pu_bnr li{
	float:left;
	width:25%;
}*/
.news li{
	border-bottom:1px solid #e2e2e2;
	display:flex;
	flex-wrap:wrap;
	align-items:center;
}
.news li:last-child{
	border-bottom:0;
	margin-bottom:0;
}
.news .post_category{
	color:#ffffff;
	text-align:center;
	line-height:1;
	display:flex;
	justify-content:flex-end;
	font-weight:600;
	font-size:0.821em;
}
.news .post_category >div{
	padding-top:5px;
	padding-bottom:5px;
}
.news .post_category .new{
	background:#dbbd32;
	width:50px;
}
.news .post_category .post{
	width:100px;
}
/*.news .post_category .post_ct{
	background:#279ea5;
}
.news .post_category .post_at{
	background:#5fa5cd;
}
.news .post_category .post_im{
	background:#d66459;
}
.news .post_category .post_iv{
	background:#f28e4c;
}
.news .post_category .post_it{
	background:#a6d1f0;
}*/
.news .date{
	font-weight:400;
	color:#8bb3ca;
	letter-spacing:0.08em;
}
.news .caption a{
	display:block;
	letter-spacing:0.06em;
}
.essential{
	text-align:center;
}
.essential p{
	letter-spacing:0.04em;
}
.essential .content_box h3{
	letter-spacing:0.06em;
	font-weight:500;
	color:#ffffff;
	line-height:1;
}
.essential .content_box h3 span{
	display:block;
	letter-spacing:0.3em;
	color:#b8d6e7;
	font-weight:normal;
}
.essential .content_box{
	background:url(../image/eq_bg.jpg) repeat-x center /auto 100%;
}
.essential .content_box p{
	color:rgba(255,255,255,0.7);
}
.essential .more_btn2{
	border-radius:50px;
	border:1px solid rgba(255,255,255,0.5);
	font-weight:500;
}
.essential .more_btn2 a{
	color:#ffffff;
	display:block;
}
.owl-dots{
	display:block;
	position:relative;
	text-align:center;
}
 .owl-carousel button.owl-dot{
	display:inline-block;
	width:6px;
	height:6px;
	margin:0 5px;
	background:#8ca1b3;
	opacity:0.5;
	border-radius:100%;
}
 .owl-carousel button.owl-dot.active{
	opacity:1;
}
.ouchi{
	position: fixed;
	bottom:20vh;
	right:5%;
	background:url(../image/pop_img_o.png) no-repeat center;
	z-index:99999;
}
.ouchi a{
	display:block;
	width:217px;
	height:217px;
}
.ouchi .close_btn{
	width:45px;
	height:45px;
	background:url(../image/pop_btn_o.png) no-repeat center;
	position:absolute;
	right:0;
	bottom:0;
	cursor: pointer;
}
/*メインビジュアル下スライダー*/

#topbnr >.wrap{
	position:relative;
	overflow:hidden;
}
#topbnr ul{	
	line-height:0;
	overflow:hidden;
/*	clear:both;
	width:100vw;
	float:left;*/
	position: relative;
	transition:left 0.3s;
 	 left:0;
	margin: -33px auto 0;
	width:180px;/*150 180 210 240 270*/
	text-align: center;

	transform: translate(0%, 0%);
-webkit-transform: translate(0%, 0%);
-ms-transform: translate(0%, 0%);
}
#topbnr li{
	width:33.3%;
	float:left;
}
#topbnr .t_paging{
	display:flex;
	justify-content: center;
}
#topbnr .t_paging >span{
	display:block;
	width:6px;
	height:6px;
	background:#8ca1b3;
	opacity:0.5;
	border-radius:50%;
	margin-right:5px;
	margin-left:5px;
}
#topbnr .t_paging >span.active,#topbnr .t_paging >span:hover{
	opacity:1;
}



#catday{
	background: url( "../image/bg01.png") repeat 0 0;
	text-align: center;
	padding: 0 0 100px;
}
#catday .catday_contents{position: relative;}
#catday .catday_title{
	max-width: 1600px;
	margin: 0 auto;
	position: relative;
}
#catday .catday_title_sp{display: none;}

#catday .catday_movie{
	margin-top: -250px;
	position: relative;
	background: url("../image/item01.png") no-repeat center 0;
}
#catday .catday_movie > div{
	width: 900px;
	margin: 0 auto;
	box-sizing: border-box;
	border: solid 10px #fff;
}
#catday  .movie {
	position: relative;
	height: 0;
	overflow: hidden;
	padding-top: 498px;
}
#catday .movie iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.pu_bnr a{ width: 100%; display: inline-block; }
/*PC
----------------------------------------------------*/
@media screen and (min-width:1081px),print{
	#main >section{
		padding-top:70px;
	}
	.fade, #topbnr{animation: fade-in 1s; animation-fill-mode: forwards;}
	@keyframes fade-in {
		from {opacity: 0;}
		to {opacity: 1;	}
	}
	

	.more_btn a,a .more_btn{
		padding:10px;
	}

	.newproducts li .more_btn{
		margin-right:auto;
		margin-left:auto;
		transform:translateY(40%);
		font-size:1.107em;
	}
	.newproducts li:first-child .more_btn{
		width:240px;
	}
	.newproducts li:last-child .more_btn{
		width:280px;
		transform:translateY(40%);
	}
	#recommended{
		margin-top:80px;
	}
	.recommend{
		position:relative;
		padding-top:100px;
	}
	#recommended .more_btn{
		width:280px;
		margin-right:auto;
		margin-left:auto;
		font-size:1.071em;
		position:absolute;
		right:0;
		left:0;
		bottom:-4em;
		margin:auto;
	}

	#topbnr .sp{ display: none!important; }

	.pickup{
		position:relative;
	}
	.pickup .owl-dots{
		margin-top:20px;
	}
	.pickup .more_btn{
		position:absolute;
		width:200px;
		top:76px;
		right:43px;
		margin:auto;
	}
	.news{
		position:relative;
	}
	.news .more_btn{
		position:absolute;
		width:220px;
		top:76px;
		right:0;
		left:760px;
		margin:auto;
	}
	.news ul{
		width:980px;
		margin-right:auto;
		margin-left:auto;
	}
	.news li{
		border-bottom:1px solid #e2e2e2;
		display:flex;
		flex-wrap:wrap;
		align-items:center;
		padding-bottom:20px;
		margin-bottom:20px;
	}
	.news .date{
		padding:0 13px;
	}
	.news .post_category{
		width:150px;
	}
	.essential h3{
		font-size:2em;
		margin-bottom:40px;
	}
	.essential h3 span{
		font-size:0.500em;
		margin-bottom:10px;
	}
	.essential .content_box{
		padding-top:50px;
		padding-bottom:30px;
	}
	.essential p{
		font-size:0.964em;
		line-height:1.926em;
		margin-bottom:15px;
	}
	.essential .more_btn2{
		width:120px;
		font-size:0.929em;
		margin-right:auto;
		margin-left:auto;
		overflow:hidden
	}
	.essential .more_btn2 a{
		padding-top:5px;
		padding-bottom:5px;
	}

	.caption{ width: 73%; }

}
/*PC and Tablet
----------------------------------------------------*/
@media screen and (min-width:751px),print{
	#topbnr .wrap .t_bnr{
		position:relative;
	}
	#topbnr .wrap .t_bnr img.bg{
		position:absolute;
		top:0;
		bottom:0;
		right:0;
		left:0;
		width:100%;
	}
	#topbnr .wrap .t_bnr img{
		position:relative;
		z-index:2;
	}
	#topbnr .wrap .t_bnr:hover img:not(.bg){
		opacity:0;
	}
	#topbnr .youtube_movie .movie_btn{
		width:90px;
		height:90px;
		right:10px;
		top:10px;
		font-size:0.8em;
	}
	#topbnr .youtube_movie .movie_btn a{
		position:absolute;
		top:0;
		left:0;
		right:0;
		bottom:0;
	}
	#topbnr .youtube_movie .movie_btn p{
		position:relative;
		transform:translateY(-50%);
		top:calc(50% - 0.3em);
		display:block;
	}
	#topbnr .youtube_movie .movie_btn span{
		font-size:2.00em;
		margin-bottom:3px;
	}
	#topbnr .youtube_movie .movie_btn i{
		margin-top:5px;
		position:absolute;
		bottom:10px;
		right:0;
		left:0;
		margin:auto;
		width:1em;
	}
	#topbnr .wrap .t_bnr img.bg{
		opacity:1;
	}
	#topbnr .t_paging{
		display:none;
	}

	.recommend h3{
		background:url(../image/rc_bg_pc.png) repeat-X center /auto 100%;
	}

	.essential .more_btn2 a{
		transition:all 0.2s;
	}
	.essential .more_btn2:hover a{
		background:rgba(255,255,255,0.5);
		color:#000000;
	}
}
/*Tablet
----------------------------------------------------*/
@media screen and (min-width:751px) and (max-width:1080px){
	.more_btn a,a .more_btn,.more_btn2 a{
		padding:2%;
	}
	#topbnr{font-size:14px;	}
	.recommend .more_btn,.pickup .more_btn,.news .more_btn{
		width:40%;
	}
	.essential .more_btn2{
		width:20%;
	}
	#catday .catday_movie{
		margin-top: -15vw;
		background-size: 100% auto;
	}
	#catday .catday_movie > div{
		width: 60vw;
	}
	#catday  .movie {padding-top: 35vw;}
}
/*Tablet und Phone
----------------------------------------------------*/
@media screen and (max-width:1080px){
	.newproducts{
		padding-top:3em;
	}
	.pickup{
		padding-top:3.46em;
	}
	.news{
		padding-top:5.2em;
	}
	.essential{
		padding-top:5.2em;
	}
	.more_btn{
		width:80%;
		margin-right:auto;
		margin-left:auto;
		font-size: calc(0.625rem + ((1vw - 3.2px) * 1.3023));
	}
	.more_btn a,a .more_btn{
		padding:1em 2%;
	}
	.more_btn2 a{
		padding:0.5em 2%;
	}
	#topbnr .youtube_movie .movie_btn span{
		margin-bottom:5px;
	}
	#topbnr .youtube_movie .movie_btn i{
		margin-top:3px;
		position:absolute;
		width:1em;
		right:0;
		left:0;
		bottom:3%;
		margin:auto;
	}
	.newproducts .more_btn{
		transform:translateY(40%);
	}
	#recommended{
		margin-top:3em;
	}
	.recommend{
		position:relative;
		padding-top:3em;
		margin-bottom:6em;
	}
	.recommend .more_btn{
		position:absolute;
		bottom:calc(-1em - 8vw);
		right:0;
		left:0;
		margin:auto;
	}
	#topbnr .youtube_movie .movie_btn i{
		margin-top:5px;
		position:absolute;
		bottom:0.7em;
		right:0;
		left:0;
		margin:auto;
		width:1em;
	}
	.pickup .pu_bnr{
		margin-bottom:5%;
	}
	.pickup ul{
		margin-bottom:2%;
	}
	.pickup .owl-dots{
		margin-top:1.5em;
		margin-bottom:3%;
	}
	.news ul{
		padding-right:5%;
		padding-left:5%;
		margin-bottom:3%;
		font-size:0.923em;
	}
	.news li{
		padding-bottom:3%;
		margin-bottom:3%;
	}
	.news .post_category{
		width:150px;
		justify-content:flex-start;
	}
	.news .date{
		width:calc(100% - 150px);
		text-align:right;
	}
	.news p{
		width:100%;
		margin-top:1%;
	}
	.essential h3{
		font-size:1.385em;
		margin-bottom:3%;
	}
	.essential h3 span{
		font-size:0.611em;
		margin-bottom:10px;
	}
	.essential .content_box{
		padding-top:7%;
		padding-bottom:7%;
	}
	.essential .more_btn2{
		overflow:hidden;
		margin-right:auto;
		margin-left:auto;
	}
	.essential p{
		font-size:0.923em;
		margin-bottom:2%;
		line-height:1.667em;
	}
	#item_search .item_list dl{
		margin-top:3%;
	}
}
/*Phone
----------------------------------------------------*/
@media screen and (max-width:750px){
	.recommend .more_btn{
		bottom:calc(-1em - 10vw);
	}
	.recommend h3{
		background:url(../image/rc_bg_phone.png) repeat-X center /auto 100%;
	}
	#topbnr{ display: block; }
	#mv.image{ line-height: 1px; }
	#topbnr .t_paging{
		margin-top:3%;
	}
	#topbnr .wrap .t_bnr{
		position:relative;
	}
	#topbnr .wrap .t_bnr a:hover img{
		opacity:1;
	}
	#topbnr .wrap .t_bnr img:not(.bg){
		position:absolute;
		top:0;
		right:0;
		bottom:0;
		left:0;
	}
	.essential .content_box{
		background:url("../image/eq_b_phone.jpg") no-repeat center /100% auto;
	}
	#topbnr .youtube_movie .movie_btn{
		width:7.5em;
		height:7.5em;
		font-size:calc(0.625rem + ((1vw - 3.2px) * 1.3953));
		right:3%;
		top:3%;
	}
	#topbnr .youtube_movie .movie_btn p{
		position:relative;
		transform:translateY(-50%);
		top:50%;
		display:block;
		font-size:0.8em;
	}
	#topbnr .youtube_movie .movie_btn a{
		position:absolute;
		top:0;
		right:0;
		bottom:0;
		left:0;
	}

	.slider {  width: 100%;  margin: 0px auto; padding: 0;  }
	.slick-slide { display: flex;  transition: all ease-in-out .3s;  }
	.slick-slide img { width: 100%;}
	.slick-list{ padding: 0 ; }
	.slick-dots{ margin-bottom: 37px; }
	

	.recommend .more_btn,.pickup .more_btn,.news .more_btn{
		width:60%;
	}
	.essential .more_btn2{
		width:40%;
	}
	
	#catday{padding: 0 0 50px;}
	#catday .catday_title{display: none;}
	#catday .catday_title_sp{
		margin: 0 auto;
		position: relative;
		display: block;
	}
	#catday .catday_movie{
		margin-top:0;
		background: none;
	}
	#catday .catday_movie > div{
		width: 90%;
		border: solid 5px #fff;
	}
	#catday  .movie {
		padding-top: 45vw;
	}
}


/* pickup 3つ
@media screen and (min-width:981px){
.pu_bnr a{ max-width:33.33%; }
.pu_bnr a img{ width: 100%; }
}

@media screen and (min-width:980px){
.pu_bnr a{ width: 100%; display: block; float: left; }
}

@media screen and (min-width:750px) and (max-width:979px){
.pickup .slick-slide{ width: 33.5vw; }
}

@media screen and (max-width:749px){
.pickup .slick-slide{ width: 50vw; }
}
*/

/* pickup 4つ */
@media screen and (min-width:1420px){

@media screen and (-webkit-min-device-pixel-ratio:0) {
.pu_bnr a{ max-width:24.81vw; }
}

@-moz-document url-prefix() {
.pu_bnr a{ max-width:/*24.75 */24.78vw; }
}
.pu_bnr a img{ width: 100%; }
}

@media screen and (min-width:1374px) and (max-width:1419px){
.pu_bnr a{max-width: /*24.7 */33.3vw;}
}
@media screen and (min-width:1081px) and (max-width:1375px){
	.pu_bnr a{max-width: /*24.69*/ 33.29vw;}
}
@media screen and (min-width:981px) and (max-width:1080px){
@media screen and (-webkit-min-device-pixel-ratio:0) {
.pu_bnr a{max-width: 24.65vw;}
}
@-moz-document url-prefix() {
.pu_bnr a{max-width: 24.6;}
}
	
}

/*
@media screen and (min-width: 1081px) {
.pickup .slick-slide { width: 25vw;}
}*/


@media screen and (min-width:750px) and (max-width:980px){
.pickup .slick-slide{ width: 33.5vw; }
}

@media screen and (max-width:749px){
.pickup .slick-slide{ width: 50vw; }
}