/* <system section="theme" selected="6653586347151782122"> */
@import url("https://katooonline.com/css/hatena.css");
/* </system> */

#blog-title{
    display:none;
}
#blog-title-inner{
    display:none;
}

#top-editarea{
    width:100%;
    font-size:14px;
}
#main{
    padding:0 15px;
}
@media (min-width:768px) {
#main-inner{
	width: 720px
}
}

@media (min-width:992px) {
#main-inner{
	width: 940px
}
}

@media (min-width:1200px) {
#main-inner{
	width: 1024px
}
}
#main-inner{margin:0 auto;}

/* ナビゲーションバーのスタイル */
.navbar {
    background-color: rgba(255, 255, 255, 0.9) !important;
}

/* ナビゲーションリンクのスタイル */
.navbar-nav .nav-item .nav-link {
    font-family: 'Roboto', 'Noto Sans JP', sans-serif !important;
    font-weight: 400 !important;
    color: #333 !important;
}

/* アクティブなナビゲーションリンクのスタイル */
.navbar-nav .nav-item .nav-link.active {
    background-color: #e0e0e0 !important;
    color: #333 !important;
    border-radius: 5px !important;
    padding: 0.5rem 1rem !important;
}

/* ナビゲーションバートグルボタンのスタイル */
.navbar-toggler {
    border: none !important;
}

.navbar-toggler:focus {
    box-shadow: none !important;
}

/* レスポンシブデザインの調整 */
@media (max-width: 991.98px) {
    .navbar-nav {
        padding-top: 1rem !important;
    }
    
    .navbar-nav .nav-item {
        margin-bottom: 0.5rem !important;
    }
}

/* ナビゲーションバーのブランドリンクのスタイル */
.navbar-brand {
    color: #333 !important;
    font-weight: 700 !important;
}

/* ホバー時のスタイル */
.navbar-nav .nav-item .nav-link:hover {
    color: #007bff !important;
    background-color: rgba(0, 123, 255, 0.1) !important;
}

/* ナビゲーションバーのスタイル調整 */
.navbar-nav {
    align-items: center !important;
}

.navbar-nav .nav-item {
    display: flex !important;
    align-items: center !important;
}

.navbar-nav .nav-item .nav-link {
    padding: 0.5rem 1rem !important;
    margin: 0 0.25rem !important;
}

.navbar-nav .nav-item .nav-link.active {
    padding: 0.5rem 1rem !important;
    margin: 0 0.25rem !important;
    /* アクティブ状態の背景色と文字色 */
    background-color: #e0e0e0 !important;
    color: #333 !important;
}

/* ホバー時のスタイル */
.navbar-nav .nav-item .nav-link:hover {
    background-color: rgba(0, 0, 0, 0.05) !important;
    border-radius: 5px !important;
}

/* レスポンシブデザインの調整 */
@media (max-width: 991.98px) {
    .navbar-nav {
        align-items: flex-start !important;
    }
    
    .navbar-nav .nav-item {
        width: 100% !important;
    }
    
    .navbar-nav .nav-item .nav-link,
    .navbar-nav .nav-item .nav-link.active {
        margin: 0.25rem 0 !important;
    }
}