@charset "UTF-8";
@import url(slick.css);
@import url(slick-theme.css);
/* flow
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.flow .pageHeaderSecond {
  background: url(../img/flow/title_bg.jpg) no-repeat center center;
  background-size: cover; }
.flow .pageLead {
  text-align: center;
  margin-top: 32px;
  margin-bottom: 32px;
  font-size: 1.6rem; }
.flow .lnaviArea {
  border-top: 1px solid #ececec;
  margin-bottom: 32px; }
.flow .flowBox {
  width: 856px;
  margin: 0 auto 56px;
  padding-bottom: 48px;
  background-color: #f4f4f1;
  position: relative;
  text-align: center; }
  .flow .flowBox.last:before {
    display: none; }
  .flow .flowBox:before {
    content: "";
    background: url(../img/flow/arrow.png) no-repeat left top;
    background-size: 40px 24px;
    width: 40px;
    height: 24px;
    position: absolute;
    left: 50%;
    bottom: -40px;
    margin-left: -20px; }
  .flow .flowBox h3 {
    font-size: 2rem;
    font-weight: bold;
    padding: 32px 0;
    line-height: 1;
    text-align: center;
    margin: 0; }
  .flow .flowBox .pic {
    margin-bottom: 24px; }
  .flow .flowBox .chart {
    margin-bottom: 32px; }
    .flow .flowBox .chart img {
      margin: auto; }
  .flow .flowBox .caution {
    font-size: 1.2rem; }
  .flow .flowBox .lead {
    text-align: center;
    margin-bottom: 24px; }
  .flow .flowBox .btnBox {
    text-align: center; }
    .flow .flowBox .btnBox > div {
      display: inline-block;
      width: 282px;
      margin: 0 9px; }
      .flow .flowBox .btnBox > div.btnFair a {
        background-color: #7d7153; }
      .flow .flowBox .btnBox > div a {
        display: block;
        background-color: #998452;
        color: #fff;
        font-weight: bold;
        line-height: 1;
        text-align: center;
        display: block;
        width: 100%;
        padding: 17px 0; }
        .flow .flowBox .btnBox > div a:hover {
          filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60);
          opacity: 0.6;
          text-decoration: none; }
        .flow .flowBox .btnBox > div a:after {
          content: "";
          width: 7px;
          height: 9px;
          background: url(../img/common/btn_arrow_white.png) no-repeat left top;
          background-size: 7px 9px;
          margin-left: 0.8em;
          display: inline-block; }
.flow .contactBox {
  margin-top: 80px; }
.flow .accessArea {
  display: none; }

/* ==========================================================================
    
   sp
   
   ========================================================================== */
@media screen and (max-width: 767px) {
  .flow .pageLead {
    text-align: center;
    margin-top: 16px;
    margin-bottom: 32px;
    font-size: 1.2rem; }
  .flow .lnaviArea {
    margin-bottom: 0px; }
  .flow .flowBoxWrap {
    padding: 0 5%; }
  .flow .flowBox {
    width: 100%;
    margin: 0 auto 40px;
    padding-bottom: 24px;
    background-color: #f4f4f1;
    position: relative;
    text-align: center; }
    .flow .flowBox.last:before {
      display: none; }
    .flow .flowBox:before {
      content: "";
      background: url(../img/flow/arrow.png) no-repeat left top;
      background-size: 30px 18px;
      width: 30px;
      height: 18px;
      position: absolute;
      left: 50%;
      bottom: -30px;
      margin-left: -15px; }
    .flow .flowBox h3 {
      font-size: 1.4rem;
      font-weight: bold;
      padding: 16px 0;
      line-height: 1;
      text-align: center;
      margin: 0; }
    .flow .flowBox .pic {
      margin-bottom: 16px; }
    .flow .flowBox .chart {
      margin-bottom: 16px;
      padding: 0 5%; }
      .flow .flowBox .chart img {
        margin: auto; }
    .flow .flowBox .caution {
      font-size: 1rem; }
    .flow .flowBox .lead {
      text-align: center;
      margin-bottom: 16px; }
    .flow .flowBox .btnBox {
      text-align: center; }
      .flow .flowBox .btnBox > div {
        display: inline-block;
        width: 240px;
        margin: 0 0 8px; }
        .flow .flowBox .btnBox > div.btnFair a {
          background-color: #7d7153; }
        .flow .flowBox .btnBox > div a {
          display: block;
          background-color: #998452;
          color: #fff;
          font-weight: normal;
          line-height: 1;
          text-align: center;
          display: block;
          width: 100%;
          padding: 15px 0; }
          .flow .flowBox .btnBox > div a:hover {
            filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60);
            opacity: 0.6;
            text-decoration: none; }
          .flow .flowBox .btnBox > div a:after {
            content: "";
            width: 7px;
            height: 9px;
            background: url(../img/common/btn_arrow_white.png) no-repeat left top;
            background-size: 7px 9px;
            margin-left: 0.8em;
            display: inline-block; }
  .flow .accessArea {
    margin-top: 40px;
    display: block;
    border-top: 1px solid #f4f4f2;
    padding-top: 35px; }
  .flow .contactBox {
    display: none; } }