@charset "UTF-8";
/*
 Template:sango-theme
 Theme Name: SANGO Child
 Theme URI: https://saruwakakun.design
 Author: SARUWAKA
 Author URI: https://saruwakakun.com
 Template: sango-theme
*/


/* テーマ変更時は、以下bbpressの表示調整部分を移植してください。*/

/*bbpress---------------------------------------*/
.bbp-form .bbp-form p:nth-child(3),
.bbp-form .bbp-form p:nth-child(4) {
    display: none;/* bbpress 入力欄のメールアドレスとwebサイト削除 */
}

/* bbPressのスタイルを整える */
.bbp-breadcrumb-home,
.bbp-breadcrumb-home+.bbp-breadcrumb-sep,
.topic .post-date,
.topic .post-update,
.topic .footer-post-meta,
.post-0 .post-date,
.post-0 .post-update,
.post-0 .footer-post-meta,
.forum .post-date,
.forum .post-update,
.forum .footer-post-meta{
    display: none;
}
#bbpress-forums { font-family: verdana, arial, sans-serif;}
#bbp_search{ font-size: 17px; height: 28px; }
.post-0 .post-meta{ height: 27px; }
.bbp-reply-content{ font-size: 16px; line-height: 170%; }
.bbp-forum-title{ font-size: 16px !important; }
.bbp-topic-permalink{ font-size: 14px !important; }
#bbpress-forums .status-closed,
#bbpress-forums .status-closed a { color: #555 !important; }

/* bbPressのスタイルを整える end */
.entry-content ul li:before {display: none; }
.entry-content ul li { padding-left: 0; }
.widgettitle { font-size: 20px; } .widgettitle span { padding: 0.25em 0.8em; }
.comment-form-email,.comment-form-url,.comment-subscription-form,.comment-notes { display: none; }

/*----------------------------------------------END bbpress ここまで */

/* widget my_popular_posts */
.widget.my_popular_posts ul li,.popular-posts .widget ul li{ height: 6em; overflow: hidden; }
.widget ul li a{ line-height: 1.5;}

.my-widget li a .my-widget__img {
    display: inline-block;
    width: 90px;
    height: 90px;
    overflow: hidden;
    margin-right: 8px;
}
.my-widget__img img{ max-width: none; height: 100%; width: auto; }

/* related-posts */
.related-posts.type_b .rlmg{ height: 180px; overflow: hidden; background: #f1f1f1; text-align: center; }
.type_b .rlmg img{ height: 100%; width: auto; max-width: none; }

/* LINE */
.sns .pocket a { background: #00B900; box-shadow: 0 3px 0 #009700; }
.sns  .pocket a:hover { background:#009700; }


/* 404 401 */
.img_area{ text-align: center; }
.img_area .image{ text-align: center; }
.entry-content .img_area .image img{ display: inline-block; width: 50%; max-width: 370px; }
/* 401 */
#err{ width: 100%; text-align: center; }
#err h1 span{ font-size: 2em; }


/* page_top */
#page_top{
    position: fixed;
    bottom: -100px;
    right: 10px;
    z-index: 9999;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}
#page_top.fixed{ bottom: 0; }

.footer .fab-btn{ display:none; }

/* ショートコードで吹き出しデザイン */
.voice{
    margin:1em 0 1.3em;
    font-size:0.95em;
}

.voice .voicecomment{
    border:3px solid #eee;
    background-color: #fff;
    color: #444;
    padding: 2.5%;
    position:relative;
    width:85%;
    border-radius:5px;
}
.voice.l .voicecomment{
    float:right;
}
.voice.r .voicecomment{
    float:left;
}

.voice.l .voicecomment:before{
    content: '';
    position: absolute;
    border-right: 8px solid #eee;
    border-bottom: 8px solid transparent;
    border-top: 8px solid transparent;
    top: 10px;
    left: -11px;
}
.voice.l .voicecomment:after{
    content: '';
    position: absolute;
    border-right: 10px solid #fff;
    border-bottom: 8px solid transparent;
    border-top: 8px solid transparent;
    top: 10px;
    left: -7px;
}
.voice.r .voicecomment:before{
    content: '';
    position: absolute;
    border-left: 8px solid #eee;
    border-bottom: 8px solid transparent;
    border-top: 8px solid transparent;
    top: 10px;
    right: -11px;
}
.voice.r .voicecomment:after{
    content: '';
    position: absolute;
    border-left: 10px solid #fff;
    border-bottom: 8px solid transparent;
    border-top: 8px solid transparent;
    top: 10px;
    right: -7px;
}

.voice .voicecomment h2,
.voice .voicecomment h3,
.voice .voicecomment h4,
.voice .voicecomment h5{
    margin:10px 0!important;
    padding:0;
}
.voice .voicecomment p{
    margin-bottom:1em;
}
.voice .voicecomment p:last-child{
    margin-bottom:0;
}
.voice .icon{
    width:12%;
    text-align:center;
}
.voice.l .icon{
    float:left;
}
.voice.r .icon{
    float:right;
}
.voice .icon img{
    border-radius:50%;
    margin:0;
    border: 4px solid #f5f5f5;
}
.voice.icon_red .icon img{
    border-color: #FF4E4E;
}
.voice.icon_blue .icon img{
    border-color: #50B4DE;
}
.voice.icon_yellow .icon img{
    border-color: #faee00;
}
.voice.icon_black .icon img{
    border-color: #222;
}
.voice .icon .name{
    font-size: 0.65em;
    padding:0.4em 0;
}
.voice.big .icon{
    width:18%;
}
.voice.big .voicecomment{
    width:79%;
}

/* 吹き出しデザイン変更 */
/* FB風 */
.voice.l.fb .voicecomment:before{
    border-right-color: #4C5CB0;
}
.voice.l.fb .voicecomment:after,
.voice.l.line .voicecomment:after{
    content:none;
}
.voice.fb .voicecomment{
    background: #4C5CB0;
    border-color: #4C5CB0;
    color:#fff;
}
.voice.r.fb .voicecomment:before{
    border-left-color: #4C5CB0;
}
.voice.r.fb .voicecomment:after{
    content:none;
}
/* LINE風 */
.voice.line .voicecomment{
    background: #7ACC40;
    border-color: #7ACC40;
    color:#fff;
}
.voice.l.line .voicecomment:before{
    border-right-color: #7ACC40;
}
.voice.r.line .voicecomment:before{
    border-left-color: #7ACC40;
}
.voice.r.line .voicecomment:after{
    content:none;
}

@media only screen and (max-width: 480px) {
    .voice .icon{
        width:18%;
    }
    .voice .voicecomment{
        width:80%;
        font-size:0.95em;
    }

}



/* ナビゲーション */
@media only screen and (min-width: 1166px){
    .nav > li > a {
        padding: 15px 0.8em 7px;
    }

}

@media only screen and (min-width: 768px){

/*    .header.headercenter #g_nav {
        margin-top: -70px;
    }
    #g_nav .nav li a {
    font-size: 18px;
    }
    #inner-header #g_nav .nav li a{
    font-family: "ヒラギノ丸ゴ Pro W4", "Hiragino maru Gothic Pro",
    "HG丸ｺﾞｼｯｸM-PRO","Verdana","Osaka",sans-serif;
    text-shadow: 1px 2px 0 white,1px -2px 0 white,-1px 2px 0 white,-1px -2px 0
    white,2px 1px 0 white,2px -1px 0 white,-2px 1px 0 white,-2px -1px 0
    white,1px 1px 0 white,1px -1px 0 white,-1px 1px 0 white,-1px -1px 0
    white,0px 3px 4px #919191;
    color: #000;
    }
    #inner-header #g_nav .nav li a span {
    text-shadow:none;
    font-size: 11px;
    color: #fff;
    padding-top: 5px;
    font-family: verdana, arial, sans-serif;
    }
    .nav > li {
    width: 25%;
    height: 86px;
    }*/

}


/* 共通 追加タグ addQuicktag テーマ変更時は移動 */
.pink_line { background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #FFDFEF 0%) repeat scroll 0 0;}
.blue_line{ background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #cce5ff 0%) repeat scroll 0 0;}
.yellow_line{ background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #ffffbc 0%) repeat scroll 0 0;}
.green_line{ background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%,rgba(151,232,154,.69) 0%) repeat scroll 0 0; }
.pink_line_narrow{ background:rgba(0, 0, 0, 0) linear-gradient(transparent 80%, #ffb2d8 0%) repeat scroll 0 0;}
.blue_line_narrow { background:rgba(0, 0, 0, 0) linear-gradient(transparent 80%, #add6ff 0%) repeat scroll 0 0;}
.yellow_line_narrow{ background:rgba(0, 0, 0, 0) linear-gradient(transparent 80%, #ffff7f 0%) repeat scroll 0 0;}
.green_line_narrow{ background:rgba(0, 0, 0, 0) linear-gradient(transparent 80%, rgba(151,232,154,.69) 0%) repeat scroll 0 0;}