/**
 * base.css
 */
main {
    padding-top: 0;
    margin-top: 110px;
}
.top-page main {
    margin-top: 0;
}
@media screen and (max-width: 767px) {
    main {
        margin-top: 0;
    }
}

.text-bold { font-weight: bold; }
.box-bg-beige { margin-top: 40px; padding: 16px 20px; background-color: #f3f3f3; }
.box-bg-beige p{ margin: 0.15em 0; }
.box-bg-beige ul.list > li{ margin-top: 0.15em; margin-bottom: 0.15em; }
@media screen and (max-width: 840px) { .box-bg-beige p{ margin: 0.35em 0; }
  .box-bg-beige ul.list > li{ margin-top: 0.35em; margin-bottom: 0.35em; } }
  
/**
 * appli.css
 */
/*
.apply-form-link a { margin-top: 20px; }
.apply-form-link a:first-child { margin-top: 0; }
*/

.box-alert { border: 2px solid #ff8178; margin-top: 20px; padding: 16px 20px; background-color: #ffe1e0;
}
.box-alert p{ margin: 0.15em 0; }
.box-alert ul.list > li{ margin-top: 0.15em; margin-bottom: 0.15em; }
@media screen and (max-width: 840px) { .box-alert { margin-top: 16px; padding: 16px; }
  .box-alert p{ margin: 0.35em 0; }
  .box-alert ul.list > li{ margin-top: 0.35em; margin-bottom: 0.35em; } }


/**
 * mypage.css
 */

/* グラフの凡例の色変更 */
.mypage-usage-chart .chartAverage li.sample {
    border-color: #ffb611;
}

#pmIndicatorWp { max-width: 450px; position: relative; margin-top: 5px; background: #ffffff; }

#pmIndicator { width: 100%; height: 26px; line-height: 26px; position: relative; border: 1px solid #dbdbdb; padding: 0 5px; text-align: center; font-size: 12px; z-index: 1; margin: 0; }

#pmIndicatorProgress { width: 100%; position: absolute; top: 1px; left: 1px; }

#pmIndicatorProgress .progress-bar { height: 24px; }

/* -------------------------------
    alert
------------------------------- */
.alertBox {
    width: auto;
    text-align: center;
    margin-bottom: 60px;
    line-height: 2.2;
}

.alert01 {
    color: #ff1111;
    font-weight: bold;
    font-size: 1.0rem;
}

.cardTr.has-error .block {
    position: relative;
    padding-top: 1.5em;
}

.cardTr.has-error .alert01 {
    position: absolute;
    top: 0;
    left: 0;
}


/* -------------------------------
   pagination
------------------------------- */
.pagination ul {
    display: block;
}

.pagination li {
    float: left;
    width: 39px;
    height: 34px;
    margin: 0px 2px;
    font-size: 18px;
    line-height: 34px;
    text-align: center;
}

.pagination li.active {
    color: #FFFFFF;
    box-shadow: inset 0px 0px 0px 1px #10abd0;
    background-color: #10abd0;
}

.pagination li a, .pagination li span {
    display: block;
    width: 100%;
    height: 100%;
    box-shadow: inset 0px 0px 0px 1px #10abd0;
}

.pagination li a {
    color: #10abd0;
}