@charset "UTF-8";
/*
Bootstrap 3
768px未満: スマホ（デフォルト）
※スマホは、Media Queries無しで記述。
768px以上をタブレットサイズ
992px以上をデスクトップサイズ
1200px以上を大きめのデスクトップサイズ

iPhone4: 320 × 480
iPhone5: 320 × 568
iPhone6: 375 × 627
iPhone6s: 414 × 736
Nexus6: 414 × 659
*/

#wrapper-box{
  font-family: 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','メイリオ', Meiryo,'Arial',YuGothic,'Yu Gothic','ＭＳ ゴシック',sans-serif; color: #1c1c1c !important;
}



img.icon-new {
  height: 14px !important;
  width: 35px !important; }

/*#########################################################
topicPath
#########################################################*/
@media screen and (max-width: 1200px) {
  div#main-anapoke h1#topic-anapoke img {
    width: 100%; } }

/*コンテンツナビ*/
div.contents-list-topic {
  margin-top: 20px;
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding-bottom: .5em;
  border-bottom: 1px solid #e6e6e6;
  height: 75px;
  /*コンテンツタイトル*/
  /*コンテンツナビ*/ }
  @media screen and (max-width: 1200px) {
    div.contents-list-topic {
      height: inherit;
      display: block; } }
  div.contents-list-topic::after {
    position: absolute;
    bottom: -1px;
    left: 0;
    z-index: 2;
    content: '';
    width: 20%;
    height: 1px;
    background-color: #e2cae4; }
  div.contents-list-topic h2#contents-list-ttl {
    margin-right: auto;
    font-size: 22px;
    letter-spacing: 0;
    font-weight: bold;
    padding-left: 40px;
    height: 27px;
    background: url(../../anapoke/images/icon_topic.jpg) left center no-repeat; }
    @media screen and (max-width: 1200px) {
      div.contents-list-topic h2#contents-list-ttl {
        width: calc(100% - 40px);
        margin-bottom: 20px;
        font-size: 18px;
        font-size: 1.125rem; } }
  div.contents-list-topic div#contents-list-nav ul {
    width: 635px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between; }
    @media screen and (max-width: 1200px) {
      div.contents-list-topic div#contents-list-nav ul {
        width: 100%;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap; } }
    div.contents-list-topic div#contents-list-nav ul li.all span.active {
      background: #c595c9; }
      div.contents-list-topic div#contents-list-nav ul li.all span.active:after {
        border-color: #c595c9 transparent transparent transparent; }
    div.contents-list-topic div#contents-list-nav ul li.hanashi span.active {
      background: #62c6ba; }
      div.contents-list-topic div#contents-list-nav ul li.hanashi span.active:after {
        border-color: #62c6ba transparent transparent transparent; }
    div.contents-list-topic div#contents-list-nav ul li.genba span.active {
      background: #f0ac41; }
      div.contents-list-topic div#contents-list-nav ul li.genba span.active:after {
        border-color: #f0ac41 transparent transparent transparent; }
    div.contents-list-topic div#contents-list-nav ul li.kotoba span.active {
      background: #629fd8; }
      div.contents-list-topic div#contents-list-nav ul li.kotoba span.active:after {
        border-color: #629fd8 transparent transparent transparent; }
    div.contents-list-topic div#contents-list-nav ul li {
      width: 156px;
      height: 42px;
      line-height: 42px; }
      @media screen and (max-width: 1200px) {
        div.contents-list-topic div#contents-list-nav ul li {
          width: 22%;
          margin-bottom: 20px; } }
      @media screen and (max-width: 768px) {
        div.contents-list-topic div#contents-list-nav ul li {
          width: 48%;
          display: inline-table; } }
      div.contents-list-topic div#contents-list-nav ul li span {
        color: #534254;
        font-weight: bold;
        letter-spacing: 1px;
        background: #ebe7de;
        display: table-cell;
        text-align: center;
        vertical-align: middle;
        cursor: pointer;
        display: inline-block;
        position: relative;
        -webkit-tap-highlight-color: transparent;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        -webkit-box-shadow: 0 0 1px transparent;
        box-shadow: 0 0 1px transparent;
        display: block;
        text-decoration: none; }
        div.contents-list-topic div#contents-list-nav ul li span.active {
          width: 156px;
          height: 42px;
          position: relative;
          display: inline-block;
          color: #F6F6F6;
          text-align: center;
          z-index: 0; }
          @media screen and (max-width: 1200px) {
            div.contents-list-topic div#contents-list-nav ul li span.active {
              width: 100%; } }
          @media screen and (max-width: 768px) {
            div.contents-list-topic div#contents-list-nav ul li span.active {
              width: 100%;
              display: inline-table; } }
          div.contents-list-topic div#contents-list-nav ul li span.active:after {
            content: "";
            position: absolute;
            bottom: -8px;
            left: 50%;
            margin-left: -10px;
            display: block;
            width: 0px;
            height: 0px;
            border-style: solid;
            border-width: 10px 10px 0 10px; }
            @media screen and (max-width: 768px) {
              div.contents-list-topic div#contents-list-nav ul li span.active:after {
                display: none; } }
          div.contents-list-topic div#contents-list-nav ul li span.active:before {
            display: none; }
        div.contents-list-topic div#contents-list-nav ul li span:first-child {
          width: 139px; }
          @media screen and (max-width: 1200px) {
            div.contents-list-topic div#contents-list-nav ul li span:first-child {
              width: 100%; } }
          @media screen and (max-width: 768px) {
            div.contents-list-topic div#contents-list-nav ul li span:first-child {
              width: 100%;
              display: inline-table; } }
          div.contents-list-topic div#contents-list-nav ul li span:first-child a {
            width: 139px; }
        div.contents-list-topic div#contents-list-nav ul li span:before {
          pointer-events: none;
          position: absolute;
          z-index: -1;
          content: '';
          border-style: solid;
          -webkit-transition-duration: 0.3s;
          -o-transition-duration: 0.3s;
          transition-duration: 0.3s;
          -webkit-transition-property: bottom;
          -o-transition-property: bottom;
          transition-property: bottom;
          left: calc(50% - 10px);
          bottom: 0;
          border-width: 10px 10px 0 10px;
          border-color: #ebe7de transparent transparent transparent; }
          @media screen and (max-width: 768px) {
            div.contents-list-topic div#contents-list-nav ul li span:before {
              display: none; } }
        div.contents-list-topic div#contents-list-nav ul li span:hover:before {
          bottom: -8px; }

/*　コンテンツ　一覧*/
div#container {
  width: 1200px;
  margin-top: 50px;
  /*　コンテンツ　リスト*/ }
  @media screen and (max-width: 1200px) {
    div#container {
      width: 100%;
      background: #ffffff !important;
      margin-top: 30px; } }
  div#container div#projectlist {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 0 auto;
    overflow: hidden;
   }
    @media screen and (max-width: 1200px) {
      div#container div#projectlist {
        margin-right: 0px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column; } }
  div#container div.item {
    letter-spacing: normal;
    width: 380px;
		padding: 0 10px 40px;
    /*　投稿者　*/
    /*　コンテンツ　*/ }
    @media screen and (max-width: 1200px) {
      div#container div.item {
        width: 48%; } }
    @media screen and (max-width: 768px) {
      div#container div.item {
        width: 100%;
				padding: 0 0 5%;
			} }

    div#container div.item a {
      text-decoration: none;
      display: block;
    }

    .sp div#container div.item a {
      margin-right: 0; 
    }

      
      div#container div.item a:hover {
        opacity: 0.8; }
    div#container div.item ul.contributor {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      height: 62px;
      padding: 0 10px;
      border: 1px solid #e2cae4;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -ms-flex-align: center;
      align-items: center;
      background: #fff; }
      div#container div.item ul.contributor li.photo {
        width: 43px;
        height: 51px;
        margin-right: 12px; }
        div#container div.item ul.contributor li.photo img {
          width: 100%;
          border-radius: 100px;}
      div#container div.item ul.contributor li.name {
        font-weight: bold;
        font-size: 18px;
        color: #534254; 
        width: 170px;
      }
        @media screen and (max-width: 768px) {
          div#container div.item ul.contributor li.name {
            width: 20%; } }
      div#container div.item ul.contributor li.category-type {
        width: 108px;
        height: 23px; }
      div#container div.item ul.contributor li.hanashi {
        background: url(../../anapoke/images/category_hanashi.jpg) left top no-repeat; }
      div#container div.item ul.contributor li.genba {
        background: url(../../anapoke/images/category_genba.jpg) left top no-repeat; }
      div#container div.item ul.contributor li.kotoba {
        background: url(../../anapoke/images/category_kotoba.jpg) left top no-repeat; }
      div#container div.item ul.contributor li:last-child {
        margin-left: auto; }
    div#container div.item figure {
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      overflow: hidden;
      background: #fef8fe;
      border: 11px solid #e2cae4;
      border-bottom-left-radius: 30px;
      border-bottom-right-radius: 30px;
      /*　画像のキャプション　*/ }
      div#container div.item figure img {
        height: 245px;
        width: 363px;
        -o-object-fit: cover;
        object-fit: cover;
        font-family: 'object-fit: cover;';
				position: relative; }
        @media screen and (max-width: 1200px) {
          div#container div.item figure img {
            width: 100%; } }

			div#container div.item figure .imgbox{
				position: relative;
			}

			div#container div.item figure .imgbox:after {
				height: 62px;
				width: 62px;
				display: block;
				content: "";
				background: url(../../anapoke/images/icon_play.png) left top no-repeat;
				left: 50%;
				top: 50%;
				transform: translate(-50%, -50%);
				position: absolute;
				background-size: contain;
			}
							
							
      div#container div.item figure figcaption {
        padding: 0 20px;
        /*　画像タイトル*/
        /*　画像日付　*/
        /*　新しい記事　*/
        /*　画像のテキスト　*/
        /*　画像に出ている人　*/ }
        div#container div.item figure figcaption h3 {
          font-size: 16px;
          color: #534254;
          font-weight: bold;
          margin: 20px 0 15px;
          overflow: hidden;
          -o-text-overflow: ellipsis;
          text-overflow: ellipsis;
          white-space: nowrap; }
        div#container div.item figure figcaption div.date {
          margin-bottom: 15px;
          color: #0084ff;
          font-size: 13px;
					display: flex;
					align-items: center;
        }
        div#container div.item:first-child figure figcaption div.date::after {
          margin-left: 7px;
          content: "　　　";
          height: 14px;
          width: 35px;
          background: url(../../anapoke/images/icon_new.jpg) left top no-repeat;
        }

        div#container div.item figure figcaption p {
          margin-bottom: 25px;
          line-height: 1.4;
          height: 34px; }
          @media screen and (max-width: 992px) {
            div#container div.item figure figcaption p {
              letter-spacing: -0.8px; } }
          @media screen and (max-width: 768px) {
            div#container div.item figure figcaption p {
              height: auto; } }
        div#container div.item figure figcaption div.ana-list {
          margin-bottom: 35px;
          font-size: 12px;
          font-weight: bold;
          position: relative;
          display: inline-block; }
          div#container div.item figure figcaption div.ana-list:before {
            content: '';
            position: absolute;
            top: -10px;
            display: inline-block;
            width: 15px;
            height: 1px;
            left: 8px;
            -moz-transform: translateX(-50%);
            -webkit-transform: translateX(-50%);
            -ms-transform: translateX(-50%);
            transform: translateX(-50%); }
  div#container div.hanashi div.ana-list {
    color: #029587; }
    div#container div.hanashi div.ana-list:before {
      background-color: #029587; }
  div#container div.genba div.ana-list {
    color: #d4850a; }
    div#container div.genba div.ana-list:before {
      background-color: #d4850a; }
  div#container div.kotoba div.ana-list {
    color: #2d75ba; }
    div#container div.kotoba div.ana-list:before {
      background-color: #2d75ba; }


/* パンくず */
.topicPath a{
  color: #0084ff !important;
  text-decoration: underline !important;
}