/* Scss Document */
/* Scss Document */
#main_contents {
  padding: 50px 0;
  background: #D3DFE4 }
  #main_contents .inner {
    -webkit-display: flex;
    -moz-display: flex;
    -ms-display: flex;
    -o-display: flex;
    display: flex;
    justify-content: space-between; }

.title_area{
  margin-bottom: 40px;
  -webkit-display: flex;
  -moz-display: flex;
  -ms-display: flex;
  -o-display: flex;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.article_area {
  width: 800px; }
  .article_area article {
    margin: 0 0 30px 0;
    padding: 30px;
    background: #fff; }
    .article_area article .date {
      padding: .5em 0;
      color: #fff;
      font-weight: bold;
      font-size: 2rem;
      letter-spacing: .1em;
      line-height: 1.2; 
      background: #0059B2;
      width: 120px;
      height: 120px;
      display: block;
    text-align: center;
  line-height: 1.1;}
      .article_area article .date span{
        font-size: 5rem;
        display: block;
      }
    .article_area article .article_ttl {
      color: #0059B2;
      font-size: 2.6rem;
      font-weight: bold;
      letter-spacing: .1em;
      line-height: 1.4; 
    width: 600px;}
    .article_area article p {
      margin-bottom: 1.5em;
      color: #444;
      font-size: 1.6rem;
      letter-spacing: .1em;
      line-height: 1.6; }
    .article_area article figure {
      margin-bottom: 1.5em; }
  .article_area .pager {
    text-align: center; }
    .article_area .pager_item {
      display: inline-block;
      width: 36px;
      height: 36px;
      margin: 0 6px;
      background: #0A377F;
      color: #FFF;
      font-size: 1.6em;
      line-height: 36px; }
      .article_area .pager_item a {
        display: block;
        background: #F2F2F2;
        color: #1F1F1F; }
        .article_area .pager_item a:hover {
          opacity: .6;
          transition: .5s; }

#side {
  width: 300px;
  padding: 0 30px 0 0; }
  #side .side_ttl,
  .widget-title {
    padding: .5em 1em;
    margin-bottom: 10px;
    color: #fff;
    background: #0059B2;
    font-size: 1.6rem;
    font-weight: bold;
    letter-spacing: .2em;
    line-height: 1.2;
  text-align: center;}
  #main_side ul,
  #side .side_list {
    margin-bottom: 60px; }
    #main_side li,
    #side .side_list_item {
      border-bottom: dotted 1px #888;
      margin-bottom: .75em;
      padding-bottom: .75em;
      font-size: 1.4rem;
      letter-spacing: .05em;
      line-height: 1.6; }

@media screen and (max-width: 640px) {
  #main_contents {
    padding: 5.2631578947vw 0;
  }
    #main_contents .inner {
      display: block; }

  .article_area {
    width: 100%;
    margin-bottom: 5.2631578947vw; }
    .article_area article {
      margin: 0 0 20px 0;
      padding: 2.6315789474vw;
      background-size: 30vw; }
      .title_area{
        display: block;
      }
      .article_area article .date {
        margin: 0 auto 2em;
        padding: .5em 1.5em;
        height: auto;
        width: 25%;
        font-size: 2.8947368421vw;
      line-height: 1; }
        .article_area article .date span{
          font-size: 11vw; }
      .article_area article .article_ttl {
        width: 100%;
        margin-bottom: 3.9473684211vw;
        font-size: 3.9473684211vw; }
      .article_area article p {
        font-size: 3.333333333vw; }
    .article_area .pager_item {
      width: 5.2631578947vw;
      height: 5.2631578947vw;
      margin: 0 0.6578947368vw;
      font-size: 2.8947368421vw;
      line-height: 5.2631578947vw; }

  #side {
    width: 100%;
    padding: 0; }
    #side .side_ttl {
      padding-bottom: 1.3157894737vw;
      margin-bottom: 1.3157894737vw;
      font-size: 2.8947368421vw; }
    #side .side_list {
      margin-bottom: 5.2631578947vw; }
      #side .side_list_item {
        font-size: 2.6315789474vw; } }