@charset "utf-8";

	.parent {
		position: relative;
	}
	.absolute {
		position: absolute;
		top: 100px;
		left: 0;
	}

	#mainContent h6 {
		font-size: 115%;
	}

	.advantages span {
		color: #0060b0;
		font-weight: bold;
	}
	.advantages span.dot {
		padding-right: 3px;
		color: #e0effa;
	}

	.step dt {
		color: #0060b0;
		font-weight: bold;
	}
	.step dt span {
		padding-right: 3px;
		color: #e0effa;
		font-weight: bold;
	}
	.step dd {
		margin-bottom: 30px;
		padding-left: 10px;
	}
	.step dd.last {
		margin-bottom: 0;
	}
	.floatBox .fl {
		max-width: 470px;
	}
	.fr{
		width: 70%;
	}
  .letterSpacewide {
    letter-spacing: -0.026em;
  }
	@media only screen and (max-width:640px) {	
		.floatBox .fl,
		.floatBox .fr {
			float: none;
			margin-bottom: 20px;
		}	
		.fr{
		width: 100%;
	}
	}
  .flowArea {
    display: flex;
    justify-content: space-between;
    margin-bottom: 60px;
    flex-wrap: wrap;
  }
  .flowArea__item {
    width: 160px;
  }
  @media only screen and (max-width:640px) {
    .flowArea__item {
      width: 47%;
      margin-bottom: 30px;
    }
  }
  .flowArea__title {
    font-size: 12px;
    margin-bottom: 15px;
    line-height: 0;
    position: relative;
    margin-left: 15px;
  }
  .flowArea__title::before {
    position: absolute;
    content: '';
    width: 5px;
    height: 12px;
    background-color: #0060b0;
    top: -5px;
    left: -15px;
  }
  .flowArea__title::after {
    position: absolute;
    content: '';
    width: 5px;
    height: 12px;
    background-color: #e0effa;
    top: -5px;
    left: -10px;
  }
  .flowArea__box {
    margin-bottom: 15px;
    position: relative;
  }
  @media only screen and (max-width:640px) {
   .flowArea__box {
      margin-bottom: 10px;
    }
  }
  .flowArea__box::after {
    position: absolute;
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-color: transparent transparent transparent #000000;
    top: 55px;
    right: -13px;
  }
  .flowArea__item:last-of-type .flowArea__box::after {
    display: none;
  }
  .flowArea__box img {
    width: 100%;
  }
  .flowArea__box__text {
    font-size: 12px;
    line-height: calc(20/12);
    letter-spacing: -0.02em;
    width: 130px;
    position: absolute;
    top: 47px;
    left: 15px;
  }
  @media only screen and (max-width:640px) {
   .flowArea__box__text {
      font-size: 10px;
      width: 80%;
      position: absolute;
      top: 42%;
      left: 10px;
    }
  }
  .flowArea__text {
    font-size: 12px;
    line-height: calc(20/12);
    letter-spacing: 0;
  }
  @media only screen and (max-width:640px) {
   .flowArea__text {
      font-size: 10px;
    }
  }


.image {
  width: 194px;
  display: inline-block;
}

@media screen and (max-width: 640px) {
  .image {
    width: 100%;
  }
}