@charset "UTF-8";
div.main {
 padding: 155px 0 0 0;
}
div.main li {
 background-color: #FFF;
}
div.main img {
 width: 100%;
}
.title01 span {
 background: url(../images/top01.png) no-repeat left bottom;
 padding: 0 0 20px 5px;
}
ul.package {
 text-align: center;
 letter-spacing: -.4em;
}
ul.package li {
 display: inline-block;
 letter-spacing: normal;
 margin: 0 20px;
}
ul.package li p.quasi {
 background: url(../images/top06.png) no-repeat center center;
 line-height: 26px;
 color: #FFF;
 font-size: 12px;
}
ul.package li p.quasi.cosmetics {
 background: url(../images/top06-2.png) no-repeat center center;
 color: #01aee4;
}

ul.package li dl {
 text-align: left;
 display: inline-block;
 margin: 5px 0 0 0;
}
ul.package li dl dt {
 font-weight: bold;
}
p.btn01 {
 text-align: center;
 margin: 80px 0 25px 0;
}
p.date {
 text-align: center;
 margin: 25px 0 25px 0;
 font-size: 200%;
}

.title02.checksheet {
 background: url(../images/top08.png) no-repeat center top;
}
.title02.features {
 background: url(../images/top13.png) no-repeat center top;
}
div.checksheet_bg {
 background:#1f5e61 url(../images/top12.png) no-repeat center center;
 position: relative;
 height: 461px;
 margin-bottom: 225px;
 padding: 40px 0 0 0;
}
p.illust01 {
 position: absolute;
 left: 50%;
 top: -20px;
 margin: 0 0 0 -386px;
}
p.illust02 {
 position: absolute;
 right: 50%;
 bottom: 10px;
 margin: 0 -400px 0 0;
}
div.checksheet_bg ul {
 background: url(../images/top09.png) no-repeat 0 0;
 width: 360px;
 height: 329px;
 margin: 0 auto;
 font-size: 24px;
 font-weight: bold;
 padding: 90px 0 0 140px;
 line-height: 2.1;
}
p.balloon {
 position: absolute;
 bottom: -190px;
 left: 50%;
 background-color: #fffbba;
 width: 260px;
 height: 260px;
 text-align: center;
 font-size: 24px;
 font-weight: bold;
 border-radius: 130px;
 -webkit-border-radius: 130px;
 -moz-border-radius: 130px;
 margin: 0 0 0 -130px;
 line-height: 1.45;
}
p.balloon::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: 0;
  right: 0;
  bottom: -10px;
  margin: 0 auto;
  border-top: 10px solid #fffbba;
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
}
p.balloon span {
 font-size: 18px;
 display: block;
 padding: 80px 0 10px 0;
}
p.balloon strong {
 color: #51aad6;
}
.checksheet-at {
	position: absolute;
	right: 10px;
	bottom: 10px;
	color: #FFF;
	font-size: 12px;
}
@media screen and (max-width: 700px) {
	.checksheet-at {
		bottom: inherit;
		top: 15px;
		color: #FFF;
		font-size: 10px;
	}
}

ul.features_list {
 text-align: center;
 letter-spacing: -.4em;
}
ul.features_list li {
 display: inline-block;
 letter-spacing: normal;
 margin: 0 20px;
 max-width: 368px;
 text-align: left;
 vertical-align: top;
}
ul.features_list li h2 {
 font-size: 18px;
 margin: 20px 0;
}
.at {
	text-align: right;
	max-width: 1230px;
	margin: 0 auto;
	padding: 0 50px;
	font-size: 12px;
}
@media screen and (max-width: 700px) {
	.at {
		padding: 0 20px;
		font-size: 10px;
	}
}




@media screen and (max-width: 700px) {
 div.main {
  padding: 87px 0 20px 0;
  background-color: #FFF;
  border-bottom: 2px solid #f5f5f5;
 }
 div.main img {
  width: 100%;
 }
 .title01 span {
  background: url(../images/top01.png) no-repeat left bottom;
  background-size: 240px auto;
  padding: 0 0 10px 0;
 }
 ul.package {
  margin: 0 2%;
 }
 ul.package li {
  margin: 0;
  width: 49%;
  float: left;
 }
 ul.package li:nth-child(even) {
  float: right;
 }
 ul.package li dl {
  text-align: center;
 }
 ul.package li dl dt {
  letter-spacing: -0.07em;
 }
 p.btn01 {
  text-align: center;
  margin: 40px 0 25px 0;
 }
 p.date {
  text-align: center;
  margin: 25px 0 25px 0;
 }
 
 .title02.checksheet {
  background: url(../images/top08_sp.png) no-repeat center top;
  background-size: 300px auto;
 }
 .title02.features {
  background: url(../images/top13_sp.png) no-repeat center top;
  background-size: 300px auto;
 }
 div.checksheet_bg {
  background:#1f5e61 url(../images/top12_sp.png) no-repeat center top;
  background-size: 380px auto;
  position: relative;
  height: 325px;
  margin-bottom: 240px;
  padding: 40px 0 0 0;
 }
 p.illust01 {
  position: absolute;
  left: 50%;
  top: 10px;
  margin: 0 0 0 -145px;
  width: 72px;
 }
 p.illust02 {
  position: absolute;
  right: 50%;
  bottom: 5px;
  margin: 0 -150px 0 0;
  width: 80px;
 }
 div.checksheet_bg ul {
  background: url(../images/top09_sp.png) no-repeat center 0;
  background-size: 300px auto;
  width: 230px;
  height: 282px;
  margin: 0 auto;
  font-size: 18px;
  font-weight: bold;
  padding: 32px 0 0 70px;
  line-height: 2.45;
 }
 p.balloon {
  position: absolute;
  bottom: -215px;
  left: 50%;
  background-color: #fffbba;
  width: 260px;
  height: 260px;
  text-align: center;
  font-size: 24px;
  font-weight: bold;
  border-radius: 130px;
  -webkit-border-radius: 130px;
  -moz-border-radius: 130px;
  margin: 0 0 0 -130px;
  line-height: 1.45;
 }
 p.balloon::before{
   content: '';
   position: absolute;
   display: block;
   width: 0;
   height: 0;
   left: 0;
   right: 0;
   bottom: -10px;
   margin: 0 auto;
   border-top: 10px solid #fffbba;
   border-right: 10px solid transparent;
   border-left: 10px solid transparent;
 }
 p.balloon span {
  font-size: 16px;
  display: block;
  padding: 80px 0 10px 0;
 }
 p.balloon strong {
  color: #51aad6;
 }

 ul.features_list {
  text-align: center;
  letter-spacing: -.4em;
 }
 ul.features_list li {
  display: inline-block;
  letter-spacing: normal;
  margin: 0 20px 40px 20px;
  max-width: inherit;
  text-align: left;
  vertical-align: top;
 }
 ul.features_list li p:nth-child(1) {
  text-align: center;
 }
 ul.features_list li h2 {
  font-size: 18px;
  margin: 20px 0 15px 0;
 }
}
