@charset "UTF-8";
/*ここからmixin.scss*/
/*@include replace('.articleBlock','.articleBlock.cat-study') {
  color: #bd6693;
}*/
/*ここまでmixin.scss*/
/*ここまでcolor.scss*/
@import url(https://use.fontawesome.com/releases/v5.6.1/css/all.css);
/* 200111　ブログ一覧追加 */
.blog {
  width: 100%; }
  .blog div.top-blog-List {
    /*width: 70%;*/
    padding: 1.2em 1em 0.8em; }
    @media screen and (max-width: 768px) {
      .blog div.top-blog-List {
        width: 100%; } }
    .blog div.top-blog-List h2.top-blog-list-title {
      display: block;
      box-sizing: border-box;
      width: 100%;
      font-size: 2.4rem;
      font-weight: 300;
      font-family: 'NotoSans';
      border-bottom: 3px solid #d8d8d8;
      margin: 0 0 0.8em 0; }
      @media screen and (max-width: 768px) {
        .blog div.top-blog-List h2.top-blog-list-title {
          font-size: 2rem;
          margin-bottom: 0.8em; } }
      .blog div.top-blog-List h2.top-blog-list-title span {
        display: inline-block;
        margin-bottom: -3px;
        padding: 0 0.3em;
        border-bottom: 3px solid #f16ea0; }
    .blog div.top-blog-List div.blogList {
      display: flex;
      flex-wrap: wrap;
      max-width: 1250px;
      margin: 0 auto; }
      .blog div.top-blog-List div.blogList div.articleBlock {
        /*width: calc(33.3% - 160px);//calc(16.6% - 30px);
        //max-width: 200px;
        margin: 0 15px 80px 15px;
        background: #FFF;
        position: relative;
        @include max-screen($lt_break) {
            width: calc(50% - 40px);
            margin: 0 20px 40px 20px;
        }
        @include max-screen($tb_break) {
            width: calc(50% - 20px);
            margin: 0 10px 40px 10px;
            &:nth-of-type(5){
                margin-bottom: 0;
            }
            &:nth-of-type(6){
                margin-bottom: 0;
            }
        }
        @include max-screen($sp_break) {
            width: 100%;
            &:nth-of-type(5){
                margin-bottom: 40px;
            }
        }*/
        width: calc(26% - 50px);
        max-width: 270px;
        margin: 0 20px 30px 20px;
        background: #FFF;
        position: relative; }
        @media screen and (max-width: 1600px) {
          .blog div.top-blog-List div.blogList div.articleBlock {
            width: calc(25.8% - 50px);
            margin: 0 20px 40px 20px;
            max-width: 270px; } }
        @media screen and (max-width: 1024px) {
          .blog div.top-blog-List div.blogList div.articleBlock {
            width: calc(50% - 40px);
            margin: 0 20px 40px 20px;
            min-width: inherit;
            max-width: inherit; } }
        @media screen and (max-width: 768px) {
          .blog div.top-blog-List div.blogList div.articleBlock {
            width: calc(50% - 20px);
            margin: 0 10px 40px 10px; }
            .blog div.top-blog-List div.blogList div.articleBlock:nth-of-type(5) {
              margin-bottom: 0; }
            .blog div.top-blog-List div.blogList div.articleBlock:nth-of-type(6) {
              margin-bottom: 0; } }
        @media screen and (max-width: 480px) {
          .blog div.top-blog-List div.blogList div.articleBlock {
            width: 100%;
            margin: 0 10px 40px 10px; }
            .blog div.top-blog-List div.blogList div.articleBlock .br2::before {
              content: "\a";
              white-space: pre;
              margin-top: -10px; } }
        .blog div.top-blog-List div.blogList div.articleBlock.cat-eat {
          border-bottom: 4px #eb6e90 solid; }
        .blog div.top-blog-List div.blogList div.articleBlock.cat-sleep {
          border-bottom: 4px #83d0de solid; }
        .blog div.top-blog-List div.blogList div.articleBlock.cat-play {
          border-bottom: 4px #7bbd26 solid; }
        .blog div.top-blog-List div.blogList div.articleBlock.cat-study {
          border-bottom: 4px #bd6693 solid; }
        @media screen and (max-width: 480px) {
          .blog div.top-blog-List div.blogList div.articleBlock p.img {
            padding: 0 10px; } }
        .blog div.top-blog-List div.blogList div.articleBlock p.img img {
          width: 100%;
          height: auto; }
          @media screen and (max-width: 768px) {
            .blog div.top-blog-List div.blogList div.articleBlock p.img img {
              height: 130px;
              object-fit: cover; } }
        .blog div.top-blog-List div.blogList div.articleBlock .articleCon {
          padding: 15px 0 18px;
          margin-bottom: 32px; }
          .blog div.top-blog-List div.blogList div.articleBlock .articleCon .articleTtl {
            margin: 0 0 10px;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            overflow: hidden; }
            .blog div.top-blog-List div.blogList div.articleBlock.cat-eat .articleCon .articleTtl {
              color: #e00742; }
            .blog div.top-blog-List div.blogList div.articleBlock.cat-sleep .articleCon .articleTtl {
              color: #0fcbed; }
            .blog div.top-blog-List div.blogList div.articleBlock.cat-play .articleCon .articleTtl {
              color: #63a908; }
            .blog div.top-blog-List div.blogList div.articleBlock.cat-study .articleCon .articleTtl {
              color: #af3876; }
          .blog div.top-blog-List div.blogList div.articleBlock .articleCon .articleCon_txt {
            font-size: 13px;
            font-size: 1.3rem;
            background: #F6F6F6;
            padding: 8px; }
            .blog div.top-blog-List div.blogList div.articleBlock .articleCon .articleCon_txt .inner {
              margin: 0 0 0;
              display: -webkit-box;
              -webkit-box-orient: vertical;
              -webkit-line-clamp: 4;
              overflow: hidden; }
              @media screen and (max-width: 768px) {
                .blog div.top-blog-List div.blogList div.articleBlock .articleCon .articleCon_txt .inner {
                  display: -webkit-box;
                  -webkit-box-orient: vertical;
                  -webkit-line-clamp: 3;
                  overflow: hidden; } }
        .blog div.top-blog-List div.blogList div.articleBlock div.articleInfo {
          padding: 0;
          display: flex;
          justify-content: space-between;
          position: absolute;
          bottom: 0;
          width: 100%; }
          .blog div.top-blog-List div.blogList div.articleBlock div.articleInfo span.catIcon {
            padding: 0;
            margin-bottom:2px;
            align-self: center; }
            .blog div.top-blog-List div.blogList div.articleBlock div.articleInfo span.catIcon i {
              font-size: 22px;
              font-size: 2.2rem; }
              .blog div.top-blog-List div.blogList div.articleBlock.cat-eat div.articleInfo span.catIcon i {
                color: #eb6e90; }
              .blog div.top-blog-List div.blogList div.articleBlock.cat-sleep div.articleInfo span.catIcon i {
                color: #83d0de; }
              .blog div.top-blog-List div.blogList div.articleBlock.cat-play div.articleInfo span.catIcon i {
                color: #7bbd26; }
              .blog div.top-blog-List div.blogList div.articleBlock.cat-study div.articleInfo span.catIcon i {
                color: #bd6693; }
            .blog div.top-blog-List div.blogList div.articleBlock div.articleInfo span.catIcon span.catTxt {
              font-size: 13px;
              font-size: 1.3rem;
              background: #EFEFEF;
              line-height: 1.0;
              padding: 0.2em 0.5em;
              margin-left: 8px;
              -webkit-border-radius: 3px 3px 3px 3px;
              -moz-border-radius: 3px 3px 3px 3px;
              border-radius: 3px 3px 3px 3px;
              align-self: center; }
          .blog div.top-blog-List div.blogList div.articleBlock div.articleInfo p {
            display: flex;
            justify-content: space-between;
            align-items: center; }
            .blog div.top-blog-List div.blogList div.articleBlock div.articleInfo p .date {
              font-size: 12px;
              font-size: 1.2rem;
              padding: 0 5px;
              font-family: 'NotoSans';
              src: url("/common/fonts/ttf/NotoSansCJKjp-Regular.ttf");
              font-weight: 100; }
            .blog div.top-blog-List div.blogList div.articleBlock div.articleInfo p .article_number {
              padding: 0 5px;
              border-left: 1px solid #DDDDDD;
              font-size: 15px;
              font-size: 1.5rem;
              font-family: 'NotoSans';
              src: url("/common/fonts/ttf/NotoSansCJKjp-Bold.ttf");
              font-weight: 400; }
              .blog div.top-blog-List div.blogList div.articleBlock.cat-eat div.articleInfo p .article_number {
                color: #eb6e90; }
              .blog div.top-blog-List div.blogList div.articleBlock.cat-sleep div.articleInfo p .article_number {
                color: #83d0de; }
              .blog div.top-blog-List div.blogList div.articleBlock.cat-play div.articleInfo p .article_number {
                color: #7bbd26; }
              .blog div.top-blog-List div.blogList div.articleBlock.cat-study div.articleInfo p .article_number {
                color: #bd6693; }
        .blog div.top-blog-List div.blogList div.articleBlock a {
          display: block;
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%; }
    .blog div.top-blog-List p.more {
      padding: 0.5em 0 1.8em 0; }
      .blog div.top-blog-List p.more a {
        display: block;
        position: relative;
        padding: 0.6em 1em 0.6em 0.6em; }
        .blog div.top-blog-List p.more a:before {
          font-family: 'icomoon' !important;
          content: "\e90b";
          font-style: normal;
          font-weight: normal;
          line-height: 1;
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
          font-size: 15px;
          color: #eb6e8f;
          text-align: center;
          padding: 0 0.5em 0 0;
          display: inline-block; }
        @media screen and (max-width: 768px) {
          .blog div.top-blog-List p.more a {
            padding: 0.7em 1em 1.4em 1em;
            font-size: 18px;
            font-size: 1.8rem; } }

#top #wrapper .top-news-list {
  width: 70%;
  /*      display: flex;*/
  flex-wrap: wrap;
  justify-content: flex-start;
  padding: 1.2em 1em 0.8em; }

@media screen and (max-width: 768px) {
  #top #wrapper .top-news-list {
    width: 100%; } }
.top-news-list-title {
  display: block;
  box-sizing: border-box;
  width: 100%;
  font-size: 2.4rem;
  font-weight: 300;
  font-family: 'NotoSans';
  border-bottom: 3px solid #d8d8d8;
  margin: 0 0 0.6em 0; }

.top-news-list-title span {
  display: inline-block;
  margin-bottom: -3px;
  padding: 0 0.3em;
  border-bottom: 3px solid #f16ea0; }

@media screen and (max-width: 768px) {
  .top-news-list-title {
    font-size: 2rem;
    margin-bottom: 0.5em; } }
#top #wrapper .top-news-list ul {
  display: block;
  float: none;
  width: 100%;
  padding: 0; }

#top #wrapper .top-news-list ul li {
  width: 100%;
  padding: 0.5em 0 0.8em 0;
  border-bottom: 1px solid #D8D8D8; }

#top #wrapper .top-news-list ul li:last-child {
  border-bottom: none; }

@media screen and (max-width: 768px) {
  #top #wrapper .top-news-list ul li {
    position: relative;
    padding: 0.6em 1em; }

  #top #wrapper .top-news-list ul li:after {
    font-family: 'icomoon' !important;
    content: "\e903";
    font-size: 16px;
    font-size: 1.6rem;
    color: #eb6e90;
    padding: 0 0 0;
    position: absolute;
    right: 0.5em;
    top: 0;
    bottom: 0;
    height: 16px;
    margin: auto auto;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; } }
@media screen and (max-width: 768px) and (max-width: 480px) {
  #top #wrapper .top-news-list ul li:after {
    font-size: 14px;
    font-size: 1.4rem; } }
#top #wrapper .top-news-list ul li a {
  padding-left: 0; }

#top #wrapper .top-news-list ul li a:before {
  display: none; }

#top #wrapper .top-news-list ul li a:after {
  content: "";
  display: block;
  clear: both; }

#top #wrapper .top-news-list ul li a span {
  display: block;
  float: left;
  font-size: 14px;
  font-size: 1.4rem;
  margin-right: 1em; }

#top #wrapper .top-news-list ul li a span.date {
  padding-top: 0.3em; }

#top #wrapper .top-news-list ul li a span.top-news-txt {
  float: none;
  line-height: 1.6;
  margin-left: 16em; }

@media screen and (max-width: 768px) {
  #top #wrapper .top-news-list ul li a span {
    font-size: 11px;
    font-size: 1.1rem; }

  #top #wrapper .top-news-list ul li a span.top-news-txt {
    clear: both;
    padding-top: 0.6em;
    margin-left: 0; } }
#top #wrapper .top-news-list ul li a span.cat_info,
#top #wrapper .top-news-list ul li a span.cat_recruit,
#top #wrapper .top-news-list ul li a span.cat_press {
  -webkit-border-radius: 30px 30px 30px 30px;
  -moz-border-radius: 30px 30px 30px 30px;
  border-radius: 30px 30px 30px 30px;
  padding: 0.5em 0.8em 0.4em;
  width: 120px;
  min-width: 120px;
  display: inline-block;
  text-align: center;
  font-size: 0.8em;
  line-height: 1;
  color: #FFFFFF;
  background: #eb6e90; }

@media screen and (max-width: 768px) {
  #top #wrapper .top-news-list ul li a span.cat_info,
  #top #wrapper .top-news-list ul li a span.cat_recruit,
  #top #wrapper .top-news-list ul li a span.cat_press {
    padding: 0.4em 1em 0.3em;
    width: 120px;
    min-width: 120px; } }
#top #wrapper .top-news-list ul li a span.cat_recruit {
  background: #98c55d; }

#top #wrapper .top-news-list ul li a span.cat_press {
  padding: 0.6em 1.5em 0.5em;
  background: #6ac6d6; }

@media screen and (max-width: 768px) {
  #top #wrapper .top-news-list ul li a span.top-news-txt {
    display: block;
    margin-top: 1em;
    font-size: 13px;
    font-size: 1.3rem; } }
@media screen and (max-width: 768px) {
  #top #wrapper .top-news-list ul li:nth-of-type(4) {
    border-bottom: none; }

  #top #wrapper .top-news-list ul li:nth-of-type(5),
  #top #wrapper .top-news-list ul li:nth-of-type(6) {
    display: none; } }