/*
 *	common.css
 *	サイト共通初期設定
 */

/*
 *	カスタム変数
 */
:root {
	--darkcolor	:	#412a12;
	--maincolor	:	#856F58;
	--bgcolor	:	#fffefe;
	--bdcolor	:	#e6e8ea;
	--hovercolor	:	#CABCB1;
	--asside-w	: 260px;
}

/*--------------------------------------------------
	タグ要素追加初期設定
 */

*::before,
*::after,
* {
	box-sizing	:	border-box;
	margin	:	0;
	padding	:	0;
	line-height	:	140%;
}

html {
	font-size	:	1rem;
}

h1, h2, h3, h4, h5, h5, h6 {
	word-break: keep-all;
	font-weight	:	normal;
/*
	padding: 0 0.5rem;
*/
	padding: 0.5rem 0;
}

body {
    font-family: "Noto Serif JP", serif;
    font-optical-sizing: auto;
    font-style: normal;
	background-color	:	var(--bgcolor);
	color	:	#333333;
	min-width: 100vw;
	min-height: 100vh;
/*
    position: relative;
*/
}

article {
	background-color	:	var(--bgcolor);
}

ul,ol {
	list-style-type	:	none;
}

ul.disc {
	list-style-type	:	disc;
	padding-left	:	2rem;
}

img {
	vertical-align	:	top;
	line-height	:	1;
}

a {
	text-decoration	:	none;
	color: var(--maincolor);
}

a:hover {
	color: var(--hovercolor);
}

a,
a *,
a::before,
a::after,
li::before,
li::after {
	transition	:	all 0.2s ease;
}

a[target="_blank"]::after {
	margin-left	:	0.5rem;
	content		:	"\f35d";
	font-weight	:	900;
	font-family	:	'Font Awesome 5 Free';
}

/*--------------------------------------------------
	flexbox
 */

.fxw {
	height: 100%;
	display: flex;
	flex-flow: row nowrap;
}

.fxw.wrap {
	flex-wrap: wrap;
}

/*--------------------------------------------------
	修飾
 */

.mt1 {	margin-top	:	1rem;}
.mt2 {	margin-top	:	2rem;}
.mt3 {	margin-top	:	3rem;}
.mb0 {	margin-bottom	:	0 !important;}
.mb2 {	margin-bottom	:	2rem !important;}

.pa2 {	padding: 2rem;}
.pt2 {	padding-top: 2rem;}

.bd2 {
	border: 2px solid var(--maincolor);
}

.lh2 {	line-height: 200%;}

.ib {	display	:	inline-block;}

.tal {	text-align: left;}
.tar {	text-align: right;}
.tac {	text-align: center;}

.ofh {	overflow: hidden;}

.w100 {	width: 100%;}

/*--------------------------------------------------
	clearfix
 */
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {
	display: inline-table;
	zoom: 1; /* for IE5.5 - IE7 */
}

/* Hides from IE-mac \*/
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}