/*//////////////////////////////////////////////////////////////////////////////

index.css

//////////////////////////////////////////////////////////////////////////////*/
#contents {
  padding: 0 0 120px 0;
}
#contents .titArea{
  position: relative;
  display: table;
  width: 80%;
  margin: 0 auto;
}
#contents .tit{
  display: table-cell;
  vertical-align: bottom;
  text-align: left;
  color: #555;
  padding-right: 10%;
  vertical-align: middle;
}
#contents .titArea h2{
  font-family: 'Roboto Slab', serif;
  font-size:36px;
  letter-spacing: 0.08em;
  line-height: 1.4;
  width: 100%;
  margin-bottom: 0;
}
#contents .titArea h2 span{
  font-size: 26px;
}
#contents .titArea h3{
  margin-top: 40px;
  font-size: 15px;
  letter-spacing: 0.05em;
}
#contents .titArea h3 br{
  display: none;
}
#contents .btScroll{
  position: absolute;
  bottom: 0;
  left: 0;
}

#contents .contentsNavi{
  padding-top: 60px;
}
#contents .contentsNavi li{
  margin-bottom: 60px;
}
#contents .contentsNavi li:last-child{
  margin-bottom: 0;
}
#contents .contentsNavi li dd{
  padding: 20px;
}
#contents .contentsNavi li dd h4{
  font-size: 17px;
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#contents .contentsNavi li dd p{
  margin-top: 5px;
}
#contents .bt_link{
  margin-top: 15px;
}
#contents .bt_link a{
  display: inline-block;
  padding: 6px 28px;
  font-family: 'Open Sans', sans-serif;
  font-weight: 600;
  font-size: 15px;
  line-height: 1.1;
  color: #fff;
  background: #5ac2d8;
  border-radius: 20px;
  transition-duration: .4s;
  transition-property: background;
}
#contents .bt_link a:hover{
  background: #6eb92b;
}

#contents .bannerArea{
  margin-top: 60px;
  text-align: center;
}



/* Responsive Styles
======================================== */
@media only screen and (max-width: 1280px) {
  #contents .titArea h2{
    font-size:28px;
  }
  #contents .titArea h2 span{
    font-size: 20px;
  }
  #contents .titArea h3{
    font-size: 13px;
  }
}
@media only screen and (max-width: 1080px) {
  #contents .titArea h2{
    font-size:24px;
    letter-spacing: 0.04em;
  }
  #contents .titArea h2 span{
    font-size: 18px;
  }
  #contents .titArea h3{
    font-size: 13px;
  }
  #contents .titArea h3 br{
    display: block;
  }
}
@media only screen and (max-width: 768px) {
  #contents .titArea{
    position: absolute;
    z-index: 8888;
    display: block;
    width: 100%;
    margin: 0 auto;
    top:60px;
  }
  #contents .titArea .tit{
    top: 20px;
    left: 20px;
    position: absolute;
    display: block;
  }
  #contents .titArea .btScroll{
    left: 20px;
  }
  #contents .titArea h2,
  #contents .titArea h3{
    color: #fff;
    white-space: nowrap;
  }
  #contents .titArea h3{
    margin-top: 20px;
  }
}
@media only screen and (max-width: 480px) {
  #contents .titArea h3{
    font-size: 12px;
    letter-spacing: 0.01em;
  }
  #contents .contentsNavi li dd br{
    display: none;
  }
  #contents .bt_link a{
    display: block;
    padding: 12px 0;
    width: 100%;
    text-align: center;
  }
}