@charset "UTF-8";

main {
}

.top .balloon {
  margin: 1rem auto !important;
}

.top .document section h2 {
	background: url(../img/parts/h2midashi.svg) no-repeat 0.5rem center /auto 2.4em var(--c-main);
}

.top_about section {
	background: linear-gradient(to right, transparent 40%, #fff 60%), url(../img/fv.webp) no-repeat left -4rem top/auto 14rem;
}

.top_about h1 {
  padding: 1rem;
	width: 65%;
	margin: 0 0 0 auto;
	font-size: 1rem;
	text-align: center;
	font-weight: 900;
}
.top_about h1 span {
	font-size: 80%;
}

.top_about div {
  padding: 1.5rem 1rem;
	background-color: #fff;
}

.top_about div:before {
	content: "";
	display: block;
	float: left;
	background: #fff no-repeat url(../img/chara/char_niyari@2x.webp) top left/auto 100%;
	width: 7rem;
	height: 11rem;
	margin-right: 0.5rem;
	margin-bottom: 0.5rem;
}

.top_about div:after {
  content:"";
  display: block;
  clear: both;
}

.top_recommend h2 ~ div,
.top_review h2 ~ div {
	padding: 0 1rem 2rem;
}

.top_review ul.reviewlist {
  padding: 0;
}

.top_review ul.reviewlist li {
  padding: 0;
}

.top_review ul.reviewlist li a p {
}

.top .postlist-top {
	padding: 0;
}




.top_contents h3 {
	background: no-repeat url(../img/parts/h3midashi.svg) .5em center/auto 70% var(--c-red);
	font-size: 1.1rem;
	color: #fff;
	line-height: 3;
	padding-left: 2em;
}

.top .top_contents .balloon {
	margin: 1rem auto 0 !important;
	padding: 0 1rem;
}

.top .top_contents .btnArea {
	margin-top: 0;
	margin-bottom: 2rem;
	padding: 0 1rem;
}


@media (min-width:744px) {
  .top .side {
    top: 9rem;
  }
  .top_about {
    margin-top: 1.5rem;
  }
  
  .top_about section {
    background: linear-gradient(to right, transparent 40%, #fff 60%), url(../img/fv@2x.webp) no-repeat left -6rem top -2rem/auto 28rem;
  }

  .top_about h1 {
    padding: 2rem;
    width: 60%;
  }

  .top_about h1 span {
    font-size: 1.2rem;
  }

  .top_about div {
    padding: 2rem 4rem;
  }

  .top_about div:before {
    background-image:url(../img/chara/char_niyari@3x.webp);
  }

}

@media ( min-width:1280px ) {
  main {
    padding-top: 0;
  }

  .top_about section {
    background: linear-gradient(to right, transparent 30%, #fff 70%), url(../img/fv@3x.webp) no-repeat left -6rem top -4rem/auto 33rem;
  }

  .top_about h1 img {
    margin-left: auto;
  }




}
