@charset "UTF-8";

/* =====================================
design
------------------------------------- */
.box-blue-01 {
  padding: 30px 0 20px;
  min-height: 210px;
  background: #0135e9;
}
.box-blue-01 div {
  width: 370px;
  margin: 0 auto;
}
.box-blue-01 div p {
  height: 66px;
  color: #fff;
}
.box-blue-01 div p img {
  float: left;
  margin-right: 25px;
}

.box-blue-01 div p span {
  display: block;
}
.box-blue-01 div ul li {
  float: left;
}
.box-blue-01 div ul li:last-child {
  float: right;
}


.box-yellow-01 {
  min-height: 230px;
  padding: 30px 0 20px;
  background: #e9b226;
}
.box-yellow-01 .wrapper-box {
  width: 750px;
  margin: 0 auto;
}
.box-yellow-01 .wrapper-box .col:first-child {
  float: left;
  width: 150px;
}
.box-yellow-01 .wrapper-box .col:first-child p {
  text-align: left;
}
.box-yellow-01 .wrapper-box .col:last-child {
  float: right;
  width: 600px;
}

@media only screen and (max-width: 768px) {
  .box-yellow-01 {
      margin-top: 0;
      min-height: inherit;
	}
  .box-yellow-01 .wrapper-box {
      width: 90%;
	  margin: 0 auto;
    }
  .box-yellow-01 .wrapper-box .col:first-child,
  .box-yellow-01 .wrapper-box .col:last-child {
      float: none;
	  width: 100%;
	}
  .box-yellow-01 .wrapper-box .col:first-child p {
	  text-align: center;
	}
}

.box-appinfo-01 h2 {
  margin-bottom: 60px;
  font-size: 200%;
  font-weight: bold;
  text-align: center;
}

.box-appinfo-01 .lyt-img-01 {
  margin-bottom: 50px;
}

.box-appinfo-01 .lyt-img-01 .caption {
  font-size: 140%;
  font-weight: bold;
  color: #000;
}

.box-download-app {
  height: 384px;
  margin-bottom: 30px;
  background: url(images/download_bg.jpg) no-repeat 50% 50% #ebece9;
}
.box-download-app div {
  width: 580px;
  margin: 0 auto;
}
.box-download-app h3 {
  margin-bottom: 50px;
  padding: 80px 0 0;
  font-size: 180%;
  font-weight: bold;
  text-align: center;
}
.box-download-app ul li {
  float: left;
}
.box-download-app ul li:last-child {
  float: right;
}

@media only screen and (max-width: 768px) {
  .box-appinfo-01 h2 {
    margin-bottom: 40px;
	}
}

@media only screen and (max-width: 640px) {
  .box-download-app div {
    width: 100%;
    padding-bottom: 10px;
	}
  .box-download-app h3 {
    margin-bottom: 20px;
    padding-top: 30px;
	}
}

@media only screen and (max-width: 400px) {
  .box-download-app {
    height: auto;
	}
  .box-blue-01 div {
    width: 100%;
	}
  .box-blue-01 div p {
    margin: 0 20px 30px;
	}
  .box-blue-01 div ul {
    margin: 0;
	}
  .box-blue-01 div ul li,
  .box-blue-01 div ul li:last-child {
    float: none;
    width: 60%;
    margin: 0 auto 20px;
    text-align: center;
	}
  .box-blue-01 div ul li:last-child {
    margin-bottom: 0;
	}
  .box-blue-01 div ul li img {
    width: 100%;
    height: auto;
	}
}