@charset "utf-8";

/* /////////////////////////////////////////////////////////////////
01.アイキャッチ
02.左サイドカテゴリー
03.メインコンテンツ一覧
04.右サイドエリア
05.スマホ用バナー
06.記事最下部バナー
07.記事下部アドセンス
08.記事イントロダクション
09.記事の内容
10.記事下部
11.メインビジュアルスライダー
12.記事直下関連するまとめ
13.ページネーション
14.ランキング一覧
15.キーワード一覧
/////////////////////////////////////////////////////////////////*/

/* /////////////////////////////////////////////////////////////////
01.アイキャッチ
/////////////////////////////////////////////////////////////////*/

#mainvisual {
    max-width: 100%;
    margin: 0 auto 20px;
    padding: 15px 0 0;
    box-sizing: border-box;
}
.eyecatch {
    background: #fff;
    box-sizing: border-box;
}
.eyecatch_contents {
    margin: 0 5px;
    cursor: pointer;
    transition: all .2s;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    -ms-transition: all .2s;
    position: relative;
}
.eyecatch_contents:hover {
    opacity: .75;
}
.eyecatch_caption {
    position: relative;
}
.eyecatch_title {
    font-size: 15px;
    padding: 8px 0 0px;
    line-height: 1.4;
}
.eyecatch_text {
    color: #999;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    letter-spacing: -0.04em;
}
.eyecatch_date {
    color: #333;
    font-size: 12px;
    padding: 0px 4px 0 0;
    letter-spacing: 0em;
}
.eyecatch_banner {
    width: 100%;
    max-width: 360px;
    float: right;
    box-sizing: border-box;
    text-align: center;
}
.eyecatch_banner a {
    display: block;
    margin: 0 0 0 2%;
}
.eyecatch_banner:nth-child(1) {
    margin: 0 0 3% 0;
}
.eyecatch_contents .label_new {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10;
    overflow: hidden;
    width: 200px;
    height: 200px;
}
.eyecatch_contents .label_new .ribbon {
    font-size: 12px;
    font-weight: bold;
    line-height: 4.6;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 100%;
    height: 40px;
    display: block;
    background: #0BCCD3;
    position: absolute;
    left: 88px;
    top: -8px;
}
@media screen and (max-width: 768px) {
    #mainvisual .container {
        padding: 0 8px;
        width: 100%;
        margin: 20px 0 0 0;
    }
    .eyecatch_banner {
        display: none;
    }
}
@media screen and (max-width: 480px) {
    #mainvisual {
        border-top: none;
        border-bottom: none;
        padding: 0;
        margin: 5px 0 20px 0;
    }
    #mainvisual .container {
        padding: 0;
        width: 100%;
        margin: 0;
    }
	
	.main_top .main_contents { padding:0px 0 0 0 !important;}
	
    .eyecatch {
        border: none;
        padding: 0;
    }
	
	eyecatch_contents {
		 position: relative;
	}
	
    .eyecatch_contents img{
 width: 100%;
		
	}
    .eyecatch_caption {

   position: absolute;
  top: 40%;
  left: 0;
    }
	

    .eyecatch_title {
        font-size: 15px;
        font-weight: bold;
        padding: 0 10px;
        color: #fff;
        text-shadow: 0px 1px 4px #777;
        line-height: 1.4;
        letter-spacing: 0.02em;
    }
    .eyecatch_text {
        display: none;
    }
    .eyecatch_date {
        text-align: left;
        font-size: 11px;
        padding: 2px 0 4px 10px;
        color: #ededed;
        text-shadow: 0px 1px 2px #777;
    }
    .eyecatch_contents .label_new {
        position: absolute;
        right: 0;
        top: 0;
    }
    .eyecatch .col-xs-6 {
        width: 100%;
        float: none;
    }
}
/* /////////////////////////////////////////////////////////////////
02.左サイドカテゴリー
/////////////////////////////////////////////////////////////////*/

.side_left_fixed {
    width: 190px;
}
.side_category {
    padding: 0 20px 0 0;
    width: 100%;
    max-width: 190px;
    position: relative;
    z-index: 1;
}
.side_category_title {} .side_category_list {
    margin: 10px 0;
     padding: 0;
    list-style: none;
}
.side_category_list li {
        padding: 0;
    margin: 0;
    list-style: none;
}
.side_category_list li a {
    display: block;
    padding: 6px 8px;
    margin: 4px 0;
    color: #333;
    font-size: 14px;
    transition: all .2s;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    -ms-transition: all .2s;
}
.side_category_list li a i {
    display: inline-block;
    padding: 0 4px 0 0;
}
@media screen and (max-width: 768px) {
    .side_category {
        display: none;
    }
}
/* /////////////////////////////////////////////////////////////////
03.メインコンテンツ一覧
/////////////////////////////////////////////////////////////////*/

#main_outer {
    margin: 20px 0 0 0;
}
.main_contents {
    padding: 0 20px 0 0;
}
.main_contents_title {
    font-weight: bold;
    border-left: 3px solid #0BCCD3;
    padding: 0 0 0 8px;
    font-size: 18px;
    float: left;
    width: 60%;
}
.main_contents_title span {
    font-weight: normal;
    font-size: 11px;
    color: #0BCCD3;
    display: block;
    padding: 0 0 3px 0;
}
.main_contents_title_description {
    color: #333;
    font-size: 12px;
    display: block;
    padding: 14px 0 0 0;
    float: right;
    width: 40%;
    text-align: right;
}
.main_list {
    margin: 10px 0 20px;
    border-top: 1px dotted #dedede;
        padding: 0;
    margin: 0;
    list-style: none;
}
.main_list li.content_visible:nth-child(1) {
    display: none;
}
.main_list li.content_visible:nth-child(2) {
    display: none;
}
.main_list_contents {
    border-bottom: 1px dotted #dedede;
    padding: 12px 5px 12px;
    cursor: pointer;
    transition: all .2s;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    -ms-transition: all .2s;
}
.main_list_contents:hover {
    opacity: .75;
}
.main_list_left {
    width: 20%;
    max-width: 188px;
    float: left;
    position: relative;
}
.main_list_left .label_new {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10;
    overflow: hidden;
    width: 150px;
    height: 150px;
}
.main_list_left .label_new .ribbon {
    font-size: 10px;
    font-weight: bold;
    line-height: 4.6;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 100%;
    height: 34px;
    display: block;
    background: #0BCCD3;
    position: absolute;
    left: 66px;
    top: -8px;
    letter-spacing: 0em;
}
.main_list_right {
    width: 80%;
    float: right;
    padding: 0 0 0 10px;
}
.main_list_title {
    font-size: 18px;
    line-height: 1.3;
}
.main_list_text {
    color: #333;
    padding: 4px 0 0 0;
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.new_list_text {
    color: #333;
    padding: 4px 0 0 0;
    font-size: 12px;
}
.main_list_date {
    color: #333;
    font-size: 12px;
    padding: 4px 2px 0 0;
    letter-spacing: 0em;
}
@media screen and (max-width: 768px) {
    #main_outer {
        margin: 20px 0 0 0;
    }
    #main_page_outer {
        margin: 76px 0 0 0;
    }
    .main_list_left {
        width: 26%;
        max-width: 188px;
        float: left;
        position: relative;
    }
    .main_list_right {
        width: 74%;
        float: right;
        padding: 0 0 0 6px;
    }
    .main_contents {
        padding: 0 0 0 0;
    }
    .main_contents_title {
        float: none;
        width: 100%;
    }
    .main_contents_title_description {
        font-size: 11px;
        padding: 6px 0 0 0;
        float: none;
        width: 100%;
        text-align: left;
    }
    .main_list_contents {
        padding: 12px 0 12px;
    }
}
@media screen and (max-width: 480px) {
    #main_outer {
        margin: 0 0 0 0;
    }
    #main_page_outer {
        margin: 55px 0 0 0;
    }
    .main_contents {
        padding: 10px 0 0 0;
    }
    .main_contents_title_description {
        display: none;
    }
    .main_list_title {
        font-size: 15px;
        line-height: 1.2;
    }
    .main_list_text {
        display: none;
    }
    .new_list_text {
        display: none;
    }
    .main_list_date {
        font-size: 11px;
    }
}
/* /////////////////////////////////////////////////////////////////
04.右サイドエリア
/////////////////////////////////////////////////////////////////*/

.side_banner {
    margin: 0 0 0 0;
}
.adsense{
    width: 250px;
    height: 250px;
    margin: 0 auto;
}
.side_right_fixed {
    width: 100%;
    max-width: 255px;
    margin: 0 0 20px 0;
}
.side_area {
    margin: 10px 0 20px;
    counter-reset: wpp-ranking;
}
.side_list {
    margin: 10px 0 0;
    border-top: 1px dotted #dedede;
     padding: 0;
    list-style: none;
}
.side_list_contents {
    border-bottom: 1px dotted #dedede;
    padding: 10px 5px 5px;
    cursor: pointer;
    transition: all .2s;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    -ms-transition: all .2s;
}
.side_list_contents:hover {
    opacity: .75;
}
.side_list_left {
    max-width: 26%;
    display: inline-block;
    position: relative;
}
.side_list_left img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 60px;
    margin: 0 10px 0 0;
}
.ranking_label {
    position: absolute;
    top: -6px;
    left: -6px;
    background: #0BCCD3;
    display: block;
    color: #fff;
    z-index: 10;
    font-weight: bold;
    padding: 2px 6px;
    border: 1px solid #fff;
}
/* 一覧の表示スタイル */

.wpp-list li {
    position: relative;
}
/* 順位ラベルを表示 */

.wpp-list li:before {
    content: counter(wpp-ranking, decimal);
    counter-increment: wpp-ranking;
    background: #0BCCD3;
    display: block;
    color: #fff;
    z-index: 10;
    font-weight: bold;
    padding: 2px 6px;
    border: 1px solid #fff;
    position: absolute;
    left: 0;
    top: 2px;
    z-index: 1;
}
.side_list_right {
    max-width: 70%;
    display: inline-block;
    vertical-align: top;
}
.side_list_title {
    line-height: 1.4;
    font-size: 12px;
    visibility: hidden;
}
.side_list_link {
    display: block;
    margin: 10px 0 0;
    padding: 10px 0;
    text-align: center;
    border: 1px solid #dedede;
    transition: all .2s;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    -ms-transition: all .2s;
}
.side_list_link:hover {
    background: #0BCCD3;
    color: #fff;
    border: 1px solid #0BCCD3;
}
.side_list_link i {
    display: inline-block;
    padding: 0 4px 0 0;
}
.side_tag_list {
    margin: 10px 0 0;
}
.side_tag_list li {
    float: left;
}
.side_tag_list li a {
    display: inline-block;
    padding: 4px 8px;
    background: #0BCCD3;
    color: #fff;
    margin: 2px;
    font-size: 11px;
}
.side_tag_list li a i {
    padding: 0 4px 0 0;
}
.side_tag_list a {
    display: block;
    float: left;
    padding: 4px 8px;
    background: #0BCCD3;
    color: #fff;
    margin: 2px;
    font-size: 11px;
}
.side_tag_list a:before {
    font-family: "FontAwesome";
    content: "\f02b";
    padding: 0 4px 0 0;
}
.contents_new {
    display: block;
}
@media screen and (min-width: 961px) {
    .side_right_fixed {
        width: 100%;
        max-width: 230px;
    }
}
@media screen and (min-width: 1020px) {
    .side_right_fixed {
        width: 100%;
        max-width: 255px;
    }
}
@media screen and (max-width: 960px) {
    .side_right_fixed {
        width: 100%;
        max-width: 183px;
    }
}
@media screen and (max-width: 768px) {
    .adsense{
        text-align: center;
        width: 320px;
        height: 320px;
        margin: 0 auto;
        display: block;
    }
    .side_right_fixed {
        width: 100%;
        max-width: 100%;
        position: relative !important;
        top: 0 !important;
        left: 0 !important;
        margin: 0 0 20px 0;
    }
    .side_list_contents {
        padding: 10px 0 5px;
    }
    .side_list_left {
        max-width: 26%;
        display: inline-block;
        position: relative;
    }
    .side_list_left img {
        display: block;
        max-width: 188px;
        margin: 0 10px 0 0;
    }
    .side_list_right {
        max-width: 70%;
        display: inline-block;
        vertical-align: top;
    }
    .side_list_title {
        line-height: 1.2;
        font-size: 18px;
    }
    .side_list_link {
        margin: 14px 0 0;
        padding: 14px 0;
        border: none;
        background: #0BCCD3;
        color: #fff;
        font-weight: bold;
        font-size: 15px;
    }
    .side_list_link:hover {
        border: none;
    }
}
@media screen and (max-width: 768px) {
    .side_banner {
        display: none;
    }
    .contents_new {
        display: none;
    }
    .side_list_title {
        line-height: 1.2;
        font-size: 14px;
        visibility: hidden;
    }
    .side_tag_list a {
        display: block;
        float: left;
        padding: 4px 8px;
        background: #0BCCD3;
        color: #fff;
        margin: 2px;
        font-size: 13px !important;
    }
}
/* /////////////////////////////////////////////////////////////////
05.スマホ用バナー
/////////////////////////////////////////////////////////////////*/

.middle_banner {
    display: none;
}
@media screen and (max-width: 768px) {
    .middle_banner {
        display: block;
        margin: 0 auto 20px;
        max-width: 660px;
    }
    .middle_banner_left {
        float: left;
        width: 49%;
        max-width: 360px;
    }
    .middle_banner_right {
        float: right;
        width: 49%;
        max-width: 360px;
    }
    .middle_banner a {
        display: block;
        margin: 0 auto 10px;
    }
}
@media screen and (max-width: 480px) {
    .middle_banner_left {
        float: none;
        width: 100%;
        max-width: 360px;
        margin: 0 auto;
    }
    .middle_banner_right {
        float: none;
        width: 100%;
        max-width: 360px;
        margin: 0 auto;
    }
}
.mobile_banner {
    display: none;
}
@media screen and (max-width: 768px) {
    .mobile_banner {
        display: block;
        width: 320px;
        margin: 20px auto 20px auto;
        text-align: center;
    }
    .mobile_banner a {
        display: block;
        text-align: center;
        background: #f1f1f1;
        width: 100%;
        max-width: 320px;
        margin: 0 auto 10px;
    }
}
@media screen and (max-width: 480px) {} .sns_area {
    display: none;
}
@media screen and (max-width: 480px) {
    .sns_area {
        display: block;
        margin: 40px 0 10px;
        padding: 20px 10px;
        background: #0BCCD3;
    }
    .sns_area h3 {
        font-size: 20px;
        font-weight: bold;
        text-align: center;
        line-height: 1.4;
        color: #fff;
    }
    .sns_area p {
        padding: 10px 0;
        color: #fff;
    }
    .sns_button_top {
        background: #fff;
        padding: 20px 10px 5px;
        border-top-left-radius: 4px;
        border-top-right-radius: 4px;
        text-align: center;
    }
    .sns_button_top_inner {
        width: 225px;
        margin: 0 auto;
    }
    .sns_button_bottom {
        background: #fff;
        padding: 5px 10px 28px;
        border-bottom-left-radius: 4px;
        border-bottom-right-radius: 4px;
        text-align: center;
    }
    .sns_button_bottom_inner {} .sns_area_button {
        display: inline-block;
        margin: 2px;
        max-height: 20px;
    }
    .twitter_button {
        float: left;
    }
    .facebook_button {
        float: left;
    }
    .line_button {
        display: block;
    }
}
/* /////////////////////////////////////////////////////////////////
06.記事最下部バナー
/////////////////////////////////////////////////////////////////*/

.post_banner {
    display: block;
    margin: 0 auto 30px;
    padding: 20px 20px 0 0;
    max-width: 720px;
}
.post_banner_left {
    float: left;
    width: 49%;
    max-width: 360px;
}
.post_banner_right {
    float: right;
    width: 49%;
    max-width: 360px;
}
.post_banner a {
    display: block;
    margin: 0 auto 10px;
}
@media screen and (max-width: 960px) {
    .post_banner {
        display: block;
        margin: 0 auto 30px;
        padding: 20px 20px 0 0;
        max-width: 720px;
    }
}
@media screen and (max-width: 480px) {
    .post_banner {
        display: block;
        margin: 0 auto 30px;
        padding: 20px 0 0 0;
        max-width: 720px;
    }
    .post_banner_left {
        float: none;
        width: 100%;
        max-width: 360px;
        margin: 0 auto;
    }
    .post_banner_right {
        float: none;
        width: 100%;
        max-width: 360px;
        margin: 0 auto;
    }
}
/* /////////////////////////////////////////////////////////////////
07.記事下部アドセンス
/////////////////////////////////////////////////////////////////*/

.post_adsense {
    display: block;
    margin: 0 auto 40px;
    max-width: 620px;
}
.post_adsense_left {
    float: left;
    width: 49%;
    max-width: 300px;
}
.post_adsense_right {
    float: right;
    width: 49%;
    max-width: 300px;
}
.post_adsense a {
    display: block;
    text-align: center;
}
@media screen and (max-width: 768px) {
    .post_adsense {
        padding: 0 10px;
    }
}
@media screen and (max-width: 480px) {
    .post_adsense_left {
        float: none;
        width: 100%;
        max-width: 320px;
        margin: 0 auto;
        display: block;
        text-align: center;
    }
    .post_adsense_right {
        float: none;
        width: 100%;
        max-width: 320px;
        margin: 0 auto;
        display: block;
        text-align: center;
    }
}
/* /////////////////////////////////////////////////////////////////
08.記事イントロダクション
/////////////////////////////////////////////////////////////////*/

.post_head {
    border-bottom: 1px dotted #dedede;
    padding: 0 0 10px 0;
    margin: 0 0 10px 0;
    position: relative;
}
.post_eyecatch_image {
    width: 100%;
    height: 120px;
    max-width: 120px;
    overflow: hidden;
    border-radius: 50%;
    -moz-border-image: border-radius: 50%;
    -webkit-border-image: border-radius: 50%;
    margin: 0 auto;
    float: left;
    width: 22%;
}
.post_eyecatch_image img {
    position: relative;
    top: 50%;
    left: 50%;
    width: auto;
    height: 100%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.post_introduction {
    margin: 0 0 0 3%;
    float: left;
    width: 80%;
}
.post_sns {
    display: block;
    margin: 10px 0 10px;
    padding: 5px 0;
    text-align: center;
    background: #f9f9f9;
}
.post_sns div {
    display: inline-block;
}

.post_title {
    font-size: 25px;
    line-height: 2.0;
    font-weight: bold;
    letter-spacing: 0.08em;
    margin: 5px 0;
	padding-right: 40px;
padding-left: 40px;
text-align:center;
color:#333;
}

.post_date {
color: #333;
letter-spacing: 0em;
text-align: center;
margin-top: 30px;
margin-bottom: 40px;
}

.post_body img, .post_eyecatch_image2 img {
    display: block;
    margin: 20px 0;
    max-width: 100%;
    height: auto;
}


@media screen and (max-width: 479px) {
	.post_title {
padding-right: 20px;
padding-left: 20px;
	}
}

.post_description {
    color: #999;
}
.post_none {
    padding: 10px 0 10px 5px;
}
@media screen and (max-width: 980px) {
    .post_introduction {
        margin: 0 0 0 3%;
        float: left;
        width: 75%;
    }
}
@media screen and (max-width: 768px) {
    #main_post_outer .container {
        padding-left: 0;
        padding-right: 0;
    }
    #main_post_outer .container .side_area {
        padding-left: 10px;
        padding-right: 10px;
    }
    #main_post_outer .container .post_banner {
        padding-left: 10px;
        padding-right: 10px;
    }
    #main_post_outer .container .post_list {
        padding-left: 10px;
        padding-right: 10px;
    }
    #main_post_outer .container .post_headline01 {
        padding-left: 10px;
        padding-right: 10px;
    }
    .post_eyecatch_image {
        width: 100%;
        height: auto;
        max-width: 100%;
        overflow: hidden;
        border-radius: 0%;
        -moz-border-image: border-radius: 0%;
        -webkit-border-image: border-radius: 0%;
        margin: 0 auto;
        float: none;
    }
    .post_eyecatch_image img {
        position: relative;
        top: 0;
        left: 0;
        width: 100%;
        height: auto;
        -webkit-transform: translate(0%, 0%);
        -ms-transform: translate(0%, 0%);
        transform: translate(0%, 0%);
    }
    .post_introduction {
        margin: 0;
        float: none;
        width: 100%;
        padding: 0 10px;
    }
    .post_title {
        font-size: 18px;
        line-height: 2;
        margin: 5px 0 10px;
    }
    .post_date {
        font-size: 11px;
        margin: 10px 0 0 0;
    }
    .post_description {
        font-size: 12px;
    }
    .post_sns {
        margin: 10px 10px 10px;
    }
}
@media screen and (max-width: 480px) {
    .post_head {
        border-bottom: 1px dotted #dedede;
        padding: 0 0 10px 0;
        margin: 0 0 20px 0;
        position: relative;
    }
    .post_sns {
        margin: 10px 10px 0;
        max-height: 50px;
    }
    .post_title {
        font-size: 18px;
        line-height: 2;
        margin: 5px 0 10px;
        letter-spacing: 0.08em;
    }
}
/* /////////////////////////////////////////////////////////////////
09.記事の内容
/////////////////////////////////////////////////////////////////*/

.post_body {
    margin: 0 0 40px;
    max-width: 745px;
    width: 100%;
}
.headline_large_outer {
    width: 100%;
    margin: 20px 0 0;
}
.headline_large_outer span {
    display: block;
}
.headline_large {
    padding: 10px 0;
    margin: 20px 0 20px;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.3;
    letter-spacing: 0.08em;
}
.headline_large_outer .headline_large {
    overflow: hidden;
    position: relative;
    padding-bottom: 1px;
    padding: 0 0 8px 0;
}
.headline_large_outer .headline_large:before {
    content: "";
    border-bottom: 1px solid #0BCCD3;
    bottom: 0;
    height: 0;
    position: absolute;
    width: 100%;
    z-index: 0;
}
.headline_large_outer .headline_large:after {
    border-bottom: 1px solid #f1f1f1;
    bottom: 0;
    content: "";
    position: absolute;
    width: 100%;
    z-index: 1;
}

@media screen and (min-width: 480px) {
	.post_body p {
    margin: 4px 0;
    line-height: 1.7;
    letter-spacing: 0.12em;
    font-size: 17px;
	font-weight:500;
	text-align: justify;
}
}
@media screen and (max-width: 479px) {
	.post_body p {
    margin: 4px 0;
    line-height: 1.6;
    letter-spacing: 0.12em;
    font-size: 16px;
	line-height: 30px;
	/*text-align: justify;*/
                overflow-wrap: anywhere;
}
}

.post_body img {
    display: block;
    margin: 20px 0;
    max-width: 100%;
    height: auto;
}
@media screen and (max-width: 768px) {
    .post_body {
        margin: 0 0 40px;
        padding: 0 20px;
    }
    .headline_large_outer {
        width: 100%;
        margin: 10px 0 0;
    }
}
.headline_large {
    padding: 10px 0;
    margin: 10px 0 10px;
    font-size: 18px;
    font-weight: bold;
    line-height: 1.3;
    letter-spacing: 0.08em;
}
}
@media screen and (max-width: 480px) {
    .headline_large {
        padding: 10px 0;
        margin: 10px 0 10px;
        font-size: 16px;
        font-weight: bold;
        line-height: 1.1;
        letter-spacing: 0em;
    }
}
/* /////////////////////////////////////////////////////////////////
10.記事下部
/////////////////////////////////////////////////////////////////*/

.post_foot {
    border-top: 1px solid #f1f1f1;
    border-bottom: 1px solid #f1f1f1;
    padding: 30px 0 0;
    margin: 40px 0;
    background: #f9f9f9;
}
.post_sns_headline {
    text-align: center;
    font-size: 15px;
}
.post_sns_headline i {
    display: inline-block;
    padding: 0 4px;
}
.post_foot_sns {
    display: block;
    margin: 10px 0 10px;
    padding: 5px 0;
    text-align: center;
    background: #f9f9f9;
}
.post_foot_sns div {
    display: inline-block;
}
@media screen and (max-width: 768px) {
    .post_foot {
        margin: 40px 10px;
    }
}
@media screen and (max-width: 480px) {}
/* /////////////////////////////////////////////////////////////////
11.メインビジュアルスライダー
/////////////////////////////////////////////////////////////////*/

#mainvisual_slider {
    display: block;
    list-style: none;
    padding: 0;

}
#mainvisual_slider_sp {
    display: none;
}
@media screen and (max-width: 480px) {
    #mainvisual_slider {
        display: none;
    }
    #mainvisual_slider_sp {
        margin: 0 auto;
        position: relative;
        display: block;
            padding: 0;
    }
    .slide {
        display: block;
    }
    .slide_hide {
        display: none;
    }
    /* Slider */
    
    .slick-slider {
        position: relative;
        display: block;
        box-sizing: border-box;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-touch-callout: none;
        -khtml-user-select: none;
        -ms-touch-action: pan-y;
        touch-action: pan-y;
        -webkit-tap-highlight-color: transparent;
    }
    .slick-list {
        position: relative;
        display: block;
        overflow: hidden;
        margin: 0;
        padding: 0;
		max-height:250px;
		width:100%;
		
    }
    .slick-list:focus {
        outline: none;
    }
    .slick-list.dragging {
        cursor: pointer;
        cursor: hand;
    }
    .slick-slider .slick-track, .slick-slider .slick-list {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    .slick-track {
        position: relative;
        top: 0;
        left: 0;
        display: block;
    }
    .slick-track:before, .slick-track:after {
        display: table;
        content: '';
    }
    .slick-track:after {
        clear: both;
    }
    .slick-loading .slick-track {
        visibility: hidden;
    }
    .slick-slide {
        display: none;
        float: left;
        height: 100%;
        min-height: 1px;
    }
    [dir='rtl'] .slick-slide {
        float: right;
    }
    .slick-slide img {
        display: block;
    }
    .slick-slide.slick-loading img {
        display: none;
    }
    .slick-slide.dragging img {
        pointer-events: none;
    }
    .slick-initialized .slick-slide {
        display: block;
    }
    .slick-loading .slick-slide {
        visibility: hidden;
    }
    .slick-vertical .slick-slide {
        display: block;
        height: auto;
        border: 1px solid transparent;
    }
    .slick-arrow.slick-hidden {
        display: none;
    }
    /* Slider */
    
    .slick-loading .slick-list {
        background: #fff url('./ajax-loader.gif') center center no-repeat;
    }
    /* Dots */
    
    .slick-dotted.slick-slider {} .slick-dots {
        position: relative;
        display: block;
        padding: 0;
        margin: 5px 0 0 0;
        list-style: none;
        text-align: center;
    }
    .slick-dots li {
        position: relative;
        display: inline-block;
        width: 10px;
        height: 10px;
        margin: 0 5px;
        padding: 0;
        border-radius: 50%;
        cursor: pointer;
    }
    .slick-dots li button {
        font-size: 0;
        line-height: 0;
        display: block;
        width: 10px;
        height: 10px;
        padding: 5px;
        border-radius: 50%;
        cursor: pointer;
        color: transparent;
        border: 0;
        outline: none;
        background: transparent;
    }
    .slick-dots li button:hover, .slick-dots li button:focus {
        outline: none;
    }
    .slick-dots li button:hover:before, .slick-dots li button:focus:before {
        opacity: 1;
    }
    .slick-dots li button:before {
        position: absolute;
        top: 0;
        left: 0;
        width: 10px;
        height: 10px;
        background: #dedede;
        border-radius: 50%;
        content: '';
        text-align: center;
        color: black;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
    .slick-dots li.slick-active button:before {
        background: #0BCCD3;
    }
    .slick-prev, .slick-next {
        width: 30px;
        transition: .6s;
        -webkit-transition: .6s;
    }
    .slick-prev:hover, .slick-next:hover {
        opacity: .75;
    }
    .slick-prev:before, .slick-next:before {
        content: "";
    }
    button.slick-prev, button.slick-next {
        z-index: 100;
        width: 30px;
        height: 30px;
        background-size: contain;
    }
    .slick-prev {
        left: -15px;
    }
    .slick-next {
        right: -15px;
    }
    .slick-arrow {
        z-index: 100;
    }
}
}
/* /////////////////////////////////////////////////////////////////
12.記事直下関連するまとめ
/////////////////////////////////////////////////////////////////*/

.post_list {
    margin: 10px 0 20px;
    border-top: 1px dotted #dedede;
}
.post_list_contents {
    border-bottom: 1px dotted #dedede;
    padding: 12px 5px 12px;
    cursor: pointer;
    transition: all .2s;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    -ms-transition: all .2s;
}
.post_list_contents:hover {
    opacity: .75;
}
.post_list_left {
    width: 14%;
    float: left;
    position: relative;
}
.post_list_left .label_new {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10;
    overflow: hidden;
    width: 150px;
    height: 150px;
}
.post_list_left .label_new .ribbon {
    font-size: 10px;
    font-weight: bold;
    line-height: 4.6;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 100%;
    height: 34px;
    display: block;
    background: #0BCCD3;
    position: absolute;
    left: 66px;
    top: -8px;
    letter-spacing: 0em;
}
.post_list_right {
    width: 86%;
    float: right;
    padding: 0 0 0 10px;
}
.post_list_title {
    font-size: 18px;
    line-height: 1.3;
}
.post_list_text {
    color: #999;
    padding: 4px 0 0 0;
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.new_list_text {
    color: #999;
    padding: 4px 0 0 0;
    font-size: 12px;
}
.post_list_date {
    color: #999;
    font-size: 12px;
    padding: 2px 2px 0 0;
    letter-spacing: 0em;
}
@media screen and (max-width: 768px) {
    .main_contents {
        padding: 0 0 0 0;
    }
    .main_contents_title {
        float: none;
        width: 100%;
    }
    .main_contents_title_description {
        font-size: 11px;
        padding: 6px 0 0 0;
        float: none;
        width: 100%;
        text-align: left;
    }
    .post_list_contents {
        padding: 12px 0 12px;
    }
}
@media screen and (max-width: 480px) {
    .main_contents {
        padding: 0px 0 0 0;
        /*overflow-x: hidden;*/
    }
    .main_contents_title_description {
        display: none;
    }
    .post_list_left {
        width: 30%;
        float: left;
        position: relative;
    }
    .post_list_right {
        width: 70%;
        float: right;
        padding: 0 0 0 6px;
    }
    .post_list_title {
        font-size: 15px;
        line-height: 1.2;
    }
    .post_list_text {
        display: none;
    }
    .new_list_text {
        display: none;
    }
    .post_list_date {
        font-size: 11px;
    }
}
/* /////////////////////////////////////////////////////////////////
13.ページネーション
/////////////////////////////////////////////////////////////////*/

.pagination {
    list-style-type: none;
    padding-left: 0;
    margin: 20px auto;
    text-align: center;
}
.pagination ul {
    list-style: none;
    padding: 0;
    margin: 0 auto 40px;
    text-align: center;
}
.pagination li {
    counter-increment: pagination;
    list-style: none;
    display: inline-block;
    padding: 0px;
}
.pagination, .pagination li a {} .pagination a {
    border: solid 1px #dedede;
    color: #7d7d7d;
    text-decoration: none;
    text-transform: uppercase;
    display: inline-block;
    text-align: center;
    padding: 0.6rem 0.9rem;
    transition: all .2s;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    -ms-transition: all .2s;
}
.pagination li:not([class*="current"]) a:hover {
    background-color: #0BCCD3;
    border: 1px solid #0BCCD3;
    color: #fff;
}
.pagination li:first-of-type a {
    border-left-width: 1px;
}
.pagination li.first span, .pagination li.last span, .pagination li.previous span, .pagination li.next span {
    /* screen readers only */
    
    position: absolute;
    top: -9999px;
    left: -9999px;
}
.pagination li.first a::before, .pagination li.last a::after, .pagination li.previous a::before, .pagination li.next a::after {
    display: inline-block;
    font-family: Fontawesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transform: translate(0, 0);
}
.pagination li.first a::before {
    content: "\f100";
}
.pagination li.last a::after {
    content: "\f101";
}
.pagination li.previous a::before {
    content: "\f104";
}
.pagination li.next a::after {
    content: "\f105";
}
.pagination li.current a {
    background-color: #0BCCD3;
    cursor: default;
    pointer-events: none;
    border: 1px solid #0BCCD3;
    color: #fff;
}
.pagination > li:first-child > a {
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
}
.pagination > li:last-child > a {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
}
@media only screen and ( max-width: 680px) {
    .pagination li.first, .pagination li.last {
        /* screen readers only */
        
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    .pagination li.previous a {
        border-left-width: 1px;
    }
}
@media only screen and ( max-width: 500px) {
    .pagination li {
        /* screen readers only */
        
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    .pagination li.current, .pagination li.first, .pagination li.last, .pagination li.previous, .pagination li.next {
        position: initial;
        top: initial;
        left: initial;
    }
    .pagination li.previous a {
        border-left-width: 0;
    }
}
@media only screen and ( max-width: 400px) {
    .pagination li.first, .pagination li.last {
        /* screen readers only */
        
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    .pagination li.previous a {
        border-left-width: 1px;
    }
}
@media only screen and ( max-width: 240px) {
    /* For watches? */
    
    .pagination li {
        width: 50%;
    }
    .pagination li.current {
        order: 2;
        width: 100%;
        border-left-width: 1px;
    }
}
.wp-pagenavi {
    clear: both;
    list-style-type: none;
    padding-left: 0;
    margin: 20px auto;
    text-align: center;
}
.wp-pagenavi a {
    border: solid 1px #dedede !important;
    color: #7d7d7d !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
    display: inline-block !important;
    text-align: center !important;
    padding: 0.6rem 0.9rem !important;
    transition: all .2s !important;
    -webkit-transition: all .2s !important;
    -moz-transition: all .2s !important;
    -o-transition: all .2s !important;
    -ms-transition: all .2s !important;
    display: inline-block !important;
}
.wp-pagenavi span {
    border: solid 1px #dedede !important;
    color: #7d7d7d !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
    display: inline-block !important;
    text-align: center !important;
    padding: 0.6rem 0.9rem !important;
    transition: all .2s !important;
    -webkit-transition: all .2s !important;
    -moz-transition: all .2s !important;
    -o-transition: all .2s !important;
    -ms-transition: all .2s !important;
    display: inline-block !important;
}
.wp-pagenavi a:hover, .wp-pagenavi span.current {
    background-color: #f7685c !important;
    border: 1px solid #f7685c !important;
    color: #fff !important;
}
.wp-pagenavi span.current {
    font-weight: bold;
}
/* /////////////////////////////////////////////////////////////////
14.ランキング一覧
/////////////////////////////////////////////////////////////////*/

.ranking_area {
    margin: 0 0 20px;
    counter-reset: wpp-ranking;
}
.ranking_list {} .ranking_list_contents {
    border-bottom: 1px dotted #dedede;
    padding: 10px 5px 5px;
    cursor: pointer;
    transition: all .2s;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    -ms-transition: all .2s;
}
.ranking_list_contents:hover {
    opacity: .75;
}
.ranking_list_left {
    width: 20%;
    max-width: 108px;
    display: inline-block;
    position: relative;
}
.ranking_list_left img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 108px;
    margin: 0 10px 0 0;
}
.ranking_label {
    position: absolute;
    top: -6px;
    left: -6px;
    background: #0BCCD3;
    display: block;
    color: #fff;
    z-index: 10;
    font-weight: bold;
    padding: 2px 6px;
    border: 1px solid #fff;
}
/* 一覧の表示スタイル */

.wpp-list li {
    position: relative;
}
/* 順位ラベルを表示 */

.wpp-list li:before {
    content: counter(wpp-ranking, decimal);
    counter-increment: wpp-ranking;
    background: #0BCCD3;
    display: block;
    color: #fff;
    z-index: 10;
    font-weight: bold;
    padding: 2px 6px;
    border: 1px solid #fff;
    position: absolute;
    left: 0;
    top: 2px;
    z-index: 1;
	line-height:1.0 !important;
}
.ranking_list_right {
    max-width: 78%;
    display: inline-block;
    vertical-align: top;
}
.ranking_list_title {
    font-size: 18px;
    line-height: 1.3;
}
.ranking_list_link {
    display: block;
    margin: 10px 0 0;
    padding: 10px 0;
    text-align: center;
    border: 1px solid #dedede;
    transition: all .2s;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    -ms-transition: all .2s;
}
.ranking_list_link:hover {
    background: #0BCCD3;
    color: #fff;
    border: 1px solid #0BCCD3;
}
.ranking_list_link i {
    display: inline-block;
    padding: 0 4px 0 0;
}
@media screen and (max-width: 768px) {
    .ranking_list_contents {
        padding: 10px 0 5px;
    }
    .ranking_list_left {
        width: 26%;
        max-width: 188px;
        display: inline-block;
        position: relative;
    }
    .ranking_list_left img {
        display: block;
        max-width: 188px;
        margin: 0 10px 0 0;
    }
    .ranking_list_right {
        max-width: 70%;
        display: inline-block;
        vertical-align: top;
    }
    .ranking_list_link {
        margin: 14px 0 0;
        padding: 14px 0;
        border: none;
        background: #0BCCD3;
        color: #fff;
        font-weight: bold;
        font-size: 15px;
    }
    .ranking_list_link:hover {
        border: none;
    }
}
@media screen and (max-width: 480px) {
    .ranking_list_title {
        font-size: 15px;
        line-height: 1.2;
    }
}
/* /////////////////////////////////////////////////////////////////
15.キーワード一覧
/////////////////////////////////////////////////////////////////*/

.keyword_list {
    margin: 10px 0 0;
}
.keyword_list li {
    overflow: hidden;
    width:16.6666666%;
    display: inline-block;
}
.keyword_list a {
    display: block;
    padding: 2px 0;
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.keyword_list a:before {
    font-family: "FontAwesome";
    content: "\f02b";
    padding: 0 4px 0 0;
    color: #0BCCD3;
}
@media screen and (max-width: 768px) {
    .keyword_list li {
        overflow: hidden;
        width:25%;
        display: inline-block;
    }
    .keyword_list a {
        display: block;
        padding: 4px 0;
        font-size: 14px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}
@media screen and (max-width: 480px) {
    .keyword_list li {
        overflow: hidden;
        width:50%;
        display: inline-block;
    }
    .keyword_list a {
        display: block;
        padding: 6px 0;
        font-size: 14px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}