@charset "utf-8";

/* 共通 */
a {
  color: #1f2b84;
}
body {
  background-color: #fff;
}

/* トップロゴ */
.navbar-header {
  padding: 15px 0;
}
.navbar-brand {
  background: url(./img/logo.png) no-repeat;
  width: 120px;
  height: 44px;
  white-space: nowrap;
  overflow: hidden;
  text-indent: 150%;
  padding: 0 15px;
}
.navbar-nav {
  font-size: 1.4rem;
}
.navbar {
  min-height: 74px;
  border: 0;
}
.navbar-default .navbar-nav > li > a {
  color: #1f2b84;
}
.navbar-nav > li > a {
  margin-top: 18.75px;
  margin-bottom: 18.75px;
}
.nav > li > a {
  padding: 10px 11px;
}
@media (max-width: 767px) {
  .navbar {
    min-height: 60px;
    margin-bottom: 0;
  }
  .navbar-toggle {
    margin-top: 6px;
    margin-bottom: 6px;
  }
  .navbar-brand {
    margin-left: 15px;
  }
}
@media (max-width: 768px) {
  .nav > li > a {
    padding: 3px 11px;
  }
  .navbar-nav {
    font-size: 1.6rem;
    margin: 0;
  }

}


/* スクロール調整用 */
#point, #flow, #data, #contact {
  padding-top: 80px;
}
#point {
  margin-top: -50px;
}
#flow, #data, #contact {
  margin-top: -25px;
}

/* メインビジュアル */
.main-visual {
  background: url(./img/top_image.png) no-repeat;
  width: 100%;
  min-height: 521px;
  max-width: 100%;
  max-height: 100%;
  background-position: center top;
  background-size: cover;
  padding: 0;
}
.main-caption {
  border: 2px solid #1f2b84;
  background: rgba(255,255,255,0.6);
  padding: 20px;
  text-align: center;
  margin-top: 35px;
  color: #1f2b84;
  font-weight: bold;
}
.main-caption .top {
  font-size: 2.0rem;
}
.main-caption .mid {
  font-size: 3.2rem;
}
.main-caption .title {
  font-size: 6.1rem;
  margin-top: 10px;
  font-weight: bold;
}
.main-caption .bottom {
  font-size: 2.4rem;
  margin-bottom: 0;
}

@media (max-width: 1200px) {
  .main-caption .title {
    font-size: 5.2rem;
  }
}
@media (max-width: 767px) {
  .main-visual {
    min-height: 400px;
    background-position: center bottom -130px;
    background-size: auto;
  }
  .main-caption {
    padding: 15px 7px;
    margin-top: 35px;
  }
  .main-caption .top {
    font-size: 1.4rem;
  }
  .main-caption .mid {
    font-size: 1.5rem;
  }
  .main-caption .title {
    font-size: 2.4rem;
  }
  .main-caption .bottom {
    font-size: 1.1rem;
  }
}

.sub-caption {
  text-align: center;
  margin-top: 3.5rem;
  color: #fff;
  font-weight: bold;
  text-shadow: 0 0 13px rgba(0,0,0,0.87),0 0 13px rgba(0,0,0,0.87);
}
.sub-caption .top {
  font-size: 3.1rem;
}
.sub-caption .bottom {
  font-size: 3.4rem;
}
@media (max-width: 767px) {
  .sub-caption .top {
    font-size: 1.9rem;
  }
  .sub-caption .bottom {
    font-size: 2.4rem;
  }
}

/* トップタイトル */
.content-title {
  text-align: center;
  margin-bottom: 50px;
}
.content-title .top {
  font-size: 3.6rem;
  font-weight: bold;
}
.content-title .content {
  font-size: 1.6rem;
}
@media (max-width: 767px) {
  .content-title .top {
    font-size: 2.4rem;
  }
  .content-title .content {
    text-align: left;
  }
}

.dl-horizontal {
  padding-left: 0px;
  padding-right: 0px;
}
.dl-horizontal dd {
  margin-bottom: 10px;
}
@media (min-width: 768px) {
  .dl-horizontal dd {
    margin-left: 230px;
    text-align: left;
    margin-bottom: 5px;
  }
  .dl-horizontal dt {
    width: 210px;
    text-align: left;
  }
  .dl-horizontal-left dd {
    margin-left: 75px;
  }
  .dl-horizontal-left dt {
    width: 75px;
  }
}
@media (min-width: 992px) {
  .dl-horizontal {
    padding-left: 100px;
    padding-right: 0px;
  }
  .dl-horizontal-left {
    padding-left: 0px;
    padding-right: 0px;
  }
}

/* トップ見出し */
.content-heading {
  text-align: center;
  margin-bottom: 100px;
}
.content-heading .top {
  font-size: 2.0rem;
  font-weight: bold;
}
.content-heading .content {
  font-size: 1.4rem;
}
.content-heading .btn-org {
  background-color: #0076b0;
  border-radius: 10px;
  font-size: 1.4rem;
  color: #fff;
  padding: 10px 20px;
  margin-top: 10px;
}
.content-heading .btn-org:hover {
  background-color: #016291;
}

@media (max-width: 767px) {
  .content-heading .top {
    font-size: 2.2rem;
  }
  .content-heading .content {
    font-size: 1.5rem;
    text-align: left;
  }
  .content-heading .content:last-child {
    margin-bottom: 25px;
  }
  .content-heading .btn-org {
    padding: 15px 14px;
    width: 100%;
  }
  .content-heading .btn-org:hover {
    opacity: 1;
  }
}

/* 申し込みの流れ見出し */
.flow-bg {
  background-color: #f7f7f7;
  padding: 0;
}
.flow-heading {
  text-align: center;
  margin: 55px auto;
}
.flow-heading .top {
  font-size: 3.6rem;
  font-weight: bold;
  margin-bottom: 30px;
}
.flow-heading .mid {
  font-size: 1.6rem;
  margin-bottom: 20px;
}
.flow-heading .mid2 {
  font-size: 2.0rem;
  font-weight: bold;
  margin-bottom: 20px;
}
.flow-heading .bottom {
  font-size: 1.6rem;
  color: #ff0000;
}
@media (max-width: 767px) {
  .flow-heading {
    text-align: left;
  }
  .flow-heading .top {
    font-size: 2.4rem;
    text-align: center;
  }
  .flow-heading .mid2 {
    font-size: 1.6rem;
  }
}


/* フロー用のレイアウトコンテナ */
.col-flow-xs-15, .col-flow-xs-85,
.col-flow-sm-15, .col-flow-sm-85,
.col-flow-md-15, .col-flow-md-65, .col-flow-md-85,
.col-flow-lg-15, .col-flow-lg-85 {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}
.col-flow-xs-15, .col-flow-xs-85 {
  float: left;
}
.col-flow-xs-15 {
  width: 12.5%;
}
.col-flow-xs-85 {
  width: 87.5%;
}
@media (min-width: 768px) {
  .col-flow-sm-15, .col-flow-sm-85 {
    float: left;
  }
  .col-flow-sm-15 {
    width: 12.5%;
  }
  .col-flow-sm-85 {
    width: 87.5%;
  }
}
@media (min-width: 992px) {
  .col-flow-md-15, .col-flow-md-65, .col-flow-md-85 {
    float: left;
  }
  .col-flow-md-15 {
    width: 12.5%;
  }
  .col-flow-md-65 {
    width: 54.16667%;
  }
  .col-flow-md-85 {
    width: 87.5%;
  }
}
@media (min-width: 1200px) {
  .col-flow-lg-15, .col-flow-lg-85 {
    float: left;
  }
  .col-flow-lg-15 {
    width: 12.5%;
  }
  .col-flow-lg-85 {
    width: 87.5%;
  }
}

.flow-content {
  margin-bottom: 30px;
}
.flow-content .spacer {
  margin-bottom: 20px;
  max-width: 100%;
}

.flow-content .flow-num {
  background-color: #0076b0;
  font-size: 2.0rem;
  padding: 5px 10px;
  border-radius: 10px;
  color: #fff;
  width: 101px;
  height: 91px;
  text-align: center;
}
.flow-content .flow-num span {
  font-size: 5.3rem;
  line-height: 5.0rem;
}

.flow-content .top {
  font-size: 2.8rem;
  font-weight: bold;
  margin-bottom: 32px;
}
.flow-content .content {
  font-size: 1.4rem;
  margin-bottom: 20px;
}
.flow-content .content_list {
  font-size: 1.4rem;
  margin-bottom: 20px;
  padding-left: 20px;
}

.flow-content.flow1 {
  background: url(./img/flow1_img.png) no-repeat;
  background-position: right 30px top 40px;
}
.flow-content.flow2 {
  background: url(./img/flow2_img.png) no-repeat;
  background-position: right 30px top 70px;
}
.flow-content.flow3 {
  background: url(./img/flow3_img.png) no-repeat;
  background-position: right 30px top 70px;
}
.flow-content.flow4 {
  background: url(./img/flow4_img.png) no-repeat;
  background-position: right 30px top 70px;
}
.flow-content.flow-goal {
  position: relative;
}
.flow-content .goal {
  font-size: 4.8rem;
  font-weight: bold;
  text-align: center;
  position: absolute;
  display: block;
  width: 100%;
  top:35%;
  left: 0;
}
@media (min-width: 768px) {
  .flow-content .goal {
    top: 23%;
  }
}
@media (max-width: 767px) {
  .container.flow-content {
    background: none;
    text-align: center;
    text-align: -webkit-center;
    text-align: -moz-center;
  }
  .flow-content .top {
    font-size: 2.0rem;
  }
  .flow-content .content {
    text-align: left;
    font-size: 1.6rem;
  }
  .flow-content .content_list {
    text-align: left;
    font-size: 1.6rem;
  }
  .flow-content .goal {
    top: 15%;
    font-size: 2.5rem;
  }
}


.table {
  text-align: left;
  font-size: 1.4rem;
  background-color: #fff;
  text-indent: 0.5rem;
}
.table >tbody > tr {
  letter-spacing: -0.4em;
}
.table >tbody > tr > td {
  padding: 12px 8px;
  letter-spacing: normal;
}
.table >tbody > tr:last-child {
  border-bottom: 1px solid #ddd;
}
.table .head {
  background-color: #333;
  color: #fff;
  width: 25%;
}
.table .center {
  width: 45%;
  border-right: 1px solid #ddd;
}
.table .right {
  width: 30%;
  border-right: 1px solid #ddd;
}
.table .right a {
  color: #2097d0;
}
@media (max-width: 767px) {
  .table {
    text-indent: inherit;
  }
  .table >tbody > tr > td {
    display: inline-block;
  }
  .table >tbody > tr {
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
  }
  .table .head {
    width: 100%;
    font-size: 1.5rem;
  }
  .table .center, .table .right {
    width: 50%;
    padding: 8px 9px 15px;
  }
  .table .right {
    border-right: none;
  }

}



.flow-heading .btn-org {
  background-color: #0076b0;
  border-radius: 0px;
  font-size: 1.4rem;
  color: #fff;
  padding: 15px 30px;
}
.flow-heading .btn-org:hover {
  background-color: #016291;
}
.flow-heading .btn-org:last-child {
  margin-left: 20px;
  background-color: #009269;
}
.flow-heading .btn-org:last-child:hover {
  background-color: #046a4d;
}

@media (max-width: 767px) {
  .flow-heading .btn-org {
    width: 100%;
  }
  .flow-heading .btn-org:hover {
    opacity: 1;
  }
  .flow-heading .btn-org:last-child {
    margin-left: 0;
  }
}

.contact-bg {
  background: url(./img/contact.png) no-repeat;
  background-size: cover;
  background-position: center bottom;
  width: 100%;
  min-height: 617px;
  max-width: 100%;
  max-height: 100%;
}

.footer {
  margin: 20px auto;
  font-size: 1.3rem;
  text-align: center;
}
.footer .copyright, .footer .statement {
  padding-top: 15px;
  display: inline-block;
}
.footer .social {
  margin-bottom: 0;
}
.footer .social a {
  width: 50px;
  height: 50px;
  border-radius: 100%;
  background-color: #222222;
  font-size: 2.0rem;
  color: #fff;
  display: inline-block;
  line-height: 50px;
}
.footer .social a:hover {
  background-color: #777;
}
