﻿@charset "UTF-8";

/*==============================================================================================
 記事用
==============================================================================================*/
#story > h1 {
	font-size : 48px;
	line-height : 1;
	/* 要素の高さ：48px（要素を配置するときの高さの基準の2倍）*/
}
#story > h2 {
	font-size : 36px;
	line-height : 1.3333;
	/* 要素の高さ：36px（要素を配置するときの高さの基準の2倍） */
}
#story > h3 {
	font-size : 24px;
	line-height : 1;
	padding: 5px;
	/* 要素の高さ：24px（要素を配置するときの高さの基準） */
}
#story > hgroup h2,h4,h5,h6 {
	font-size : 16px;
	line-height : 1.5;
	/* 要素の高さ：16px（要素を配置するときの高さの基準） */
}
.freeWordBox {
	margin: 0 0 0 auto;
	text-align: left;
	flex-direction: column;
	/* frontの記事一覧検索 */
}
#story_text {
	border: 2px solid;
	border-color: #808080;
	margin-left: 3%;
	margin-right: 3%;
	overflow-wrap: break-word;
	padding: 5px;
}
#story_text > h1 {
	font-size : 48px;
	line-height : 1;
	text-align: left;
	/* 要素の高さ：48px（要素を配置するときの高さの基準の2倍）*/
}
#story_text > h2 {
	font-size : 36px;
	line-height: 1.3333;
	text-align: left;
	/* 要素の高さ：36px（要素を配置するときの高さの基準の2倍） */
}
#story_text > h3 {
	font-size : 24px;
	line-height : 1;
	text-align: left;
	/* 要素の高さ：24px（要素を配置するときの高さの基準） */
}
#story_text > hgroup h2,h4,h5,h6 {
	font-size : 16px;
	line-height : 1.5;
	text-align: left;
	/* 要素の高さ：16px（要素を配置するときの高さの基準） */
}
.category {
	margin: 20px 0 0 0;
}

/* フロント記事一覧 */
.story_list {
	/* frontの記事一覧 */
	position: relative;
	width: calc(100% - 25%);
	float: right;
	margin-top: 2%;
}

/* フロント一覧検索欄、ソートボタン、 */
.freeWordBox {
	margin: 0 0 0 auto;
	text-align: left;
}

/* フロント一覧画面カテゴリ一覧、キュレーター一覧含む */
.filter_test {
	width: 22%;
	float: left;
	margin-top: 3%;
}

/* フロント一覧画面カテゴリ一覧、キュレーター一覧個別 */
.category_list {
	border: 2px solid;
	border-color: #808080;
	margin-left: 2%;
	margin-right: 3%;
	margin-top: 3%;
	overflow-wrap: break-word;
	padding: 5px;
	display:block;
}

.story_item {
	float: right;
	position: relative;
	width: calc(100% - 30%);
}

.story_image {
	width: 20%
}