@charset "utf-8";

/*================================================
 *  ボタン・共通設定
 ================================================*/
/*メインの機能ボタン*/
.btn {
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    padding: 4px 8px;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    color: #fff;
    font-weight:bold;
    background-clip: padding-box;
    border-radius: 3px;
    font-size: 12px;
    min-width: 80px;
}

.btn-cond {
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    padding: 2px 6px;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    color: #fff;
    font-weight:bold;
    background-clip: padding-box;
    border-radius: 3px;
    font-size: 12px;
}

.btn-primary {
    border: 1px solid #0F766E;
    background: #0F766E;
    visibility: visible;
    opacity: 1;
    transition: background .2s ease-out;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background: #CCFBF1;
    text-decoration: none;
    color: #0F766E;
}

/*メイン以外の機能ボタン - 青枠のみ - */
.btn-secondary {
    border: 1px solid #1F497D;
    background: #1F497D;
    color: #fff;
    visibility: visible;
    opacity: 1;
    transition: background-color .2s ease-out;
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
    background: #fff;
    text-decoration: none;
    color: #1F497D;
}

.btn-secondary-out {
    border: 1px solid rgba(0,0,55,0.4);
    background: #ccc;
    color: rgba(42,56,123,0.4);
    cursor: default;
}

.btn-danger {
    border: 1px solid #1f4e78;
    background: #1f4e78;
    visibility: visible;
    opacity: 1;
    transition: background-color .2s ease-out;
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active {
    background: #4890CF;
    border: 1px solid #4890CF;
    text-decoration: none;
    color: #fff;
}

.btn-primary-out {
    border: 1px solid rgba(0,0,55,0.4);
    background-color: rgba(0,0,55,0.4);
    cursor: default;
}

.btn-out {
    pointer-events: none;
}

.btn-blue {
    border: 1px solid #000080;
    background: #000080;
}

.btn-blue:hover,
.btn-blue:focus,
.btn-blue:active {
    background: #1f4e78;
    text-decoration: none;
    color: #fff;
}

.btn-red {
    border: 1px solid #bb2d36;
    background: #bb2d36;
    visibility: visible;
    opacity: 1;
    transition: background-color .2s ease-out;
}

.btn-red:hover,
.btn-red:focus,
.btn-red:active {
    border: 1px solid #eb888f;
    background: #eb888f;
    text-decoration: none;
    color: #fff;
}

.btn-red > .pile1 {
    position:absolute;
    line-height: inherit;
}
.btn-red > .pile2 {
    position:absolute;
    line-height: inherit;
    color:#bb2d36;
    z-index:10;
    margin-top:1px;
}
.btn-red:hover > .pile2{
    color:#eb888f;
}

.btn-green {
    border: 1px solid #54ac35;
    background: #54ac35;
}

.btn-green:hover,
.btn-green:focus,
.btn-green:active {
    background: #82c91e;
    text-decoration: none;
    color: #fff;
}

.btn-green-out{
    border: 1px solid #adb89d;
    background: #adb89d;
    cursor: default;
}

.btn-red-out{
    border: 1px solid #f09c9c;
    background: #f09c9c;
    cursor: default;
}

.btn-darkgreen {
    background: #0b621e;
    border: 1px solid #0b621e;
}

.btn-darkgreen:hover {
    background: #16a335;
    border: 1px solid #16a335;
}

.btn-darkgreen-out {
    background: #9ae9b4;
    border: 1px solid #9ae9b4;
    cursor: default;
}

.btn-deepgreen {
    background: #238e3a;
    border: 1px solid #238e3a;
}

.btn-deepgreen:hover {
    background: #45af5c;
    border: 1px solid #45af5c;
}

.btn-deepgreen-out {
    background: #67cf7e;
    border: 1px solid #67cf7e;
    cursor: default;
}

.btn-blue {
    background: #1f4e78;
    border: 1px solid #1f4e78;
}

.btn-blue:hover {
    background: #3aabd2;
    border: 1px solid #3aabd2;
}

.btn-blue-out {
    background: #7eeff6;
    border: 1px solid #7eeff6;
    cursor: default;
}

.btn-lightblue {
    background: #109DCD;
    border: 1px solid #109DCD;
}

.btn-lightblue:hover {
    background: #32bfef;
    border: 1px solid #32bfef;
}

.btn-lightblue-out {
    background: #54dfff;
    border: 1px solid #54dfff;
    cursor: default;
}

.btn-purple {
    border: 1px solid #49007f;
    background: #49007f;
    visibility: visible;
    opacity: 1;
    transition: background-color .2s ease-out;
}

.btn-purple:hover,
.btn-purple:active {
    border: 1px solid #b68cb5;
    background: #b68cb5;
    text-decoration: none;
    color: #fff;
}

.btn-orange {
    border: 1px solid #c65911;
    background: #c65911;
    visibility: visible;
    opacity: 1;
    transition: background-color .2s ease-out;
}

.btn-orange:hover,
.btn-orange:focus,
.btn-orange:active {
    border: 1px solid #EB701D;
    background: #EB701D;
    text-decoration: none;
    color: #fff;
}

.btn-gray {
    border: 1px solid #999;
    background: #ddd;
    color: #666;
}

.btn-gray:hover,
.btn-gray:focus,
.btn-gray:active {
    background: #999;
    text-decoration: none;
    color: #ddd;
}

.btn-gray-out{
    border: 1px solid #adb89d;
    background: #adb89d;
    cursor: default;
}

.btn-yellow {
    border: 1px solid #FFC000;
    background: #FFC000;
    color: #333;
}

.btn-yellow:hover,
.btn-yellow:focus,
.btn-yellow:active {
    background: #FFF333;
    text-decoration: none;
    color: #666;
}

.btn-white {
    border: 1px solid #0F766E;
    background: #ffffff;
    color: #0F766E;
}

.btn-white:hover,
.btn-white:focus,
.btn-white:active {
    background: #0F766E;
    text-decoration: none;
    color: #ffffff;
}