body {
    background-color: #e0b98d;
}

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


    .hm_wrap {
        display: none;
    }

    #pc {
        display: none;
    }



    #menu {
        position: absolute;
        top: 0;
        left: 0px;
        right: 10px;
        width: 400px;
        height: 100%;
        text-align: center;
    }

    #main {
        position: absolute;
        top: 0;
        right: 0;
        left: 400px;
        height: 100%;
        border-left: 1px solid #ccc;
    }

    iframe {
        border: none;
        height: 100%;
        width: 100%;
    }

    body {
        font-Family: "Noto Sans JP", メイリオ, 游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
        font-size: 16px;
    }

    a {
        text-decoration: none;
    }

    a:link {
        color: #0000ff;
    }

    a:visited {
        color: #800080;
    }

    a:hover {
        color: #ff4500;
    }

    a.special {
        text-decoration: none;
    }

    a.special:link {
        color: #ffffff;
    }

    a.special:visited {
        color: #ffffff;
    }

    a.special:hover {
        color: #ff9966;
    }

    /*ページタイトル調整*/
    .title {
        font-size: 24px;
        font-weight: bold;
        margin: 0px 0px;
    }

    /*見出しh2調整*/
    h2 {
        font-size: 16px;
        font-weight: bold;
        margin: 0px 0px;
    }

    /*ページタイトルと文章行間調整*/
    p.chapter {
        margin: 0px 0px;
    }

    .fsize {
        font-size: 18px;
    }

    .click {
        color: #0369eb;
    }

    .syosai {
        font-size: 13px;
    }

    .khaki {
        font-size: 24px;
        color: #666600;
    }

    .brown {
        font-size: 18px;
        color: #666600;
    }

    .back {
        font-size: 18px;
        color: "#006633";
    }

    .source {
        font-size: 15px;
    }

    .subtitle {
        font-size: 16px;
    }

    .number {
        color: "#7f2910";
    }

    .yellowmoney {
        color: #ffff00;
    }

    .bluemoney {
        color: #6666ff;
    }

    .redmoney {
        color: #ff0000;
    }

    .orangemoney {
        color: #ff8000;
    }

    #hold {
        width: 100px;
        height: 29px;
        margin-top: 3px;
        padding: 2px;
        color: #ffffff;
        text-decoration: none;
        font-weight: bold;
        line-height: 1.5;
        background-color: #003300;
        border: solid 1px #ffffff;
        display: block;
    }

    /*解説文行間調整*/
    p.text {
        margin: 0px 0px;
        padding: 0px 0px;
    }

    /*---------------------------------
  20.htmlの詩のための行分割
---------------------------------*/
    div.layout {
        display: flex;
        width: 50%;
    }

    div.right {
        padding-left: 10px;
        border-left: dashed 1px #000000;
        display: inline-block;
        width: auto;
    }

    div.left {
        display: inline-block;
        width: auto;
        float: right;
    }

    /*---------------------------------
  25.htmlの詩のための行分割
---------------------------------*/
    div.layout2 {
        display: flex;
        width: 98%;
    }

    div.right2 {
        padding: 5px;
        border-style: double double double dashed;
        border-width: 3px 3px 3px 1px;
        border-color: #797676;
        display: inline-block;
        width: 65%;
    }

    div.left2 {
        padding: 5px;
        border-width: 3px 0px 3px 3px;
        border-color: #797676;
        border-style: double;
        display: inline-block;
        width: 35%;
        float: right;
    }

    /*---------------------------------
  40.htmlの詩のための行分割
---------------------------------*/
    div.layout40 {
        display: flex;
        width: 70%;
    }

    div.right40 {
        padding: 5px;
        border-style: double double double dashed;
        border-width: 3px 3px 3px 1px;
        border-color: #797676;
        display: inline-block;
        width: 50%;
    }

    div.left40 {
        padding: 5px;
        border-width: 3px 0px 3px 3px;
        border-color: #797676;
        border-style: double;
        display: inline-block;
        width: 50%;
        float: right;
    }

    div.clear {
        width: 68.9%;
        padding: 5px;
        border-width: 0px 3px 3px 3px;
        border-color: #797676;
        border-style: double;
        display: inline-block;
        clear: both;
    }

    /*---------------------------------
  42.htmlの詩のための行分割
---------------------------------*/
    div.layout42 {
        display: flex;
        width: 80%;
    }

    div.right42 {
        padding: 5px;
        border-style: double double double dashed;
        border-width: 3px 3px 3px 1px;
        border-color: #797676;
        display: inline-block;
        width: auto;
    }

    div.left42 {
        padding: 5px;
        border-width: 3px 0px 3px 3px;
        border-color: #797676;
        border-style: double;
        display: inline-block;
        width: auto;
        float: right;
    }

    /*---------------------------------
  43.html画像の回り込み調整
---------------------------------*/
    img.place {
        /*画像を左に配置*/
        float: left;
        margin-right: 1em;
        margin-bottom: 5em;

    }

    .clear {
        clear: both;
    }

    /*---------------------------------
  boda14.html画像配置
---------------------------------*/
    figure.gazo {
        float: left;
        /* 左に寄せて後続を右に回り込ませる */
        margin: 0px 12px 7px 0px;
        /* 外側に余白を加える(右に7px・下に7px) */

    }

    figure img {
        display: block;
        /* 余計な余白が出ないようにする */
        margin: 0px 0px 3px 0px;
        /* 下側にだけ3pxの余白を追加 */
    }

    div.gazo-box:after {
        content: "";
        /* ※Clearfix */
        clear: both;
        display: block;

    }
}