@charset "utf-8";
/* CSS Document */

@media screen and (max-width:736px) {
	html, body {
		min-width: 0;
		width: 100%;
		height: 100%;
		-webkit-text-size-adjust : 100%;
	}

	img {
		max-width: 100% !important;
		height: auto;
	}

	.sp_only {display: inherit;}
	.pc_only {display: none;}
	
	a[href^="tel:"] {
		pointer-events: auto;
	}
	
	input[type="submit"] {
	  appearance: none;
	  -webkit-appearance: none;
	}
	
	/*-----------------------------

	header

	------------------------------*/
	header {
		height: 50px;
	}

	header h1 {
		font-size: 2rem;
		line-height: 50px;
	}
	
	/*-----------------------------

	top

	------------------------------*/

	#main-fv {
		background: url("../img/page/top/main-bg.jpg") no-repeat;
		background-size: cover;
		padding-bottom: 1.5rem;
	}

	#main-fv .inner {
		background: url("../img/page/top/main-img.png") no-repeat right bottom;
		background-size: 60% auto;
		padding: 0 2rem;
		color: #fff;
		width: 100%;
	}

	#main-fv .main-info {
		width: 100%;
		text-align: center;
		padding: 5rem 0;
	}

	#main-fv .inner p.main-top {
		font-size: 2rem;
	}

	#main-fv .inner p.main-top span {
		font-size: 4.8rem;
	}

	#main-fv .inner p.main-top::after {
		content: '';
		display: block;
		background-image: url(../img/page/top/main-line.png);
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center bottom;
		width: 80%;
		height: 20px;
		margin: 0 auto;
	}

	#main-fv .inner h2 {
		font-size: 2.2rem;
		text-align: left;
	}
	#main-fv .inner h2 span {
		font-size: 4.2rem;
	}

	#main-fv .inner .main-txt {
		font-size: 2.2rem;
		text-align: left;
	}

	#main-fv .inner .main-txt span {
		font-size: 1.6rem;
	}

	#main-fv .campaign-inner {
		padding: 1rem 4rem;
	}
	
	#main-fv .campaign-inner h3 {
		width: 100%;
		height: 45px;
		line-height: 45px;
		font-size: 2rem;
		margin-bottom: 1rem;
	}	
	
	
	.campaign-top {
		padding: 2rem 1rem 1rem;
	}

	.campaign-top .inner {
		align-items: center;
		flex-wrap: wrap;
	}
	
	.campaign-top-info {
		display: none;
	}

	.campaign-top dl {
		align-items: center;
	}
	
	.campaign-top dl dt {
		width: 20%;
	}
	.campaign-top dl dd {
		width: 80%;
		padding-left: 1rem;
		margin-left: 0;
	}

	.campaign-top .campaign-top-btn {
		width: 100%;
		padding-top: 0;
	}
	
	.btn a,
	.btn-top a{
		font-size: 1.4rem;
		font-weight: bold;
		display: inline-block;
		width: 100%;
		line-height: 60px;
	}
	
	.btn-top a {
		text-indent: 0;
	}

	
	.flow-area {}
	.flow-area .flow-number {
		padding: 3rem;
		border-radius: 8px;
		text-align: center;
	}

	.flow-area .flow-number + .flow-number {margin-top: 5rem;}
	.flow-area .flow-number .number {
		font-size: 3.2rem;
		margin-bottom: 2rem;
	}

	.flow-area .flow-number .number span {
		border-bottom: 4px solid #0450BF;
	}

	.flow-area ol.flow-step {
		align-items: center;
		margin-bottom: 1rem;
	}

	.flow-area ol.flow-step li:nth-child(odd) {
		width: 30px;
		height: 30px;
		line-height: 27px;
		text-align: center;
		font-size: 1.2rem;
	}

	.flow-area h2 {
		font-size: 1.6rem;
	}

	.flow-area .flow-img {margin-bottom: 3rem;}
	.flow-area .checkbox-btn {
		width: 100%;
		margin: 0 auto;
		text-align: left;
	}

	.flow-area .checkbox-btn label {
		font-size: 2rem;
		font-weight: 600;
		line-height: 2;
	}
	
	.wi40 {width: 100% !important;}
	.wi50 {width: 100% !important;}
	

	.flow-area input[type="checkbox"] {
	  width: 32px;
	  height: 32px;
	}
	
	.flow-area input[type="checkbox"]:checked::after {
		content: '';
		position: absolute;
		top: 0%;
	}

	.campaign-amazon {	
		min-height: 100%;
		padding: 2rem;
		position: relative;
		margin-bottom: 2rem;
	}

	.campaign-amazon h2,
	.campaign-area-thanks h2{
		width: 80%;
		position: absolute;
		top: -2rem;
		left: 0;
		right: 0;
		margin: 0 auto;
	}
	
	.campaign-area-thanks h2{
		top: -5rem;
	}
	
	.campaign-top-br h2{
		top: -2rem;
	}

	.campaign-amazon .campaign-30,
	.campaign-area-thanks .campaign-30{padding-top: 0.5rem;}
	.campaign-btn {
		text-align: center;
		margin: 0 0 1.2rem;
	}
	.campaign-btn a::before {
		content: "";
		position: absolute;
		top: 50%;
		right: 1rem;
		transform: translateY(-50%);
		width: 20px;
		height: 20px;
	}
	.campaign-area h3 {
		font-size: 2.4rem;
		margin-bottom: 1rem;
	}

	.campaign-area h3::before,
	.campaign-area h3::after {
	  content: "";
	  position: absolute;
	  top: 55%;
	  width: 34px;
	  height: 2px;
	  background-color: #333;
	  transform: translateY(-50%) rotate(65deg); /* 傾斜 */
	}

	.campaign-area h3::before {
	  left: 3rem;
	}

	.campaign-area h3::after {
	  right: 3rem;
	  transform: translateY(-50%) rotate(-65deg);
	}

	.campaign-area p.thanks-txt {
		font-size: 1.6rem;
	}
	
	.campaign-area-thanks {	
		padding: 2rem;
		position: relative;
		margin: 5rem auto;
		border-radius: 10px;
	}
	
	ul.campaign-area-list {
		padding: 2rem 0;
		flex-wrap: wrap;
	}
	
	ul.campaign-area-list li {
		width: 100%;
		max-width: 100%;
	}
	
	ul.campaign-area-list li + li {margin-top: 1rem;}
	p.amazon-txt {
		font-size: 1.2rem;
	}
	
	.campaign-main {
		margin-top: 0;
	}
	
	p.thanks-toptxt {
		font-size: 1.6rem;
		line-height: 1.8;
		margin-bottom: 3rem;
	}

	.line-btn a {
		font-size: 1.5rem;
		font-weight: bold;
		display: inline-block;
		width: 86%;
		line-height: 68px;
	}
	
	.line-btn a::before {
		content: "";
		position: absolute;
		top: 49%;
		right: 2rem;
		transform: translateY(-50%);
		width: 20px;
		height: 20px;
	}
	
	
	
	.trouble-area {padding-bottom: 5rem;}
	.trouble-area .trouble-check {
		background: url("../img/page/top/trouble-bg.png")no-repeat bottom #fff;
		border-radius: 10px;
		background-size: contain;
	}
	.trouble-area h2 {
		font-size: 2.4rem;
		background: url("../img/page/top/icon.png") no-repeat top 0 left 10%;
		background-size: 20% auto;
		margin-bottom: 2rem;
	}

	.trouble-area h2 span {
		background: #fff;
		padding: 0 1rem;
	}

	.trouble-area .trouble-check {
		padding: 2rem 2rem 5rem;
		margin-bottom: 3rem;
	}

	.trouble-area .trouble-check ul li {
		font-size: 1.6rem;
		font-weight: 600;
		position: relative;
		text-indent: 0em;
		padding-left: 4rem;
	}

	.trouble-area .trouble-check ul li::before {
		content: "";
		position: absolute;
		top: 30%;
		left: 0;
		transform: translateY(-50%);
		width: 30px;
		height: 30px;
	}

	.trouble-area .trouble-check ul li + li {margin-top: 3rem;}
	.trouble-area .trouble-check ul li span {background: linear-gradient(transparent 60%, #E6E403 0%);}
	

	.trouble-area p.trouble-txt {
		font-size: 1.6rem;
		font-weight: bold;
		line-height: 1.8;
		margin-bottom: 2rem;
	}
	
	.consultant-img {
		display: none;
	}

	.trouble-area .consultant-txt {
		width: 100%;
		max-width: 100%;
		margin-right: 0rem;
	}

	.trouble-area .consultant-txt p {
		font-size: 2rem;
		line-height: 2;
		padding: 3rem;
		margin-top: 0;
	}
	
	.trouble-area .consultant-txt p::before {
		content: "";
		background-image: none;
	}
	
	.about-area {
		padding: 6rem 3rem;
	}

	.about-area .about-txt {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		margin-bottom: 2rem;
	} 

	.about-area .about-txt p {
		font-size: 2.4rem;
		font-weight: 500;
		margin-top: -3rem;
	} 

	.about-area h2 {
		font-size: 2.6rem;
		line-height: 1.6;
		font-weight: bold;
	}
	
	.features-ttl {
		width: 80%;
		position: absolute;
		top: -30px;
		left: 0;
		right: 0;
		bottom: 0;
		margin: 0 auto;
		text-align: center;
	}

	.features-area {
		padding: 15rem 0 10rem;
		position: relative;
	}

	.features-area ul {
		display: grid;
		grid-template-columns: repeat(1, 1fr);
		gap: 5rem 4rem;
	}

	.features-area ul li .case {
		font-size: 5.4rem;
		margin: -7rem 0 0;
	}

	.features-area ul li h3 {
		font-size: 2rem;
	}

	.features-area ul li .features-img {margin-bottom: 2rem;}
	.features-area ul li p {
		font-size: 1.4rem;
	}
	
	.campaign-area02 .inner {width: 90%;}
	
	.campaign-area02 h3 {
		font-size: 2rem;
		margin-bottom: 3rem;
	}
	.campaign-area02 h3::before {
	  left: 2rem;
	}

	.campaign-area02 h3::after {
	  right: 2rem;
	  transform: translateY(-50%) rotate(-65deg);
	}
	
	.area02-btn a::before {
		left: 3rem;
		transform: translateY(-50%);
		width: 40px;
		height: 40px;
	}

	h2.ttl {
		font-size: 3rem;
		padding: 2rem 0;
	}

	.interview-flow-list {
	  width: 100%;
	  height: auto;
	  float: none;
	}
	
	.interview-flow-area .box01:before,
	.interview-flow-area .box02:before,
	.interview-flow-area .box02:after,
	.interview-flow-area .box03:before{
		content: "";
        position: absolute;
        z-index: 10;
        border-top: 50px solid #BFD5F2;
        border-left: 170px solid transparent;
        border-right: 170px solid transparent;
        border-bottom: 0;
        left: 50%;
        transform: translateX(-50%);
        top: 99.5%;
	  /* margin-top: 20px; */
	}
	
	.interview-flow-area .box01:before { 
		border-top: 50px solid  #F1F5FA; 
	}
	.interview-flow-area .box02:after {
		border-top: 50px solid #BFD5F2;
		right: -20px;
		top: -1px;
		z-index: 2;
	}

	.interview-flow-area .box03:before { 
		border-top: 50px solid #9EBDE6; 
		right: -20px;
		top: 99.999%;
		z-index: 2;
	}
	

	.interview-flow-area p {
		display: block;
		font-size: 1.4rem;
		font-weight: bold;
		line-height: 1.8;
		padding: 0 3rem;
	}

	.interview-flow-area .box02 h3,
	.interview-flow-area .box03 h3{
		position: relative;
		z-index: 11;
		padding: 0;
	}

	.interview-flow-area .box02 p,
	.interview-flow-area .box03 p{
		position: relative;
		z-index: 11;
		padding: 0 3rem;
	}

	.box02 .interview-flow-list-content,
	.box03 .interview-flow-list-content{
		position: relative;
		z-index: 11;
		padding: 5.5rem 0 1rem 0;
	}

	.interview-flow-area .box02 .icon,
	.interview-flow-area .box03 .icon{
		position: relative;
		z-index: 11;
		padding: 0;
	}	
	
	
	

	dl.faq-list dt{
		font-size: 1.4rem;
		padding: 2rem 5rem 2rem 3rem;
		text-indent: 0em;
		padding-left: 4rem;
	}

	dl.faq-list dt.active{
		border-radius: 8px 8px 0px 0px;
		background-color: #0450BF;
	}

	dl.faq-list dt:before{
		position: absolute;
		top: 25px;
		right: 20px;
		content: '\f107';
		color: #0450BF;
		font-size: 18px;
		font-family: "Font Awesome 5 Free";
	}

	dl.faq-list dt.active:before{
		content: '\f106';
		color:#fff;
	}

	dl.faq-list dt span{
		position: absolute;
		top: 2rem;
		left: 2rem;
		font-size: 1.4rem;
	}


	dl.faq-list dd{
		font-weight: 400;
		padding: 2rem;
	}

	dl.faq-list dd h3 {
		font-size: 1.6rem;
		font-weight: bold;
		margin-bottom: 1rem;
	}

	dl.faq-list dd p {
		font-size: 1.4rem;
		line-height: 1.8;
	}

	.consultant-form h2 {
		font-size: 1.8rem;
		margin-bottom: 2rem;
	}

	.consultant-form .inner {
		padding: 3rem 3rem 9.5rem;
	}

	.consultant-form .inner h3 {
		text-align: center;
		font-size: 1.8rem;
	}

	.consultant-form .inner p.note-txt {
		font-size: 1.3rem;
		line-height: 1.8;
		margin-bottom: 5rem;
	}
	
	.contact-body table th,
	.contact-body table td{
		width: 100% !important;
		max-width: 100% !important;
		display: block;
		padding: 3% 0;
	}
	
	.consent p,
	.privacy-policy .privacy-area p{
		font-size: 1rem;
	}
	
	.contact-body p.submitbtn input#submitbtn,
	.contact-body p.submitback input#submitback{
		width: 100%;
	}
	
	.contact-step {margin-bottom: 2rem;} 
	.contact-body p.amazoncard-area {
	    font-size: 1.3rem;
	}

	.consent p span {
	    margin-right: 10px;
	    margin-left: 0;
	    margin-top: 0;
	}
	
	footer {
		padding-bottom: 43vw;
	}

	



}