.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.logout > a:hover{
    color: #fff;
}

.message > a:hover{
    color: #333;
}


.waraukado-header {
    margin-top: 40px;
    text-align: center;
}

.waraukado-header ul li {
    display: inline;
    margin: 20px;

}

/*NAVIGATION-BAR*/

#mainnav-profile .list-divider,
#mainnav-menu > .list-divider{
    border-color: #fff;
    margin: 0 10px
}

#mainnav-menu > .item-top{
    padding: 20px 20px 10px;
}

#mainnav-menu > .item-middle{
    padding: 10px 20px;
}

#mainnav-menu > .item-bottom{
    margin: 0 10px;
    padding: 10px 10px 20px;
}

#mainnav-menu > .item-top-and-bottom{
    margin: 0 10px;
    padding: 20px 10px;
}

#mainnav-menu > .item-top > a,
#mainnav-menu > .item-middle > a,
#mainnav-menu > .item-bottom > a,
#mainnav-menu > .item-top-and-bottom > a {
    padding: 0;
}

#mainnav-menu > .item-top > ul > .item-top,
#mainnav-menu > .item-top-and-bottom > ul > .item-top,
#mainnav-menu > .item-bottom > ul > .item-top {
    padding: 20px 15px 10px;
}

#mainnav-menu > .item-top > ul > .item-middle,
#mainnav-menu > .item-top-and-bottom > ul > .item-middle,
#mainnav-menu > .item-bottom > ul > .item-middle{
    padding: 10px 15px;
}

#mainnav-menu > .item-top > ul > .item-bottom,
#mainnav-menu > .item-top-and-bottom > ul > .item-bottom,
#mainnav-menu > .item-bottom > ul > .item-bottom {
    padding: 10px 15px 0;
}

#mainnav-menu > .item-top > ul > li > a,
#mainnav-menu > .item-top-and-bottom > ul > li > a,
#mainnav-menu > .item-bottom > ul > li > a{
    padding: 0;
}

.navbar-top-links:first-child > li {
    border: none;
}

@media (max-width: 767px) {
    #mainnav-menu-wrap > .nano > .nano-content {
      margin-top: 120px;
  }

    .navbar-top-links .tgl-menu-btn {
        position: absolute;
        top: 0;
        left: 0;
    }

    .navbar-top-links .tgl-menu-btn > a, .navbar-top-links .tgl-menu-btn > a:hover, .navbar-top-links .tgl-menu-btn > a:focus {
        color: #758697;
    }

    .navbar-top-links .tgl-menu-btn .mainnav-toggle{
        /*border: 1px solid rgba(0, 0, 0, 0.05);*/
    }

}

@media (min-width: 768px) {

    #container.mainnav-sm #mainnav-container, #container.mainnav-sm #navbar .navbar-brand {
        left: -220px;
        width: 220px;
    }
    #container.mainnav-sm #content-container, #container.mainnav-sm #footer {
        padding-left: 0;
        left: 0;
    }

}

#mainnav-menu ul .active-link a, .menu-popover .sub-menu ul .active-link a {
    box-shadow: none;
}

/*.effect #navbar, .effect #content-container, .effect #mainnav-container, .effect #aside-container, .effect #footer, .effect .navbar-brand, .effect .navbar-content, .effect .navbar-header:before, .effect .page-fixedbar-container {*/
    /*transition-property: width, padding, left, right;*/
    /*transition-duration: .35s;*/
/*}*/










/*CAROUSEL-FOR-VIEW-MY-HOUSE_PHOTO-ALBUM*/
.carousel-control-next, .carousel-control-prev {
    width: 5%;
    background-color: #000;
}

h5.card-title{
    margin-bottom: 0;
}

/* CONTENTS-MESSAGE*/
.table-message-waraukado > thead > tr > th,
.table-message-waraukado > tbody > tr > th,
.table-message-waraukado > tfoot > tr > th,
.table-message-waraukado > thead > tr > td,
.table-message-waraukado > tbody > tr > td,
.table-message-waraukado > tfoot > tr > td {
    padding: 6px;
    line-height: 1.42857143;
}

.span-white-red{
    display: inline-block;
    height: 17px;
    padding:0 5px 0;
    font-size: 11px;
    background-color: red;
    border: solid;
    border-width: 1px;
    border-color: red;
    color: white;
}

.span-red-white{
    display: inline-block;
    height: 17px;
    padding:0 5px 0;
    font-size: 11px;
    background-color: white;
    border: solid;
    border-width: 1px;
    border-color: red;
    color: red
}

/* CONTENTS-MY_HORSE*/
.background-black{
    position: absolute;
    top: 5px;
    bottom: 5px;
    width: 5px;
    background: black;
}

.table-my_horse-waraukado{
    width: 100%;
    background-color: #555555;
    margin-left: 5px;
}

.table-message-waraukado > tbody > tr > th,
.table-message-waraukado > tbody > tr > td {
    padding-bottom: 0;
}

.horse_name{
    padding-top: 20px;
    padding-left: 20px;
    vertical-align: bottom;
    font-size: 22px;
}

.horse_detail{
    padding-left: 20px;
    vertical-align: middle;
    font-size: 16px;
    color: white;
}

/*CONTENTS-REPORT*/
.report img{
    width: 100%;
    max-height: 300px;
    object-fit: cover;
}

.report a{
    display: block;
    font-size: 16px;
    padding: 5px 0;
}

.report p {
    display: block;
    margin: 0;
    padding: 0 0 5px;
}

.span-white-gray{
    display: inline-block;
    height: 17px;
    padding:0 5px 0;
    font-size: 11px;
    background-color: #808080;
    border: solid;
    border-width: 1px;
    border-color: #808080;
    color: white;
}

/*CONTENT-PROFILE*/

.table-profile {
    width: 100%;
}

.table-profile > tbody > tr {
    border-top: dotted 2px #e9e9e9;
    border-bottom: dotted 2px #e9e9e9;
}



.table-profile > tbody > tr > th {
    width: 18%;
    background-color: #F5F5F5;
    padding: 5px 10px;
}


.table-profile > tbody > tr > td {
    width: 32%;
    padding: 5px 10px;
    text-align: left;

}

/*CONTENTS-RESULT*/

#container .table-result th{
    text-align: center;
    color: #758697;
    font-weight: bold;
    padding: 5px 10px;
}

.table-result{
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 5px;
}

.table-result > tbody > tr > td {
    padding: 5px 10px;
    text-align: center;
}

/* HEADER */
@media (max-width: 767px){
    #content-container{
        padding-top: 240px;
    }
    #content-container .register{
        margin-top: -240px;
    }
    .waraukado-header{
        padding-bottom: 16px;
    }
}

/* HEADER */
@media (min-width: 768px){
    #content-container .register{
        margin-top: -120px;
    }
}

/* NABBAR */
.banner{
    width: 100%;
    padding: 0 10px;
    padding-top: 10px;
}

/* FOOTER-FIXED */
#footer-fixed{
    border-top: 1px solid rgba(0, 0, 0, 0.07);
    background-color: #f3f5f9;
    color: #758697;
    margin-top: auto;
    left: 0;
    bottom: 0;
    z-index: 2;
}

@media (min-width: 1200px) {
    #container.boxed-layout #footer-fixed {
        max-width: 1128px;
    }
    #container.boxed-layout #footer-fixed {
        margin: 0 auto;
        bottom: 0;
    }
    #container.boxed-layout.mainnav-in:not(.slide) > #footer-fixed {
        left: 0 !important;
        padding-left: 220px;
    }
}

@media (min-width: 1900px) {
    #container.boxed-layout #footer-fixed {
        max-width: 1280px;
    }
}

@media (min-width: 992px) {
    #footer-fixed {
        padding-left: 220px;
    }
}
@media (min-width: 768px) and (max-width: 991px) {
    #footer-fixed {
        /*padding-left: 220px;*/
        left: 220px;
    }
}

@media (min-width: 768px) {
    #container.mainnav-sm #footer-fixed {
        padding-left: 0;
        left: 0;
    }

    #container.mainnav-out.reveal #footer-fixed,
    #container.mainnav-in.reveal #footer-fixed {
        z-index: 8;
    }
}

@media (min-width: 768px) {
    #container.mainnav-in.slide #footer-fixed {
        left: 220px;
    }
}

@media (max-width: 767px) {
    #container.mainnav-sm #footer-fixed {
        padding-left: 0;
        left: 0;
    }
}

@media (max-width: 767px) {
    #container.aside-left.mainnav-sm #footer-fixed {
        padding-left: 220px;
    }
}

@media (min-width: 768px) {
    #container.mainnav-sm.aside-left.aside-in #footer-fixed {
        padding-left: 220px;
    }

    div#container.mainnav-lg.aside-left.aside-in #footer-fixed {
        padding-left: 220px;
        text-align: left;
    }
}

#container #footer-fixed {
    padding-right: 0;
}
#container.mainnav-in:not(.slide) #footer-fixed {
    /*padding-left: 220px;*/
    position: relative;
    left: 220px;
}

@media (min-width: 1024px) {
    #container.aside-in.aside-left:not(.aside-float) #footer-fixed {
        padding-left: 255px;
        padding-right: 0;
    }

    #container.aside-in:not(.aside-float) #footer-fixed {
        padding-right: 255px;
    }

    #container.aside-in.aside-left.mainnav-lg:not(.aside-float) #footer-fixed {
        padding-left: 475px;
        padding-right: 0;
    }

    #container.aside-in.aside-left.mainnav-sm:not(.aside-float) #footer-fixed {
        padding-left: 305px;
        padding-right: 0;
    }
}
@media (max-width: 767px) {
    #container.aside-left.mainnav-sm:not(.aside-float) #footer-fixed {
        padding-left: 0;
    }
}

.col-xs-1-5, .col-sm-1-5, .col-md-1-5, .col-lg-1-5,
.col-xs-2-5, .col-sm-2-5, .col-md-2-5, .col-lg-2-5,
.col-xs-3-5, .col-sm-3-5, .col-md-3-5, .col-lg-3-5,
.col-xs-4-5, .col-sm-4-5, .col-md-4-5, .col-lg-4-5 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}
.col-xs-1-5 {
    width: 20%;
    float: left;
}
.col-xs-2-5 {
    width: 40%;
    float: left;
}

.col-xs-3-5 {
    width: 60%;
    float: left;
}

.col-xs-4-5 {
    width: 80%;
    float: left;
}
@media (min-width: 768px) {
    .col-sm-1-5 {
        width: 20%;
        float: left;
    }
    .col-sm-2-5 {
        width: 40%;
        float: left;
    }
    .col-sm-3-5 {
        width: 60%;
        float: left;
    }
    .col-sm-4-5 {
        width: 80%;
        float: left;
    }
}
@media (min-width: 992px) {
    .col-md-1-5 {
        width: 20%;
        float: left;
    }
    .col-md-2-5 {
        width: 40%;
        float: left;
    }
    .col-md-3-5 {
        width: 60%;
        float: left;
    }
    .col-md-4-5 {
        width: 80%;
        float: left;
    }
}
@media (min-width: 1200px) {
    .col-lg-1-5 {
        width: 20%;
        float: left;
    }
    .col-lg-2-5 {
        width: 40%;
        float: left;
    }
    .col-lg-3-5 {
        width: 60%;
        float: left;
    }
    .col-lg-4-5 {
        width: 80%;
        float: left;
    }
}

#jsnap {

    width:100%;
    display:flex;
    overflow-x:hidden;
}

#modoru{
    position: absolute;
    top: 50%;
    float:left;
}


#susumu{
    position: absolute;
    top: 50%;
    float:right;
}

#buttons {

  display:block;
  margin:0 auto;
  width:50%;
}

.nav-mypage-title {
    font-weight: bold;
    font-size: larger;
    color: #FFFFFF;
    text-align: center;
    margin: 0px;
    margin-bottom: 20px;
}

.waraukado-articles h6 {
    font-size: 16px;
}

.waraukado-articles table {
    border        : 1px solid #e1e1e1;
    max-width     : 100%;
    margin-bottom : 20px;
    width         : 100%;
}
.waraukado-articles table tr td{
    padding: 15px;
    vertical-align: top;
    border: 1px solid #e1e1e1
}
.waraukado-articles table tr th{
    padding: 15px;
    vertical-align: top;
    border: 1px solid #e1e1e1
}

.waraukado-articles img {
    max-width: 100%;
    height: auto;
}

.waraukado-articles br {
    height: 0px;
}



@media (min-width: 992px) {
    .horse-list-picture {
        margin-bottom: 20px;
        margin-top: -22px;
    }
}

.horse-list-picture {
    margin-bottom: 20px;
}

.content-image {
    width: 100%; object-fit: contain;"
}
@media (min-width: 992px) {
    .content-image {
        height: 500px;
    }
}

@media (min-width: 992px) {
    .waraukado-menu-icon {
        display: none;
    }
}