@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
*{
box-sizing:border-box;
}
html{
min-height: 100%;
position: relative;
}
body{
font-family: 'Noto Sans Japanese', sans-serif;
margin:0 0 40px;
padding:0;
}
h1,h2,h3,h4{
margin:0;
}
p{
margin:0 0 1em;
}
ul,li{
margin:0;
padding:0;
list-style:none;
}
dl,dt,dd{
margin:0;
padding:0;
}
img{
image-rendering: -webkit-optimize-contrast;
vertical-align:bottom;
}
a {
color:#3057e8;
text-decoration:none;
}
a:hover{
opacity:0.5;
}
a.btn{
display:inline-block;
border-radius:10px;
border:1px solid #dddddd;
font-size:13px;
text-align:center;
}
a.blue{
background-color:#3057e8;
color:#ffffff;
border:none;
}
a.white{
background-color:#ffffff;
color:#010101;
}
a.sky{
background-color:#e9effc;
color:#010101;
}
button{
cursor:pointer;
}

input[type='text'],
input[type='password']
{
border:1px solid #ddd;
padding:4px;
border-radius:5px;
}

/*
   input[type='radio']{
   margin-right:3px;
   }
 */


input[type='radio']{
appearance: none;
position: absolute;
}
input[type='radio'] + label{
position: relative;
display: flex;
align-items: center;
}

input[type='radio']+label::before{
content: '';
display: block;
border-radius: 50%;
box-sizing:border-box;
border: 1px solid #757676;
width: 16px;
height: 16px;
margin-right:3px;
background-color: #fff;
}
input[type='radio']:checked+label::before{
border: 4px solid #3057e8;
}



/* セレクト */
.selectbox {
position: relative;
}
.selectbox::before,
.selectbox::after {
position: absolute;
content: '';
pointer-events: none;
}
.selectbox::before {
right: 0;
display: inline-block;
box-sizing:border-box;
width: 2.3em;
height: 2.3em;
border-radius: 0 3px 3px 0;
border: 1px solid #e2e2e2;
background-color: #e9effc;
content: '';
}
.selectbox::after {
position: absolute;

/*
   top: 50%;
   right: 1.4em;
   transform: translate(50%, -50%) rotate(45deg);
   width: 6px;
   height: 6px;
 */

/*
   border-bottom: 3px solid #3057e8;
   border-right: 3px solid #3057e8;
 */

top: 37%;
right: 10px;

width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 8px solid #3057e8;

content: '';
}
.selectbox select {
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
min-width: 230px;
height: 2.3em;
padding: .4em 3.6em .4em .8em;
border: 1px solid #e2e2e2;
border-radius: 3px;
color: #333333;
font-size: 1em;
cursor: pointer;
}

.selectbox select:focus {
outline: 1px solid #2589d0;
}
.selectbox select:disabled {
cursor:default;
}
.selectbox:has(> select:disabled){
opacity:0.5;
}

/* セレクトここまで */




body > header{
overflow:hidden;
padding:25px;
}
header #common{
display:flex;
float:left;
overflow:hidden;
width:50%;
align-items: baseline;

}
header h1{
display:inline-block;
font-size:18px;
font-weight:500;
margin-right:30px;
}
header p{
display:inline-block;
color:#222222;
margin-bottom:0;
}


header #navi{
float:right;
overflow:hidden;
width:50%;
text-align:right;
}
header a:first-child{
font-size:14px;
text-decoration:underline;
}
header a.btn{
width:115px;
padding:10px 0;
margin-left:10px;
}
nav{
background-color:#f4f4f4;
padding:16px 45px;
font-size:15px;
color:#222222;
}
nav form{
display:flex;
}
nav form div{
display:flex;
align-items: center;
margin-right:32px;
}
main{
padding:25px 45px 100px;
}
footer{
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 40px;
background: #f4f4f4;
text-align:center;
line-height:30px;
}
footer small{
color:#8b8b8b;
}


/* login */
body#login{
background-color:#f4f4f4;
}
#login > div{
position:absolute;
top: calc(50% - 100px);
left: 50%;
transform: translateY(-50%) translateX(-50%);
width:450px;
background-color:#ffffff;
border-radius:10px;
box-shadow: 0 5px 10px 0 rgb(0 0 0 / 8%);
}
#login header{
font-size:18px;
font-weight:500;
padding:20px;
}
#login dl{
display:flex;
flex-wrap:wrap;
width:100%;
border-top:1px solid #dddddd;
border-bottom:1px solid #dddddd;
padding:40px 50px 20px;
}
#login dt{
display:flex;
width:30%;
padding-bottom:20px;
font-size:15px;
color:#222;
align-items: center;
}
#login dd{
display:flex;
width:70%;
padding-bottom:20px;
align-items: center;
}
#login input[type="text"],
#login input[type="password"]
{
width:220px;
}
#login input[type="checkbox"]{
margin-right:5px;
border:1px solid #;
}
#login label{
font-size:13px;
color:#222;
}



#login p{
margin:10px 0;
text-align:center;
color:#ff0000;
}
#login button{
display:block;
margin:20px auto;
width:115px;
padding:10px;
border:none;
border-radius:5px;
background-color:#3057e8;
text-align:center;
color:#ffffff;
font-size:13px;
}
/* list */
div.title{
display:flex;
align-items: center;
margin-bottom:35px;
}
div.title h2{
display:flex;
align-items:center;
font-size:17px;
font-weight:500;
background-color:#d2dffb;
padding:5px 10px;
}
div.title a {
display:flex;
justify-content: center;
width:90px;
padding:5px 0;
margin-left:10px;
}
div.title p.chui{
margin:0 0 0 20px;
font-size:13px;
color:#ce4949;
}
div.back{
margin-bottom:30px;
}
div.back a{
width:115px;
padding:10px 0;
}


#main_table{
overflow-x: scroll;
margin-bottom:80px;
}
.sub_table{
margin-bottom:80px;
}
table{
border-collapse: collapse;
width:100%;
margin-bottom:20px;
}
#main_table table:hover{
cursor:move;
}
table th,
table td{
padding:10px;
border-bottom:1px solid #c6c6c6;
border-right:1px solid #c6c6c6;
line-height:143%;
}
#main_table table th,
#main_table table td{
white-space:nowrap;
}
.sub_table table tr td:first-child{
white-space:nowrap;
}

table tr th:last-child,
table tr td:last-child{
border-right:none;
}
table tr.disable{
background-color:#dadada;
opacity:0.5;
}
table th{
color:#666666;
font-size:14px;
font-weight:normal;
}
table th span{
display:inline-block;
margin-left:10px;
font-size:11px;
}
table td{
font-size:15px;
}
td.tar{
text-align:right;
}
td.tac{
text-align:center;
}
td.w4{
width:4em;
}
td.w6{
width:6em;
}
table a.btn.white,
table a.btn.sky{
padding:5px 10px;
}
#user_table th,
#user_table td{
padding:15px 30px;
}
#user_table th{
width:260px;
text-align:left;
}
#user_table td a{
display:inline-block;
margin:0 10px;
font-size:13px;
}
#user_table td p{
margin:20px 0 0;
font-size:13px;
}
#user_table td strong{
display:inline-block;
margin-bottom:10px;
padding:5px;
background-color:#e8a530;
color:#ffffff;
font-weight:normal;
z-index:10;
}

#user_table form{
display:flex;
}
#user_table form label{
margin-right:20px;
}
#user_table form button{
padding:3px 10px;
border:1px solid #e2e2e2;
border-radius:5px;
background-color:#e9effc;
font-size:13px;
}


/* mikata */
.modal-content{
background: #fff;
text-align: left;
padding: 30px;
}
.modal-content h3{
font-size:18px;
font-weight:500;
padding:0 0 20px;
margin-bottom:20px;
border-bottom:1px solid #e2e2e2;
}
.modal-content p{
font-size:14px;
line-height:165%;
}
