@charset "utf-8";

/*********************
 window resize 774px
*********************/
@media screen and (max-width: 774px) {
	.pc{display: none;}
	.sp{display: block;}

	p.title_txt,
	h2.title_txt{
		font-size:1.6em;
	}
	/*********************
	 header
	*********************/
	header{
		margin:0 auto;
	}
	/** menu list **/
	header .menu_list{
		width:80vw;
	}
	header h2{
		display:none;
	}

	/*********************
	 top_header
	*********************/
	#top_header div{
		padding:0 0 35px;
	}

	/*********************
	 select_car
	*********************/
	#select_car{
		padding:80px 15px 0;
	}

	/*********************
	 reviews
	*********************/
	#reviews{
		margin:80px auto;
	}
	.ugc-item{
		border-radius:20px;
		padding:20px 10px;
	}
	.ugc-item p{
		font-size:0.8em;
	}
	.ugc-item .header h3{
		font-size:0.9em;
	}
	.ugc-item time{
		font-size:0.7em;
		color:#999;
	}
	.ugc-item p span{
		display:block;
		padding-right:0;
	}

	/*********************
	 yasui_riyuu
	*********************/
	#yasui_riyuu{
		padding:80px 15px 0;
	}
	#yasui_riyuu .hr_img{
		margin:80px auto;
	}

	/*********************
	 konyu_step
	*********************/
	#konuyu_step{
	    margin: 30px auto 80px;
	}
	#konuyu_step picture{
		margin-top:30px;
	}
	#konuyu_step div{
		margin:80px 15px;
		padding:40px 15px;
		border-radius: 0;
		border-radius: 20px;
	}

	/*********************
	 loanText
	*********************/
	#loanText h2{
		letter-spacing: .1em;
	}
	#loanText{
		margin: 0px auto 80px;
	}
	#loanText section{
		padding: 0px 15px 30px;
		border-radius: 20px;
		font-size:0.9em;
		line-height: 1.6em;
	}
	#loanText section h3{
		font-size:1.2em;
		padding-top:40px;
	}

	/*********************
	 qa
	*********************/
	#qa{
		padding:0 15px;
		margin:0px auto 80px;
	}
	#qa details summary{
		width:100%;
		padding:15px 45px 15px 15px;
		position: relative;
		background:#21ac38;
		cursor:pointer;
		color:#fff;
		font-weight:400;
		margin-top:10px;
	}
	#qa details summary.active:after,
	#qa details summary:after{
		right:15px;
	}
	#qa details p{
		padding:15px;
	}

	/*********************
	 company
	*********************/
	#company ul{
		margin:30px auto 40px;
		border-radius: 0;
		padding:25px 15px;
		font-size:0.8em;
	}

	/*********************
	 footer
	*********************/
	footer:before{
		height:80px;
	}
	footer p{
		padding:10px 0;
	}
	footer.top{
		padding-bottom:80px;
	}
	footer div.sp{
		display: flex !important;
		width:100%;
		bottom:0;
		font-size: 0;
		position: fixed;
	}
	footer div.sp ul{
		width:100%;
		height:65px;
		position: absolute;
		z-index: 9;
		top:-65px;
	}
	footer div.sp ul li{
		display:block;
		width:calc(100% / 3);
		text-align:center;
		line-height:65px;
	}
	footer div.sp ul li:nth-child(1){ background:#21ac38; }
	footer div.sp ul li:nth-child(2){ background:#f8b62d; }
	footer div.sp ul li:nth-child(3){ background:#06c755; }
	footer div.sp ul li a{
		display:block;
	}
	footer div.sp ul li img{
		max-height:35px;
		max-width:100%;
	}
	footer div.sp #footer_hand{
		display:none;
		position: absolute;
		left: calc(100% / 3 / 2 - 30px);
		top:-71px;
		max-width: 60px;
		z-index: 10;
    }
	footer div.sp #footer_body{
		position: absolute;
		left: calc(100% / 3 / 2 - 30px);
		top:0;
		max-width: 60px;
		z-index: 8;
    }
	@keyframes jumpUp {
		0% { opacity: 1; transform: translateY(100%); }
		70% { transform: translateY(-5%); }
		100% { transform: translateY(0); }
	}
	@keyframes jumpDown {
		0% { transform: translateY(-5%); }
		100% { transform: translateY(100%); }
	}
	@keyframes fadeIn {
		0% { opacity: 0; }
		100% { opacity: 1; }
	}
	@keyframes fadeOut {
		0% { opacity: 1; }
		100% { opacity: 0; }
	}

	/*********************
	 consult
	*********************/
	#consult #business_formBox p{
		font-size:0.8em;
		line-height:1.4em;
	}
	#consult #business_formBox a{
		padding:10px 0px;
		width:260px;
		border-radius: 10px;
		margin:15px auto 0;
		font-size:0.8em;
	}
	#consult .hr_img{
		margin:40px 0;
		padding: 0 15px;
	}

	/*********************
	 form
	*********************/
	#form {
		padding: 0 15px;
		margin:30px auto 80px;
	}
	#form .formitem  {
	    display:block;
		margin-top: 15px;
	}
	#form .formitem .formtxt,
	#form select,
	#form input[type="text"],
	#form input[type="email"],
	#form .inquiry,
	#form .w250 {
		width:100% !important;
	}
	#form .need:after,
	#form .neednot:after {
		right: 0px;
	}
	#form .buttonbox{
		margin-top:40px;
	}
	#form .buttonbox button{
		font-size:1em;
		width:100%;
		border-radius: 10px;
	}

	/*********************
	 thanks
	*********************/
	#thanks section h2{
		font-size:1.4em;
	}
	#thanks section div{
		text-align:left;
	}
	#thanks a{
		margin:40px auto 0;
	}

	/*********************
	 report
	*********************/
	#review_icon div{
		width:100%;
	}
	#review_icon label {
		display:inline-block;
		width:calc( 100% / 4 );
	}
	#review_icon label img{
		margin-top:5px;
	}



}