@charset "UTF-8";

/* 横幅786pxまでの画面に対して */
@media (max-width:786px){
/* 縦向き */
#wrap{
	width:auto;
	display:flex;
	flex-direction:column;
	margin:0 auto;
}

/* スマホ版のみ改行 */
.br_media{
	display:block;
}

/* スマホ版のみ非表示 */
.none_media{
	display:none;
}
/********** ↓文字関係↓ **********/
/* h1のサイズ */
h1{
	font-size:clamp(24px, 4.6vw, 36px);
}

/* h3のサイズ */
h3{
	font-size:clamp(15px, 2.9vw, 23px);
}

/* 記事の日付と内容のサイズ */
.news_flex_item time, .news_flex_item p{
	font-size:clamp(14px, 2.8vw, 22px);
}
/********** ↑文字関係↑ **********/

/******************** ↑まとめたもの↑ ********************/

/******************** ↓ファーストビュー↓ ********************/
/* スマホファーストビュー */
.fv_news {
	height:min(48.3vw, 380px);
	margin-top:100px;
}
/* ロゴのサイズと位置関係 */
.logo{
	display:none;
}
/* ファーストビューのタイトル */
.fv_news h1{
	margin-top:min(19.6vw, 154px);
}
/******************** ↑ファーストビュー↑ ********************/


/******************** ↓セクション↓ ********************/
section{
	display:flex;
	justify-content:center;
}
/* 外箱 */
.news_flex_container{
	padding:min(5.6vw, 60px) 0;
}
/* 内箱 */
.news_flex_item{
	width:min(86.5vw, 680px);
	height:clamp(125px, 28.6vw, 225px);
	margin:auto;

	display:flex;
	flex-direction:row;
	padding:0;
	margin-bottom:min(4.5vw, 35px);

}


.news_flex_item:nth-child(3n-2){
	margin-left:auto;
}
.news_flex_item:nth-child(3n-1){
	margin-right:auto;
	margin-left:auto;
}

.news_flex_item:nth-child(3n-3) {
	margin-right:auto;
}
/* 画像 */
.news_flex_item_img{
	width:min(26.7vw, 210px);
	height:clamp(105px, 22.9vw, 180px);
	object-fit:cover;
	margin-top:min(2.5vw, 20px);
	margin-left:min(2.5vw, 20px);
	margin-right:min(2.5vw, 20px);
}

.news_flex_item span{
	display:inline-block;
	width:min(52.2vw, 410px);
	vertical-align:top;
	margin-top:min(1.9vw, 15px);
}

/* 各記事のタイトル */
.news_flex_item h3{
	width:auto;
	height:clamp(80px, 17.8vw, 140px);
	padding-bottom:min(0.4vw, 5px);
}

/* 各記事の日付 */
.news_flex_item time, .news_flex_item p{
	font-size:clamp(14px, 2.8vw, 22px);
	width:min(52.2vw, 410px);
}

/* ページネーション */
.page_btn a, .pagination a, .pagination_now a{
	margin: 2px 0;
	width: 36px;
	height: 36px;
	padding: 10px 0;
} 
.pagination_now a{
	margin: 2px 0;
	width: 36px;
	height: 36px;
	padding: 10px 0;
}
/******************** ↑セクション↑ ********************/

}