@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP|Noto+Serif+JP');

* {
	box-sizing: border-box;
	font-size: 10pt;
	font-family: 'Noto Serif JP', serif;
	line-height: 16pt;
}

body {
	background-color: gray;
	margin: 0;
	padding: 0;
}

main {
	width: 210mm;
	margin-left: auto;
	margin-right: auto;
	background-color: white;
}

div {
	padding: 0.125em 0.25em;
}

/* キャラクターページ */
.page-character {
	display: grid;
	grid-template-rows: auto auto auto;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	grid-template-areas:
		"ability ability image  image profile profile"
		"skill   skill   skill  skill skill   skill"
		"special special special other other   other";
	page-break-after: always;
}

.ability-area {
	grid-area: ability;
}

.image-area {
	grid-area: image;
}

.profile-area {
	grid-area: profile;
}

.skill-area {
	grid-area: skill;
	margin-top: 0.75em;
}

.special-area {
	grid-area: special;
	margin-top: 0.75em;
}

.other-area {
	grid-area: other;
	margin-top: 0.75em;
}

/* テーブル基本 */
div > table {
	margin-top: 0.5em;
}

div.other-area > table {
	margin-top: 0.375em;
}

div > table:first-child {
	margin-top: 0;
}

table {
	border: solid black 1px;
	border-collapse: collapse;
	width: 100%;
}

table th, table td {
	border: solid black 1px;
	padding-left: 0.5em;
	padding-right:0.5em;
}

table th {
	background-color: lightgray;
	font-family: 'Noto Sans JP', sans-serif;
}

/* キャラクター画像 */
.character-img {
	overflow: hidden;
	border: solid black 1px;
	width: 100%;
	height: 23em;
	margin-top: 0.5em;
}

.character-img > img {
	width: 100%;
}

/* クラス、レベル */
table.char-lvl {
	margin-top: 1em;
}

/* プロフィール */
table.char-prof {
	margin-top: 1em;
}

/* スキル */
table.skill-table td {
	padding-right: 0;
}

table.skill-table td > div {
	display: flex;
}

table.skill-table td > div > div{
	width: 3em;
}

table.skill-table td > div {
	padding: 0;
}

table.skill-table td > div > div{
	padding-top: 0;
	padding-bottom: 0;
}

table.skill-table td > div > div:first-child {
	border: solid gray 1px;
	width: 1.5em;
	font-size: small;
}

table.skill-table td > div > div:nth-child(2) {
	flex: 1;
	padding-left: 0.5em;
}

table.skill-table td > div > div:nth-child(n+3) {
	border-left: dashed gray 1px;
}

/* 余力、耐久度、魔那、移動力 */
table.valiables tr:first-child > th {
	width: 20%;
}

/* 武器 */
table.wepon tr > td:nth-child(2) {
	width: 2em;
}

table.wepon tr > td:nth-child(3) {
	width: 10em;
}

table.wepon tr > td:nth-child(4) {
	width: 2em;
}

table.wepon tr > td:nth-child(5) {
	width: 2em;
}

/* ダメージ軽減 */
table.defence tr > th {
	width: 25%;
}

/* 特技 */
table.special-table tr > th:first-child{
	width: 1em;
}

/* 呪文ページ */
.page-spell {
	page-break-after: always;
}

table.spell-table th:nth-child(1) {	/* Lv */
	width: 2em;
}

table.spell-table th:nth-child(3) {	/* 宣言 */
	width: 8em;
}

table.spell-table th:nth-child(4) {	/* MP */
	width: 4em;
}

table.spell-table th:nth-child(5) {	/* 効果時間 */
	width: 6em;
}

table.spell-table th:nth-child(6) {	/* 距離*/
	width: 4em;
}

table.spell-table th:nth-child(7) {	/* 範囲 */
	width: 5em;
}

table.spell-table th:nth-child(8) {	/* 判定 */
	width: 4em;
}

table.spell-table th:nth-child(9) {	/* 防御 */
	width: 4em;
}


/* 幅、位置指定 */
.em-3 {
	width: 3em;
}

.em-4 {
	width: 4em;
}

.em-6 {
	width: 6em;
}

.top {
	vertical-align: top;
}

.right-bottom {
	text-align: right;
	vertical-align: bottom;
}

@media print {
	body {
		background-color: white;
	}
}