/* <system section="theme" selected="26006613679988240"> */
@charset "UTF-8";
/* Theme: MaruPOP
  Author: michiru
  Description:
  まるっぽいポップなテンプレートです。
  Responsive: yes */
/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */
@import url("https://fonts.googleapis.com/css2?family=Courier+Prime&family=Fredoka+One&family=Kosugi+Maru&family=Roboto&family=Sawarabi+Gothic&display=swap");
@import url("https://fonts.googleapis.com/icon?family=Material+Icons");
html {
    line-height: 1.15;
    /* 1 */
    -ms-text-size-adjust: 100%;
    /* 2 */
    -webkit-text-size-adjust: 100%;
    /* 2 */
}

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers (opinionated).
 */
body {
    margin: 0;
}

/**
 * Add the correct display in IE 9-.
 */
article,
aside,
footer,
header,
nav,
section {
    display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in IE.
 */
figcaption,
figure,
main {
    /* 1 */
    display: block;
}

/**
 * Add the correct margin in IE 8.
 */
figure {
    margin: 1em 40px;
}

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
    -webkit-box-sizing: content-box;
            box-sizing: content-box;
    /* 1 */
    height: 0;
    /* 1 */
    overflow: visible;
    /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
    font-family: monospace, monospace;
    /* 1 */
    font-size: 1em;
    /* 2 */
}

/* Text-level semantics
   ========================================================================== */
/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */
a {
    background-color: transparent;
    /* 1 */
    -webkit-text-decoration-skip: objects;
    /* 2 */
}

/**
 * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
    border-bottom: none;
    /* 1 */
    text-decoration: underline;
    /* 2 */
    -webkit-text-decoration: underline dotted;
            text-decoration: underline dotted;
    /* 2 */
}

/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */
b,
strong {
    font-weight: inherit;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
    font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
    font-family: monospace, monospace;
    /* 1 */
    font-size: 1em;
    /* 2 */
}

/**
 * Add the correct font style in Android 4.3-.
 */
dfn {
    font-style: italic;
}

/**
 * Add the correct background and color in IE 9-.
 */
mark {
    background-color: #ff0;
    color: #000;
}

/**
 * Add the correct font size in all browsers.
 */
small {
    font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
audio,
video {
    display: inline-block;
}

/**
 * Add the correct display in iOS 4-7.
 */
audio:not([controls]) {
    display: none;
    height: 0;
}

/**
 * Remove the border on images inside links in IE 10-.
 */
img {
    border-style: none;
}

/**
 * Hide the overflow in IE.
 */
svg:not(:root) {
    overflow: hidden;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
    font-family: sans-serif;
    /* 1 */
    font-size: 100%;
    /* 1 */
    line-height: 1.15;
    /* 1 */
    margin: 0;
    /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
    /* 1 */
    overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
    /* 1 */
    text-transform: none;
}

/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */
button,
html [type="button"],
[type="reset"],
[type="submit"] {
    -webkit-appearance: button;
    /* 2 */
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
    padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    /* 1 */
    color: inherit;
    /* 2 */
    display: table;
    /* 1 */
    max-width: 100%;
    /* 1 */
    padding: 0;
    /* 3 */
    white-space: normal;
    /* 1 */
}

/**
 * 1. Add the correct display in IE 9-.
 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
    display: inline-block;
    /* 1 */
    vertical-align: baseline;
    /* 2 */
}

/**
 * Remove the default vertical scrollbar in IE.
 */
textarea {
    overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */
[type="checkbox"],
[type="radio"] {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    /* 1 */
    padding: 0;
    /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
    -webkit-appearance: textfield;
    /* 1 */
    outline-offset: -2px;
    /* 2 */
}

/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
    -webkit-appearance: button;
    /* 1 */
    font: inherit;
    /* 2 */
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 */
details,
menu {
    display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
    display: list-item;
}

/* Scripting
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
canvas {
    display: inline-block;
}

/**
 * Add the correct display in IE.
 */
template {
    display: none;
}

/* Hidden
   ========================================================================== */
/**
 * Add the correct display in IE 10-.
 */
[hidden] {
    display: none;
}

/*googlefonts*/
/*googleicon*/
/*スムーズスクロール用*/
html {
    scroll-behavior: smooth;
    -webkit-appearance: none;
}

html,
body {
    font-family: "Roboto", "Sawarabi Gothic", sans-serif;
    color: #454545;
    background-color: #f7e7c6;
    line-height: 1.8;
    letter-spacing: 0.1em;
    font-size: 16px;
    overflow-x: hidden;
    /*横スクロール強制撤去*/
    position: relative;
    /*safari対策*/
}

a {
    color: #454545;
}

a:hover {
    color: black;
}

a.keyword {
    text-decoration: none;
    border-bottom: 1px dotted #AAAEBD;
    color: #454545;
}

h1, h2, h3, h4, h5, h6 {
    color: #ECA393;
    line-height: 2;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    color: #ECA393;
    text-decoration: none;
}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {
    color: #ECA393;
    text-decoration: underline;
}

/* ヘッダ（グローバルヘッダ）
  グローバルヘッダの中はiframeですが、
  #globalheader-container に背景色や文字色を指定することでiframeの中にも色が反映されます。
*/
#globalheader-container {
    background-color: #454545;
    color: #f7e7c6;
}

/* container */
#container,
#footer {
    width: 100%;
    /*TITLE横幅いっぱい*/
}

@media (min-width: 768px) {
    #container,
    #footer {
        /*width: 720px;*/
        margin: auto;
    }
}

@media (min-width: 992px) {
    #container,
    #footer {
        /*width: 940px;*/
        margin: auto;
    }
}

/* ---2カラムレイアウト 
#content-inner {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    @media (min-width: 768px) {
        flex-direction: row;
    }
}
#wrapper {
    @media (min-width: 768px) {
        width: 480px;
    }
    @media (min-width: 992px) {
        width: 600px;
    }
}
#box2 {
    @media (min-width: 768px) {
        width: 200px;
    }
    @media (min-width: 992px) {
        width: 300px;
    }
}
---END カラム */
/* 下記のスタイルを適用するとテーマを1カラムレイアウトにできます。
利用するにはコメントアウトを解除してください。
（2カラムレイアウトの場合はコメントアウト全体が不要です）*/
#content-inner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
}

@media (min-width: 768px) {
    #content-inner {
        width: 720px;
        margin: auto;
    }
}

@media (min-width: 992px) {
    #content-inner {
        width: 940px;
        margin: auto;
    }
}

@media (min-width: 768px) {
    #wrapper {
        width: 100%;
    }
}

@media (min-width: 992px) {
    #wrapper {
        max-width: 100%;
    }
}

#box2 {
    width: 100%;
}

@media (min-width: 768px) {
    #box2 {
        width: 100%;
    }
}

@media (min-width: 992px) {
    #box2 {
        width: 100%;
    }
}

#box2-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
}

@media (min-width: 768px) {
    #box2-inner {
        margin-left: -20px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
    }
}

@media (min-width: 992px) {
    #box2-inner {
        margin-left: -30px;
    }
}

/*--- モジュールの幅 ---*/
/*PC以外は1列表示*/
.hatena-module {
    width: 100%;
    /*@media (min-width: 768px) {
        width: 33.3333%;
    }*/
    /*PCでは2列表示*/
}

@media (min-width: 992px) {
    .hatena-module {
        width: 50%;
    }
}

/*---- END 1カラム ----*/
/* ヘッダ */
#blog-title {
    margin: 0;
    /*上にぴったりくっつける*/
    padding: 0;
    text-align: center;
    background: #f7e7c6;
    color: #fff;
}

@media (min-width: 768px) {
    #blog-title {
        /*  text-align: left; */
    }
}

/*--- タイトル ---*/
#title {
    margin: 0 0 1rem 0;
    font-family: "Fredoka One", "Kosugi Maru", sans-serif;
    /* タイトルフォントまるっぽいやつ */
    font-size: 2rem;
    /* 小さめ画面でのタイトル大きさ */
    padding: 3rem;
    /*タイトル余白*/
    background: #ECA393;
}

#title a {
    color: #fff;
}

#title a:hover {
    text-decoration: none;
}

@media (min-width: 992px) {
    #title {
        font-size: 3.5rem;
        /* PCタイトル大きさ */
    }
}

/* タイトル下説明文 */
#blog-description {
    font-family: "Fredoka One", "Kosugi Maru", sans-serif;
    font-weight: normal;
    font-size: .9rem;
    margin: 0 0 2rem 0;
    padding: .4rem;
    color: #fff;
    background: #A8C5E1;
}

@media (min-width: 992px) {
    #blog-description {
        font-size: 1.2rem;
        /* PC説明文字大きさ */
    }
}

/* ヘッダ画像を設定したとき */
.header-image-enable #blog-title {
    margin-bottom: 3rem;
}

.header-image-enable #blog-title-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 1rem 0 0 3rem;
    background-position: center center;
    /* 背景画像の位置を中央に */
    background-size: cover;
    /* 縦横比保ったまま拡大 */
}

.header-image-enable #blog-title-content {
    margin-left: 10px;
    margin-right: 10px;
}

/* タイトル下HTML */
#top-editarea {
    margin-bottom: 1em;
}

/*=====================
追従するトップへ戻るボタン
=======================*/
#page-top {
    position: fixed;
    right: 20px;
    bottom: 20px;
    font-size: 1.4rem;
    line-height: 1.4rem;
    background: #ECA393;
    color: #fff;
    padding: .8rem;
    border-radius: 50%;
    -webkit-box-shadow: 0 2px 10px -6px rgba(0, 0, 0, 0.5), 0 3px 10px -4px rgba(0, 0, 0, 0.2);
            box-shadow: 0 2px 10px -6px rgba(0, 0, 0, 0.5), 0 3px 10px -4px rgba(0, 0, 0, 0.2);
    /* PCモニターでのサイズと距離 */
}

@media (min-width: 992px) {
    #page-top {
        font-size: 1.6rem;
        line-height: 1.6rem;
        padding: 1rem;
        right: 40px;
        bottom: 30px;
    }
}

/*スマホの時は表示しない*/
@media (max-width: 767px) {
    #page-top {
        display: none;
    }
}

/*======================
トップへ戻るボタンここまで
========================*/
/* パンくず（カテゴリー、記事ページで表示されます） */
.breadcrumb {
    margin: 0;
    padding: 0 2em;
    font-size: .8rem;
}

.breadcrumb .breadcrumb-inner {
    display: inline-block;
    margin: auto;
    padding: 0;
}

/* entry */
.entry {
    position: relative;
    margin-bottom: 2rem;
    padding: .5rem;
    background: #FFF;
    /*大きいサイズでは角の丸い記事になる*/
}

@media (min-width: 768px) {
    .entry {
        padding: 1rem;
        background: #FFF;
        border-radius: 50px;
    }
}

@media (min-width: 992px) {
    .entry {
        background: #FFF;
        border-radius: 50px;
    }
}

.entry-header {
    padding-bottom: 1em;
    margin-bottom: 2em;
    border-bottom: 2px dashed #AAAEBD;
    position: relative;
}

.date {
    margin-left: 1em;
    margin-bottom: .5em;
    font-size: .9rem;
}

.date a {
    color: #A8C5E1;
    text-decoration: none;
}

.date a:hover {
    color: #A8C5E1;
    text-decoration: underline;
}

.date a:before {
    /* アイコン左につける */
    content: 'calendar_today';
    /*カレンダーのicon*/
    font-family: "Material Icons";
}

.entry-title {
    font-family: "Fredoka One", "Kosugi Maru", sans-serif;
    /* タイトルフォントまるっぽいやつ */
    margin: 0 0 .3em;
    font-size: 1.5rem;
    position: relative;
    padding: 0 0.2rem;
    text-align: center;
}

@media (min-width: 992px) {
    .entry-title {
        font-size: 1.8rem;
    }
}

.categories {
    text-align: center;
    margin: .5em 0 1em;
    font-size: .8rem;
}

.categories a {
    color: #fff;
    position: relative;
    text-decoration: none;
    margin: .3em;
    /* カテゴリ同士の距離感 */
    padding: 0.3em 0.7em 0.4em 2.1em;
    /* iconと文字との距離感 */
    display: inline-block;
    background-color: #AAAEBD;
    border: solid 0px #AAAEBD;
    /* 角丸くするためのボーダー */
    border-radius: 10px;
    /* 角の丸さ具合 */
    -webkit-transition-duration: 0.2s;
            transition-duration: 0.2s;
    /*変化にかかる時間*/
    -webkit-transition-property: background;
    transition-property: background;
    /*ransition効果を適用するCSSプロパティ名*/
}

.categories a:before {
    /* アイコン左につける */
    position: absolute;
    font-size: .8rem;
    left: .7em;
    top: .2em;
    content: '\f04a';
    /*タグのicon*/
    font-family: "blogicon";
}

.categories a:hover {
    background: rgba(170, 174, 189, 0.4);
}

/* 「編集する」ボタン */
.entry-header-menu {
    color: #A8C5E1;
    position: absolute;
    top: 0;
    right: 0;
}

.entry-header-menu:before {
    /* アイコン左につける */
    content: '\f010';
    /*編集のicon*/
    font-family: "blogicon";
}

.entry-header-menu a {
    color: #A8C5E1;
    text-decoration: none;
}

.entry-header-menu a:hover {
    text-decoration: underline;
}

/* 記事内の書式 */
.entry-content {
    /* 記事内大見出し */
    /* 記事内中見出し（付箋風） */
    /* 記事内小見出し（斜めストライプ下線） */
    /* 吹き出し風見出し用 */
    /*--- ★リスト ---*/
    /* リスト下のリスト */
    /*--- 番号付きリスト ---*/
    /*入れ子は余白リセット*/
    /* 番号付きリスト下のリスト */
    /*--- 記事内用語と説明デザイン ---*/
    /*--- 本文の段落 ---*/
    /*--- テーブルデザイン ---*/
    /* 引用 */
    /*引用内の文字*/
    /*引用内のリンク*/
    /*キャプション*/
    /*--- コード ---*/
    /*一行コードのフォントサイズ*/
    /*文中コードの設定*/
    /* cssのラベル */
    /*htmlのラベル*/
    /*hatenaのラベル*/
    /*--- 区切り線 ---*/
    /*--- 記事貼り付けデザイン ---*/
    /*--- カード下のurl部分のデザイン ---*/
    /*--- 目次デザイン ---*/
}

.entry-content img,
.entry-content video {
    max-width: 100%;
    display: block;
    margin: auto;
    height: auto;
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
    font-family: "Fredoka One", "Kosugi Maru", sans-serif, cursive;
    /* タイトルフォントまるっぽいやつ */
    letter-spacing: 0.2em;
    margin: 1em 0 0.8em 0;
    color: #454545;
}

.entry-content h1 {
    font-size: 1.5rem;
}

@media (min-width: 992px) {
    .entry-content h1 {
        font-size: 1.7rem;
    }
}

.entry-content h2 {
    font-size: 1.4rem;
}

@media (min-width: 992px) {
    .entry-content h2 {
        font-size: 1.5rem;
    }
}

.entry-content h3 {
    font-size: 1.3rem;
    position: relative;
    padding: .5rem 1.5rem;
    background: #ECA393;
    color: #fff;
    border-radius: 20px;
}

@media (min-width: 992px) {
    .entry-content h3 {
        font-size: 1.5rem;
    }
}

.entry-content h4 {
    font-size: 1.2rem;
    padding-left: 1rem;
    border-left: 8px double #ECA393;
    background: #f7e7c6;
}

@media (min-width: 992px) {
    .entry-content h4 {
        font-size: 1.4rem;
    }
}

.entry-content h5 {
    font-size: 1rem;
    position: relative;
    padding: .5rem .8rem;
}

.entry-content h5:after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 10px;
    content: '';
    background-image: -webkit-repeating-linear-gradient(135deg, #A8C5E1, #A8C5E1 1px, transparent 2px, transparent 5px);
    background-image: repeating-linear-gradient(-45deg, #A8C5E1, #A8C5E1 1px, transparent 2px, transparent 5px);
    background-size: 7px 7px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

@media (min-width: 992px) {
    .entry-content h5 {
        font-size: 1.2rem;
    }
}

.entry-content h6 {
    font-size: .9rem;
    position: relative;
    padding: 0.3rem 1rem;
    border: 3px solid #d8d8d8;
    border-radius: 10px;
    background: #f9f9f9;
}

.entry-content h6:before {
    position: absolute;
    bottom: -14px;
    left: 1em;
    width: 0;
    height: 0;
    content: '';
    border-width: 14px 12px 0 12px;
    border-style: solid;
    border-color: #d8d8d8 transparent transparent transparent;
}

.entry-content h6:after {
    position: absolute;
    bottom: -10px;
    left: 1em;
    width: 0;
    height: 0;
    content: '';
    border-width: 14px 12px 0 12px;
    border-style: solid;
    border-color: #f9f9f9 transparent transparent transparent;
}

@media (min-width: 992px) {
    .entry-content h6 {
        font-size: 1.1rem;
    }
}

.entry-content div.check {
    /* CHECK用 */
    margin: 2rem 0;
    font-size: .9rem;
    position: relative;
    padding: 1rem 2rem;
    /* 中身の文字間隔 */
    text-align: left;
    border-radius: 0 10px 10px 10px;
    background: #F7E1B5;
    /* 見出し部分の背景 */
}

.entry-content div.check:before {
    content: '\f029';
    /*チェックのicon*/
    font-family: "blogicon";
    font-size: 1.2rem;
    position: absolute;
    top: -32px;
    /* ラベル部分の位置 */
    left: 0;
    padding: 0 1em;
    /*ラベル部分の余白*/
    color: #fff;
    /* ラベル文字色 */
    border-radius: 10px 10px 0 0;
    background: #FAB796;
    /* ラベル背景 */
    width: 98px;
    /*ラベルの横幅 */
    height: 32px;
    /* ラベルの高さ */
}

.entry-content div.check:after {
    content: 'CHECK';
    /*任意の文字*/
    font-family: "Fredoka One", cursive;
    font-size: 1.1rem;
    position: absolute;
    color: #fff;
    /* ラベル文字色 */
    top: -1.9rem;
    /* ラベル文字の位置 */
    left: 3rem;
    /* ラベル文字の位置 */
}

.entry-content ul,
.entry-content ol,
.entry-content dd {
    margin: 0 1rem;
    padding: 0 1rem .3rem;
    /*余白*/
    background: #f0f0f0;
}

.entry-content ul {
    list-style: none;
    /* デフォルトの丸消す */
    font-size: .9rem;
    font-weight: bold;
    /*PCでの見え方*/
}

@media (min-width: 992px) {
    .entry-content ul {
        font-size: 1rem;
    }
}

.entry-content ul li:before {
    content: '\f02d';
    font-family: "blogicon";
    font-size: 1.1rem;
    width: 1.2rem;
    /*iconの横幅*/
    height: 1.2rem;
    /*iconの縦幅*/
    display: inline-block;
    position: relative;
    /* 位置調整 */
    top: .2rem;
    /* 位置調整 */
}

.entry-content li ul li {
    font-size: .8rem;
    font-weight: normal;
    /*PCでの見え方*/
}

@media (min-width: 992px) {
    .entry-content li ul li {
        font-size: .9rem;
    }
}

.entry-content li ul li:before {
    font-size: .8rem;
    content: "L";
    font-weight: bold;
    width: .8rem;
    height: 1rem;
    display: inline-block;
    position: relative;
    /* 位置調整 */
    top: 0;
    /* 位置調整 */
    margin-right: 1px;
    /* 余白指定 */
}

.entry-content ol {
    padding: .5rem 1rem;
    font-size: .9rem;
    font-weight: bold;
    /*PCでの見え方*/
}

@media (min-width: 992px) {
    .entry-content ol {
        font-size: 1rem;
    }
}

.entry-content ol li {
    margin: 0 2rem;
    /* 位置調整 */
    padding-top: 0;
}

.entry-content ol li ol {
    margin: 0;
    padding: 0;
    font-weight: normal;
}

.entry-content li ol {
    font-size: .8rem;
    /*PCでの見え方*/
}

@media (min-width: 992px) {
    .entry-content li ol {
        font-size: .9rem;
    }
}

.entry-content dl {
    margin: 1em;
    padding-top: 1rem;
    /* 位置調整 */
    border: 2px solid #AAAEBD;
    border-radius: 10px;
    /* 角を丸くする */
}

.entry-content dt {
    /*用語デザイン*/
    position: relative;
    display: inline-block;
    font-size: .9rem;
    /*小さいデバイスでの文字の大きさ*/
    font-weight: bold;
    /*太字*/
    background: #F7E1B5;
    margin: .3rem 1rem;
    padding: .5rem 1rem;
    border-radius: 10px;
    /* 角を丸くする */
    /*PCでの見え方*/
}

.entry-content dt:before {
    /* 吹き出し風デザイン */
    position: absolute;
    width: 0;
    height: 0;
    left: 1.5em;
    top: 2.7em;
    content: '';
    border-width: 10px 8px 0 8px;
    border-style: solid;
    border-color: #F7E1B5 transparent transparent transparent;
}

@media (min-width: 992px) {
    .entry-content dt {
        font-size: 1rem;
    }
}

.entry-content dd {
    /*説明デザイン*/
    background: none;
    margin: 0 2.5rem 2.5rem 2.5rem;
    padding-left: .5rem;
    font-size: .8rem;
    text-align: left;
    border-bottom: 4px solid #C4ECF8;
    /*PCでの見え方*/
}

@media (min-width: 992px) {
    .entry-content dd {
        font-size: .9rem;
    }
}

.entry-content p {
    margin: 0;
    padding: .5em;
    font-size: .9rem;
    /*太字(色少し濃く)*/
    /*斜体（蛍光ペン風）*/
    /*打ち消し*/
    /*アンダーライン（ボーダー）*/
    /*少し強調(ブルー蛍光ペン)*/
    /*強調（二本線アンダーライン）*/
}

@media (min-width: 992px) {
    .entry-content p {
        padding: .8em 1em .5em;
        font-size: 1rem;
    }
}

.entry-content p b {
    color: #333;
}

.entry-content p i {
    font-style: normal;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30%, transparent), color-stop(0%, #f7e7c6));
    background: linear-gradient(transparent 30%, #f7e7c6 0%);
}

.entry-content p s {
    color: #f0f0f0;
}

.entry-content p u {
    text-decoration: none;
    border-bottom: 2px dotted #ECA393;
}

.entry-content p em {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30%, transparent), color-stop(0%, #A8C5E1));
    background: linear-gradient(transparent 30%, #A8C5E1 0%);
    font-style: normal;
}

.entry-content p strong {
    color: #454545;
    border-bottom: 6px double #FAA;
}

.entry-content table {
    margin: 0 auto;
    /*上下・左右*/
    border-collapse: collapse;
    border-spacing: 0;
    border-bottom: 1.5em;
    width: auto;
    overflow: auto;
    font-size: .8rem;
}

@media (min-width: 992px) {
    .entry-content table {
        font-size: .9rem;
    }
}

.entry-content table th,
.entry-content table td {
    text-align: center;
    border: 1px solid #AAAEBD;
    padding: .5rem 1rem;
}

.entry-content table th {
    background: #f0f0f0;
}

.entry-content blockquote {
    margin: 2rem 1.2rem 1rem;
    /*上・左右・下の余白*/
    position: relative;
    padding: 5px 15px 5px 55px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    /*paddingとborderを幅と高さに含む*/
    color: #454545;
    /*引用内の文字色*/
    background: #f0f0f0;
    /*引用の背景色*/
    font-size: .9rem;
}

@media (min-width: 992px) {
    .entry-content blockquote {
        font-size: 1rem;
    }
}

.entry-content blockquote:before {
    content: '\f012';
    /* リボンのicon */
    font-family: "blogicon";
    position: absolute;
    font-size: 3rem;
    left: 1rem;
    /* 位置調整左 */
    top: -2rem;
    /* 位置調整上 */
    color: #ECA393;
    /* リボンカラー */
}

.entry-content blockquote:after {
    display: inline-block;
    position: absolute;
    top: -.4rem;
    /* 位置調整上 */
    left: 1.6rem;
    /* 位置調整左 */
    text-align: center;
    content: '\f704';
    /*引用マーク*/
    font-family: "blogicon";
    color: #FFF;
    font-size: 1rem;
    line-height: 2rem;
}

.entry-content blockquote p {
    font-style: italic;
    /* 斜体文字 */
    position: relative;
    padding: 0;
    margin: 1.4rem .4rem .5rem;
    /*上・左右・下*/
    z-index: 3;
    line-height: 1.7;
}

.entry-content blockquote cite {
    display: block;
    text-align: right;
    font-size: 0.9em;
}

.entry-content figure {
    display: table;
    /*tableと同じ性質にする*/
    background: whitesmoke;
    margin: 0 auto;
    border-bottom: 2px dashed #AAAEBD;
    border-radius: 10px 10px 0 0;
    padding: 1rem 1rem 0.5rem 1rem;
}

.entry-content figcaption {
    padding: .5rem;
    background: whitesmoke;
    display: table-caption;
    /*captionと同じ性質にする*/
    caption-side: bottom;
    font-size: 0.8em;
    border-top: 0px solid #AAAEBD;
    border-radius: 0 0 10px 10px;
    opacity: 1;
    /*デフォルトでついてる透かしを元に戻す*/
}

.entry-content pre {
    font-family: "Courier Prime", "Sawarabi Gothic", "Monaco", "Consolas", "Courier New", Courier, monospace, sans-serif;
    margin: 2rem 0;
    background: #f0f0f0;
    border: none;
    white-space: pre-wrap;
    text-overflow: ellipsis;
    line-height: 1.4;
    padding: 1rem;
}

.entry-content pre span {
    font-size: .8rem;
}

@media (min-width: 992px) {
    .entry-content pre span {
        font-size: .9rem;
    }
}

.entry-content .code {
    font-size: .8rem;
}

@media (min-width: 992px) {
    .entry-content .code {
        font-size: .9rem;
    }
}

.entry-content code {
    font-family: "Courier Prime", "Sawarabi Gothic", "Monaco", "Consolas", "Courier New", Courier, monospace, sans-serif;
    font-size: .9rem;
    background: #f0f0f0;
    border-radius: 8px;
    border: none;
    padding: .4rem .3rem;
}

.entry-content .lang-css {
    font-size: .9rem;
    position: relative;
    padding-top: 2.8rem;
    /*pre左上のラベル*/
}

.entry-content .lang-css:before {
    display: inline-block;
    position: absolute;
    padding: .2rem .5rem;
    color: #fff;
    content: '\f038';
    font-family: "blogicon";
    font-weight: bold;
    height: auto;
    width: 3.8rem;
    vertical-align: middle;
    top: 0;
    left: 0;
    background: #ECA393;
}

.entry-content .lang-css:after {
    display: inline-block;
    position: absolute;
    padding: .2rem .5rem;
    color: #fff;
    top: 0;
    left: 1.2rem;
    content: 'code';
    font-weight: bold;
}

@media (min-width: 992px) {
    .entry-content .lang-css {
        font-size: 1rem;
    }
}

.entry-content .lang-html {
    font-size: .9rem;
    position: relative;
    padding-top: 2.8rem;
    /*pre左上のラベル*/
}

.entry-content .lang-html:before {
    display: inline-block;
    position: absolute;
    padding: .2rem .5rem;
    color: #fff;
    content: '\f038';
    font-family: "blogicon";
    font-weight: bold;
    height: auto;
    width: 3.8rem;
    vertical-align: middle;
    top: 0;
    left: 0;
    background: #A8C5E1;
}

.entry-content .lang-html:after {
    display: inline-block;
    position: absolute;
    padding: .2rem .5rem;
    color: #fff;
    top: 0;
    left: 1.2rem;
    content: 'html';
    font-weight: bold;
}

@media (min-width: 992px) {
    .entry-content .lang-html {
        font-size: 1rem;
    }
}

.entry-content .lang-hatena {
    font-size: .9rem;
    position: relative;
    padding-top: 2.8rem;
    /*左上のラベル*/
}

.entry-content .lang-hatena:before {
    display: inline-block;
    position: absolute;
    padding: .2rem .5rem;
    color: #fff;
    content: '\f038';
    font-family: "blogicon";
    font-weight: bold;
    height: auto;
    width: 4.8rem;
    vertical-align: middle;
    top: 0;
    left: 0;
    background: #AAAEBD;
}

.entry-content .lang-hatena:after {
    display: inline-block;
    position: absolute;
    padding: .2rem .5rem;
    color: #fff;
    top: 0;
    left: 1.2rem;
    content: 'hatena';
    font-weight: bold;
}

@media (min-width: 992px) {
    .entry-content .lang-hatena {
        font-size: 1rem;
    }
}

.entry-content hr {
    width: 100%;
    border: 0;
    border: none;
    border-top: 2px dashed #AAAEBD;
    margin: 1rem auto;
}

.entry-content iframe.embed-card.embed-blogcard {
    padding: 1rem 0 0 0;
    /*上に少し余白*/
}

.entry-content cite.hatena-citation {
    font-size: .8rem;
    padding: 0;
}

.entry-content cite.hatena-citation a {
    padding: .3rem;
    /*ここの値を変えたらcalc内の.6remも変更する*/
    text-decoration: none;
    max-width: calc(500px - .6rem);
    /*リンクの横幅カードに合わせる*/
    display: block;
    -webkit-transition: all .2s;
    transition: all .2s;
    border-radius: 3px;
    background: #fff;
    text-align: center;
}

.entry-content cite.hatena-citation a:hover {
    -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
            box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
}

.entry-content cite.hatena-citation a:after {
    content: 'open_in_browser';
    font-family: "Material Icons";
}

.entry-content .table-of-contents {
    margin: .6rem auto;
    /*中央寄せ*/
    padding: .5rem 1.5rem;
    border-radius: 30px;
    width: auto;
    /*PCでの見え方*/
}

.entry-content .table-of-contents a {
    text-decoration: none;
}

.entry-content .table-of-contents a:hover {
    text-decoration: underline;
}

.entry-content .table-of-contents:before {
    margin: auto;
    /*要素を真ん中に寄せる*/
    padding: 0;
    text-align: center;
    /* 文字の真ん中よせ */
    display: block;
    max-width: auto;
    content: '\f039  CONTENTS';
    /* 目次のiconと文字 */
    font-family: "blogicon", "Fredoka One";
    /* font指定 */
    font-size: 1.4rem;
    border-bottom: 2px dashed #AAAEBD;
}

.entry-content .table-of-contents ul {
    overflow: auto;
    margin: 0;
    /*リセット*/
    padding: 0 0 0 2rem;
    background: none;
}

.entry-content .table-of-contents li {
    font-size: 1rem;
    font-weight: bold;
    /* 大見出しリスト太字 */
}

.entry-content .table-of-contents li:before {
    content: '\f029';
    font-family: "blogicon";
    font-size: .8rem;
    top: 0;
    color: dimgray;
}

.entry-content .table-of-contents ul li {
    font-size: .8rem;
    font-weight: normal;
    /* 中見出し以降リストノーマル */
}

.entry-content .table-of-contents ul li:before {
    content: '\f006';
    font-family: "blogicon";
    font-size: .8rem;
    top: 0;
    color: darkgray;
}

@media (min-width: 992px) {
    .entry-content .table-of-contents {
        font-size: 1.2rem;
        width: 80%;
    }
    .entry-content .table-of-contents ul li {
        font-size: .9rem;
    }
    .entry-content .table-of-contents:before {
        font-size: 1.5rem;
        width: 20vw;
    }
}

/*--- 続きを読むデザイン ---*/
.entry-see-more {
    display: block;
    max-width: calc(100% - 1.8em);
    margin: 1rem auto;
    padding: .2rem 0;
    text-align: center;
    /* text位置 */
    background: #A8C5E1;
    /* 続きを読むの背景色 */
    color: #fff;
    border-radius: 30px;
    /*角の丸さ*/
    text-decoration: none;
    /*下線消す*/
    /*--- ここからふんわりボタン風css ---*/
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
    opacity: 0.8;
    /*続きを読むのicon表示*/
}

.entry-see-more:hover {
    opacity: 1;
    color: #454545;
    -webkit-box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2);
            box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2);
}

.entry-see-more:after {
    content: '\f710';
    /*…のicon*/
    font-family: "blogicon";
    font-size: 1.2rem;
    position: relative;
    /* 位置調整 */
    top: .2rem;
    /* 位置調整 */
    margin-left: 5px;
    /* 余白指定 */
}

/* 記事下 */
.entry-footer .social-buttons {
    margin: 1em 0;
    padding: 1em 0;
    text-align: center;
}

/*名前(id:-)-日前のところ*/
.entry-footer-section {
    text-align: right;
    color: #A8C5E1;
    font-size: .8rem;
}

.entry-footer-section a {
    color: #A8C5E1;
}

.entry-footer-section .user-name-nickname:before {
    content: '\f016';
    /*人間のicon*/
    font-family: "blogicon";
    padding-right: .2rem;
}

.entry-footer-section .updated:before {
    display: inline-block;
    content: '\f043';
    /*時計のicon*/
    font-family: "blogicon";
    padding-right: .1rem;
}

@media (min-width: 992px) {
    .entry-footer-section {
        font-size: 1rem;
    }
}

/* コメント */
.comment-box {
    margin: 1em 0;
}

.comment-box .comment {
    list-style: none;
    margin: 0 0 15px 0;
    padding: 0;
    line-height: 1.7;
    font-size: .85rem;
}

@media (min-width: 768px) {
    .comment-box .comment {
        font-size: .9rem;
    }
}

.comment-box .entry-comment {
    padding: 10px 0 10px 60px;
    border-bottom: 1px solid #AAAEBD;
    position: relative;
}

.comment-box .entry-comment:first-child {
    border-top: 1px solid #AAAEBD;
}

.comment-box .read-more-comments {
    padding: 10px 0;
}

.comment-box .hatena-id-icon {
    position: absolute;
    top: 10px;
    left: 0;
    width: 50px !important;
    height: 50px !important;
    border-radius: 3px;
}

.comment-user-name {
    margin: 0 0 .4em 0;
    font-weight: bold;
}

.comment-content {
    margin: 0 0 .4em 0;
    word-wrap: break-word;
    color: #454545;
    font-size: .85rem;
}

.comment-content p {
    margin: 0 0 .6em 0;
}

.comment-metadata {
    color: #A8C5E1;
    margin: 0;
    font-size: .8rem;
}

.comment-metadata time:before {
    content: '\f043';
    /*時計のicon*/
    font-family: "blogicon";
    padding-right: .1rem;
}

.comment-metadata a {
    color: #A8C5E1;
}

/*コメントを書くボタン風デザイン（続きを読むと同じデザイン）*/
.leave-comment-title {
    padding: .6em 1em;
    font-size: .8rem;
    border: none;
    background: #F0F0F0;
    border-radius: 10px;
    display: inline-block;
    -webkit-transition: all, 0.2s;
    transition: all, 0.2s;
    /*変化にかかる時間*/
}

.leave-comment-title:after {
    content: '\f024';
    /*ペンicon*/
    font-family: "blogicon";
    font-size: .8rem;
}

.leave-comment-title:hover {
    background: #e3e3e3;
}

/* Pager */
.pager {
    display: block;
    margin: 1rem 0;
    padding: 1rem .6rem .8rem .6rem;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    font-size: .9rem;
    background: #fff;
}

.pager a {
    text-decoration: none;
}

.pager a:hover {
    text-decoration: underline;
}

@media (min-width: 768px) {
    .pager {
        font-size: 1rem;
        border-radius: 50px;
    }
}

@media (min-width: 992px) {
    .pager {
        font-size: 1rem;
        border-radius: 50px;
    }
}

.pager > span {
    width: 50%;
    max-width: 100%;
    /*スマホ用*/
}

@media (max-width: 480px) {
    .pager > span {
        width: 200px;
    }
}

.pager-prev {
    float: left;
}

.pager-next {
    float: right;
}

.pager:after {
    display: block;
    clear: both;
    content: " ";
    visibility: hidden;
}

.pager-next, .pager-next a {
    text-align: right;
}

.pager a {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    /*隠れた要素を…で表す*/
    max-width: 90%;
    -webkit-white-space: nowrap;
    -moz-white-space: nowrap;
    -ms-white-space: nowrap;
    -o-white-space: nowrap;
    white-space: nowrap;
}

/*元々の矢印を消す*/
.pager .pager-arrow {
    display: none;
}

/*iconで矢印を出す*/
.pager-prev:before, .pager-next:after {
    content: '\f005';
    /*<のicon*/
    font-family: "blogicon";
    position: relative;
    vertical-align: baseline;
    display: inline-block;
    font-size: .8rem;
    top: -.4rem;
}

@media (min-width: 992px) {
    .pager-prev:before, .pager-next:after {
        font-size: .9rem;
    }
}

.pager-next:after {
    -webkit-transform: scale(-1, 1);
            transform: scale(-1, 1);
    /*180度回転*/
}

/*==================
 サイドバーモジュール 
 ===================*/
.hatena-module {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    margin: 2rem auto;
    font-size: .85rem;
    width: 98%;
}

@media (min-width: 768px) {
    .hatena-module {
        font-size: .9rem;
        margin: 1rem;
        width: 100%;
    }
}

@media (min-width: 992px) {
    .hatena-module {
        font-size: .9rem;
        width: 46%;
    }
}

/*--- モジュールタイトル共通部分 ---*/
.hatena-module-title {
    margin: 2rem 0 1rem 0;
    padding: .5rem 0;
    font-size: 1rem;
    font-family: "Fredoka One", "Kosugi Maru", sans-serif;
    font-weight: bold;
    text-align: center;
    background: #ECA393;
    color: #fff;
    height: 2rem;
    border-radius: 30px;
}

@media (min-width: 768px) {
    .hatena-module-title {
        height: 2.2rem;
        margin: 2rem 0;
        font-size: 1.1rem;
    }
}

@media (min-width: 992px) {
    .hatena-module-title {
        height: 2.2rem;
        margin: 2rem 0;
        font-size: 1.1rem;
    }
}

.hatena-module-title a {
    color: #fff;
    text-decoration: none;
}

.hatena-module-title a:hover {
    text-decoration: underline;
}

/*---- 各モジュールのタイトル横icon設定
iosやsafariはposition使うと崩れるので消した ----*/
/*カテゴリー*/
.hatena-module-category .hatena-module-title:before {
    content: '\f022';
    /* フォルダicon */
    font-family: "blogicon";
}

/*注目記事*/
.hatena-module-entries-access-ranking .hatena-module-title:before {
    content: 'military_tech';
    /* トロフィicon */
    font-family: "Material Icons";
}

/*関連記事*/
.hatena-module-related-entries .hatena-module-title:before {
    content: '\f013';
    /* 記事icon */
    font-family: "blogicon";
}

/*最新記事*/
.hatena-module-recent-entries .hatena-module-title:before {
    content: '\f031';
    /* タイマーicon */
    font-family: "blogicon";
}

/*最新記事のもっと見るボタン*/
.urllist-see-more a {
    display: block;
    margin: 0 auto;
    padding: .5rem;
    width: auto;
    text-align: center;
    text-decoration: none;
    background: #A8C5E1;
    color: #fff;
    border-radius: 30px;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
}

.urllist-see-more a:hover {
    font-size: .95rem;
    -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
            box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
}

.urllist-see-more a:after {
    content: '\f710';
    /*…のicon*/
    font-family: "blogicon";
    font-size: 1rem;
    position: relative;
    top: .1rem;
}

/* プロフィール */
.hatena-module-profile .hatena-module-title:before {
    content: '\f016';
    /* プロフィール人間icon */
    font-family: "blogicon";
}

/* 参加グループ */
.hatena-module-circles .hatena-module-title:before {
    content: '\f021';
    /* 参加グループ人間icon */
    font-family: "blogicon";
}

/* 執筆者リスト */
.hatena-module-authors-list .hatena-module-title:before {
    content: '\f00b';
    /* 執筆者リスト人間icon */
    font-family: "blogicon";
}

/* 月別アーカイブ＆カレンダー */
.hatena-module-archive .hatena-module-title:before {
    content: '\f03a';
    /*content: 'date_range'; /* カレンダーicon */
    font-family: "blogicon";
}

/*link*/
.hatena-module-links .hatena-module-title:before {
    font-size: 1rem;
    content: '\f042';
    /*linkicon*/
    font-family: "blogicon";
    display: inline-block;
    /*iconを斜めにする*/
    transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

/*検索*/
.hatena-module-search-box .hatena-module-title:before {
    content: '\f01a';
    /* 検索icon */
    font-family: "blogicon";
}

/*コメント*/
.hatena-module-recent-comments .hatena-module-title:before {
    content: '\f01d';
    /* コメントicon */
    font-family: "blogicon";
    /*icon左右反転*/
    display: inline-block;
    transform: scale(-1, 1);
    -moz-transform: scale(-1, 1);
    -webkit-transform: scale(-1, 1);
}

/*--- モジュールの記事タイトルはみだし部分を…にする設定 ---*/
/* 最新記事 */
.hatena-module-recent-entries .hatena-urllist a {
    width: auto;
    /*横幅指定しないと文字の隠れた部分が…にならないので注意*/
    font-size: .9rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* 注目記事 */
.hatena-module-entries-access-ranking .hatena-urllist a {
    width: auto;
    font-size: .9rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/*関連記事モジュールオリジナルコードなし*/
/*.hatena-module-related-entries{
   ul{
      padding:1em .5em;
        a{
        width: auto;
        font-size: .9rem;
            &:hover{
               background:none;
               text-decoration:underline;
            }
     img{
         border-radius:20px;
         width:5em;
         height:auto;
          }
      }
   }
}*/
/*--- 関連記事開発者向けにオリジナルコードを入れた場合 ---*/
#kanren {
    /*リンクのホバーデザインリセット用*/
    /*記事タイトル部分*/
    /*はみ出た部分を…にする設定*/
    /*カテゴリ部分*/
    /*記事本文部分*/
}

#kanren a:hover {
    background: none;
    border-radius: 0;
    text-decoration: underline;
}

#kanren .kanren-title {
    margin: 0 auto .5rem;
    text-align: center;
    font-size: .9rem;
    border-bottom: 2px dashed #AAAEBD;
    border-radius: 0;
    /*大事！*/
}

#kanren a.kanren-title {
    max-width: 400px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    /*スマホ*/
    /*ipadとか*/
    /*PC*/
}

@media (max-width: 480px) {
    #kanren a.kanren-title {
        font-size: .9rem;
        max-width: 480px;
    }
}

@media (min-width: 768px) {
    #kanren a.kanren-title {
        font-size: 1rem;
        max-width: 700px;
    }
}

@media (min-width: 992px) {
    #kanren a.kanren-title {
        font-size: 1rem;
        max-width: calc(390px - 1rem);
    }
}

#kanren .kanren-tag {
    text-align: center;
    margin: .2rem;
}

#kanren .kanren-tag a {
    display: inline;
    font-size: .7rem;
    background: #f0f0f0;
    border-radius: 5px;
    padding: .2rem;
    -webkit-transition-duration: 0.2s;
            transition-duration: 0.2s;
    /*変化にかかる時間*/
    -webkit-transition-property: all;
    transition-property: all;
    /*ransition効果を適用するCSSプロパティ名*/
}

#kanren .kanren-tag a:before {
    content: '\f04a';
    /*タグicon*/
    font-family: "blogicon";
    margin-left: .2rem;
}

#kanren .kanren-tag a:hover {
    text-decoration: none;
    background: #e3e3e3;
    color: #fff;
}

@media (min-width: 992px) {
    #kanren .kanren-tag a {
        font-size: .8rem;
    }
}

#kanren .kanren-entry {
    text-align: center;
    margin: 1rem .5rem 1rem;
    padding: 0;
    /*画像の設定*/
    /*本文の設定*/
}

#kanren .kanren-entry img {
    border-radius: 10px;
    width: 6em;
    height: 6em;
    margin: auto;
    -webkit-transition: all, 0.2s;
    transition: all, 0.2s;
    /*変化にかかる時間*/
    /*PCでの画像サイズ*/
}

#kanren .kanren-entry img:hover {
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
            box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
    width: 7em;
    height: 7em;
}

@media (min-width: 992px) {
    #kanren .kanren-entry img {
        width: 9em;
        height: 9em;
    }
    #kanren .kanren-entry img:hover {
        -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
                box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
        width: 10em;
        height: 10em;
    }
}

#kanren .kanren-entry .kanren-entry-body {
    font-size: .8rem;
    background: whitesmoke;
}

#kanren .kanren-entry .kanren-entry-body a {
    -webkit-transition: all, 0.2s;
    transition: all, 0.2s;
    /*変化にかかる時間*/
}

#kanren .kanren-entry .kanren-entry-body a:hover {
    text-decoration: none;
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
            box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
}

#kanren .kanren-entry .kanren-entry-body a:first-child, #kanren .kanren-entry .kanren-entry-body a:last-child {
    border-radius: 0;
    /*最初のリンクの上丸み*/
}

/*--- プロフィールモジュール ---*/
.hatena-module-profile .hatena-module-body {
    background: #fff;
    border-radius: 30px;
    /* 丸く */
    padding: 1em;
    /* 中の要素との余白 */
}

.hatena-module-profile .hatena-module-body a {
    text-decoration: none;
}

.hatena-module-profile .hatena-module-body a:hover {
    text-decoration: underline;
}

.hatena-module-profile .hatena-module-body .profile-icon {
    float: left;
    margin: 0 10px 10px 0;
}

.hatena-module-profile .hatena-module-body .id {
    display: block;
    font-weight: bold;
    margin: 0;
}

.hatena-module-profile .hatena-module-body .profile-description p {
    margin: 1.8em .5em;
    /* 本文の上余白調節 */
}

/*--- リンクとカテゴリーのモジュール設定 ---*/
.hatena-module-links ul.hatena-urllist, .hatena-module-category ul.hatena-urllist {
    margin: 0;
    /*タイトルとの距離*/
    padding: 0;
    /*0にしないとリンク背景がずれる*/
}

.hatena-module-links ul.hatena-urllist li:first-child, .hatena-module-category ul.hatena-urllist li:first-child {
    /*最初のリンクの上丸み*/
}

.hatena-module-links ul.hatena-urllist li:first-child a, .hatena-module-category ul.hatena-urllist li:first-child a {
    border-radius: 30px 30px 0 0;
}

.hatena-module-links ul.hatena-urllist li:last-child, .hatena-module-category ul.hatena-urllist li:last-child {
    /*最後のリンクの下丸み*/
}

.hatena-module-links ul.hatena-urllist li:last-child a, .hatena-module-category ul.hatena-urllist li:last-child a {
    border-radius: 0 0 30px 30px;
}

.hatena-module-links ul.hatena-urllist li a, .hatena-module-category ul.hatena-urllist li a {
    display: block;
    /*大事*/
    padding: .3rem 1rem;
    /*文字の距離感*/
    -webkit-transition: all, 0.2s;
    transition: all, 0.2s;
}

.hatena-module-links ul.hatena-urllist li a:hover, .hatena-module-category ul.hatena-urllist li a:hover {
    background: #f0f0f0;
}

/*---注目、関連、最新記事一括指定---*/
.hatena-module-entries-access-ranking, .hatena-module-related-entries, .hatena-module-recent-entries {
    /*画像表示した場合の設定*/
    /*各記事タイトル部分の設定*/
    /*bookmark表示した場合の設定*/
    /*カテゴリ表示した場合の設定*/
    /*本文表示した場合の設定*/
}

.hatena-module-entries-access-ranking ul, .hatena-module-related-entries ul, .hatena-module-recent-entries ul {
    margin: 0;
    padding: 0;
}

.hatena-module-entries-access-ranking ul li, .hatena-module-related-entries ul li, .hatena-module-recent-entries ul li {
    padding-bottom: .3rem;
}

.hatena-module-entries-access-ranking ul li a, .hatena-module-related-entries ul li a, .hatena-module-recent-entries ul li a {
    display: block;
    padding: .3rem 1rem;
}

.hatena-module-entries-access-ranking .entries-access-ranking-image-link, .hatena-module-entries-access-ranking .related-entries-title-image-link, .hatena-module-entries-access-ranking .recent-entries-image-link, .hatena-module-related-entries .entries-access-ranking-image-link, .hatena-module-related-entries .related-entries-title-image-link, .hatena-module-related-entries .recent-entries-image-link, .hatena-module-recent-entries .entries-access-ranking-image-link, .hatena-module-recent-entries .related-entries-title-image-link, .hatena-module-recent-entries .recent-entries-image-link {
    display: block;
    text-align: center;
}

.hatena-module-entries-access-ranking .entries-access-ranking-image-link img, .hatena-module-entries-access-ranking .related-entries-title-image-link img, .hatena-module-entries-access-ranking .recent-entries-image-link img, .hatena-module-related-entries .entries-access-ranking-image-link img, .hatena-module-related-entries .related-entries-title-image-link img, .hatena-module-related-entries .recent-entries-image-link img, .hatena-module-recent-entries .entries-access-ranking-image-link img, .hatena-module-recent-entries .related-entries-title-image-link img, .hatena-module-recent-entries .recent-entries-image-link img {
    margin: 2rem 0 0;
    float: none;
    border-radius: 10px;
    -webkit-transition: all, 0.2s;
    transition: all, 0.2s;
}

.hatena-module-entries-access-ranking .entries-access-ranking-image-link img:hover, .hatena-module-entries-access-ranking .related-entries-title-image-link img:hover, .hatena-module-entries-access-ranking .recent-entries-image-link img:hover, .hatena-module-related-entries .entries-access-ranking-image-link img:hover, .hatena-module-related-entries .related-entries-title-image-link img:hover, .hatena-module-related-entries .recent-entries-image-link img:hover, .hatena-module-recent-entries .entries-access-ranking-image-link img:hover, .hatena-module-recent-entries .related-entries-title-image-link img:hover, .hatena-module-recent-entries .recent-entries-image-link img:hover {
    -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
            box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
}

.hatena-module-entries-access-ranking a.entries-access-ranking-title, .hatena-module-entries-access-ranking a.related-entries-title, .hatena-module-entries-access-ranking a.recent-entries-title, .hatena-module-related-entries a.entries-access-ranking-title, .hatena-module-related-entries a.related-entries-title, .hatena-module-related-entries a.recent-entries-title, .hatena-module-recent-entries a.entries-access-ranking-title, .hatena-module-recent-entries a.related-entries-title, .hatena-module-recent-entries a.recent-entries-title {
    font-weight: normal;
    font-size: .9rem;
    -webkit-transition: all, 0.2s;
    transition: all, 0.2s;
    /*PCモニターでのサイズ*/
    /*@media (max-width: 480px) {
           } */
}

@media (min-width: 992px) {
    .hatena-module-entries-access-ranking a.entries-access-ranking-title, .hatena-module-entries-access-ranking a.related-entries-title, .hatena-module-entries-access-ranking a.recent-entries-title, .hatena-module-related-entries a.entries-access-ranking-title, .hatena-module-related-entries a.related-entries-title, .hatena-module-related-entries a.recent-entries-title, .hatena-module-recent-entries a.entries-access-ranking-title, .hatena-module-recent-entries a.related-entries-title, .hatena-module-recent-entries a.recent-entries-title {
        font-size: .9rem;
    }
}

.hatena-module-entries-access-ranking a.entries-access-ranking-title:hover, .hatena-module-entries-access-ranking a.related-entries-title:hover, .hatena-module-entries-access-ranking a.recent-entries-title:hover, .hatena-module-related-entries a.entries-access-ranking-title:hover, .hatena-module-related-entries a.related-entries-title:hover, .hatena-module-related-entries a.recent-entries-title:hover, .hatena-module-recent-entries a.entries-access-ranking-title:hover, .hatena-module-recent-entries a.related-entries-title:hover, .hatena-module-recent-entries a.recent-entries-title:hover {
    text-decoration: underline;
}

.hatena-module-entries-access-ranking a.bookmark-widget-counter, .hatena-module-related-entries a.bookmark-widget-counter, .hatena-module-recent-entries a.bookmark-widget-counter {
    margin: 0 1rem;
    padding: 0;
}

.hatena-module-entries-access-ranking a.bookmark-widget-counter:hover, .hatena-module-related-entries a.bookmark-widget-counter:hover, .hatena-module-recent-entries a.bookmark-widget-counter:hover {
    background: none;
}

.hatena-module-entries-access-ranking .recent-entries-categories, .hatena-module-entries-access-ranking .related-entries-categories, .hatena-module-entries-access-ranking .entries-access-ranking-categories, .hatena-module-related-entries .recent-entries-categories, .hatena-module-related-entries .related-entries-categories, .hatena-module-related-entries .entries-access-ranking-categories, .hatena-module-recent-entries .recent-entries-categories, .hatena-module-recent-entries .related-entries-categories, .hatena-module-recent-entries .entries-access-ranking-categories {
    display: block;
    text-align: center;
    margin: .2rem;
}

.hatena-module-entries-access-ranking .recent-entries-categories a, .hatena-module-entries-access-ranking .related-entries-categories a, .hatena-module-entries-access-ranking .entries-access-ranking-categories a, .hatena-module-related-entries .recent-entries-categories a, .hatena-module-related-entries .related-entries-categories a, .hatena-module-related-entries .entries-access-ranking-categories a, .hatena-module-recent-entries .recent-entries-categories a, .hatena-module-recent-entries .related-entries-categories a, .hatena-module-recent-entries .entries-access-ranking-categories a {
    display: inline-block;
    padding: 0 .3rem;
    font-size: .8rem;
    background: #f0f0f0;
    border-radius: 10px;
    -webkit-transition: all, 0.2s;
    transition: all, 0.2s;
}

.hatena-module-entries-access-ranking .recent-entries-categories a:hover, .hatena-module-entries-access-ranking .related-entries-categories a:hover, .hatena-module-entries-access-ranking .entries-access-ranking-categories a:hover, .hatena-module-related-entries .recent-entries-categories a:hover, .hatena-module-related-entries .related-entries-categories a:hover, .hatena-module-related-entries .entries-access-ranking-categories a:hover, .hatena-module-recent-entries .recent-entries-categories a:hover, .hatena-module-recent-entries .related-entries-categories a:hover, .hatena-module-recent-entries .entries-access-ranking-categories a:hover {
    background: #e3e3e3;
}

.hatena-module-entries-access-ranking .recent-entries-categories a:before, .hatena-module-entries-access-ranking .related-entries-categories a:before, .hatena-module-entries-access-ranking .entries-access-ranking-categories a:before, .hatena-module-related-entries .recent-entries-categories a:before, .hatena-module-related-entries .related-entries-categories a:before, .hatena-module-related-entries .entries-access-ranking-categories a:before, .hatena-module-recent-entries .recent-entries-categories a:before, .hatena-module-recent-entries .related-entries-categories a:before, .hatena-module-recent-entries .entries-access-ranking-categories a:before {
    content: '\f04a';
    /*タグicon*/
    font-family: "blogicon";
}

.hatena-module-entries-access-ranking .recent-entries-entry-body, .hatena-module-entries-access-ranking .related-entries-entry-body, .hatena-module-entries-access-ranking .entries-access-ranking-entry-body, .hatena-module-related-entries .recent-entries-entry-body, .hatena-module-related-entries .related-entries-entry-body, .hatena-module-related-entries .entries-access-ranking-entry-body, .hatena-module-recent-entries .recent-entries-entry-body, .hatena-module-recent-entries .related-entries-entry-body, .hatena-module-recent-entries .entries-access-ranking-entry-body {
    margin: 1rem;
    color: darkgray;
}

/*--- urllist module 共通部分---*/
.hatena-urllist {
    list-style: none;
    background: #fff;
    border-radius: 30px;
    /*丸の具合*/
}

.hatena-urllist li {
    /*&:first-child {
               a{border-radius:30px 30px 0 0;} /*最初のリンクの上丸み*/
    /* }
        /*&:last-child {
             a{border-radius:0 0 30px 30px;} /*最後のリンクの下丸み*/
    /*}*/
}

.hatena-urllist li a {
    /*display:block;*/
    text-decoration: none;
    /* padding: .4em 1em;*/
    /*transition: all, $defaultTime;
            &:hover {background: $bg-light;}*/
}

.hatena-urllist .urllist-category-link {
    font-size: 1rem;
    padding: 0;
}

.hatena-urllist .urllist-date-link a {
    color: #A8C5E1;
}

.hatena-urllist .urllist-entry-body {
    margin-top: .5em;
}

/*--- 月別アーカイブ ---*/
.hatena-module-archive .hatena-module-body ul.hatena-urllist {
    padding: .5rem 1rem;
    font-size: .9rem;
}

.hatena-module-archive .hatena-module-body ul.hatena-urllist a:hover {
    text-decoration: underline;
}

/*--- 最新コメントモジュールのデザイン ---*/
.hatena-module-recent-comments .hatena-module-body ul.hatena-urllist {
    padding: 1em;
    font-size: 1rem;
    /* 隠れた部分を…にする */
}

.hatena-module-recent-comments .hatena-module-body ul.hatena-urllist .user-id {
    color: #AAAEBD;
    border-bottom: 1px dashed #AAAEBD;
}

.hatena-module-recent-comments .hatena-module-body ul.hatena-urllist .user-id img {
    width: 1.3rem;
    /*icon画像のサイズ*/
    height: auto;
}

.hatena-module-recent-comments .hatena-module-body ul.hatena-urllist a {
    width: auto;
    /*横幅指定しないと文字の隠れた部分が…にならないので注意*/
    font-size: .9rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #A8C5E1;
}

.hatena-module-recent-comments .hatena-module-body ul.hatena-urllist a:hover {
    background: none;
    text-decoration: underline;
}

.hatena-module-recent-comments .hatena-module-body ul.hatena-urllist a:before {
    content: 'L';
    /* コメントの左につく */
    font-weight: bold;
}

/*--- カレンダーモジュール ---*/
.archive-module-calendar {
    background: #fff;
    border-radius: 30px;
    font-family: "Fredoka One", cursive;
    padding: 1em;
}

.archive-module-calendar .calendar-day {
    /* 平日文字色 */
    color: darkgray;
}

.archive-module-calendar .calendar-day a {
    /* カレンダー a */
    font-weight: bold;
    font-size: 1.1rem;
}

.archive-module-calendar .calendar-day .archive-module-calendar-highlight {
    /* 平日投稿あった日(a span)  */
    color: dimgray;
    display: inline-block;
    width: 100%;
    -webkit-transition-duration: 0.2s;
            transition-duration: 0.2s;
    /*変化にかかる時間*/
    -webkit-transition-property: all;
    transition-property: all;
    /*ransition効果を適用するCSSプロパティ名*/
}

.archive-module-calendar .calendar-day .archive-module-calendar-highlight:hover {
    background: dimgray;
    color: #fff;
}

.archive-module-calendar .calendar-day:nth-child(7) {
    /* 土曜日 */
    color: #A8C5E1;
}

.archive-module-calendar .calendar-day:nth-child(7) .archive-module-calendar-highlight {
    /* 土曜日投稿あった日(a span) */
    color: #70aae0;
}

.archive-module-calendar .calendar-day:nth-child(7) .archive-module-calendar-highlight:hover {
    background: #70aae0;
    color: #fff;
}

.archive-module-calendar .calendar-day:first-child {
    /* 日曜日 */
    color: #FAA;
}

.archive-module-calendar .calendar-day:first-child .archive-module-calendar-highlight {
    /* 日曜日投稿あった日(a span) */
    color: #fa6e64;
}

.archive-module-calendar .calendar-day:first-child .archive-module-calendar-highlight:hover {
    background-color: #fa6e64;
    color: #FFF;
}

/* カレンダー上部土日カラー */
.archive-module-calendar .calendar-sunday {
    color: #fa6e64;
}

.archive-module-calendar .calendar-saturday {
    color: #70aae0;
}

/*---参加グループ---*/
.hatena-module-circles .hatena-module-body li {
    padding: .5rem 0;
}

.hatena-module-circles .hatena-module-body .circle-image {
    border-radius: 10px;
    width: 1.5rem;
}

.hatena-module-circles .hatena-module-body a:hover {
    background: none;
    text-decoration: underline;
}

/*---執筆者リスト---*/
.hatena-module-authors-list .hatena-module-body li {
    padding: .5rem 0;
}

.hatena-module-authors-list .hatena-module-body .authors-user-icon {
    border-radius: 10px;
    width: 1.5rem;
}

.hatena-module-authors-list .hatena-module-body .authors-user-name {
    font-size: .9rem;
}

.hatena-module-authors-list .hatena-module-body a:hover {
    background: none;
    text-decoration: underline;
}

/*--- 検索ボックス ---*/
.hatena-module-search-box .search-form {
    margin-top: 2rem;
    padding: .2rem;
    border-radius: 50px;
    background: #fff;
    width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

.hatena-module-search-box .search-module-input {
    -webkit-box-flex: 1;
        -ms-flex: 1 0;
            flex: 1 0;
    padding: 5px;
    color: #454545;
    background: none;
    border: none;
    outline: none;
    height: 20px;
}

.hatena-module-search-box .search-module-button {
    width: 24px;
    height: 24px;
    margin-right: 5px;
    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:none;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3Esearch%3C/title%3E%3Cpath d='M16.7,15l-3.4-3.3h-.1a5.4,5.4,0,0,0,.9-3.1,5.6,5.6,0,1,0-5.6,5.6,5.4,5.4,0,0,0,3.1-.9.1.1,0,0,0,.1.1L15,16.7a1.1,1.1,0,0,0,.8.3,1.6,1.6,0,0,0,.9-.3,1.4,1.4,0,0,0,0-1.7M8.5,12.3A3.8,3.8,0,0,1,4.8,8.5,3.8,3.8,0,0,1,8.5,4.7a3.9,3.9,0,0,1,3.8,3.8,3.8,3.8,0,0,1-3.8,3.8'/%3E%3Crect class='a' width='20' height='20'/%3E%3C/svg%3E") no-repeat center;
    background-size: 20px 20px;
    border: none;
    outline: none;
    color: transparent;
    overflow: hidden;
    opacity: .5;
    cursor: pointer;
}

.hatena-module-search-box .search-module-button:hover {
    opacity: .85;
}

/*--- htmlモジュール ---*/
.hatena-module-html .hatena-module-body {
    background: #fff;
    border-radius: 30px;
    padding: 0 1rem;
    /*見出し（hタグ）の設定共通*/
    /*見出し（hタグ）の記事内と同じ装飾設定*/
    /* 大見出し */
    /* 記事内中見出し（付箋風） */
    /* 記事内小見出し（斜めストライプ下線） */
    /* 吹き出し風見出し用 */
    /*pで囲むと記事内と同じ装飾*/
    /*code記事内と同じ*/
}

.hatena-module-html .hatena-module-body h1, .hatena-module-html .hatena-module-body h2, .hatena-module-html .hatena-module-body h3, .hatena-module-html .hatena-module-body h4, .hatena-module-html .hatena-module-body h5, .hatena-module-html .hatena-module-body h6 {
    font-family: "Fredoka One", "Kosugi Maru";
    margin: .5rem 0;
}

.hatena-module-html .hatena-module-body h1 {
    font-size: 2.1rem;
}

.hatena-module-html .hatena-module-body h2 {
    font-size: 2rem;
}

.hatena-module-html .hatena-module-body h3 {
    font-size: 1.2rem;
    position: relative;
    padding: 0 .8rem;
    background: #ECA393;
    color: #fff;
    border-radius: 15px;
}

@media (min-width: 992px) {
    .hatena-module-html .hatena-module-body h3 {
        font-size: 1.3rem;
    }
}

.hatena-module-html .hatena-module-body h4 {
    font-size: 1.1rem;
    padding-left: 1rem;
    border-left: 8px double #ECA393;
    background: #f7e7c6;
}

@media (min-width: 992px) {
    .hatena-module-html .hatena-module-body h4 {
        font-size: 1.2rem;
    }
}

.hatena-module-html .hatena-module-body h5 {
    font-size: 1rem;
    position: relative;
    padding: .5rem .8rem;
}

.hatena-module-html .hatena-module-body h5:after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 10px;
    content: '';
    background-image: -webkit-repeating-linear-gradient(135deg, #A8C5E1, #A8C5E1 1px, transparent 2px, transparent 5px);
    background-image: repeating-linear-gradient(-45deg, #A8C5E1, #A8C5E1 1px, transparent 2px, transparent 5px);
    background-size: 7px 7px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

@media (min-width: 992px) {
    .hatena-module-html .hatena-module-body h5 {
        font-size: 1.2rem;
    }
}

.hatena-module-html .hatena-module-body h6 {
    font-size: .9rem;
    color: #454545;
    position: relative;
    padding: 0.3rem 1rem;
    border: 3px solid #d8d8d8;
    border-radius: 10px;
    background: #f9f9f9;
}

.hatena-module-html .hatena-module-body h6:before {
    position: absolute;
    bottom: -14px;
    left: 1em;
    width: 0;
    height: 0;
    content: '';
    border-width: 14px 12px 0 12px;
    border-style: solid;
    border-color: #d8d8d8 transparent transparent transparent;
}

.hatena-module-html .hatena-module-body h6:after {
    position: absolute;
    bottom: -10px;
    left: 1em;
    width: 0;
    height: 0;
    content: '';
    border-width: 14px 12px 0 12px;
    border-style: solid;
    border-color: #f9f9f9 transparent transparent transparent;
}

@media (min-width: 992px) {
    .hatena-module-html .hatena-module-body h6 {
        font-size: 1.1rem;
    }
}

.hatena-module-html .hatena-module-body p {
    margin: .3rem;
    padding: 0;
    font-size: .9rem;
    /*太字(色少し濃く)*/
    /*斜体（蛍光ペン風）*/
    /*打ち消し*/
    /*アンダーライン（ボーダー）*/
    /*少し強調(ブルー蛍光ペン)*/
    /*強調（二本線アンダーライン）*/
    /*aタグ*/
}

@media (min-width: 992px) {
    .hatena-module-html .hatena-module-body p {
        font-size: 1rem;
    }
}

.hatena-module-html .hatena-module-body p b {
    color: #333;
}

.hatena-module-html .hatena-module-body p i {
    font-style: normal;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30%, transparent), color-stop(0%, #f7e7c6));
    background: linear-gradient(transparent 30%, #f7e7c6 0%);
}

.hatena-module-html .hatena-module-body p s {
    color: #f0f0f0;
}

.hatena-module-html .hatena-module-body p u {
    text-decoration: none;
    border-bottom: 2px dotted #ECA393;
}

.hatena-module-html .hatena-module-body p em {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30%, transparent), color-stop(0%, #A8C5E1));
    background: linear-gradient(transparent 30%, #A8C5E1 0%);
    font-style: normal;
}

.hatena-module-html .hatena-module-body p strong {
    color: #454545;
    border-bottom: 6px double #FAA;
}

.hatena-module-html .hatena-module-body p a {
    text-decoration: none;
}

.hatena-module-html .hatena-module-body p a:hover {
    text-decoration: underline;
}

.hatena-module-html .hatena-module-body code {
    font-family: "Courier Prime", "Sawarabi Gothic", "Monaco", "Consolas", "Courier New", Courier, monospace, sans-serif;
    font-size: .8rem;
    background: #f0f0f0;
    border-radius: 8px;
    border: none;
    padding: .4rem .3rem;
}

@media (min-width: 992px) {
    .hatena-module-html .hatena-module-body code {
        font-size: .9rem;
    }
}

/*============================
記事下に出る関連記事ボックス全体 
=============================*/
.entry-footer-modules {
    /*1つ1つの関連記事ボックス*/
    /*関連記事の画像の大きさ*/
    /*関連記事のタイトル*/
    /*関連記事の説明*/
    /*関連記事の日付*/
}

.entry-footer-modules ul.related-entries.hatena-urllist.urllist-with-thumbnails {
    margin: 0;
    padding: 0;
    /*ホバーアクションリセット用*/
}

.entry-footer-modules ul.related-entries.hatena-urllist.urllist-with-thumbnails a:hover {
    background: none;
}

.entry-footer-modules li.urllist-item.related-entries-item {
    margin: .5rem auto;
    padding: 0;
    width: 100%;
    display: table;
    /*テーブル化*/
}

@media (max-width: 480px) {
    .entry-footer-modules li.urllist-item.related-entries-item {
        width: 100%;
        margin: auto;
        display: block;
    }
}

.entry-footer-modules img.urllist-image.related-entries-image {
    display: table-cell;
    /*横並び*/
    vertical-align: middle;
    /*真ん中寄せ（お守りがわり）*/
    margin: auto .5rem;
    /*画像と文字の右側の間隔*/
    padding: 0;
    border-radius: 10px;
    /*position: relative;*/
    -webkit-transition: all .2s;
    transition: all .2s;
    opacity: 0.8;
}

.entry-footer-modules img.urllist-image.related-entries-image:hover {
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    opacity: 1;
}

@media (max-width: 480px) {
    .entry-footer-modules img.urllist-image.related-entries-image {
        width: 20%;
        height: 20%;
    }
}

.entry-footer-modules a.urllist-title-link.related-entries-title-link.urllist-title.related-entries-title {
    display: table-cell;
    /*横並び*/
    padding: 0;
    text-decoration: none;
    font-size: .9rem;
    border-radius: 0;
    /*はみ出た部分を…にする設定*/
    max-width: 260px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    /*PCモニターでのサイズ*/
}

.entry-footer-modules a.urllist-title-link.related-entries-title-link.urllist-title.related-entries-title:hover {
    color: #454545;
    border-radius: 0;
    text-decoration: underline;
}

@media (min-width: 992px) {
    .entry-footer-modules a.urllist-title-link.related-entries-title-link.urllist-title.related-entries-title {
        max-width: 670px;
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .entry-footer-modules a.urllist-title-link.related-entries-title-link.urllist-title.related-entries-title {
        min-width: 30%;
    }
}

.entry-footer-modules .urllist-entry-body.related-entries-entry-body {
    margin: 0;
    color: darkgray;
    font-size: .8rem;
    /*PCモニターでのサイズ*/
}

@media (min-width: 992px) {
    .entry-footer-modules .urllist-entry-body.related-entries-entry-body {
        font-size: .9rem;
    }
}

@media (max-width: 480px) {
    .entry-footer-modules .urllist-entry-body.related-entries-entry-body {
        width: 100%;
    }
}

.entry-footer-modules .hatena-urllist .urllist-date-link time {
    margin: 0;
    padding: 0 .5rem;
    display: table-cell;
    background: #A8C5E1;
    color: #fff;
    font-size: .5rem;
    opacity: 0.8;
    border-radius: none;
    -webkit-transition: all .2s;
    transition: all .2s;
}

.entry-footer-modules .hatena-urllist .urllist-date-link time:hover {
    -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
            box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
    opacity: 1;
}

.entry-footer-modules .hatena-urllist .urllist-date-link time:first-child {
    border-radius: none;
    /*最初のリンクの上丸み*/
}

.entry-footer-modules .hatena-urllist .urllist-date-link time:last-child {
    border-radius: none;
    /*最後のリンクの下丸み*/
}

/*==========
 About ページ 
 ===========*/
.page-about .entry-content {
    text-align: center;
}

.page-about .entry-content a {
    font-weight: normal;
    text-decoration: none;
}

.page-about .entry-content a:hover {
    text-decoration: underline;
}

.page-about .entry-content dl {
    margin: auto;
    /*要素中央揃え*/
    border: none;
    /*枠線消す*/
    background: #f0f0f0;
    width: auto;
}

@media (min-width: 992px) {
    .page-about .entry-content dl {
        width: 600px;
    }
}

.page-about .entry-content dt {
    color: #fff;
    background: #ECA393;
    font-weight: bold;
    font-family: "Fredoka One", "Kosugi Maru";
}

.page-about .entry-content dt:before {
    border-width: 0 0 0 0;
    /*吹き出しなくす*/
}

.page-about .entry-content dd {
    text-align: center;
    margin: 0.2em;
    padding: 0.5em;
    border-bottom: none;
    /*下線消す*/
}

.page-about .entry-content dd ul {
    margin: auto;
    padding: 1em;
    display: inline-block;
}

.page-about .entry-content dd ul li:before {
    content: none;
    /*●消す*/
}

/*====================
 カテゴリアーカイブページ
 ===================== */
.archive-header-category {
    margin: 0;
    padding: 0;
}

.archive-header-category h2 {
    display: inline-block;
    position: relative;
}

.archive-header-category h2:after {
    content: none;
}

.archive-header-category h2:before {
    content: '\f022';
    /*フォルダーicon*/
    font-family: "blogicon";
    font-size: 1em;
    position: absolute;
    left: -1.2em;
}

/*==============
アーカイブページ
===============*/
/*アーカイブページ上の2021〜から1年間の記事一覧の文字*/
.archive-heading {
    font-family: "Fredoka One", "Kosugi Maru", sans-serif;
    margin-left: 2em;
    font-size: 1rem;
}

.archive-heading h2 {
    display: inline-block;
    position: relative;
}

.archive-heading:after {
    content: '\f013';
    /* 記事icon */
    font-family: "blogicon";
    position: absolute;
    padding-left: .1rem;
}

@media (min-width: 992px) {
    .archive-heading {
        font-size: 1.5rem;
    }
}

/*アーカイブページの記事一覧*/
.page-archive {
    /*タイトルの設定*/
    /*画像の設定*/
    /*本文の設定*/
}

.page-archive .archive-entry {
    background: #fff;
    margin-bottom: 3em;
    margin-left: auto;
    margin-right: auto;
    padding: 1rem 2rem;
    line-height: 1.5;
    /*スマホ以外は丸い記事*/
}

@media (min-width: 768px) {
    .page-archive .archive-entry {
        border-radius: 30px;
    }
}

@media (min-width: 992px) {
    .page-archive .archive-entry {
        border-radius: 30px;
    }
}

.page-archive .entry-title {
    margin: .3em auto 1em;
    font-size: 1.1rem;
    border-bottom: 2px dashed #AAAEBD;
    width: 100%;
}

@media (min-width: 992px) {
    .page-archive .entry-title {
        font-size: 1.3rem;
    }
}

.page-archive .entry-thumb {
    width: 100%;
    /*スマホ画面で画像目一杯*/
    height: 300px;
    background-size: cover;
    margin-bottom: 1rem;
    -webkit-transition: all, 0.2s;
    transition: all, 0.2s;
    border-radius: 10px;
}

.page-archive .entry-thumb:hover {
    -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.4);
            box-shadow: 0 0 6px rgba(0, 0, 0, 0.4);
}

@media (min-width: 768px) {
    .page-archive .entry-thumb {
        width: 50%;
        /*PC画面で画像と文字半々*/
        height: 300px;
    }
}

.page-archive .entry-description {
    margin: 0;
    font-size: .8rem;
    color: dimgray;
}

@media (min-width: 768px) {
    .page-archive .entry-description {
        font-size: .9rem;
    }
}

.page-archive .social-buttons {
    display: block;
    margin-top: .3em;
}

/*====
 footer
 =====*/
#footer {
    width: 100%;
    margin-top: 2em;
    margin-bottom: 15vw;
    /*ページ下固定メニュー（ul.bottom_menu）分の高さ*/
    padding: 1rem 0;
    text-align: center;
    font-size: .8rem;
    color: #fff;
    background: #A8C5E1;
    /*はてなブログをはじめよう！の文字色*/
}

@media (min-width: 992px) {
    #footer {
        margin-bottom: 0;
        /*スマホ以外では下ぴったりつける*/
    }
}

#footer a {
    font-weight: bold;
    color: #fff;
    text-decoration: none;
}

#footer a:hover {
    text-decoration: underline;
}

#footer p {
    margin: .5em auto;
}

#footer .guest-footer-content h3 {
    color: #fff;
}

/*==============================================
　グローバルメニュー用
================================================*/
.menu {
    /*--- 上にぴったりくっつける ---*/
    position: fixed;
    left: 0;
    top: 0;
    margin: 0;
    padding: 0;
    /*--- ここまで ---*/
    font-size: .9rem;
    width: 100%;
    -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
            box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
    text-align: center;
    /*---重なり順（！はてなブログのグローバルヘッダを消さないように）---*/
    z-index: 50;
}

.menu a {
    text-decoration: none;
    font-family: "Fredoka One", "Kosugi Maru";
}

@media (min-width: 992px) {
    .menu {
        font-size: 1rem;
    }
}

.menu > li {
    float: left;
    /* グローバルナビ5つの場合 */
    width: calc(100% / 5);
    /*--- HatenaBlogの上部バーの縦幅に合わせる(36px) ---*/
    height: 36px;
    line-height: 36px;
    background: #A8C5E1;
    list-style-type: none;
}

.menu > li a {
    display: block;
    color: #fff;
}

.menu > li a:hover {
    color: #454545;
}

ul.menu__second-level {
    visibility: hidden;
    /*box非表示*/
    opacity: 0;
    z-index: 1;
}

.menu > li:hover {
    background: #bbd2e8;
    -webkit-transition: all .2s;
    transition: all .2s;
}

.menu__second-level li {
    /* border-top: 1px solid $text-light; */
    list-style-type: none;
}

.menu__second-level li a:hover {
    /*background: #111;*/
    background: #A8C5E1;
}

/* 下矢印 */
.init-bottom:after {
    content: '';
    display: inline-block;
    width: .5rem;
    height: .5rem;
    margin: 0 0rem .2rem .4rem;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* floatクリア */
.menu:before,
.menu:after {
    content: " ";
    display: table;
}

.menu:after {
    clear: both;
}

.menu {
    *zoom: 1;
}

/*シングルナビ用*/
.menu > li.menu__single {
    position: relative;
}

li.menu__single ul.menu__second-level {
    position: absolute;
    top: 26px;
    /*.menu > li のheight-10pxに設定*/
    width: 100%;
    padding: 0;
    /* 大事！ないとプルダウンのリスト幅が合わない */
    background: #bbd2e8;
    /*--- プルダウンする速度 ---*/
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    -webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);
            box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);
}

li.menu__single:hover ul.menu__second-level {
    top: 36px;
    /*.menu > li のheightと合わせる*/
    visibility: visible;
    opacity: 1;
}

/*スマホの時は上部グローバルメニューは表示しない*/
@media (max-width: 992px) {
    .menu {
        display: none;
    }
}

/*--- PCでのリンク被り回避 ---*/
@media (min-width: 992px) {
    @-webkit-keyframes modify {
        0% {
            padding-top: 50px;
            margin-top: -50px;
        }
        100% {
            padding-top: 0;
            margin-top: 0;
        }
    }
    @keyframes modify {
        0% {
            padding-top: 50px;
            margin-top: -50px;
        }
        100% {
            padding-top: 0;
            margin-top: 0;
        }
    }
    :target {
        -webkit-animation: modify 0.1s;
        animation: modify 0.1s;
    }
}

/*--- リンク被り回避ここまで ---*/
/*==============================
                  ページ下固定メニュー
 ===============================*/
/*ピタっとくっつける設定*/
ul.bottom_menu {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 15vw;
    /*高さ*/
    margin: 0;
    padding: 0;
    background-color: #A8C5E1;
    /*背景色*/
    -webkit-box-shadow: 0 0 10px rgba(127, 154, 178, 0.2);
            box-shadow: 0 0 10px rgba(127, 154, 178, 0.2);
    z-index: 30;
    /*メニュー中身の設定*/
}

ul.bottom_menu li {
    float: left;
    width: 25%;
    background-color: #A8C5E1;
    /*背景色*/
    list-style-type: none;
    text-align: center;
    font-size: 2rem;
    /*アイコンのサイズ*/
    /*アイコン下文字設定*/
}

ul.bottom_menu li span.iconname {
    font-size: .8rem;
    font-family: "Fredoka One", "Kosugi Maru";
}

ul.bottom_menu li a {
    display: block;
    color: #fff;
    /*アイコン＆文字の色*/
    padding: 3vw 0;
    line-height: 4vw;
    text-decoration: none;
}

ul.bottom_menu li a:hover {
    background: #bbd2e8;
}

/*--- 展開メニュー設定 ---*/
ul.bottom_menu-second-level {
    /*文字の縦幅*/
}

ul.bottom_menu-second-level li a {
    pointer-events: auto;
    font-family: "Fredoka One", "Kosugi Maru";
    font-size: 1rem;
    /*展開メニューの文字サイズ*/
    line-height: 6vw;
}

/*タップで表示・非表示*/
.check_input {
    display: none;
}

/*iconの色*/
.check_label {
    display: block;
    color: #fff;
    cursor: pointer;
    line-height: 5vw;
    padding: 2vw 0;
}

.check_label:hover {
    background: #bbd2e8;
}

/* コンテンツ非表示 */
.bottom_menu-second-level {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    -webkit-transition: all 0.8s;
    transition: all 0.8s;
}

/* checkをクリックしたらコンテンツを表示 */
.check_input:checked + .check_label + .bottom_menu-second-level {
    position: absolute;
    bottom: 15vw;
    /*開閉メニューの高さ*/
    left: 0;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    width: 100%;
    padding: 0;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    -webkit-box-shadow: 0 -12px 10px -10px rgba(168, 197, 225, 0.5);
            box-shadow: 0 -12px 10px -10px rgba(168, 197, 225, 0.5);
    height: auto;
    opacity: 1;
}

/*大事。縦並びにする*/
li.menu-width-max ul.bottom_menu-second-level li {
    float: left;
    width: 100%;
    border: none;
}

/*--- PCでは表示しない ---*/
@media (min-width: 992px) {
    .bottom_menu {
        display: none;
    }
}
/* </system> */
/*=================================================================================
	カエレバ・ヨメレバ・トマレバ
=================================================================================*/

.cstmreba {
	width:98%;
	height:auto;
	margin:36px auto;
	font-family:'Lucida Grande','Hiragino Kaku Gothic ProN',Helvetica, Meiryo, sans-serif;
	line-height: 1.5;
	word-wrap: break-word;
	box-sizing: border-box;
	display: block;
}
/* WordPressで自動挿入されるPタグの余白を対処 */
.cstmreba p {
	margin: 0;
	padding: 0;
}
.cstmreba a {
	transition: 0.8s ;
	color:#285EFF; /* テキストリンクカラー */
}
.cstmreba a:hover {
	color:#FFCA28; /* テキストリンクカラー(マウスオーバー時) */
}
.cstmreba .booklink-box,
.cstmreba .kaerebalink-box,
.cstmreba .tomarebalink-box {
	width: 100%;
	background-color: #fafafa; /* 全体の背景カラー */
	overflow: hidden;
	border-radius: 0px;
	box-sizing: border-box;
	padding: 12px 8px;
	box-shadow: 0px 2px 5px 0 rgba(0,0,0,.26);
}
/* サムネイル画像ボックス */
.cstmreba .booklink-image,
.cstmreba .kaerebalink-image,
.cstmreba .tomarebalink-image {
	width:150px;
	float:left;
	margin:0 14px 0 0;
	text-align: center;
	background: #fff;
}
.cstmreba .booklink-image a,
.cstmreba .kaerebalink-image a,
.cstmreba .tomarebalink-image a {
	width:100%;
	display:block;
}
.cstmreba .booklink-image a img,
.cstmreba .kaerebalink-image a img,
.cstmreba .tomarebalink-image a img {
	margin:0 ;
	padding: 0;
	text-align:center;
	background: #fff;
}
.cstmreba .booklink-info,.cstmreba .kaerebalink-info,.cstmreba .tomarebalink-info {
	overflow:hidden;
	line-height:170%;
	color: #333;
}
/* infoボックス内リンク下線非表示 */
.cstmreba .booklink-info a,
.cstmreba .kaerebalink-info a,
.cstmreba .tomarebalink-info a {
	text-decoration: none;
}
/* 作品・商品・ホテル名 リンク */
.cstmreba .booklink-name>a,
.cstmreba .kaerebalink-name>a,
.cstmreba .tomarebalink-name>a {
	border-bottom: 1px solid ;
	font-size:16px;
}
/* powered by */
.cstmreba .booklink-powered-date,
.cstmreba .kaerebalink-powered-date,
.cstmreba .tomarebalink-powered-date {
	font-size:10px;
	line-height:150%;
}
.cstmreba .booklink-powered-date a,
.cstmreba .kaerebalink-powered-date a,
.cstmreba .tomarebalink-powered-date a {
	color:#333;
	border-bottom: none ;
}
.cstmreba .booklink-powered-date a:hover,
.cstmreba .kaerebalink-powered-date a:hover,
.cstmreba .tomarebalink-powered-date a:hover {
	color:#333;
	border-bottom: 1px solid #333 ;
}
/* 著者・住所 */
.cstmreba .booklink-detail,.cstmreba .kaerebalink-detail,.cstmreba .tomarebalink-address {
	font-size:12px;
}
.cstmreba .kaerebalink-link1 div img,.cstmreba .booklink-link2 div img,.cstmreba .tomarebalink-link1 div img {
	display:none !important;
}
.cstmreba .kaerebalink-link1, .cstmreba .booklink-link2,.cstmreba .tomarebalink-link1 {
	display: inline-block;
	width: 100%;
	margin-top: 5px;
}
.cstmreba .booklink-link2>div,
.cstmreba .kaerebalink-link1>div,
.cstmreba .tomarebalink-link1>div {
	float:left;
	width:24%;
	min-width:128px;
	margin:0.5%;
}
/***** ボタンデザインここから ******/
.cstmreba .booklink-link2 a,
.cstmreba .kaerebalink-link1 a,
.cstmreba .tomarebalink-link1 a {
	width: 100%;
	display: inline-block;
	text-align: center;
	box-sizing: border-box;
	margin: 1px 0;
	padding:3% 0.5%;
	border-radius: 8px;
	font-size: 13px;
	font-weight: bold;
	line-height: 180%;
	color: #fff;
	box-shadow: 0px 2px 4px 0 rgba(0,0,0,.26);
}
/* トマレバ */
.cstmreba .tomarebalink-link1 .shoplinkrakuten a {background: #76ae25; border: 2px solid #76ae25; }/* 楽天トラベル */
.cstmreba .tomarebalink-link1 .shoplinkjalan a { background: #ff7a15; border: 2px solid #ff7a15;}/* じゃらん */
.cstmreba .tomarebalink-link1 .shoplinkjtb a { background: #c81528; border: 2px solid #c81528;}/* JTB */
.cstmreba .tomarebalink-link1 .shoplinkknt a { background: #0b499d; border: 2px solid #0b499d;}/* KNT */
.cstmreba .tomarebalink-link1 .shoplinkikyu a { background: #bf9500; border: 2px solid #bf9500;}/* 一休 */
.cstmreba .tomarebalink-link1 .shoplinkrurubu a { background: #000066; border: 2px solid #000066;}/* るるぶ */
.cstmreba .tomarebalink-link1 .shoplinkyahoo a { background: #ff0033; border: 2px solid #ff0033;}/* Yahoo!トラベル */
.cstmreba .tomarebalink-link1 .shoplinkhis a { background: #004bb0; border: 2px solid #004bb0;}/*** HIS ***/
/* カエレバ */
.cstmreba .kaerebalink-link1 .shoplinkyahoo a {background:#ff0033; border:2px solid #ff0033; letter-spacing:normal;} /* Yahoo!ショッピング */
.cstmreba .kaerebalink-link1 .shoplinkbellemaison a { background:#84be24 ; border: 2px solid #84be24;}	/* ベルメゾン */
.cstmreba .kaerebalink-link1 .shoplinkcecile a { background:#8d124b; border: 2px solid #8d124b;} /* セシール */
.cstmreba .kaerebalink-link1 .shoplinkwowma a { background:#ea5404; border: 2px solid #ea5404;} /* Wowma */
.cstmreba .kaerebalink-link1 .shoplinkkakakucom a {background:#314995; border: 2px solid #314995;} /* 価格コム */
/* ヨメレバ */
.cstmreba .booklink-link2 .shoplinkkindle a { background:#007dcd; border: 2px solid #007dcd;} /* Kindle */
.cstmreba .booklink-link2 .shoplinkrakukobo a { background:#bf0000; border: 2px solid #bf0000;} /* 楽天kobo */
.cstmreba .booklink-link2  .shoplinkbk1 a { background:#0085cd; border: 2px solid #0085cd;} /* honto */
.cstmreba .booklink-link2 .shoplinkehon a { background:#2a2c6d; border: 2px solid #2a2c6d;} /* ehon */
.cstmreba .booklink-link2 .shoplinkkino a { background:#003e92; border: 2px solid #003e92;} /* 紀伊國屋書店 */
.cstmreba .booklink-link2 .shoplinkebj a { background:#f8485e; border: 2px solid #f8485e;} /* ebookjapan */
.cstmreba .booklink-link2 .shoplinktoshokan a { background:#333333; border: 2px solid #333333;} /* 図書館 */
/* カエレバ・ヨメレバ共通 */
.cstmreba .kaerebalink-link1 .shoplinkamazon a,
.cstmreba .booklink-link2 .shoplinkamazon a {
	background:#FF9901;
	border: 2px solid #ff9901;
} /* Amazon */
.cstmreba .kaerebalink-link1 .shoplinkrakuten a,
.cstmreba .booklink-link2 .shoplinkrakuten a {
	background: #bf0000;
	border: 2px solid #bf0000;
} /* 楽天 */
.cstmreba .kaerebalink-link1 .shoplinkseven a,
.cstmreba .booklink-link2 .shoplinkseven a {
	background:#225496;
	border: 2px solid #225496;
} /* 7net */
/****** ボタンカラー ここまで *****/

/***** ボタンデザイン　マウスオーバー時ここから *****/
.cstmreba .booklink-link2 a:hover,
.cstmreba .kaerebalink-link1 a:hover,
.cstmreba .tomarebalink-link1 a:hover {
	background: #fff;
}
/* トマレバ */
.cstmreba .tomarebalink-link1 .shoplinkrakuten a:hover { color: #76ae25; }/* 楽天トラベル */
.cstmreba .tomarebalink-link1 .shoplinkjalan a:hover { color: #ff7a15; }/* じゃらん */
.cstmreba .tomarebalink-link1 .shoplinkjtb a:hover { color: #c81528; }/* JTB */
.cstmreba .tomarebalink-link1 .shoplinkknt a:hover { color: #0b499d; }/* KNT */
.cstmreba .tomarebalink-link1 .shoplinkikyu a:hover { color: #bf9500; }/* 一休 */
.cstmreba .tomarebalink-link1 .shoplinkrurubu a:hover { color: #000066; }/* るるぶ */
.cstmreba .tomarebalink-link1 .shoplinkyahoo a:hover { color: #ff0033; }/* Yahoo!トラベル */
.cstmreba .tomarebalink-link1 .shoplinkhis a:hover { color: #004bb0; }/*** HIS ***/
/* カエレバ */
.cstmreba .kaerebalink-link1 .shoplinkyahoo a:hover {color:#ff0033;} /* Yahoo!ショッピング */
.cstmreba .kaerebalink-link1 .shoplinkbellemaison a:hover { color:#84be24 ; }	/* ベルメゾン */
.cstmreba .kaerebalink-link1 .shoplinkcecile a:hover { color:#8d124b; } /* セシール */
.cstmreba .kaerebalink-link1 .shoplinkwowma a:hover { color:#ea5404; } /* Wowma */
.cstmreba .kaerebalink-link1 .shoplinkkakakucom a:hover {color:#314995;} /* 価格コム */
/* ヨメレバ */
.cstmreba .booklink-link2 .shoplinkkindle a:hover { color:#007dcd;} /* Kindle */
.cstmreba .booklink-link2 .shoplinkrakukobo a:hover { color:#bf0000; } /* 楽天kobo */
.cstmreba .booklink-link2 .shoplinkbk1 a:hover { color:#0085cd; } /* honto */
.cstmreba .booklink-link2 .shoplinkehon a:hover { color:#2a2c6d; } /* ehon */
.cstmreba .booklink-link2 .shoplinkkino a:hover { color:#003e92; } /* 紀伊國屋書店 */
.cstmreba .booklink-link2 .shoplinkebj a:hover { color:#f8485e; } /* ebookjapan */
.cstmreba .booklink-link2 .shoplinktoshokan a:hover { color:#333333; } /* 図書館 */
/* カエレバ・ヨメレバ共通 */
.cstmreba .kaerebalink-link1 .shoplinkamazon a:hover,
.cstmreba .booklink-link2 .shoplinkamazon a:hover {
	color:#FF9901; } /* Amazon */
.cstmreba .kaerebalink-link1 .shoplinkrakuten a:hover,
.cstmreba .booklink-link2 .shoplinkrakuten a:hover {
	color: #bf0000; } /* 楽天 */
.cstmreba .kaerebalink-link1 .shoplinkseven a:hover,
.cstmreba .booklink-link2 .shoplinkseven a:hover {
	color:#225496;} /* 7net */
/***** ボタンデザイン　マウスオーバー時ここまで *****/
.cstmreba .booklink-footer {
	clear:both;
}

/*****  解像度768px以下のスタイル *****/
@media screen and (max-width:768px){
	.cstmreba .booklink-image,
	.cstmreba .kaerebalink-image,
	.cstmreba .tomarebalink-image {
		width:100%;
		float:none;
	}
	.cstmreba .booklink-link2>div,
	.cstmreba .kaerebalink-link1>div,
	.cstmreba .tomarebalink-link1>div {
		width: 32.33%;
		margin: 0.5%;
	}
	.cstmreba .booklink-info,
	.cstmreba .kaerebalink-info,
	.cstmreba .tomarebalink-info {
	  text-align:center;
	  padding-bottom: 1px;
	}
}

/*****  解像度480px以下のスタイル *****/
@media screen and (max-width:480px){
	.cstmreba .booklink-link2>div,
	.cstmreba .kaerebalink-link1>div,
	.cstmreba .tomarebalink-link1>div {
		width: 49%;
		margin: 0.5%;
	}
}
/*blog title size*/

#title{

    font-size: 18px;

}
.entry-content blockquote {
    margin: 20px 0;
    padding: 50px;
    border: 1px solid #ddd;
    border-radius: 3px;
    background-color: #fff;
    background-image: url(https://cdn-ak.f.st-hatena.com/images/fotolife/s/simadzu/20190119/20190119130341.png),
    url(https://cdn-ak.f.st-hatena.com/images/fotolife/s/simadzu/20190119/20190119130342.png);
    background-repeat: no-repeat,
    no-repeat;
    background-position: left 10px top 10px,
    right 10px bottom 10px;
}
/* -----引用タグ----- */
.entry-content blockquote {
    position: relative;
    padding: 10px 55px;
    box-sizing: border-box;
    color: #000000;
    background: #B9EDF8;
}
.entry-content blockquote:before{
    display: inline-block;
    position: absolute;
    top: 7px;
    left: 10px;
    font-family: "blogicon";
    content: "\f704";
    color: #39BAE8;
    font-size: 40px;
    line-height: 1;
    font-weight: 900;
}
.entry-content blockquote:after{
    display: inline-block;
    position: absolute;
    bottom: 5px;
    right: 15px;
    tex-align: center;
    font-family: "blogicon";
    content: "\f704";
    transform: rotate( 180deg );
    color: #39BAE8;
    font-size: 40px;
    line-height: 1;
    font-weight: 900;
}
blockquote p {
    position: relative;
    padding: 0;
    margin: 10px 0;
    z-index: 3;
    line-height: 1.7;
}
blockquote cite {
    position: relative;
    z-index: 3;
    display: block;
    text-align: right;
    color: #1F6ED4;
    font-size: 0.9em;
}.shoplinkdocomo a { background: #cc0434; }