@charset "UTF-8";
#mainVisual {
  background: url("../top-img/main-s@2x.png") no-repeat 50% 50%;
  background-size: cover;
  width: 100%;
  height: 493px;
}
#mainVisual img {
  display: block;
  width: 320px;
  height: 493px;
  margin: auto;
}
@media screen and (min-width:768px) {
#mainVisual {
  background: url("../top-img/main-p.png") no-repeat 50% 50%;
  background-size: cover;
  width: 100%;
  height: 850px;
  text-align: center;
  padding-top: 350px;
}
#mainVisual img {
  width: 778px;
  height: 171px;
}
}


nav ul {
  max-width: 340px;
  margin: 50px auto;
}
nav ul li {
  margin-bottom: 10px;
}
nav ul li a {
  display: block;
  max-width: 340px;
  height: 78px;
  padding-left: 220px;
  padding-top: 30px;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 340px 78px;
  color: #fff;
}
nav ul li:nth-child(1) a {
  background-image: url("../top-img/nav1-s@2x.png");
}
nav ul li:nth-child(2) a {
  line-height: 1.5;
  padding-top: 20px;
  background-image: url("../top-img/nav2-s@2x.png");
}
nav ul li:nth-child(3) a {
  background-image: url("../top-img/nav3-s@2x.png");
}
nav ul li:nth-child(4) a {
  background-image: url("../top-img/nav4-s@2x.png");
}
nav ul li:nth-child(5) a {
  background-image: url("../top-img/nav5-s@2x.png");
}
nav ul li:nth-child(6) a {
  background-image: url("../top-img/nav6-s@2x.png");
}
@media screen and (max-width:320px) {
nav ul {
  margin-left: 10px;
  margin-right: 10px;
}
nav ul li a {
  padding-left: 180px;
  background-position: 100% 0;
}
}
@media screen and (min-width:768px) {
nav ul {
  width: 980px;
  max-width: 980px;
  margin: 100px auto 80px;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
nav ul li {
  margin-bottom: 20px;
  display: -ms-flexbox;
  display: flex;
}
nav ul li a {
  display: block;
  width: 480px;
  max-width: 480px;
  height: 110px;
  padding-left: 345px;
  padding-top: 45px;
  background-size: 480px 110px;
  font-size: 1.6rem;
}
nav ul li:nth-child(1) a {
  background-image: url("../top-img/nav1-p.png");
}
nav ul li:nth-child(2) a {
  line-height: 1.35;
  padding-top: 35px;
  background-image: url("../top-img/nav2-p.png");
}
nav ul li:nth-child(3) a {
  background-image: url("../top-img/nav3-p.png");
}
nav ul li:nth-child(4) a {
  background-image: url("../top-img/nav4-p.png");
}
nav ul li:nth-child(5) a {
  background-image: url("../top-img/nav5-p.png");
}
nav ul li:nth-child(6) a {
  background-image: url("../top-img/nav6-p.png");
}
}


#idea {
  width: 100%;
  height: 800px;
  background: url("../top-img/idea-s@2x.png") no-repeat 50% 50%;
  background-size: cover;
  padding: 50px 0;
}
#idea .contentsBox {
  max-width: 340px;
  margin: auto;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 340px auto;
  padding: 35px 20px;
  text-align: center;
}
#idea .contentsBox:nth-of-type(1) {
  height: 286px;
  background-image: url("../top-img/idea-parts1-s@2x.png");
  margin-bottom: 20px;
}
#idea .contentsBox:nth-of-type(2) {
  height: 184px;
  background-image: url("../top-img/idea-parts2-s@2x.png");
  margin-bottom: 20px;
}
#idea .contentsBox:nth-of-type(3) {
  height: 184px;
  background-image: url("../top-img/idea-parts3-s@2x.png");
}
#idea .contentsBox h2 {
  font-size: 2.2rem;
  font-weight: normal;
  letter-spacing: 0.1em;
  height: 38px;
  background: url("../img/text-line1@2x.png") no-repeat 50% 100%;
  background-size: 50px 1px;
  margin-bottom: 15px;
}
#idea .contentsBox:nth-of-type(1) .copy {
  font-size: 2.4rem;
  font-weight: bold;
  letter-spacing: 0.05em;
  line-height: 1.3;
}
#idea .contentsBox .text {
  font-size: 1.4rem;
  line-height: 1.75;
  margin-top: 15px;
}
#idea .contentsBox:nth-of-type(1) .text {
  text-align: left;
}
#idea .contentsBox:nth-of-type(1) .text br {
  display: none;
}
@media screen and (max-width:320px) {
#idea .contentsBox {
  background-position: 50% 12%;
  background-size: 300px auto;
}
#idea .contentsBox .text {
  font-size: 1.3rem;
  line-height: 1.6;
  margin-top: 10px;
}
}
@media screen and (min-width:768px) {
#idea {
  width: 100%;
  height: 820px;
  background: url("../top-img/idea-p.png") no-repeat 50% 50%;
  background-size: cover;
  padding: 100px 0;
}
#idea .boxIn {
  width: 980px;
  margin: auto;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
}
#idea .contentsBox {
  max-width: 980px;
  margin: auto;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: auto auto;
  padding: 60px 0 0;
  text-align: center;
}
#idea .contentsBox:nth-of-type(1) {
  width: 980px;
  height: 292px;
  background-image: url("../top-img/idea-parts1-p.png");
  margin-bottom: 50px;
}
#idea .contentsBox:nth-of-type(2) {
  width: 465px;
  height: 278px;
  background-image: url("../top-img/idea-parts2-p.png");
  margin-bottom: 0;
  margin-right: 50px;
}
#idea .contentsBox:nth-of-type(3) {
  width: 465px;
  height: 278px;
  background-image: url("../top-img/idea-parts3-p.png");
}
#idea .contentsBox h2 {
  font-size: 2.8rem;
  height: 50px;
  background: url("../img/text-line1@2x.png") no-repeat 50% 100%;
  background-size: 50px 1px;
  margin-bottom: 15px;
}
#idea .contentsBox:nth-of-type(1) .copy {
  font-size: 3.4rem;
  line-height: 1;
  margin-bottom: 30px;
}
#idea .contentsBox .text {
  font-size: 1.7rem;
  line-height: 2.2;
  margin-top: 15px;
}
#idea .contentsBox:nth-of-type(1) .text {
  text-align: center;
  font-size: 1.5rem;
  line-height: 1.7;
}
#idea .contentsBox:nth-of-type(1) .text br {
  display: block;
}
}