/* common ---------------------------------------------*/

.pc_news_only { display: block; }
.sp_news_only { display: none; }

/* pc head ---------------------------------------------*/

#news .under_title {
    background-image: url(images/news/bg_head_news.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    height: 230px;
    text-align: center;
}

#news .under_title h2,
#news .under_title p {
    font-family: 'Zen Maru Gothic', sans-serif;
    font-size: 24px;
    font-weight: 500;
    color: #fff;
    padding-top: 140px;
    text-shadow: 0 0 10px rgba(0, 0, 0, .5);
}

/* pc post ---------------------------------------------*/

#news_detail .under_wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 60px auto 0;
}

#news_detail img:not(.external) {
    border-radius: 5px;
}

#news_detail .post .top_img {
    margin-bottom: 30px;
}

#news_detail .post .top_img img {
    width: 100%;
    display: block;
}

#news_detail .post {
    width: 70%;
}

#news_detail .post > .title {
    padding-bottom: 40px;
    border-bottom: 1px solid #8AD1D9;
}

#news_detail .post .title .info {
    margin-top: 40px;
    display: flex;
}

#news_detail .post .title .info .category {
    font-size: 14px;
    width: 90px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    color: #fff;
    border-radius: 15px;
}

#news_detail .post .title .info .event { background-color: #FF6565; }
#news_detail .post .title .info .work { background-color: #6C9BE6; }
#news_detail .post .title .info .raising { background-color: #EDA7B5; }
#news_detail .post .title .info .education { background-color: #D99DE5; }
#news_detail .post .title .info .house { background-color: #EFBE70; }
#news_detail .post .title .info .life { background-color: #7DD1AA; }

#news_detail .post .title .info .date {
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
    margin-left: 25px;
}

#news_detail .post .title h1,
#news_detail .post .title h2 {
    font-size: 24px;
    margin-top: 25px;
}

#news_detail .post_body {
    margin-top: 40px;
}

/* 参考サイトに合わせたシンプルな見出しスタイル */
#news_detail .post_body h2 {
    font-size: 18px;
    font-weight: 500;
    margin-top: 40px;
    margin-bottom: 30px;
}

/* h3以下は参考サイト未定義のため、テイストを合わせつつデフォルトサイトを参考に定義 */
#news_detail .post_body h3 {
    font-size: 16px;
    font-weight: 500;
    margin-top: 30px;
    margin-bottom: 20px;
    padding-left: 10px;
    border-left: 3px solid #8AD1D9;
}

#news_detail .post_body h4 {
    font-size: 15px;
    font-weight: 500;
    margin-top: 20px;
    margin-bottom: 15px;
}

#news_detail .post_body h5,
#news_detail .post_body h6 {
    font-size: 14px;
    font-weight: 500;
    margin-top: 16px;
    margin-bottom: 10px;
}

#news_detail .post_body p {
    font-size: 14px;
    line-height: 1.8;
    margin-bottom: 30px;
}

#news_detail .post_body blockquote {
    margin: 0 0 30px;
    padding: 14px 20px;
    background-color: #f5f5f5;
    border-left: 3px solid #ccc;
    font-size: 14px;
    line-height: 1.8;
}

#news_detail .post_body dl {
    margin-bottom: 30px;
}

#news_detail .post_body dt {
    font-size: 14px;
    font-weight: 500;
    padding: 6px 10px;
    background-color: #f5f5f5;
    margin-bottom: 4px;
    margin-top: 10px;
}

#news_detail .post_body dd {
    font-size: 14px;
    line-height: 1.8;
    padding: 4px 10px 4px 1em;
    margin-bottom: 4px;
}

#news_detail .post_body table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 30px;
    font-size: 14px;
}

#news_detail .post_body caption {
    caption-side: top;
    margin-bottom: 6px;
    font-weight: bold;
    font-size: 14px;
    text-align: left;
}

#news_detail .post_body table th {
    background-color: #f5f5f5;
    border: 1px solid #ddd;
    padding: 10px 12px;
    font-weight: 500;
    text-align: left;
    line-height: 1.8;
}

#news_detail .post_body table td {
    border: 1px solid #ddd;
    padding: 10px 12px;
    line-height: 1.8;
}

#news_detail .post_body a {
    color: #008DD7;
    transition: all .3s;
}

#news_detail .post_body a:hover { opacity: .7; }

#news_detail .post_body .photos figure {
    max-width: 100% !important;
    width: auto !important;
}

#news_detail .post_body img:not(.external) {
    max-width: 100%;
    height: auto;
    margin-bottom: 30px;
}

#news_detail .post_body img.external {
    width: 12px;
    height: 11px;
    margin-bottom: 0;
    border-radius: 0;
    vertical-align: middle;
}
#news_detail .post_body .txtPart ul {
    padding-left: 1.5em;
    list-style: disc;
    margin-bottom: 30px;
}
#news_detail .post_body .txtPart ul li {
    list-style: disc;
}

#news_detail .post_body li.pdf,
#news_detail .post_body li.gif,
#news_detail .post_body li.jpg,
#news_detail .post_body li.png,
#news_detail .post_body li.xls,
#news_detail .post_body li.doc,
#news_detail .post_body li.ppt,
#news_detail .post_body li.mp3,
#news_detail .post_body li.csv,
#news_detail .post_body li.zip,
#news_detail .post_body li.jtd,
#news_detail .post_body li.rtf,
#news_detail .post_body li.txt,
#news_detail .post_body li.xml,
#news_detail .post_body li.wmv,
#news_detail .post_body li.rdf,
#news_detail .post_body li.com {
    padding-left: 22px;
    background-repeat: no-repeat;
    background-position: 0 center;
}
#news_detail .post_body li.pdf { background-image: url(../images/icon/pdf.gif); }
#news_detail .post_body li.gif { background-image: url(../images/icon/gif.gif); }
#news_detail .post_body li.jpg { background-image: url(../images/icon/jpg.gif); }
#news_detail .post_body li.png { background-image: url(../images/icon/png.gif); }
#news_detail .post_body li.xls { background-image: url(../images/icon/xls.gif); }
#news_detail .post_body li.doc { background-image: url(../images/icon/doc.gif); }
#news_detail .post_body li.ppt { background-image: url(../images/icon/ppt.gif); }
#news_detail .post_body li.mp3 { background-image: url(../images/icon/mp3.gif); }
#news_detail .post_body li.csv { background-image: url(../images/icon/csv.gif); }
#news_detail .post_body li.zip { background-image: url(../images/icon/zip.gif); }
#news_detail .post_body li.jtd { background-image: url(../images/icon/jtd.gif); }
#news_detail .post_body li.rtf { background-image: url(../images/icon/txt.gif); }
#news_detail .post_body li.txt { background-image: url(../images/icon/txt.gif); }
#news_detail .post_body li.xml { background-image: url(../images/icon/xml.gif); }
#news_detail .post_body li.wmv { background-image: url(../images/icon/wmv.gif); }
#news_detail .post_body li.rdf { background-image: url(../images/icon/rdf.gif); }
#news_detail .post_body li.com { background-image: url(../images/icon/com.gif); }

#news_detail .post_body li {
    font-size: 14px;
    line-height: 1.8;
    margin-bottom: 8px;
    list-style: none;
}


#news_detail .post_body ol {
    list-style: decimal;
    padding-left: 1.5em;
    margin-bottom: 30px;
}

#news_detail .post_body ol li {
    font-size: 14px;
    line-height: 1.8;
    margin-bottom: 8px;
}

#news_detail .post_body iframe,
#news_detail .post_body object,
#news_detail .post_body embed {
    max-width: 100%;
    margin-bottom: 30px;
}

#news_detail .btn_blue {
    margin: 80px auto 120px;
}

#news_detail .data_table th {
    width: 120px;
    font-size: 14px;
    padding: 10px 10px 10px 0;
    line-height: 1.8;
}

#news_detail .data_table td {
    width: calc(100% - 100px);
    font-size: 14px;
    padding: 10px 0;
    line-height: 1.8;
}

#news_detail .data_table p { margin: 0; }

/* pc sidebar ---------------------------------------------*/

#news_detail .sidebar {
    width: 25%;
}

#news_detail .sidebar .ranking h2 {
    font-size: 16px;
    margin-bottom: 25px;
    padding-bottom: 25px;
    border-bottom: 1px solid #000;
}

#news_detail .sidebar .ranking a {
    display: block;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px dotted #DBDBDB;
}

#news_detail .sidebar .ranking .box .info { display: flex; }

#news_detail .sidebar .ranking .box .info .category {
    font-size: 12px;
    width: 70px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    color: #fff;
    border-radius: 15px;
}

#news_detail .sidebar .ranking .box .info .event { background-color: #FF6565; }
#news_detail .sidebar .ranking .box .info .work { background-color: #6C9BE6; }
#news_detail .sidebar .ranking .box .info .raising { background-color: #EDA7B5; }
#news_detail .sidebar .ranking .box .info .education { background-color: #D99DE5; }
#news_detail .sidebar .ranking .box .info .house { background-color: #EFBE70; }
#news_detail .sidebar .ranking .box .info .life { background-color: #7DD1AA; }

#news_detail .sidebar .ranking .box .info .date {
    font-size: 12px;
    line-height: 24px;
    font-weight: 500;
    margin-left: 15px;
}

#news_detail .sidebar .ranking .box h3 {
    font-size: 14px;
    font-weight: 400;
    margin-top: 15px;
}

#news_detail .sidebar .same {
    margin-top: 60px;
}

#news_detail .sidebar .same .info { display: flex; }

#news_detail .sidebar .same h2 {
    font-size: 16px;
    margin-bottom: 25px;
    padding-bottom: 25px;
    border-bottom: 1px solid #000;
}

#news_detail .sidebar .same a {
    display: block;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px dotted #DBDBDB;
}

#news_detail .sidebar .same .box .info .category {
    font-size: 12px;
    width: 70px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    color: #fff;
    border-radius: 15px;
}

#news_detail .sidebar .same .box .info .event { background-color: #FF6565; }
#news_detail .sidebar .same .box .info .work { background-color: #6C9BE6; }
#news_detail .sidebar .same .box .info .raising { background-color: #EDA7B5; }
#news_detail .sidebar .same .box .info .education { background-color: #D99DE5; }
#news_detail .sidebar .same .box .info .house { background-color: #EFBE70; }
#news_detail .sidebar .same .box .info .life { background-color: #7DD1AA; }

#news_detail .sidebar .same .box .info .date {
    font-size: 12px;
    line-height: 24px;
    font-weight: 500;
    margin-left: 15px;
}

#news_detail .sidebar .same .box h3 {
    font-size: 14px;
    font-weight: 400;
    margin-top: 15px;
}

/* サイドバー非表示時: .post を幅いっぱいに */
#news_detail.no-sidebar .sidebar { display: none; }
#news_detail.no-sidebar .post    { width: 100%; }

/* pc popular (人気記事) ----------------------------------------*/

#news_detail .sidebar .popular {
    margin-top: 60px;
}

#news_detail .sidebar .popular .info { display: flex; }

#news_detail .sidebar .popular h2 {
    font-size: 16px;
    margin-bottom: 25px;
    padding-bottom: 25px;
    border-bottom: 1px solid #000;
}

#news_detail .sidebar .popular a {
    display: block;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px dotted #DBDBDB;
}

#news_detail .sidebar .popular .box .info .category {
    font-size: 12px;
    width: 70px;
    height: 24px;
    text-align: center;
    line-height: 24px;
    color: #fff;
    border-radius: 15px;
}

#news_detail .sidebar .popular .box .info .event { background-color: #FF6565; }
#news_detail .sidebar .popular .box .info .work { background-color: #6C9BE6; }
#news_detail .sidebar .popular .box .info .raising { background-color: #EDA7B5; }
#news_detail .sidebar .popular .box .info .education { background-color: #D99DE5; }
#news_detail .sidebar .popular .box .info .house { background-color: #EFBE70; }
#news_detail .sidebar .popular .box .info .life { background-color: #7DD1AA; }

#news_detail .sidebar .popular .box .info .date {
    font-size: 12px;
    line-height: 24px;
    font-weight: 500;
    margin-left: 15px;
}

#news_detail .sidebar .popular .box h3 {
    font-size: 14px;
    font-weight: 400;
    margin-top: 15px;
}

/* 767: → life_smp.css */