@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    1.0.7
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/


/*///////////////////////////////////

サイドバー

/////////////////////////////////////

見出し

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

.sidebar h3 {
    background: none;
    font-size: 18px;
    font-family: Quicksand, 游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    letter-spacing: 2px;
    display: inline-block;
    position: relative;
    width: 100%;
    padding: 0;
    text-align: center;
}

.sidebar h3::before,
.sidebar h3::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 28%;
    /*ラインの長さ*/
    border-top: 3px solid #444d53;
    /*ラインの色*/
}

.sidebar h3::before {
    left: 0;
}

.sidebar h3::after {
    right: 0;
}

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

プロフィール

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

.nwa .author-box {
    text-align: center;
    max-width: 100%;
}

#sidebar .author-box {
    border: none;
    border-radius: 4px;
    margin: 1em 0;
    line-height: 1.4;
    position: relative;
    padding: 1.4% 2% 1.8%;
}

#sidebar .author-thumb {
    float: none;
    width: 100%;
    margin: 9px auto 0;
    background: url(https://www.myoken.info/content/wp-content/uploads/妙見外観（夜）.jpg) center no-repeat;
    background-size: cover;
    height: 0;
    padding-top: calc(100%*830/1248);
    position: relative;
}

#sidebar .author-thumb img {
    border: 3px solid #fff;
    width: 30%;
    margin: 0 auto;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -25%;
}

#sidebar .author-content {
    margin-top: 16%;
    font-size: 0.9em;
}

.author-name {
    font-size: 1.1em;
    font-weight: bold;
    margin-bottom: 10px;
}

.author-box .author-name a {
    text-decoration: none;
    color: #333;
}

.author-box p {
    margin-top: 0.3em;
    line-height: 1.6;
}

.author-box p a {
    text-decoration: none;
    color: #008cee;
}

.author-box p a:hover {
    text-decoration: underline;
    color: #008cee;
}

.author-box .sns-follow-buttons a.follow-button {
    font-size: 20px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: none;
    margin-bottom: 4px;
    margin-right: 8px;
    background: none;
    color: #fff;
}

.author-box a.follow-button span {
    line-height: 40px;
}

.author-box a.follow-button span::before {
    font-size: 22px;
}

.author-box .icon-twitter-logo::before {
    font-family: FontAwesome;
    content: "\f099"
}

.author-box .icon-facebook-logo::before {
    font-family: FontAwesome;
    content: "\f09a";
}

.author-box .icon-instagram-new::before {
    font-family: FontAwesome;
    content: "\f16d";
}

.author-box .icon-hatebu-logo::before {
    font-family: Verdana;
    content: 'B!';
    font-weight: bold;
}

.author-box .icon-google-plus-logo::before {
    font-family: FontAwesome;
    content: "\f0d5";
}

.author-box .icon-youtube-logo::before {
    font-family: FontAwesome;
    content: "\f167";
}

.author-box .icon-pinterest-logo::before {
    font-family: FontAwesome;
    content: "\f231";
}

.author-box .icon-amazon-logo::before {
    font-family: FontAwesome;
    content: "\f270";
}

.author-box .icon-github-logo::before {
    font-family: FontAwesome;
    content: "\f09b";
}

.author-box .website-button {
    background-color: #47555c !important;
}

.author-box .twitter-button {
    background-color: #1da1f2 !important;
}

.author-box .facebook-button {
    background-color: #3b5998 !important;
}

.author-box .hatebu-button {
    background-color: #2c6ebd !important;
}

.author-box .google-plus-button {
    background-color: #dd4b39 !important;
}

.author-box .instagram-button {
    background: #e1306c !important;
}

.author-box .youtube-button {
    background-color: #ef1515 !important;
}

.author-box .flickr-button {
    background-color: #0063dc !important;
}

.author-box .pinterest-button {
    background-color: #bd081c !important;
}

.author-box .line-button {
    background-color: #00c300 !important;
}

.author-box .amazon-button {
    background-color: #ff9900 !important;
}

.author-box .rakuten-room-button {
    background-color: #c42e7f !important;
}

.author-box .github-button {
    background-color: #333 !important;
}

.author-box .feedly-button {
    background-color: #2bb24c !important;
}

.author-box .rss-button {
    background-color: #f26522 !important;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1240px以下*/
@media screen and (max-width: 1240px) {
    /*必要ならばここにコードを書く*/
}

/*1030px以下*/
@media screen and (max-width: 1030px) {
    /*必要ならばここにコードを書く*/
}

/*768px以下*/
@media screen and (max-width: 768px) {
    /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px) {
    /*必要ならばここにコードを書く*/

    /* モバイルトップメニュー 横並び*/
    /*
    ul.menu-mobile {
        overflow-x: auto;
        overflow-y: hidden;
        display: flex !important;
        flex-wrap: nowrap;
        font-size: 14px;
        justify-content: flex-start;
        padding: 0 1em;
        -webkit-overflow-scrolling: touch;
        position: relative;
    }

    ul.menu-mobile > li {
        padding-right: 1em;
        white-space: nowrap;
    }

    ul.menu-mobile .item-label {
        white-space: nowrap;
        font-size: 14px;
    }
    */

}