@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i");
@import url("https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i,900,900i");
#mainImg {
  background: url(../images/payment/pic-mainImg_001.jpg) center center no-repeat; }

/*　申し込みの流れ payment
-------------------------------------*/
#payment.payment_index #main .sectionIn > h4.mb10 {
  font-size: 33px !important; }
#payment.payment_index #main .sectionIn .downWrapp {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  margin-bottom: 50px; }
  #payment.payment_index #main .sectionIn .downWrapp .downBox {
    height: 140px;
    width: 350px;
    border: 2px solid #ddd;
    text-align: center;
    background: url(../images/insurance/bgi_insurance_about_001.jpg);
    position: relative;
    transition: 0.3s ease-in-out;
    margin-right: 30px; }
    #payment.payment_index #main .sectionIn .downWrapp .downBox:last-child {
      margin-right: 0; }
    #payment.payment_index #main .sectionIn .downWrapp .downBox:hover {
      background-image: none; }
    #payment.payment_index #main .sectionIn .downWrapp .downBox:hover h4 {
      color: #00893f; }
    #payment.payment_index #main .sectionIn .downWrapp .downBox > a {
      display: inline-block;
      width: 100%;
      height: 100%;
      text-decoration: none !important;
      transition: 0.3s ease-in-out; }
      #payment.payment_index #main .sectionIn .downWrapp .downBox > a:hover p.btn {
        opacity: 0.7; }
      #payment.payment_index #main .sectionIn .downWrapp .downBox > a h4 {
        margin-top: 34px;
        margin-bottom: 12px;
        font-size: 19px;
        color: #6d6d6d;
        transition: 0.3s ease-in-out; }
      #payment.payment_index #main .sectionIn .downWrapp .downBox > a p.btn {
        background-color: #ff7200 !important;
        text-align: center;
        transition: 0.3s ease-in-out; }
        #payment.payment_index #main .sectionIn .downWrapp .downBox > a p.btn:hover {
          opacity: 1; }
        #payment.payment_index #main .sectionIn .downWrapp .downBox > a p.btn a {
          position: relative;
          transition: 0.3s ease-in-out; }
          #payment.payment_index #main .sectionIn .downWrapp .downBox > a p.btn a::after {
            background: url(../images/common/ico-arrow_orange_down_001.png) no-repeat !important;
            background-size: contain !important; }
        #payment.payment_index #main .sectionIn .downWrapp .downBox > a p.btn span {
          text-align: center;
          display: inline-block;
          line-height: 38px;
          width: 178px;
          height: 38px;
          color: #fff;
          border-radius: 19px;
          text-decoration: none;
          font-size: 16px;
          font-weight: bold;
          padding: 0;
          position: relative; }
          #payment.payment_index #main .sectionIn .downWrapp .downBox > a p.btn span::after {
            content: '';
            background: url(../images/common/ico-arrow_orange_down_001.png) no-repeat !important;
            width: 20px;
            height: 20px;
            -webkit-background-size: contain;
            background-size: contain !important;
            display: block;
            position: absolute;
            top: calc(50% - 10px);
            right: 8px; }
#payment.payment_index #main .sectionIn .flow .box {
  padding: 40px 0;
  border-top: 1px solid #00893f;
  width: 100%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex; }
  #payment.payment_index #main .sectionIn .flow .box:last-child {
    border-bottom: 1px solid #00893f; }
  #payment.payment_index #main .sectionIn .flow .box .txt {
    width: 927px; }
    #payment.payment_index #main .sectionIn .flow .box .txt h5 {
      /*padding: 20px 0 20px 80px;*/
      margin-bottom: 20px !important; }
  #payment.payment_index #main .sectionIn .flow .box figure {
    width: 700px;
    padding-left: 40px; }
#payment.payment_index #main .sectionIn .flow .box.box01 h4 {
  background: url(../images/payment/ico-number_001.png) 10px center no-repeat;
  background-size: auto 73px; }
#payment.payment_index #main .sectionIn .flow .box.box02 h4 {
  background: url(../images/payment/ico-number_002.png) 10px center no-repeat;
  background-size: auto 73px; }
#payment.payment_index #main .sectionIn .flow .box.box03 h4 {
  background: url(../images/payment/ico-number_003.png) 10px center no-repeat;
  background-size: auto 73px; }
#payment.payment_index #main .sectionIn .flow .box.box04 h4 {
  background: url(../images/payment/ico-number_004.png) 10px center no-repeat;
  background-size: auto 73px; }
#payment.payment_index #main .sectionIn .kakomi {
  padding: 40px 50px 30px; }
  #payment.payment_index #main .sectionIn .kakomi .moduleList {
    margin-left: 0; }
    #payment.payment_index #main .sectionIn .kakomi .moduleList li {
      margin-bottom: 10px; }

.mw560 {
  max-width: 560px; }

@media screen and (max-width: 1000px) {
  .flow .box {
    -webkit-flex-flow: column;
    /*--- safari（PC）用 ---*/
    flex-flow: column; }
    .flow .box .txt {
      width: 100% !important;
      margin-bottom: 30px; }
      .flow .box .txt h5 {
        /*padding: 20px 0 20px 80px;*/
        margin-bottom: 20px !important; }
    .flow .box figure {
      max-width: 700px !important;
      width: 100% !important;
      padding-left: 0px !important;
      text-align: center;
      margin: 0 auto; }

  .kakomi {
    padding: 20px !important; }

  .mw560 {
    max-width: none; } }
@media screen and (max-width: 760px) {
  .downWrapp {
    -webkit-flex-flow: column;
    /*--- safari（PC）用 ---*/
    flex-flow: column; }
    .downWrapp .downBox {
      width: 300px !important;
      height: 120px !important;
      margin: 0 auto;
      margin-bottom: 20px;
      margin-right: auto !important; }
      .downWrapp .downBox:last-child {
        margin-bottom: 0; }
      .downWrapp .downBox h4 {
        margin-top: 22px !important; } }
