@charset "utf-8";
/* pc */

@media screen and (min-width: 751px) {
  #container {
    width: 1000px;
    margin: 0 auto
  }
  img.fv_sp, .text_sp, .img_sp, .br_sp {
    display: none;
  }
  img.fv_pc {
    width: 100%;
  }

  .fv_text {
    width: 85%;
    margin: 1.5em auto 0;
    font-size: 1.2em;
    line-height: 1.7em;
    text-align: center;
  }

  #button {
    width: 680px;
    margin: 3em auto;
  }

  .btn_img img:hover {
    opacity: 0.8;
  }

  .btn_text {
    text-decoration: underline;
    text-align: center;
    padding-top: 0.4em;
  }

  #plan {
    width: 100%;
    padding: 5em 0;
    background-color: #eef2f7;
  }

  .plan_title {
    width: 70%;
    text-align: center;
    margin: 0 auto 2em;
  }

  .plan_title h2 {
    font-size: 1.8em;
    font-weight: 600;
    letter-spacing: 0.1em;
    color: #275c98;
    padding-bottom: 1em;
  }

  .plan_title hr {
    border-color: #275c98;
    border-style: solid 1px;
  }

  .plan_group {
    width: 90%;
    margin: 0 auto;
    background-color: #fff;
    text-align: center;
    padding: 1.5em 0 2.5em;
  }

  .plan_group h3 {
    font-size: 1.3em;
    letter-spacing: 0.1em;
    padding: 1em 0 1.5em;
  }

  .plan_group table {
    width: 85%;
    margin: 0 auto;
  }

  .plan_group table , .plan_group td, .plan_group th {
    border: solid 4px #FFF;
    border-collapse: collapse;
  }

  .plan_group td, .plan_group th {
  	height: 50px;
    vertical-align: middle;
    text-align: center;
    padding-top: 0.2em;
  }

  .plan_group td {
    font-size: 0.9em;
    line-height: 1.2em;
  }

  .plan_group th {
    font-size: 1.3em;
    font-weight: 400;
  }

  .table_left {
    width: 33%;
  }

  .th_kojin {
  	background: #ef3918;
    color: #FFF;
  }

  .th_hojin {
    background: #efad18;
    color: #FFF;
  }

  .th_gray {
    background: #e6e6e6;
    font-weight: 600;
  }

  .table_center {
    width: 33%;
  }

  .td_org {
    background: #fcd7d1;
  }

  .td_ylw {
    background: #fcefd1;
  }

  .plan_group span {
    font-size: 0.5em;
  }

  .plan_group p {
    width: 83%;
    color: #4d4d4d;
    text-align: left;
    margin: 0.3em auto 0;
    font-size: 0.7em;
    line-height: 1.2em;
    padding-left:1em;
    text-indent:-1em;
  }

  /*ボックス全体*/
  .accbox {
    width: 85%;
    margin: 3em auto 0;
    padding: 0;
    text-align: left;
    font-size: 0.9em;
  }

  /*ラベル*/
  .accbox label {
    display: block;
    margin: 0.1em 0;
    padding: 0.5em 1em;
    color: #FFF;
    background: #0071bc;
    cursor: pointer;
    transition: all 0.5s;
  }

  /*アイコンを表示*/
  .accbox label:before {
    content: url(../img/icon_close.png);
    font-family: 'FontAwesome';
    padding-right: 0.5em;
  }

  /*ラベルホバー時*/
  .accbox label:hover {
    background: #66aad7;
  }

  /*チェックは隠す*/
  .accbox input {
    display: none;
  }

  /*中身を非表示にしておく*/
  .accbox .accshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
  }

  /*クリックで中身表示*/
  .cssacc:checked+label+.accshow {
    height: auto;
    padding: 0.5em 0 1em;
    background: #f2f2f2;
    opacity: 1;
  }

  .accshow p {
    width: 92%;
    font-size: 0.9em;
    text-align: justify;
  }

  /*アイコンを入れ替える*/
  .cssacc:checked+label:before {
    content: url(../img/icon_open.png);
  }

  #service {
    margin: 6em auto;
  }

  .service_title {
    width: 70%;
    text-align: center;
    margin: 0 auto 2em;
  }

  .service_title h2 {
    font-size: 1.8em;
    font-weight: 600;
    letter-spacing: 0.1em;
    color: #275c98;
    padding-bottom: 1em;
  }

  .service_title span {
    color: #FFF;
    font-size: 0.7em;
    font-weight: 400;
    background-color: #c90a49;
    padding: 0.4em 1em 0.4em 1.2em;
    border-radius: 1em;

  }

  .service_title hr {
    border-color: #275c98;
    border-style: solid 1px;
  }

  .service_text {
    width: 80%;
    text-align: center;
    margin: 3em auto;
    font-size: 1.1em;
    line-height: 1.7em;
  }

  .service_group {
    width: 90%;
    margin: 0 auto;
    overflow: auto;
  }

  .service_left {
    width: 50%;
    padding-top: 2em;
    float: left;
    text-align: center;
  }

  .time {
    font-size: 1.3em;
    font-weight: 600;
  }

  .box {
    padding: 0.5em 0;
    margin: 1.5em 0;
    border: solid 1px #666;
  }

  .box p {
    margin: 0;
    padding: 0;
    color: #333;
  }

  .service_group table ,
  .service_group td,
  .service_group th {
    border: none;
  	border-collapse: collapse;
  }

  .service_group th {
  	width: 40%;
    text-align: left;
    vertical-align:top;
    font-size: 1.4em;
    font-weight: 600;
  }

  .square_pink {
    font-size: 1.25em;
    color: #ffcccc;
    vertical-align: top;
  }

  .square_yellow {
    font-size: 1.25em;
    color: #faed42;
    vertical-align: top;
  }

  .square_blue {
    font-size: 1.25em;
    color: #a2bada;
    vertical-align: top;
  }

  .service_group td {
    padding: 0 0 2em;
  	width: 60%;
    text-align: left;
    vertical-align:top;
    text-align: justify;
    font-size: 0.9em;
    line-height: 1.3em;
  }

  .service_left hr {
    border-top: dotted 2px #666;
  }

  .service_ex {
    width: 90%;
    margin: 1em auto 0;
    text-align: left;
    font-size: 0.8em;
  }

  .service_right {
    width: 45%;
    float: right;
  }

  .service_right img{
    width: 100%;
  }

  #step {
    background-color: #eef2f7;
    padding: 2em 0;
  }

  .step_all {
    width: 85%;
    margin: 0 auto;
    padding-bottom: 0.2em;
    background-color: #FFF;
  }

  .step_all h4 {
    background-color: #0071bc;
    padding: 1.5em 0 0.5em 2em;
    color: #fff;
    font-size: 1.1em;
    font-weight: 400;
  }

  .step_group {
    width: 87%;
    margin: 3em auto;
    overflow: auto;
  }

  .step_left {
    width: 60%;
    float: left;
  }

  .step_left h5 {
    font-size: 1.1em;
    margin-bottom: 0.7em;
  }

  .step_ex {
    font-size: 0.8em;
    text-align: justify;
    padding-bottom: 1em;
  }

  .step_card {
    margin-top: 1em;
    padding: 1.5em 2em;
    border: solid 3px #e6e6e6;
  }

  .step_card h6 {
    font-size: 0.9em;
  }

  .step_card p {
    font-size: 0.8em;
    text-align: justify;
    padding: 0.7em 0;
  }

  .step_card img {
    width: 100%;
  }

  .step_right {
    width: 30%;
    float: right;
  }

  .step_right img {
    width: 100%;
  }

}

/* smartPhone */

@media screen and (max-width: 750px) {
  #container {
    width: 100%;
    margin: 0 auto;
  }
  img.fv_pc, .br_pc, .text_pc, .img_pc  {
    display: none;
  }
  img.fv_sp {
    width: 100%;
  }

  .fv_text {
    width: 85%;
    margin: 1.5em auto 0;
    font-size: 1em;
    line-height: 1.4em;
    text-align: justify;
  }

  #button {
    width: 95%;
    margin: 1.5em auto;
  }

  .btn_img img:hover {
    opacity: 0.8;
  }

  .btn_text {
    text-decoration: underline;
    text-align: center;
    padding-top: 0.4em;
    font-size: 0.8em;
  }

  #plan {
    width: 100%;
    padding: 2em 0;
    background-color: #eef2f7;
  }

  .plan_title {
    width: 95%;
    text-align: center;
    margin: 0 auto 1.5em;
  }

  .plan_title h2 {
    font-size: 1.15em;
    font-weight: 600;
    letter-spacing: 0.05em;
    color: #275c98;
    padding-bottom: 0.7em;
  }

  .plan_title hr {
    border-color: #275c98;
    border-style: solid 1px;
  }

  .plan_group {
    width: 93%;
    margin: 0 auto;
    background-color: #fff;
    text-align: center;
    padding: 1em 0 1em;
  }

  .plan_group h3 {
     font-size: 1.15em;
     letter-spacing: 0.1em;
     padding: 1em 0 1.5em;
   }

   .plan_group table {
     width: 93%;
     margin: 0 auto;
   }

   .plan_group table , .plan_group td, .plan_group th {
     border: solid 2px #FFF;
     border-collapse: collapse;
   }

   .plan_group td, .plan_group th {
   	height: 3em;
     vertical-align: middle;
     text-align: center;
     padding-top: 0.2em;
   }

   .plan_group td {
     font-size: 0.8em;
     line-height: 1.2em;
   }

   .plan_group th {
     font-size: 1em;
     line-height: 1.2em;
     font-weight: 400;
   }

   .table_left {
     width: 33%;
   }

   .th_kojin {
   	background: #ef3918;
     color: #FFF;
   }

   .th_hojin {
     background: #efad18;
     color: #FFF;
   }

   .th_gray {
     background: #e6e6e6;
     font-weight: 600;
   }

   .table_center {
     width: 33%;
   }

   .td_org {
     background: #fcd7d1;
   }

   .td_ylw {
     background: #fcefd1;
   }

   .plan_group span {
     font-size: 0.5em;
   }

   .plan_group p {
     width: 87%;
     color: #4d4d4d;
     text-align: left;
     text-align: justify;
     margin: 0.3em auto 0;
     font-size: 0.75em;
     line-height: 1.2em;
     padding-left:1em;
     text-indent:-1em;
   }

   /*ボックス全体*/
   .accbox {
     width: 90%;
     margin: 2em auto 0;
     padding: 0;
     text-align: left;
     font-size: 0.9em;
   }

   /*ラベル*/
   .accbox label {
     display: block;
     margin: 0.1em 0;
     padding: 0.5em 1em;
     color: #FFF;
     background: #0071bc;
     cursor: pointer;
     transition: all 0.5s;
   }

   /*アイコンを表示*/
   .accbox label:before {
     content: url(../img/icon_close.png);
     font-family: 'FontAwesome';
     padding-right: 0.5em;
   }

   /*ラベルホバー時*/
   .accbox label:hover {
     background: #66aad7;
   }

   /*チェックは隠す*/
   .accbox input {
     display: none;
   }

   /*中身を非表示にしておく*/
   .accbox .accshow {
     height: 0;
     padding: 0;
     overflow: hidden;
     opacity: 0;
     transition: 0.8s;
   }

   /*クリックで中身表示*/
   .cssacc:checked+label+.accshow {
     height: auto;
     padding: 0.5em 0 1em;
     background: #f2f2f2;
     opacity: 1;
   }

   .accshow p {
     width: 85%;
     font-size: 0.9em;
     text-align: justify;
   }

   /*アイコンを入れ替える*/
   .cssacc:checked+label:before {
     content: url(../img/icon_open.png);
   }

  #service {
    margin: 3em auto;
  }

  .service_title {
      width: 95%;
      text-align: center;
      margin: 0 auto 2em;
    }

  .service_title h2 {
    font-size: 1.15em;
    font-weight: 600;
    letter-spacing: 0.1em;
    color: #275c98;
    padding-bottom: 0.7em;
  }

  .service_title span {
    color: #FFF;
    font-size: 0.75em;
    font-weight: 400;
    background-color: #c90a49;
    padding: 0.3em 1em 0.3em 1.2em;
    border-radius: 1em;

  }

  .service_title hr {
    border-color: #275c98;
    border-style: solid 1px;
  }

  .service_text {
    width: 85%;
    margin: 1.5em auto 2em;
    font-size: 0.9em;
    line-height: 1.3em;
    text-align: justify;
  }

  .service_group {
    width: 90%;
    margin: 0 auto;
  }

  .service_left {
    text-align: center;
  }

  .time {
    font-size: 1em;
    font-weight: 600;
  }

  .box {
    padding: 0.2em 0;
    margin: 1.5em 0;
    border: solid 1px #666;
  }

  .box p {
    margin: 0;
    padding: 0;
    color: #333;
    font-size: 0.9em;
  }

  .service_group table ,
  .service_group  td,
  .service_group  th {
    border: none;
  	border-collapse: collapse;
  }

  .service_group th {
  	width: 40%;
    text-align: left;
    vertical-align:top;
    font-size: 1.1em;
    font-weight: 600;
  }

  .square_pink {
    font-size: 1.2em;
    color: #ffcccc;
    vertical-align: top;
  }

  .square_yellow {
    font-size: 1.2em;
    color: #faed42;
    vertical-align: top;
  }

  .square_blue {
    font-size: 1.2em;
    color: #a2bada;
    vertical-align: top;
  }

  .service_group td {
    padding: 0 0 2em;
  	width: 60%;
    text-align: left;
    vertical-align:top;
    text-align: justify;
    font-size: 0.9em;
    line-height: 1.3em;
  }

  .service_left hr {
    border-top: dotted 2px #666;
  }

  .service_ex {
    width: 90%;
    margin: 1em auto 2em;
    text-align: left;
    font-size: 0.8em;
  }

  .service_right img{
    width: 100%;
  }

  #step {
    background-color: #eef2f7;
    padding: 2em 0;
  }

  .step_all {
    width: 90%;
    margin: 0 auto;
    padding-bottom: 0.2em;
    background-color: #FFF;
  }

  .step_all h4 {
    background-color: #0071bc;
    color: #fff;
    font-size: 1em;
    font-weight: 400;
    text-align: center;
    padding: 0.8em 0;
  }

  .step_group {
    width: 90%;
    margin: 1em auto;
  }

  .step_left h5 {
    font-size: 0.9em;
    margin-bottom: 0.7em;
  }

  .step_ex {
    font-size: 0.8em;
    text-align: justify;
    padding-bottom: 2em;
  }

  .step_right {
    text-align: center;
  }

  .step_right img {
    width: 70%;
  }

  .step_card {
    margin-top: 1em;
    padding: 0.8em 1em;
    border: solid 3px #e6e6e6;
  }

  .step_card h6 {
    font-size: 0.8em;
  }

  .step_card p {
    font-size: 0.7em;
    line-height: 1em;
    text-align: justify;
    padding: 0.7em 0;
  }

  .step_card img {
    width: 100%;
  }

}

/* 共通 */

body {
  max-width: 1000px;
  margin-right: auto;
  margin-left: auto;
}

.footer p, dt, .footer-navi__areaname {
  color: #FFF;
}

.footer__container {
  width: 90%;
}

.footer a:link {
  color: #fff;
}

.footer a:visited {
  color: #fff;
}

.footer a:active {
  color: #fff;
}

.footer a:hover {
  color: #fff;
}

/*}*/