@charset "utf-8";

#querytable{
box-sizing:border-box;
font:16px/20px sans-serif;
/* font-family:lr oSVbN, qMmpS Pro W3, Hiragino Kaku Gothic Pro, Osaka, "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック"; */
font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
margin:0 auto;
padding:0 8px;
max-width:736px;
}
#querytable table{
box-sizing:border-box;
width:100%;
max-width:720px;
border:1px solid #cbcbcb;
margin-left:auto;
margin-right:auto;
margin-top:8px;
margin-bottom:16px;
border-collapse:separate;
border-spacing:1px;
empty-cells:show;
}
#querytable th{
background-color:#eff7ff;
border-right:1px solid #cbcbcb;
border-bottom:1px solid #cbcbcb;
text-align:center;
white-space:nowrap;
padding:4px;
}
#querytable th.w110{width:110px;white-space:nowrap;}
#querytable th.lgn{background-color:#ebf7ee;}
#querytable th div{display:block;}
#querytable td{
border-bottom:1px solid #cbcbcb;
background-color:#ffffff;
text-align:left;
padding:12px;
}
#querytable td.lh16{line-height:1.6;}
#querytable th.r{border-right:none;}
#querytable th.b, #querytable td.b{border-bottom:none;}
#querytable th.cp, #querytable td.cp{text-align:left;padding:12px 12px 12px 24px;position:relative;}
#querytable th.cp::before, #querytable td.cp::before{display:block;position:absolute;top:0;left:0;content:'';box-sizing:border-box;border:7px solid #0077cc;height:100%;}

#querytable th div.accordion-icon{display:block;position:absolute;top:0;right:8px;width:32px;height:100%;cursor:pointer;background:url(../img/accordion_icon_show.png) no-repeat center center; background-size:24px 24px;}

#querytable th div#show_your_info{display:block;position:absolute;top:0;right:40px;width:120px;height:45px;background:url(../img/show_your_info.png) no-repeat center center; background-size:120px 45px;}

#querytable table tr td.dtl_btm{
border-bottom:1px dotted #cbcbcb;
}
#querytable table tr:last-child td.dtl_btm{border-bottom:none;}
ul.available_times{
list-style-type:none;
margin:0px;
padding:0px;
}
ul.available_times li{
position:relative;
font-size:18px;
margin:0px;
padding:0 0 20px 0;
line-height:1.3;
height:1.3rem;
}

/* login layer */
#login-layer{
display:none;
position:fixed;
width:98%;
max-width:520px;
box-sizing:border-box;
top:50%;
left:50%;
transform:translate(-50%, -50%);
border:1px solid #ccc;
padding:10px;
background-color:white;
box-shadow:0 0 10px rgba(0,0,0,0.5);
border-radius:8px;
z-index:1000;
}
button.btn_s, form#login input[type="submit"], form#reset input[type="submit"], form#verify input[type="submit"]{
display:inline-block;
border-radius:6px;
font-size:15px;
text-align:center;
cursor:pointer;
padding:10px;
background:#0077cc;
color :#ffffff;
line-height:1em;
transition:.3s;
border:2px solid #0077cc;
margin:8px;
min-width:128px;
}
form#login input[type=text],form#reset input[type=text],form#verify input[type=text],form#login input[type=email],form#verify input[type=email],form#login input[type=password],form#reset input[type=password]{
font:16px/20px sans-serif;
box-sizing:border-box;
margin:8px 0 8px;
padding:0.6em;
transition:0.3s;
border:2px solid #1b2538;
border-radius:4px;
width:100%;
}
form#login #email_wrapper, form#verify #email_wrapper, form#login #password_wrapper, form#reset #password_wrapper{
position:relative;
margin:0 auto;
width:80%;
max-width:480px;
}
form#login #password_wrapper img.eye-slash-regular, form#login #password_wrapper img.eye-regular, form#reset #password_wrapper img.eye-slash-regular, form#reset #password_wrapper img.eye-regular{
position:absolute;
top:30px;
right:10px;
transform:translateY(-50%);
width:15px;
cursor:pointer;
}

form#fillIn input[class="seltm_radio"]{
position:relative;
width:24px;
height:24px;
border:2px solid #000;
border-radius:50%;
vertical-align:-2px;
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
cursor:pointer;
}
form#fillIn input[class="seltm_radio"]:checked:before{
position:absolute;
top:10px;
left:10px;
transform:translate(-50%, -50%);
width:12px;
height:12px;
border-radius:50%;
background:#0077cc;
content:'';
}
form#fillIn input[class="seltm_radio"]:checked+label .time{
background-color:#C8E6C9;
}
form#fillIn input[class="seltm_radio"]+label{
cursor:pointer;
}
form#fillIn input[class="seltm_radio"]:disabled{
border:2px solid #777;
background:#ddd;
}
form#fillIn input[class="seltm_radio"]:disabled,form#fillIn input[class="seltm_radio"]:disabled+label{
cursor:default;
}
ul.available_times li .time{
position:absolute;
top:2px;
left:35px;
padding:4px;
display:flex;
align-items:center;
line-height:1.3;
height:1.3rem;
}
div.maru2{
display:inline-block;
width:16px;
height:16px;
margin:0 0 0 2px;
border-radius:50%;
border:2px solid #009A57;
}
.batsu2{
display:inline-block;
width:16px;
height:16px;
margin:0 0 0 4px;
}
.batsu2::before,.batsu2::after{
content:"";
position:absolute;
top:50%;
left:50%;
width:2px;
height:16px;
background:#c90926;
}
.batsu2::before{
transform:translate(-50%,-50%)rotate(45deg);
}
.batsu2::after{
transform:translate(-50%,-50%)rotate(-45deg);
}

form#fillIn input[class="bb_radio"]+label{
padding:0 0 0 22px;
margin:0 0 8px;
font:15px/20px sans-serif;
line-height:20px;
display:inline-block;
cursor:pointer;
position:relative;
}
form#fillIn input[class="bb_radio"]+label::before{
content:'';
width:20px;
height:20px;
position:absolute;
left:-1px;
top:9px;
margin-top:-10px;
border:2px solid #1b2538;
border-radius:50%;
}
form#fillIn input[class="bb_radio"]{
display:none;
}
form#fillIn input[class="bb_radio"]:checked + label:after{
content:'';
width:12px;
height:12px;
position:absolute;
top:5px;
left:5px;
background-color:#0077cc;
border-radius:50%;
}

form#fillIn input[type=text],form#fillIn input[type=number],form#fillIn input[type=tel],form#fillIn input[type=email]{
font:16px/20px sans-serif;
box-sizing:border-box;
margin:2px 0 8px;
padding:0.4em;
transition:0.3s;
border:2px solid #1b2538;
border-radius:4px;

}
form#fillIn input[type=text]:focus,form#fillIn input[type=number]:focus,form#fillIn input[type=tel]:focus,form#fillIn input[type=email]:focus{
border:2px solid #0077cc;
outline:0;
}

form#fillIn input[type=checkbox]{
display:none;
}
form#fillIn input[type="checkbox"]+label{
display:none;
cursor:pointer;
display:inline-block;
position:relative;
padding-left:25px;
padding-right:10px;
margin:5px 0 5px;
}
form#fillIn input[type="checkbox"]+label::before{
content:"";
position:absolute;
display:block;
box-sizing:border-box;
width:20px;
height:20px;
margin-top:-10px;
left:0;
top:50%;
border:2px solid;
border-color:#1b2538;
background-color:#fff;
border-radius:4px;
}
form#fillIn input[type="checkbox"]:checked+label::after{
content:"";
position:absolute;
display:block;
box-sizing:border-box;
width:18px;
height:9px;
margin-top:-9px;
top:50%;
left:3px;
transform:rotate(-45deg);
border-bottom:3px solid;
border-left:3px solid;
border-color:#0077cc;
}

form#fillIn .select{
font:16px/20px sans-serif;
text-indent:4px;
width:84px;
height:32px;
border:2px solid #1b2538;
border-radius:4px;
margin:12px 0;
background:#fff;
appearance: none; /* ブラウザのデフォルトスタイルを無効化 */
-webkit-appearance: none; /* Safari用 */
-moz-appearance: none; /* Firefox用 */
cursor: pointer;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23000"><path d="M7 10l5 5 5-5z"/></svg>');
background-repeat: no-repeat;
background-position: right 3px center; /* 右端に配置 */
background-size:20px; /* 矢印サイズ */
}
form#fillIn .select2{
font:16px/20px sans-serif;
text-indent:4px;
width:60px;
height:32px;
border:2px solid #1b2538;
border-radius:4px;
margin:12px 0;
background:#fff;
appearance: none; /* ブラウザのデフォルトスタイルを無効化 */
-webkit-appearance: none; /* Safari用 */
-moz-appearance: none; /* Firefox用 */
cursor: pointer;
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23000"><path d="M7 10l5 5 5-5z"/></svg>');
background-repeat: no-repeat;
background-position: right 3px center; /* 右端に配置 */
background-size:20px; /* 矢印サイズ */
}

form#fillIn textarea{
box-sizing:border-box;
border:2px solid #1b2538;
border-radius:4px;
font:16px/20px sans-serif;
}
form#fillIn  textarea:focus{
/* border-color:#0077cc; */
border:2px solid #0077cc;
outline:0;
}

form#fillIn input[type=submit]{
display:inline-block;
border-radius:5%;
font-size:16px;
text-align:center;
cursor:pointer;
padding:12px 12px;
background:#0077cc;
color :#ffffff;
line-height:1em;
transition:.3s;
border:2px solid #0077cc;
margin:16px;
}
/* 以下コメントアウト：モバイルページ戻りでhover状態が保持されていてわかりにくくなる */
/*
form#fillIn input[type=submit]:hover{
color:#0077cc;
background:#ffffff;
}
*/
form#fillIn input[type=button]{
display:inline-block;
border-radius:5%;
font-size:16px;
text-align:center;
cursor:pointer;
padding:12px 12px;
background:#dedede;
color:#0077cc;
line-height:1em;
transition:.3s;
border:2px solid #0077cc;
margin:16px;
}
form#fillIn input[type=button]:hover{
color:#0077cc;
background:#ffffff;
}
.warnings{
display:none;
margin-bottom:0;
padding:5px 10px;
color:#e74340;
background-color:#fde9e8;
border-color:#fcdcda;
border:1px solid #fbeed5;
border-radius:4px;
}

div.spbr{display:inline-block;width:8px;}
div.msg_prohibit, div.msg_prohibit2{display:none;color:#cc0000;}

/* applicant & outpatient
--------------------------------------------------------- */
.hidden{display:none;}
.button{display:inline-block; margin:6px 2px;padding:8px 16px; cursor:pointer; border:1px solid #ccc; border-radius:4px; }
.button.selected{border:2px solid red;}

/* userDashboard
--------------------------------------------------------- */
.action-container{
float:right;
text-align:right;
min-height:30px;
}
.action-container::after{
content:"";
display:table;
clear:both;
}
.action-container form{
margin:0;
padding:0;
display:inline;
}
button.cancel_btn {
background:linear-gradient(to bottom,#ffffff,#e7a69f);
border:2px solid #e74c3c;
text-align:center;
font-weight:bold;
color:#121212;
width:auto;
min-width:auto;
margin:0;
padding:6px;
}
button.void_btn {
background:#efefef;
border:2px solid #dedede;
text-align:center;
font-weight:bold;
color:#cdcdcd;
width:auto;
min-width:auto;
margin:0;
padding:6px;
cursor: not-allowed;
}
button.cancel_btn div, button.void_btn div{display:inline;}

span.requisite{
background-color: #d9534f;
display: inline-block;
width: auto;
margin: 0 4px 2px;
padding: .2em;
font-size: 13px;
font-weight: 700;
line-height: 1;
color: #fff;
text-align: center;
white-space: nowrap;
vertical-align: baseline;
border-radius: .25em;
}


/* Responsive max-width:480px
--------------------------------------------------------- */
@media screen and (max-width:480px){

#querytable{
font:15px/20px sans-serif;
/* font-family:lr oSVbN, qMmpS Pro W3, Hiragino Kaku Gothic Pro, Osaka, "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック"; */
font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
padding:0;
}
#querytable table{
width:100%;
margin-left:0;
margin-right:0;
border:none;
}
#querytable th{
box-sizing:border-box;
background-color:#eff7ff;
border-top:1px solid #c3d9ff;
border-right:none;
border-bottom:none;
width:100%;
text-align:left;
white-space:normal;
margin:0;
padding:10px;
font-size:15px;
font-weight:bold;
display:block;
}
#querytable th.w110{width:auto;}
#querytable th div{display:inline-block;}
#querytable td{
box-sizing:border-box;
border-bottom:none;
background-color:#ffffff;
width:100%;
text-align:left;
margin:0 auto;
padding:12px;
font-size:16px;
display:block;
overflow:hidden;
}
#querytable th.b, #querytable td.b{
border-bottom:none;
}
#querytable table tr td.dtl_btm{
border-bottom:1px dotted #cbcbcb;
}
#querytable table tr:last-child td.dtl_btm{border-bottom:1px dotted #cbcbcb;}

button.btn_s, form#login input[type="submit"], form#reset input[type="submit"], form#verify input[type="submit"]{
display:block;
box-sizing:border-box;
width:94%;
padding:10px;
margin:8px auto 12px;
}
/* userDashboard
--------------------------------------------------------- */
.action-container{
/* float:none; */
text-align:center;
/* margin-top:12px; */
}
button.cancel_btn, button.void_btn{width:auto}
button.cancel_btn div, button.void_btn div{ display:block;}

div.spbr{display:block;width:0;}

}