@charset "UTF-8";
/*====================================
　早見表
  $conts-width
  $color-yellow  $color-blue
  $font-color-black
  $font-family-gothic  $font-family-mincho

  full-width
  flex-column  flex-center
  media(320px ＝ xs   480px ＝ s   768px ＝ m   1000px ＝ l)
  fs(max,1000～768px,768～480px,480～320px,min)  fs2(max,min)
  mt(max,min) mb mtb  pt pb ptb

====================================*/
/*====================================

/*----------------------------------
  Structure
----------------------------------
1. トップ
  1.1	メインイメージ
  1.2 トップナビ
2. 
3. 

====================================*/
/*----------------------------------
	0. 共有
------------------------------------*/
/*----------------------------------
	0. アニメーション
------------------------------------*/
.scroll-fade {
  transform: translate3d(0, -10px, 0);
  transition: 1s;
  opacity: 0; }

.scroll-fade.animated {
  transform: translate3d(0, 0, 0);
  opacity: 1; }

/*----------------------------------
	1. トップ
------------------------------------*/
.icon-box {
  display: flex;
  align-items: center;
  margin-bottom: 40px; }
  .icon-box .icon {
    width: 100px;
    padding-right: 20px; }
  .icon-box .txt h3 {
    position: relative;
    padding-top: 1.5em;
    color: #333333; }
    .icon-box .txt h3:before {
      position: absolute;
      bottom: 0;
      left: 0;
      z-index: -1;
      color: #f0f0f1;
      font-size: 3em;
      line-height: 1;
      content: attr(data-number);
      pointer-events: none; }

.icon-box2 {
  display: flex;
  align-items: center; }
  .icon-box2 .icon {
    width: 120px;
    padding-right: 20px; }
  .icon-box2 p {
    width: 86%;
    font-size: clamp(13px, 2.708vw, 16px); }
    @media screen and (max-width: 1000px) {
      .icon-box2 p {
        width: 100%; } }

.img-sec .box {
  margin-bottom: 40px; }
  @media screen and (max-width: 768px) {
    .img-sec .box {
      flex-basis: 48%; } }
  .img-sec .box .icon {
    width: 100%; }

.flow-style {
  display: flex;
  justify-content: center;
  align-items: center; }
  .flow-style .flow {
    padding-left: 0;
    width: 100%; }
    .flow-style .flow li {
      list-style-type: none;
      border: 2px solid #4D9BC1;
      padding: 20px;
      border-radius: 20px;
      background-color: #fff; }
      .flow-style .flow li:not(:last-child) {
        margin-bottom: 40px;
        position: relative; }
        .flow-style .flow li:not(:last-child):after {
          content: '';
          position: absolute;
          border: 20px solid transparent;
          width: 0;
          height: 0;
          bottom: -53px;
          left: 50%;
          transform: translateX(-50%);
          -webkit-transform: translateX(-50%);
          -ms-transform: translateX(-50%);
          border-top-color: #4D9BC1; }
      .flow-style .flow li dl dt {
        font-size: 1.3em;
        font-weight: bold;
        border-bottom: 2pt dashed #ccc;
        padding-bottom: 0.5em;
        margin-bottom: 0.5em; }
      .flow-style .flow li dl dd {
        margin: 0; }
      .flow-style .flow li .icon {
        color: #4D9BC1;
        margin-right: 0.5em; }

table.common-style {
  width: 100%;
  margin: 0 auto;
  border-collapse: separate;
  border-spacing: 0px 15px; }
  table.common-style th, table.common-style td {
    padding: 10px; }
  table.common-style th {
    background: #4D9BC1;
    vertical-align: middle;
    text-align: left;
    width: 100px;
    overflow: visible;
    position: relative;
    color: #fff;
    font-weight: normal;
    font-size: clamp(16px, 3.333vw, 18px); }
    table.common-style th:after {
      left: 100%;
      top: 50%;
      border: solid transparent;
      content: " ";
      height: 0;
      width: 0;
      position: absolute;
      pointer-events: none;
      border-color: rgba(136, 183, 213, 0);
      border-left-color: #4D9BC1;
      border-width: 10px;
      margin-top: -10px; }
  table.common-style td {
    background: #f8f8f8;
    width: 360px;
    padding-left: 20px;
    font-size: clamp(14px, 2.917vw, 16px); }
    table.common-style td span {
      font-size: clamp(12px, 2.5vw, 13px); }

/* firefox */
@-moz-document url-prefix() {
  table.common-style th::after {
    float: right;
    padding: 0;
    left: 30px;
    top: 10px;
    content: " ";
    height: 0;
    width: 0;
    position: relative;
    pointer-events: none;
    border: 10px solid transparent;
    border-left: #295890 10px solid;
    margin-top: -10px; } }
.comment {
  font-size: clamp(13px, 2.708vw, 14px); }

/*----------------------------------
	pg-btm
------------------------------------*/
/*----------------------------------
	1.　page-bottom
------------------------------------*/
.page-bottom {
  padding: 80px 4%; }

.bnr-contact {
  background: url(../images/bnr-contact.jpg) no-repeat top center #63c69b;
  border-radius: 20px;
  min-height: 380px; }
  @media screen and (max-width: 768px) {
    .bnr-contact {
      background-size: 100% auto; } }
  .bnr-contact .column-box__2col {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-align-items: center;
    align-items: center; }
  .bnr-contact__title {
    color: #fff;
    font-size: 40px;
    font-weight: 500;
    letter-spacing: 0.24em; }
    @media screen and (max-width: 768px) {
      .bnr-contact__title {
        height: clamp(180px, 37.5vw, 300px); } }
  .bnr-contact__tell {
    color: #fff;
    font-size: clamp(30px, 6.25vw, 40px);
    font-weight: 500;
    text-align: center; }
    @media screen and (max-width: 768px) {
      .bnr-contact__tell {
        margin-bottom: 30px; } }
  .bnr-contact__link {
    display: inline-block;
    color: #fff;
    font-size: clamp(24px, 5vw, 34px);
    letter-spacing: 0.5em;
    border: solid 1px #fff;
    border-radius: 10px;
    padding: 0.7em 1em;
    margin-top: 50px; }
    .bnr-contact__link:hover {
      text-decoration: none;
      background-color: #ffffff52;
      color: #fff; }
  .bnr-contact img {
    width: clamp(34px, 7.083vw, 44px);
    margin-right: 15px; }

.pg-btm__tel .txt {
  font-weight: bold;
  line-height: 30px;
  letter-spacing: 0.04em;
  margin-bottom: 37px; }
  @media screen and (max-width: 767px) {
    .pg-btm__tel .txt {
      font-size: 14px;
      font-size: 1.4rem;
      line-height: 28px;
      margin-bottom: 33px; } }
.pg-btm__tel .tel a {
  display: block;
  font-family: Roboto;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
  text-align: center;
  color: #4D9BC1;
  font-size: 30px;
  font-size: 3rem;
  margin-bottom: 5px; }
  @media screen and (min-width: 768px) {
    .pg-btm__tel .tel a {
      pointer-events: none; } }
  @media screen and (max-width: 767px) {
    .pg-btm__tel .tel a {
      font-size: 20px;
      font-size: 2rem; } }
  .pg-btm__tel .tel a strong {
    font-size: 50px;
    font-size: 5rem; }
    @media screen and (max-width: 767px) {
      .pg-btm__tel .tel a strong {
        font-size: 40px;
        font-size: 4rem; } }
.pg-btm__tel .tel-txt {
  font-weight: 500;
  font-size: 16px;
  font-size: 1.6rem;
  letter-spacing: 0.04em;
  line-height: 30px;
  color: #97b0bf;
  margin-bottom: 0; }
