@charset "UTF-8";
/* main.css
 * ver 1.0
 * -- Copyright By　IUHW MITA HOSPITAL Pulmonary Hypertension Center. --
 */
.dev_mode_info {
    position: absolute;
    z-index: 10000;
    padding: 10px;
    vertical-align: middle;
    background-color: rgba(255, 48, 48, 0.8);
    width: 100%;
}

.dev_mode_info.local_dev {
    background-color: rgba(0, 124, 212, 0.6);
    color: #ffffff;
}

.dev_mode_info label {
    color: #ffffff;
}

.dev_mode_info label.dev_title {
    display: inline-block;
    margin: 10px 20px 10px 40px;
}

.icn_blink_mark {
    position: absolute;
    padding: 0;
    top: 5px;
    left: 5px;
    width: 16px;
    height: 16px;
    border-radius: 8px;
    background-color: #ffeb00;
}

.blink {
    -webkit-animation:blink 0.5s 3 ease-in-out;
    -moz-animation:blink 0.5s 3 ease-in-out;
    animation:blink 0.5s 3 ease-in-out;
}
@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}

.dev_mode_info .bg-success {
    background-color: #28a745;
}

.dev_mode_info.header_info {
    display: inline-block;
    padding: 0;
    font-size: large;
    width: 190px;
}

.dev_mode_info.local_dev.header_info {
    width: 130px;
}

.back_url {
    padding-left: 15px;
    padding-right: 15px;
}

.content_back_url {
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 30px;
}

.back_url a, .content_back_url a {
    display: inline-block;
    margin: 0;
    padding: 0 0 0 10px;
    background-image: url(../assets/img/icn_back_url.png);
    background-repeat: no-repeat;
    background-position: left center;
    -moz-background-size:15px 15px;
    background-size:15px 15px;
    text-decoration: none;
}

/*----------- OverWride -----------*/
.radio label::before {
    top: -2px;
}
.radio label::after {
    top: -2px;
}

.main-panel > .content {
    padding-top: 20px;
}
.sidebar .sidebar-wrapper > .nav.nav-mobile-menu li.user_name a.user_name {
    white-space: unset;
}

.sidebar .sidebar-wrapper > .nav p, .off-canvas-sidebar .sidebar-wrapper > .nav p {
    font-size: 18px;
}

.sidebar .sidebar-wrapper > .nav [data-toggle="collapse"] ~ div > ul > li > a, .off-canvas-sidebar .sidebar-wrapper > .nav [data-toggle="collapse"] ~ div > ul > li > a {
    font-size: 14px;
}
.alert-danger {
    color: #ffffff;
}

.alert-success {
    background-color: #8ae2ba;
    color: #ffffff;
}

/* datePicker */
.ui-datepicker-close {
    display: none;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
    border: 1px solid #e8e6dc;
}
.date-input a.ui-state-default {
    border: 1px solid #e8e6dc;
}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
    color: #ffffff;
    background-color: #ec6c6b;
    border: 1px solid #ec6c6b;
    background-image: unset;
}

/*----------- login_form  -----------*/
#login_form .card .card-header {
    padding-top: 44px;
    padding-right: 30px;
    padding-left: 30px;
}
#login_form .card .card-content {
    padding-right: 30px;
    padding-left: 30px;
}
#login_form .card .card-footer {
    padding-bottom: 44px;
    padding-right: 15px;
    padding-left: 15px;
}

#login_form a.btn-disabled {
    outline: none;
    text-decoration: none;
    cursor: not-allowed;
    color: #bcbcbc;
    background-color: #dddddd;
    border-color:#bcbcbc;
}

#login_form a.btn-disabled.disabled:hover,
#login_form a.btn-disabled.disabled:focus {
    cursor: not-allowed;
    outline: none;
}


/*----------- btn_delete -------------------*/
.swal2-icon.swal2-warning {
    border-color: #ec6c6b;
    color: #ec6c6b;
}
.swal2-icon {
    position: relative;
    width: 4em;
    height: 4em;
}
.swal2-icon-text {
    position: absolute;
    top: -5px;
}
.swal2-popup {
    border-radius: 0.5em;
}
.swal2-popup .swal2-actions {
    margin: 1.25em auto;
}
.swal2-actions button.swal2-confirm.btn {
    margin-left: 10px;
    margin-right: 10px;
}

/*----------- btn_pass_visibled -------------------*/
button.btn_pass_visibled, button.btn_pass_visibled_n {
    position: absolute;
    bottom: 5px;
    right: 20px;
    border: 0;
    color: #aaaaaa;
    background-color: transparent;
    padding: 15px;
    background-image: url(../assets/img/icn_pass_visibled.png);
    background-repeat: no-repeat;
    background-position: center center;
    -moz-background-size:25px 25px;
    background-size:25px 25px;
}

#login_form button.btn_pass_visibled, #login_form button.btn_pass_visibled_n,
#remind_pass_set_form button.btn_pass_visibled, #remind_pass_set_form button.btn_pass_visibled_n,
#regist2_form button.btn_pass_visibled, #regist2_form button.btn_pass_visibled_n,
#regist3_form button.btn_pass_visibled, #regist3_form button.btn_pass_visibled_n
{
    right: 8px;
}

button.btn_pass_visibled_n {
    background-image: url(../assets/img/icn_pass_visibled_n.png);
    color: #666666;
}

button.btn_pass_visibled:hover {
    color: #999999;
}
button.btn_pass_visibled_n:hover {
    color: #999999;
}

button.btn_pass_visibled:focus {
    color: #aaaaaa;
}
button.btn_pass_visibled_n:focus {
    color: #666666;
}

#btn_login.disabled {
    outline: none;
    text-decoration: none;
    cursor: not-allowed;
    color: #bcbcbc;
    background-color: #dddddd;
    border-color:#bcbcbc;
}

#btn_login.disabled:hover,
#btn_login.disabled:focus {
    cursor: not-allowed;
    outline: none;
}

/*----------- area_symptom -------------------*/
.area_symptom .col-md-9 div.radio:first-child {
    border-top: 1px dotted #dddddd;
    margin-top: 5px;
    padding-top: 5px;
}

.area_symptom .col-md-9:first-child div.radio:first-child {
    border-top: 1px dotted transparent;
}

/*----------- p -------------------*/
p.contents_info {
    margin: 0;
}

/*----------- fontStyle -----------*/
.font_style-italic {
    font-style:italic;
}
.font_style-inherit {
    font-style:inherit;
}
.font_style-olique {
    font-style:oblique;
}
.font_weight-bold {
    font-weight: bold;
}

/*---------- under Line　----------*/
.text_underline
{
    text-decoration:underline;
}

/*---------- inline-block　--------*/
.inline-block {
    display: inline-block;
}

/*---------- absolute　--------*/
.absolute-right-20 {
    right: 20px;
}
.absolute-right-10 {
    right: 10px;
}
.absolute-top-30 {
    top: 30px;
}
.absolute-top-25 {
    top: 25px;
}
.absolute-top-20 {
    top: 20px;
}
.absolute-top-10 {
    top: 10px;
}
.absolute-top-5 {
    top: 5px;
}

/*---------- width ----------------*/
.width-44 {
    width: 44px;
}
.width-55 {
    width: 55px;
}
.width-70 {
    width: 70px;
}
.width-88 {
    width: 88px;
}
.width-100 {
    width: 100px;
}
.width-130 {
    width: 130px;
}
.width-200 {
    width: 200px;
}
.width-300 {
    width: 300px;
}
.width-400 {
    width: 400px;
}
.width-500 {
    width: 500px;
}
.width-100pct {
    width: 100%;
}
/*---------- height ----------------*/
.height-44 {
    height: 44px;
}
.height-55 {
    height: 55px;
}
.height-70 {
    height: 70px;
}
.height-88 {
    height: 88px;
}
.height-100 {
    height: 100px;
}
.height-200 {
    height: 200px;
}
.height-300 {
    height: 300px;
}
.height-400 {
    height: 400px;
}
.height-500 {
    height: 500px;
}
.height-100pct {
    width: 100%;
}

/*----------- padding -------------*/
.nopadding {
    padding: 0;
}

.padding_left-100 {
    padding-left: 100px;
}

.padding_left-50 {
    padding-left: 50px;
}

.padding_left-44 {
    padding-left: 44px;
}

.padding_left-30 {
    padding-left: 30px;
}

.padding_left-15 {
    padding-left: 15px;
}

.padding_left-10 {
    padding-left: 10px;
}

.padding_right-100 {
    padding-right: 100px;
}

.padding_right-50 {
    padding-right: 50px;
}

.padding_right-44 {
    padding-right: 44px;
}

.padding_right-30 {
    padding-right: 30px;
}

.padding_right-15 {
    padding-right: 15px;
}

.padding_right-10 {
    padding-right: 10px;
}

.padding_top-100 {
    padding-top: 100px;
}

.padding_top-50 {
    padding-top: 50px;
}

.padding_top-44 {
    padding-top: 44px;
}

.padding_top-30 {
    padding-top: 30px;
}

.padding_top-15 {
    padding-top: 15px;
}

.padding_top-10 {
    padding-top: 10px;
}

.padding_bottom-100 {
    padding-bottom: 100px;
}

.padding_bottom-50 {
    padding-bottom: 50px;
}

.padding_bottom-44 {
    padding-bottom: 44px;
}

.padding_bottom-30 {
    padding-bottom: 30px;
}

.padding_bottom-15 {
    padding-bottom: 15px;
}

.padding_bottom-10 {
    padding-bottom: 10px;
}

.padding_bottom-5 {
    padding-bottom: 5px;
}

/*----------- margin -----------*/
.margin_left-100 {
    margin-left: 100px;
}
.margin_left-50 {
    margin-left: 50px;
}
.margin_left-44 {
    margin-left: 44px;
}
.margin_left-30 {
    margin-left: 30px;
}
.margin_left-15 {
    margin-left: 15px;
}
.margin_left-10 {
    margin-left: 10px;
}

.margin_right-100 {
    margin-right: 100px;
}
.margin_right-50 {
    margin-right: 50px;
}
.margin_right-44 {
    margin-right: 44px;
}
.margin_right-30 {
    margin-right: 30px;
}
.margin_right-15 {
    margin-right: 15px;
}
.margin_right-10 {
    margin-right: 10px;
}
.margin_right-5 {
    margin-right: 5px;
}
.margin_top-100 {
    margin-top: 100px;
}
.margin_top-50 {
    margin-top: 50px;
}
.margin_top-44 {
    margin-top: 44px;
}
.margin_top-30 {
    margin-top: 30px;
}
.margin_top-20 {
    margin-top: 20px;
}
.margin_top-15 {
    margin-top: 15px;
}
.margin_top-10 {
    margin-top: 10px;
}

.margin_bottom-100 {
    margin-bottom: 100px;
}
.margin_bottom-50 {
    margin-bottom: 50px;
}
.margin_bottom-44 {
    margin-bottom: 44px;
}
.margin_bottom-30 {
    margin-bottom: 30px;
}
.margin_bottom-15 {
    margin-bottom: 15px;
}
.margin_bottom-10 {
    margin-bottom: 10px;
}
.margin_bottom-10 {
    margin-bottom: 10px;
}
.margin_bottom-5 {
    margin-bottom: 5px;
}

/*---------- Color　----------*/
/* background-color */
.bgcolor_list {
    background-color:#f6f6f6;
}
.bgcolor_attention {
    background-color:#ed797e;  /*#f15164*/
}
.bgcolor_key
{
    background-color:#42a4a8;
}
.bgcolor_gray {
    background-color:#aaaaaa;
}
.bgcolor_transparent {
    background-color: transparent;
}

/* color */
.color_key {
    color:#ec6c6b;
}
.color_base {
    color:#4e4948;
}
.color_black {
    color:#000000;
}
.color_white {
    color:#ffffff;
}
.color_gray {
    color:#aaaaaa;
}
.color_light_gray {
    color:#cccccc;
}
.color_footer-glay {
    color:#777777;
}
.color_attention {
    color:#f15164;
}
.color_contents_info_attention {
    color: #ff0400;
}

/* ------------------------------- */
.icn_announcement {
    padding: 22px 22px 22px 30px;
    background-image: url(../p_img/icn_announcement.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size:25px 25px;
}

.area_maintenance {
    margin:22px 0;
    border: 2px solid #ec6c6b;
    padding: 11px 22px;
}

.area_maintenance a {
    color: #ec6c6b;
    font-weight: bold;
    padding: 5px 22px 5px 40px;
}

.area_maintenance a:hover, .area_maintenance a:focus {
    text-decoration: underline;
}

.main-panel .navbar .navbar-header .navbar-brand a.title {
    padding-right: 6px;
}

/* ---------- @media ----------------------------------------------------------------------*/
@media only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min--moz-device-pixel-ratio: 2),
only screen and (-o-min-device-pixel-ratio: 2/1),
only screen and (min-device-pixel-ratio: 2),
only screen and (min-resolution: 192dpi),
only screen and (min-resolution: 2dppx) {
    .icn_announcement {
        background-image: url(../p_img/icn_announcement@2x.png);
    }
    .back_url a {
        background-image: url(../assets/img/icn_back_url@2x.png);
    }
}

@media screen and (max-width: 970px) {
    /*----------- login_form  -----------*/
    #login_form .card .card-header {
        padding-top: 20px;
        padding-right: 15px;
        padding-left: 15px;
    }
    #login_form .card .card-content {
        padding-right: 15px;
        padding-left: 15px;
    }
    #login_form .card .card-footer{
        padding-bottom: 20px;
        padding-right: 15px;
        padding-left: 15px;
    }
}

/* iPad */
@media screen and (max-width: 768px) and (orientation: portrait) {
    .lbl_copyright_jp {
        font-size: 14px;
    }
}

/* iPhone X */
@media screen and (max-width: 500px) and (orientation: portrait) {
    .main-panel .navbar .navbar-header .navbar-brand {
        font-size: 1.7rem;
    }
}

@media screen and (max-width: 812px) and (orientation: landscape) {
    .lbl_copyright_jp {
        font-size: 14px;
    }
}