:root{
--btn-color : #1880C0;//E85848
--btn-light : #92bcf4 ;//f49c92
--btn-hover : #065282 ;//D02010
--btn-active : #065282 ;//D02010
--main-color : #1880C0 ;//E83828
--bg-color : #e5f0ff ;//ffece5
--font-color : #3c3c3c ;//3c3c3c
--a-color : #065282 ;//983828
--a-visited-color : #1880C0 ;
--a-hover-color : #1880C0 ;
--color-blue:#0080FF;
--color-darkblue:#0080FF;
--color-red:#D00;
}

/*初期設定*/

.white{
	color:#FFF;
}

.main-color{
	color:#1880C0;
}

.sub-color{
	color:#C03030;
}

.main-light{
	color:#92bcf4;
}

.main-hover{
	color:#065282;
}

.bg-color{
	color:#e5f0ff;
}

.font-color{
	color:#3c3c3c;
}

.red{
	color:#D00;
}

.water{
	color:#82bcff;
}

.blue{
	color:#0080FF;
}

.darkblue{
	color:#0e6cc9;
}

.yellow{
	color:#ffe31e;
}

.darkyellow{
	color:#aa8818;
}

.bold{
	font-weight:bold;
}

.usui{
	color:#888;
}

.more-usui{
	color:#DDD;
}

.mini{
	font-size:0.5rem;
}

.small{
	font-size:0.7rem;
}

.midium{
	font-size:0.8rem;
}

.default{
	font-size:1.0rem;
}

.large{
	font-size:1.2rem;
}

.bg_main{
	background:#1880C0;
}

.bg_submain{
	background:#C03030;
}

.bg_bg{
	background:#e5f0ff;
}

.bg_gray{
	background:#555;
}

.bg_pink{
	background:#ed6aca;
}

.bg_pur{
	background:#642EFE;
}

.bg_gre{
	background:#27BE40;
}

.bg_bul{
	background:#3194F0;
}

.bg_dbl{
	background:#1549b2;
}

.bg_yel{
	background:#CEA20F;
}

.bg_die{
	color:#EEE;
	background:#D5D5D5;
}

.bg_white{
	background:#FFF;
}

.bd_main{
	border:2px solid #1880C0;
}

.bd_sub{
	border:2px solid #C03030;
}

.bd_gry{
	border:2px solid #555;
}

.bd_bul{
	border:2px solid #3194F0;
}

.bd_dbl{
	border:2px solid #0e6cc9;
}

/*特殊*/
.center{
	width:100%;
	text-align:center;
}

.right{
	width:100%;
	text-align:right;
}

.right-center{
	width:100%;
	text-align:right;
	display:block;
	margin-top:0.4rem;
}

.pointer{
	cursor:pointer;
}

.arrow-r:after{
	content:"";
	position:relative;
	top:50%;
	left:1.0rem;
	display:inline-block;
	width:0;
	height:0;
	padding:0;
	border-left:0.5rem solid #555;
	border-top:0.5rem solid transparent;
	border-right:0.5rem solid transparent;
	border-bottom:0.5rem solid transparent;
}

.arrow-d:after{
	content:"";
	position:relative;
	top:0.25rem;
	left:0.75rem;
	display:inline-block;
	width:0;
	height:0;
	padding:0;
	border-left:0.5rem solid transparent;
	border-top:0.5rem solid #555;
	border-right:0.5rem solid transparent;
	border-bottom:0.5rem solid transparent;
}

.w_arrow_up:before{
	content:"";
	position:relative;
	top:0.1rem;
	left:0.4rem;
	display:inline-block;
	width:0;
	height:0;
	padding:0;
	margin:0;
	border-left:0.5rem solid transparent;
	border-bottom:0.5rem solid #FFF;
	border-right:0.5rem solid transparent;
	border-top:0.5rem solid transparent;
}

.w_arrow_down:before{
	content:"";
	position:relative;
	top:0.7rem;
	left:0.4rem;
	display:inline-block;
	width:0;
	height:0;
	padding:0;
	margin:0;
	border-left:0.5rem solid transparent;
	border-bottom:0.5rem solid transparent;
	border-right:0.5rem solid transparent;
	border-top:0.5rem solid #FFF;
}

.z-ten{
	z-index:10;
}

.nobr{
	display:inline-block;
}

.margin02rem{
	margin:0.2rem;
}

html{
	font-size:1.0rem;
}

body{
	width:98%;
	background:#e5f0ff;
	font-size:1.0rem;
	font-weight:bold;
	color:#3c3c3c;
}

a{
	text-decoration:none;
}

/*チェックボックス*/
input[type="checkbox"] {
  display: none;
}

label{
  position:relative;
}

label  span{
  padding-left:1.6rem;
}

label span:before{
  content:"　";
  border:2px dotted #CCC;
  border-radius:0.2rem;
  background: #FFF;
  width:1.0rem;
  height:1.0rem;
  position:absolute;
  top:0px;
  left:0px;
  display:inline-block;
  margin-right:1.2rem;
  transition-duration:0.25s;
  cursor:pointer;
  font-size:1.0rem;
}

input[type="checkbox"]:checked + span:before{
  color: #FFF;
  //background: #1880C0;
  border:2px solid #065282;
  transform: rotate(90deg);
}

label span:after{
  content:"";
  border-bottom:4px solid #065282;
  border-right:4px solid #065282;
  width:0.6em;
  height:0.8rem;
  position:absolute;
  top:-0.1rem;
  left:0.3rem;
  display:inline-block;
  cursor:pointer;
  transform: rotate(0deg);
  transition-duration:0.25s;
  opacity:0;
}

input[type="checkbox"]:checked + span:after{
  content:"";
  border-bottom:4px solid #065282;
  border-right:4px solid #065282;
  width:0.6em;
  height:0.8rem;
  cursor:pointer;
  transform: rotate(45deg);
  opacity:1;
}

textarea{
	width:96%;
	border:solid 2px #92bcf4;
	background:#FFF;
	padding:0.5rem;
	margin:2px;
	border-radius:4px;
}

.contents{
	position:relative;
	width:auto;
	font-size:0.8rem;
	border-spacing:2px 4px;
	margin-top:58px;
	margin-left:auto;
	margin-right:auto;
	padding-left:250px;
}

.src_box{
	position:fixed;
	width:60%;
	height:480px;
	padding:20px;
	top:160px;
	left:25%;
	overflow-y:scroll;
	overflow-x:none;
	transition-duration:0.3s;
	z-index:50;
	box-shadow:0 0 128px;
}

.contents_2{
	position:relative;
	width:90%;
	font-size:0.8rem;
	border-spacing:2px 4px;
	margin-top:58px;
	margin-left:0;
	margin-right:auto;
	padding-left:160px;
	transition-duration: 0.4s
}

.comment_list{
	position:fixed;
	top:44px;
	right:-19rem;
	width:20rem;
	height:100%;
	background:#FEFEFE;
	display:block;
	z-index:90;
	/*overflow-y:scroll;
	overflow-x:visible;*/
	transition-duration: 0.4s
}

.comment_toggle{
	position:absolute;
	content:"";
	width:1.4rem;
	height:2.4rem;
	border-radius:2.4rem 0 0 2.4rem;
	background:#AAA;
	color:#FFF;
	left:-1.4rem;
	top:1.0rem;
	text-align:center;
	line-height:2.4rem;
}

.lst_btn{
	position:fixed;
	top:0;
	height:42px;
	width:auto;
	margin:0 auto;
	z-index:200;
}

#lst_btn{
	margin:0;
	padding:0;
	height:42px;
	display:block;
	overflow:hidden;
}

#lst_btn .btn_thin{
	display:inline-block;
	position:relative;
	border-radius:0;
	height:42px;
	top:0;
	left:0;
	margin:0;
	padding:10px 1.0rem 0 1.0rem;
	overflow:hidden;
}

/*INFROFIELD*/
.infofield{
	width:75%;
	margin:0px auto;
	border-spacing:0 20px;
}

.infofield input, .infofield textarea{
	width:96%;
	border:solid 2px #92bcf4;
	border-radius:0.2rem;
	background:#FFF;
	padding:0.5rem;
	margin:2px;
	box-shadow:2px 2px 10px -2px #555;
}

.infofield textarea{
	line-height:150%;
	font-weight:normal !important;
	color:#000 !important;
}

.infofield select{
	border:solid 2px #92bcf4;
	border-radius:0.2rem;
	background:#FFF;
	padding:0.5rem;
	margin:2px;
	box-shadow:2px 2px 10px -2px #555;
}

.infofield th{
	width:200px;
	padding:6px 12px 6px 0px;
	text-align:right;
	font-size:0.9rem;
}

.infofield td{
	line-height:2.0rem;
	word-wrap: break-word;
}

.infofield input.readonly, .infofield textarea.readonly{
	font-weight:bold;
	color:#3c3c3c;
	border:1px solid #DDD;
	background:#FFF;
	box-shadow:none;
}

.loginbox input.readonly, .loginbox textarea.readonly{
	font-weight:bold;
	color:#3c3c3c;
	border:1px solid #DDD;
	background:#FFF;
	box-shadow:none;
}

.infofield label{
	margin-right:-0.6rem;
}

.infofield .users{
	background:#FFF;
	padding:0.4rem;
	margin-top:0.2rem;
	border:2px solid #CCC;
	border-radius:4px;
	display:inline-block;
}

.infofield .form{
	margin-left:4rem;
}

.infofield .formTitle{
	width:20rem;
}

.infofield .formNumber{
	width:2rem;
}

.infofield .formUPrice{
	width:6rem;
}

.infofield .formPrice{
	width:6rem;
}

.infofield .formURemark{
	width:11rem;
}

/*INFOLIST*/
.infolist{
	width:96%;
	margin:0px auto;
	font-size:0.8rem;
	border-spacing:2px 4px;
}

.infolist tbody td{
	line-height:180%;
}

.infolist tbody tr:nth-child(2n) td{
   background: #f4fbff;
}

.infolist tbody tr:nth-child(2n+1) td{
   background: #FFF;
}

.infolist tbody tr:hover{
    -webkit-filter:brightness(0.98);
    -moz-filter:brightness(0.98);
    -ms-filter:brightness(0.98);
    filter:brightness(0.98);
}

.infolist .tdmidasi{
	background:none;
}

.infolist th{
	padding:0.4rem 0.4rem;
	text-align:center;
	font-size:0.8rem;
	color:#fff;
	background:#1880C0;
}

.infolist td{
	text-align:center;
	font-size:0.9rem;
	padding:4px;
	line-height:1.0rem;
	background:#FFF;
}

.userlist{
	position:fixed;
	width:50%;
	height:480px;
	padding:20px;
	top:160px;
	left:25%;
	overflow-y:scroll;
	overflow-x:none;
	transition-duration:0.3s;
	z-index:50;
	box-shadow:0 0 128px;
}

.userlist .infolist{
	width:96%;
}


.contents .infolist td{
	font-size:0.8rem;
	padding:8px 4px;
}


.login{
	width:960px;
	margin:0px auto;
	font-size:0.8rem;
	border-spacing:2px 4px;
}

.login input, .login textarea{
	width:96%;
	border:solid 2px #92bcf4;
	background:#FFF;
	padding:0.5rem;
	margin:2px;
	border-radius:4px;
	box-shadow:2px 2px 10px -2px #555;
}

.login .loginbox{
	width:240px;
	margin:4.0rem auto;
	padding:24px;
	line-height:2.0rem;
	background:#FFF;
	border-radius:6px;
}

.login h1{
	color:#1880C0;
	font-size:1.6rem;
}

.admin_header{
	position:fixed;
	width:100%;
	height:42px;
	top:0;
	left:0;
	background:#1880C0;
	border-bottom:2px solid #92bcf4;
	margin:0;
	padding:0;
	z-index:110;
	overflow:hidden;
	display:block;
}


.admin_header .name{
	position:absolute;
	left:1.0rem;
	top:0.5rem;
}

.admin_header .logout{
	position:absolute;
	right:1.0rem;
	top:0.5rem;
}

.admin_header .btn_thin {
    font-size:0.8rem;
    font-weight:bold;
    padding:0.2rem 0.6rem;
    border-radius:4px;
	margin:0rem;
	white-space: nowrap;
}


.admin_upper{
	position:fixed;
	width:240px;
	height:100%;
	top:44px;
	left:0;
	background:#013556;
	text-align:center;
	margin:0;
	padding:0;
	z-index:100;
	overflow:hidden;
}


.admin_upper .btn_thin {
	background:#065282;/*#065282;*/
	display:block;
	position:relative;
    font-size:0.9rem;
    font-weight:bold;
	border-bottom:2px solid #1880C0;
	border-radius:0;
	width:240px;
	padding:0.6rem 0;
	margin:0;
	white-space: nowrap
}

.admin_upper .name, .admin_upper .logout{
	position:relative;
	top:0;
	left:0;
	display:none;
}

.admin_upper .active:after{
	content:"";
	position:absolute;
	display:inline-block;
	background:#e5f0ff;
	width:1.4rem;
	height:1.4rem;
	transform:rotate(45deg);
	right:-0.7rem;
}

.inform{
	width:96%;
	border:solid 1px #DDD;
	margin:2px;
	background:#FFF;
	border-radius:0.4rem;
	padding:0.5rem;
	height:10.0rem;
	overflow-y:scroll;
	line-height:1.4rem;
}

/*
.contents input, textarea{
	width:96%;
	border:solid 2px #92bcf4;
	background:#FFF;
	padding:6px;
	margin:2px;
	border-radius:4px;
}
*/

.msg_box{
	position:fixed;
	left:45%;
	top:35%;
	padding:1rem 2rem;
	border-radius:0.4rem;
	z-index:150;
	box-shadow:0 0 32px -8px black;
	cursor:pointer;
}

.hidden{
	display:none;
	transition-duration:0.3s;
}

.back-top{
	position:fixed;
	left:20%;
	padding:0 !important;
	font-size:1.6rem !important;
	display:box;
	width:2.6rem;
	height:2.6rem;
}
.back-top:before{
	position:absolute;
	content:"";
	display:box;
	width:1.0rem;
	height:1.0rem;
	top:0.7rem;
	left:0.9rem;
	border-bottom:4px solid #FFF;
	border-left:4px solid #FFF;
	transform:rotate(45deg);
}

.black{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:#000;
	opacity:0.5;
	transition-duration:0.3s;
	z-index:149;
}

.loading{
	position:fixed;
	left:50%;
	top:35%;
	z-index:150;
}

.mod-btn{
	position:relative;
	display:box;
	margin-right:1.6rem !important;
	padding-top:0.2rem !important;
	padding-bottom:0.8rem !important;
}

.mod-btn:after{
	position:absolute;
	content:"";
	width:0.8rem;
	height:0.8rem;
	right:-1.2rem;
	top:0.6rem;
	border-bottom:3px solid #AAA;
	border-right:3px solid #AAA;
	transform:rotate(-45deg);
	line-height:2.6rem;
}

.mod-btn:last-child:after{
	border:none;
}

.mod-dt{
	position:absolute;
	left:0.7rem;
	bottom:-0.6rem;
}

.showmod{
	position:fixed;
	width:60%;
	top:100px;
	left:20%;
	background:#FFF;
	z-index:25;
	padding:24px;
	border:2px solid #CCC;
	border-radius:6px;
	box-shadow: 0 0 128px;
}

.close-mod{
	position:absolute;
	display:box;
	width:2.4rem;
	height:2.4rem;
	top:0.2rem;
	right:0.2rem;
	z-index:50;
	background:#EEE;
	border-radius:0.3rem;
	cursor:pointer;
}
.close-mod:before{
	position:absolute;
	content:"";
	display:box;
	width:1.8rem;
	height:1.8rem;
	top:-0.4rem;
	left:0.85rem;
	z-index:50;
	border-bottom:3px solid #AAA;
	transform:rotate(45deg);
}
.close-mod:after{
	position:absolute;
	content:"";
	display:box;
	width:1.8rem;
	height:1.8rem;
	top:-0.4rem;
	left:-0.4rem;
	z-index:50;
	border-bottom:3px solid #AAA;
	transform:rotate(-45deg);
}

.modtitle{
	width:100%;
	padding:4px 4px 4px 4px;
	margin-bottom:10px;
	text-align:left;
	font-weight:bold;
	font-size:1.4rem;
	color:#1880C0;
	border-bottom:4px solid #1880C0;
	background:none;
}

.moddisc textarea{
	width:96%;
	border:1px solid #DDD;
	border-radius:4px;
	padding:0.6rem;
	background:#FFF;
	box-shadow:none;
}

.mod-dt{ /*プロジェクト詳細上の日時*/
	position:absolute;
	top:0.4rem;
}

.moddate{ /*詳細内の日時*/
	font-weight:bold;
	font-size:0.8rem;
}

.midasi{
	width:100%;
	padding:4px 6px 4px 0.6rem;
	text-align:left;
	font-weight:bold;
	font-size:1.4rem;
	color:#1880C0;
	border-bottom:4px solid #1880C0;
	background:none;
}

.midasi:before{
	content:"";
	display:inline-block;
	width:0;
	height:0;
	margin-right:0.4rem;
	border-top:0.8rem solid #1880C0;
	border-bottom:0.8rem solid #1880C0;
	border-left:0.4rem solid #1880C0;
	border-right:0.4rem solid #1880C0;
}

.sub_midasi{
	width:95%;
	padding:4px 6px 4px 0.6rem;
	margin-left:5%;
	text-align:left;
	font-weight:bold;
	font-size:1.2rem;
	color:#1880C0;
	border-bottom:2px solid #1880C0;
}

.sub_midasi:before{
	content:"";
	display:inline-block;
	width:0;
	height:0;
	margin-right:0.4rem;
	border-top:0.5rem solid #1880C0;
	border-bottom:0.5rem solid #1880C0;
	border-left:0.3rem solid #1880C0;
	border-right:0.3rem solid #1880C0;
}

.subsub_midasi{
	width:90%;
	padding:4px 6px 4px 0.6rem;
	margin-left:10%;
	text-align:left;
	font-weight:bold;
	font-size:1.0rem;
	color:#1880C0;
	border-bottom:2px solid #1880C0;
}

.subsub_midasi:before{
	content:"";
	display:inline-block;
	width:0;
	height:0;
	margin-right:0.4rem;
	border-top:0.5rem solid #1880C0;
	border-bottom:0.5rem solid #1880C0;
	border-left:0.2rem solid #1880C0;
	border-right:0.2rem solid #1880C0;
}

.punc{
	width:90%;
	padding:0px 6px 0px 0.6rem;
	margin-left:10%;
	text-align:left;
	font-weight:bold;
	font-size:1.0rem;
	color:#1880C0;
	border-bottom:2px solid #1880C0;
}

.file-icon{
	position:relative;
	width:8.0rem;
	height:4.0rem;
	display:inline-block;
	background:#1880C0;
	word-wrap: break-word;
	border:2px solid #CCC;
	border-radius:0.4rem;
	color:#FFF;
	font-size:0.8rem;
	line-height:0.9rem;
	margin:0.3rem 0.5rem;
	padding:0.4rem;
	vertical-align:top;
}

.file-icon:hover{
	-webkit-filter:brightness(0.8);
    -moz-filter:brightness(0.8);
    -ms-filter:brightness(0.8);
    filter:brightness(0.8);
}

.file-icon:after{
	content:attr(label)"ファイル";
	position:absolute;
	top:4.0rem;
	right:0.4rem;
	color:#EFEFEF;
	font-size:0.8rem;
}

.file-name{
	color:#FFF;
}

.file-down{
	content:"";
	position:absolute;
	color:#FFF;
	display:inline-block;
	width:4.4rem;
	height:4.8rem;
	border-top-left-radius:0.4rem;
	border-bottom-left-radius:0.4rem;
	background-image:url("../img/dlicon.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-color:rgba(0,0,0,0.5);
	opacity:0.2;
	filter:alpha(opacity=20);
    -moz-opacity: 0.2;
	top:0rem;
	left:0rem;
}

.file-box{
	content:"";
	position:absolute;
	color:#FFF;
	display:inline-block;
	width:4.4rem;
	height:4.8rem;
	border-top-right-radius:0.4rem;
	border-bottom-right-radius:0.4rem;
	background-image:url("../img/prvicon.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-color:rgba(0,0,0,0.5);
	opacity:0.2;
	filter:alpha(opacity=20);
    -moz-opacity: 0.2;
	top:0rem;
	left:4.4rem;
}

.file-down:hover, .file-box:hover{
	opacity:0.8;
	filter:alpha(opacity=80);
    -moz-opacity: 0.8;
}

.img_prev_m{
	height:3.0rem;
	margin:0rem 0.4rem;
	position:relative;
	top:1.2rem;
}

.btn {
    color:#fff;
    font-size:1.0rem;
    font-weight:bold;
    background-color:#1880C0;
    padding:0.4rem 1.0rem;
    border-radius:4px;
	white-space: nowrap
}

.btn:hover {
    /*background-color:#065282;*/
    text-decoration:none;
	color:#fff;
    -webkit-filter:brightness(0.8);
    -moz-filter:brightness(0.8);
    -ms-filter:brightness(0.8);
    filter:brightness(0.8);
}

.btn_def {
    font-size:1.0rem;
    font-weight:bold;
    padding:0.4rem 1.0rem;
    border-radius:0.4rem;
	white-space: nowrap
}

.btn_def:hover {
    /*background-color:#065282;*/
    text-decoration:none;
    -webkit-filter:brightness(0.8);
    -moz-filter:brightness(0.8);
    -ms-filter:brightness(0.8);
    filter:brightness(0.8);
}

.btn_thin {
    font-size:0.9rem;
    font-weight:bold;
    padding:0.2rem 0.8rem;
    border-radius:4px;
	margin:auto 0.2rem;
	white-space: nowrap
}

.btn_thin:hover {
    /*background-color:#065282;*/
    text-decoration:none;
	color:#fff;
    -webkit-filter:brightness(0.8);
    -moz-filter:brightness(0.8);
    -ms-filter:brightness(0.8);
    filter:brightness(0.8);
}

.dark {
    background-color:#3c3c3c;
}

.btn_add{
    color:#fff;
    font-size:0.8rem;
    font-weight:bold;
    background-color:#3c3c3c;
    padding:4px 6px;
    border:none;
    border-radius:4px;
    cursor:pointer;
	white-space: nowrap
}

.btn_add:before{
	content:"＋";
	font-weight:bold;
}

.btn_add:hover {
    /*background-color:#065282;*/
    text-decoration:none;
	color:#fff;
    -webkit-filter:brightness(0.8);
    -moz-filter:brightness(0.8);
    -ms-filter:brightness(0.8);
    filter:brightness(0.8);
}

.btn_del{
    color:#fff;
    font-size:0.8rem;
    font-weight:bold;
    background-color:#D00;
    padding:4px 6px;
    border:none;
    border-radius:4px;
    cursor:pointer;
	white-space: nowrap
}

.btn_del:before{
	content:"－";
	font-weight:bold;
}

.btn_del:hover {
    /*background-color:#065282;*/
    text-decoration:none;
	color:#fff;
    -webkit-filter:brightness(0.8);
    -moz-filter:brightness(0.8);
    -ms-filter:brightness(0.8);
    filter:brightness(0.8);
}

.btn_small {
    color:#fff;
    font-size:0.8rem;
    font-weight:bold;
    padding:0.2rem 0.8rem;
    border-radius:4px;
	white-space: nowrap
}

.btn_small:hover {
    /*background-color:#065282;*/
    text-decoration:none;
	color:#fff;
    -webkit-filter:brightness(0.8);
    -moz-filter:brightness(0.8);
    -ms-filter:brightness(0.8);
    filter:brightness(0.8);
}

.btn_sqr {
    color:#fff;
    font-size:0.8rem;
    font-weight:bold;
    display:inline-block;
	width:1.8rem;
	height:1.8rem;
	position:relative;
    border-radius:4px;
	white-space: nowrap;
	left:2%;
}

.btn_sqr:hover {
    /*background-color:#065282;*/
    text-decoration:none;
	color:#fff;
    -webkit-filter:brightness(0.8);
    -moz-filter:brightness(0.8);
    -ms-filter:brightness(0.8);
    filter:brightness(0.8);
}

.btn_order{
	float:none;
}

.btn_page {
    font-size:0.8rem;
    font-weight:normal;
    padding:0.4rem 0.4rem;
	margin:0.2rem 0.1rem 1.0rem 0.1rem;
	display:inline-block;
	width:1.2rem;
	height:1.2rem;
    border-radius:4px;
	white-space: nowrap
}

.btn_page:hover {
    /*background-color:#065282;*/
    text-decoration:none;
    -webkit-filter:brightness(0.8);
    -moz-filter:brightness(0.8);
    -ms-filter:brightness(0.8);
    filter:brightness(0.8);
}

.btn_page_act {
    font-size:0.8rem;
    font-weight:normal;
    padding:0.4rem 0.4rem;
	margin:0.2rem 0.1rem 1.0rem 0.1rem;
	display:inline-block;
	width:1.2rem;
	height:1.2rem;
    border-radius:4px;
	border-bottom:#1880C0 solid 0.2rem;
	white-space: nowrap
}


.btn_stts_def{
    font-size:0.8rem;
    font-weight:bold;
    background:#FFF;
	border:2px solid #888;
    padding:2px 6px;
    border-radius:4px;
	white-space: nowrap
}

.btn_stts{
    font-size:0.8rem;
    font-weight:bold;
    padding:2px 6px;
    border-radius:4px;
	white-space: nowrap;
	text-decoration:none;
}

.bg_red{
	background:#D00;
}

.hissu{
	color:#FFF !important;
	background:#1880C0 !important;
	font-size:0.6rem;
	padding:2px 4px;
	margin:0 4px;
	border-radius:3px;
	white-space: nowrap
}


@media screen and (max-width: 769px) {
	html{
		font-size:1.2rem;
	}
	
	input[type=text],input[type=password] {
		font-size: 16px;
		transform: scale(0.8);
	}
	
	.nobr{
		display:block;
	}
	
	.right-center{
		width:100%;
		text-align:center;
	}
	
	.w_arrow_up:before{
		top:0.1rem;
		left:0.4rem;
	}

	.w_arrow_down:before{
		top:0.7rem;
		left:0.4rem;
	}
	
	.admin_header{
		height:0;
		display:none;
	}
	
	.admin_upper{
		position:fixed;
		width:80%;
		height:100%;
		top:0;
		left:0;
		background-color: rgba(0,0,0,0.75);
		border-right:2px solid #EEE;
		text-align:left;
		margin:0;
		padding:6px 0px 0px 6px;
		z-index:100;
		transition-duration:0.5s;
	}
	
	.admin_upper .name, .admin_upper .logout{
		position:relative;
		top:0;
		left:0;
		display:block;
	}
	
	.admin_upper .btn_thin{
		width:100%;
		position:relative;
		display:inline-block;
		text-align:center;
		padding:0.6rem auto;
		margin-bottom:0.6rem;
	}
	
	.hide{
		left:-100%;
	}
	
	.menubtn{
		position:fixed;
		top:0.6rem;
		right:0.6rem;
		display:block;
		width:2.6rem;
		height:2.6rem;
		background:#1880C0;
		border:2px solid var(--colo-red);
		border-radius:4px;
		z-index:150;
	}
	
	.menubtn:before{
		content:"";
		display:box;
		color:#FFF;
		position:absolute;
		border-top:4px solid #FFF;
		border-bottom:4px solid #FFF;
		width:1.8rem;
		height:1.2rem;
		top:0.5rem;
		left:0.4rem;
	}
		
	.menubtn:after{
		content:"";
		display:box;
		color:#FFF;
		position:absolute;
		border-top:4px solid #FFF;
		width:1.8rem;
		height:0rem;
		top:1.2rem;
		left:0.4rem;
	}
	
	
	.contents{
		width:100%;
		margin:3.0rem 0 0 0;
		padding:0;
		overflow:hidden;
	}
	
	.src_box{
		width:94%;
		height:60%;
		left:2%;
		top:15%;
		padding:0.2rem;
		z-index:51;
	}
	
	.contents_2{
		width:100%;
		margin:3.0rem 0 0 0;
		padding:0;
		overflow:hidden;
	}

	.comment_list{
		position:fixed;
		top:44px;
		right:-20rem;
		width:20rem;
		height:100%;
		background:#FEFEFE;
		display:block;
		z-index:90;
		overflow-y:scroll;
	}

	
	.back-top{
		position:fixed;
		left:0.6rem;
		top:0.6rem;
		width:2.6rem;
		height:2.6rem;
		z-index:25;
	}
	
	.back-top:before{
		position:absolute;
		content:"";
		display:box;
		width:1.0rem;
		height:1.0rem;
		top:0.7rem;
		left:0.9rem;
		border-bottom:4px solid #FFF;
		border-left:4px solid #FFF;
		transform:rotate(45deg);
	}
	
	.gotop{
		font-size:2.6rem;
		position:fixed;
		bottom:0.6rem;
		right:0.6rem;
		display:block;
		width:2.6rem;
		height:2.6rem;
		background:#1880C0;
		border:2px solid var(--colo-red);
		border-radius:4px;
		z-index:150;
		opacity:0.75;
	}
	
	.gotop:before{
		content:"";
		display:box;
		color:#FFF;
		opacity:0.75;
		position:absolute;
		width:0;
		height:0;
		top:-0.6rem;
		left:0.3rem;
		border-top:1.2rem solid transparent;
		border-right:1.0rem solid transparent;
		border-bottom:1.2rem solid #FFF;
		border-left:1.0rem solid transparent;
	}
	
	.lst_btn{
		position:relative;
		top:auto;
		height:auto;
		width:auto;
		margin:0 auto;
		z-index:50;
	}

	#lst_btn{
		margin:0;
		padding:0;
		height:100%;
		width:100%;
		display:inline-block;
		overflow:normal;
		line-height:1.6rem;
	}

	#lst_btn .btn_thin{
		display:inline-block;
		position:relative;
		border-radius:0.2rem;
		height:auto;
		width:35%;
		top:auto;
		left:auto;
		text-align:center;
		padding:0rem auto;
		margin:0;
		overflow:normal;
	}
	
	.infolist, .infofield{
		width:96%;
		margin:0 auto;
		padding:0;
	}
		
	.infofield th{
		display:inline-block;
		width:96%;
		text-align:left;
		border-top:2px solid #CCC;
		padding:0;
		margin:0;
	}
	
	.infofield td{
		display:inline-block;
		word-wrap: break-word;
		width:96%;
	}
		
	.infofield td .btn{
		display:block;
	}
	
	.infofield .midasi{
		display:inline-block;
	}
	
	.infofield .sub_midasi{
		display:inline-block;
	}
	
	.infofield .note{
		margin-left:12%;
	}
	
	.infofield .form{
		margin:0;
		text-align:left;
	}

	.infofield .formTitle{
		width:96%;
	}

	.infofield .formNumber{
		width:2rem;
	}

	.infofield .formUPrice{
		width:6rem;
	}

	.infofield .formPrice{
		width:6rem;
	}

	.infofield .formURemark{
		width:96%;
	}

	.infolist thead{
		display:none;
		width:0px;
	}
	
	.infolist tbody{
		display:block;
		width:98%;
		margin:0;
		padding:0;
		overflow:hidden;
	}

	.infolist tbody tr{
		margin-bottom:10px;
		border-bottom:1px solid #EEE;
	}
	
	.infolist tbody td{
		margin:0px;
		padding:0;
		display:inline-block;
		width:100%;
		min-height:1.0rem;
		border-bottom:1px solid #EEE;

	}
	
	.infolist tbody td:first-child{
		border-top:0.8rem solid #1880C0;
	}
	
	.infolist tbody td:last-child{
		margin-bottom:20px;
	}
	
	.infolist tbody td midasi:before{
		content:attr(label);
		display:inline;
		position:absolute;
		padding:2px 0;
		float:none;
		left:1%;
		width:3.6rem;
		font-size:0.7rem;
		color:#1880C0;
		border-right:2px solid #1880C0;
	}
	
	td .infolist tbody td midasi:before{
		font-size:0.6rem;
		width:3.6rem;
		margin:0;
		float:none;
		left:6%;
	}
	
	.infolist tbody td midasi{
		display:block;
		width:90%;
		margin-left:15%;
	}
	
	td .infolist tbody td midasi{
		margin-left:2.4rem;
	}
	
	.infolist tbody td .btn_small{
		padding:4px 1.0rem;
		display:inline-block;
		width:50%;
		margin:auto;
	}
	
	.midasi{
		width:100%;
		padding:0.1rem;
		margin:0;
	}
	.sub_midasi{
		width:96%;
		padding:0.1rem;
		margin:0 0 0 3%;
		word-break: normal;
	}
	.subsub_midasi{
		width:92%;
		padding:0.1rem;
		margin:0 0 0 7%;
	}
	.punc{
		width:100%;
		margin:0;
	}
/*	
	.file-icon{
		width:5.0rem;
		height:2.5rem;
		font-size:0.6rem;
		line-height:0.7rem;
		margin:0.2rem 0.3rem;
		padding:0.2rem;
	}

	.file-icon:after{
		top:2.2rem;
		right:0.2rem;
		font-size:0.7rem;
	}
	*/
	.login{
		width:98%;
	}
	
	.login .loginbox{
		width:80%;
		margin:0.2rem auto;
		padding:8px;
		line-height:2.0rem;
		background:#FFF;
		border-radius:6px;
	}

	.infofield{
		width:98%;
		border-spacing:0 20px;
	}

	.infolist{
		width:98%;
	}
	
	.logout{
		display:inline;
		position:static;
	}
	
	.name{
		display:inline;
		position:static;
	}
	
	.showmod{
		position:fixed;
		width:80%;
		top:80px;
		left:3%;
	}
	
	.moddate{
		font-weight:bold;
		font-size:0.6rem;
	}
	
	.modtitle{
		width:100%;
		padding:2px;
		margin-bottom:6px;
		font-size:1.0rem;
	}
	
	.userlist, .nowlist{
		width:94%;
		height:60%;
		left:2%;
		top:15%;
		padding:0.2rem;
	}
	
	.userlist .infolist tr{
		display:block;
		padding:0.2rem 0;
	}	
	.userlist .infolist td{
		padding:0.4rem 0;
	}
	
	.btn_order{
		position:relative;
		left:86%;
	}
	
}