#top{}

#top #kv img{ width:100%; height:auto; }

.slick-track{ z-index:1; }
.slick-arrow{ z-index:2; }

/* pc */
@media screen and (min-width: 751px) {
	#top #kv{ overflow:hidden; background:#000000; padding:25px 90px; }
	#top #kv .pc{ position:relative; }
	#top #kv .arr{
		width:72px; height:141px;
		background:url("../img/top/sld_arr.svg") no-repeat center/100% 100%;
		position:absolute; top:calc(50% - 70px); z-index:6;
		cursor:pointer;
	}
	#top #kv .arr:hover{ opacity:0.6; } 
	#top #kv .arr.next{ right:-35px; transform:rotate(180deg); }
	#top #kv .arr.prev{ left:-35px; }
	
	#top #kv .sld{ width:100%; padding-top:calc(100% * 670 / 2 / 823); position:relative; }
	#top #kv .sld>*{ position:absolute; left:100%; top:50%; width:25%; z-index:0; opacity:0; transition: all 300ms 0s ease; }
	#top #kv .sld>:nth-child(1){ left:-100%; top:0; width:50%; opacity:0; z-index:0; }
	#top #kv .sld>:nth-child(2){ left:0; top:0; width:50%; opacity:1; z-index:1; }
	#top #kv .sld>:nth-child(3){ left:50%; top:0; width:25%; opacity:1; z-index:2; }
	#top #kv .sld>:nth-child(4){ left:75%; top:0; width:25%; opacity:1; z-index:3; }
	#top #kv .sld>:nth-child(5){ left:50%; top:50%; width:25%; opacity:1; z-index:4; }
	#top #kv .sld>:nth-child(6){ left:75%; top:50%; width:25%; opacity:1; z-index:5; }
}

/* スマホ */
@media screen and (max-width: 750px) {
	#top #kv{ position:relative; z-index:99; margin-bottom:30px; }
	#top #kv .slick-arrow{ top:auto !important; bottom:17px; width:43px; height:0; z-index:100; }
	#top #kv .slick-arrow::before{
		display:block; width:43px; height:43px;
		content:"";
		background:#000000 url("../img/top/sp/sld_arr2.svg") no-repeat center/10px 17px;
		opacity:1 !important;
		margin-top:0;
	}
	#top #kv .slick-next{ right:13px; }
	#top #kv .slick-next::before{ transform:rotate(180deg); }
	#top #kv .slick-prev{ right:58px; left:auto; }
	#top #kv .slick-prev::before{ transform:rotate(0.001deg); }
	
}

/* pc */
@media screen and (min-width: 751px) {
	#top .top_wrap{ display:flex; }

	#top #recommend h3,
	#top #news h3{
		padding-bottom:25px; margin-bottom:25px;
		font-family:'Barlow Condensed', sans-serif; font-size:7.0rem; line-height:1.0; font-weight:400; text-align:center;
		background:url("../img/top/h3.svg") no-repeat center bottom/45px 9px;
	}
}

/* スマホ */
@media screen and (max-width: 750px) {
	#top .nav{}
	#top .nav .page{ display:table; width:100%; }
	#top .nav .page a{
		display:table-cell; vertical-align:middle; text-align:center; background:#FFFFFF; width:calc(100% / 3);
		padding:13px;
		font-family:'Barlow Condensed', sans-serif; font-size:1.9rem; line-height:1.0; font-weight:700; color:#EC2D1F;
		position:relative;
	}
	#top .nav .page a:not(:last-child)::after{
		display:block; content:""; width:1px; background:#000000;
		position:absolute; top:15px; right:0; bottom:15px;
	}
}

/* pc */
@media screen and (min-width: 751px) {
	#top #recommend{ padding:50px 20px 0; }
	#top #recommend .labelproducts{ margin-bottom:50px; }
	#top #recommend .distribution{ margin-bottom:60px; }

	#top #recommend .rec_elm>.pc.show{ display:flex; flex-wrap:wrap; margin:0 0 -15px calc(-100% * 12 / 1200); }
	#top #recommend .rec_elm>.pc.show p{ margin:0 0 15px calc(100% * 12 / 1212); width:calc(100% * 230 / 1212); }
	#top #recommend .rec_elm>.pc.show p a{ display:block; }
	#top #recommend .rec_elm>.pc.show p span{ display:block; text-align:center; }
	#top #recommend .rec_elm>.pc.show p span.i{ padding-top:100%; width:100%; background-position:center; background-size:contain; background-color:#000000; border:1px solid #000000; }
	#top #recommend .rec_elm>.pc.show p span.t0{ font-size:1.8rem; line-height:1.6; margin-top:15px; }
	#top #recommend .rec_elm>.pc.show p span.t1{ font-size:1.4rem; line-height:1.6; color:#999999; }
		
	#top #recommend .pc.show p.more a{
		display:block; width:100%; padding-top:100%; background:#000000;
		position:relative;
	}
	#top #recommend .pc.show p.more a span{
		display:block; width:100%;
		font-family:'Barlow Condensed', sans-serif;
		font-size:2.6rem; line-height:1.0; text-align:center; color:#FFFFFF;
		position:absolute; left:0; top:calc(100% * 140 / 230);
	}
	
	#top #recommend .pc.show p.more a::before,
	#top #recommend .pc.show p.more a::after{ position:absolute; display:block; content:""; background:#FFFFFF; }
	#top #recommend .pc.show p.more a::before{ width:calc(100% * 65 / 230); height:1px; top:calc(100% * 95 / 230); left:calc(50% - (100% * 65 / 230) / 2); }
	#top #recommend .pc.show p.more a::after{ height:calc(100% * 65 / 230); width:1px; top:calc(100% * 63 / 230); left:50%; }

}

/* スマホ */
@media screen and (max-width: 750px) {
	#top #recommend .distribution{ margin-bottom:45px; }
	#top #recommend .labelproducts{ margin-bottom:50px; }
	#top #recommend h3{
		font-family:'Barlow Condensed', sans-serif; font-size:4.5rem; line-height:1.0; font-weight:400; text-align:center;
		background:url("../img/top/h3.svg") no-repeat center bottom/21px 5px;
		padding-bottom:10px; margin-bottom:15px;
	}
	
	#top #recommend .rec_elm>.sp{ display:flex; flex-wrap:wrap; }
	#top #recommend .rec_elm>.sp p:not(.more){ margin:0 0 calc(100% * 45 / 2 / 768) calc(100% * 45 / 768); width:calc(100% * 310 / 768); }
	#top #recommend .rec_elm>.sp p:not(.more) a{ display:block; }
	#top #recommend .rec_elm>.sp p:not(.more) span{ display:block; text-align:center; }
	#top #recommend .rec_elm>.sp p:not(.more) span.i{ padding-top:100%; width:100%; background-position:center; background-size:contain; background-color:#000000; border:1px solid #000000; }
	#top #recommend .rec_elm>.sp p:not(.more) span.t0{ font-size:1.4rem; line-height:1.6; margin-top:15px; }
	#top #recommend .rec_elm>.sp p:not(.more) span.t1{ font-size:1.0rem; line-height:1.6; color:#999999; }
	
	
	#top #recommend .more{ width:100%; text-align:center; }
	#top #recommend .more a{
		display:inline-block;
		background:#000000;
		font-family:'Barlow Condensed', sans-serif; text-align:center; color:#FFFFFF;
		position:relative;
		width:120px; font-size:1.8rem; line-height:4.0rem; font-weight:400;
	}
	#top #recommend .more a::before,
	#top #recommend .more a::after{ display:block; width:6px; content:""; background:#FFFFFF; position:absolute; top:0; bottom:0; }
	#top #recommend .more a::before{ left:3px; }
	#top #recommend .more a::after{ right:3px; }
}

#top #news li .d{ display:block; color:#FFFFFF; background:#000000; }
#top #news .more a{
	display:inline-block;
	background:#000000;
	font-family:'Barlow Condensed', sans-serif; text-align:center; color:#FFFFFF;
	position:relative;
}
#top #news .more a::before,
#top #news .more a::after{ display:block; content:""; background:#FFFFFF; position:absolute; top:0; bottom:0; }

/* pc */
@media screen and (min-width: 751px) {
	#top #news{ width:calc(100% * 840 / 1200); border-right:5px solid #000000; margin-right:calc(100% * (1200 - 840 - 316) / 1200); }
	#top #news ul{ list-style:none; }
	#top #news li{ border-top:1px solid #000000; position:relative; padding:30px 25px 45px; }
	#top #news li .d{
		padding:5px 10px;
		font-size:1.2rem; line-height:1.0;
		position:absolute; left:0; top:-13px;
	}
	#top #news li .t{ font-size:1.6rem; line-height:1.6; }
	#top #news li .t a:hover{ text-decoration:underline; }
	#top #news .more{ text-align:right; padding-right:50px; }
	#top #news .more a{ width:130px; font-size:2.0rem; line-height:3.8rem; font-weight:700; }
	#top #news .more a::before,
	#top #news .more a::after{ width:6px; }
	#top #news .more a::before{ left:3px; }
	#top #news .more a::after{ right:3px; }

}

/* スマホ */
@media screen and (max-width: 750px) {
	#top #news{ padding:0 20px 60px; }
	#top #news h3{
		font-family:'Barlow Condensed', sans-serif; font-size:4.5rem; line-height:1.0; font-weight:400; text-align:center;
		background:url("../img/top/h3.svg") no-repeat center bottom/21px 5px;
		padding-bottom:10px; margin-bottom:15px;
	}
	#top #news ul{ list-style:none; border-bottom:1px solid #000000; margin-bottom:30px; }
	#top #news li{ border-top:1px solid #000000; position:relative; }
	#top #news li .d{
		padding:0 5px;
		font-size:1.0rem; line-height:2.1rem;
		position:absolute; left:0; top:-11px;
	}
	#top #news li .t{ font-size:1.4rem; line-height:1.6; }
	#top #news li .t a{
		display:block;
		background:url("../img/top/sp/news_arr.svg") no-repeat right 14px center/auto 11px;
		padding:20px 28px 28px 0;
	}
	#top #news .more{ text-align:center; }
	#top #news .more a{ width:120px; font-size:1.8rem; line-height:4.0rem; font-weight:400; }
	#top #news .more a::before,
	#top #news .more a::after{ width:6px; }
	#top #news .more a::before{ left:3px; }
	#top #news .more a::after{ right:3px; }
	
}

#top .link a{ position:relative; z-index:0; background:#FFFFFF; }
#top .link a:hover{ z-index:1; }
#top .link a:hover>*{ opacity:0.6; }
#top .link a>span{ display:block; }
#top .link a .t0{
	font-family:'Barlow Condensed', sans-serif; color:#FFFFFF;
	background:#EC2D1F url("../img/top/icon_arr.svg") no-repeat right 10px center;
}
#top .link a .t0 img{ vertical-align:unset; }
#top .link a .t1{ background:#FFFFFF; color:#EC2D1F; }

/* pc */
@media screen and (min-width: 751px) {
	#top .r{ width:calc(100% * 316 / 1200); }
	#top .link{ padding-bottom:10px; }
	#top .link a{ display:block; }
	#top .link a:not(:first-child){ margin-top:-3px; }
	#top .link a .t0{ font-size:3.2rem; line-height:2.6rem; background-size:8px 14px; padding:8px 18px; }
	#top .link a .t0 img{ width:34px; margin:0 10px 0 0; }
	#top .link a .t0 .jp{ font-size:2.6rem; }
	#top .link a .t1{ font-size:1.4rem; line-height:1.5; padding:5px 15px; border:3px solid #EC2D1F; border-top:0; }
	#top .banner{ padding-bottom:10px; }
}

/* スマホ */
@media screen and (max-width: 750px) {
	#top .link{ margin:0 auto 19px; width:calc(100% * 616 / 768); }
	#top .link a{ display:block; }
	#top .link a:not(:first-child){ margin-top:-1px; }
	#top .link a .t0{ font-size:2.4rem; line-height:0.9; background-size:7px 11px; padding:11px; }
	#top .link a .t0 img{ width:26px; margin:0 5px 0 0; }
	#top .link a .t0 .jp{ font-size:1.9rem; }
	#top .link a .t1{ font-size:1.2rem; line-height:1.5; padding:10px 13px; border:1px solid #EC2D1F; border-top:0; }
	#top .banner{ margin:0 auto 19px; width:calc(100% * 616 / 768); }
}

#top .twiiter_box{ background:#F7F7F7; }

/* pc */
@media screen and (min-width: 751px) {
	#top .twiiter_box{ padding:20px; margin-top:45px; }
	#top .twiiter_box iframe{ height:720px !important; }
}

/* スマホ */
@media screen and (max-width: 750px) {
	#top .twiiter_box{ padding:45px 0; margin-bottom:45px; text-align:center; overflow:hidden; width:100%; height:550px; }
	#top .twiiter_box .twitter-timeline{ display:inline-flex !important; }
	#top .twiiter_box iframe{ width:320px !important; height:460px !important; }
}

#top #channnel .inner{ position:relative; }
#top #channnel h3{
	font-family:'Barlow Condensed', sans-serif; font-weight:400;
	background:url("../img/h/youtube.svg") no-repeat left bottom;
	position:absolute;
}
#top #channnel .channnel_inner{ background:#000000; overflow:hidden; }
#top #channnel .slider_box a{ display:block; position:relative; }
#top #channnel .slider_box img{ width:100%; position:relative; z-index:0; }
#top #channnel .slider_box a::after{
	display:block; content:""; position:absolute; z-index:1;
	background:url("../img/top/youtube.svg") no-repeat center/100%;
}
/* pc */
@media screen and (min-width: 751px) {
	#top #channnel h3{
		font-size:3.8rem; line-height:5.0rem;
		background-size:35px auto;
		padding-left:50px;
		top:-50px; left:0;
	}
	#top #channnel .channnel_inner{ padding:50px 112px; }
	#top #channnel .slider{ max-width:960px; margin:0 auto; }
	#top #channnel .slider_box a::after{ width:81px; height:57px; left:calc((100% - 81px) / 2); top:calc((100% - 57px) / 2); }
	#top #channnel .slick-list{ overflow:visible !important; }
	#top #channnel .slick-slide{ opacity:0.5; transition:opacity 300ms 0s ease; }
	#top #channnel .slick-slide.slick-current{ opacity:1; }
	#top #channnel .slick-arrow{ width:72px; height:0; z-index:11; }
	#top #channnel .slick-arrow::before{
		display:block; width:72px; height:141px;
		content:"";
		background:url("../img/top/sld_arr.svg") no-repeat center/100% 100%;
		opacity:1 !important;
		margin-top:-70px;
	}
	#top #channnel .slick-next{ right:-112px; }
	#top #channnel .slick-next::before{ transform:rotate(180deg); }
	#top #channnel .slick-prev{ left:-112px; }
}

/* スマホ */
@media screen and (max-width: 750px) {
	#top #channnel{ margin:40px 0 50px; }
	#top #channnel h3{
		font-size:3.1rem; line-height:0.8;
		background-size:32px auto;
		top:-37px; left:calc(50% - 126px);
		padding-left:46px; padding-bottom:6px;
		width:252px; height:37px;
	}
	#top #channnel .channnel_inner{ padding:19px; }
	#top #channnel .slider{ width:100%; margin:0 auto; }
	#top #channnel .slick-slide{ opacity:0; transition:opacity 300ms 0s ease; }
	#top #channnel .slick-slide.slick-current{ opacity:1; }
	#top #channnel .slider_box a::after{ width:81px; height:57px; left:calc((100% - 81px) / 2); top:calc((100% - 57px) / 2); }
	#top #channnel .slick-arrow{ display:none !important; }
	
}

/* スマホ */
@media screen and (max-width: 750px) {
	#top .club h3{
		font-family:'Barlow Condensed', sans-serif; font-size:4.5rem; line-height:1.0; font-weight:400; text-align:center;
		background:url("../img/top/h3.svg") no-repeat center bottom/21px 5px;
		padding-bottom:10px; margin-bottom:15px;
	}
	#top .club p{
		background:linear-gradient(to bottom, #E8E8E8 0px, #E8E8E8 1px, #FFFFFF 1px, #FFFFFF 4px) repeat left top/100% 4px;
		border-top:1px solid #000000;
	}
	#top .club p a{
		display:table; width:100%;
		background:url("../img/top/sp/news_arr.svg") no-repeat right 14px center/auto 11px;
		border-bottom:1px solid #000000;
	}
	#top .club p a>*{ display:table-cell; }
	#top .club p a .i{ width:150px; }
	#top .club p a .i img{ vertical-align:top; }
	#top .club p a .t{ vertical-align:middle; padding:0 30px 0 15px; }
	#top .club p a .t span{ display:block;}
	#top .club p a .t0{ font-size:1.9rem; line-height:1.6; }
	#top .club p a .t1{ font-family:'Barlow Condensed', sans-serif; font-weight:700; font-size:1.4rem; line-height:1.6; color:#EC2D1F; }
}

/* end */