@charset "UTF-8";
/* ==========================================================================
   デフォルトスタイル
   ========================================================================== */

:root {
	--main-width: 115em;
}

html, body {
	margin: 0;
	padding: 0;
	-webkit-text-size-adjust: 100%;
}

html {
	background: var(--primar-background);
	font-family: var(--primary-font-family);
	font-size: var(--primary-font-size);
	line-height: var(--primary-line-height);
	letter-spacing: var(--primary-letter-spaceing);
	color: var(--primary-color);
}

*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

a {
	color: var(--link-color);
	padding: 10px 10px;
}

p {
	margin: 0px;
	padding: 10px 10px;
}

ol, ul {
	list-style: none;
	padding: 0px;
}

li {
	display: list-item;
}

input[type=text], input[type=password], textarea {
	width: 100%;
	border: 1px solid #d9d9d9;
	border-style: solid;
	border-radius: 0.25rem;
	padding: 8px 10px;
	font-family: var(--primary-font-family);
	font-size: 1.1rem;
}

input[type=text]:disabled {
	color: #000000;
	background: #E8E8E8;
	border-color: #BBBBBB;
}

input[readonly] {
	color: #000000;
	background: #E8E8E8;
	border-color: #BBBBBB;
}

textarea[readonly] {
	color: #000000;
	background: #E8E8E8;
	border-color: #BBBBBB;
	resize: none;
}

textarea[resizedisabled] {
	resize: none;
}

@media screen and (max-width: 480px) {
	/* 480px以下に適用されるCSS（スマホ用） */
	input[type=text], input[type=password], textarea  {
		padding: 5px 5px;
	}
}

button {
	width: 100%;
	background-color: var(--primar-button-background);
	color: var(--primar-button-color);
}

button:disabled {
	background-color: var(--disabled-button-color);
}

.nl2br {
	white-space: pre-wrap;
}