@charset "utf-8";
/* CSS Document */

/* ------------------------------- */
/* Header */
/* ------------------------------- */

header {
 background-color: transparent;
}

header nav ul li a:hover,
header nav ul li a.active {
 border-bottom: 2px solid #FFFFFF;
}

@media (max-width: 991px) {
 header {
  background: #FFF;
 }
}


/* ------------------------------- */
/* Eyecatch */
/* ------------------------------- */

#eyecatch {
 height: 100vh;
 background-image: url(/img/index/bg_eyecatch.jpg);
 background-size: cover;
 background-position: center top;
}

/* Message */

#eyecatch .container {
 max-width: 1400px;
}

#eyecatch .message {
 padding-top: 50px;
 text-align: center;
 margin: auto;
}

.message .box1 {
 display: flex;
}

.message .flex1 {
width: 30%;
}

.message .flex2 {
width: 50%;
}

.message .flex3 {
width: 30%;
}

#eyecatch .message > img {
  margin-bottom: 40px;
}

@media (max-width: 767px) {
#eyecatch {
 height: 100vh;
 background-image: url(/img/index/bg_eyecatch.jpg);
 background-size: cover;
 background-position: center top;
}

.message .box1 {
 display: flex;
 flex-wrap: wrap;
}

.message .flex1 {
 order: 2;
 width: 50%;
 margin: 15px 0;
}

.message .flex2 {
 order: 1;
 width: 100%;
 margin: 15px 0;
}

.message .flex3 {
 order: 3;
 width: 50%;
}
}

/* ------------------------------- */
/* about */
/* ------------------------------- */

#about h2 {
 font-size: 2.2rem;
 font-weight: 700;
 line-height: 1.5;
 margin-bottom: 30px;
}

#about h2 span {
 margin-left: 20px;
 font-size: 1.2rem;
 color: #29ABE2;
}

#about h3 {
 font-size: 1.4rem;
 font-weight: 600;
 line-height: 1.5;
 margin: 15px 0;
}

#about .row > div {
 margin-top: 60px;
}


@media (max-width: 767px) {
 #about h2 img {
  display: none;
 }
}

/* ------------------------------- */
/* service */
/* ------------------------------- */

#service h2 {
 font-size: 2.2rem;
 font-weight: 700;
 line-height: 1.5;
 margin-bottom: 30px;
}

#service h2 span {
 margin-left: 20px;
 font-size: 1.2rem;
 color: #29ABE2;
}


#service h3 {
 margin-bottom: 60px;
 font-size: 1.8rem;
 font-weight: 500;
}

#service .row-eq-height {
 display: flex;
 flex-wrap: wrap;
}

#service .box {
 margin: 10px 0;
 padding: 20px 20px;
 height: 90%;
 text-align: left;
 background-color: #FFF;
 border: 1px solid #333;
 border-radius: 15px;
}

#service .box h4 {
 margin: 10px 0;
 font-size: 1.2rem;
 font-weight: 600;
 text-align: center;
}

#service .box p {
 font-size: 0.8rem;
}

#service .box dl {
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 width: 100%;
}

#service .box dt {
margin: auto;
}

#service .box dd {
}

@media (max-width: 991px) {
 #service .box dt {
  margin-bottom: 10px;
  width: 100%;
  text-align: center;
 }

 #service .box dd {
  width: 100%;
 }
}


/* ------------------------------- */
/* Service Network */
/* ------------------------------- */


#network h2 {
 font-size: 2.2rem;
 font-weight: 700;
 line-height: 1.5;
 margin-bottom: 30px;
}

#network h2 span {
 margin-left: 20px;
 font-size: 1.2rem;
 color: #29ABE2;
}

#network p {
width: 80%;
}


#network .row > div {
 margin-top: 60px;
}


@media (max-width: 767px) {
 #network h2 img {
  display: none;
 }
 
 #network p {
width: 100%;
}

}


/* ------------------------------- */
/* item */
/* ------------------------------- */

#item h2 {
 font-size: 2.2rem;
 font-weight: 700;
 line-height: 1.5;
 margin-bottom: 30px;
}

#item h2 span {
 margin-left: 20px;
 font-size: 1.2rem;
 color: #29ABE2;
}

#item h3 {
 font-size: 1.4rem;
 font-weight: 600;
 line-height: 1.5;
 margin: 15px 0;
}

#item img {
 margin-top: 15px;
}


@media (max-width: 767px) {
 #item h2 img {
  display: none;
 }
}

/* ------------------------------- */
/* sales */
/* ------------------------------- */

#sales {
 text-align: center;
}

#sales h3 {
 position: relative;
 display: inline-block;
 margin-top: 10px;
 margin-bottom: 30px;
 font-size: 2.2rem;
 font-weight: 600;
 line-height: 1.2;
 color: #FFFFFF;
 }


/* ------------------------------- */
/* guid */
/* ------------------------------- */

#guid h2 {
 font-size: 2.2rem;
 font-weight: 700;
 line-height: 1.5;
 margin-bottom: 30px;
}

#guid h2 span {
 margin-left: 20px;
 font-size: 1.2rem;
 color: #29ABE2;
}

#guid h3 {
 margin-bottom: 60px;
 font-size: 1.8rem;
 font-weight: 500;
}

#guid .box {
 margin-top: 30px;
 padding-left: -15px;
 text-align: left;
 background-color: #C7E8F7;
}

#guid .box h4 {
 margin-bottom: 10px;
 font-size: 1.2rem;
 font-weight: 600;
}

#guid .box p {
 font-size: 1rem;
 line-height: 1.2;
}

#guid .box span {
 font-size: 0.8rem;
 line-height: 1.0;
}

#guid .box .point {
 padding: 20px 30px;
 font-size: 1rem;
}


@media (max-width: 767px) {
#guid .point {
}
}


/* ------------------------------- */
/* Company */
/* ------------------------------- */

#company h2 {
 font-size: 2.2rem;
 font-weight: 700;
 line-height: 1.5;
 margin-bottom: 30px;
}

#company h2 span {
 margin-left: 20px;
 font-size: 1.2rem;
 color: #29ABE2;
}

#company table th,
#company table td {
 padding: 15px 10px;
 border-bottom: 1px dotted #000000;
}

#company table th {
 vertical-align: top;
 font-weight: bold;
}

@media (max-width: 767px) {
 #company table th {
  width: 100px;
 }

 #company table th,
 #company table td {
  padding: 10px;
 }
}


/* ------------------------------- */
/* tel */
/* ------------------------------- */

#tel h3 {
 margin-top: 15px;
 margin-bottom: 20px;
 font-size: 1.8rem;
 font-weight: 600;
 line-height: 1;
 text-align: center;
 color: #FFFFFF;
 }

#tel dl {
 text-align: center;
 font-size: 4.0rem;
 color: #FFFFFF;
}

#tel dt {
line-height: 1.0;
}

#tel dt span {
font-size: 2.6rem;
margin-right: 15px;
}

#tel dd {
 margin-top: 15px;
 font-size: 1.6rem;
}

/* ------------------------------- */
/* Contact */
/* ------------------------------- */

#contact {
 margin-bottom: 0;
}

#contact h2 {
 font-size: 2.2rem;
 font-weight: 700;
 line-height: 1.5;
 margin-bottom: 30px;
}

#contact h2 span {
 margin-left: 20px;
 font-size: 1.2rem;
 color: #29ABE2;
}

#thanks .flex {
 display: flex;
 justify-content: center;
 align-items: center;
 height: calc(100vh - 150px);
}

#thanks .box {
 padding: 40px;
 background-color: #FFF;
 border-radius: 15px;
}