@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
.sidebar { font-size: 15px; }
.entry-content h1 { line-height: 1.9 !important; }
.entry-content h2 { margin-top:50px; padding: 1rem 2rem; border-left: 13px solid #5bc0de; line-height: 1.4 !important; }
.entry-content h3 { color: #000; position: relative; padding: 1.5rem 0; margin-top:20px; text-align:left; }
.entry-content h3:after { position: absolute; bottom: 0; left: 0; width: 100%; height: 10px; content: ''; background-image: -webkit-repeating-linear-gradient(135deg, #8bcbde, #8bcbde 1px, transparent 2px, transparent 5px); background-image: repeating-linear-gradient(-45deg, #000, #000 1px, transparent 2px, transparent 5px); background-size: 7px 7px; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.entry-content h4 { font-size:120%; margin-top:60px; padding:23px; background:#E0E0E0; }
.entry-content h5 { font-size:120%; font-weight: normal; font-style: italic; padding: 0.5rem 2rem; border-left: 13px solid #E0E0E0; }
em { font-size:150%; color: #000; background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #FADBD8), color-stop(45%, #FADBD8), color-stop(45%, transparent), to(transparent)); }
ol em {font-size: 150%; color: #000; background: none;}
.entry-title { font-size:230%; }
blockquote { background-color: #f1f1f1; padding: 2.3em 1.8em; position: relative; }
blockquote cite{ margin-top:25px; display: block; font-size:0.8rem; color:000; text-align:right; }
.author-box p { margin-top: 0.3em; line-height: 1.7; }
.translation { margin: 0 auto 2em; padding: 1em 2em 1.5em; background-color: #f1f1f1; border-radius: 10px; }
.translation .title { color: #b4bbce; font-size: 1.1em; font-size: 80%; margin-bottom:12px;}
.translation .title::before { margin-right: 5px; }
.translation p { margin:0; }
.translation hr { margin:25px 0; }
audio { width:100%; }
.comment-btn { background-color: #72c7e6; color: #fff; border: none; font-size: 20px; transition: 0.5s; }
.comment-btn:hover { background-color: #49add1; color: #fff; transition: 0.5s; }
.comment-respond { margin-top: -2px; }
.comment-respond p { margin: 1em 0; }
#commentform { padding: 20px; }
p.comment-notes { font-size: 14px; }
p.form-submit { margin: 2em 0 1em 0; }
#commentform input[type="text"], #commentform textarea { padding: 11px; border: none; border-radius: 4px; font-size: 18px; width: 100%; background: #e2e2e2; }
#commentform input[type="submit"] { -webkit-appearance: none; padding: 11px; width: 100%; margin: 0; cursor: pointer; background: #72c7e6; color: #fff; border: none; font-size: 16px; transition: 0.5s; }
#commentform input[type="submit"]:hover { background: #49add1; transition: 0.5s; }

.contents { margin: 0 auto 2em; padding: 30px 10px 10px 10px; background-color:#f1f1f1; }
.contents a { text-decoration-line: underline; text-decoration-color: currentColor; text-underline-offset: 0.15em; text-decoration-thickness: 2px; text-underline-offset: 0.35em; text-decoration-skip-ink: none; }
.entry-content ol { counter-reset:number; list-style-type: none!important; padding:0.5em; }
.entry-content ol li { position: relative; padding-left: 30px; line-height: 1.5em; padding: 0.5em 0.5em 0.5em 40px; }
.entry-content ol li:before{ position: absolute; counter-increment: number; content: counter(number); display:inline-block; background: #5bc0de; color: white; font-family: 'Avenir','Arial Black','Arial',sans-serif; font-weight:bold; font-size: 15px; border-radius: 50%; left: 0; width: 25px; height: 25px; line-height: 25px; text-align: center; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.post_content ol:not([class]) { list-style: decimal outside none; margin-left: 0em; }

.related-entry-card-snippet, .entry-card-snippet {
    font-size: var(--cocoon-text-size-s);
    margin: 0 0 0.4em 0;
    line-height: 1.8;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}



/*1023px以下*/
@media screen and (max-width: 1023px){
#header .site-name-text { font-size: 35px; }
}

/*834px以下*/
@media screen and (max-width: 834px){
.entry-title {  font-size:180%; padding:0px;}
}


/*480px以下*/
@media screen and (max-width: 480px){
#header .site-name-text { font-size: 28px; }
.entry-content h2 { margin-top:50px; border-left: 13px solid #5bc0de; line-height: 1.4 !important; }
}