@charset "utf-8";
/* ==========================================================================

theme.css
背景色やフォントなどの指定をするシート

========================================================================== */

body {
    background-color: #f9f4ea;
    font-family: sans-serif;
}

header {
    background-color: #ffffff;
}

footer{
    background-color: #F0ECE3;
}

p {
    font-size: 16px;
}

a {
    text-decoration: none;
    color: black;
}

.category__item {
    color: #49423a;
    border: #49423a 1px solid;
}

.sidebar_content {
    background-color: #fffcf7;
}

.pager a{
    color: #49423a;
}

/*カテゴリーのタグのカラー*/
.bgc01 {
    background-color: rgb(158 143 129 / 60%);
    z-index: 2;
}

/* アニメーション */
.category__item {
    transition: all .2s ease;
}

.category__item:hover {
    background-color: #49423a;
    color: white;
}

/* ==========================================================================
見出しのデザイン▼
========================================================================== */
h2,h3{
    font-family: 'Noto Serif JP', serif;
    color: #49423a;
    font-weight: 600;
}


/* 動画一覧の動画タイトル
---------------------------------------------*/
.article_contents .article_title{
    font-size: min(1.7vw,24px);

    @media screen and (max-width: 999px){
        font-size: 20px;
    }
}

/* カテゴリごとの動画一覧のタイトル
---------------------------------------------*/
.main_article .category_title{
    border-bottom: #49423a 1px solid;
    margin-bottom: 20px;
    font-size: 30px;
    @media screen and (max-width: 1240px){
        font-size: 24px;
    }
}

/* 動画詳細ページ・関連記事のタイトル
---------------------------------------------*/
.article_header .article_title,.related_contents .article_title{
    margin-block: 4px;
    line-height: 1.2;
}


/* サイドバーのタイトル
---------------------------------------------*/
.sidebar_content .sidebar_title{
    font-size: 20px;
    margin-bottom: 8px;

    @media screen and (max-width: 999px){
        text-align: center;
    }
}
/* ==========================================================================
見出しのデザイン▲
========================================================================== */