@charset "utf-8";
#bd_products.products-home #contentsBlock [id^="sec_"] > .inner{
	padding-top: 52px;
}
#bd_products .commonHeader .btnBox li:first-child .btnBasic{
	/* padding: 8px 45px 8px 20px; */
}
.products-hd01{
	text-align: left;
	font-size: 3.2rem;
	padding-bottom: 10px;
	border-bottom: solid 1px #C1C1C1;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.products-hd01 a{
	font-size: 1.8rem;
	color: #A2000D;
	text-decoration: none;
	padding-right: calc(1em + 8px);
}
.products-hd01 a span{
	vertical-align: sub;
	font-size: 2.4rem;
	margin-left: 8px;
}

@media screen and (max-width: 767px){
	.products-hd01{
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
		font-size: 2.8rem;
	}
	.products-hd01 a{
		font-size: 1.4rem;
		margin-top: 8px;
	}
	.products-hd01 a.slideArrow .material-symbols-outlined{
		font-size: 2.2rem;
		left: calc(100% - 10px);
	}
}

/* ------------------------------------------------------------------------ */

/*  製品情報一覧ページ

/* ------------------------------------------------------------------------ */
#contentsBlock #sec_parent > .inner{
	padding-top: 52px;
}
#sec_products .parent-cat-list{
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: stretch;
	margin: 0 -10px;
}
#sec_products .parent-cat-list li{
	width: calc(100% / 4 - 20px);
	margin: 20px 10px 0;
}
#sec_products .parent-cat-list .btnBasic{
	margin: 0;
	line-height: 1.25;
	letter-spacing: 0.06em;
	text-align: left;
	padding: 5px 40px 5px 20px;
	font-size: 1.6rem;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	max-width: inherit;
	width: 100%;
	height: 56px;
}
#sec_products .parentContainer{
	margin-top: 125px;
}
#sec_products .parentContainer + .parentContainer{
	margin-top: 64px;
}
#sec_products .parentContainer .lead{
	font-size: 1.8rem;
	text-align: left;
	font-weight: 400;
	line-height: 2;
	letter-spacing: 0.06em;
	margin-top: 32px;
}
#sec_products .sub-cat-list{
	display: flex;
	justify-content: flex-start;
	align-items: stretch;
	flex-wrap: wrap;
	margin: 40px -15px 0;
}
#sec_products .sub-cat-list li{
	text-align: left;
	width: calc(100% / 4 - 30px);
	margin: 0 15px 40px;
}
#sec_products .sub-cat-list li a{
	text-decoration: none;
	color: #131313;
	width: 100%;
}
#sec_products .sub-cat-list li figure{
    overflow: hidden;
    aspect-ratio: 5 / 3;
}
#sec_products .sub-cat-list li figure img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#sec_products .sub-cat-list li h4,
#sec_products .sub-cat-list li p{
	margin-top: 8px;
}

#sec_products .sub-cat-list li h4 .genericTerm{
	display: inline-block;
	font-size: 1.2rem;
	line-height: 1.8rem;
}
#sec_products .sub-cat-list li h4 .productName{
	font-size: 1.8rem;
	display: inline;
	position: relative;
	background: linear-gradient(#2D2D2D, #2D2D2D) 0 100% / 0 1px no-repeat;
	transition: background .4s;
}
#sec_products .sub-cat-list li a:hover .productName{
	background-size: 100% 1px;
}

#sec_products .sub-cat-list li p{
	font-weight: 400;
}

#sec_products .parent-cat-list .btnBasic:hover{
	background: #131313;
}
.parent-cat-list .slideArrow:hover .material-symbols-outlined {
	-webkit-animation: downArrow .8s cubic-bezier(.5, .25, 0, 1) 0s 1 normal forwards;
	animation: downArrow .8s cubic-bezier(.5, .25, 0, 1) 0s 1 normal forwards
}


.tpl-parentCat #sec_products .sub-cat-list{
	margin-top: 0;
}
.tpl-parentCat  #sec_products .parentContainer .sub-cat-list{
	margin-top: 32px;
}

@-webkit-keyframes downArrow {
	0% {
		transform: translate(-50%, -50%);
		opacity: 1
	}
	60% {
		transform: translate(-50%, 100%);
		opacity: 0
	}
	70% {
		transform: translate(-50%, -100%);
		opacity: 0
	}
	to {
		transform: translate(-50%, -50%);
		opacity: 1
	}
}
@keyframes downArrow {
	0% {
		transform: translate(-50%, -50%);
		opacity: 1
	}
	60% {
		transform: translate(-50%, 100%);
		opacity: 0
	}
	70% {
		transform: translate(-50%, -100%);
		opacity: 0
	}
	to {
		transform: translate(-50%, -50%);
		opacity: 1
	}
}

@media screen and (max-width: 1023px){
	#sec_products .parent-cat-list{
		margin: 0px -5px;
	}
	#sec_products .parent-cat-list li{
		width: calc(100% / 4 - 10px);
		margin: 20px 5px 0;
	}
	#sec_products .parent-cat-list .btnBasic{
		font-size: 1.4rem;
		padding: 5px 30px 5px 10px;
	}
	#sec_products .sub-cat-list{
		margin: 40px -10px 0;
	}
	#sec_products .sub-cat-list li{
		width: calc(100% / 2 - 20px);
		margin: 0 10px 54px;
	}
}

@media screen and (max-width: 767px){
	#sec_products .parent-cat-list li{
		width: calc(100% / 2 - 10px);
		margin: 10px 5px 0;
	}
	#sec_products .parentContainer{
		margin-top: 120px;
	}
	#sec_products .parentContainer .lead{
		font-size: 1.4rem;
		margin-top: 24px;
	}
}
@media screen and (max-width: 480px){
	#sec_products .sub-cat-list{
		margin: 64px auto 0;
	}
	#sec_products .sub-cat-list li{
		margin: 0 auto 64px;
		width: 100%;
	}
	#sec_products .sub-cat-list li:last-child{
		margin-bottom: 0;
	}
	#sec_products .sub-cat-list li h4,
	#sec_products .sub-cat-list li p{
		margin-top: 8px;
	}
	#sec_products .parentContainer + .parentContainer{
		margin-top: 120px;
	}
}
/* ------------------------------------------------------------------------ */

/*  カテゴリページ

/* ------------------------------------------------------------------------ */
#sec_products .topLead{
	text-align: left;
	max-width: 822px;
	margin: 0 auto;
	font-size: 1.8rem;
	font-weight: 500;
	line-height: 1.777;
}
.tpl-parentCat #sec_products .sub-cat-list li a:hover .material-symbols-outlined {
	-webkit-animation: slideArrow .8s cubic-bezier(.5, .25, 0, 1) 0s 1 normal forwards;
	animation: slideArrow .8s cubic-bezier(.5, .25, 0, 1) 0s 1 normal forwards
}
#sec_products .parentContainer .sub-cat-list li h4{
	font-size: 1.8rem;
}
.tpl-parentCat #sec_products .parentContainer .sub-cat-list li h4{
	color: #A2000D;
}
#sec_products .parentContainer .sub-cat-list li h4 .material-symbols-outlined{
	font-size: 2.4rem;
}

@media screen and (max-width: 767px){
	#sec_products .topLead{
		font-size: 1.6rem;
	}
	#bd_products .commonHeader .btnBox li:first-child .btnBasic{
		padding: 15px 35px 15.5px 20px;
	}
	#bd_products .commonHeader .btnBox li:first-child .btnBasic br{
		display: none;
	}
	.tpl-parentCat #sec_products .parentContainer .sub-cat-list li h4{
        margin-top: 15px;
	}
}

/* ------------------------------------------------------------------------ */

/*  column

/* ------------------------------------------------------------------------ */
#sec_column {
	background: #EFECEC;
}
#sec_column ul{
    margin-top: 68px;
    justify-content: flex-start;
    align-items: normal;
}
#sec_column ul li{
	background: #fff;
    max-width: 376px;
    width: calc((100% - 80px) / 3);
}
#sec_column ul li + li{
    margin-left: 40px;
}
#sec_column ul li a{
	text-decoration: none;
	color: #000;
	text-align: left;
}
#sec_column ul li figure{
	overflow: hidden;
	aspect-ratio: 16 / 9;
}
#sec_column ul li figure img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#sec_column ul li .dateBox{
	display: flex;
	justify-content: flex-start;
	align-items: stretch;
	max-width: 272px;
	margin-top: -16px;
	position: relative;
	z-index: 1;
}
#sec_column ul li .dateBox span{
	width: 50%;
	color: #fff;
	font-size: 1.4rem;
	font-family: "Titillium Web", sans-serif;
	font-weight: 600;
	letter-spacing: 0.1em;
	padding: 4px 16px 5px;
}
#sec_column ul li .dateBox .date{
	background: #A2000D;
}
#sec_column ul li .dateBox .label{
	background: #333;
}

#sec_column ul li .txtBox{
	padding: 16px 20px 37px;
}
#sec_column ul li .txtBox h3{
	font-size: 1.8rem;
	line-height: 1.5;
	margin-bottom: 16px;
}
#sec_column ul li .txtBox h3 span{
    background: linear-gradient(#2D2D2D, #2D2D2D) 0 100% / 0 1px no-repeat;
    transition: background .4s;
}
#sec_column ul li a:hover .txtBox h3 span{
    background-size: 100% 1px;
}
#sec_column ul li .txtBox p{
	font-size: 1.4rem;
	font-weight: 500;
}
#sec_column .btnBasic{
	margin-top: 40px;
}
@media screen and (max-width: 1179px){
	#sec_column ul li{
	}
}
@media screen and (max-width: 768px){
	
	/* スライダー矢印 */
	.slick-arrow{
		border: none;
		width: 48px;
		height: 48px;
		display: flex;
		justify-content: center;
		align-items: center;
		background: #A2000D;
		border-radius: 50%;
		color: #fff;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		z-index: 10;
	}
	.slick-arrow.slick-prev{
		left: 6px;
	}
	.slick-arrow.slick-next{
		right: 6px;
	}
}
@media screen and (max-width: 767px){
	#sec_column ul{
		margin: 40px -16px 0;
	}
	#sec_column ul li {
		margin: 0 12px;
		max-width: inherit;
	}
	#sec_column ul li + li{
		margin-left: 12px;
	}
	.slick-track {
	  display: flex;
	}
	.slick-slide {
	  height: auto !important;
	}
	
	#sec_column ul li a h3{
		font-size: 1.8rem;
		flex-direction: column;
		text-align: left;
		align-items: flex-start;
		justify-content: flex-end;
		height: auto;
	}
	#sec_column ul li h3 .logo + .name-txt{
		margin-top: 7px;
		margin-left: 0;
	}
	#sec_column ul li .freeTxt {
		margin-top: 8px;
	}
	#sec_column .btnBasic{
		margin-top: 40px;
	}
}