@charset "utf-8";
/* ******************************************************************

    --base.css--
    1. Style setting
        1-1. Font styles 

    2. Layout setting
        2-1. Slider styles
        2-2. Sidebar styles
        2-3. Content styles
*/
/*==================================================================
    1. Style setting
===================================================================*/
/* ------------------------------------------------------------------
    1-1. Font styles 
-------------------------------------------------------------------*/
.news a {
  color: #0054ff;
}
.date-post {
  margin-right: 10px;
}

/*==================================================================
    2. Layout setting
===================================================================*/
/* ------------------------------------------------------------------
    2-1. Slider styles
-------------------------------------------------------------------*/
.nivo-directionNav a {
  top: 42%;
}
.nivo-directionNav a.nivo-nextNav {
  margin-right: 88px;
}
.nivo-directionNav a.nivo-prevNav {
  margin-left: 47px;
}
.nivo-controlNav a {
  background: url(../imgs/slider/pagination-off.png) no-repeat;
  width: 17px;
  height: 17px;
  text-indent: -999999px;
  padding: 0;
  margin: 6px 5px 0 5px;
}
.nivo-controlNav a.active {
  background: url(../imgs/slider/pagination-on.png) no-repeat;
  padding: 0;
  margin: 6px 5px 0 5px;
}
/*==================================================================
    2-2. Sidebar setting
===================================================================*/
#contentBlock {
  margin-top: 42px;
}
#contentInfo .shashinkan {
  display: none;
}
#sidebar .shashinkan {
  margin-bottom: 15px;
}
#articleTitle img {
  margin: 0 0 2px 11px;
}
#article {
  height: 680px;
  width: 254px;
  background: url("../imgs/index03/content/intro_15.png") center;
}
#article .article-item {
  width: 188px;
  margin: auto;
}
#article .article-item p {
  text-align: left;
  margin-top: 10px;
}
#article .article-item1 {
  padding: 53px 0 22px 0;
}
#article .article-item2 {
  padding: 34px 0 20px 0;
}
#article .article-item3 {
  padding: 42px 0 10px 0;
}
#article .border-bm {
  border-bottom: 1px #aa743f dotted;
}
#partnerWrap {
  width: 254px;
  height: 560px;
  background: url(../imgs/index03/content/intro_17.png);
  margin: 25px 0 10px 0;
}
#partnerWrap #partner {
  padding-top: 33px;
}
#partnerWrap #partner .partner-item {
  margin-top: 10px;
}

@media only screen and (max-width: 768px) {
  #contentBlock {
    display: flex;
    flex-direction: column-reverse;
  }
  #contentBlock #sidebar.
  #contentBlock #contentInfo {
    float: none;
  }
  #contentInfo {
    margin-bottom: 30px;
  }
  #contentInfo .shashinkan {
    display: flex;
    justify-content: center;
    margin-bottom: 20px;
  }
  #contentInfo .shashinkan a {
    padding: 0 15px;
  }
  #sidebar .shashinkan {
    display: none;
  }
  #article,
  #partnerWrap {
    margin-right: auto;
    margin-left: auto;
  }
}
/*==================================================================
    2-3. Content styles
===================================================================*/
.news .newsTitle {
  display: block;
}
.news .newsTitle img {
  margin: 0 0 0 11px;
}
.news .newsTitle a {
  vertical-align: 5px;
  padding-left: 14px;
}
.news .newsWrap {
  width: 642px;
  height: 400px;
  background: url(../imgs/index03/content/intro_16.png);
  margin: 0 0 38px 0;
}
.news .newsWrap .newsList {
  padding: 20px 84px 0 45px;
}
.news .newsWrap .newsList .news-item {
  padding-top: 20px;
}
#director #directorTitle img {
  margin: 0 0 7px 11px;
}
#subjects {
  margin: 93px 0 118px;
}
#subjects #emotionSubject {
  padding: 0 23px;
}
#terakoLink {
  padding: 0 4px;
}
#terakoLink > .left {
  padding-left: 6px;
}

@media only screen and (max-width: 768px) {
  .news .newsWrap {
    width: 100%;
    height: auto;
    background-size: contain;
    padding-top: 62.5%;
    margin-right: auto;
    margin-left: auto;
    position: relative;
  }
  .news .newsWrap .newsList {
    width: 100%;
    padding: 10px 20px;
    position: absolute;
    top: 0;
  }
  .news .newsWrap .newsList .news-item {
    display: flex;
    padding-top: 12px;
  }
  .news .newsWrap .newsList .news-item:nth-of-type(n+7) {
    display: none;
  }
  .news .newsWrap .newsList .news-item a {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #subjects {
    display: flex;
    justify-content: center;
    margin: 30px -5px 30px
  }
  #subjects a {
    padding: 0 5px;
  }
  #subjects img {
    float: none;
  }
  #subjects #emotionSubject {
    padding: 0;
  }
  #terakoLink {
    padding: 0;
    display: flex;
    justify-content: center;
  }
  #terakoLink > .left,
  #terakoLink > .right {
    float: none;
    padding: 0 15px;
  }

}

.pickup {
  width: 254px;
  height: 80px;
  background: url(../imgs/index03/content/intro_18.png) center;
  padding: 36px 0;
  margin-bottom: 20px;
}
.pickup .pickup-item {
  width: 188px;
  margin: auto;
}