﻿/*alertとconfirm用*/

.noscroll {
    position:fixed;
    width:100%;
    overflow-y: scroll;
}

#alert_back {
    background: #000;
    z-index: 9101;
    width: 100%;
    height: 100%;
    position:fixed;
    top: 0;
    left: 0;
    opacity: 0.3;
}
#alert_box {
    z-index: 9102;
    position: fixed;
    top: 50%;
    left: 50%;
}
.alert_panel {
    background: #FFF; /*width: 100%;*/
    width: 420px;
    min-height: 70px;
    padding: 11px 15px 15px 15px;
    line-height: 20px;
    font-size: 16px;
}
.ok_bt, .con_ok_bt, .con_no_bt {
    display: inline-block;
    background: #8E8E8E;
    padding: 8px 10px !important;
    color: #FFF;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    width: 130px;
    line-height:20px;
    border:none;
}
.con_ok_bt, .con_no_bt {
    margin: 0 3px;
}
    .con_ok_bt:hover, .con_no_bt:hover {
        background: #E76464;
    }
    .ok_bt:hover {
        background: #4F6BDA;
    }
    
.alert_panel img {
    float: left;
    width: 65px;
}
.alert_text {
    width: 340px;
    float: right;
    padding-top: 6px;
}
.alert_btarea {
    text-align: center;
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid #ddd;
}
.alertclear:after {
    content: "";
    clear: both;
    height: 0;
    display: block;
    visibility: hidden;
}

div.alert_panel input[type="button"] {
    -webkit-appearance: none;
  }




@media screen and (max-width: 767px) {

    html {
        font-size: 14px;
    }

    .alert_panel {
        width: 350px;
        padding: 10px;
        line-height: 20px;
        font-size: 14px;
    }

    .alert_panel img {
         width: 40px;
    }

    .alert_text {
        width: 290px;
        padding-top: 6px;
    }
}
