body {
    font-family: "Noto Sans Japanese", sans-serif;
    color: #222;
    font-size: 90%;
    line-height: 25px;
    background-color: #fff
    }
a {
    color: #26252e;
    text-decoration: underline
    }
a:hover {
    color: #fc6469;
    text-decoration: underline
    }
img {
    border: none
    }
* {
    margin: 0;
    padding: 0
    }
.clear {
    clear: both
    }
.clear hr {
    display: none
    }
#Header_Container {
    clear: both;
    height: 130px
    }
#header {
    width: 1130px;
    height: 130px;
    margin-right: auto;
    margin-left: auto;
    background-image: url(../images.88ea14900a990598e9ed1780ff76ca25/header_bg.png);
    background-repeat: no-repeat;
    background-position: right center
    }
#logo {
    float: left;
    width: 320px;
    height: 110px;
    padding-left: 170px;
    padding-top: 20px
    }
p.g_menu {
    padding-left: 20px
    }
a.footer {
    color: #fff;
    text-decoration: none;
    text-align: center
    }
a.footer:hover {
    color: #fc6469;
    text-decoration: none
    }
a.rank {
    color: #26252e;
    text-decoration: underline
    }
a.rank:hover {
    color: #fc6469;
    text-decoration: underline
    }
#Container_bg {
    clear: both;
    background-color: #f7f7f7
    }
.container {
    width: 1130px;
    margin-right: auto;
    margin-left: auto
    }
#footer {
    background-color: #2ca35e;
    clear: both;
    height: 100px
    }
#copyright {
    font-size: 100%;
    font-style: normal;
    text-align: center;
    color: #fff;
    line-height: 30px;
    padding-top: 20px
    }
.left_area {
    width: 730px;
    float: left;
    margin-top: 30px
    }
.right_area {
    width: 380px;
    float: right;
    margin-top: 30px
    }
.blog_area {
    width: 730px;
    background-color: #fff;
    border-top: 1px solid #dfdfdf;
    border-left: 1px solid #dfdfdf;
    border-right: 1px solid #dfdfdf;
    margin-bottom: 20px
    }
.ranking_area {
    width: 380px;
    background-color: #fff;
    border-top: 1px solid #dfdfdf;
    border-left: 1px solid #dfdfdf;
    border-right: 1px solid #dfdfdf;
    }
.blog_area_category {
    width: 730px;
    background-color: #fff;
    border-top: 1px solid #dfdfdf;
    border-left: 1px solid #dfdfdf;
    border-right: 1px solid #dfdfdf;
    margin-bottom: 20px
    }
.category_blog {
    width: 690px;
    padding: 20px;
    border-bottom: 1px solid #dfdfdf
    }
.category_blog_detail {
    width: 690px;
    padding: 20px;
    border-bottom: 1px solid #dfdfdf
    }
.category_blog_photo_area {
    width: 285px;
    float: left
    }
.category_blog_title_area {
    width: 385px;
    height: auto;
    float: right
    }
.ranking_photo_area {
    width: 115px;
    float: left
    }
.ranking_title_area {
    width: 205px;
    height: auto;
    float: right
    }
.side_banner_area {
    width: 380px;
    padding: 20px 0
    }
.ttl_area_1 {
    width: 730px;
    height: 50px;
    background-image: url(../images.88ea14900a990598e9ed1780ff76ca25/title_bg_1.jpg);
    background-repeat: no-repeat
    }
.ttl_area_2 {
    width: 730px;
    height: 50px;
    background-color: #b5da55;
    background-image: url(../images.88ea14900a990598e9ed1780ff76ca25/title_bg_2.jpg);
    background-repeat: no-repeat
    }
.ttl_area_3 {
    width: 730px;
    height: 50px;
    background-color: #b5da55;
    background-image: url(../images.88ea14900a990598e9ed1780ff76ca25/title_bg_3.jpg);
    background-repeat: no-repeat
    }
.ttl_area_4 {
    width: 730px;
    height: 50px;
    background-color: #b5da55;
    background-image: url(../images.88ea14900a990598e9ed1780ff76ca25/title_bg_4.jpg);
    background-repeat: no-repeat
    }
.ttl_area_5 {
    width: 730px;
    height: 50px;
    background-color: #b5da55;
    background-image: url(../images.88ea14900a990598e9ed1780ff76ca25/title_bg_5.jpg);
    background-repeat: no-repeat
    }
.ttl_area_6 {
    width: 730px;
    height: 50px;
    background-color: #b5da55;
    background-image: url(../images.88ea14900a990598e9ed1780ff76ca25/title_bg_6.jpg);
    background-repeat: no-repeat
    }
.ttl_area_7 {
    width: 730px;
    height: 50px;
    background-color: #b5da55;
    background-image: url(../images.88ea14900a990598e9ed1780ff76ca25/title_bg_7.jpg);
    background-repeat: no-repeat
    }
.ttl_area_8 {
    width: 380px;
    height: 50px;
    background-color: #6fa3ac;
    background-image: url(../images.88ea14900a990598e9ed1780ff76ca25/title_bg_8.jpg);
    background-repeat: no-repeat
    }
.ttl_area_9 {
    width: 730px;
    height: 50px;
    background-color: #ededed
    }
p.ttl {
    font-weight: bold;
    font-size: 150%;
    padding-left: 70px;
    line-height: 50px;
    color: #26252e
    }
p.ttl_rank {
    font-weight: bold;
    font-size: 150%;
    text-align: center;
    line-height: 50px;
    color: #fff
    }
p.blog_detail_ttl {
    display: table-cell;
    font-weight: bold;
    font-size: 150%;
    padding-left: 10px;
    height: 50px;
    vertical-align: middle;
    color: #26252e
    }
p.gp_txt {
    font-weight: bold;
    font-size: 150%
    }
.blog_block {
    width: 325px;
    height: 400px;
    float: left;
    padding: 20px;
    border-bottom: 1px solid #dfdfdf
    }
.blog_area_l {
    width: 325px;
    float: left;
    padding: 20px
    }
.blog_area_r {
    width: 325px;
    float: right;
    padding: 20px
    }
.blog_area_rank {
    width: 340px;
    padding: 20px;
    border-bottom: 1px solid #dfdfdf
    }
img.top {
    width: 100%;
    height: auto;
    margin-bottom: 10px
    }
p.blog_ttl_top {
    color: #26252e;
    font-size: 110%
    }
p.update {
    font-size: 90%
    }
p.read {
    font-size: 100%;
    color: #2e2e2e;
    }
.read {
    font-size: 100%;
    color: #2e2e2e;
    height:auto !important;
    }
img.rank {
    width: 100%
    }
p.blog_ttl_rank {
    font-weight: bold;
    color: #26252e;
    font-size: 90%
    }
hr.line {
    border: none;
    border-bottom: 1px solid #dfdfdf;
    height: 1px;
    margin-top: 20px;
    margin-bottom: 20px
    }
.button_area {
    width: 150px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 30px
    }
.button {
    display: inline-block;
    width: 150px;
    height: 30px;
    text-align: center;
    text-decoration: none;
    line-height: 30px;
    outline: none
    }
.button::before, .button::after {
    position: absolute;
    z-index: -1;
    display: block;
    content: ""
    }
.button, .button::before, .button::after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 0.3s;
    transition: all 0.3s
    }
.button {
    background-color: #fc6469;
    color: #fff
    }
.button:hover {
    background-color: #5a616b;
    color: #fff;
    text-decoration: none
    }
.table_1 {
    width: 100%;
    border-collapse: collapse
    }
.table_1 td {
    padding: 5px;
    width: 30%;
    text-align: left;
    vertical-align: top;
    color: #000;
    background-color: #e3e3e3;
    border: 1px solid #b9b9b9
    }
.table_1 th {
    padding: 5px;
    width: 70%;
    text-align: left;
    background-color: #fff;
    border: 1px solid #b9b9b9;
    font-weight: normal
    }
h1 {
    font-size: 130%;
    border-left: 5px solid #26252e;
    padding-left: 10px;
    margin: 20px 0
    }
#menu-box {
    background-color: #2ca35e
    }
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden
    }
.clearfix {
    min-height: 1px
    }
* html .clearfix {
    height: 1px;
    /*\*/
    /*/
      height: auto;
      overflow: hidden;
      /**/
    }
.sp {
    display: none
    }
.sns_area {
    width: 690px;
    margin-top: 10px;
    margin-bottom: 10px
    }
.facebook_detail {
    float: left
    }
.twitter_detail {
    float: left;
    padding-right: 10px
    }
.hatena_detail {
    float: left;
    padding-right: 10px
    }
.about_photo {
    width: 690px;
    float: left;
    margin-bottom: 20px
    }
#canvas_wrapper {
    max-width: 100%;
    min-width: 280px;
    padding: 4px;
    border: 1px solid #CCC;
    margin: auto
    }
#canvas_wrapper img {
    max-width: none
    }
#map-canvas {
    height: 500px;
    width: 100%
    }
@media only screen and (max-width: 736px) {
    #header {
        width: 100%;
        background-image: none;
        height: auto
        }
    #logo {
        float: none;
        width: 100%;
        height: 100%;
        padding-left: 0;
        text-align: center
        }
    #logo img {
        width: 320px;
        max-width: 320px;
        height: 110px
        }
    #Container_bg {
        width: 100%
        }
    .container {
        width: 95%;
        margin-right: auto;
        margin-left: auto
        }
    .left_area {
        width: 100%;
        float: none
        }
    .right_area {
        width: 100%;
        float: none
        }
    .blog_area {
        width: 100%
        }
    .ranking_area {
        width: 100%
        }
    .ttl_area_1 {
        width: 100%;
        height: 50px;
        background-image: none;
        background-color: #ededed
        }
    .ttl_area_2 {
        width: 100%;
        height: 50px;
        background-image: none;
        background-color: #ededed
        }
    .ttl_area_3 {
        width: 100%;
        height: 50px;
        background-image: none;
        background-color: #ededed
        }
    .ttl_area_4 {
        width: 100%;
        height: 50px;
        background-image: none;
        background-color: #ededed
        }
    .ttl_area_5 {
        width: 100%;
        height: 50px;
        background-image: none;
        background-color: #ededed
        }
    .ttl_area_6 {
        width: 100%;
        height: 50px;
        background-image: none;
        background-color: #ededed
        }
    .ttl_area_7 {
        width: 100%;
        height: 50px;
        background-image: none;
        background-color: #ededed
        }
    .ttl_area_8 {
        width: 100%;
        height: 50px;
        background-image: none;
        background-color: #5499e4
        }
    .ttl_area_9 {
        width: 100%;
        height: auto;
        background-image: none;
        background-color: #ededed;
        }
    p.ttl {
        padding-left: 10px
        }
    .blog_block {
        width: 92%;
        height: auto;
        float: none;
        padding: 4%
        }
    .blog_area_rank {
        width: 92%;
        padding: 4%
        }
    .ranking_photo_area {
        width: 35%
        }
    .ranking_title_area {
        width: 60%
        }
    .side_banner_area {
        width: 100%
        }
    .side_banner_area img {
        width: 100%;
        max-width: 100%;
        height: auto
        }
    #footer {
        height: auto
        }
    #copyright {
        font-size: 96%;
        font-style: normal;
        text-align: left;
        color: #fff;
        padding-top: 20px;
        padding: 5% 4%
        }
    .sp {
        display: inherit
        }
    .copyright {
        font-size: 90%;
        text-align: center
        }
    .blog_area_category {
        width: 100%
        }
    .category_blog {
        width: 100%;
        padding: 0
        }
    .category_blog_detail {
        width: 92%;
        padding: 4%
        }
    .category_blog_photo_area {
        width: 92%;
        float: none;
        padding: 4%
        }
    .category_blog_photo_area img {
        width: 100%;
        max-width: 100%;
        height: auto
        }
    .category_blog_title_area {
        width: 92%;
        height: auto;
        float: none;
        padding: 0 4% 4%
        }
    .sns_area {
        display: block;
        width: 100%;
        margin: 20px 0
        }
    .about_photo {
        width: 100%;
        float: none
        }
    .about_photo img {
        width: 100%;
        max-width: 100%;
        height: auto
        }
    #map-canvas {
        height: 300px
        }
    }
/*ここからタブレット用（481px～800px）環境の設定
---------------------------------------------------------------------------*/
/*表示を切り替えるウィンドウサイズの指定*/
@media all and (min-width: 768px) and (max-width: 1130px) {
    #Container_bg {
        width: 100%;
        min-width: 1130px
        }
    #footer {
        width: 100%;
        min-width: 1130px
        }
    #menu-box {
        width: 100%;
        min-width: 1130px
        }
    }
