/* title-area */
.title-area {
  height: 35px;
  position: relative;
  background-image: url("../img/ttl_area_bg.png");
  background-repeat: no-repeat;
}
.title-area h1 {
  position: absolute;
  top: 14px;
  left: 15px;
  height: 35px;
}
.title-area .update {
  position: absolute;
  right: 4px;
  top: 10px;
}

/* main-inner */
.main-inner {
  position: relative;
  left: -32px;
}

.head-area {
  position: relative;
}
.head-area .lead-item1 {
  position: absolute;
  top: 11px;
  left: 253px;
}
.head-area .lead-item3 {
  position: absolute;
  top: 123px;
  left: 251px;
}
.head-area .lead-item4 {
  position: absolute;
  top: 132px;
  left: 412px;
}
.head-area .lead-item7 {
	position: absolute;
	top: 171px;
	left: 580px;
}
.head-area .lead-item8 {
	position: absolute;
	top: 171px;
	left: 653px;
}
.head-area .lead-item9 {
  position: absolute;
  top: 204px;
  left: 251px;
}
.head-area .chara {
  position: absolute;
  top: 128px;
  left: 0;
  z-index: 10;
}

/* section1 */
.section1 {
  position: relative;
  height: 356px;
  background: url("../img/section1_bg.png")  left top no-repeat;
}
.section1 h2 {
  position: absolute;
  top: 0;
  left: 0;
}
.section1-inner {
  position: absolute;
  top: 107px;
  width: 100%;
  text-align: center;
}
.section1-inner .items {
  overflow: hidden;
  max-width: 700px;
  margin: 0 auto;
}
.section1-inner .item {
  width: 25%;
  float: left;
}
.section1-inner .complement {
  position: absolute;
  right: 81px;
  top: 154px;
}
.section1-inner .btn {
  position: absolute;
  right: 0;
  bottom: -69px;
  left: 0;
}

/* section2 */
.section2 {
  position: relative;
  height: 354px;
  background: url("../img/section2_bg.png")  left top no-repeat;
}
.section2 h2 {
  position: absolute;
  top: 0;
  left: 0;
}
.section2 .section2-inner {
  position: absolute;
  top: 112px;
  left: 0;
  width: 100%;
}
.section2-inner .items {
  overflow: hidden;
  max-width: 700px;
  margin: 0 auto;
}
.section2-inner .item {
  width: 25%;
  float: left;
}
.section2 .chara {
  position: absolute;
  right: 15px;
  bottom: 10px;
}

/* c-charaNav
---------------------------------- */
.c-charaNav{
  background-color: rgba(0,0,0,0.2);
  background-image: url('../img/section3_bg.png');
  padding: 0 0 30px;
}
.c-charaNav__ttl{
  height: 60px;
  text-align: center;
}
.c-charaNav__inner .items{
  max-width: 700px;
  margin: 0 auto;
  font-size: 0;
  text-align: center;
}
.c-charaNav__inner .item{
  display: inline-block;
  padding: 0 8px;
  font-size: 12px;
  vertical-align: top;
}
.c-charaNav__inner .item:nth-of-type(n+6){
  margin-top: 20px;
}
.c-charaNav__inner .item img {
  vertical-align: top;
}