@charset "utf-8";

/* CSS Document */


/* ------------------------------------------
  TOP
--------------------------------------------- */
.top-bg-gray{
    background: #f9f9f9;
    padding: 4vw 4vw 5vw;
    margin-bottom: 8vw;
}

@media screen and (max-width: 750px) {
    .top-bg-gray {
        padding: 7vw 7vw 8vw;
        margin-bottom: 10vw;
    }
}

.top-main{
}
.mv {
    height: 560px;
    margin-bottom: 70px;
}

.mv-items a{
    overflow: hidden;
    display: flex;
    justify-content: center;
    color: #fff;
    position: relative;
    margin: 0 10px;
}

@media screen and (min-width: 1888px) {
    .mv-items a img{
        width: 100%;
    }    
}

.mv-items-text {
    position: absolute;
    bottom: 0;
    padding: 60px;
    width: 100%;
    height: 35%;
    background: linear-gradient(0deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0) 100%);
    display: flex;
}

.mv-postList-summary{
    display: flex;
    font-size: 12px;
    padding-bottom: 8px;
}

.mv-postList-summary li{
    padding-right: 10px;
    margin-right: 10px;
}

.mv-postList-date{
    position: relative;
}

.mv-postList-date:after{
    content: "";
    width: 1px;
    height: 10px;
    background: #fff;
    position: absolute;
    right: 0;
    top: 7px;
}

.mv-postList-title{
    font-size: 18px;
    line-height: 1.5;
} 

.mv{
  opacity: 0;
  transition: opacity .3s linear;
}
.mv.slick-initialized{
  opacity: 1;
}

.home .postList-items{
    margin: 0 10px 40px;
    background: #fff;
}

/*top-block*/
.top-block{
    padding: 0 0 30px 0;
    margin-bottom: 70px;
}

.top-recipe,
.top-mission{
    margin-bottom: 50px;
}

.top-block-inner{
    width: 1100px;
    margin: 0 auto;
    position: relative;
}

.top-block .head-en{
    /*position: relative;
    top: -40px;
    padding-bottom: 0;*/
}

.top-block-btn-wrap {
    text-align: center;
    padding-top: 1vw;
}

.top-block-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border: none;
    text-decoration: none;
    width: 17.57vw;
    max-width: 240px;
    height: 3.661vw;
    max-height: 50px;
    border: 1px solid;
    font-size: min(1.1713vw, 16px);
}

/*slider-new*/
.xo-slider .swiper-container {
    margin-bottom: 50px;
}

.xo-slider .swiper-container-initialized .slide-content {
    display: flex !important;
    align-items: flex-end;
    color: #fff;
}

.xo-slider-template-default .slide-content-title {
  order: 2;
}

.xo-slider-template-default .slide-content-subtitle {
  order: 1;
}

.xo-slider-template-default .slide-content-button{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

.xo-slider-template-default .slide-content-button a {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: none !important;
    border:none !important;
}

/*top-post*/
.top-newpost .top-postList,
.top-video .top-postList,
.top-diversity .top-postList{
    padding-top: 10px;
}

.top-newpost{
    background: #CCFFCC;
}

.top-diversity{
    background: #d8f1d9;
}

.top-video{
    background: #f5e9f7;
    margin-bottom: 60px;
}

/*.top-postList*/
.top-postList{
    display: flex;
    margin: 0 -15px;
}

.top-postList .postList-text{
    padding: 18px 20px;
}

.postList-items-big a{
    display: flex;
    align-items: flex-end;
    position: relative;
}

.postList-items-big-new {
    position: absolute;
    top: -10px;
    right: -5px;
}

.postList-items-big{
    width: 537px;
    margin: 0 15px 40px;
}

.postList-items-big-image{
    width: 268px;
}

.top-postList .postList-image,
.top-videoList .postList-image{
    margin: 0;
    height: 126px;
    overflow: hidden;
}

.postList-items-big-image img{
    width: 100%;
    height: auto;
}

.postList-items-big .postList-text {
    padding: 30px 30px 20px;
    width: 268px;
}

.postList-items-big .postList-title{
    padding-bottom: 10px;
}

.postList-items-big-tagList{
    display: flex;
    flex-wrap: wrap;
}

.postList-items-big-tagList li{
    margin: 0 5px 10px 0;
    border: 1px solid;
    padding: 2px 10px;
    font-size: 11px;
    border-radius: 15px;
    letter-spacing: 0;
}

.top-recipe .postList-items-big,
.top-recipe .postList-items{
    background: #faf9e9;
}

.top-mission .postList-items-big,
.top-mission .postList-items{
    background: #e6f9d6;
}

/*top-series*/
.top-series{
}

.top-series .head-lv2{
    margin-top: -3vw;
}

.top-series-list{
    display: flex;
    padding: 0 2vw;
}

.top-series-item {
    margin: 0 0.7vw;
}

.top-series-list img{
    width: 100%;
    height: auto;
}

/*slick-top-popular*/
.top-popularPost{
    margin-bottom: 3vw;
    position: relative;
}

.top-popularPost .slick-slider{
    position: static;
}

.slick-top-popular-wrap{
    margin: 0 -1%;
}

.slick-top-popular .postList-items{
    margin: 0;
}

.slick-top-popular .postList-items a {
    margin: 0 5.256% 3vw;
}

.slide-popular-arrow{
    position: absolute;
    top: 0;
    width: 2.27vw;
    max-width: 31px;
}

.slide-popular-arrow:hover{
    opacity: 0.6;
    cursor: pointer;
    -webkit-transition: all 0.3s 0s ease;
    transition: all 0.3s 0s ease;
}

.slide-popular-arrow.prev-arrow{
    right: 4vw;
}

.slide-popular-arrow.next-arrow{
    right: 0.95vw;
}

/*top-feature*/
.top-feature{
    padding: 0;
}

.top-feature-list {
    display: flex;
}

.top-feature-item {
    width: 50%;
}

.top-feature-item img {
    width: 100%;
    height: auto;
}

.top-about{
    text-align: center;
    padding: 70px 0 90px; 
    line-height: 1.75;
}

@media screen and (max-width: 750px) {
    .home .postList-items {
        margin: 0 15px 20px 0;
        width: calc(50% - 8px);
    }
    
    .top-postList {
        flex-wrap: wrap;
        margin: 0;
    }
    
    .top-recipe .top-postList{
        display: flex;
        flex-wrap: wrap;
    }
        
    .top-recipe .postList-items:nth-child(3),
    .home .postList-items:nth-child(even) {
        margin-right: 0;
    }
    
    .top-recipe .postList-items:nth-child(2){
        margin-right: 15px;
    }
    
    .top-newPost .postList-items{
        margin-right: 20px !important;
    }
    
    .top-block{
        padding: 0;
        margin-bottom: 50px;
    }
    
    .top-block .head-en {
    }
    
    .top-block-inner {
        width: 100%;
    }
    
    .top-postList-wrap{
        overflow-x: scroll;
    }
    
    .top-postList-wrap .top-postList {
        width: 1200px;
    }
    
    .top-postList .postList-image, .top-videoList .postList-image {
        height: auto;
    }
    
    .top-newpost .postList-items {
        margin: 0 20px 0 0;
        width: 252px;
    }
    
    .top-postList:after {
        content: "";
        display: block;
        clear: both;
    }
    
    .top-block-btn {
        width: auto;
        max-width: none;
        height: auto;
        max-height: none;
        border: 1px solid;
        font-size: min(3.6vw, 18px);
        padding: 2vw 4vw;
    }

    .postList-items-big {
        width: 100%;
        margin: 0 0 20px;
    }
    .postList-items-big a {
        display: block;
    }
    .postList-items-big-image {
        width: 100%;
    }
    .postList-items-big .postList-text {
        padding: 20px;
        width: 100%;
    }
    
    .top-recipe, .top-mission {
        padding: 10px 20px 60px 20px;
        margin-bottom: 50px;
    }
    
    .top-series {
        margin-bottom: 10vw;
    }
    
    .top-series .head-lv2 {
        margin-top: -3vw;
    }

    .top-series-list {
        display: flex;
        flex-wrap: wrap;
        padding: 0;
    }
    
    .top-series-item {
        margin: 0 2% 3%;
        width: 46%;
    }
    
    .slide-popular-arrow{
        position: absolute;
        top: 50%;
        width: 4vw;
        max-width: 28px;
        margin-top: -2vw;
    }
    
    .slide-popular-arrow.prev-arrow {
        right: inherit;
        left: -5.5vw;
    }

    .slide-popular-arrow.next-arrow{
        right: -5.5vw;
    }
    
    .top-feature-list {
        display: block;
    }
    
    .top-feature-item {
        width: 100%;
    }
    
    .top-feature-item + .top-feature-item {
        margin-top: 4vw;
    }
    
    .top-about{
        padding: 0px 0 12vw;    
    }
    
}


/*ACCESS*/

.top-access-map {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 35%; /* 比率を4:3に固定 */
}
 
/* Google Mapのiframe */
.top-access-map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 750px) {
    .top-access-map {
        padding-top: 100%;
    }
}

/* ------------------------------------------
  POST
--------------------------------------------- */
.postList-items a{
    display: block;
}

.post-top-thumb{
    margin-bottom: 20px;
}

.post-top-thumb img{
    width: 100%;
    height: auto;
}

.post-summary{
}

.post-contents{
    padding-bottom: 30px;
}

.post-contents a,
.post-contents .text-link{
    color: #f64141;
    text-decoration: underline;
}

.post-contents img{
    /*width: 100%;
    height: auto;*/
}

.img-square img {
    width: 400px;
}

img.img-square {
    width: 500px;
    max-width: 100%;
}

.post-contents p {
    line-height: 2;
    letter-spacing: 2px;
    padding-bottom: 2.5vh;
}

.post-contents img + img {
    margin-top: 20px;
}

.post-contents p:last-child {
    padding-bottom: 0;
}

.post-contents li:last-child p{
    padding-bottom: 0;
}

.post-contents strong {
    font-weight: 700;
}

.post-contents h2,
.post-contents .topics-midashi{
    letter-spacing: 2px;
    font-size: 20px;
    padding-bottom: 15px;
    position: relative;
    padding-left: 20px;
    margin-top: 20px;
}

.post-contents h2:before,
.post-contents .topics-midashi:before{
    content: "";
    display: block;
    width: 6px;
    height: 18px;
    background: #212121;
    position: absolute;
    top: 7px;
    left: 0;
}

.post-contents h3,
.topics-midashi-lv03{
    font-size: 18px;
    font-weight: 500;
    padding-bottom: 15px;
    margin-top: 15px;
}

.post-contents h4,
.topics-midashi-lv04{
    font-weight: 500;
    padding-bottom: 5px;
    font-size: 16px;
}

.post-contents h5,
.topics-midashi-lv05{
    font-weight: 500;
    text-decoration: underline;
    padding-bottom: 5px;
}

.post-contents h6{
    font-weight: 500;
}

.post-summary-tagList {
    padding-top: 10px;
    border-bottom: 1px solid #999;
}

.post-summary-tagList li{
    display: inline-block;
}

.post-contents .topics-recipe-lead {
    line-height: 1.75;
    padding-bottom: 20px;
}

.topics-block-wrap {
    /*padding-top: 25px;*/
}

.post-thumbnail{
    
}

.topics-block {
    padding-bottom: 30px;
}

.topics-block p:last-child{
    padding-bottom: 0;
}

.post-contents .topics-block:last-child {
    padding-bottom: 0;
}

.item-info{
    display: flex;
    padding: 20px !important;
    background: #f5f5f5;
}

.single-recipes .item-info{
    background: #faf9e9;
}

.column .item-info{
    background: #ddf3f3;
}

.item-info-img{
    width: 200px;
}

.item-info-text {
    padding-left: 25px;
    width: calc(100% - 200px);
}

.item-info-text p{
    padding-bottom: 15px;
}

.item-info-text-title{
    font-size: 16px;
    font-weight: 500;
    padding-bottom: 10px;
}

.item-info + .item-info{
    margin-top: 20px;
}

.fb{
    margin: 15px 0 -15px -10px;
}

/*Column*/
.topics-column {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.topics-column-Vtop{
    align-items: flex-start !important;
}

.twoColumn-inner {
    width: calc(50% - 20px);
}

.column-bg{
    padding: 30px 30px;
    margin-bottom: 40px;
}

.twoColumn-inner .topics-midashi-lv03{
    margin-top: 0;
}

.topics-column h4 i{
    margin-right: 5px;
}

.column-bg-beige{
    background: #fff5ed;
}

.column-bg-beige h3,
.column-bg-beige h4{
    color: #895400;
}

.column-bg-red{
    background: #fff2f7;
}

.column-bg-red h3,
.column-bg-red h4{
    color: #d95858;
}



/* ################# 引用 ################# */
.post-contents blockquote{
    font-style: italic;
    color: #707070;
    position: relative;
    border-left: 5px solid #ddd;
    padding: 20px 20px 20px 60px;
    margin-bottom: 20px;
}

.post-contents blockquote:before,
.post-contents blockquote:after{
    content: "";
    width: 30px;
    height: 22px;
    background-size: cover !important;
    position: absolute;
}

.post-contents blockquote:before{
    background: url(../images/blockquote-before.svg) no-repeat;
    top: 0;
    left: 15px;
}

.post-contents blockquote:after{
    background: url(../images/blockquote-after.svg) no-repeat;
    bottom: 0;
    right: 0;
}

.post-contents blockquote span {
    display: block;
    text-align: right;
}

.post-contents blockquote span:before {
    content: "─";
}

@media screen and (max-width: 750px){
    padding: 20px 20px 20px 40px;
}    
}

/* ################# ライター ################# */
#post-author{
    display:none;
}

.author-title{
    padding-bottom: 20px;
}

.authorPage-head{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0;
    margin-bottom: 30px;
    border-bottom: 1px dotted #ccc;
    border-top: 1px dotted #ccc;
}

.authorPage-head-img{
    width: 70px;
    border-radius: 100px;
    overflow: hidden;
    margin: 0 auto 12px
}

.authorPage-head-img img{
    width: 70px;
    height: 70px;
}

.authorPage-head-text {
    width: 500px;
    letter-spacing: 2px;
    margin: 0 auto;
}

.authorPage-head-img + .head-jp{
    padding-bottom: 15px;
}

/* ################# 記事共通 ################# */
.post-detail-summary{
    display: flex;
    justify-content: space-between;
    padding-bottom: 30px;
    width: 100%;
}

.post-detail-summary-writer{
    width: 520px;
}

.post-detail-summary-writer .sidebar-postList-items-link {
    align-items: center;
}

.post-detail-summary-writer .sidebar-postList-image{
    border-radius: 25px;
}

.post-detail-summary-writer .post-author-name:before{
    content: "ライター："
}

.post-detail-summary-writer .post-author-intro{
     display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;   
}

.post-detail-summary-special .post-detail-summary-writer{
    width: calc(100% - 290px);
}

.post-detail-summary-sns{
    display: flex;
    align-items: center;
    padding: 0 20px;
    border-radius: 6px;
    background: #ddf3f3;
}

.single-recipes .post-detail-summary-sns{
    background: #faf9e9;
}

body.mission .post-detail-summary-sns{
    background: #e6f9d6;
}

body.foodsdiversity .post-detail-summary-sns{
    background: #d8f1d9;
}

.post-detail-summary-sns dt{
    font-weight: 700;
}

.post-detail-summary-sns dd{
    padding-left: 10px;
}

.post-detail-thumbnail{
    margin-bottom: 20px;
}

.post-detail-thumbnail img{
    width: 100%;
    height: auto;
}

.post-tagList.single-page{
    border-top: 1px solid #999;
    border-bottom: 1px solid #999;
    padding: 15px 0;
    display: flex;
    align-items: center;
}

.post-tagList.single-page dt{
    font-family: 'Spectral', serif;
}

.post-tagList.single-page dd {
    margin-left: 5px;
}

.post-tagList.single-page a {
    display: block;
    background: #3e3e3e;
    color: #fff;
    font-size: 11px;
    border-radius: 6px;
    padding: 5px 10px;
}

/*blog-card*/
.blog-card{
    padding-bottom: 30px;
}

.blog-card a{
    display: flex;
    justify-content: space-between;
    padding: 20px;
    border: 1px solid #ccc;   
}

.blog-card-thumbnail {
    width: 225px;
}

.blog-card-content {
    width: calc(100% - 250px);
}

.blog-card-title{
    font-size: 16px;
    font-weight: 500;
    padding-bottom: 10px;
}

.blog-card-excerpt{
    padding-bottom: 10px;
}

.blog-card-content > span{
    display: block;
    text-align: right;
    color: #f64141;
    text-decoration: underline;
}

.blog-card-content span span {
    position: relative;
}

.blog-card-content span span:after {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    border-top: 1px solid #f64141;
    border-right: 1px solid #f64141;
    -webkit-transform: rotate(45deg) translateY(-50%);
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 10px;
    left: -20px;
}

.single .wpulike{
    background: #f1f1f1;
    border-radius: 8px;
    padding: 15px;
    display: flex;
    align-items: center;
}

.single .wpulike:before {
    content: "この記事が気に入ったら「いいね！」をお願いします!";
    padding-right: 10px;
    font-weight: 500;
}

.wpulike-heart .wp_ulike_general_class {
    background: #fff;
}

.wp_ulike_general_class:before {
    content: "いいね!";
    font-size: 12px;
    position: relative;
    top: -1px;
    font-weight: 500;
    padding-left: 5px;
    color: #616161;
}

@media screen and (min-width: 750px){
    .post-detail-thumbnail{
        margin: 0 auto 20px;
        width: 60%;    
    }
    .post-contents{
        width: 60%;
        margin: 0 auto;
    }
}

@media screen and (max-width: 750px){
    .post-detail-summary {
        display: flex;
        justify-content: space-between;
        padding-bottom: 20px;
    }
    
    .post-detail-summary-special .post-detail-summary-writer,
    .post-detail-summary-writer {
        width: calc(100% - 130px);
    }
    
    .sidebar-postList-image {
        margin-right: 10px;
    }
    
    .sidebar-postList-text {
        width: calc(100% - 55px);
    }
    
    .post-detail-summary-sns {
        justify-content: space-between;
        padding: 5px 10px;
        width: 110px;
    }
    
    .post-detail-summary-sns dt {
        display: none;
    }
    
    .post-detail-summary-sns dd {
        padding-left: 0;
    }
    
    .blog-card a{
        display: block; 
    }
    
    .blog-card-thumbnail {
        width: 100%;
        margin-bottom: 15px;
    }
    
    .blog-card-content {
        width: 100%;
    }
    
    .single .wpulike{
        padding: 10px;
        display: block;
    }
    
    .single .wpulike:before {
        padding-right: 0;
        padding-bottom: 5px;
        display: block;
    }
}

/* ################# Easy Table of Contents ################# */
#ez-toc-container {
    background: #ddf3f3;
    border: none;
    border-radius: 0;
    box-shadow: none;
    display: table;
    margin-bottom: 35px;
    padding: 30px 30px;
    position: relative;
    width: 100%;
}

div#ez-toc-container p.ez-toc-title {
    font-size: 18px;
    padding-bottom: 10px;
}

div#ez-toc-container ul li {
    font-size: 100%;
    padding-bottom: 8px;
}

#ez-toc-container a {
    color: #070707;
    box-shadow: none;
    text-decoration: none;
    text-shadow: none;
}

.ez-toc-list > .ez-toc-page-1 > a {
    font-weight: 700;
    padding-bottom: 5px;
    display: inline-block;
}

.ez-toc-toggle i.ez-toc-glyphicon {
    font-size: 20px;
    margin-left: 2px;
}

 .ez-toc-toggle{
    background: #070707;
    border: none;
    position: relative;
    top: -4px;
}

.ez-toc-glyphicon{
    color: #fff;
}

@media screen and (max-width: 750px){
    #ez-toc-container {
        padding: 20px 20px 15px;
    }
}


/* ################# レシピ ################# */
.topics-recipe{
    color: #212121;
    font-weight: 500;
    font-size: 14px;
    letter-spacing: 1px;
    padding-top: 25px;
}

.topics-recipe-lead{
    line-height: 1.75;
    padding-bottom: 40px;
}

.topics-recipe-top{
    padding-bottom: 60px;
}

.topics-recipe-top-img{
    margin-bottom: 30px;
}

.topics-recipe-top-text{
    width: 100%;
}

.topics-recipe-top-title{
    letter-spacing: 2px;
    margin-top: 40px;
    font-size: 18px;
    padding-bottom: 15px;
    position: relative;
    padding-left: 20px;
}
.topics-recipe-top-title:before {
    content: "";
    display: block;
    width: 6px;
    height: 18px;
    background: #212121;
    position: absolute;
    top: 5px;
    left: 0;
}

.topics-recipe-top-material{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.topics-recipe-top-material dt {
    width: 40%;
    border-bottom: 1px dashed #ccc;
    padding: 10px 0;
}

.topics-recipe-top-material dd {
    width: 60%;
    border-bottom: 1px dashed #ccc;
    padding: 10px 0;
    text-align: right;
}

.topics-recipe-top-material a{
    color: #f64141;
    text-decoration: underline !important;
}

.topics-recipe-contents{
    background: #fafafa;
    padding: 30px;
    position: relative;
}

.topics-recipe-contents-title{
    position: absolute;
    top: -35px;
    left: 0;
    letter-spacing: 2px;
    font-size: 18px;
    padding-left: 20px;
}

.topics-recipe-contents-title:before{
    content: "";
    display: block;
    width: 6px;
    height: 18px;
    background: #212121;
    position: absolute;
    top: 5px;
    left: 0;
}


.topics-recipe-contents li {
    display: flex;
    justify-content: space-between;
    position: relative;
    padding-left: 25px;
    padding-bottom: 15px;
    line-height: 1.75;
}

.topics-recipe-contents li:last-child{
    padding-bottom: 0;
}

.topics-recipe-contents li:before {
    display: block;
    width: 18px;
    height: 18px;
    background: #711717;
    border-radius: 10px;
    position: absolute;
    top: 4px;
    left: 0;
    text-align: center;
    line-height: 16px;
    color: #fff;
    font-size: 12px;
}

.topics-recipe-contents li:nth-child(1):before {
    content: "1";
}
.topics-recipe-contents li:nth-child(2):before {
    content: "2";
}
.topics-recipe-contents li:nth-child(3):before {
    content: "3";
}
.topics-recipe-contents li:nth-child(4):before {
    content: "4";
}
.topics-recipe-contents li:nth-child(5):before {
    content: "5";
}
.topics-recipe-contents li:nth-child(6):before {
    content: "6";
}
.topics-recipe-contents li:nth-child(7):before {
    content: "7";
}
.topics-recipe-contents li:nth-child(8):before {
    content: "8";
}
.topics-recipe-contents li:nth-child(9):before {
    content: "9";
}
.topics-recipe-contents li:nth-child(10):before {
    content: "10";
}
.topics-recipe-contents li:nth-child(11):before {
    content: "11";
}
.topics-recipe-contents li:nth-child(12):before {
    content: "12";
}
.topics-recipe-contents li:nth-child(13):before {
    content: "13";
}
.topics-recipe-contents li:nth-child(14):before {
    content: "14;
}
.topics-recipe-contents li:nth-child(15):before {
    content: "15";
}

.topics-recipe-contents ol p{
    padding-right: 15px;
}

.topics-recipe-contents ol p a{
    color: #f64141;
    text-decoration: underline !important;
}

.recipe-img{
    display: flex;
}

.topics-recipe-contents li img{
    width: 120px;
    height: 120px;
    border: 1px solid #ddd;
    margin-left: 15px;
}

.special-sns-wrap{
    display: flex;
    align-items: center;
    padding: 0 0 20px;
    border-radius: 6px;
    justify-content: flex-end;
}

.special-sns-wrap dl {
    display: flex;
}

.special-sns-wrap dt {
    font-weight: 700;
}

.special-sns-wrap dd {
    padding-left: 10px;
    width: 34px;
}

@media screen and (max-width: 768px) {
.topics-recipe {
    font-size: 12px;
}
.topics-recipe-lead {
    line-height: 1.5;
    padding-bottom: 20px;
}
.topics-recipe-top {
    display: block;
    padding-bottom: 50px;
}
.topics-recipe-top-img {
    width: 100%;
    margin-bottom: 20px;
}
.topics-recipe-top-text {
    width: 100%;
}
.topics-recipe-top-title {
    padding-left: 14px;
    margin-top: 20px;
    font-size: 14px;
}
.topics-recipe-top-title:before {
    height: 16px;
    top: 3px;
}
.topics-recipe-top-material dt {
    width: 70%;
    padding: 10px 0;
}
.topics-recipe-top-material dd {
    width: 30%;
    padding: 10px 0;
}
.topics-recipe-contents {
    padding: 20px;
    margin-bottom: 40px;
}
.topics-recipe-contents-title {
    padding-left: 14px;
    font-size: 14px;
}

.topics-recipe-contents-title:before{
    height: 16px;
    top: 3px;
}
.topics-recipe-contents li {
    display: block;
}
.topics-recipe-contents ol p {
   padding-right: 0;
}
.topics-recipe-contents li img{
    margin-top: 0;
    margin-left: 0;
}
    
.topics-recipe-contents li img + img{
    margin-left: 15px;
}


.topics-recipe-contents-new {
    margin: 0px;
}
}

/* ################# 動画 ################# */
.videoList-wrap{
    display: block;
    position: relative;
}

.videoList-image img {
    width: 100%;
    height: auto;
}

.videoList-text {
    position: absolute;
    bottom: 0;
    padding: 20px;
    width: 100%;
    height: 30%;
    background: linear-gradient( 0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    color: #fff;
}

/* ################# 久保君ブログ ################# */
.topics-profile {
    background: #f1f1f1;
    padding: 20px;
    margin-bottom: 20px;
    max-width: 100%;
    border-radius: 6px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
}
.topics-profile figure{
    margin: 0;
    text-align: center;
}
.topics-profile figure img{
    width: 80px;
    height: auto;
}
.topics-profile figcaption{
    font-size: 12px;
}
.topics-profile p {
    padding-left: 30px;
    padding-bottom: 0;
}

.topics-text-link{
    color: #4a7c9a !important;
}

.topics-block-wrap a[target="_blank"]::after,
.text-link-gaibu:after {
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    background: url(../images/icon-link-gaibu.svg) no-repeat;
    margin-left: 5px;
    top: 2px;
    position: relative;
}
.topics-conversation{
    max-width: 100%;
    box-sizing: border-box;
}
.topics-conversation-contents{
    display: flex;
    align-items: start;
    margin-bottom: 20px;
    justify-content: space-between;
}
.topics-conversation-contents figure{
    margin: 0;
    text-align: center;
}
.topics-conversation-contents figure img{
    width: 65px;
    height: auto;
}
.topics-conversation-contents figcaption{
    font-size: 12px;
}
.topics-conversation-contents-text{
    width: calc(100% - 95px);
}
.topics-conversation-contents-text p {
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 6px;
    position: relative;
}
.topics-conversation-contents-text p:after,.topics-conversation-contents-text p:before{
    border: solid transparent;
    content:'';
    height:0;
    width:0;
    pointer-events:none;
    position:absolute;
    right:100%;
    top:50%;
}
.topics-conversation-contents-text p:after{
    border-color: rgba(255, 255, 255, 0);
    border-top-width: 8px;
    border-bottom-width: 8px;
    border-left-width: 8px;
    border-right-width: 8px;
    margin-top: -8px;
    border-right-color:#FFFFFF;
}
.topics-conversation-contents-text p:before{
    border-color: rgba(204, 204, 204, 0);
    border-top-width: 8px;
    border-bottom-width: 8px;
    border-left-width: 8px;
    border-right-width: 8px;
    margin-top: -8px;
    margin-right: 1px;
    border-right-color:#CCCCCC;
}
.topics-lineup{
    background: #fffcd4;
    /*max-width: 750px;*/
    padding: 30px 40px;
    box-sizing: border-box;
}
.topics-lineup-text{
    width: calc(100% - 390px);
}
.topics-lineup-title{
    text-align: center;
    padding-bottom: 10px;
    position: relative;
    margin-bottom: 25px;
}
.topics-lineup-title span{
    position: relative;
    display: inline-block;
    line-height: 2.5;
}
.topics-lineup-title:before{
    content: none !important;
}
.topics-lineup-title:after{
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    background: url(../img/topics-lineup-title-line.svg) no-repeat center;
    bottom: 0;
    position: absolute;
}
.topics-lineup-title span:before{
    content: "";
    display: block;
    width: 36px;
    height: 25px;
    background: url(../img/topics-lineup-title-iconL.svg) no-repeat 0 0;
    position: absolute;
    left: -50px;
    top: 6px;
}
.topics-lineup-title span:after{
    content: "";
    display: block;
    width: 48px;
    height: 29px;
    background: url(../img/topics-lineup-title-iconR.svg) no-repeat 0 0;
    position: absolute;
    right: -60px;
    top: 6px;
}
.topics-lineup-item {
    display: flex;
    justify-content: space-between;
    box-sizing: border-box;
    padding-bottom: 30px;
    margin-bottom: 30px;
    border-bottom: 1px solid #ccc;
}
.topics-lineup-item:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: none;
}
.topics-lineup-text-title{
    background: #fff;
    padding: 5px 15px;
    font-size: 16px;
    margin-bottom: 5px;
}
.topics-lineup-price{
    color: #e51734;
    font-size: 20px;
    font-weight: 700;
}
.topics-lineup-price small{
    font-size: 12px;
}
.topics-lineup-img{
    width: 355px;
    margin-bottom: 10px;
}
.topics-lineup-item p{
    line-height: 1.5;
    min-height: 62px;
    box-sizing: border-box;
}
.topics-lineup-item a{
    display: block;
    width: 80%;
    margin: 0 auto;
    text-align: center;
    padding: 10px 0;
    border: none;
    border-radius: 1000px;
    background: #e51734;
    box-shadow: 0 4px 0 #64000e;
    color: #fff;
    cursor: pointer;
    -webkit-transition: all .1s 0s ease;
    transition: all .1s 0s ease;
    -webkit-appearance: none;
    text-decoration: none;
}
.topics-lineup-item a:hover {
    -webkit-transform: translate(0, 4px);
    transform: translate(0, 4px);
    box-shadow: 0 0 0 #64000e;
}
@media screen and (max-width: 768px){
.topics-profile {
    padding: 10px;
}
.topics-profile figcaption {
    font-size: 10px;
}
.topics-profile p {
    padding-left: 20px;
}
.topics-conversation-contents figure img {
    width: 60px;
}
.topics-conversation-contents-text {
    width: calc(100% - 80px);
}
.topics-conversation-contents-text p {
    padding: 15px;
}

.topics-lineup{
    padding: 20px 30px 30px;
    box-sizing: border-box;
}
.topics-lineup-title {
}
.topics-lineup-title:after {
}
.topics-lineup-title span {
    font-size: 14px;
    padding-top: 7px;
    line-height: 1.5;
}
.topics-lineup-item {
    flex-wrap: wrap;
}
.topics-lineup-img {
    margin-bottom: 15px;
    width: 100%;
}
.topics-lineup-text {
    width: 100%;
}
.topics-lineup-text-title {
    font-size: 14px;
}
.topics-lineup-title span:before {
    left: -35px;
    top: 10px;
    background-size: 26px;
}
.topics-lineup-title span:after {
    right: -55px;
    top: 10px;
    background-size: 36px;
}

}


/* ========================================================
   for SP
===========================================================*/

@media screen and (max-width: 750px) {
    /* ------------------------------------------
      top
    --------------------------------------------- */
    /*main*/
    .mv {
        height: auto;
        margin-bottom: 40px;
    }
    .mv-items a {
        margin: 0;
    }
    .mv-items a img{
        width: 130vw;
        height: auto;
    }
    .mv-items-text {
        padding: 20px;
    }
    .mv-postList-summary {
        font-size: 10px;
        padding-bottom: 5px;
    }
    .mv-postList-title {
        font-size: 12px;
    }
    
    /*top-videos*/
    .top-videos {
        margin: 0 -20px;
        padding: 30px;
    }
    .videoList-items {
        width: 100% !important;
        margin: 0;
    }
    
    /* ------------------------------------------
      POST
    --------------------------------------------- */
    .post-top-thumb{
        margin-bottom: 20px;
    }

    .post-summary{
        margin-bottom: 10px;
    }

    .img-square img {
        width: 100%;
    }
    
    .post-contents h2,
    .post-contents .topics-midashi {
        padding-left: 14px;
        margin-top: 20px;
        font-size: 14px;
    }
    
    .post-contents h2:before,
    .post-contents .topics-midashi:before {
        height: 16px;
        top: 3px;
    }

    .post-contents h3,
    .topics-midashi-lv03 {
        font-size: 14px;
        padding-bottom: 10px;
        margin-top: 0;
    }
    
    .post-contents h4,
    .topics-midashi-lv04{
        font-size: 12px;
    }


    .item-info-img {
        width: 100px;
    }

    .item-info-text {
        padding-left: 20px;
        width: calc(100% - 100px);
    }

    .item-info-text p{
        line-height: 1.5;
    }

    .item-info + .item-info {
        margin-top: 15px;
    }

    /*topics-column*/
    .topics-column {
        flex-wrap: wrap;
    }

    .column-bg {
        padding: 20px;
        margin-bottom: 20px;
    }

    .twoColumn-inner {
        width: 100%;
    }

    .twoColumn-inner:first-child {
        margin-bottom: 20px;
    }

    .column-sp-reverse .twoColumn-inner:nth-child(2) {
        order: 1;
        margin-bottom: 20px;
    }

    .column-sp-reverse .twoColumn-inner:nth-child(1) {
        order: 2;
        margin-bottom: 20px;
    }

    /*author page*/

    .author-title{
        padding-bottom: 15px;
        }

    .authorPage-head{
        padding: 15px 0;
        margin-bottom: 15px;
    }

    .authorPage-head-img{
        width: 50px;
    }


    .authorPage-head-text {
        width: calc(100% - 65px);
    }
}

/*mv-slider-full*/
.mv-slider-full {
    overflow: hidden;
    width: 100%;
    height: 100vh;
    margin: 0 auto;    
}

.mv-slider-full .slider-item {
    font-size: 0;
    height: 100%;
}

.mv-slider-full .slider-item img {
    width: 100%;
}

.mv-slider-full .add-animation {
    animation: zoomUp 10s linear 0s normal both; //ズームアニメーション
}

[class^="mv-slider-full-img"] {
    height: 100vh;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

.mv-slider-full-img01{
    background: url(../images/top/kv01.webp);
}

.mv-slider-full-img02{
    background: url(../images/top/kv02.webp);
}

.mv-slider-full-img03{
    background: url(../images/top/kv03.webp);
}

.mv-slider-full-img04{
    background: url(../images/top/kv04.webp);
}

.mv-slider-full-img05{
    background: url(../images/top/kv05.webp);
}

.mv-slider-full-img06{
    background: url(../images/top/kv06.webp);
}

@keyframes zoomUp {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.15);
  }
}

.mv-slider-full:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: #00000050;
    position: absolute;
    z-index: 2;
}

@media screen and (max-width: 750px) {
    .mv-slider-full {
        height: 80vh;
    }    
}