@charset "utf-8";
/**************************************/
/* CSS file For miyata-jyuusou.co     */
/* FileName: contact-section          */
/* date: 2023.05.02                   */
/**************************************/



/*-----------------------------------------------------
	コンタクト部分(各ページ共通)
------------------------------------------------------*/

body #wrapper div#contents article .innerBox .common-format02 {
	width: 100%;
	margin: 1% auto;
	line-height: 1.6;
}

body #wrapper div#contents article .innerBox .common-format02 h3 {
	font-size: 25px;
	color: #f3780e;
	font-weight: bold;
	margin-top: 1%;
	margin-bottom: 1.5%;
}
body #wrapper div#contents article .innerBox .common-format02 .common-format02-inner {
	line-height: 1.6;
	/*width: 70%;*/
	/*margin: 0% 17% 5%;*/
	margin: 0 10% 5%;
}
body #wrapper div#contents article .innerBox .common-format02 .common-format02-inner {
	width: 80%;
	max-width: 800px;
}

body #wrapper div#contents article .innerBox .common-format02 img.contact-three-step {
	width: 80%;
	height: auto;
	margin: 2% 10% 3%;
}
body #wrapper div#contents article .innerBox .common-format02 .goto-contact {
	text-align: center;
	margin: 3% auto 8%;
}
body #wrapper div#contents article .innerBox .common-format02 .goto-contact a.contact-link {
	padding: 1.5% 3%;
	background-color: #f3780e;
	color: #fff;
	font-size: 28px;
	border-radius: 10px;
}

body #wrapper div#contents article .innerBox .common-format02 .contact-left {
	width: 40%;
	float: left;
	line-height: 1.6;
}
body #wrapper div#contents article .innerBox .common-format02 .contact-right {
	width: 60%;
	/*float: left;*/
	float: right;
	line-height: 1.6;
}
body #wrapper div#contents article .innerBox .common-format02 .contact-right img {
	margin-left: 128px;
}
body #wrapper div#contents article .innerBox .common-format02 .contact-right .contact-right-spacing01 {
	width: 80%;
	margin-left: 20%;
}

body #wrapper div#contents article .innerBox .common-format02 .contact-left h3 ,
body #wrapper div#contents article .innerBox .common-format02 .contact-right .contact-right-spacing01 h3 {
	/*text-align: left;*/
}
body #wrapper div#contents article .innerBox .common-format02 .contact-right .contact-right-spacing01 .contact-right-01 {
	width: 28%;
	float: left;
}
body #wrapper div#contents article .innerBox .common-format02 .contact-right .contact-right-spacing01 .contact-right-02 {
	width: 71%;
	float: left;
	margin-left: 1%;
}
body #wrapper div#contents article .innerBox .common-format02 .contact-right .contact-right-spacing01 .contact-right-01 img ,
body #wrapper div#contents article .innerBox .common-format02 .contact-right .contact-right-spacing01 .contact-right-02 img {
	width: 100%;
	height: auto;
}
body #wrapper div#contents article .innerBox .common-format02 .contact-right .contact-right-spacing02 {
	clear: left;
	width: 80%;
	margin-left: 20%;
}


body #wrapper div#contents article .innerBox .common-format02 .goto-form {
	text-align: left;
	margin: 21% 3% 2%;
}
body #wrapper div#contents article .innerBox .common-format02 .goto-form a.contact-form {
	padding: 1.5% 6%;
	background-color: #f3780e;
	color: #fff;
	font-size: 34px;
	border-radius: 10px;
}

body #wrapper div#contents article .innerBox .common-format02 .contact-left img.img-tel {
	width: 386px;
	height: auto;
	margin: 1% 0%;
}


/** 以下レスポンシブのCSS */
/** 1025px以上場合のCSS(PC用) */
@media screen and (min-width: 1025px){
	body #wrapper div#contents article .innerBox .common-format02 {
		width: 1000px;
	}
	body #wrapper div#contents article .innerBox .common-format02 h3 {
		font-size: 25px;
	}
	body #wrapper div#contents article .innerBox .common-format02 .common-format02-inner {
		/*width: 700px;*/
		width: 80%;
		max-width: 800px;
	}
	body #wrapper div#contents article .innerBox .common-format02 img.contact-three-step {
		width: 80%;
		max-width: 800px;
	}
	
	body #wrapper div#contents article .innerBox .common-format02 .contact-left img.img-tel {
		width: 250px;
		height: auto;
		margin: 1% 0;
	}
	body #wrapper div#contents article .innerBox .common-format02 .contact-right img {
		margin-left: 120px;
	}
}


/** 701px以上1024px以下場合のCSS(タブレット用) */
@media screen and (min-width: 701px) and (max-width: 1024px){
	body #wrapper div#contents article .innerBox .common-format02 {
		width: 100%;
		max-width: 1000px;
		margin: 1% auto;
		line-height: 1.6;
	}
	body #wrapper div#contents article .innerBox .common-format02 .contact-left  {
		width: 49%;
		float: left;
		margin-left: 1%;
	}
	body #wrapper div#contents article .innerBox .common-format02 .contact-right  {
		width: 49%;
		float: left;
		margin-right: 1%;
	}
	body #wrapper div#contents article .innerBox .common-format02 .contact-left img.img-tel {
		width: 98%;
		height: auto;
		margin: 1%;
	}
	body #wrapper div#contents article .innerBox .common-format02 .contact-left p.contact-left-p {
		margin-left: 15px;
	}
	
	
	body #wrapper div#contents article .innerBox .common-format02 .contact-right .contact-right-spacing02 {
		clear: left;
		width: 80%;
		margin-left: 20%;
	}
	body #wrapper div#contents article .innerBox .common-format02 .goto-form {
		text-align: right;
		margin: 15% 2% 2%;
	}

	body #wrapper div#contents article .innerBox .common-format02 .goto-form a.contact-form {
		padding: 1.5% 4%;
		font-size: 26px;
		border-radius: 10px;
	}
	body #wrapper div#contents article .innerBox .common-format02 .contact-right img {
		margin-left: 48px;
		/*width: 262px;*/
		width: 93%;
		height: auto;
	}
}

/** 700px以下の場合のCSS(スマホ用) */
@media screen and  (max-width: 700px) {
	body #wrapper div#contents article .innerBox .common-format02 {
		width: 100%;
		margin: 1% auto;
		line-height: 1.6;
	}
	body #wrapper div#contents article .innerBox .common-format02 .common-format02-inner {
		width: 90%;
		margin: 0% 0% 0% 25px;
	}
	body #wrapper div#contents article .innerBox .common-format02 .common-format02-inner p {
		font-size: 14px;
	}
	body #wrapper div#contents article .innerBox .common-format02 .goto-contact {
		text-align: left;
		margin: 3% 0 8%;
	}
	body #wrapper div#contents article .innerBox .common-format02 .goto-contact a.contact-link {
		/*padding: 1.5% 3%;
		background-color: #f3780e;
		color: #fff;*/
		margin-left: 25px;
		font-size: 20px;
		/*border-radius: 10px;*/
	}
	
	body #wrapper div#contents article .innerBox .common-format02 .contact-left {
		width: 50%;
	}
	body #wrapper div#contents article .innerBox .common-format02 .contact-right {
		width: 50%;
		margin-bottom: 20px;
	}
	body #wrapper div#contents article .innerBox .common-format02 .contact-left p {
		margin-left: 25px;
		font-size: 14px;
	}
	body #wrapper div#contents article .innerBox .common-format02 .contact-left img.img-tel {
		width: 80%;
		height: auto;
		margin-left: 25px;
	}
	body #wrapper div#contents article .innerBox .common-format02 .contact-right img {
		margin-left: 7%;
		width: 93%;
		height: auto;
	}
	body #wrapper div#contents article .innerBox .common-format02 h3.h3-line {
		/*text-align: left;*/
		margin-left: 25px;
	}
	body #wrapper div#contents article .innerBox .common-format02 .contact-right .contact-right-spacing01 {
		width: calc( 100% - 25px );
		/*width: 94%;*/
		margin-left: 25px;
	}
	body #wrapper div#contents article .innerBox .common-format02 .contact-right .contact-right-spacing02 {
		width: calc( 100% - 25px );
		/*width: 94%;*/
		margin-left: 25px;
	}
	body #wrapper div#contents article .innerBox .common-format02 .contact-right .contact-right-spacing02 p {
		font-size: 14px;
	}
	body #wrapper div#contents article .innerBox .common-format02 .goto-form {
    	text-align: left;
    	margin: 2% 0% 2%;
	}
	body #wrapper div#contents article .innerBox .common-format02 .goto-form a.contact-form {
		font-size: 20px;
		padding: 1.5% 6%;
		margin-left: 25px;
		margin-top: 0px;
	}
	@media screen and  (max-width: 639px) {
		
		
		
		
		@media screen and  (max-width: 420px) {
			@media screen and  (max-width: 320px) {
				body #wrapper div#contents article .innerBox .common-format02 h3 {
						font-size: 22px;
				}
				body #wrapper div#contents article .innerBox .common-format02 .contact-left img {
					width: 100%;
					height: auto;
				}
				body #wrapper div#contents article .innerBox .common-format02 .goto-form a.contact-form {
					font-size: 18px;
				}
				body #wrapper div#contents article .innerBox .common-format02 .contact-right .contact-right-spacing02 p.contact-right-p {
					width: 100%;
					text-align: justify;
				}
				@media screen and  (max-width: 280px) {
					body #wrapper div#contents article .innerBox .common-format02 h3 {
						font-size: 22px;
					}
					body #wrapper div#contents article .innerBox .common-format02 .contact-left img {
						width: 100%;
						height: auto;
					
					}
					body #wrapper div#contents article .innerBox .common-format02 .goto-form a.contact-form {
						font-size: 18px;
					}
					body #wrapper div#contents article .innerBox .common-format02 .contact-right .contact-right-spacing02 p.contact-right-p {
						width: 100%;
						text-align: justify;
					}
				}
			
			}
			
		}
	}
}