@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Zilla+Slab&display=swap");
@import url("https://fonts.googleapis.com/css?family=Open+Sans&display=swap");

.hc-cont-main {
    font-family: yugothic, Yu Gothic, 游ゴシック体, 游ゴシック, ヒラギノ角ゴ ProN W3, Hiragino Kaku Gothic ProN, ヒラギノ角ゴ Pro W3, Hiragino Kaku Gothic Pro, メイリオ, meiryo, MS ゴシック, MS Gothic, sans-serif !important;
background-color: #fff;
color: #000;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

.hc-cont-main * {
    font-family: yugothic, Yu Gothic, 游ゴシック体, 游ゴシック, ヒラギノ角ゴ ProN W3, Hiragino Kaku Gothic ProN, ヒラギノ角ゴ Pro W3, Hiragino Kaku Gothic Pro, メイリオ, meiryo, MS ゴシック, MS Gothic, sans-serif !important;
font-size: 14px;
line-height: 1.5;
}

.hc-cont-main { margin: 0 0 60px;}

.hc-cont-main img { width: 100%; height: auto;}

.hc-cont-contets { margin: 24px 0; }

/* top */
.hc-cont-top-category {
    display: flex;
    margin: 12px 12px 0;
    flex-wrap: nowrap;
    gap: 10px 10px;
}

.hc-cont-top-category li { flex: 1; }

.hc-cont-top-new-block, .hc-cont-top-item { display: block; /*margin: 12px 12px 24px;*/ }

.hc-cont-top-new-block, .hc-cont-top-item {
    border-bottom: 1px dotted #e0e0e0;
    /*padding: 16px;*/
}
.hc-cont-top-new-link {
    display: block;
    position: relative;
    padding: 16px 40px 16px 16px;
    background: #fff;
    box-sizing: border-box;
    width: 100%;
}

.hc-cont-top-new-link:after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 24px;
    margin-top: -5px;
    width: 8px;
    height: 8px;
    border-right: 2px solid #e0e0e0;
    border-top: 2px solid #e0e0e0;
    transform: rotate(45deg);
    }
    

.hc-cont-top-new {
    display: flex;
    margin-bottom: 5px;
    align-items: center;
    flex-wrap: nowrap;
    gap: 10px 10px;
}

.hc-cont-top-new-block p {
    word-break: break-word;
    white-space: pre-wrap;
}

.hc-cont-top-new-icon {
    padding: 2px 10px;
    border-radius: 4px;
    font-size: 1rem;
    color: #fff;
}
.hc-cont-top-new-icon.qa { background: #7c7c7c; }
.hc-cont-top-new-icon.seminar { background: #e75050; }
.hc-cont-top-new-icon.nutrition { background: #f6ae49; }
.hc-cont-top-new-icon.vegetable { background: #73be8e; }
.hc-cont-top-new-icon.event { background: #7fd0ea; }
.hc-cont-top-new-icon.new { background: #dd3f3f; }

.hc-cont-top-new-icon.cate_qa { background: #7c7c7c; }
.hc-cont-top-new-icon.cate_seminar { background: #e75050; }
.hc-cont-top-new-icon.cate_nutrition { background: #f6ae49; }
.hc-cont-top-new-icon.cate_vegetable { background: #73be8e; }
.hc-cont-top-new-icon.cate_event { background: #7fd0ea; }
.hc-cont-top-new-icon.cate_new { background: #dd3f3f; }

/*
.hc-cont-top-new-icon.qa { background: #7c7c7c; }
.hc-cont-top-new-icon.seminar { background: #e75050; }
.hc-cont-top-new-icon.nutrition { background: #f6ae49; }
.hc-cont-top-new-icon.vegetable { background: #73be8e; }
.hc-cont-top-new-icon.event { background: #7fd0ea; }
.hc-cont-top-new-icon.new { background: #dd3f3f; }
*/

.category-01.active { background: #7c7c7c; color:#fff; }
.category-02.active { background: #f6ae49; color:#fff; }
.category-03.active { background: #73be8e; color:#fff; }
.category-04.active { background: #7fd0ea; color:#fff; }


.hc-cont-top-new-date { font-size: .92rem; }

/* 栄養豆知識 */
.hc-cont-mame-list-area {
    display: flex;
    margin: 24px 12px;
    align-items: center;
 /*   flex-wrap: wrap;
    gap: 10px 10px;*/
}
.hc-cont-mame-list-block {
    padding: 0 0 12px;
    width: 100%;
    white-space: nowrap;
    overflow-x: auto;
}

.hc-cont-mame-list{
    display: inline-block;
    padding: 6px 10px;
    font-size: 1.17rem;
    border-radius: 18px;
    background: #efefef;
}

/*.cate_qa, .cate_nutrition, .cate_vegetable, .cate_event { display: none; }*/
.active { display: inline-block; }
.show { display: block;}
/*
.hc-cont-top-item {
  }
  */
  .load-more {
    display: none; /* ボタンも最初は非表示 */
  }

  .load-more {
    display: block;
    position: relative;
    margin: 30px auto;
    padding: 6px 24px 6px 16px;
    color: #fff;
    font-size: 1.2rem;
    background: #000;
    text-align: center;
    border-radius: 4px;
  }

  .load-more::after {
    display: inline-block;
    content: "";
    position: absolute;
    margin-left: 6px;
    top: 12px;
    width: 6px;
    height: 6px;
    border: 0;
    border-top: solid 1px #fff;
    border-right: solid 1px #fff;
    -ms-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    transition: all 0.5s ease;
}



/*---------- PC ----------*/
@media screen and (min-width: 750px) {
    .hc-cont-main {
        display: block;
        margin: 0 auto;
        width: 100%;
        max-width: 750px;
    }

    .hc-cont-top-category {
        margin: 12px 24px 0;
        gap: 10px 20px;
    }

   .hc-cont-top-new-block, .hc-cont-top-item { margin: 12px 32px; }

    .hc-cont-mame-list-block {
        display: flex;
        flex-wrap: nowrap;
        gap: 0 10px;        
     }

    .hc-cont-top-new { margin-bottom: 8px; }
     .hc-cont-mame-list { flex: 1; text-align: center; }
     .hc-cont-mame-list { cursor: pointer; }


}