@charset "UTF-8";

/* FV SP
-------------------------------*/
.fv-wrap{
	margin: 85px 0 0;
	position: relative;
}
.fv-wrap h2{
	width: 100%;
	position: absolute;
	left: 0;
	top: 39%;
	z-index: 10;
}
.fv-wrap h2 span{
	display: block;
	max-width: 60rem;
	margin: 0 auto;
	padding: 0 4.5rem;
	text-align: center;
}
@media screen and (min-width:600px) {
	.fv-wrap h2 span{
		padding: 0 10rem;
	}
}

/* FV画像 SP ---------- */
.fv-pc{
	display: none;
}
.fv-sp{
	display: block;
}
.fv-sp p:first-child{
	padding: 0 0 5rem;
}

/* FV CTA SP
-------------------------------*/
.fv-cta{
	line-height: 1;
}
.fv-cta > p{
	display: block;
}
.fv-cta-bg{
	padding: 0;
  color: #fff;
  background: linear-gradient(to bottom, #e7101f, #c1101c);
}
.fv-cta-btn{
	max-width: auto;
	margin: 0;
  padding:2rem 2rem 0;
  position: relative;
}
.fv-cta-btn-in{
	padding: 0;
	position: static;
}
.fv-cta-btn-in p:first-child{
	margin: 0 0 1rem;
	padding: 0;
	text-align: center;
	font-size: 2.4rem;
	font-weight: bold;
	line-height: 1.4;
	position: relative;
}
.fv-cta-btn-in p:first-child::before,
.fv-cta-btn-in p:first-child::after {
	content: "";
	display: block;
	width: 2.5rem;
	height: 5.5rem;
	position: absolute;
	top: 10px;
}
.fv-cta-btn-in p:first-child::before {
	background: url("../img/cta-line-left.svg") no-repeat center center;
	left: 0;
}
.fv-cta-btn-in p:first-child::after {
  background: url("../img/cta-line-right.svg") no-repeat center center;
  right: 0;
}

/* FV CTA ボタン SP ----------- */
.fv-cta-btn-in p:last-child a {
  display: block;
  width: auto;
  margin: 0 auto;
  padding: 2.5rem 3.5rem 2.5rem 2.5rem;  
  text-align: center;
  line-height: 1;
  border: 5px solid var(--red);
  border-radius: 10rem;
  background: #000;
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
}
.fv-cta-btn-in p:last-child a span {
  font-size: 1.6rem;
  position: relative;
}
.fv-cta-btn-in p:last-child a span::after {
  content: "";
  display: block;
  width: 1.8rem;
  height: 1.8rem;
  background: #fff url("../img/common-arr-red-right.svg")no-repeat 65% center;
  background-size: 55%;
  border-radius: 1rem;
  position: absolute;
  top: 50%;
  left: 100%;
  transform: translateY(-50%);
}
.fv-cta-btn figure {
  max-width: 28rem;
  margin: 0 auto;
}


/* problem SP
-------------------------------*/
.problem{
	padding: 3rem 1rem 2rem;
}

.problem-list{
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 3rem 0 0;
}
.problem-list article{
	width: auto;
	margin: 0 0 1rem;
	padding: 3rem 2rem;
	text-align: center;
	background: #f8f8f8;
}
.problem-list article figure{
	margin: 0 auto;
	padding: 0 0 3rem;
}

/* 各画像サイズ調整 SP --------- */
.problem-list article figure{
	height: auto;
}
.problem-list article:first-child figure{width: 15rem;}
.problem-list article:nth-child(2) figure{width: 17.6rem;}
.problem-list article:nth-child(3) figure{width: 20rem;}
.problem-list article:nth-child(4) figure{width: 18.5rem;}
.problem-list article:last-child figure{width: 19.2rem;}

.problem-list article h3{
	margin: 0 0 3rem;	
	border-bottom: 1px solid #ccc;
	position: relative;
}
.problem-list article h3 span{
	display: block;
	width: 100%;	
	position: absolute;
	top: -10px;
	left: 0;
}
.problem-list article h3 span strong{
	display: block;
	width: 12rem;
	margin: 0 auto;
	line-height: 1.5;
	border-radius: 30px;
	color: #fff;
	background: var(--red);
	font-family: 'Roboto', sans-serif;
	font-size: 1.6rem;
	font-weight: bold;
}
.problem-list article h3 + p{
	line-height: 1.6;
	font-size: 2rem;
	font-weight: bold;
}

/* ---------- support point ---------- */
.support {
  background: var(--gray);
  padding: 3rem 1rem;
}
.support h2{
  padding: 0;
}

.point-box {
  background: #fff;
  border-radius: 1rem;
  max-width: 120rem;
  margin: 4rem auto 0;
  padding: 6rem 2rem 3rem;
}
.point-box h3 {
  font-size: 1.8rem;
  font-weight: bold;
  margin-bottom: 2.5rem;
  position: relative;
}
.point-box h3 span {
  background: var(--red);
  color: #fff;
  line-height: 1;
  padding: 2rem 3rem 1.5rem;
  position: absolute;
  top: -7rem;
  left: -1.3rem;
}
.point-box h3 span::before {
  content: "";
  display: block;
  width: 1rem;
  height: 1rem;
  background: url("../img/point-note-pepar.svg") no-repeat;
  position: absolute;
  top: 0;
  right: -1rem;
}
.point-box ul {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  flex-wrap: wrap;
}
.point-box li {
  font-weight: bold;
  text-align: center;
  margin-bottom: 3rem;
}
.point-box li figure {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.point-box.point01 li {
  width: 46%;
}
.point-box.point02 li {
  width: 100%;
}
.point-box.point03 ul {
  flex-direction: column;
  align-items: center;
  background: #f9f8f8 url("../img/point03-ill.svg") no-repeat center bottom;
  background-size: 17rem;
  padding: 1.5rem 0 19rem;
  margin-bottom: 1.5rem;
  border-radius: 1rem;
}
.point-box.point03 li {
  font-size: 1.5rem;
  font-weight: normal;
  line-height: 1.5;
  text-align: center;
  width: 23.5rem;
  height: 6.5rem;
}
.point-box.point03 li span {
  display: inline-block;
  text-align: left;
}
.point-box.point03 li:nth-child(1) {
  background: url("../img/point03-bubble-sp-left.svg") no-repeat left top;
  margin: 0 5.5rem 0 0;
  padding-top: 0.7rem;
}
.point-box.point03 li:nth-child(2) {
  background: url("../img/point03-bubble-sp-right.svg") no-repeat right top;
  margin: -0.5rem 0 0 5rem;
  padding-top: 0.7rem;
}
.point-box.point03 li:nth-child(3) {
  background: url("../img/point03-bubble-sp-left.svg") no-repeat left top;
  margin: -0.5rem 3.5rem 0 0;
  padding-top: 1.7rem;
}
.point-box.point03 li:nth-child(4) {
  background: url("../img/point03-bubble-sp-right.svg") no-repeat right top;
  margin: -0.5rem 0 0 2.5rem;
  padding-top: 0.7rem;
}
.point-box li figcaption {
  padding-top: 0.5rem;
}
.point-box > p {
  color: var(--red);
  font-weight: bold;
  padding: 1rem 2rem;
  border: 0.1rem var(--red) solid;
  text-align: center;
}
.point-box > p span {
  display: inline-block;
  text-align: left;
}


/* ---------- recommend ---------- */

.recommend {
  background: var(--red);
  padding: 3rem 0 1rem;
}
.recommend h2 {
  color: #fff;
  padding-bottom: 2rem;
}

.recommend-box {
  max-width: 142rem;/*コンテンツ幅1400px、左右余白各10px*/
  padding: 0 1rem;
  margin: 0 auto;
}
.recommend-item {
  background: #fff;
  padding: 3rem 2rem 2rem;
  border-radius: 0.5rem;
  margin-bottom: 2rem;
}

/* ---------- voice ---------- */

.voice {
  background: var(--gray);
  padding: 3rem 0;
}
.voice h2 {
  margin-bottom: 2rem;
}

.voice-box {
  max-width: 142rem;/*コンテンツ幅1400px、左右余白各10px*/
  padding: 0 1rem;
  margin: 0 auto;
}
.voice-item {
  padding: 3rem 2rem 23rem;
  border-radius: 2rem;
  margin-bottom: 3rem;
}
.voice-item.voice01 {
  background: #eee url("../img/voice-ph01.png") no-repeat center 130%;
  background-size: 22.5rem;
}
.voice-item.voice02 {
  background: #eee url("../img/voice-ph02.png") no-repeat center 175%;
  background-size: 20rem;
}
.voice-item.voice03 {
  margin-bottom: 0;
  background: #eee url("../img/voice-ph03.png") no-repeat 30% 115%;
  background-size: 20rem;
}
.voice-item h3 {
  font-size: 2.1rem;
  font-weight: bold;
  color: var(--red);
  margin-bottom: 1rem;
}
.voice-item .voice-txt {
  padding: 0 0 0.5rem;
  font-size: 1.5rem;
}



/* ---------- case ---------- */
.case {
  padding: 3rem 0 0;
}
.case h2 {
  margin-bottom: 2rem;
}
.case-box {
  max-width: 142rem;/*コンテンツ幅1400px、左右余白各10px*/
  padding: 0 1rem;
  margin: 0 auto;
}
.case-item {
  border-bottom: 0.1rem var(--red) solid;
  margin-bottom: 5rem;
  position: relative;
}
.case-item::before {
  content: "";
  display: block;
  width: 100%;
  height: 0.1rem;
  background: var(--red);
  position: absolute;
  top: 2rem;
  left: 0;
  z-index: -1;
}
.case-item h3 {
  width: 20rem;
  height: 4rem;
  line-height: 4rem;
  color: #fff;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  margin: 0 auto;
}
.case-item.case01 h3 {
  background: var(--red);
}
.case-item.case02{
  margin: 0;
}
.case-item.case02 h3 {
  background: var(--dred);
}

.case-item p.case-ex {
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  margin: 1.5rem auto;
}
.case-item p.case-txt {
  margin: 2rem 1rem;
  font-size: 1.5rem;
}
.case-item.case01 p.case-txt{
  padding: 0;
}


/* ---------- introduce ---------- */
.introduce {
  padding: 3rem 0;
}
.introduce h2 {
  color: #333;
  margin-bottom: 3rem;
}

.introduce-box {
  max-width: 142rem;/*コンテンツ幅1400px、左右余白各10px*/
  padding: 0 1rem;
  margin: 0 auto;
}
.introduce-box h3 {
  font-size: 2.1rem;
  font-weight: bold;
  color: var(--red);
  text-align: center;
  position: relative;
}
.introduce-box h3 span {
  display: block;
  width: 9rem;
  height: 2.5rem;
  line-height: 1;
  background: var(--red);
  color: #fff;
  border-radius: 1.5rem;
  margin: 0.2rem auto 2rem;
  padding-top: 0.3rem;
}
.introduce-box h3::before {
  content: "";
  display: block;
  width: 100%;
  height: 0.1rem;
  background: #ccc;
  position: absolute;
  top: 5.1rem;
  left: 0;
  z-index: -1;
}

.introduce-box ul {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  border-bottom: 0.1rem #bbb solid;
}
.introduce-box li {
  width: 50%;
  padding: 4rem 0 3rem;
  font-weight: bold;
  text-align: center;
  border-bottom: 0.1rem #aaa dashed;
}
.introduce-box li:first-child,
.introduce-box li:nth-child(2){
  padding: 1rem 0 3rem;  
}
.introduce-box li:nth-child(9),
.introduce-box li:nth-child(10) {
  border-bottom: none;
}
.introduce-box li figure {
  padding: 1rem 0 0;
}
.introduce-box li:nth-child(2n) figure {
  border-left: 0.1rem #aaa dashed;
}
.introduce-box li img {
  display: block;
  margin: 0 auto 1.5rem;
  height: 6rem;
}
.introduce-box li:nth-child(1) img,
.introduce-box li:nth-child(2) img,
.introduce-box li:nth-child(5) img {
  height: 7rem;
}
.introduce-box li:nth-child(10) img {
  height: 6.4rem;
}
.introduce-box li figcaption {
  display: inline-block;
  text-align: left;
  line-height: 1.5;
}

/* ---------- flow ---------- */

.flow {
  background: #f9f8f8;
  padding:3rem 0;
}
.flow h2 {
  color: #333;
  margin-bottom: 2rem;
}

.flow-box {
  max-width: 142rem;/*コンテンツ幅1400px、左右余白各10px*/
  padding: 0 1rem;
  margin: 0 auto;
}

.flow-item {
  background: #fff;
  padding: 3rem;
  border-radius: 0.5rem;
  margin-bottom: 4.5rem;
  position: relative;
}
.flow-item.step04{
  margin-bottom: 0;  
}
.flow-item h3 {
  display: flex;
  align-items: flex-end;
  color: var(--red);
  font-size: 1.8rem;
  padding-bottom: 2rem;
  border-bottom: 0.1rem #ccc solid;
  margin-bottom: 2rem;
}
.flow-item h3 .step {
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1;
}
.flow-item h3 .step span {
  display: block;
  font-weight: normal;
  font-size: 3rem;
}
.flow-item h3 .step-title {
  line-height: 1.5;
  margin-left: 1rem;
}
.flow-item h3 .step-title span {
  display: block;
  width: 11.5em;
  background: var(--red);
  font-size: 1.6rem;
  color: #fff;
  line-height: 1.2;
  text-align: center;
  padding-top: 0.2rem;
  border-radius: 0.5rem;
}
.flow-item::after {
  content: "";
  display: block;
  width: 2.7rem;
  height: 2.4rem;
  background: url("../img/common-arr-red-down.svg") no-repeat center center;
  position: absolute;
  bottom: -3.5rem;
  left: 50%;
  transform: translateX(-50%);
}
.flow-item:last-child::after {
  display: none;
}

/*----------------------------------------------------
タブレット用 450- 
----------------------------------------------------*/
@media screen and (min-width:450px) {

/* ---------- voice ---------- */

  .voice-item.voice01 {
    background: #eee url("../img/voice-ph01.png") no-repeat center 150%;
    background-size: 22.5rem;
  }
  .voice-item.voice02 {
    background: #eee url("../img/voice-ph02.png") no-repeat center 225%;
    background-size: 20rem;
  }
  .voice-item.voice03 {
    background: #eee url("../img/voice-ph03.png") no-repeat center 115%;
    background-size: 20rem;
  }



}



/* -----------------------------------------------
TB 750-
----------------------------------------------- */
@media screen and (min-width:750px) {

	/* -----------------
	 main 750
	-------------------- */
	main {
	  padding-top: 0;
	}

	/* FV TB
	-------------------------------*/
	.fv-wrap h2{
		width: 100%;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 50;
	}
	.fv-wrap h2 span{
		width: 26rem;
		padding: 11% 0 0;
	}

	/* FV画像 TB ---------- */
	.fv-sp{
		display: none;
	}
	.fv-pc{
		display: block;
		width: 100%;
		position: absolute;
		top: 0;	
		left: 0;
		z-index: 10;		
	}
	.fv-pc span{
		display: block;		
	}

	/* FV CTA TB
	-------------------------------*/
	.fv-cta{
		padding: 27% 0 0;
	}
	.fv-cta > p{
		display: none;
	}
	.fv-cta-bg{
		background: linear-gradient(to right, #e7101f, #c1101c);
	}
	.fv-cta-btn{
		max-width:75rem;
		margin: 0 auto;
	  padding: 4.5rem 4rem 0;
	}
	.fv-cta-btn-in{
		width: 50%;
		position: absolute;
		top:90px;
		right:7%;
	}

	.fv-cta-btn-in p:first-child{
		margin: 0 0 1rem;
	}
	.fv-cta-btn-in p:first-child::before {
		left: 5%;
	}
	.fv-cta-btn-in p:first-child::after {
	  right: 5%;
	}
	.fv-cta-btn figure {
	  max-width: 30rem;
	  margin: 0;
	}


	/* problem TB
	-------------------------------*/
	.problem{
		padding: 5rem 1rem 3rem;
	}
	.problem-list{
		flex-direction: row;
	}
	.problem-list article{
		width: 32%;
		margin: 0 0 2rem;
		padding: 3rem 1.5rem;
		background: transparent;
	}
	.problem-list article:nth-child(4){
		margin: 0 0 0 16%;
	}
	.problem-list article:last-child{
		margin: 0 16% 0 0;
	}

	/* 各画像サイズ調整 TB --------- */
	.problem-list article:first-child figure{width: 12rem;}
	.problem-list article:nth-child(2) figure{width: 14.6rem;}
	.problem-list article:nth-child(3) figure{width: 13.4rem;}
	.problem-list article:nth-child(4) figure{width: 11.5rem;}
	.problem-list article:last-child figure{width: 15.2rem;}

	.problem-list article h3 span strong{
		font-size: 1.4rem;
	}
	.problem-list article h3 + p{
		font-size: 1.4rem;
	}

  /* ---------- support point TB ---------- */
  .support {
    padding: 5rem 1rem;
  }  
  .point-box {
    padding: 3.5rem 5rem 4rem;
  }
  .point-box h3 {
    padding-left: 11rem;
  }
  .point-box h3 span {
    padding: 5rem 3rem 1.5rem;
    top: -4.5rem;
    left: -4rem;
  }
  
  .point-box.point03 ul {
    flex-direction: column;
    align-items: flex-end;
    background: #f9f8f8 url("../img/point03-ill.svg") no-repeat 5% bottom;
    background-size: 20rem;
    padding: 2rem 2rem 2.5rem;
  }
  .point-box.point01 li {
    width: 22%;
  }
  .point-box.point02 li {
    width: 48%;
  }
  .point-box.point03 li {
    text-align: left;
    width: 35rem;
    height: 3.8rem;
  }

  .point-box.point03 li:nth-child(1) {
    background: url("../img/point03-bubble-pc-down.svg") no-repeat left top;
    margin: 0 1.5rem 1rem 0;
  }
  .point-box.point03 li:nth-child(2) {
    background: url("../img/point03-bubble-pc-down.svg") no-repeat left top;
    margin: 0 0.7rem 1rem 0;
  }
  .point-box.point03 li:nth-child(3) {
    background: url("../img/point03-bubble-pc-down.svg") no-repeat left top;
    margin: 0 0 1rem 0;
    padding-top: 0.7rem;
  }
  .point-box.point03 li:nth-child(4) {
    background: url("../img/point03-bubble-pc-up.svg") no-repeat left top;
    margin: 0 1.5rem 0 0;
    padding-top: 1rem;
  }
  .point-box li figcaption {
    padding-top: 1.5rem;
    font-size: 1.4rem;
  }
  .point-box li span {
    margin-left: 2rem;
  }
  .point-box > p {
    padding: 0.5rem 0;
    text-align: center;
  }


  /* ---------- recommend 750 ---------- */
  .recommend {
    padding: 5rem 0;
  }
  .recommend h2 {
    padding-bottom: 3rem;
  }
  .recommend-box {
    display: flex;
    justify-content: space-between;
  }
  .recommend-item {
    width: 32.5%;
    margin-bottom: 0;
  }

  /* ---------- voice 750 ---------- */
  .voice {
    padding: 5rem 1rem;
  }
  .voice h2 {
    margin-bottom: 3rem;
  }
  
  .voice-box {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .voice-item {
    width: 48%;
    margin-bottom: 3rem;
  }
  .voice-item.voice01 {
    background: #eee url("../img/voice-ph01.png") no-repeat center 135%;
    background-size: 22.5rem;
  }
  .voice-item.voice02 {
    background: #eee url("../img/voice-ph02.png") no-repeat center 175%;
    background-size: 20rem;
  }
  .voice-item.voice03 {
    width: 100%;
    background: #eee url("../img/voice-ph03.png") no-repeat 90% bottom;
    background-size: 20rem;
    padding: 5rem;
  }
  .voice-item.voice03 p {
    width: 50%;
  }

  /* ---------- case 750 ---------- */
  .case {
    padding: 5rem 0;
  }
  .case h2 {
    margin-bottom: 3rem;
  }

  .case-box {
    display: flex;
    justify-content: space-between;
  }
  .case-item {
    width: 46%;
    margin-bottom:0;
  }

  /* ---------- introduce 750 ---------- */
  .introduce {
    padding:0 0 5rem;
  }

  /* ---------- flow -750 --------- */

  .flow-item {
    display: flex;
    align-items: center;
  }
  .flow-item h3 {
    width: 45%;
    padding-bottom: 1rem;
    border-bottom: none;
    margin-bottom: 0;
  }
  .flow-item:nth-child(3) h3 .step {
    padding-bottom: 2rem;
  }
  .flow-item p {
    width: 55%;
    border-left: 0.1rem #ccc solid;
    padding-left: 2rem;
  }

  /* ---------- cta ---------- */
  .cta-copy > span::before,
  .cta-copy > span::after {
    height: 3.5rem;
  }
  .cta-copy > span::after {
    right: -3.5rem;
  }



}

/*----------------------------------------------------
PC / タブレット用 880- 
----------------------------------------------------*/
@media screen and (min-width:880px) {

  /* ---------- support point 880 ---------- */
  .point-box.point03 ul {
    background: #f9f8f8 url("../img/point03-ill.svg") no-repeat 10% bottom;
    background-size: 22rem;
    padding: 3rem 5rem 2.5rem;
  }



}


/* -----------------------------------------------
PC 1000-
----------------------------------------------- */
@media screen and (min-width:1000px) {

	/* FV 1000
	-------------------------------*/
	.fv-wrap{
		margin: 0;
		position: relative;
	}
	.fv-wrap h2 span{
		width: 36rem;
		padding: 12% 0 0;
	}

	.fv-cta-btn{
		max-width:80rem;
	  padding: 6rem 0 0;
	}
	.fv-cta-btn-in{
		width: 66%;
		position: absolute;
		top:120px;
		right:-1.5%;
	}
	.fv-cta-btn-in p:first-child{
		margin: 0 0 1rem;
	}
	.fv-cta-btn-in p:first-child::before,
	.fv-cta-btn-in p:first-child::after {
		height: 4.5rem;
		top: -10px;
	}
	.fv-cta-btn-in p:first-child::before {
		left: 2%;
	}
	.fv-cta-btn-in p:first-child::after {
	  right: 2%;
	}


	/* problem 1000
	-------------------------------*/
	.problem{
		padding: 10rem 1rem 5rem;
	}
	.problem-list article{
		margin: 0 0 5rem;
		padding: 3rem 2rem;
	}
	/* 各画像サイズ調整 1200 --------- */
	.problem-list article figure{
		height: 22rem;
	}
	.problem-list article:first-child figure{width: 19.4rem;}
	.problem-list article:nth-child(2) figure{width: 22.1rem;}
	.problem-list article:nth-child(3) figure{width: 24.9rem;}
	.problem-list article:nth-child(4) figure{width: 23.2rem;}
	.problem-list article:last-child figure{width: 24.2rem;}

	.problem-list article h3 span strong{
		font-size: 1.8rem;
	}
	.problem-list article h3 + p{
		font-size: 1.8rem;
	}

  /* ---------- support point 1000 ---------- */
  .support {
    padding: 10rem 1rem;
  }  
  .support h2{
    padding: 0 0 3rem;
  }
  .point-box {
    padding: 3.5rem 8rem 4rem;
  }
  .point-box h3 {
    font-size: 2.8rem;
    padding-left: 18rem;
  }
  .point-box h3 span {
    font-size: 3rem;
  }
  
  .point-box > p {
    font-size: 2.4rem;
  }

  .point-box li figcaption {
    font-size: 1.8rem;
  }

  /* ---------- recommend 1000 ---------- */
  .recommend {
    padding: 10rem 0;
  }
  .recommend h2 {
    padding: 0 0 5rem;
  }

  /* ---------- voice 1000 ---------- */
  .voice {
    padding: 10rem 0;
  }
  .voice h2 {
    margin-bottom: 5rem;
  }

  .voice-item.voice01 {
    background: #eee url("../img/voice-ph01.png") no-repeat right bottom;
    background-size: 20rem;
    padding: 4rem 4rem 5rem;
  }
  .voice-item.voice02 {
    background: #eee url("../img/voice-ph02.png") no-repeat 95% bottom;
    background-size: 18rem;
    padding: 4rem 4rem 5rem;
  }
  .voice-item.voice01 p, .voice-item.voice02 p, .voice-item.voice03 p {
    width: 55%;
  }
  .voice-item.voice03 {
    width: 100%;
    background: #eee url("../img/voice-ph03.png") no-repeat 90% bottom;
    background-size: 20rem;
    padding: 7rem 8rem;
  }


  /* ---------- case 1000 ---------- */
  .case {
    padding: 5rem 0 0;
  }
  .case h2 {
    margin-bottom: 5rem;
  }
  .case-item::before {
    top: 2.5rem;
  }
  .case-item h3 {
    width: 30rem;
    height: 5rem;
    line-height: 5rem;
    font-size: 2.4rem;
  }
  .case-item p.case-ex {
    font-size: 2.1rem;
  }
  .case-item p.case-txt {
    font-size: 1.8rem;
    margin: 3.5rem 4.5rem;
  }

  /* ---------- introduce ---------- */
  .introduce {
    padding: 10rem 0;
  }
  .introduce h2 {
    margin-bottom: 5rem;
  }
  .introduce-box h3 {
    font-size: 3rem;
  }
  .introduce-box h3 span {
    font-size: 2.1rem;
  }
  .introduce-box h3::before {
    top: 6.8rem;
  }
  .introduce-box li figure {
    display: flex;
    align-items: center;
  }
  .introduce-box li figure img {
    width: 25%;
  }
  .introduce-box li figure figcaption {
    width: 75%;
    font-size: 2.1rem;
  }
  .introduce-box li:nth-child(10) figure img {
    width: 35%;
  }
  .introduce-box li:nth-child(10) figure figcaption {
    width: 65%;
  }

  /* ---------- flow 1000 ---------- */
  .flow {
    padding: 8rem 0 10rem;
  }
  .flow h2 {
    margin-bottom: 5rem;
  }
  
  .flow-item {
    margin-bottom: 6rem;
  }
  .flow-item h3 {
    font-size: 2.6rem;
  }
  .flow-item h3 .step {
    font-size: 1.6rem;
  }
  .flow-item:nth-child(3) h3 .step {
    padding-bottom: 2.8rem;
  }
  .flow-item h3 .step span {
    font-size: 4rem;
  }
  .flow-item h3 .step-title span {
    width: 12em;
    font-size: 2.2rem;
  }
  .flow-item p {
    font-size: 2rem;
  }
  .flow-item::after {
    bottom: -4.2rem;
    left: 44%;
    transform: none;
  }


}

/*----------------------------------------------------
PC 1200- 
----------------------------------------------------*/
@media screen and (min-width:1200px) {

	/* problem 1200
	-------------------------------*/
	.problem-list article h3 + p{
		font-size: 2.4rem;
	}

/* ---------- support point ---------- */
  .point-box.point03 ul {
    background: #f9f8f8 url("../img/point03-ill.svg") no-repeat 10% bottom;
    background-size: 26rem;
    margin-bottom: 4rem;
  }
  .point-box.point03 li {
    font-size: 2.1rem;
    width: 52rem;
    height: 6rem;
  }

  .point-box.point03 li:nth-child(1) {
    background: url("../img/point03-bubble-pc-down.svg") no-repeat left top;
    margin: 0 3rem 1rem 0;
    padding-top: 1.3rem;
  }
  .point-box.point03 li:nth-child(2) {
    background: url("../img/point03-bubble-pc-down.svg") no-repeat left top;
    margin: 0 1.5rem 1rem 0;
    padding-top: 1.3rem;
  }
  .point-box.point03 li:nth-child(3) {
    background: url("../img/point03-bubble-pc-down.svg") no-repeat left top;
    margin: 0 0 1rem 0;
    padding-top: 1.3rem;
  }
  .point-box.point03 li:nth-child(4) {
    background: url("../img/point03-bubble-pc-up.svg") no-repeat left top;
    margin: 0 3rem 0 0;
    padding-top: 1.7rem;
  }
  .point-box li span {
    margin-left: 3.5rem;
  }
  .point-box li figcaption {
    font-size: 2rem;
  }


/* ---------- recommend ---------- */
  .recommend-item {
    width: 32%;
    padding: 3rem 4rem 4rem;
    font-size: 1.8rem;
  }


	/* ---------- voice 1200 ---------- */
  .voice-item h3 {
    font-size: 3rem;
  }
  .voice-item.voice01 {
    background: #eee url("../img/voice-ph01.png") no-repeat right bottom;
    background-size: 22rem;
    padding: 4rem 4rem 5rem;
  }
  .voice-item.voice02 {
    background: #eee url("../img/voice-ph02.png") no-repeat 95% bottom;
    background-size: 20rem;
    padding: 4rem 4rem 5rem;
  }
  .voice-item.voice01 p, .voice-item.voice02 p, .voice-item.voice03 p {
    width: 60%;
  }
  .voice-item.voice03 {
    background: #eee url("../img/voice-ph03.png") no-repeat 90% bottom;
    background-size: 24rem;
    padding: 7rem 8rem;
  }
  .voice-item .voice-txt {
    font-size: 1.8rem;
  }

	/* ---------- flow ---------- */
  .flow-item {
    padding: 4.5rem 5rem;
  }
  .flow-item p {
    padding-left: 6.5rem;
  }


}

/*----------------------------------------------------
PC 1400- 
----------------------------------------------------*/
@media screen and (min-width:1400px) {

	/* problem 1400
	-------------------------------*/
	.problem{
		padding: 10rem 0 5rem;
	}

	/* FV 1400
	-------------------------------*/
	.fv-wrap h2 span{
		width:48rem;
		padding: 12% 0 0;
	}

  /* ---------- introduce 1400 --------- */
  .introduce-box li figure figcaption {
    font-size: 2.4rem;
  }

  /* ---------- voice 1400 --------- */
  .voice-item.voice01 p, .voice-item.voice02 p, .voice-item.voice03 p {
    width: 56%;
  }

  .voice-item.voice01 {
    background: #eee url("../img/voice-ph01.png") no-repeat right bottom;
    background-size: 28rem;
    padding: 4rem 4rem 5rem;
  }
  .voice-item.voice02 {
    background: #eee url("../img/voice-ph02.png") no-repeat 95% bottom;
    background-size: 24rem;
    padding: 4rem 4rem 5rem;
  }
  .voice-item.voice03 {
    background: #eee url("../img/voice-ph03.png") no-repeat 80% bottom;
    background-size: 26rem;
    padding: 8rem 8rem 10rem 10rem;
  }

}

/*----------------------------------------------------
PC 1600- 
----------------------------------------------------*/
@media screen and (min-width:1600px) {
	
	header h1{
		width: 24rem;
	}	
	.fv-wrap h2 span{
		width: 60rem;
		padding: 12% 0 0;
	}

	.fv-cta-btn{
		max-width:126rem;
	  padding: 8rem 0 0;
	}
	.fv-cta-btn-in{
		top:160px;
		right: 4%;
	}
	.fv-cta-btn-in p:first-child{
		font-size: 3.6rem;
	}
	.fv-cta-btn-in p:first-child::before,
	.fv-cta-btn-in p:first-child::after {
		height: 4.5rem;
		top: 0;
	}
	.fv-cta-btn-in p:first-child::before {
		left: 5%;
	}
	.fv-cta-btn-in p:first-child::after {
	  right: 5%;
	}
	.fv-cta-btn-in p:last-child a {
	  padding: 3.5rem 4.5rem 3.5rem 3.5rem;  
	  font-size:3.6rem;
	}
	.fv-cta-btn-in p:last-child a span{
		font-size: 2.4rem;
	}
	.fv-cta-btn-in p:last-child a span::after {
	  width: 3rem;
	  height: 3rem;
	  background: #fff url("../img/common-arr-red-right.svg")no-repeat 50% center;
	  background-size: 45%;
	  border-radius: 50%;
	  position: absolute;
	  top: 50%;
	  left: 100%;
	  transform: translateY(-50%);
	}
	.fv-cta-btn figure {
	  max-width: 40rem;
	}




}