@charset "UTF-8";

/* =============================================== */
/*
  ログオン画面
*/
/* =============================================== */
/*
  【注釈】
  (※1) 高さ em 指定は全同値とする
  (※2) 各要素の幅は，これを超えない
*/
/* =============================================== */

/*
  基底
*/
body {
	background-color: #FFFFFF;
	font-size: 80%;
	font-family: 'ＭＳ ゴシック', 'Osaka－等幅', monospace;
	line-height: 1.2;									/* (※1) */
	text-align: center;
}

/*
  input要素
*/
input {
	font-family: 'Arial', 'ＭＳ ゴシック', 'Osaka－等幅', monospace;
}

/*
  段落要素
*/
li:before {
	display: inline-block;
	width: 0.2em;
	height: 0.2em;							/* 上に同値 */
	margin-right: calc( 1em - 0.2em );		/* 上に同値 calc( 1em - x ) */
	border-radius: 100%;
	background-color: #000000;
	vertical-align: middle;
	content: '';
}

/*
  ページ
*/
.page {
	min-height: 100vh;
	margin: 0 auto;
	position: relative;				/* 相対位置 */
	padding-bottom: 40px;			/* footer 高さ */
	box-sizing: border-box;			/* 全プロパティを含める考慮 */
}
/* コンテンツ */
.pageHeader
, .contentsLine {
	min-width: 620px;									/* (※2) */
}
.page .pageMain .contentsLine > div {
	display: inline-block;
	text-align: left;
	vertical-align: top;
}
.page .pageMain .contentsBox
, .page .pageMain .contentsBoxL {
	background-color: #FFFFFF;
	margin: 15px 10px;
}
.page .pageMain .contentsBox {
	width: 430px;
}
.page .pageMain .contentsBoxL {
	width: 550px;
}
.contentsPanel {
	display: table;
	width: 100%;
	border-collapse: collapse;
}
.contentsPanel .row {
	display: table-row;
}
.contentsPanel .row .col {
	display: table-cell;
	border: 1px solid #000000;
	vertical-align: middle;
}
.contentsPanel .row .col > div {
	padding: 2px;
}
.contentsPanel + .contentsPanel {
	margin-top: -1px;				/* 1pxの隣合うborderを重ねる */
}
.separate {
	border-top: 1px solid #000000;
}

/*
  ヘッダ
*/
.pageHeader {
	background-color: #FFFFFF;
	width: 100%;
	min-height: 50px;
	padding: 10px 0;
}
/* ロゴ */
.logo {
	width: 272px;
	height: auto;
}

/*
  ログオン
*/
.logonBox {
	width: 430px;
	margin: 0 auto;
}
.logonTitle {
	color: #FF3333;
	padding: 5px 0 0 30px;
}
.main {
	text-align: center;
	padding: 0 20px;
}
.inputItem {
	display: inline-block;
	margin: 15px 0;
}
.inputItem .inputMessage
, .inputItem .errorMessage {
	text-align: left;
}
.inputMessage {
	color: #006666;
	margin: 0 0 15px 0;
}
.inputForm
, .inputForm th, .inputForm td {
	border-spacing: 0px;
	border: 1px solid #000000;
	padding: 0px;
}
.inputForm tr {
	height: 40px;
}
.inputForm th {
	background-color: #006666;
	width: 130px;
	color: #FFFFFF;
	font-weight: normal;
	text-align: center;
}
.inputForm td {
	padding: 0 10px;
}
.errorItem {
	margin: 5px 0;
}
.errorMessage {
	color: #FF3333;
}
.main .inputItem .buttonBox {
	text-align: center;
	margin: 30px 0 0 0;
}
.logonButton {
	width: 84px;
	height: 23px;
	border: 0px none;
}

/*
  お知らせ欄
*/
.infoBox {
	margin: 15px 0 0;
}
.infoBox + .infoBox {
	margin: 0 0 15px;
}
.infoTable {
	width: 100%;
	table-layout: fixed;
}
.infoTable
, .infoTable th, .infoTable td {
	border-spacing: 0px;
	border: 1px solid #000000;
	padding: 0px;
}
.infoTable th {
	background-color: #006666;
	color: #FFFFFF;
	font-weight: normal;
	text-align: center;
	padding: 2px;
}
.infoContents {
	height: calc( 1.5em * 15 );
	font-size: 100%;
	line-height: 1.5;
}
.infoMessage {
	padding: 0 2px;
}
.infoMessage > div {
	background-color: #FFEEEE;
	font-weight: bold;
}
.infoMessage > p {
	color: #333333;
	border-top: 1px solid #A6A6A6;
	padding-left: 1em;
}
.infoContents
 > .infoMessage + .infoMessage {
	border-top: 1px solid #000000;
	margin-top: 1.5em;
}

/*
  CRC e-Laboについて
*/
.title {
	font-weight: bold;
}
.title, .colorTitle, .subTitle
, .logoVerisign {
	text-align: center;
}
.article > div {
	padding-bottom: 1.2em;								/* (※1) */
}
.article > div > p
, .article > div > a {
	padding-left: 1em;
	line-height: 1.5;
}
.article > div > div {
	padding-left: 1em;
}
.article > div > p > span {
	display: inline-block;
	vertical-align: top;
}
/* 動作環境 */
.sysRequire > table tr {
	height: 1.2em;										/* (※1) */
}
.sysRequire > table th
, .sysRequire > table td {
	vertical-align: top;
}
.sysRequire > table th {
	font-weight: normal;
}

/*
  個人情報保護ポリシーについて
*/
.colorTitle {
	background-color: #006666;
	color: #FFFFFF;
}
.comdata {
	text-align: center;
}
.policyBox {
	width: auto !important;
}
.policyArticle {
	white-space: nowrap;
	padding: 1.2em 1em !important;						/* (※1) */
}
.policyArticle > div + div {
	padding-top: calc( 1.2em * 2 );						/* (※1) */
}
.policyArticle > div > dl {
	padding-left: 0em;
}
.policyArticle > div > dl > dt {
	padding-bottom: 1.2em;								/* (※1) */
}
.policyArticle > div > dl > dd {
	padding-bottom: 1.2em;								/* (※1) */
}
.policyArticle > div > dl
 > dd > span {
	display: inline-block;
	vertical-align: top;
}
.policyArticle > div > dl
 > dd > span + span {
	margin-left: -0.5em;
}