html,body{
    font-family: 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',Meiryo,メイリオ,sans-serif!important;
    font-size:15px;
}

/*
 * bootstrap custom
 */

h1{
    font-size:1.9rem;
    font-weight:bold;
}

h2{
    font-size:1.5rem;
    margin-bottom:12px;
}

h3{
    font-size:1.3rem;
}

.navbar{
    border-bottom:0px #c44 solid;
    background-color:#c00;
}

.navbar-brand{
    font-weight:bold;
    font-family: 'Kosugi Maru', sans-serif;
}
.navbar-light .navbar-brand{
    color:#555;
}


.navbar .login .navbar-nav .nav-link{
    color:#fff;
}
.navbar .login .navbar-nav .nav-link:hover{
    opacity:0.5;
}


.container{
    margin-top:20px;
    max-width:758px;
}

.breadcrumb{
    font-size:0.9rem;
    padding:0.4rem 0.8rem;
    /* background-color: #f8f9fa; */
    background-color: rgba(128,128,128,0.1);
}

.btn.btn-light{
    background-color: rgba(128,128,128,0.1);
    border-width:0px;
}
.btn.btn-light:hover{
    background-color: rgba(128,128,128,0.2);
}

/*
 * form
 */

label span{
    font-size:0.7em;
    color:#888;
}




/*
 * thema :white
 */

/*
 * thema :red
 */
html.red .navbar{
    border-bottom:1px #ae0000 solid;
    background-color:#c00;
}
html.red body{
    background-color:#ffeeee;
}

/*
 * thema :pink
 */
html.pink .navbar{
    border-bottom:1px #ff3485 solid;
    background-color:#ff5599;
}
html.pink body{
    background-color:#fff8f8;
}

/*
 * thema :sky
 */
html.sky .navbar{
    border-bottom:1px #2692b7 solid;
    background-color:#2ca8d2;
}
html.sky body{
    background-color:#f8f8ff;
}

/*
 * thema :black
 */
html.black .navbar{
    border-bottom:1px #000 solid;
    background-color:#222;
}
html.black body{
    background-color:#555;
    color:#fff;
}
html.black .nikki_page{
    box-shadow: 1px 2px 5px #333;
    background-color:#444;
}
html.black .breadcrumb-item.active{
    color:#aaa;
}
html.black .cale_td{
    background-color:#444;
}
html.black .today_td{
    background-color:#666 !important;
}

html.black .cale_td_sp{
    background-color:#444;
}


html.black .table-bordered td{
    border-color:#555;
}
html.black .table-bordered th{
    border-color:#555;
}


    /*
     * thema :yellow
     */
html.yellow .navbar{
    border-bottom:1px #de8500 solid;
    background-color:#ff9900;
}
html.yellow body{
    background-color:#fffff7;
}

/*
 * thema :gray
 */
html.gray .navbar{
    border-bottom:1px #666 solid;
    background-color:#777;
}
html.gray body{
    background-color:#f8f8f8;
}


/*
 * footer
 */
html {
    position: relative;
    min-height: 100%;
}
body {
    margin-bottom: 200px;
}
footer {
    text-align:center;
    color:#fff;
    background-color:#666;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 200px;
}
footer a{
    color:#fff;
    text-decoration: none;
}
footer a:hover{
    color:#ccc;
    text-decoration: none;
}

footer .link{
    margin-bottom:10px;
}
footer > div {
    font-weight:normal;
    font-size:0.8rem;
    width:100%;
    position:absolute;
    top:50%;
    left:50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit-transform: translateY(-50%) translateX(-50%);
}

/*
 * nikki
 */

.nikki .desc{
    line-height:160%;
}
.nikki .date{
    font-size:20px;
    font-weight:bold;
    display:inline-block;
    vertical-align: middle;
    margin:0px;
}

.nikki_page{
    box-shadow: 1px 2px 5px #ccc;
    padding:35px;
    background-color:#fff;
}

.nikki_page .body{
    padding:15px 0px 0px 0px;
    border:0px #ccc solid;
    line-height:170%;
    min-height: 200px;
    word-wrap: break-word;
}
.nikki_page .title{
    padding:5px 0px 5px 0px;
    font-size:1.7rem;
    font-weight:bold;
    margin-bottom:15px;
}

.nikki_page .img{
    text-align:center;
}
.nikki_page .img.frame{
    background-color:#fff;
    padding:20px;
    border:1px #eee solid;
}


.nikki_page .img img{
    max-width:100%;
}


/*
 * calender
 */

.today_td{
    background-color:#ffc !important;
}

.cale_td{
    padding:3px !important;
    width:104px !important;
    height:90px;
    word-break: break-all;
    background-color:#fff;
}
.cale_td .value{
    font-size:0.76rem;
}
.cale_td .value .icon{
    font-size:1.2rem;
}
.cale_td .day{
    font-weight:bold;
}

.cale_th{
    word-break: break-all;
    width:104px !important;
    text-align:center !important;
    background-color:#444;
    padding:1px !important;
    height:5px;
    color:#fff;
}


.cale_sun{
    background-color:#f77 !important;
}

.cale_sat{
    background-color:#77f !important;
}


.cale_th_sp{
    text-align:right;
    font-weight:normal;
    background-color:#444;
    color:#fff;
}

.cale_td_sp{
    background-color:#fff;
}

.cale_td_sp .value{
}


/*
 * sidemenu
 */

.sidemenu .title{
    font-size:0.9rem;
    color:#777;
    margin-left:5px;
}

/*
 * home
 */

.top{
    /*
    margin-top:40px;
    margin-bottom:30px;
     */
}
.top h1{
    font-size:3.2rem;
    font-weight:bold;
    font-family: 'Kosugi Maru', sans-serif;
}

@media screen and (max-width: 720px) {
    .top{
        /*
        margin-top:30px;
        margin-bottom:30px;
         */
    }
}

@media screen and (max-width: 576px) {
    .top h1{
        font-size:2.5rem;
    }
}


.top .lead{
    line-height:160%;
}
.top .lead b{
    font-weight:bold;
}
.top .action{
}

/*
 * home latest
 */
.latest h2{
    font-weight:normal;
    font-size:2rem;
    padding-bottom:10px;
    border-bottom:0px #eee dashed;
}
.latest a{
    color:#444;
}
.latest a:hover{
    text-decoration: none;
}
.latest .item{
    margin-bottom:0px;
    padding:20px 0px;
    border-top:0px #999 solid;
}
.latest .item:hover{
    /*background-color:#eee;*/
    color:#999;
}
.latest .item .title{
    font-size:1.5rem;
    font-weight:normal;
}
.latest .item .comment{
}
.latest .item .attr{
    font-size:0.9rem;
}
.latest .item .attr span{
    font-size:0.9rem;
    vertical-align: -2px;
}


/*
 * common
 */

.under {
    background: linear-gradient(transparent 40%, #fdd 0%);
    line-height: 1em;
}


/*
 * responsive
 */

@media screen and (max-width: 720px) {
    html, body{
        font-size:14px;
    }

    .nikki_page{
        padding:25px;
    }

}
@media screen and (max-width: 576px) {
    html, body{
        font-size:13px;
    }

    .nikki_page{
        padding:15px;
    }
    .nikki_page .title{
        margin-bottom:4px;
    }
}

/*
 * materical .icon
 */
.material-symbols-outlined.icon{
    font-size:1.3em;
    vertical-align: -19%;
    margin-right:5px;
}
.material-symbols-outlined.icon.img{
    font-size:1.3em;
    vertical-align: -19%;
    margin-right:0px;
}

/*
 * navi-month
 */
.navi-month .btn-arrow.left .icon{
    margin-right:-5px;
    margin-left:4px;
}
.navi-month .btn-arrow .icon{
    font-size:20px;
    margin-right:0px;
}

/*
 * navi-next
 */
.navi-next .btn-arrow .icon{
    font-size:16px;
    margin-right:0px;
}


/*
 * spin
 */
@keyframes spin {
    from {
        transform:rotate(360deg);
    }
    to {
        transform:rotate(0deg);
    }
}

.spin {
    animation-name: spin;
    animation-duration: 1500ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}