@charset "UTF-8";
body {
  width: 100%;
  background-color: #fff;
  font-family: Avenir, 'Open Sans', 'Helvetica Neue', Helvetica, Arial, Verdana, Roboto, 'Hiragino Kaku Gothic ProN', '游ゴシック', 'Yu Gothic', '游ゴシック体', 'YuGothic', Meiryo, 'メイリオ', sans-serif;
  overflow: auto;
  font-size: 13px;
  min-width: 100%;
  margin: 0;
  padding: 0; }

img, p, table, tr, th, td {
  padding: 0;
  margin: 0;
  text-align: left;
  border: none; }

h1 {
  font-size: 14px;
  font-weight: normal; }

h2, h3, h4 {
  padding: 0;
  margin: 0; }

img {
  max-width: 100%;
  height: auto; }

ul, li {
  list-style-type: none;
  padding: 0;
  margin: 0; }

a {
  text-decoration: none;
  border: none; }

.top img {
  vertical-align: bottom; }

.bottom img {
  vertical-align: top; }

/*base
------------------------------------------------------------------------------*/
#wrapper {
  width: 100%;
  min-width: 320px;
  margin: 0;
  padding: 0 0 18% 0;
  box-sizing: border-box;
  -webkit-box-sizing: border-box; }

/*header
------------------------------------------------------------------------------*/
.header {
  position: fixed;
  width: 100%;
  box-shadow: 0 0 15px 7px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 0 15px 7px rgba(0, 0, 0, 0.2);
  z-index: 200; }

.header .inner {
  width: 100%;
  background: #fafafa; }

.header .inner .logo {
  display: inline-block;
  width: 56.25%;
  margin: 2% 0 2% 4%; }

.header .inner .logo img {
  width: 100%; }

.header .inner .menu__btn {
  display: inline-block;
  float: right;
  width: 5.46%;
  margin-top: 2.7%;
  margin-right: 3.4%;
  padding-top: 5.46%;
  background: url(../images/icon_menu.png) no-repeat center center;
  background-size: 100%;
  -webkit-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out; }

.header .inner .menu__close {
  width: 4.53%;
  margin-top: 3.1%;
  margin-right: 4%;
  padding-top: 4.53%;
  background: url(../images/icon_menu_close.png) no-repeat center center;
  background-size: 100%; }

.header .inner .menu {
  display: none;
  background: #fff; }

.header .inner .menu li {
  width: 100%; }

.header .inner .menu li a {
  display: block;
  width: 100%;
  padding: 4.8% 0 4.8% 5%;
  border-bottom: 1px dotted #f0f4f6; }

.header .inner .menu li:last-child a {
  border-bottom: 1px solid #f0f4f6; }

.header .inner .menu li:first-child a img {
  width: 75%;
  vertical-align: middle; }

.header .inner .menu li:nth-child(2) a img {
  width: 36.09%;
  vertical-align: middle; }

.header .inner .menu li:nth-child(3) a img {
  width: 40.93%;
  vertical-align: middle; }

.header .inner .menu li:nth-child(4) a img {
  width: 30.31%;
  vertical-align: middle; }

.header .inner .menu li:nth-child(5) a img {
  width: 45.46%;
  vertical-align: middle; }

.header .inner .menu li:nth-child(6) a img {
  width: 41.87%;
  vertical-align: middle; }

.header .inner .menu li:nth-child(7) a img {
  width: 41.87%;
  vertical-align: middle; }

/*contents
------------------------------------------------------------------------------*/
#contents {
  width: 100%;
  margin: 0 auto;
  padding-top: 10.5%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

/*mv
------------------------------------------------------------------------------*/
.mv {
  position: relative;
  width: 100%;
  margin-top: -10.93%;
  padding-bottom: 5.9375%;
  background: url(../images/bg.png) no-repeat; }

.mv .mainImg {
  width: 100%;
  margin-top: 3.5%;
  margin-bottom: 0;
  padding-top: 10.93%;
  vertical-align: bottom; }

.mv .mainImg img {
  width: 100%; }

.mv .mainImg .img01 {
  width: 91.87%;
  margin-top: 2%; }
  .mv .mainImg .img01 img {
    width: 100%; }

.mv .mainImg .img02 {
  width: 91.7%;
  margin: 0 auto;
  padding-top: 4%; }

.mv .mainImg .img02 .top {
  width: 100%;
  height: auto; }

.mv .mainImg .img02 .top .part {
  width: 100%;
  margin-left: 0; }

.mv .mainImg .img02 .inner {
  width: 100%;
  margin-top: -2%;
  padding-bottom: 4%;
  background: url(../images/bg_ttl_top_inner.png);
  background-size: 100%;
  text-align: center; }

.mv .mainImg .img02 .inner .ttl {
  width: 88.43%;
  margin-left: 0; }
  .mv .mainImg .img02 .inner .ttl img {
    width: 100%; }

.mv .mainImg .img02 .inner_color {
  width: 100%;
  padding-top: 4%;
  background: url(../images/bg_ttl_inner.png);
  background-size: 100%;
  text-align: center; }
  .mv .mainImg .img02 .inner_color img {
    width: 89.96%;
    margin-left: 0;
    padding-bottom: 4%; }

.mv .mainImg .img02 .inner .text {
  padding-top: 3%;
  font-weight: bold;
  text-align: center; }

.mv .mainImg .img02 .inner ul {
  width: 88%;
  margin-top: 3%;
  margin-left: 9%;
  font-size: 12px; }

.mv .mainImg .img02 .inner ul li {
  list-style-type: disc;
  text-align: left; }

.mv .mainImg .img02 .bottom {
  width: 100%; }
  .mv .mainImg .img02 .bottom img {
    width: 100%;
    margin-left: 0; }

/*webkan_detail
------------------------------------------------------------------------------*/
.webkan_detail {
  padding: 9.375% 0 14%;
  background: url(../images/webkan_bg.gif) center repeat;
  background-size: 6px 6px; }
  .webkan_detail .inner {
    width: 91.87%;
    margin: 0 auto; }
  .webkan_detail .webkan_title {
    margin-bottom: 6.77%; }
  .webkan_detail .webkan_lead {
    margin-bottom: 6.77%; }
  .webkan_detail .webkan_merit {
    margin-bottom: 5.93%;
    text-align: center; }
    .webkan_detail .webkan_merit li {
      display: inline-block;
      width: 48.5%;
      margin-bottom: 3%; }
      .webkan_detail .webkan_merit li.left {
        float: left; }
      .webkan_detail .webkan_merit li.right {
        float: right; }
    .webkan_detail .webkan_merit img {
      vertical-align: bottom; }
  .webkan_detail .webkan_caution {
    font-size: 9px;
    line-height: 1.5555;
    margin-bottom: 7.62%; }
    .webkan_detail .webkan_caution p {
      text-indent: -1em;
      padding-left: 1em; }
      .webkan_detail .webkan_caution p.red {
        color: #ff1313; }
  .webkan_detail .webkan_btn {
    width: 66.77%;
    margin: 0 auto; }

/*app
------------------------------------------------------------------------------*/
.app {
  width: 100%;
  background: #3b70b9; }

.app .top {
  position: relative;
  width: 100%;
  padding-top: 11.71%;
  background: #014099; }

.app .top .inner {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 91.87%;
  margin: auto;
  padding-top: 11.71%; }

.app .top .inner .ttl {
  position: absolute;
  top: 25%;
  right: 4%;
  width: 100%;
  text-align: center; }
  .app .top .inner .ttl img {
    width: 60.93%; }

.app .top .inner .fukidashi {
  position: absolute;
  width: 62%;
  top: -35%;
  left: 19%; }

.app .inner {
  width: 91.87%;
  margin: 0 auto; }

.app .inner .btn01 {
  padding-top: 7%; }

.app .inner .btn02 {
  width: 98.54%;
  display: block;
  margin: 4.38% auto 3.5%; }

.app .inner .btn01 .text {
  width: 80.95%;
  margin: 0 auto;
  padding-bottom: 2%; }
  .app .inner .btn01 .text img {
    width: 100%; }

.app .inner .btn01 .btn {
  width: 93.19%;
  margin: 0 auto; }
  .app .inner .btn01 .btn img {
    width: 100%; }

.app .inner .img {
  width: 96.59%;
  margin: 0 auto;
  padding: 5% 0 7%; }
  .app .inner .img img {
    width: 100%; }

.app .inner .tel {
  border-top: 1px solid #5a8bd0; }

.app .inner .tel .img01 {
  width: 50%;
  margin: 3.5% auto 0; }
  .app .inner .tel .img01 img {
    width: 100%; }

.app .inner .tel .img02 {
  width: 78.59%;
  margin: 0 auto;
  padding-bottom: 4%; }
  .app .inner .tel .img02 img {
    width: 100%; }

.app .inner .tel .img02 a {
  display: block;
  width: 100%;
  height: auto; }

/*atm
------------------------------------------------------------------------------*/
.atm {
  width: 100%;
  padding-bottom: 10%;
  background: #fffde9; }

.atm .top {
  position: relative;
  width: 91.87%;
  margin: 0 auto;
  padding-top: 8%;
  padding-bottom: 6%; }

.atm .top .ttl {
  width: 100.85%;
  margin: 0 auto;
  padding-top: 3%; }

.atm .top .sttl {
  width: 50.17%;
  margin-top: 10%;
  margin-left: 28%; }
  .atm .top .sttl img {
    width: 100%; }

.atm .top .fukidashi {
  position: absolute;
  width: 19.21%;
  right: 0;
  bottom: 12%; }
  .atm .top .fukidashi img {
    width: 100%; }

.atm .top .img {
  position: absolute;
  bottom: 0;
  left: 1.5%;
  width: 26%;
  height: 51%;
  overflow: hidden;
  z-index: 1; }
  .atm .top .img img {
    width: 100%;
    padding-top: 5%; }

.atm .inner {
  width: 91.87%;
  margin: 0 auto; }

.atm .inner .iconList {
  display: -webkit-flex;
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding-bottom: 2%; }

.atm .inner .iconList .icon {
  width: 31.58%; }

.atm .inner .atmnet {
  width: 100%;
  margin-top: 3%; }

.atm .inner .atmnet .top {
  width: 100%;
  padding: 0; }
  .atm .inner .atmnet .top img {
    width: 100%; }

.atm .inner .atmnet .inner {
  width: 100%;
  margin-top: -1.5%;
  padding-top: 3.5%;
  padding-bottom: 1.5%;
  background: url(../images/bg_atm_inner.png);
  background-size: 100%; }

.atm .inner .atmnet .inner .ttl {
  width: 95.40%;
  margin: 0 auto; }
  .atm .inner .atmnet .inner .ttl img {
    width: 100%; }

.atm .inner .atmnet .inner .img {
  width: 82.14%;
  margin: 6% auto; }
  .atm .inner .atmnet .inner .img img {
    width: 100%; }

.atm .inner .atmnet .inner .text {
  width: 92%;
  margin: 0 auto;
  padding-bottom: 14px; }

.atm .inner .atmnet .inner .text li {
  padding-left: 14px; }

.atm .inner .atmnet .text {
  text-indent: -16px; }

.atm .inner .atmnet .bottom {
  width: 100%;
  margin-top: -1%; }

/*repay01
------------------------------------------------------------------------------*/
.repay01 {
  width: 100%;
  margin: 0 auto;
  background: #fffde9; }

.repay01 .inner {
  width: 92%;
  margin: 0 auto;
  padding: 7% 0 2%; }

.repay01 .inner .ttl {
  width: 82.65%;
  margin: 0 auto;
  padding-bottom: 7%; }

.repay01 .inner .ttl img {
  width: 100%; }

.repay01 .inner .bankTxt {
  width: 73.97%;
  margin: 0 auto 8%; }
  .repay01 .inner .bankTxt img {
    width: 100%; }

.repay01 .inner .bankTxt02 {
  width: 83.33%;
  margin: 0 auto 5%; }
  .repay01 .inner .bankTxt02 img {
    width: 100%; }

.repay01 .inner .text {
  margin-bottom: 8%; }

.repay01 .inner .text .blue {
  color: #014099;
  font-weight: bold; }

.repay01 .inner .btnarea {
  padding-bottom: 10%; }

.repay01 .inner .btnarea .btn .top {
  position: relative;
  width: 100%;
  padding-top: 12.71%;
  background: url(../images/bg_repay01_box_top.png) no-repeat;
  background-size: 100%; }
  .repay01 .inner .btnarea .btn .top img {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 54.25%;
    margin: auto; }

.repay01 .inner .btnarea .btn .inner {
  width: 100%;
  padding: 5% 0 2%;
  background: url(../images/bg_repay01_box_inner.png) repeat-Y;
  background-size: 100%; }

.repay01 .inner .btnarea .btn .inner .img {
  width: 72.24%;
  margin: 0 auto; }
  .repay01 .inner .btnarea .btn .inner .img img {
    width: 100%; }

.repay01 .inner .btnarea .btn .inner .img02 {
  width: 52.55%;
  margin: 4% auto 3%; }
  .repay01 .inner .btnarea .btn .inner .img02 img {
    width: 100%; }

.repay01 .inner .btnarea .btn .inner .btn {
  display: block;
  width: 78.91%;
  margin: 2% auto 0; }
  .repay01 .inner .btnarea .btn .inner .btn img {
    width: 100%; }

.repay01 .inner .btnarea .btn .bottom {
  width: 100%;
  padding-top: 3.55%;
  background: url(../images/bg_repay01_box_bottom.png) no-repeat;
  background-size: 100%; }

.repay01 .inner .btnarea .btn .btn02 {
  display: block;
  width: 100%;
  margin-top: 3%; }
  .repay01 .inner .btnarea .btn .btn02 img {
    width: 100%; }

/*tpoint
------------------------------------------------------------------------------*/
.tpoint {
  width: 100%;
  margin: 0 auto;
  padding-bottom: 10.5%;
  background: #ffffff; }

.tpoint .inner {
  width: 92%;
  margin: 0 auto;
  padding: 10% 0 0; }

.tpoint .inner .ttl {
  width: 99.65%;
  margin: 0 auto 3%; }
  .tpoint .inner .ttl img {
    width: 100%; }

.tpoint .inner .fukidashi {
  width: 79.93%;
  margin: 0 auto;
  padding-bottom: 5%; }
  .tpoint .inner .fukidashi img {
    width: 100%; }

.tpoint .inner .infoBox {
  width: 100%; }

.tpoint .inner .infoBox .top {
  width: 100%;
  padding-top: 3.5%;
  padding-bottom: 3.5%;
  background: url(../images/bg_tpoint_box_top.png) no-repeat;
  background-size: 100%;
  text-align: center; }
  .tpoint .inner .infoBox .top img {
    width: 65.81%; }

.tpoint .inner .infoBox .inner {
  width: 100%;
  padding-top: 7%;
  background: url(../images/bg_tpoint_box_inner.png) repeat-Y;
  background-size: 100%;
  text-align: center; }

.tpoint .inner .infoBox .inner .contents {
  width: 92%;
  margin: 0 auto; }

.tpoint .inner .infoBox .inner .ttl {
  width: 100%; }
  .tpoint .inner .infoBox .inner .ttl img {
    width: 100%; }

.tpoint .inner .infoBox .inner .text {
  width: 94.44%;
  margin: 0 auto;
  padding: 3.5% 0 5.5%;
  border-bottom: 2px dotted #9eb6d8; }
  .tpoint .inner .infoBox .inner .text img {
    width: 100%; }

.tpoint .inner .sec01 {
  position: relative;
  width: 100%;
  margin-top: 7%;
  padding-bottom: 22%;
  border-bottom: 2px dotted #9eb6d8; }

.tpoint .inner .infoBox .sec01 .ttl {
  width: 62.22%;
  margin: 0 auto 3%; }
  .tpoint .inner .infoBox .sec01 .ttl img {
    width: 100%; }

.tpoint .inner .infoBox .sec01 .image,
.tpoint .inner .infoBox .sec02 .image {
  width: 100%;
  padding-bottom: 2%;
  text-align: center; }
  .tpoint .inner .infoBox .sec01 .image img,
  .tpoint .inner .infoBox .sec02 .image img {
    width: 27%; }

.tpoint .inner .infoBox .sec01 .graph {
  position: relative;
  width: 100%;
  margin-top: 2.5%;
  padding-top: 60%; }

.tpoint .inner .infoBox .sec01 .graph .area {
  position: absolute;
  top: 47%;
  width: 100%;
  padding-top: 31%;
  background-color: #fdedf0; }

.tpoint .inner .infoBox .sec01 .graph .ex {
  position: absolute;
  top: 0;
  width: 14.07%; }
  .tpoint .inner .infoBox .sec01 .graph .ex img {
    width: 100%; }

.tpoint .inner .infoBox .sec01 .graph .graph__day01 {
  position: absolute;
  top: 15%;
  left: 36%;
  width: 15.92%; }
  .tpoint .inner .infoBox .sec01 .graph .graph__day01 img {
    width: 100%; }

.tpoint .inner .infoBox .sec01 .graph .graph__day02 {
  position: absolute;
  top: 15%;
  right: 7.5%;
  width: 15.92%; }
  .tpoint .inner .infoBox .sec01 .graph .graph__day02 img {
    width: 100%; }

.tpoint .inner .infoBox .sec01 .graph .graph__img01 {
  position: absolute;
  top: 33%;
  width: 100.37%;
  z-index: 10; }
  .tpoint .inner .infoBox .sec01 .graph .graph__img01 img {
    width: 100.37%; }

.tpoint .inner .infoBox .sec01 .graph .graph__img02 {
  position: absolute;
  top: 2%;
  right: 26.5%;
  width: 18.33%; }
  .tpoint .inner .infoBox .sec01 .graph .graph__img02 img {
    width: 100%; }

.tpoint .inner .infoBox .sec01 .graph .graph__img03 {
  position: absolute;
  top: 11%;
  left: 32.4%;
  width: 22.40%; }
  .tpoint .inner .infoBox .sec01 .graph .graph__img03 img {
    width: 100%; }

.tpoint .inner .infoBox .sec01 .graph .graph__img04 {
  position: absolute;
  top: 11%;
  right: 3%;
  width: 22.40%; }
  .tpoint .inner .infoBox .sec01 .graph .graph__img04 img {
    width: 100%; }

.tpoint .inner .infoBox .sec01 .graph .area .img02 {
  width: 87.40%;
  padding: 3% 0;
  margin: 0 auto; }
  .tpoint .inner .infoBox .sec01 .graph .area .img02 img {
    width: 100%; }

.tpoint .inner .sec02 {
  position: relative;
  width: 100%;
  margin-top: 7%;
  padding-bottom: 23%; }

.tpoint .inner .infoBox .sec02 .ttl {
  width: 66.48%;
  margin: 0 auto 3%; }
  .tpoint .inner .infoBox .sec02 .ttl img {
    width: 100%; }

.tpoint .inner .infoBox .sec02 .graph {
  position: relative;
  width: 100%;
  margin-top: 2.5%;
  padding-top: 63.5%; }

.tpoint .inner .infoBox .sec02 .graph .area {
  position: absolute;
  top: 42%;
  width: 100%;
  padding-top: 31%;
  background-color: #fdedf0; }

.tpoint .inner .infoBox .sec02 .graph .ex {
  position: absolute;
  top: 0;
  width: 14.07%; }
  .tpoint .inner .infoBox .sec02 .graph .ex img {
    width: 100%; }

.tpoint .inner .infoBox .sec02 .graph .graph__day01 {
  position: absolute;
  top: 15%;
  left: 20%;
  width: 24.07%; }
  .tpoint .inner .infoBox .sec02 .graph .graph__day01 img {
    width: 100%; }

.tpoint .inner .infoBox .sec02 .graph .graph__day02 {
  position: absolute;
  top: 15%;
  right: 37%;
  width: 9.62%; }
  .tpoint .inner .infoBox .sec02 .graph .graph__day02 img {
    width: 100%; }

.tpoint .inner .infoBox .sec02 .graph .graph__day03 {
  position: absolute;
  top: 15%;
  right: 10%;
  width: 11.66%; }
  .tpoint .inner .infoBox .sec02 .graph .graph__day03 img {
    width: 100%; }

.tpoint .inner .infoBox .sec02 .graph .graph__img01 {
  position: absolute;
  top: 33%;
  width: 100.37%;
  z-index: 10; }
  .tpoint .inner .infoBox .sec02 .graph .graph__img01 img {
    width: 100.37%; }

.tpoint .inner .infoBox .sec02 .graph .graph__img02 {
  position: absolute;
  top: 11%;
  left: 22%;
  width: 19.81%; }
  .tpoint .inner .infoBox .sec02 .graph .graph__img02 img {
    width: 100%; }

.tpoint .inner .infoBox .sec02 .graph .graph__img03 {
  position: absolute;
  top: 11%;
  right: 31.5%;
  width: 22.40%; }
  .tpoint .inner .infoBox .sec02 .graph .graph__img03 img {
    width: 100%; }

.tpoint .inner .infoBox .sec02 .graph .graph__img04 {
  position: absolute;
  top: 11%;
  right: 4.5%;
  width: 22.40%; }
  .tpoint .inner .infoBox .sec02 .graph .graph__img04 img {
    width: 100%; }

.tpoint .inner .infoBox .sec02 .graph .area .img02 {
  width: 87.40%;
  margin: 0 auto;
  padding: 7.5% 0 3.5%; }
  .tpoint .inner .infoBox .sec02 .graph .area .img02 img {
    width: 100%; }

.tpoint .inner .sec03 {
  width: 100%;
  padding-bottom: 6.5%;
  border-bottom: 2px dotted #9eb6d8; }

.tpoint .inner .infoBox .inner .sec03 h3 {
  font-size: 16px; }

.tpoint .inner .infoBox .inner .sec03 .text {
  padding-left: 1em;
  padding-bottom: 0;
  border: none;
  text-indent: -1em;
  text-align: left; }

.tpoint .inner .sec04 {
  width: 100%;
  padding-top: 10%; }

.tpoint .inner .sec04 .sttl {
  width: 100%;
  margin-bottom: 5.5%; }
  .tpoint .inner .sec04 .sttl img {
    width: 100%; }

.tpoint .inner .sec04 .table {
  width: 100%; }
  .tpoint .inner .sec04 .table img {
    width: 100%; }

/*step
------------------------------------------------------------------------------*/
.step {
  width: 100%;
  margin: 0 auto;
  padding-bottom: 10%;
  background: #fffde9; }

.step .inner {
  width: 92%;
  margin: 0 auto;
  padding-top: 10%; }

.step .inner .ttl {
  width: 100%;
  margin: 0 auto;
  text-align: center; }

.step .inner .ttl p {
  padding-top: 3%;
  font-size: 17px;
  color: #fe123e;
  font-weight: bold;
  letter-spacing: 0.12em;
  text-align: center; }

.step .inner .ttl img {
  width: 86%; }

.step .inner .flow__img {
  position: relative;
  width: 100%;
  margin-top: 5%;
  padding-top: 46.44%;
  background: url(../images/bg_step_btn.png) no-repeat;
  background-size: 100%; }

.step .inner .flow__img .btn_page {
  position: absolute;
  top: 0;
  display: -webkit-flex;
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%; }

.step .inner .flow__img .btn01 {
  display: block;
  width: 33.33%;
  padding: 0;
  text-align: center; }

.step .inner .flow__img .btn02 {
  display: block;
  width: 33.33%;
  padding: 0;
  text-align: center; }

.step .inner .flow__img .btn03 {
  display: block;
  width: 33.33%;
  padding: 0;
  text-align: center; }

.step .inner .step01 {
  width: 100%;
  margin-top: -1.65%; }

#step1, #step2, #step3 {
  padding-top: 12%; }

#step2, #step3 {
  margin-top: -13%; }

.step .inner .step01 .top,
.step .inner .step02 .top,
.step .inner .step03 .top {
  width: 100%;
  background: url(../images/bg_step_box_top.png) no-repeat;
  background-size: 100%;
  text-align: center; }

.step .inner .step01 .top {
  padding: 4.8% 0 3.8%; }
  .step .inner .step01 .top img {
    width: 60.37%; }

.step .inner .step02 .top {
  padding: 4.8% 0 3.8%; }
  .step .inner .step02 .top img {
    width: 72.44%; }

.step .inner .step03 .top {
  padding: 2.7% 0  2.6%; }
  .step .inner .step03 .top img {
    width: 69.5%; }

.step .inner .step01 .inner,
.step .inner .step02 .inner,
.step .inner .step03 .inner {
  width: 100%;
  padding-top: 6%;
  background: url(../images/bg_step_box_inner.png) repeat-Y;
  background-size: 100%; }

.step .inner .step02 .inner {
  text-align: center; }
  .step .inner .step02 .inner img {
    width: 92.85%; }

.step .inner .step03 .inner {
  padding-bottom: 1%; }

.step .inner .step01 .inner .ttl {
  width: 55.44%;
  margin: 0 auto; }
  .step .inner .step01 .inner .ttl img {
    width: 100%; }

.step .inner .step01 .inner .text {
  width: 88.09%;
  margin: 4% auto 5.5%; }
  .step .inner .step01 .inner .text img {
    width: 100%; }

.step .inner .step01 .inner .btn01 {
  display: block;
  width: 93.19%;
  margin: 0 auto;
  padding-bottom: 3%; }
  .step .inner .step01 .inner .btn01 img {
    width: 100%; }

.step .inner .step01 .inner .btn02 {
  display: block;
  width: 93.19%;
  margin: 0 auto; }
  .step .inner .step01 .inner .btn02 img {
    width: 100%; }

.step .inner .arrow {
  width: 11.39%;
  margin: 5% auto; }
  .step .inner .arrow img {
    width: 100%; }

.step .inner .step03 .inner .img01 {
  width: 92.17%;
  margin: 0 auto 6%; }
  .step .inner .step03 .inner .img01 img {
    width: 100%; }

.step .inner .step03 .step3_lead {
  width: 89.4%;
  margin: 0 auto 6.77%; }

.step .inner .step03 .accordion {
  width: 89.4%;
  margin: 0 auto 5%; }

.step .inner .step03 .accordion_title {
  position: relative; }

.step .inner .step03 .accordion-content {
  padding: 5.6% 0; }

.step .inner .step_complete .inner {
  width: 100%;
  padding-top: 6%;
  background: url(../images/bg_step_box_inner.png) repeat-Y;
  background-size: 100%; }

.step .inner .step_complete .inner .img02 {
  width: 75.68%;
  margin: 0 auto; }
  .step .inner .step_complete .inner .img02 img {
    width: 100%; }

.step .inner .step_complete .inner .img03 {
  width: 91.32%;
  margin: 0 auto; }
  .step .inner .step_complete .inner .img03 img {
    width: 100%; }

.step .inner .step_complete .inner .img04 {
  width: 48.63%;
  margin: 3.5% auto 0; }
  .step .inner .step_complete .inner .img04 img {
    width: 100%; }

.step .inner .step_complete .inner .img05 {
  width: 91.84%;
  margin: 0 auto;
  padding: 5% 0 3.5%; }
  .step .inner .step_complete .inner .img05 img {
    width: 100%; }

.step .inner .step03 .inner .btn {
  display: block;
  width: 100%;
  margin: 2.84% auto 6%; }
  .step .inner .step03 .inner .btn img {
    width: 100%; }

.step .inner .step03 .inner .arrow {
  display: block;
  width: 6.12%;
  margin: 3.5% auto 5.5%; }
  .step .inner .step03 .inner .arrow img {
    width: 100%; }

/*yushi
------------------------------------------------------------------------------*/
.yushi {
  width: 100%;
  padding-top: 8%;
  padding-bottom: 8%; }

.yushi .inner {
  width: 92%;
  margin: 0 auto;
  padding-top: 5%; }

.yushi .inner .box01 .top {
  width: 100%; }

.yushi .inner .box01 .inner {
  position: relative;
  width: 100%;
  margin-top: -1%;
  background: url(../images/bg_yushi_inner.png) repeat-Y;
  background-size: 100%; }

.yushi .inner .box01 .inner .fukidashi {
  position: absolute;
  top: -4.5%;
  left: 0;
  right: 0;
  width: 46.08%;
  margin: auto; }
  .yushi .inner .box01 .inner .fukidashi img {
    width: 100%; }

.yushi .inner .box01 .inner .ttl {
  width: 100%;
  padding-top: 1%;
  padding-bottom: 4.5%;
  border-bottom: 1px solid #014099;
  text-align: center; }
  .yushi .inner .box01 .inner .ttl img {
    width: 88.94%; }

.yushi .inner .box01 .inner .text01 {
  width: 92%;
  margin: 0 auto;
  margin-top: 4%;
  padding-bottom: 4%;
  font-size: 15px; }

.yushi .inner .box01 .inner .text02 {
  width: 92%;
  margin: 0 auto;
  padding-bottom: 14px; }

.yushi .inner .box01 .inner .text02 li {
  padding-left: 14px; }

.yushi .inner .box01 .text02 {
  text-indent: -16px; }

.yushi .inner .box01 .bottom {
  width: 100%; }
  .yushi .inner .box01 .bottom img {
    width: 100%; }

.yushi .inner .box02 {
  width: 100%;
  margin: 15% 0 3%; }

.yushi .inner .box02 .top {
  width: 100%; }
  .yushi .inner .box02 .top img {
    width: 100%;
    vertical-align: bottom; }

.yushi .inner .box02 .inner {
  position: relative;
  width: 100%;
  padding-top: 8%;
  background-color: #f0f9fe; }

.yushi .inner .box02 .inner ul li {
  width: 87%;
  margin: 0 auto;
  padding-left: 1em;
  padding-bottom: 2%;
  text-indent: -1em; }

.yushi .inner .box02 .inner .bold {
  font-weight: bold; }

.yushi .inner .box02 .inner .fukidashi {
  position: absolute;
  top: -10%;
  left: 0;
  right: 0;
  width: 49.31%;
  margin: auto; }
  .yushi .inner .box02 .inner .fukidashi img {
    width: 100%; }

.yushi .inner .box02 .bottom {
  width: 100%; }
  .yushi .inner .box02 .bottom img {
    width: 100%;
    vertical-align: top; }

.yushi .inner .box03 {
  width: 100%; }

.yushi .inner .box03 ul {
  margin-top: 2%;
  margin-left: 6%; }

.yushi .inner .box03 ul li {
  padding-bottom: 1%;
  list-style-type: disc; }

/*cardroan
------------------------------------------------------------------------------*/
.cardroan {
  width: 100%;
  background: #fffde9; }

.cardroan .inner {
  width: 92%;
  margin: 0 auto;
  padding: 12% 0; }

.cardroan .inner .ttl {
  width: 78.46%;
  margin: 0 auto; }

.cardroan .inner .ttl img {
  width: 100%; }

.cardroan .inner .text {
  margin-top: 2%;
  font-size: 15px;
  font-weight: bold;
  text-align: center; }

.cardroan .inner .qa__box {
  width: 100%;
  margin-top: 6%; }

.cardroan .inner .qa__box .ttl {
  width: 100%;
  background: url(../images/qa_close_bg_faq_icon.png), url(../images/qa_close_bg_faq_arrow.png);
  background-repeat: no-repeat;
  background-color: #014099;
  background-position: 3% center , 95% center;
  background-size: 10.93%,3.75%;
  border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px; }

.cardroan .inner .qa__box .ttl h3 {
  display: block;
  width: 72%;
  margin: auto;
  padding: 4% 0 4% 8%;
  color: #fff;
  line-height: 140%;
  font-size: 11pt; }

.cardroan .inner .qa__box .answerOpen__ttl {
  width: 100%;
  background: url(../images/qa_open_bg_faq_icon.png), url(../images/qa_open_bg_faq_arrow.png);
  background-repeat: no-repeat;
  background-color: #014099;
  background-position: 3% center , 95% center;
  background-size: 10.93%,3.75%;
  border-radius: 5px 5px 0px 0px / 5px 5px 0px 0px; }

.cardroan .inner .qa__box .answer {
  display: none;
  margin: 0;
  padding: 0; }

.cardroan .inner .qa__box .text {
  width: 100%;
  margin: 0;
  background: url(../images/icon_faq_a.png) no-repeat, url(../images/qa_bg_inner.png) repeat-Y;
  background-size: 11.71%, 100%;
  background-position: 3% 17px;
  text-align: left;
  font-weight: normal;
  font-size: 11pt; }

.cardroan .inner .qa__box .text p {
  padding-top: 3%;
  padding-left: 18%;
  padding-right: 5%; }

.cardroan .inner .qa__box .text ul {
  padding-top: 3%;
  padding-left: 22%;
  padding-right: 5%; }

.cardroan .inner .qa__box .text ul li {
  list-style-type: disc; }

.cardroan .inner .qa__box .text .red {
  color: #ff2929; }

.cardroan .inner .qa__box .text .btn {
  width: 100%; }

.cardroan .inner .qa__box .text .btn img {
  width: 100%; }

.cardroan .inner .qa__box .text .notes {
  margin-left: 16px;
  text-indent: -18px; }

.cardroan .inner .qa__box .bottom {
  width: 100%;
  padding-top: 4.6%;
  background: url(../images/qa_bg_bottom.png) no-repeat;
  background-size: 100%; }

/*supple
------------------------------------------------------------------------------*/
.supple {
  width: 100%; }

.supple .inner {
  width: 92%;
  margin: 7% auto 3%; }

.supple .inner h3 {
  margin-bottom: 2%;
  color: #014099;
  font-size: 14px; }

.supple .inner .data {
  margin-top: 5%;
  text-align: right; }

.supple .inner ul {
  margin-left: 5%; }

.supple .inner ul li {
  list-style-type: disc; }

.footer {
  position: relative;
  width: 100%;
  padding-top: 6.4%;
  background: url(../images/footer_img.png) no-repeat;
  background-size: 100%; }

.copy {
  margin: 1.5% 0;
  text-align: center; }

.footer .img {
  position: absolute;
  width: 22.81%;
  left: 3%;
  bottom: 0.5%; }
  .footer .img img {
    width: 100%; }

.footer .logo {
  position: absolute;
  right: 2%;
  bottom: 0.5%;
  width: 14.37%; }
  .footer .logo img {
    width: 100%; }

/*modal
------------------------------------------------------------------------------*/
.modal__bg {
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#70000000,endcolorstr=#70000000, gradienttype=0);
  z-index: 720; }

.modal__open {
  cursor: pointer; }

.modal {
  position: fixed;
  display: none;
  width: 100%;
  height: 99%;
  margin: 0 auto;
  overflow: auto;
  z-index: 721; }

.modalInner {
  position: relative;
  width: 92%;
  margin: 0 auto;
  overflow: hidden;
  z-index: 721; }

.modal .ttl {
  position: relative;
  width: 100%;
  padding: 4.5% 0;
  text-align: center; }

.modal .inner {
  width: 100%;
  margin-top: -1%;
  background: url(../images/mdl_bg_inner.png) repeat-Y;
  background-size: 100%; }

.modal .inner .text {
  margin: 0 auto;
  padding: 5% 4%; }

.modal .inner .text02 {
  margin: 0 auto;
  padding: 5% 4% 0; }

.modal .inner .text03 {
  margin: 0 auto;
  margin-left: 1em;
  padding: 0 4% 5%;
  padding-left: 1em;
  color: #dc3957;
  text-indent: -1em; }

.modal .inner .imgBox table .ttl {
  color: #fff;
  border: none; }

#md01 .inner .imgBox table {
  width: 94%;
  margin: 0 auto;
  border-radius: 5px;
  border: 1px solid #ffd1d9;
  border-collapse: separate;
  border-spacing: 0px; }

#md01 .ttl {
  background: url(../images/mdl_bg_n_top.png) no-repeat;
  background-size: 100%;
  text-align: left; }
  #md01 .ttl img {
    width: 74.31%;
    margin-left: 10%; }

#md01 .close {
  position: absolute;
  top: 1.3%;
  right: 3%;
  width: 8.84%;
  cursor: pointer; }
  #md01 .close img {
    width: 100%; }

#md01 .inner .imgBox table th.left {
  padding: 2% 0;
  border-top-left-radius: 5px;
  border-right: 2px solid #fff;
  background: #ffd1d9;
  text-align: center; }

#md01 .inner .imgBox table th.right {
  border-top-right-radius: 5px;
  background: #ffd1d9;
  text-align: center; }

#md02 .inner .imgBox table {
  width: 94%;
  margin: 0 auto;
  border: 1px solid #ffc4c6;
  border-radius: 5px;
  border-collapse: separate;
  border-spacing: 0px; }

#md02 .ttl {
  background: url(../images/mdl_bg_y_top.png) no-repeat;
  background-size: 100%;
  text-align: left; }
  #md02 .ttl img {
    width: 74.31%;
    margin-left: 10%; }

#md02 .close {
  position: absolute;
  top: 2.8%;
  right: 3%;
  width: 8.84%;
  cursor: pointer; }
  #md02 .close img {
    width: 100%; }

#md02 .inner .imgBox table th.left {
  padding: 2% 0;
  border-right: 2px solid #fff;
  border-top-left-radius: 5px;
  background: #ffc4c6;
  text-align: center; }

#md02 .inner .imgBox table th.right {
  border-top-right-radius: 5px;
  background: #ffc4c6;
  text-align: center; }

.modal .inner .imgBox .img01 {
  width: 92.51%;
  margin: 0 auto; }
  .modal .inner .imgBox .img01 img {
    width: 100%; }

#md01 .inner .imgBox .img02 {
  width: 94%;
  margin: 0 auto;
  padding-bottom: 2%; }
  #md01 .inner .imgBox .img02 img {
    width: 100%; }

#md01 .inner .imgBox table tr td {
  padding: 4% 0;
  border-bottom: 1px solid #e6e6e6;
  text-align: center; }

#md01 .inner .imgBox table tr .left {
  border-right: 1px solid #e6e6e6; }

#md01 .inner .imgBox table .color {
  background-color: #fbebee; }

#md02 .inner .imgBox table tr td {
  padding: 4% 0;
  border-bottom: 1px solid #e6e6e6;
  text-align: center; }

#md02 .inner .imgBox table tr .left {
  border-right: 1px solid #e6e6e6; }

#md02 .inner .imgBox table .color {
  background-color: #fef0f0; }

.modal .inner .bottom {
  width: 100%;
  margin-top: -5%; }
  .modal .inner .bottom img {
    width: 100%; }

/*foot__fix
------------------------------------------------------------------------------*/
.foot__fix {
  position: fixed;
  bottom: -22%;
  width: 100%;
  padding-top: 22%;
  background: url(../images/foot_bg.png);
  z-index: 21; }

.foot__fix .entry__area {
  position: absolute;
  top: 0;
  width: 100%; }

.foot__fix .entry__area .inner .ttl {
  width: 25%;
  margin: 2% auto 0.5%; }
  .foot__fix .entry__area .inner .ttl img {
    width: 100%; }

.foot__fix .entry__area .inner .btn {
  width: 91.87%;
  margin: 0 auto 1%;
  display: -webkit-flex;
  display: -ms-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between; }

.foot__fix .entry__area .inner .btn .left {
  display: block;
  width: 49.82%; }

.foot__fix .entry__area .inner .btn .right {
  display: block;
  width: 49.48%; }