@charset "UTF-8";

/* slider */
#listSlideArea{
	width: 1200px;
	height: 400px;
	margin: 0 auto;
}
#listSlider{
	margin:0 auto;
	position:relative;
}
#listSlider li img{
	width: 100%;
	position:absolute;
	left:0;
	top:0;
}
@media screen and (max-width:667px){
	#listSlideArea{
		width: 100%;
		height: 137px;
	}
}


/* タイトル */
.titMain{
	font-family:'Roboto', '游ゴシック体', 'Yu Gothic', YuGothic, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif;
	font-size:3.5rem;
	color:#555555;
	font-weight:normal;
	letter-spacing:1px;
}
.titMain span{
	padding:0 0 0 20px;
	font-size:1.3rem;
	font-weight:bold;
}
@media screen and (max-width:667px){
	/* タイトル */
	.titMain{
		font-size:2.5rem;
	}
	.titMain span{
		padding:0 0 0 10px;
		font-size:1.0rem;
	}
}

/*
	ラインナップ
-----------------------------------------------------------------------------------------------*/
/* タイトル */
.titLineup{
	font-family:'Roboto', '游ゴシック体', 'Yu Gothic', YuGothic, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif;
	padding: 0;
	font-size: 1.8rem;
	font-weight: normal;
	letter-spacing: 1px;
	color: #555555;
	text-align: center;
	background-color: #E5E2CF;
}
/* リスト */
.lineUpArea{
	width: 1100px;
	display: -ms-flex;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	padding: 10px 0 0;
}
.lineUpArea:first-of-type{
	padding: 5px 0 0 0;
}
.lineUp1col{
	margin: 0 16px 0 0;
}
.lineUp2col{
	margin: 0 16px 0 0;
}
.lineUp6col{
	width: 1160px;
}
.listLineUp{
	display: -ms-flex;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.listLineUp li{
	width:170px;
	margin:10px 16px 0 0;
}
.listLineUp1col li{
	width:170px;
	margin:10px 0 0 0;
}
.listLineUp li:last-of-type,
.listLineUp li:nth-of-type(6n){
	margin:10px 0 0 0;
}
.listLineUp p{
	padding:5px 0 0;
	text-align:center;
}
.listLineUp img,
.listLineUp1col img{
	width:100%;
}
.listLineUp li figure,
.listLineUp1col li figure{
	overflow: hidden;
	background-color: #ffffff;
}
.listLineUp li figure img,
.listLineUp1col li figure img{
	display: block;
	transition-duration: 0.3s;
}
.listLineUp li a:hover figure img,
.listLineUp1col li a:hover figure img{
	transform: scale(1.1);
	transition-duration: 0.3s;
	opacity: 0.8;
}

@media screen and (max-width:667px){
	/* タイトル */
	.titLineup{
		padding: 3px 0;
		font-size: 1.6rem;
	}
	/* リスト */
	.lineUpArea{
		width: 100%;
		display: block;
		padding: 20px 0 0;
	}
	.lineUpArea:first-of-type{
		padding: 10px 0 0 0;
	}
	.lineUp1col{
		width: calc((100% - 10px)/2);
		padding: 20px 0 0 0;
		margin: 0 10px 0 0;
		float: left;
	}
	.lineUp1col:nth-of-type(2n){
		margin: 0 0 0 0;
	}
	.lineUp1col:nth-of-type(1),
	.lineUp1col:nth-of-type(2){
		padding: 0 0 0 0;
	}
	.lineUp2col{
		margin: 0 0 0 0;
	}
	.lineUp4col{
		margin: 20px 0 0 0;
	}
	.lineUp6col{
		width: 100%;
	}
	.listLineUp li{
		width:calc((100% - 10px)/2);
		margin:10px 10px 0 0;
	}
	.listLineUp li:nth-of-type(2n){
		margin:10px 0 0 0;
	}
	.listLineUp li:last-of-type{
		margin: 10px 0 0 0;
	}
	.listLineUp li:nth-of-type(6n){
		margin:10px 0 0 0;
	}
	.listLineUp1col li{
		width:100%;
		margin:10px 0 0 0;
	}
	.listLineUp p{
		padding:3px 0 0;
	}
}



/*
	トピックス
-----------------------------------------------------------------------------------------------*/
.listTopix li{
}
.listTopix li:nth-of-type(2n){
}
.listTopix li figure{
	width: 100%;
	transition: opacity 0.2s;
	border: #F2F2F2 2px solid;
}
.listTopix li figure img{
	display: block;
	width: 100%;
	transition: 0.2s;
}
.listTopix li a:hover figure img{
	opacity: 0.8;
}
.listTopix li .topixBox{
	padding: 20px;
	background-color: #F2F2F2;
}
.listTopix li .topixBox .data{
	display: block;
	padding: 0 0 10px;
	font-size: 1.2rem;
	font-weight: bold;
	color: #B49E53;
}
.listTopix li .topixBox .tit{
	padding: 0 0 5px;
	font-size: 1.6rem;
}
.listTopix li a:hover .topixBox{
	opacity: 0.8;
}
.listTopix p{
	overflow: hidden;
	display: -webkit-box;
    -webkit-box-orient: vertical;
/*    -webkit-line-clamp: 3;*/
}

@media screen and (max-width:667px){
	.listTopix li{
		margin: 10px 0 0 0;
		width: 100%;
		float: none;
	}
	.listTopix li:nth-of-type(4n){
		margin: 10px 0 0 0;
	}
	.listTopix li .topixBox{
		padding: 15px;
		height: auto;
	}
	.listTopix li .topixBox .tit{
		padding: 0 0 3px;
		font-size: 1.5rem;
	}
	.listTopix li figure {
		height: auto;
	}
	.listTopix li figure img {
		display: block;
		-webkit-transform: none;
		-ms-transform: unset;
		transform: none;
		position: unset;
		top: auto;
		left: auto;
	}
	.listTopix li a:hover figure img {
		-webkit-transform: none;
		-ms-transform: unset;
		transform: none;
	}

}


/*
	バナー
-----------------------------------------------------------------------------------------------*/
#bnrAreaOut{
	background-color: #E5E2CF;
}
#bnrAreaIn{
	width:1160px;
	padding:30px;
	margin:0 auto;
}
.listBnr{
	display: -ms-flex;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	justify-content: space-between;
}
.listBnr li{
	width: 203px;
}
.listBnr li:last-of-type{
	margin: 0 0 0 0;
}
.listBnr li figure{
	margin: 0 0 5px;
}
.listBnr li figure img{
	width: 100%;
	border: 1px solid #B3B3B3;
	border-radius: 10px;
}
.listBnr li .txt{
	font-size: 1.2rem;
}
.listBnr li a figure{
	transition: 0.3s;
}
.listBnr li a:hover figure{
	opacity: 0.7;
}
@media screen and (max-width:667px){
	#bnrAreaIn{
		width:100%;
		padding:15px;
	}
	.listBnr{
		display: block;
	}
	.listBnr li{
		width: 100%;
		margin: 0 0 10px 0;
	}
}