.sidr {
    display: block;
    position: fixed;
    top: 0;
    height: 100%;
    z-index: 999999;
    width: 300px;
    overflow-x: hidden;
    overflow-y: auto;
    background: #f8f8f8;
    color: #333;
    /*box-shadow: 0 0 5px 5px #ebebeb inset;*/
}
.sidr .sidr-inner {
    padding: 0 0 15px;
}
.sidr .sidr-inner > p {
    margin-left: 15px;
    margin-right: 15px;
}
.sidr.right {
    left: auto;
    right: -300px;
}
.sidr.left {
    left: -300px;
    right: auto;
}
/*------------*/
.sidr header .btn,
.sidr footer .btn {
    padding: 3px 5px 5px;
    font-size: 14px;
    line-height: 1.5;
    border-color: #CCC;
    color: #999;
}
.sidr header .btn:hover,
.sidr footer .btn:hover {
    color: #CCC;
}



/*------------*/
.sidr .list-group-item > a {
    display: block;
}
.sidr .list-group-item > a:active,
.sidr .list-group-item > a:hover,
.sidr .list-group-item > a:focus {
    text-decoration: none;
}
.sidr .list-group .fa {
    font-size: 1.2em;
    color: #666;
}
.sidr .list-group .fa-angle-right,
.sidr .list-group .fa-plus,
.sidr .list-group .fa-plus-square-o {
    float: right;
    color: #CCC;
    padding-top: 2px;
}
/*------------*/
#collapseMenu02 li {
    margin: 5px 0;
}
#collapseMenu02 li a {
    display: block;
}
#collapseMenu02 li a:active,
#collapseMenu02 li a:hover,
#collapseMenu02 li a:focus {
    text-decoration: none;
}

/*アイコンカラー*/
.sidr .list-group .fa-home { color: #f19ca7; }
.sidr .list-group .fa-paw { color: #b79172; }
.sidr .list-group .fa-flag { color: #9fc24d; }
.sidr .list-group .fa-truck { color: #8da0b6; }
.sidr .list-group .fa-gratipay { color: #ff8686; }
.sidr .list-group .fa-smile-o { color: #ee7800; }
.sidr .list-group .fa-camera-retro { color: #666666; }
.sidr .list-group .fa-question-circle { color: #67b5b7; }

/*--------------------*/
.drawr-btn {
    border-radius: 5px;
    border: 1px solid #DDD;
    margin: 10px;
    background-color: white;
    overflow: hidden;
}
.drawr-btn a:hover {
    text-decoration: none;
}
.drawr-btn ul {
    height: 43px;
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: center;
}
.drawr-btn li:first-child {
    width: 20%;
    float: left;
    height: 100%;
    line-height: 43px;
    border-right: 1px solid #DDD;
    background-color: #EEE;
}
.drawr-btn li:nth-child(2) {
    width: 80%;
    float: left;
    font-size: 16px;
}
.drawr-btn li:last-child {
    margin-left: 20%;
    width: 80%;
    font-size: 12px;
}

.drawr-btn .fa-phone { color: #8da0b6; }
.drawr-btn .fa-envelope { color: #d2b48c; }
.drawr-btn .fa-search { color: #67b5b7; }
.drawr-btn .fa-home { color: #f19ca7; }




/*オーバーラップ用-----*/
#dwrapper {
    display: block;
    position: fixed;
    left: 0; top: 0;
    z-index: 999997;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
}

/*開閉速度------------*/
.sidr .collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    -webkit-transition: height 0.15s ease;
    transition: height 0.15s ease;
}

.body-fixed {
    position: fixed;
    width: 100%;
    height: 100%;
    overflow: hidden;
}