@charset "UTF-8";
.block-text .break {
  margin-bottom: 25px; }

.block-text .bold {
  font-weight: bold; }

.block-text-yugo {
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-weight: 500; }
  .block-text-yugo .break {
    margin-bottom: 25px; }
  .block-text-yugo .bold {
    font-weight: bold; }

@media screen and (min-width: 768px), print {
  /* PC用 共通して使える -------------------------------------*/
  #lead {
    margin-bottom: 45px; }
    #lead .bg-box {
      background: url(../images/flow/lead-bg01.jpg) repeat top; }
      #lead .bg-box .Box {
        background: url(../images/flow/lead-bg02.jpg) no-repeat top;
        width: 1000px;
        margin: 0 auto;
        padding: 43px 0 32px; }
        #lead .bg-box .Box .ttl {
          margin-bottom: 37px; }
        #lead .bg-box .Box .txt {
          font-size: 17px;
          font-weight: bold;
          line-height: 2.3;
          letter-spacing: 0.1em;
          color: #fff;
          text-align: center; }
  /* list-box
  -------------------------------------*/
  .list-box .Box {
    width: 1000px;
    margin: 0 auto;
    /*------------------------ここまでlist-box-----------------------------*/ }
    .list-box .Box .list {
      /* li01
      -------------------------------------*/
      /*------------------------ここまで list-----------------------------*/ }
      .list-box .Box .list > li {
        background-color: #1c3847;
        padding: 45px 50px 35px;
        margin-bottom: 65px;
        position: relative;
        /*------------------------ここまでli-----------------------------*/ }
        .list-box .Box .list > li::after {
          content: "";
          background: url(../images/flow/arrow-icon.png) no-repeat bottom;
          position: absolute;
          bottom: -40px;
          left: 0;
          right: 0;
          margin-left: auto;
          margin-right: auto;
          text-align: center;
          width: 40px;
          height: 26px; }
        .list-box .Box .list > li .ttl-box {
          position: relative;
          padding-bottom: 20px; }
          .list-box .Box .list > li .ttl-box .rel-box {
            position: relative; }
            .list-box .Box .list > li .ttl-box .rel-box .num {
              position: absolute;
              top: 50%;
              transform: translateY(-50%); }
            .list-box .Box .list > li .ttl-box .rel-box .ttl {
              padding-left: 160px; }
          .list-box .Box .list > li .ttl-box .txt {
            position: absolute;
            right: 0;
            bottom: 8px; }
        .list-box .Box .list > li .bg-box {
          background: url(../images/flow/bg01.jpg) repeat top;
          padding: 30px 40px; }
          .list-box .Box .list > li .bg-box .box-l {
            padding-top: 20px;
            width: 405px;
            line-height: 1.8; }
            .list-box .Box .list > li .bg-box .box-l p {
              margin-bottom: 20px; }
      .list-box .Box .list .li01 {
        padding: 20px 50px 26px;
        /*------------------------ここまでli01-----------------------------*/ }
        .list-box .Box .list .li01 .pic {
          position: absolute;
          right: -25px;
          bottom: -30px; }
        .list-box .Box .list .li01 .flexbox {
          margin-bottom: 30px; }
        .list-box .Box .list .li01 .bg-contact {
          background: url(../images/flow/bg-contact-bg-t.jpg) no-repeat top, url(../images/flow/bg-contact-bg-b.jpg) no-repeat bottom, url(../images/flow/bg-contact-bg-m.jpg) repeat top;
          width: 784px;
          margin: 0 auto;
          padding: 25px 4px;
          position: relative; }
          .list-box .Box .list .li01 .bg-contact .ttl02 {
            padding-bottom: 10px;
            border-bottom: 2px solid #b2b2b2;
            margin-bottom: 20px; }
          .list-box .Box .list .li01 .bg-contact .tel {
            margin-bottom: 26px; }
          .list-box .Box .list .li01 .bg-contact .bnr-txt {
            position: absolute;
            bottom: -14px;
            left: -38px; }
          .list-box .Box .list .li01 .bg-contact .bnr-pic {
            position: absolute;
            bottom: -14px;
            right: 38px; }
          .list-box .Box .list .li01 .bg-contact .btn-list li:nth-of-type(1) {
            margin-right: 27px; }
      .list-box .Box .list .li02 {
        /*------------------------ここまでli02-----------------------------*/ }
        .list-box .Box .list .li02 .pic {
          position: absolute;
          right: -25px;
          bottom: -25px; }
      .list-box .Box .list .li03 {
        /*------------------------ここまでli03-----------------------------*/ }
        .list-box .Box .list .li03 .pic {
          position: absolute;
          right: 25%;
          transform: translate(-50%, -50%);
          bottom: -25%; }
          .list-box .Box .list .li03 .pic2 {
          position: absolute;
          right: 25%;
          top: 38%;
          transform: translate(-50%, -50%);
          bottom: -25%; }
          .list-box .Box .list .li03 .pic3 {
          position: absolute;
          right: -30%;
          border: 10%;
          transform: translate(-50%, -50%);
          bottom: -25%; }
          
            
      .list-box .Box .list .li04 {
        /*------------------------ここまでli04-----------------------------*/ }
        .list-box .Box .list .li04 .pic {
          position: absolute;
          right: 5%;
          bottom: -2%; }
      .list-box .Box .list .li05 {
        /*------------------------ここまでli05-----------------------------*/ }
        .list-box .Box .list .li05 .pic {
          position: absolute;
          transform: translate(-50%, -50%);
          bottom: -25%; }
      .list-box .Box .list .li06 {
        /*------------------------ここまでli06-----------------------------*/ }
        .list-box .Box .list .li06 .pic {
          position: absolute;
          right: 0; }
  #flow02 {
    margin-bottom: 65px;
    position: relative;
    /*------------------------ここまでflow02-----------------------------*/ }
    #flow02::after {
      content: "";
      background: url(../images/flow/arrow-icon.png) no-repeat bottom;
      position: absolute;
      bottom: -40px;
      left: 0;
      right: 0;
      margin-left: auto;
      margin-right: auto;
      text-align: center;
      width: 40px;
      height: 26px; }
    #flow02 .bg-box02 {
      padding: 35px 0 50px;
      background: url(../images/flow/csrn-bg.jpg);
      /*------------------------ここまでbg-box02-----------------------------*/ }
      #flow02 .bg-box02 .ttl {
        margin-bottom: 15px;
        width: 740px;
        margin-left: auto;
        margin-right: auto;
        display: -moz-flex;
        display: flex;
        -webkit-box-lines: multiple;
        -moz-box-lines: multiple;
        flex-wrap: wrap;
        -webkit-flex-pack: end;
        -moz-flex-pack: end;
        -moz-justify-content: flex-end;
        justify-content: flex-end; }
        #flow02 .bg-box02 .ttl .en {
          margin-right: 2em; }
        #flow02 .bg-box02 .ttl .tool {
          -ms-align-self: center;
          -ms-grid-row-align: center;
              align-self: center; }
      #flow02 .bg-box02 .list {
        /*------------------------ここまでlist-----------------------------*/ }
        #flow02 .bg-box02 .list > li {
          margin-bottom: 25px;
          /*------------------------ここまでli-----------------------------*/ }
          #flow02 .bg-box02 .list > li:last-child {
            margin-bottom: 0; }
          #flow02 .bg-box02 .list > li .flex {
            height: 297px;
            width: 1094px;
            margin-left: auto;
            margin-right: auto;
            background: url(../images/flow/csrn-bg02.jpg) no-repeat right top;
            /*------------------------ここまでflex-----------------------------*/ }
            #flow02 .bg-box02 .list > li .flex .photo {
              width: 384px; }
            #flow02 .bg-box02 .list > li .flex .box-r {
              width: 710px;
              padding: 0 80px 0 30px;
              color: #fff;
              -ms-align-self: center;
              -ms-grid-row-align: center;
                  align-self: center;
              /*------------------------ここまでbr-----------------------------*/ }
              #flow02 .bg-box02 .list > li .flex .box-r .ttl02 {
                margin-bottom: 45px; }
  #flow03 {
    /*------------------------ここまでflow03-----------------------------*/ }
    #flow03 .Box {
      /*------------------------ここまでBox-----------------------------*/ }
      #flow03 .Box .list {
        /*------------------------ここまでlist-----------------------------*/ }
        #flow03 .Box .list .li07 {
          /*------------------------ここまで07-----------------------------*/ }
          #flow03 .Box .list .li07 .pic {
            position: absolute;
            transform: translate(-50%, -50%);
            left: 90%;
            bottom: -25%; }
        #flow03 .Box .list .li08 {
          /*------------------------ここまで08-----------------------------*/ }
          #flow03 .Box .list .li08 .pic {
            position: absolute;
            transform: translate(-50%, -50%);
            left: 90%;
            bottom: -110px; }
        #flow03 .Box .list .li09 {
          /*------------------------ここまで09日-----------------------------*/ }
          #flow03 .Box .list .li09 .pic {
            position: absolute;
            transform: translate(-50%, -50%);
            left: 85%;
            bottom: -25%; }
  #tour {
    margin-bottom: 65px;
    position: relative;
    /*------------------------ #tour-----------------------------*/ }
    #tour::after {
      content: "";
      background: url(../images/flow/arrow-icon.png) no-repeat bottom;
      position: absolute;
      bottom: -40px;
      left: 0;
      right: 0;
      margin-left: auto;
      margin-right: auto;
      text-align: center;
      width: 40px;
      height: 26px; }
    #tour.contents-background {
      background: url(../images/flow/tour-bg01.jpg); }
    #tour .Box {
      width: 1100px;
      margin-left: auto;
      margin-right: auto;
      /*------------------------ Box-----------------------------*/ }
      #tour .Box .ttl {
        background-color: #912c2b;
        padding: 35px 50px;
        text-align: left;
        /*----------------------------------------------------*/ }
        #tour .Box .ttl .flag {
          margin-right: .5em; }
      #tour .Box .block-wapper {
        background: url(../images/flow/tour-icon01.png) no-repeat left 10% bottom 10%, url(../images/flow/tour-icon02.png) no-repeat right 10% bottom 10%, url(../images/flow/block-wapper-bg.jpg) no-repeat center;
        padding: 20px 0 50px;
        text-align: center;
        /*-----------------------------------------------------*/ }
        #tour .Box .block-wapper .sub-title {
          margin-bottom: 25px;
          /*------------------------ -----------------------------*/ }
          #tour .Box .block-wapper .sub-title span {
            display: block; }
          #tour .Box .block-wapper .sub-title .st01 {
            margin-bottom: 15px; }
      #tour .Box .block-text {
        color: #fff;
        margin-bottom: 0; }
  #flow04 {
    /*------------------------ここまでflow04-----------------------------*/ }
    #flow04 .Box {
      /*------------------------ここまでBox-----------------------------*/ }
      #flow04 .Box .list {
        /*------------------------ここまでlist-----------------------------*/ }
        #flow04 .Box .list .li10 {
          /*------------------------ここまで10-----------------------------*/ }
          #flow04 .Box .list .li10 .pic {
            position: absolute;
            transform: translate(-50%, -50%);
            left: 90%;
            bottom: -120px; }
        #flow04 .Box .list .li11 {
          /*------------------------ここまで11-----------------------------*/ }
          #flow04 .Box .list .li11::after {
            content: none; }
          #flow04 .Box .list .li11 .pic {
            position: absolute;
            transform: translate(-50%, -50%);
            left: 85%;
            bottom: -25%; }
  /*----------------------------------------------------------------------------------------------------------------------*/ }

@media screen and (max-width: 767px) {
  main .flex-ce {
    display: block; }
  main .flexbox {
    display: block; }
  main .flex-mce {
    display: block; }
  main .order {
    order: 2; }
  #lead {
    margin-bottom: 10%; }
    #lead .bg-box {
      background: url(../images/flow/lead-bg01.jpg) repeat top; }
      #lead .bg-box .Box {
        background: url(../images/flow/lead-bg02.jpg) no-repeat top;
        margin: 0 auto;
        padding: 8% 5%; }
        #lead .bg-box .Box .ttl {
          margin-bottom: 5%; }
        #lead .bg-box .Box .txt {
          font-size: 1.4rem;
          font-weight: bold;
          line-height: 1.5;
          letter-spacing: 0.1em;
          color: #fff; }
  /* list-box
  -------------------------------------*/
  .list-box .Box {
    padding: 0 3%;
    /*------------------------ここまでlist-box-----------------------------*/ }
    .list-box .Box .list {
      /* li01
      -------------------------------------*/
      /*------------------------ここまで list-----------------------------*/ }
      .list-box .Box .list > li {
        background-color: #1c3847;
        padding: 3%;
        margin-bottom: 15%;
        position: relative;
        /*------------------------ここまでli-----------------------------*/ }
        .list-box .Box .list > li::after {
          content: "";
          background: url(../images/flow/arrow-icon.png) no-repeat bottom;
          position: absolute;
          bottom: -40px;
          left: 0;
          right: 0;
          margin-left: auto;
          margin-right: auto;
          text-align: center;
          width: 40px;
          height: 26px; }
        .list-box .Box .list > li .pic {
          display: none; }
          .list-box .Box .list > li .pic2 {
          position: absolute;
          top:7%; 
          left: 3%;
          width: 50%;}
          .list-box .Box .list .li03 .pic3{margin-top: 5vw;}
        .list-box .Box .list > li .ttl-box {
          position: relative;
          padding-bottom: 3%; }
          .list-box .Box .list > li .ttl-box .rel-box {
            display: block; }
            .list-box .Box .list > li .ttl-box .rel-box .num {
              text-align: center;
              margin-bottom: 5%;
              display: block; }
            .list-box .Box .list > li .ttl-box .rel-box .ttl {
              text-align: center; }
          .list-box .Box .list > li .ttl-box .txt {
            text-align: center; }
        .list-box .Box .list > li .bg-box {
          background: url(../images/flow/bg01.jpg) repeat top;
          padding: 5%; }
          .list-box .Box .list > li .bg-box .sp-flexbox {
            display: -moz-flex;
            display: flex;
            -webkit-box-lines: multiple;
            -moz-box-lines: multiple;
            flex-wrap: wrap;
            flex-wrap: wrap-reverse; }
          .list-box .Box .list > li .bg-box .box-l {
            padding-top: 3%;
            line-height: 1.8;
            font-size: 1.3rem; }
            .list-box .Box .list > li .bg-box .box-l p {
              margin-bottom: 3%; }
      .list-box .Box .list .li01 {
        /*------------------------ここまでli01-----------------------------*/ }
        .list-box .Box .list .li01 .bg-contact {
          background: url(../images/flow/bg-contact-bg-t.jpg) no-repeat top, url(../images/flow/bg-contact-bg-b.jpg) no-repeat bottom, url(../images/flow/bg-contact-bg-m.jpg) repeat top;
          padding: 8% 3%;
          position: relative; }
          .list-box .Box .list .li01 .bg-contact .ttl02 {
            padding-bottom: 3%;
            border-bottom: 2px solid #b2b2b2;
            margin-bottom: 3%; }
          .list-box .Box .list .li01 .bg-contact .tel {
            margin-bottom: 5%; }
          .list-box .Box .list .li01 .bg-contact .btn-list li {
            margin-bottom: 5%; }
            .list-box .Box .list .li01 .bg-contact .btn-list li:last-child {
              margin-bottom: 0; }
  #flow02 {
    margin-bottom: 15%;
    position: relative;
    /*------------------------ここまでflow02-----------------------------*/ }
    #flow02::after {
      content: "";
      background: url(../images/flow/arrow-icon.png) no-repeat bottom;
      position: absolute;
      bottom: -40px;
      left: 0;
      right: 0;
      margin-left: auto;
      margin-right: auto;
      text-align: center;
      width: 40px;
      height: 26px; }
    #flow02 .bg-box02 {
      padding: 8% 0 5%;
      background: url(../images/flow/csrn-bg.jpg);
      /*------------------------ここまでbg-box02-----------------------------*/ }
      #flow02 .bg-box02 .ttl {
        margin-bottom: 8%; }
        #flow02 .bg-box02 .ttl .en {
          display: block;
          width: 70%;
          margin-left: auto;
          margin-right: auto; }
        #flow02 .bg-box02 .ttl .tool {
          display: none; }
      #flow02 .bg-box02 .list {
        /*------------------------ここまでlist-----------------------------*/ }
        #flow02 .bg-box02 .list > li {
          margin-bottom: 3%;
          padding: 0 5%;
          /*------------------------ここまでli-----------------------------*/ }
          #flow02 .bg-box02 .list > li:last-child {
            margin-bottom: 0; }
          #flow02 .bg-box02 .list > li .flex {
            display: block;
            background: url(../images/flow/csrn-bg02.jpg) no-repeat center right;
            background-size: cover;
            /*------------------------ここまでflex-----------------------------*/ }
            #flow02 .bg-box02 .list > li .flex .photo {
              width: 100%; }
            #flow02 .bg-box02 .list > li .flex .box-r {
              padding: 8% 3%;
              color: #fff;
              /*------------------------ここまでbr-----------------------------*/ }
              #flow02 .bg-box02 .list > li .flex .box-r .ttl02 {
                margin-bottom: 5%; }
  #tour {
    margin-bottom: 15%;
    position: relative;
    /*------------------------ #tour-----------------------------*/ }
    #tour::after {
      content: "";
      background: url(../images/flow/arrow-icon.png) no-repeat bottom;
      position: absolute;
      bottom: -40px;
      left: 0;
      right: 0;
      margin-left: auto;
      margin-right: auto;
      text-align: center;
      width: 40px;
      height: 26px; }
    #tour.contents-background {
      background: url(../images/flow/tour-bg01.jpg); }
    #tour .Box {
      /*------------------------ Box-----------------------------*/ }
      #tour .Box .ttl {
        background-color: #912c2b;
        padding: 5% 8%;
        text-align: left;
        /*----------------------------------------------------*/ }
        #tour .Box .ttl .flag {
          display: block;
          width: 12%;
          margin-left: auto;
          margin-right: auto;
          margin-bottom: 3%; }
      #tour .Box .block-wapper {
        background: url(../images/flow/block-wapper-bg.jpg) no-repeat center;
        padding: 8% 3%;
        /*-----------------------------------------------------*/ }
        #tour .Box .block-wapper .sub-title {
          text-align: center;
          margin-bottom: 8%;
          /*------------------------ -----------------------------*/ }
          #tour .Box .block-wapper .sub-title span {
            display: block; }
          #tour .Box .block-wapper .sub-title .st01 {
            margin-bottom: 15px; }
      #tour .Box .block-text {
        color: #fff;
        margin-bottom: 0; }
  #flow04 {
    /*------------------------ここまでflow04-----------------------------*/ }
    #flow04 .Box {
      /*------------------------ここまでBox-----------------------------*/ }
      #flow04 .Box .list {
        /*------------------------ここまでlist-----------------------------*/ }
        #flow04 .Box .list .li10 {
          /*------------------------ここまで10-----------------------------*/ }
          #flow04 .Box .list .li10 .pic {
            position: absolute;
            transform: translate(-50%, -50%);
            left: 90%;
            bottom: -27%; }
        #flow04 .Box .list .li11 {
          /*------------------------ここまで11-----------------------------*/ }
          #flow04 .Box .list .li11::after {
            content: none; }
          #flow04 .Box .list .li11 .pic {
            position: absolute;
            transform: translate(-50%, -50%);
            left: 85%;
            bottom: -25%; } }