@charset "utf-8";

/* カテゴリコンテナ */
.categorySwiper {
	width: 100%;
	height: 100%;
}
.cardSwiper {
	width: 100%;
	height: 100%;
}
.cardGroupSwiper {
	width: 100%;
	height: 100%;
}
.singleCardSwiper {
	width: 100%;
	height: 100%;
}

/* カテゴリスライダー */
.categorySwiper__slide,
.cardSwiper__slide,
.cardGroupSwiper__slide {
	height: 100%;
	width: 100%;
	font-size: 16px;
}

iframe {
	pointer-events: none;
	width: 100%;
	height: calc(100svh - 80px);
}
video {
	object-fit: contain;
	width: 100%;
	height: calc(100svh - 80px);
	pointer-events: none;
}

.cardMain {
	width: 100%;
	height: 100%;
}

.cardInner {
	width: 100%;
	height: 100%;
	color: #fff;
	position: relative;
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-end;
}
.cardInner:after {
	content:'';
	position:absolute;
	z-index: 1;
	width: 100%;
	height: 200px;
	bottom: 0;
	background: linear-gradient(rgba(0,0,0,0) 0%,rgba(0,0,0,1));
}

.card_inner_parts_Title {
	width: 76%;
	max-width: 500px;
	margin-left: 6%;
	position: relative;
	z-index: 3;
	overflow: hidden;
	margin-bottom: 8px;
}
.card_inner_parts_Title h4{
	font-family: ShinGoPro-Bold,sans-serif !important;
	font-weight: normal;
	font-size: 20px;
	line-height: 1.4;
}

.card_inner_parts_Tags {
	width: 76%;
	max-width: 500px;
	margin-left: 6%;
	position: relative;
	z-index: 3;
	overflow: hidden;
	order: -1;
	margin-bottom: 8px;
	line-height: 1.2;
}

.card_inner_parts_Tags a{
	color: #fff;
	display: inline-block;
	padding-right: 10px;
	font-size: 12px;
}

.card_inner_parts_Pagenation {
	width: 76%;
	max-width: 500px;
	margin-left: 6%;
	position: relative;
	z-index: 3;
	order: -2;
}

.card_inner_parts_Contents {
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	z-index: 1;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.imgContens {
	height: calc(100svh - 80px);
	object-fit: contain;
	filter: blur(10px);
}
.card_inner_parts_ControlIcon {
	position: absolute;
	z-index: 3;
	bottom: 0;
	right: 16px;
	width: 4svh;
	overflow: hidden;
}
.card_inner_parts_Text {
	width: 76%;
	max-width: 500px;
	margin-left: 6%;
	position: relative;
	z-index: 3;
	overflow: hidden;
	height: 56px;
	font-size: 12px;
	line-height: 1.5;
}

.card_inner_parts_Text .description{
	overflow: hidden;
	height: 56px;
	font-size: 12px;
	display: inline-block;
	text-align: justify;
}

.card_inner_parts_Thumb {
	width: 40px;
	display: none;
	overflow: hidden;
}

.more_toggle {
	position: absolute;
	right: 0px;
	top: 35px;
	display: inline-block;
	width: 90px;
	text-align: center;
	background: rgba(0,0,0,0.8);
	font-size: 12px;
	color: #D9D8D8;
}

.more_toggle .openTxt{
	display: inline;

}
.more_toggle .closeTxt{
	display: none;
}

.cardInner.open .more_toggle .openTxt{
	display: none;
}
.cardInner.open .more_toggle .closeTxt{
	display: inline;
}
.cardInner.open .more_toggle {
	top: auto;
	bottom: 10px;
}

.cardInner.open .card_inner_parts_Text {
	height: auto;
}
.cardInner.open .card_inner_parts_Text .description{
	height: auto;
	padding-bottom: 20px;
}

.cardInner.open:after {
	height: 324px;
}

.ActionIconContainer {
	width: 4svh;
}

.ActionIconContainer .detail_links {
	text-decoration: none;
	line-height: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 12px;
}

.ActionIconContainer .detail_links span{
	font-size: 10px;
	color: #fff;
	margin-top: 6px;
	font-family: ShinGoPro-Bold,sans-serif !important;
	font-weight: normal;
	white-space: nowrap;
}
.ActionIconContainer .cardCollect span{
	font-size: 10px;
	color: #fff;
	margin-top: 6px;
	font-family: ShinGoPro-Bold,sans-serif !important;
	font-weight: normal;
	white-space: nowrap;
}

.ActionIconContainer .cardCollect {
	text-decoration: none;
	line-height: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 12px;
}

.ActionIconContainer .cardCollect img{
	filter: grayscale(1);
}
.ActionIconContainer .cardCollect.keep img{
	filter: none;;
}

.ActionIconContainer .categoryThumbs {
	overflow: hidden;
	display: block;
	line-height: 0;
	border-radius: 5px;
	margin-bottom: 16px;
	box-shadow: 0 0 0 1px #ccc;
	border-radius: 50%;
}
.card_inner_parts_Pagenation .swiper-pagination-bullet {
	opacity: 1;
	background-color: #fff;
	width: 10px;
	height: 10px;
}
.card_inner_parts_Pagenation span.swiper-pagination-bullet.swiper-pagination-bullet-active {
	background-color: #C3002F;
}

.group_swiper_next_btn,
.group_swiper_prev_btn {
	display: none;
}

@media screen and (min-width: 769px){
	.cardMain {
		width: 72.917svh;
		margin: 0 auto;
		max-width: 97%;
	}
	.cardInner {
		display: flex;
		justify-content: flex-start;
		padding-left: 7.083svh;
		flex-direction: inherit;
		align-content: flex-start;
		max-height: 95.104svh;
		align-items: flex-end;
		margin-top: 3.646svh;
		border-bottom: solid 1px #3D3D3D;
		color: #3D3D3D;
	}
	.card_inner_parts_Contents {
		position: relative;
		order: 1;
		width: 37.5svh;
		height: 66.667svh;
		border-radius: 3.125svh;
		margin-left: 0;
		margin-right: initial;
		background: #000;
		border: 1px solid #ccc;
	}
	.imgContens {
		height: 66.667svh;
		object-fit: cover;
	}
	.card_inner_parts_Title {
		margin-left: 0;
		width: 60.417svh;
		max-width: none;
		margin-bottom: 0.833svh;
	}
	.card_inner_parts_Tags {
		order: initial;
		margin-left: 0;
		width: 60.417svh;
		max-width: none;
		margin-bottom: 2.292svh;
	}
	.card_inner_parts_ControlIcon {
		position: relative;
		order: 2;
		display: flex;
		align-items: flex-end;
		right: 0;
		margin-left: 2.5svh;
		flex-wrap: wrap;
	}
	.card_inner_parts_Text {
		order: 3;
		width: 58.333svh;
		max-width: none;
		margin-left: 0;
		font-size: 1.458svh;
		line-height: 2;
		height: auto;
		padding-bottom: 0px;
		margin-top: 1.042svh;
	}
	.card_inner_parts_Thumb {
		display: block;
		position: absolute;
		left: 0.279svh;
		top: 0px;
		overflow: hidden;
		box-shadow: 0 0 0 1px #ccc;
		line-height: 0;
		border-radius: 50%;
		width: 6.25svh;
		height: 6.25svh;
	}
	.cardInner:after {
		display: none;
	}
	.more_toggle {
		background: rgba(255,255,255,0.8);
	}
	.card_inner_parts_Title h4 {
		font-size: 2.5svh;
		color: #3D3D3D;
	}
	iframe {
		height: 66.667svh;
	}
	video {
		height: 66.667svh;
	}
	.card_inner_parts_Tags a {
		color: #6E6E6E;
		font-size: 1.458svh;
		text-decoration: none;
	}
	.card_inner_parts_Tags a:hover {
		text-decoration: underline;
	}
	.card_inner_parts_Text .description {
		height: auto;
		padding-bottom: 0px;
		font-size: 1.458svh;
	}
	.more_toggle {
		display: none;
	}
	.card_inner_parts_Pagenation {
		width: 100%;
		max-width: none;
		margin-left: 0;
		position: relative;
		z-index: 3;
		order: 2;
		line-height: 1;
		margin-top: 0.833svh;
	}
	.card_inner_parts_Pagenation .swiper-pagination-bullet {
		border: solid 1px #707070;
	}
	.card_inner_parts_Pagenation span.swiper-pagination-bullet.swiper-pagination-bullet-active {
		border: none;
	}
	.ActionIconContainer .categoryThumbs {
		border: none;
	}
	.ActionIconContainer .detail_links span {
		color: #3D3D3D;
	}
	.ActionIconContainer .cardCollect span {
		color: #3D3D3D;
	}
	.group_swiper_next_btn {
		display: block;
		line-height: 0;
		box-shadow: 0 3px 6px rgba(0,0,0,0.16);
		border-radius: 50%;
		margin-bottom: 0.833svh;
		cursor: pointer;
	}
	.group_swiper_prev_btn {
		display: block;
		line-height: 0;
		box-shadow: 0 3px 6px rgba(0,0,0,0.16);
		border-radius: 50%;
		margin-bottom: 2.5svh;
		cursor: pointer;
	}
}

/*guide contents*/
.card_inner_parts_Contents,
.card_inner_parts_Title,
.card_inner_parts_Tags,
.card_inner_parts_Text,
.collect_btn,
.home_btn,
.sp_menu_nav_btn,
.detail_links,
.cardCollect,
.categoryThumbs {
	filter: brightness(0.3);
}

.guide_1,
.guide_2,
.guide_3 {
	position: absolute;
	z-index: 3;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 268px;
	height: 156px;
	border-radius: 10px;
	border: solid 1px #FFFFFF;
	color: #fff;
	padding-top: 16px;
	padding-bottom: 16px;
	text-align: center;
	line-height: 1;
	transform: translateY(10dvh);
}
.guide_number {
	font-size: 10px;
	text-align: center;
	margin-bottom: 14px;
}
.guide_title {
	font-size: 20px;
	text-align: center;
	margin-bottom: 14px;
}
.guide_title .title_min_text{
	font-size: 0.95em;
	padding-left: 0.05em;
	padding-right: 0.15em;
}

.guide_next {
	width: 207px;
	height: 32px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 auto;
	background-color: #C3002F;
	border-radius: 10px;
	margin-bottom: 14px;
	color: #fff;
	text-decoration: none;
}
.guide_end {
	font-size: 10px;
	text-decoration: underline;
	display: inline-block;
	color: #fff;
}
.guide_1_demo {
	position: absolute;
	z-index: 3;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 168px;
	height: 192px;
	text-align: center;
	color: #fff;
	transform: translateY(-18dvh);
}
.guide_1_demo_txt {
	font-size: 24px;
	line-height: 1;
}
.guide_1_demo_img_wrap {
	width: 25px;
	margin: 10px auto;
	position: relative;
	line-height: 0;
	font-size: 0;
}
.guide_1_demo_img_arrow {
	width: 25px;
}
.guide_1_demo_img_pan {
	width: 40px;
	position: absolute;
	top: 30%;
	left: -6px;
	line-height: 0;
}
.guide_1_demo_txt {
	font-size: 24px;
	line-height: 1;
}

.guide_2_demo {
	position: absolute;
	z-index: 3;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 268px;
	height: 92px;
	text-align: center;
	color: #fff;
	transform: translateY(-10dvh);
}

.guide_2_demo_txt {
	font-size: 24px;
	line-height: 1;
}

.guide_2_demo_img_wrap {
	width: 128px;
	margin: 10px auto;
	position: relative;
	line-height: 0;
	font-size: 0;
}

.guide_2_demo_img_arrow {
	width: 128px;
}

.guide_2_demo_img_pan {
	width: 40px;
	position: absolute;
	top: 0;
	left: 38%;
	line-height: 0;
	rotate: 80deg;
}

.card_inner_parts_ControlIcon {
	z-index: 4;
	overflow: visible;
}

.guide_demo_2_parts_wrap {
	position: relative;
	z-index: 4;
}
.guide_demo_2_parts_wrap .guide_demo_thumb {
	position: absolute;
	right: 5dvh;
	top: 2px;
}
.guide_demo_2_parts_wrap .guide_demo_thumb .text_arrow_wrap {
	display: flex;
	flex-wrap: nowrap;
	width: 78.2vw;
	justify-content: flex-end;
}
.guide_demo_2_parts_wrap .guide_demo_thumb .guide_demo_parts_txt {
	width: 90%;
	font-size: 12px;
	text-align: right;
	padding-right: 0.5em;
}
.guide_demo_2_parts_wrap .guide_demo_thumb .text_arrow_wrap img{
	width: 20px;
}

.guide_demo_3_parts_cardClollect_wrap {
	position: relative;
}
.guide_3_demo_parts_cardCollect {
	position: absolute;
	right: 5dvh;
	top: 2px;
}
.guide_3_demo_parts_cardCollect .text_arrow_wrap {
	display: flex;
	flex-wrap: nowrap;
	width: 78.2vw;
	justify-content: flex-end;
	min-width: 292px;
}
.guide_3_demo_parts_cardCollect .guide_demo_parts_txt {
	width: 90%;
	font-size: 12px;
	text-align: right;
	padding-right: 0.5em;
}
.guide_3_demo_parts_cardCollect img {
	width: 20px;
}

.guide_demo_3_parts_detail_links_wrap {
	position: relative;
}
.guide_3_demo_parts_detail_links {
	position: absolute;
	right: 5dvh;
	top: 2px;
}
.guide_3_demo_parts_detail_links .text_arrow_wrap {
	display: flex;
	flex-wrap: nowrap;
	width: 78.2vw;
	justify-content: flex-end;
}
.guide_3_demo_parts_detail_links .guide_demo_parts_txt {
	width: 90%;
	font-size: 12px;
	text-align: right;
	padding-right: 0.5em;
}
.guide_3_demo_parts_detail_links img {
	width: 20px;
}

.guide_demo_3_parts_collect_btn_wrap {
	position: relative;
	z-index: 3;
}
.guide_demo_3_parts_collect_btn_wrap .guide_3_demo_parts_collect_btn {
	position: absolute;
	top: -30px;
	left: -20px;
	text-align: center;
	width: 300px;
}
.guide_demo_3_parts_collect_btn_wrap .text_arrow_wrap .guide_demo_parts_txt {
	color: #fff;
	font-size: 12px;
	margin-bottom: 0px;
	white-space: nowrap;
}
.guide_demo_3_parts_collect_btn_wrap .text_arrow_wrap img {
	width: 22px;
	margin-left: -126px;
}

.guide_4 {
	position: absolute;
	z-index: 3;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 324px;
	height: 170px;
	color: #fff;
	padding-top: 16px;
	padding-bottom: 16px;
	text-align: center;
	line-height: 1;
	transform: translateY(-5.5dvh);
}
.guide_4_title_em {
	font-size: 38px;
	white-space: nowrap;
	margin-bottom: 20px;
}
.guide_4_title_jp {
	font-size: 24px;
	margin-bottom: 40px;
	padding-top: 54px;
}

.guide_demo_4_parts_menu_nav_btn_wrap {
	position: relative;
	z-index: 3;
}
.guide_4_demo_parts_menu_nav_btn {
	position: absolute;
	top: -80px;
	left: -166px;
	text-align: center;
	width: 190px;
}
.guide_demo_4_parts_menu_nav_btn_wrap .guide_demo_parts_txt {
	color: #fff;
	font-size: 14px;
	line-height: 1.6;
	margin-bottom: 0px;
	white-space: nowrap;
}
.guide_demo_4_parts_menu_nav_btn_wrap .text_arrow_wrap img {
	width: 22px;
	margin-top: 10px;
	margin-left: 155px;
}



/*open dispay block*/

.guide_1,
.guide_2,
.guide_3,
.guide_4 {
	display: none;
}

.guide_1_demo,
.guide_2_demo {
	display: none;
}

.open {
	display: block;
}



.guide_demo_2_parts_wrap.open .categoryThumbs{
	filter: brightness(1);
}

.guide_demo_2_parts_wrap .guide_2_demo_parts{
	display: none;
}
.guide_demo_2_parts_wrap.open .guide_2_demo_parts{
	display: block;
}

.guide_demo_3_parts_detail_links_wrap.open .detail_links{
	filter: brightness(1);
}
.guide_demo_3_parts_cardClollect_wrap.open .cardCollect{
	filter: brightness(1);
}
.guide_demo_3_parts_cardClollect_wrap.open .cardCollect img{
	filter: grayscale(0);
}

.guide_demo_3_parts_cardClollect_wrap .guide_3_demo_parts_cardCollect{
	display: none;
}
.guide_demo_3_parts_cardClollect_wrap.open .guide_3_demo_parts_cardCollect{
	display: block;
}

.guide_demo_3_parts_detail_links_wrap .guide_3_demo_parts_detail_links {
	display: none;
}
.guide_demo_3_parts_detail_links_wrap.open .guide_3_demo_parts_detail_links {
	display: block;
}

.guide_demo_3_parts_collect_btn_wrap.open .collect_btn {
	filter: brightness(1);
}

.guide_demo_3_parts_collect_btn_wrap .text_arrow_wrap{
	display: none;
}
.guide_demo_3_parts_collect_btn_wrap.open .text_arrow_wrap{
	display: block;
}

.guide_demo_4_parts_menu_nav_btn_wrap.open .sp_menu_nav_btn {
	filter: brightness(1);
}
.guide_demo_4_parts_menu_nav_btn_wrap .guide_4_demo_parts_menu_nav_btn {
	display: none;
}
.guide_demo_4_parts_menu_nav_btn_wrap.open .guide_4_demo_parts_menu_nav_btn {
	display: block;
}

/*fb*/
.guide_1_demo {
	transform: translateY(-22dvh);
}
.guide_1_demo_txt {
	font-size: 20px;
	line-height: 1;
}
.guide_1_demo_img_wrap {
	margin: 5px auto;
}
.guide_1_demo_img_arrow {
	width: 18px;
}
.guide_1_demo_img_pan {
	width: 34px;
	position: absolute;
	top: 30%;
	left: -6px;
	line-height: 0;
}
.guide_1,
.guide_2,
.guide_3 {
	transform: translateY(4dvh);
}
.guide_2_demo {
	transform: translateY(-22dvh);
}