@CHARSET "UTF-8";
/* 直接編集はしないこと */

*
{
	font-family:
	Meiryo ,
	'メイリオ',
	'Hiragino Kaku Gothic Pro',
	'ヒラギノ角ゴ Pro W3',
	'ＭＳ Ｐゴシック',
	sans-serif;
	font-size: 100%;
	padding: 0px;
	margin	: 0px;
	vertical-align: middle;
}

/* テーブル */
table
{
	border-collapse	: collapse;
	margin: 10px auto;
	width: 100%;
}
table[class^="TypeMax"]
{
	margin: 10px 0;
}

th,td {
	border: solid #333 1px;
	font-weight: normal;
	padding: 10px;
	text-align: left;
}
table#list th
{
	background-color : #f5f5f5;
}
/*
table[id^=list] tbody
{
	background-color : #fff;
}
*/
table[id^=list] tr:hover td
{
	background-color : #ccc;
	cursor: pointer;
}

table#pdb tr:hover td
{
	background-color : #ccc;
}

tr.none-decoration td {
	border-style: none;
}

table tbody tr td input[id^="pdc-"],
table tbody tr td input[type=checkbox],
#content dl dd input[type=checkbox] {
	width: 2em;
	height: 2em;
}

li {
	margin-left: 2em;
}

table.option tr td,
table.option tr th
{
	text-align: center;
	padding: 2px;
	border: 1px solid #000;
	font-size: 75%;
	height: 30px;
	width: 30px;
	float: left;
}


::placeholder {
	color: #ccc;
}

/* カーソル操作 */
.cursor-hide {
	cursor: none;
}


/* 画面フォーム */

header {
	font-size: 80%;
	margin: 10px 0;
	padding: 10px;
	text-align: right;
	width: calc(100% - 20px);
}

#select-division {
	font-size: 80%;
	margin: 10px 0;
	position: absolute;/*fixed;*/
	left: 10px;
  top: 10px;
}
span#select-division-name {
	background-color: #eee;
	border-radius: 12px;
	color: #666;
	font-weight: bold;
	padding: 1em;
}

img.ui-datepicker-trigger{
  cursor: pointer;
  margin-left: 7px!important;
  vertical-align: middle;
}

span#head-login-name {
	background-color: #ccc;
	border-radius: 12px;
	color: #333;
	cursor: pointer;
	font-weight: bold;
	padding: 1em;
}
span#head-login-name:hover {
	background-color: #eee;
	color: #ccc;
}

/* ********************
 * ヘッダーバー
 ******************** */
#headerBar {
	display: flex;
}
#headerBarLeft{
	padding: 5px;
	margin: 0 10px;
	text-align: left;
	text-decoration-line: none;
	flex:3;
}
#headerBarRight{
	padding: 5px;
	margin: 0 10px;
	text-align: right;
	text-decoration-line: none;
	flex:3;
}
#headerBarRight input[type=radio] ,
#headerBarRight label {
	cursor: pointer;
}
#headerBarRight label {
	margin-left: 5px;
	margin-right: 10px;
}
#headerBarCenter {
	padding: 5px;
	text-align: center;
	flex:4;
}
.btnHeaderBar {
	cursor: pointer;
	margin: 10px;
	padding: 5px;
	text-align: center;
	text-decoration-line: none;
}

/* ********************
 * コントロールボタン
 ******************** */
 .arrows {
	margin-top: 10px;
	width: 100%;
	text-align: right;
}
/* 通常のボタン色 */
.btnUsually {
	cursor: pointer;
	display:  inline-block;
	color: #fff;
	text-decoration:  none;
	padding:  10px 20px;
	border-radius: 5px;
}
.btnCopy , .btnRegister {
	cursor: pointer;
	display:  inline-block;
	text-decoration:  none;
	padding:  10px 20px;
	border-radius: 5px;
}
/* 矢印 */
.btnArrowLast ,
.btnArrowNext {
	cursor: pointer;
	display:  inline-block;
	text-decoration:  none;
	padding:  10px 20px;
	border-radius: 5px;
}
.btnArrowLast::after {
	content:  '';
	width: 0;
	height: 0;
	border-style: solid;
	display:  inline-block;
	vertical-align:  middle;
	position:  relative;
	top: -2px;
	margin-right: 2px;
	border-width: 7px 7px 7px 0;
	border-color: transparent #ffffff transparent transparent;
}
.btnArrowNext::before {
	content:  '';
	width: 0;
	height: 0;
	border-style: solid;
	display:  inline-block;
	vertical-align:  middle;
	position:  relative;
	top: -2px;
	margin-right: 2px;
	border-width: 7px 0 7px 7px;
	border-color: transparent transparent transparent #ffffff;
}

/* ********************
 * コンテンツボタン
 ******************** */
/* #content input[type=button][class^='btn-']*/

#content input[id^='btn-']
{
	 height: 50px;
	 margin: 10px auto;
	 width: 150px;
	 cursor: pointer;
}

#content input[id^='btn-Rpt'] ,
#content input[id^='btn-Download'] ,
#content input[id^='btn-Upload']
{
	 width: 120px;
}

#content #search input[id^='btn-']
{
	 width: 100px;
}



div#space-bottom {
	height: 80px;
}

footer {
		z-index: -999;
        bottom: 0;
        font-size: 70%;
        height: 30px;
        left: 0;
        position: fixed;
        text-align: center;
        text-decoration-line: none;
        width: 100%;
}
footer a{
        text-decoration-line: none;
}

/* ログイン画面 */

div#body-login
{
	text-align: center;
}
div#body-login p
{
	font-size: 200%;
	margin: 30px 0;
}
div#body-login dt ,
div#body-login dd
{
	margin: 10px 0;
}
div#body-login input
{
	height: 30px;
	width: 200px;
}
div#body-login #login-button
{
	height: 50px;
	margin: 20px 0;
	width: 200px;
}

/* 通常画面 */

#content
{
	margin: 0 20px;
	padding: 0;
}

#content input[type=button].in
{
	width: 100px;
}

#content dl
{
	margin: 30px auto;
}

#content dt{
  float: left;
}

#content dd{
  margin-left: 12em;
  margin-bottom: 5px;
}

/* 検索 */

div#search {
	margin-top: 5px;
}


/* ボタン */
#content #buttons
{
	margin: 10px auto;
	width: calc(100% - 20px);
}

/* メニュー */

dl.menu-title dt
{
	margin: 0 0 5px;
}
dl.menu-title dd
{
	margin: 0 0 10px;
}
dl.menu-title dd input[type=button]
{
	background-color: #111;
	color: #fff;
	height: 50px;
	margin: 10px;
	width: 150px;
	cursor: pointer;
}

/*
 * TOPボタンの装飾
 */
#to-top {
  width: 60px;
  height: 60px;
  position: fixed;
  right: 40px;
  bottom: 20px;
  background: #ccc;
  opacity: 1;
  border-radius: 50%;
}
#to-top a {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  text-decoration: none;
}
#to-top a::before {
  content: '';
  width: 25px;
  height: 25px;
  border: 0px;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  position: absolute;
  top: 25px;
  left: 17px;
}

/*
 * メッセージの演出
 * $paramu["msg"]に値があるとに表示されます
 */
#message {
  color: #000;
  width: 100%;
  height: 100%;
  position: fixed;
  text-align: center;
  vertical-align: middle;
  left: 0;
  top: 0;
  background: #f0f8ff;
  opacity: 0.7;
  border-radius: 50px;
}
#message .inner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50% , -50%);
}

#check-all {
	cursor: pointer;
}

/* 検索 */

#sbox {
  z-index: 999;
  background: #f0f8ff;
  color: #000;
  overflow: scroll;
  position: fixed;
  height: calc(100% - 100px);
  text-align: center;
  top: 50px;
  left: 40px;
  width: calc(100% - 80px);
}

#sbox #sbox-search {
	margin: 50px;
	padding: 20px;
}

#sbox #sbox-search input[type="button"]{
	width: 150px;
	height: 50px;
}

#sbox table {
	margin: 50px;
	width: calc(100% - 100px);
}

/* 一行全部を選択 */
#sbox table tr.tr-selected td {
	color: #fff;
	background-color: #666;
}

.win-close-box {
  margin: 20px;
  text-align: right;
  width: calc(100% - 40px);
  cursor: pointer;
}
.win-close {
  display: inline-block;
  vertical-align: middle;
  color: #333;
  line-height: 2;
  width: 2em;
  height: 0.1em;
  background: currentColor;
  border-radius: 0.5em;
  position: relative;
  transform: rotate(45deg);
  cursor: pointer;
}

.win-close::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: inherit;
  border-radius: inherit;
  transform: rotate(90deg);
}

#sets {
  border: 2px solid #000;
  overflow: scroll;
  width: 100%;
}
#sets table {
  margin: 20px;
  text-align: right;
  width: calc(100% - 40px);
}

@media screen and (min-width: 1024px) {
	#sets {
	  background: #f0f8ff;
	  color: #000;
	  position: fixed;
	  height: calc(90% - 220px);
	  text-align: center;
	  top: 220px;
	  right: 40px;
	  width: calc(50% - 40px);
	  opacity: 0.7;
	}
}


/* ボタンシリーズ */
.btn_delete , .btn_check {
    display: block;
    width: 30px;/*枠の大きさ*/
    height: 30px;/*枠の大きさ*/
    background: #CCC;
    position: relative;
    cursor: pointer;
}

.btn_delete::before, .btn_delete::after {
    content: "";
    display: block;
    width: 100%;/*バツ線の長さ*/
    height: 5px;/*バツ線の太さ*/
    background: #000;
    transform: rotate(45deg);
    transform-origin:0% 50%;
    position: absolute;
    top: calc(14% - 2.5px);
    left: 14%;
}

.btn_delete::after {
    transform: rotate(-45deg);
    transform-origin:100% 50%;
    left: auto;
    right: 14%;
}

.btn_check::before {
    content: "";
    display: block;
    width: 30px;/*枠の大きさ*/
    height: 15px;/*枠の大きさ*/
    border-left: 3px solid #f00;
    border-bottom: 3px solid #f00;
	transform: rotate(-45deg);
}

.btn_report_select {
	width:300px;
	height:80px;
	border-radius:20px;
	margin:5px;
	color:#fff;
	background-color:#666;
	border:none;
	cursor:pointer;
}
.btn_report_select:hover {
	background-color:#999;
}

/* 取引入力 */

.content-box {
	width: 100%;
}

.content-inner {
	margin: 0 auto;
	width: auto;
}

.trader-box {
	border: 1px solid #000;
	float: left;
	margin: 1px;
	padding: 5px;
	width: 32%;
}

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

/*ドロップアップロード機能*/
.UploadArea {
    margin: auto;
    width: 85%;
    height: 300px;
    position: relative;
    border: 1px dotted rgba(0, 0, 0, .4);
    text-align: center;
    display: none;
}
.UploadArea:hover {
	background-color: rgba(144, 144, 144, .1);
	border: 1px dotted rgba(0, 0, 0, .6);
}
.DragOver {
	border: 1px solid rgba(0, 0, 0, .9);
}
.UploadArea i {
    position: absolute;
    font-size: 160px;
    opacity: .1;
    width: 100%;
    left: 0;
    top: 40px;
}
i.fa-check-circle {
	display: none;
}
.UploadArea p {
    width: 100%;
    position: absolute;
    top: 220px;
    opacity: .8;
}
#UploadFile {
    top: 0;
    left: 0;
    opacity: 0;
    position: absolute;
    width: 100%;
    height: 100%;
}
#btn-Upload {
	display: none;
}
p.ErrorMessage {
	color: red;
	display: none;
	margin: 20px 0 0;
}
.UploadAreaNext {
    margin: auto;
    text-align: center;
}