@charset "UTF-8";

#top #headerArea .leadArea .leadText {
  text-align: center;
  width: 100%;
  padding: 0;
}

#mainArea #what {
  background-image: url('../images_new/sp/other_bg001.jpg');
  background-repeat: repeat;
  background-size: 100px;
  background-position: 50% 0;
  margin: 0;
  padding: 10% 3.1%;
}

#mainArea .topTitle1 {
  padding: 0 3% 5%;
}

#what .descArea .descText {
  color: #0c3048;
}

#mainArea #point {
  background-color: #2f8ebc;
  background-image: url('../images_new/sp/other_bottom_line.png');
  background-repeat: repeat-x;
  background-size: 100%;
  background-position: 50% 0;
  padding: 10% 3.1%;
  margin: 0;
}

#mainArea .topTitle2 {
  padding-bottom: 5%;
}

.pointArea .descArea .descText {
  color: #fff;
}

#point .pointList .columnArea.col1 {
  background-color: #fff;
  padding: 3%;
  background-image: url('../images_new/sp/top/point_contents_line.jpg');
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: 0 100%;
  margin-top: 30px;
}

#point .pointList .columnArea.col1 .pointTitle {
  color: #1d7d94;
  text-align: center;
  font-size: 130%;
  padding: 3% 0 6%;
}

#mainArea .phLink {
  padding: 10% 10% 0;
}

#mainArea #level.contentsBox {
  background-color: #2d4f5b;
  background-image:
    url(../images_new/sp/city_bottom_line.png),
    url(../images_new/sp/top/level_bg.png),
    -webkit-gradient(
        linear,
        left bottom,
        left top,
        color-stop(0, rgb(52, 111, 135)),
        color-stop(80%, rgb(31, 67, 96)),
        color-stop(100%, rgba(38, 76, 90, 1))
      );
  background-repeat: no-repeat, repeat;
  background-size: 100%, 250px;
  background-position:
    50% -1px,
    50% 0;
  padding: 20% 3.1% 10%;
  margin: 0;
}

#level #fade {
  padding-bottom: 70px;
}

#mainArea #compare {
  background-image: url('../images_new/sp/other_bg001.jpg');
  background-repeat: repeat;
  background-size: 100px;
  background-position: 50% 0;
  padding: 10% 3.1%;
  margin: 0;
}

.tabSelect04 .tabList {
  clear: both;
}

.tabSelect04 .tabList li {
  width: 49%;
  float: left;
  padding: 6% 0;
  margin-right: 0;
  text-align: center;
  font-size: 120%;
  background-color: #fff;
  border-top: solid 2px #2f8ebc;
  border-left: solid 2px #2f8ebc;
  border-right: solid 2px #2f8ebc;
  box-sizing: border-box;
}

.tabList > li:nth-child(even) {
  margin-left: 2%;
}

.tabSelect04 .tabList li.active {
  background-color: #2f8ebc;
}

.tabSelect04 .tabList li a {
  color: #2f8ebc;
}

.tabSelect04 .tabList li.active a {
  color: #fff;
}

.tabBoxArea .tabContents {
  background-color: #2f8ebc;
  padding: 4% 3% 10%;
}

.tabContents th.yellowCell {
  background-color: #feffd9;
  border: solid 2px #2f8ebc;
  font-weight: normal;
  vertical-align: middle;
  white-space: nowrap;
  padding: 12px;
  text-align: left;
}

.tabContents td.whiteCell {
  background-color: #fff;
  padding: 12px;
}

.tabContents tbody {
}

.tabContents tr {
  border: solid 2px #2f8ebc;
}

.tabContents td.whiteCell span {
  font-weight: bold;
  display: block;
}

#compare .tabContents .compareText {
  margin-top: 5%;
}

#compare .linkArea.btn.multiline {
  width: 49%;
  margin: 0;
  float: left;
  margin-top: 3%;
}
#compare .linkArea.btn.pattern3.multiline a {
  margin: -0.6rem 0;
}

#compare .tabContents ul {
  clear: both;
  overflow: hidden;
}

#compare .tabContents ul > li:nth-child(even) {
  display: block;
  margin-left: 2%;
}

#compare .tabContents ul > .linkArea.btn.multiline:nth-child(even) {
  margin-left: 2%;
}

#compare .tabContents ul + ul {
  margin-top: -5px;
}

#compare .linkArea.btn.multiline .linkText {
  padding: 12px 0;
}

#level .swiper-wrapper li .slideBox {
  background-color: #0b1f2e;
}

#level .swiper-wrapper li .slideBox p {
  color: #fff;
  padding: 3%;
  height: 6.5em;
}

#level .swiper-wrapper li .slideBox p span {
  display: block;
  font-size: 150%;
  padding-bottom: 2%;
}

#level .swiper-wrapper {
  padding-bottom: 50px;
}

#level .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 10px;
  opacity: 1;
  width: 12px;
  height: 12px;
}

#level .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #000;
}

#level .swiper-pagination-bullet {
  background: #fff;
}