/* ==========================================================================
   Public 2018/11/06
============================================================================= */
@import url('https://use.fontawesome.com/releases/v5.1.0/css/all.css');
/* body, html { width:100%; height:100%; } */

body { 
	font:15px/1.6 Arial, Meiryo, "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", sans-serif;
	letter-spacing:0.06em;
	color:#ccc;
	background:#434d5e url(../img/bg.jpg) right bottom no-repeat;
}

@media screen and (max-width:1000px) {
	body {
		font:20px/1.6 Arial, Meiryo, "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", sans-serif;
		background:#434d5e url(../img/bg.jpg) center bottom no-repeat;
	}
}

img {
	border:none;
	vertical-align:middle;
}


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


a {
	color:#84e1ef;
	text-decoration:none;
}
a:hover { color:#ffa6e7; }


input {
	border-radius:4px;
	border:#FFF 1px solid;
	color:#000;
	background:#ccc;
	padding:8px 10px;
	-webkit-box-shadow: inset 1px 1px 6px rgba(0,0,0,0.2);
    -moz-box-shadow: inset 1px 1px 6px rgba(0,0,0,0.2);
    box-shadow: inset 1px 1px 6px rgba(0,0,0,0.2);
}

select {
	border-radius:4px;
	border:#FFF 1px solid;
	color:#000;
	background:#ccc;
	padding:6px 10px;
	-webkit-box-shadow: inset 1px 1px 6px rgba(0,0,0,0.2);
    -moz-box-shadow: inset 1px 1px 6px rgba(0,0,0,0.2);
    box-shadow: inset 1px 1px 6px rgba(0,0,0,0.2);
}

textarea {
	width:100%;
	border-radius:4px;
	border:#FFF 1px solid;
	color:#000;
	background:#ccc;
	padding:8px 10px;
	-webkit-box-shadow: inset 1px 1px 6px rgba(0,0,0,0.2);
    -moz-box-shadow: inset 1px 1px 6px rgba(0,0,0,0.2);
    box-shadow: inset 1px 1px 6px rgba(0,0,0,0.2);
}


@media screen and (max-width:760px) {
	input { padding:1rem; border-radius:8px; }
}


.clearfix {
    clear: both;
    display: table;
}


#gotop {
    display:none;
    position:fixed;
    right:5px;
    bottom:60px;
    cursor: pointer;
	z-index:30;
}




/* Login
-------------------------------------------------------------------------- */
#login {
	position:relative;
	margin:0 auto;
	width:500px;	
	color:#333;
	text-align:center;
	margin-top:calc((100vh - 75px) / 2 - 230px);
	background:#FFF;
	border-radius:10px;
	padding:30px;
	-webkit-box-shadow: 0 2px 5px rgba(0,0,0,0.4);
    -moz-box-shadow: 0 2px 5px rgba(0,0,0,0.4);
    box-shadow: 0 2px 5px rgba(0,0,0,0.4);
}
#login .btn { padding:10px 20px; font-size:120%; }

.login_title {
	position:absolute;
	top:-60px;
	left:calc(50% - 75px);
}


@media screen and (max-width:760px) {
	#login { width:80%; }
	#login input { max-width:100%; }
}






/* header
-------------------------------------------------------------------------- */
header {
	position:fixed;
	top:0;
	width:100%;
	height:75px;
	padding-left:50px;
	line-height:70px;
	background:#b7670b url(../img/top-bg.png);
	-webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.28);
    -moz-box-shadow: 0 1px 5px rgba(0,0,0,0.28);
    box-shadow: 0 1px 5px rgba(0,0,0,0.28);
	z-index: 1;
}

header .name { position:fixed; top:3px; right:85px; color:#FFF; z-index:1; font-size:120%; }

@media screen and (max-width:1000px) {
	header { padding-left:1rem; }
	header .name { display:none; }
}



/* Content
-------------------------------------------------------------------------- */
#content {
	min-height:calc(100vh - 40px);
	padding-top:100px;
	padding-bottom:40px;
}

.p_line { width:100%; height:1px; margin:1rem 0; border-bottom:#6e7b98 1px dashed; }


@media screen and (max-width:760px) {
	#content { padding-top:90px; }
}

#title { width:100%; margin-bottom:1.5rem; padding:0 40px; }
.title { float:left; }
.search, .back_icon { float:right; }
.search .btn { padding:5px 8px; margin-left:5px; }
.search .btn2 { padding:8px 10px; }
.search .btn3 { padding:5px 8px; margin-left:5px; }

@media screen and (max-width:760px) {
	#title { padding:0 1rem; }
	.title, .search { float:none; font-size:120%; }
	.title { margin-bottom:10px; }
	.search input { width:80%; }
	.search .btn { width:18%; text-align:center; padding:12px 0; }
	.search .btn2 { font-size:80%; }
	.search .btn3 { width:99%; text-align:center; margin:10px 0 0 0; }
}

@media screen and (max-width:480px) {
	.no_480 { display:none; }
}


.info_left {
	float:left;
	width:32%;
	font-size:110%;
	margin-right:8%;
}

.info_right {
	float:left;
	width:55%;
	text-align:center;
}
.info_right img { width:100%; }

.info_right2 { float:left; width:55%; font-size:110%; }

.info_fl { float:left; width:90px; color:#93d300; text-align:right; }
.info_fr { float:left; width:calc(100% - 90px); }
.info_fr2 { float:left; width:calc(50% - 90px); }
.no_fr2 { display:none; }

.info_status { padding:5px; border:#ccc 1px solid; background:#c75100; color:#FFF; font-size:90%; margin-right:5px; }
.info_time { width:90px; padding-left:3px; padding-right:3px; }

.info_btn { padding:5px 8px; margin-left:5px; }
.info_send { width:40%; padding:5px; font-size:110%; text-align:center; }


@media screen and (max-width:1300px) {
	.info_fr2 { width:calc(100% - 90px); }
	.no_fr2 { display:block; }
}

@media screen and (max-width:1000px) {
	.info_left, .info_right, .info_right2 { float:none; margin: 0 auto; width:90%;}
	.info_left, .info_right2 { font-size:100%; }
	.info_fl { width:120px; }
	.info_fr { width:calc(100% - 120px); }
	.info_fr2 { float:left; width:calc(50% - 120px); }
	.no_fr2 { display:none; }
	.info_time { width:120px; padding-left:8px; padding-right:8px; }
}

@media screen and (max-width:760px) {
	.info_left, .info_right2 { width:90%;}
	.info_right { width:80%;}
	.info_fr2 { width:calc(100% - 120px); }
	.no_fr2 { display:block; }
	.no_760 { display:none; }
	.info_btn { padding:10px 15px; vertical-align:middle; }
	.info_btn i { font-size:150%; }	
	.info_send { width:100%; padding:10px; font-size:100%;  }
}

@media screen and (max-width:480px) {
	.info_right { width:75%; }
	.info_fl, .info_fr, .info_fr2 { float:none; width:100%; }
	.info_fl { text-align:left!important; }
}



/* list
-------------------------------------------------------------------------- */
#list {
	margin: 0 auto;
	width:95%;
}

.list1 td:nth-child(1) { text-align:left; }
.list1 td:nth-last-child(3) { text-align:left; }

@media screen and (min-width:1001px) {
	.list1 th { min-width:90px!important; }
}

@media screen and (max-width:760px) {
	#list { width:100%; }
}

.edit_t1, .edit_t2 { width:100%; font-size:90%; }
.edit_t1 th, .edit_t2 th { width:60px; border:#8895b3 1px solid; color:#FFF; padding:5px auto; background:#5c2c0b; }
.edit_t1 td { border:#8895b3 1px solid; color:#FFF; padding:5px; background:#404a31; }
.edit_t2 td { border:#8895b3 1px solid; color:#FFF; padding:5px; background:#4b4b4b; }

.edit_btn { font-size:82%; }

@media screen and (max-width:480px) {
	.edit_btn { width:31%; font-size:90%; margin:1%; text-align:center; }
}


/* footer
-------------------------------------------------------------------------- */
footer {
	width:100%;
	height:40px;
	text-align:center;
	font-size:0.6rem;
	color:#bbb;
}

@media screen and (max-width:760px) {
	footer { height:auto; padding:1rem; }
}



/* popup
-------------------------------------------------------------------------- */
.pop {
	position:fixed;
	top:0;
	left:0;
	width:100vw;
	height:100vh;
	background:rgba(0,0,0,0.6);
	text-align:center;
	z-index:999;
}

.pop article {
	position:relative;
	margin:0 auto;
	top:50%;
    transform:translateY(-50%);
	
	border-radius:10px;
	background:#ddd;
	border:rgba(67,77,94,0.4) 3px solid;
	overflow:hidden;
	padding-bottom:1.5rem;
	
	-webkit-box-shadow: 0 1px 11px 2px rgba(0,0,0,0.55);
    -moz-box-shadow: 0 1px 11px 2px rgba(0,0,0,0.55);
    box-shadow: 0 1px 11px 2px rgba(0,0,0,0.55);
}

.pop_t {
	width:100%;
	padding:5px;
	font-size:110%;
	background:#434d5e;
	text-align:center;
}
.pop_t i { padding-right:5px; }

.pop_info { width:100%; display:table; padding:1rem; color:#434d5e; }
.pop_info_area { display:table-cell; text-align:center; vertical-align:middle; }
.pop_info_area textarea { height:150px; overflow-y:scroll; }
.pop_info .btn { padding:5px 10px; margin:5px 0; }
.pop_info .btn i { padding-right:3px; }

.pop_info .btn2 { width:100px; height:100px; text-align:center; padding-top:20px; margin:10px 15px;  }
.pop_info .btn2 i { font-size:200%; }







/* btn
-------------------------------------------------------------------------- */
.btn_g {
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #74b807;
	text-align:center;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #89c403 5%, #5d8500 100% );
	background:-ms-linear-gradient( top, #89c403 5%, #5d8500 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#89c403', endColorstr='#5d8500');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #89c403), color-stop(100%, #5d8500) );
	background-color:#89c403;
	color:#ffffff;
	display:inline-block;
	text-shadow:1px 1px 0px #528009;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #a4e271;
 	-moz-box-shadow:inset 1px 1px 0px 0px #a4e271;
 	box-shadow:inset 1px 1px 0px 0px #a4e271;
}.btn_g:hover {
	color:#ffffff;
	background:-moz-linear-gradient( center top, #5d8500 5%, #89c403 100% );
	background:-ms-linear-gradient( top, #5d8500 5%, #89c403 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#5d8500', endColorstr='#89c403');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #5d8500), color-stop(100%, #89c403) );
	background-color:#5d8500;
}.btn_g:active {
	position:relative;
	top:1px;
}

.btn_r {
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #d02718;
	color:#ffffff !important;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #f24537 5%, #c62d1f 100% );
	background:-ms-linear-gradient( top, #f24537 5%, #c62d1f 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f24537', endColorstr='#c62d1f');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #f24537), color-stop(100%, #c62d1f) );
	background-color:#f24537;
	color:#ffffff;
	display:inline-block;
	text-shadow:1px 1px 0px #810e05;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #f5978e;
 	-moz-box-shadow:inset 1px 1px 0px 0px #f5978e;
 	box-shadow:inset 1px 1px 0px 0px #f5978e;
}.btn_r:hover {
	color:#ffffff;
	background:-moz-linear-gradient( center top, #c62d1f 5%, #f24537 100% );
	background:-ms-linear-gradient( top, #c62d1f 5%, #f24537 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#c62d1f', endColorstr='#f24537');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #c62d1f), color-stop(100%, #f24537) );
	background-color:#c62d1f;
}.btn_r:active {
	position:relative;
	top:1px;
}

.btn_y {
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #ffaa22;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #ffec64 5%, #ff6f00 100% );
	background:-ms-linear-gradient( top, #ffec64 5%, #ff6f00 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffec64', endColorstr='#ff6f00');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ffec64), color-stop(100%, #ff6f00) );
	background-color:#ffec64;
	color:#802b15;
	display:inline-block;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #fff6af;
 	-moz-box-shadow:inset 1px 1px 0px 0px #fff6af;
 	box-shadow:inset 1px 1px 0px 0px #fff6af;
}.btn_y:hover {
	color:#802b15;
	background:-moz-linear-gradient( center top, #ff6f00 5%, #ffec64 100% );
	background:-ms-linear-gradient( top, #ff6f00 5%, #ffec64 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff6f00', endColorstr='#ffec64');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ff6f00), color-stop(100%, #ffec64) );
	background-color:#ff6f00;
}.btn_y:active {
	position:relative;
	top:1px;
}
.btn_b {
	font-weight:normal;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #469df5;
	text-align:center;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #79bbff 5%, #4197ee 100% );
	background:-ms-linear-gradient( top, #79bbff 5%, #4197ee 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#79bbff', endColorstr='#4197ee');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #79bbff), color-stop(100%, #4197ee) );
	background-color:#79bbff;
	color:#ffffff;
	display:inline-block;
	text-shadow:1px 1px 0px #287ace;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #cae3fc;
 	-moz-box-shadow:inset 1px 1px 0px 0px #cae3fc;
 	box-shadow:inset 1px 1px 0px 0px #cae3fc;
}.btn_b:hover {
	color:#FFF;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #4197ee 5%, #79bbff 100% );
	background:-ms-linear-gradient( top, #4197ee 5%, #79bbff 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#4197ee', endColorstr='#79bbff');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #4197ee), color-stop(100%, #79bbff) );
	background-color:#4197ee;
}.btn_b:active {
	position:relative;
	top:1px;
}

.btn_p {
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #ee1eb5;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #ff87c7 5%, #c9066e 100% );
	background:-ms-linear-gradient( top, #ff87c7 5%, #c9066e 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff87c7', endColorstr='#c9066e');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ff87c7), color-stop(100%, #c9066e) );
	background-color:#ff87c7;
	color:#ffffff;
	display:inline-block;
	text-shadow:1px 1px 0px #c70067;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #fbafe3;
 	-moz-box-shadow:inset 1px 1px 0px 0px #fbafe3;
 	box-shadow:inset 1px 1px 0px 0px #fbafe3;
}.btn_p:hover {
	color:#ffffff;
	background:-moz-linear-gradient( center top, #c9066e 5%, #ff87c7 100% );
	background:-ms-linear-gradient( top, #c9066e 5%, #ff87c7 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#c9066e', endColorstr='#ff87c7');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #c9066e), color-stop(100%, #ff87c7) );
	background-color:#c9066e;
}.btn_p:active {
	position:relative;
	top:1px;
}