@charset "utf-8";

body {
  box-sizing: border-box;
  margin: 0px auto;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  line-height: 1.5;
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
  color: #333;
}

body * {
 box-sizing: border-box;
}

img {
  width: 100%;
  display: block;
}

/*** headline ***/

h1,h2,h3 {
  width: auto;
  font-weight: bold;
}

h1,h2 {
  color: #0033AF;
  font-size: 20px;
  margin-bottom: 20px;
  font-weight: bold;
  text-align: center;
}


p {
  margin-bottom: 20px;
}

.header-wrap > p:last-child,
.wrap01 > p:last-child {
  margin-bottom: 0;
}

.top_qrcd {
  color: #CC0033;
  font-weight: bold;
  margin-top: 20px;
  padding-bottom: 0;
  text-align: center;
}

.top_qrcd img {
  margin: auto;
  width: 192px;
}

/* レイアウト共通 */

.header-top,
.header-wrap,
.wrap01 {
  display: block;
  max-width: 640px;
  margin: 0 auto;
  padding: 40px 20px;
}

.wrap01 {
  padding: 40px 20px;
  border-top: 1px solid #0033AF;
}

.sp-br {
    display: block;
  }


.header-top {
  padding: 5px 20px;  
  background-color: #0033AF;
  font-size: 20px;
  text-align: center;
  color: #fff;
}

.header-wrap img {
  border-radius: 5px;
}

.header-wrap .btn-orange {
  max-width: 320px;
  margin: 40px auto auto;
}

/*** 機能一覧 ***/

.function-table-box {
  position: relative;
  margin-top: 66px;
}

h2 + .function-table-box {
  margin-top: 0;
}

.baloon {
  position: absolute;
  top: -60px;
  right: 0px;
}

.baloon {
  padding: 5px 5px 7px;
  background-color: #fff;
  border: 2px solid #FF5A00;
  border-radius: 5px;
  font-size: 14px;
  color: #FF5A00;
  font-weight: bold;
} 

.baloon:before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  bottom: -10px;
  right: 34px;
  z-index: 0;
  border-style: solid;
  border-right: 8px solid transparent;
  border-left: 8px solid transparent;
  border-bottom: 10px solid #FF5A00;
  border-top: 0;
  transform: rotate(180deg);
}

.baloon:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  bottom: -8px;
  right: 36px;
  z-index: 1;
  border-style: solid;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
  border-bottom: 8px solid #FFF;
  border-top: 0;
  transform: rotate(180deg);
}

.function-table {
  width: 100%;
  margin: 0 auto 20px;
}

.function-table th,
.function-table td {
  padding: 8px 4px 7px;
  text-align: center;
  border-left: 1px solid #0033AF;
  border-bottom: 1px solid #0033AF;
  font-size: 14px;
}

.function-table tr:nth-of-type(1) th {
  background-color: #0033AF;
  padding: 8px 0 7px;  
  color: #fff;
  font-size: 13px;  
}

.function-table tr:first-of-type th:first-of-type {
  border-radius: 5px 0 0 0;
}

.function-table tr:first-of-type th:last-of-type {
  border-radius: 0 5px 0 0;
}

.function-table tr:last-of-type th {
  border-radius: 0 0 0 5px;
}

.function-table tr:last-of-type td:last-of-type {
  border-radius: 0 0 5px 0;
}


.function-table tr:first-of-type th:nth-of-type(n+2) {
  border-left: 1px solid #fff;
}


.function-table tr:nth-of-type(n+2) th{
  width: 28%;
  text-align: left;  
}

.function-table tr:nth-of-type(1) th:nth-of-type(n+2),
.function-table tr:nth-of-type(n+2) td {
  width: calc(72% / 3);
}

h2 + .function-table-box tr:nth-of-type(1) th:nth-of-type(n+2),
h2 + .function-table-box tr:nth-of-type(n+2) td {
  width: calc(72% / 2);
}

.function-table tr:nth-of-type(n+2) td:nth-of-type(2) {
  background-color: #E5EBF7;
}

.function-table tr:nth-of-type(n+2) td:last-of-type{
  background-color: #CCD6EF;
  border-right: 1px solid #0033AF;
}

[class^="tbl-"] {
  display: block;
  margin: 0 auto;
  text-align: center;
}

.tbl-cross,
.tbl-round {
  width: 18px;
  height: 18px;
  background: no-repeat url("../img/lpimg/common_img/cross.png");
  background-size: 18px auto;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

.tbl-round {
  background: no-repeat url("../img/lpimg/common_img/round.png");
  background-size: 18px auto;
}

.tbl-notes {
  margin-top: 2px;
}

.list-notes01 {
  display: flex;
  justify-content: start;
  flex-wrap: wrap;
}

.list-notes01 dt {
  width: 2em;
}

.list-notes01 dd {
  width: calc(100% - 2em);
}

/*** 機能詳細 ***/
.function-list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.function-list li{
  width: 100%;
  height: 47%;
}

.function-list li.box-half {
  width: 47%;
}

/*** 機能詳細画像設定 ***/

[class^="function-listimg"] {
  display: block;
  width: 100%;
  height: 0;
  margin-bottom: 10px;
  padding-top: 47%;
  background-size: cover;
  background-position: center;
  border: 1px solid #ccc;
  border-radius: 5px;
}

.box-half [class^="function-listimg"] {
  padding-top: 100%;
}

/* スマホトップ */

.function-listimg-smarttop01-01 {
  background-image: url("../img/lpimg/android/smarttop01-01.png?20250513");
}

.function-listimg-smarttop01-02 {
  background-image: url("../img/lpimg/android/smarttop01-02.png?20250513");
}

.function-listimg-smarttop02-01 {
  background-image: url("../img/lpimg/android/smarttop02-01.png?20250513");
}

.function-listimg-smarttop02-02 {
  background-image: url("../img/lpimg/android/smarttop02-02.png?20250513");
}

.function-listimg-smarttop02-03 {
  background-image: url("../img/lpimg/android/smarttop02-03.png?20250513");
}

.function-listimg-smarttop03-01 {
  background-image: url("../img/lpimg/android/smarttop03-01.png?20250513");
}

.function-listimg-smarttop03-02 {
  background-image: url("../img/lpimg/android/smarttop03-02.png?20250513");
}

/*  カーナビ */

.function-listimg-car01-01 {
  background-image: url("../img/lpimg/android/car01-01.png?20250513");
}

.function-listimg-car01-02 {
  background-image: url("../img/lpimg/android/car01-02.png?20250513");
}

.function-listimg-car01-03 {
  background-image: url("../img/lpimg/android/car01-03.png?20250513");
}

.function-listimg-car02-01 {
  background-image: url("../img/lpimg/android/car02-01.png?20250513");
}

.function-listimg-car02-02 {
  background-image: url("../img/lpimg/android/car02-02.png?20250513");
}

.function-listimg-car03-01 {
  background-image: url("../img/lpimg/android/car03-01.png?20250513");
}

.function-listimg-car03-02 {
  background-image: url("../img/lpimg/android/car03-02.png?20250513");
}


/*  住宅地図 */

.function-listimg-housing01-01 {
  background-image: url("../img/lpimg/android/housing01-01.png?20250513");
}

.function-listimg-housing01-02 {
  background-image: url("../img/lpimg/android/housing01-02.png?20250513");
}

.function-listimg-housing02-01 {
  background-image: url("../img/lpimg/android/housing02-01.png?20250513");
}

.function-listimg-housing02-02 {
  background-image: url("../img/lpimg/android/housing02-02.png?20250513");
}

.function-listimg-housing02-03 {
  background-image: url("../img/lpimg/android/housing02-03.png?20250513");
}

.function-listimg-housing02-04 {
  background-image: url("../img/lpimg/android/housing02-04.png?20250513");
}

.function-listimg-housing03-01 {
  background-image: url("../img/lpimg/android/housing03-01.png?20250513");
}

.function-listimg-housing03-02 {
  background-image: url("../img/lpimg/android/housing03-02.png?20250513");
}

.function-listimg-housing03-03 {
  background-image: url("../img/lpimg/android/housing03-03.png?20250513");
}


/*  バス */

.function-listimg-bus01-01 {
  background-image: url("../img/lpimg/android/bus01-01.png?20250513");
}

.function-listimg-bus01-02 {
  background-image: url("../img/lpimg/android/bus01-02.png?20250513");
}

.function-listimg-bus01-03 {
  background-image: url("../img/lpimg/android/bus01-03.png?20250513");
}

.function-listimg-bus01-04 {
  background-image: url("../img/lpimg/android/bus01-04.png?20250513");
}


/* スマホトップ -ios- */

.function-listimg-ios-smarttop01-01 {
  background-image: url("../img/lpimg/ios/smarttop01-01.png?20250513");
}

.function-listimg-ios-smarttop01-02 {
  background-image: url("../img/lpimg/ios/smarttop01-02.png?20250513");
}

.function-listimg-ios-smarttop02-01 {
  background-image: url("../img/lpimg/ios/smarttop02-01.png?20250513");
}

.function-listimg-ios-smarttop02-02 {
  background-image: url("../img/lpimg/ios/smarttop02-02.png?20250513");
}

.function-listimg-ios-smarttop02-03 {
  background-image: url("../img/lpimg/ios/smarttop02-03.png?20250513");
}

.function-listimg-ios-smarttop03-01 {
  background-image: url("../img/lpimg/ios/smarttop03-01.png?20250513");
}

.function-listimg-ios-smarttop03-02 {
  background-image: url("../img/lpimg/ios/smarttop03-02.png?20250513");
}

/*  カーナビ -ios- */

.function-listimg-ios-car01-01 {
  background-image: url("../img/lpimg/ios/car01-01.png?20250513");
}

.function-listimg-ios-car01-02 {
  background-image: url("../img/lpimg/ios/car01-02.png?20250513");
}

.function-listimg-ios-car01-03 {
  background-image: url("../img/lpimg/ios/car01-03.png?20250513");
}

.function-listimg-ios-car02-01 {
  background-image: url("../img/lpimg/ios/car02-01.png?20250513");
}

.function-listimg-ios-car02-02 {
  background-image: url("../img/lpimg/ios/car02-02.png?20250513");
}

.function-listimg-ios-car03-01 {
  background-image: url("../img/lpimg/ios/car03-01.png?20250513");
}

.function-listimg-ios-car03-02 {
  background-image: url("../img/lpimg/ios/car03-02.png?20250513");
}


/*  住宅地図 -ios- */

.function-listimg-ios-housing01-01 {
  background-image: url("../img/lpimg/ios/housing01-01.png?20250513");
}

.function-listimg-ios-housing01-02 {
  background-image: url("../img/lpimg/ios/housing01-02.png?20250513");
}

.function-listimg-ios-housing02-01 {
  background-image: url("../img/lpimg/ios/housing02-01.png?20250513");
}

.function-listimg-ios-housing02-02 {
  background-image: url("../img/lpimg/ios/housing02-02.png?20250513");
}

.function-listimg-ios-housing02-03 {
  background-image: url("../img/lpimg/ios/housing02-03.png?20250513");
}

.function-listimg-ios-housing02-04 {
  background-image: url("../img/lpimg/ios/housing02-04.png?20250513");
}

.function-listimg-ios-housing03-01 {
  background-image: url("../img/lpimg/ios/housing03-01.png?20250513");
}

.function-listimg-ios-housing03-02 {
  background-image: url("../img/lpimg/ios/housing03-02.png?20250513");
}

.function-listimg-ios-housing03-03 {
  background-image: url("../img/lpimg/ios/housing03-03.png?20250513");
}


/*  バス -ios- */

.function-listimg-ios-bus01-01 {
  background-image: url("../img/lpimg/ios/bus01-01.png?20250513");
}

.function-listimg-ios-bus01-02 {
  background-image: url("../img/lpimg/ios/bus01-02.png?20250513");
}

.function-listimg-ios-bus01-03 {
  background-image: url("../img/lpimg/ios/bus01-03.png?20250513");
}

.function-listimg-ios-bus01-04 {
  background-image: url("../img/lpimg/ios/bus01-04.png?20250513");
}


/*** ご注意事項 ***/
.note-list li {
  margin-bottom: 20px;
}

/*** フロート***/

.display-float {
  width: 100%;
  padding: 20px;
  position: fixed;
  left: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 2;
}

.plan-btn-list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  max-width: 640px;
  margin: 0 auto;
}

.one-btn li {
  width: 100%;
}

.two-btn li {
  width: 48%;
}

.float-link {
  max-width: 640px;
  margin: 20px auto 0;
  text-align: center;
}

.float-link a {
  color: #fff;
  margin: 0 auto;
  text-decoration: underline;
}

.btn-orange,
.plan-btn-list li a{
  display: block;
  width: 100%;
  padding: 5px 0;
  background-color: #FF5A00;
  border: 1px solid #FF5A00;  
  border-radius: 5px;
  text-align: center;
  vertical-align: middle;
  color: #fff;
  font-size: 18px;
}

/*
.btn-orange:hover,
.plan-btn-list li a:hover {
  background-color: #FFEADF;
  border: 1px solid #FF5A00;
  color: #FF5A00;

}
*/

.btn-orange {
  display: flex;
  min-height: 50px;
  margin-top: 20px;
  justify-content: center;
  align-items: center;
}

.plan-btn-list li a span:first-child {
  display: block;
}

.pc-float {
  color: #fff;
  text-align: center;
  margin-bottom: 0px;
}

/*** お知らせ ***/

.info > ol li {
  margin-bottom: 20px;
}

.info > ol li a {
  position: relative;
  display: block;
  padding: 10px 20px 10px 10px;  
  background: #f3f7ff;
  border: 1px solid #0033AF;
  border-radius: 5px;  
  text-decoration: none;
}

.lp-footer li a:after,
.info > ol li a:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 10px;
  display: inline-block;
  width: 8px;
  height: 8px;
  margin: auto;
  border: 0px;
  border-top: solid 2px #0033AF;
  border-right: solid 2px #0033AF;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.info > ol li a .date {
  font-weight: bold;
}

.info > ol li a p {
  margin: 0;
  padding: 0;
}

.info > a.t-right {
  display: table;
  margin-left: auto;
  text-align: right;
}

/*** SNS ***/

.sns_acount {
  text-align: center;
}

.sns_acount li{
  display: inline-block;
  vertical-align: middle;
}

.sns_acount li + li {
  margin-left: 16px;
}

.sns_acount li a {
  display: block;
}

.sns_acount img {
  width: 43px;
}

/*** footer ***/

.top-footer {
  background: #f3f7ff;
  text-align: center;
  padding: 20px;
  border-top: 1px solid #0033AF;
}

.top-footer,
footer {
  padding-bottom: 240px;
}

.top-footer ol {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.top-footer ol li {
  display: inline-block;
  width: calc(50% - 10px);
  margin: 0;
  border-bottom: 1px solid #0033AF;
}

.top-footer ol li:nth-child(1),
.top-footer ol li:nth-child(2) {
  border-top: 1px solid #0033AF;
}

.top-footer ol li a {
  position: relative;
  display: block;
  height: 100%;
  padding: 10px 20px 10px 0;
  color: #222;
  text-align: left;
  font-size: 14px;
  text-decoration: none;
}

.top-footer ol li a:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  display: block;
  width: 0;
  height: 0;
  margin: auto;
  border-left: 6px solid #0033AF;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
}

.lp-footer {
  max-width: 640px;
  margin: 40px auto 0;
}

.lp-footer ul {
  display: flex;
  width: calc(100% - 40px);
  margin: 0 auto;
  flex-direction: column;
}

.lp-footer li {
  border-top: 1px solid #0033AF;
}

.lp-footer li:last-of-type {
  border-bottom: 1px solid #0033AF;
}

.lp-footer li a {
  display: block;
  position: relative;
  padding: 13px 20px;
  color: #0033AF;
}

.lp-footer li a:hover {
  background-color: #f3f7ff;
}
/*** スタイル ***/

.color-red01 {
  color: #CC0033;
}

.bold-txt {
  font-weight: bold;
}

.small-txt14 {
  font-size: 14px;
}

.right-txt {
  text-align: right;
}

.link-text {
  display: inline-block;
  position: relative;
  padding-right: 16px;
  color: #0033AF;
}

.link-text:hover {
  text-decoration: underline;
}

.link-text:after {
  display: block;
  position: absolute;
  width: 8px;
  height: 8px;
  border-top: 2px solid #0033AF;
  border-right: 2px solid #0033AF;
  content: "";
  top: 0;
  bottom: 0;
  right: 2px;
  margin: auto;
  vertical-align: middle;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}


/*** メディアクエリ ***/

@media screen and ( max-width: 375px ){
  .plan-btn-list li a,
  .btn-orange {
    font-size: 16px;
  }

}

@media screen and ( min-width: 641px ){
  .function-list p {
    margin-bottom: 40px;
  }
  h1,h2 {
    margin-bottom: 40px;
  }
  .top-footer ol {
    max-width: 640px;
    margin: auto;
  }

  .top-footer ol li a {
    padding: 15px 0;
  }
  .top-footer ol li a.li_sct_min640 br {
    display: none;
  }
}

@media screen and ( max-width: 640px ){
  .top-footer ol li a.li_lineBreak_max640 {
    display: flex;
    align-items: center;
  }
}