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

@media (min-width:1051px) {	
	/*共通*/
	main{}
	main #title_area{position: relative;width:100%;height:auto;min-height: 200px;max-height:500px ;}
	main #title_area::after { display:block; content:''; width:100%; height:0;padding-top:15%;} 
	main #title_area #emphasis{position:absolute; bottom:0;right:75%;writing-mode: vertical-rl;}
	main #title_area #emphasis h1{margin:0;padding: 0;color: #aea3a5;font-size:32px;letter-spacing: 5px;font-weight: normal;}	
	main #title_area #emphasis p{margin:0;padding: 0;color: #aea3a5;font-size:18px;letter-spacing: 3px;}	
	main #title_area h2{position:absolute; top:-50px;left:3%;margin:0;padding: 0;width:130px;}	
	main #title_area h2 img{width:100%;}
	main #title_area h2 a:hover{opacity:0.5;}
	main #title_area .image_photo{position:absolute; bottom:0;right:0%;width: 70%;height: 100%;}	
	main #title_area .image_photo img{width:100%;height: 100%;object-fit: cover}
		
	/*お問い合わせ*/
	#contact{}
	#contact #introduction{padding:80px 0 0px 0;margin: 0 auto 30px auto;color:#a4a4a4;text-align: center;font-size:18px;letter-spacing: 1px;line-height: 35px}
	#contact #telephone_area a{display: block;width: 500px;margin: 0 auto;padding: 14px 0;background: #8b797b;text-align: center;color: white;text-decoration: none;border-radius: 10px}
	#contact #telephone_area a .pc{font-size: 18px;}
	#contact #telephone_area a .sp{display: none}
	#contact #telephone_area a .number{position: relative;font-size: 30px;letter-spacing: 5px;display: inline;padding: 0 0 0 40px}
	#contact #telephone_area a .number::before{display: inline-block; content:'\f095';  position: absolute;  top: 5px;  left: 0;font-family: "Font Awesome 5 Free";font-weight: 900;font-size: 26px;}	
	a[href^="tel:"] {pointer-events: none;}
	
	#contact #form_wrapper{	width:900px;	margin:0 auto;padding:50px 0 80px 0}
	#contact #form_wrapper #text01{margin:0px auto 20px auto;padding: 0;font-size: 18px;letter-spacing: 1px;text-align: center;color:#a4a4a4;}
	#contact #form_wrapper .require{	color:#F00;	}		
	#contact #form_wrapper form table{width:100%;	margin:0 auto 50px auto;	border-collapse:collapse;}
	#contact #form_wrapper form table tr{	border-bottom:1px solid #cccccc;	/*background:white;*/	}	
	#contact #form_wrapper form table th{width:30%;	padding:16px 0px;text-align:left;color:#333333;font-size: 16px;letter-spacing: 0px;vertical-align: top;font-weight: normal}
	#contact #form_wrapper form table td{padding:16px 0px;	}
	#contact #form_wrapper form table td #pp_agree p{margin: 0 auto;padding: 0px 0;color:#333333;font-size: 14px;letter-spacing: 0px;}
	#contact #form_wrapper form table td #pp_agree p a{color:#c1311a;}
	#contact #form_wrapper form table td #pp_agree p a:hover{color:#8D8D8D;}
	#contact #form_wrapper form table td #pp_agree #personal_information{background:#f2f2f2;/*border: 1px dashed #8b797b;border-top: 1px solid #8b797b;border-bottom: 1px solid #8b797b;*/width: 82%;margin:20px auto 20px auto; padding: 18px 20px}
	#contact #form_wrapper form table td #pp_agree #personal_information h3{margin:0px auto 5px auto;padding: 0px 0;text-align:center;color: #8b797b;font-size:15px;letter-spacing: 1px;font-weight: normal;}
	#contact #form_wrapper form table td #pp_agree #personal_information ul{margin:0px auto 0px auto;padding: 0px 0 0 20px;color: #8b797b;font-size:13px;letter-spacing: 0px;line-height: 18px}
	
	#contact #form_wrapper form input[type=text],
	#contact #form_wrapper form input[type=tel],
	#contact #form_wrapper form textarea{outline: 0;border: 0; width:96%; margin: 0 ;padding:14px 2%;font-size: 16px;letter-spacing:1px;background:#f4f0ed;}
	#contact #form_wrapper form .textarea_address{height:60px;}
	#contact #form_wrapper form .textarea_inquiry{height:120px;}
	
	#contact #form_wrapper form input[type=text]:focus,
	#contact #form_wrapper form input[type=tel]:focus,
	#contact #form_wrapper form textarea:focus{background: #dddddd;}
	
	#contact #form_wrapper form input[type="checkbox"] {	display: none;}
	#contact #form_wrapper form label {width:50%;	margin:10px auto 0 auto;border:1px dashed #8b797b;color:#8b797b;	padding:10px 20px;font-size: 14px;text-align: center;display:block;}
	#contact #form_wrapper form input[type="checkbox"]:checked + label {border:1px dashed #8b797b;	background-color:#8b797b;color: white}
	#contact #form_wrapper form label:hover {	cursor: pointer;}
		
	#contact #form_wrapper form input[type=submit],
	#contact #form_wrapper form input[type=reset] 
	{  -webkit-appearance: none; outline: 0;border: 0;display: block; width:48%; margin: 0 auto;padding: 20px 0;font-size:18px;letter-spacing:1px;background:#4f3745;color: white;font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;}
	#contact #form_wrapper form input[type=submit].submit_input{width:100% !important;padding: 30px 0;}
	#contact #form_wrapper form input[type=submit]:hover,
	#contact #form_wrapper form input[type=reset]:hover{background:#1a1a1a;}
	
	#contact #pp_summary{background:#dddee8;padding: 80px 0}
	#contact #pp_summary .inner{	width:700px;	margin:0 auto;}
	#contact #pp_summary h4{margin:0px auto 30px auto;padding: 0;color: #1a1a1a;font-size: 22px;letter-spacing: 0px;text-align: center;font-weight: normal;}
	#contact #pp_summary h5{margin:20px auto 10px auto;padding: 0;color: #1a1a1a;font-size:18px;letter-spacing: 0px;font-weight: normal;}
	#contact #pp_summary .pp_text{margin:0px auto 0px auto;padding: 0;color: #4D4D4D;font-size: 13px;letter-spacing: 0px;line-height: 24px;}
	
	/*お問い合わせ 確認画面 */
	#check{padding: 90px 0 0 0}
	#check .inner {	width:700px;	margin:0 auto;padding: 80px 0	}
	#check .inner h3{margin:0px auto 30px auto;padding: 0;color: #a4a4a4;font-size: 24px;letter-spacing: 0px;text-align: center;font-weight: normal}
	#check .inner .text{margin:0px auto 50px auto;padding: 0;font-size: 16px;letter-spacing: 1px;text-align: center;line-height: 28px}
	
	#check .inner .error_messe{margin:0px auto 10px auto;padding: 0;font-size:14px;letter-spacing: 0px;color:#c1311a;text-align: center}
	
	#check .inner > input[type=button] {  -webkit-appearance: none; outline: 0;border: 0;display: block; width:48%; margin:30px auto 0 auto;padding: 20px 0;font-size: 18px;letter-spacing:1px;background:#4f3745;color: white;font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;}
	#check .inner > input[type=button]:hover{background:#1a1a1a;}
	
	#check .inner table{	width:100%;	margin:0 auto 30px auto;	border-collapse:collapse;font-size:14px;letter-spacing: 0px;border-top:1px solid #cccccc;}	
	#check .inner table tr{border-bottom:1px solid #cccccc;}
	#check .inner table th{	width:30%;padding:10px 10px;font-weight:normal;text-align:left;color:#4f3745;}		
	#check .inner table td{padding:10px 0 10px 10px;}
	
	#check .inner #normal_button {text-align: center}
	#check .inner #normal_button input[type=submit],
	#check .inner #normal_button input[type=button]{  -webkit-appearance: none;  outline: 0;border: 0;display:inline-block; width:45%; margin: 0 auto;padding: 20px 0;font-size: 18px;letter-spacing:1px;background:#4f3745;color: white;font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;}
	#check .inner #normal_button input[type=submit]:hover,
	#check .inner #normal_button input[type=button]:hover{background:#1a1a1a;}
	
	/*お問い合わせ 完了画面*/
	#thanks{padding: 90px 0 0 0}
	#thanks .inner{	width:600px;	margin:0 auto;padding: 80px 0	}
	#thanks .inner h3{margin:0px auto 30px auto;padding: 0;color:#a4a4a4;font-size:24px;letter-spacing: 0px;text-align: center;font-weight: normal}
	#thanks .inner .text{margin:0px auto 50px auto;padding: 0;font-size: 16px;letter-spacing: 1px;line-height: 28px}
	#thanks .inner a{display:block; margin: 0 auto;padding: 20px 0;font-size:18px;letter-spacing:1px;background:#4f3745;color: white;text-decoration: none;text-align: center;}
	#thanks .inner a:hover{background:#1a1a1a;}
		
	/*施工事例*/
	/*#gallery #case_list{width:90%;max-width: 1800px;	margin:0 auto;padding:150px 0 80px 0;display: flex;flex-wrap: wrap;justify-content: start;gap: 40px;}	
	#gallery #case_list .unit{width: calc((100% - 120px) / 4);margin: 0 0px 0px 0 }*/	
	#gallery #case_list{width:50%;max-width: 700px;	margin:0 auto;padding:150px 0 80px 0;}	
	#gallery #case_list .unit{width:100%;margin: 0 0px 0px 0 }	
	#gallery #case_list .unit a{display:block;text-decoration: none}
	#gallery #case_list .unit a .photo{position: relative;display: block;width:100%;aspect-ratio:1.5/1;/*aspect-ratio:1/1.5;*/margin: 0 auto 10px auto;padding: 0;overflow: hidden}
	#gallery #case_list .unit a .photo::before{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);content:"詳しくはこちら \f00e";opacity:0;transition:all 0.3s ease;color:white;font-size:14px;letter-spacing:1px;padding:15px 30px;font-family: "Font Awesome 5 Free";font-weight: 900;background: #967b83;z-index: 1}
	#gallery #case_list .unit a .photo::after {  position: absolute;  top: 0;  left: 0;  content: "";  width: 100%;  height: 100%;  background: black;  opacity: 0;  transition:all 0.3s ease;}
	#gallery #case_list .unit a .photo img{ width:100%;height: 100%;object-fit: cover;transition: transform .4s ease;}
	#gallery #case_list .unit a .caption .tag{display:inline-block;color: white;font-size: 12px;letter-spacing: 1px;background: black;padding: 2px 10px;margin:0 auto 5px auto}
	#gallery #case_list .unit a .caption .name{display: block;color: #967b83;font-size: 18px;letter-spacing: 1px;}
	
	#gallery #case_list .unit a:hover .photo img{transform: scale(1.1);}	
	#gallery #case_list .unit a:hover .photo::before{opacity: 1;}
	#gallery #case_list .unit a:hover .photo::after{opacity: .8;}
	
	/*施工事例 詳細*/
	#gallery_case #lead_group{width:90%;max-width: 1200px;	margin:0 auto;padding:150px 0 80px 0;}
	#gallery_case #lead_group figure{margin: 0 auto 20px auto;padding: 0;width: 100%;aspect-ratio:1.6/1}
	#gallery_case #lead_group figure img{width: 100%;height: 100%;object-fit: cover;}
	#gallery_case #lead_group .tag{display:inline-block;color: white;font-size: 16px;letter-spacing: 1px;background: black;padding: 5px 20px;margin:0 auto 10px auto}
	#gallery_case #lead_group h3{margin: 0 auto;padding: 0;font-size:22px;letter-spacing: 1px;color: #666666;font-weight: 500}
	
	#gallery_case #photo_group{background:#f2f2f2;padding:80px 0 80px 0;}
	#gallery_case #photo_group .unit{width:90%;max-width: 1200px;	margin:0 auto 30px auto;}
	#gallery_case #photo_group .unit .step{display:inline-block;color: white;font-size: 16px;letter-spacing: 1px;background:#aea3a5;padding:5px 20px;margin:0 auto 10px 0}
	#gallery_case #photo_group .unit .photo_area{display: flex;flex-wrap: wrap;justify-content:space-between}
	#gallery_case #photo_group .unit .photo_area a{position: relative;display: block;width: 48%;aspect-ratio:2/1;padding-bottom: 30px;margin-bottom: 10px}
	#gallery_case #photo_group .unit .photo_area a img{display: block; width:100%;height: 100%;object-fit: cover;}
	#gallery_case #photo_group .unit .photo_area a::after{position:absolute;bottom:0%;right:0%;content:"\f00e";color:#aea3a5;font-size:18px;letter-spacing:1px;font-family: "Font Awesome 5 Free";font-weight: 900;}
	
	/*お知らせ*/
	#news #list_group{width:90%;max-width: 1200px;	margin:0 auto;padding:100px 0 80px 0;}
	#news #list_group dl{flex-wrap: wrap;display: flex;width:100%;font-size: 14px;letter-spacing: 1px;line-height: 1.75;margin: 0 auto 30px auto;padding: 0;}
	#news #list_group dl dt{width: 12%;margin: 0;padding:30px 0;border-bottom: 1px solid #aea3a5}
	#news #list_group dl dd{width: 88%;margin: 0;padding:30px 0;border-bottom: 1px solid #aea3a5}	
	
	#news #list_group dl a{color: #000}
	#news #list_group dl a:hover{color: #aea3a5;}
	
	/*お知らせ 詳細*/
	#news_post .post_group{width:90%;max-width: 900px;	margin:0 auto;padding:100px 0 80px 0;}
	#news_post .post_group .date{font-size: 14px;letter-spacing: 1px;line-height: 1.75;margin: 0 auto 0px auto;padding: 0;color: #4f3745}
	#news_post .post_group h3{margin: 0;padding:0px 0 20px 0;border-bottom: 1px solid #aea3a5;font-size: 20px;letter-spacing: 1px;line-height: 1.75;color: #4f3745;font-weight: 500}
	#news_post .post_group .inner{margin: 40px auto 50px auto;}	
	#news_post .post_group .inner figure{width:70%;margin: 0 auto 30px auto ;padding: 0}
	#news_post .post_group .inner figure img{width: 100%}
	#news_post .post_group .inner p{font-size: 16px;letter-spacing: 1px;line-height: 1.75;margin: 0 auto 0px auto;padding: 0;}
	#news_post .post_group .return{text-align: center}
	#news_post .post_group .return a{display:block;width: 20%;margin:0 auto;padding: 10px 0;background: #8b797b;color: white;font-size: 12px;letter-spacing: 1px;text-decoration: none;border-radius: 50px} 
	#news_post .post_group .return a:hover{background: #4f3745;}
}

@media screen and (min-width:701px) and ( max-width:1050px)  {
	/*共通*/
	main{}
	main #title_area{position: relative;width:100%;height:auto;min-height:160px;/*max-height:300px ;*/}
	main #title_area::after { display:block; content:''; width:100%; height:0;padding-top:20%;} 
	main #title_area #emphasis{position:absolute; top:0;right:70%;writing-mode: vertical-rl;height: 200px;}
	main #title_area #emphasis h1{margin:0;padding: 0;color: #aea3a5;font-size:30px;letter-spacing: 2px;font-weight: normal;}	
	main #title_area #emphasis p{margin:0;padding: 0;color: #aea3a5;font-size:16px;letter-spacing: 1px;}	
	main #title_area h2{position:absolute; top:-50px;left:3%;margin:0;padding: 0;width:120px;}	
	main #title_area h2 img{width:100%;}
	main #title_area h2 a:hover{opacity:0.5;}
	main #title_area .image_photo{position:absolute; bottom:0;right:0%;width: 65%;height: 100%;}	
	main #title_area .image_photo img{width:100%;height: 100%;object-fit: cover}
		
	/*お問い合わせ*/
	#contact{}
	#contact #introduction{padding:80px 0 0px 0;margin: 0 auto 30px auto;color:#a4a4a4;text-align: center;font-size:18px;letter-spacing: 1px;line-height: 35px}
	#contact #telephone_area a{display: block;width: 500px;margin: 0 auto;padding: 14px 0;background: #8b797b;text-align: center;color: white;text-decoration: none;border-radius: 10px}
	#contact #telephone_area a .pc{font-size: 18px;}
	#contact #telephone_area a .sp{display: none}
	#contact #telephone_area a .number{position: relative;font-size: 30px;letter-spacing: 5px;display: inline;padding: 0 0 0 40px}
	#contact #telephone_area a .number::before{display: inline-block; content:'\f095';  position: absolute;  top: 5px;  left: 0;font-family: "Font Awesome 5 Free";font-weight: 900;font-size: 26px;}	
	a[href^="tel:"] {pointer-events: none;}
	
	#contact #form_wrapper{	width:90%;	margin:0 auto;padding: 80px 0}	
	#contact #form_wrapper #text01{margin:0px auto 10px auto;padding: 0;font-size: 16px;letter-spacing: 1px;text-align: center;color:#a4a4a4;}
	#contact #form_wrapper .require{	color:#F00;	}		
	#contact #form_wrapper form table{width:100%;	margin:0 auto 20px auto;	border-collapse:collapse;}
	#contact #form_wrapper form table tr{border-bottom:1px solid #cccccc;	}	
	#contact #form_wrapper form table th{display: inline-block;width:100%;	padding:16px 0px 5px 0;text-align:left;color:#333333;font-size: 16px;letter-spacing: 0px;vertical-align: top;font-weight: normal}
	#contact #form_wrapper form table td{display: inline-block;width:100%;padding:0 0 16px 0px;}	
	#contact #form_wrapper form table td #pp_agree p{margin: 0 auto;padding: 0px 0;color:#333333;font-size: 14px;letter-spacing: 0px;}
	#contact #form_wrapper form table td #pp_agree p a{color:#c1311a;}
	#contact #form_wrapper form table td #pp_agree p a:hover{color:#8D8D8D;}
	#contact #form_wrapper form table td #pp_agree #personal_information{background:#f2f2f2;width: 82%;margin:20px auto 20px auto; padding: 18px 20px}
	#contact #form_wrapper form table td #pp_agree #personal_information h3{margin:0px auto 5px auto;padding: 0px 0;text-align:center;color: #8b797b;font-size:15px;letter-spacing: 1px;font-weight: normal;}
	#contact #form_wrapper form table td #pp_agree #personal_information ul{margin:0px auto 0px auto;padding: 0px 0 0 20px;color: #8b797b;font-size:13px;letter-spacing: 0px;line-height: 18px}
	
	#contact #form_wrapper form input[type=text],
	#contact #form_wrapper form input[type=tel],
	#contact #form_wrapper form textarea{outline: 0;border: 0; width:96%; margin: 0 ;padding:12px 2%;font-size: 16px;letter-spacing:1px;background:#f4f0ed;}
	#contact #form_wrapper form .textarea_address{height:60px;}
	#contact #form_wrapper form .textarea_inquiry{height:120px;}
	
	#contact #form_wrapper form input[type=text]:focus,
	#contact #form_wrapper form input[type=tel]:focus,
	#contact #form_wrapper form textarea:focus{background: #dddddd;}
	
	#contact #form_wrapper form input[type="checkbox"] {	display: none;}
	#contact #form_wrapper form label {width:90%;	margin:10px auto 0 auto;border:1px dashed #8b797b;color:#8b797b;	padding:14px 0px;font-size: 14px;text-align: center;display:block;}
	#contact #form_wrapper form input[type="checkbox"]:checked + label {border:1px dashed #8b797b;	background-color:#8b797b;color: white}
	#contact #form_wrapper form label:hover {	cursor: pointer;}
	
	#contact #form_wrapper form input[type=submit],
	#contact #form_wrapper form input[type=reset] {  -webkit-appearance: none;outline: 0;border: 0; width:100%; margin: 0 ;padding: 20px 0;font-size: 18px;letter-spacing:1px;background:#4f3745;color: white;font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;}
	#contact #form_wrapper form input[type=submit].submit_input{width:100% !important;padding:20px 0;}
	#contact #form_wrapper form input[type=submit]:hover,
	#contact #form_wrapper form input[type=reset]:hover{background:#1a1a1a;}
	
	#contact #pp_summary{background:#dddee8;padding: 80px 0}
	#contact #pp_summary .inner{	width:80%;	margin:0 auto;}
	#contact #pp_summary h4{margin:0px auto 30px auto;padding: 0;color: #1a1a1a;font-size: 22px;letter-spacing: 0px;text-align: center;font-weight: normal;}
	#contact #pp_summary h5{margin:20px auto 10px auto;padding: 0;color: #1a1a1a;font-size:18px;letter-spacing: 0px;font-weight: normal;}
	#contact #pp_summary .pp_text{margin:0px auto 0px auto;padding: 0;color: #4D4D4D;font-size: 13px;letter-spacing: 0px;line-height: 24px;}	
	
	/*お問い合わせ 確認画面 */
	#check{padding: 90px 0 0 0}
	#check .inner {	width:80%;	margin:0 auto;padding: 80px 0	}
	#check .inner h3{margin:0px auto 30px auto;padding: 0;color: #a4a4a4;font-size: 24px;letter-spacing: 0px;text-align: center;font-weight: normal}
	#check .inner .text{margin:0px auto 50px auto;padding: 0;font-size: 16px;letter-spacing: 1px;text-align: center;line-height: 28px}
	
	#check .inner .error_messe{margin:0px auto 10px auto;padding: 0;font-size:14px;letter-spacing: 0px;color:#c1311a;text-align: center}
	
	#check .inner > input[type=button] {  -webkit-appearance: none;  outline: 0;border: 0;display: block; width:48%; margin:30px auto 0 auto;padding: 20px 0;font-size:16px;letter-spacing:1px;background:#4f3745;color: white;font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;}
	#check .inner > input[type=button]:hover{background:#1a1a1a;}
	
	#check .inner table{	width:100%;	margin:0 auto 30px auto;	border-collapse:collapse;font-size:14px;letter-spacing: 0px;border-top:1px solid #cccccc;}	
	#check .inner table tr{border-bottom:1px solid #cccccc;}
	#check .inner table th{	width:30%;padding:10px 10px;font-weight:normal;text-align:left;color:#4f3745;}		
	#check .inner table td{padding:10px 0 10px 10px;}
	
	#check .inner #normal_button {text-align: center}
	#check .inner #normal_button input[type=submit],
	#check .inner #normal_button input[type=button]{  -webkit-appearance: none; outline: 0;border: 0;display:inline-block; width:48%; margin: 0 auto;padding: 20px 0;font-size:16px;letter-spacing:1px;background:#4f3745;color: white;font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;}
	#check .inner #normal_button input[type=submit]:hover,
	#check .inner #normal_button input[type=button]:hover{background:#1a1a1a;}
	
	/*お問い合わせ 完了画面*/
	#thanks{padding: 90px 0 0 0}
	#thanks .inner{	width:80%;	margin:0 auto;padding: 80px 0	}
	#thanks .inner h3{margin:0px auto 30px auto;padding: 0;color:#a4a4a4;font-size:24px;letter-spacing: 0px;text-align: center;font-weight: normal}
	#thanks .inner .text{margin:0px auto 50px auto;padding: 0;font-size: 16px;letter-spacing: 1px;line-height: 28px}
	#thanks .inner a{display:block; width:45%; margin: 0 auto;padding: 20px 0;font-size:18px;letter-spacing:1px;background:#4f3745;color: white;text-decoration: none;text-align: center;}
	#thanks .inner a:hover{background:#1a1a1a;}		
	
	/*施工事例*/
	#gallery #case_list{width:70%;	margin:0 auto;padding:150px 0 80px 0;}	
	#gallery #case_list .unit{width:100%;margin: 0 0px 0px 0 }	
	#gallery #case_list .unit a{display:block;text-decoration: none}
	#gallery #case_list .unit a .photo{position: relative;display: block;width:100%;aspect-ratio:1.5/1;/*aspect-ratio:1/1.5;*/margin: 0 auto 10px auto;padding: 0;overflow: hidden}
	#gallery #case_list .unit a .photo::before{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);content:"詳しくはこちら \f00e";opacity:0;transition:all 0.3s ease;color:white;font-size:14px;letter-spacing:1px;padding:15px 30px;font-family: "Font Awesome 5 Free";font-weight: 900;background: #967b83;z-index: 1}
	#gallery #case_list .unit a .photo::after {  position: absolute;  top: 0;  left: 0;  content: "";  width: 100%;  height: 100%;  background: black;  opacity: 0;  transition:all 0.3s ease;}
	#gallery #case_list .unit a .photo img{ width:100%;height: 100%;object-fit: cover;transition: transform .4s ease;}
	#gallery #case_list .unit a .caption .tag{display:inline-block;color: white;font-size: 12px;letter-spacing: 1px;background: black;padding: 2px 10px;margin:0 auto 5px auto}
	#gallery #case_list .unit a .caption .name{display: block;color: #967b83;font-size: 18px;letter-spacing: 1px;}
	
	#gallery #case_list .unit a:hover .photo img{transform: scale(1.1);}	
	#gallery #case_list .unit a:hover .photo::before{opacity: 1;}
	#gallery #case_list .unit a:hover .photo::after{opacity: .8;}
	
	/*施工事例 詳細*/
	#gallery_case #lead_group{width:90%;	margin:0 auto;padding:150px 0 80px 0;}
	#gallery_case #lead_group figure{margin: 0 auto 20px auto;padding: 0;width: 100%;aspect-ratio:1.6/1}
	#gallery_case #lead_group figure img{width: 100%;height: 100%;object-fit: cover;}
	#gallery_case #lead_group .tag{display:inline-block;color: white;font-size: 16px;letter-spacing: 1px;background: black;padding: 5px 20px;margin:0 auto 10px auto}
	#gallery_case #lead_group h3{margin: 0 auto;padding: 0;font-size:22px;letter-spacing: 1px;color: #666666;font-weight: 500}
	
	#gallery_case #photo_group{background:#f2f2f2;padding:80px 0 80px 0;}
	#gallery_case #photo_group .unit{width:90%;	margin:0 auto 30px auto;}
	#gallery_case #photo_group .unit .step{display:inline-block;color: white;font-size: 16px;letter-spacing: 1px;background:#aea3a5;padding:5px 20px;margin:0 auto 10px 0}
	#gallery_case #photo_group .unit .photo_area{display: flex;flex-wrap: wrap;justify-content:space-between}
	#gallery_case #photo_group .unit .photo_area a{position: relative;display: block;width: 48%;aspect-ratio:2/1;padding-bottom: 30px;margin-bottom: 10px}
	#gallery_case #photo_group .unit .photo_area a img{display: block; width:100%;height: 100%;object-fit: cover;}
	#gallery_case #photo_group .unit .photo_area a::after{position:absolute;bottom:0%;right:0%;content:"\f00e";color:#aea3a5;font-size:18px;letter-spacing:1px;font-family: "Font Awesome 5 Free";font-weight: 900;}
	
	/*お知らせ*/
	#news #list_group{width:90%;	margin:0 auto;padding:80px 0 80px 0;}
	#news #list_group dl{flex-wrap: wrap;display: flex;width:100%;font-size: 14px;letter-spacing: 1px;line-height: 1.75;margin: 0 auto 30px auto;padding: 0;}
	#news #list_group dl dt{width: 12%;margin: 0;padding:30px 0;border-bottom: 1px solid #aea3a5}
	#news #list_group dl dd{width: 88%;margin: 0;padding:30px 0;border-bottom: 1px solid #aea3a5}	
	
	#news #list_group dl a{color: #000}
	#news #list_group dl a:hover{color: #aea3a5;}
	
	/*お知らせ 詳細*/
	#news_post .post_group{width:90%;margin:0 auto;padding:80px 0 80px 0;}
	#news_post .post_group .date{font-size: 14px;letter-spacing: 1px;line-height: 1.75;margin: 0 auto 0px auto;padding: 0;color: #4f3745}
	#news_post .post_group h3{margin: 0;padding:0px 0 20px 0;border-bottom: 1px solid #aea3a5;font-size: 20px;letter-spacing: 1px;line-height: 1.75;color: #4f3745;font-weight: 500}
	#news_post .post_group .inner{margin: 40px auto 50px auto;}	
	#news_post .post_group .inner figure{width:70%;margin: 0 auto 30px auto ;padding: 0}
	#news_post .post_group .inner figure img{width: 100%}
	#news_post .post_group .inner p{font-size: 16px;letter-spacing: 1px;line-height: 1.75;margin: 0 auto 0px auto;padding: 0;}
	#news_post .post_group .return{text-align: center}
	#news_post .post_group .return a{display:block;width: 50%;margin:0 auto;padding: 10px 0;background: #8b797b;color: white;font-size: 12px;letter-spacing: 1px;text-decoration: none;border-radius: 50px} 
	#news_post .post_group .return a:hover{background: #4f3745;}
	
}

@media (max-width: 700px) {
	/*共通*/
	main{}
	main #title_area{position: relative;width:100%;height:auto;min-height:200px;/*max-height:300px ;*/}
	main #title_area::after { display:block; content:''; width:100%; height:0;padding-top:25%;} 
	main #title_area #emphasis{position:absolute; bottom:0;right:10%;width:80%;}
	main #title_area #emphasis h1{margin:0;padding: 0;color: #aea3a5;font-size:22px;letter-spacing: 2px;font-weight: normal;}	
	main #title_area #emphasis p{margin:0;padding: 0;color: #aea3a5;font-size:16px;letter-spacing: 1px;}	
	main #title_area h2{position:absolute; top:-50px;left:5%;margin:0;padding: 0;width:90px;}	
	main #title_area h2 img{width:100%;}
	main #title_area h2 a:hover{opacity:0.5;}
	main #title_area .image_photo{position:absolute;top:0;right:0%;width: 65%;height: 70%;}	
	main #title_area .image_photo img{width:100%;height: 100%;object-fit: cover}
		
	/*お問い合わせ*/
	#contact{}
	#contact #introduction{width:80%;padding:30px 0 0px 0;margin: 0 auto 30px auto;color:#a4a4a4;text-align: center;font-size:14px;letter-spacing: 1px;line-height:20px}
	#contact #telephone_area a{display: block;width:80%;margin: 0 auto;padding: 14px 0;background: #8b797b;text-align: center;color: white;text-decoration: none;border-radius:5px}
	#contact #telephone_area a .pc{display: none}
	#contact #telephone_area a .sp{font-size: 13px;}
	#contact #telephone_area a .number{position: relative;font-size: 22px;letter-spacing: 1px;display: inline;padding: 0 0 0 24px}
	#contact #telephone_area a .number::before{display: inline-block; content:'\f095';  position: absolute;  top: 5px;  left: 0;font-family: "Font Awesome 5 Free";font-weight: 900;font-size: 16px;}		
	
	#contact #form_wrapper{	width:80%;	margin:0 auto;padding: 30px 0}		
	#contact #form_wrapper #text01{margin:0px auto 10px auto;padding: 0;font-size: 14px;letter-spacing:0px;text-align: center;color:#a4a4a4;}
	#contact #form_wrapper .require{	color:#F00; margin-left: 3px}	
	#contact #form_wrapper form table{width:100%;	margin:0 auto 30px auto;	border-collapse:collapse;}
	#contact #form_wrapper form table tr{border-bottom:1px solid #cccccc;}	
	#contact #form_wrapper form table th{display: block;padding:14px 0px 3px 0px;	text-align:left;color:#333333;font-size: 14px;letter-spacing: 0;font-weight: normal}
	#contact #form_wrapper form table td{display: block;padding:0px 0px 14px 0px;	}
	#contact #form_wrapper form table td #pp_agree p{margin: 0 auto;padding: 0px 0;color:#333333;font-size: 13px;letter-spacing: 0px;}
	#contact #form_wrapper form table td #pp_agree p a{color:#c1311a;}
	#contact #form_wrapper form table td #pp_agree p a:hover{color:#8D8D8D;}
	#contact #form_wrapper form table td #pp_agree #personal_information{background:#f2f2f2;width: 88%;margin:14px auto; padding: 14px 10px}
	#contact #form_wrapper form table td #pp_agree #personal_information h3{margin:0px auto 5px auto;padding: 0px 0;text-align:center;color: #8b797b;font-size:14px;letter-spacing: 1px;font-weight: normal;}
	#contact #form_wrapper form table td #pp_agree #personal_information ul{margin:0px auto 0px auto;padding: 0px 0 0 20px;color: #8b797b;font-size:12px;letter-spacing: 0px;line-height: 18px}
			
	#contact #form_wrapper form input[type=text],
	#contact #form_wrapper form input[type=tel],
	#contact #form_wrapper form textarea{outline: 0;border: 0; width:96%; margin: 0 ;padding:12px 2%;font-size: 16px;letter-spacing:1px;background:#f4f0ed;}	
	#contact #form_wrapper form .textarea_address{height:60px;}
	#contact #form_wrapper form .textarea_inquiry{height:120px;}
	
	#contact #form_wrapper form input[type=text]:focus,
	#contact #form_wrapper form input[type=tel]:focus,
	#contact #form_wrapper form textarea:focus{background:#dddddd;}
	
	#contact #form_wrapper form input[type="checkbox"] {	display: none;}
	#contact #form_wrapper form label {width:90%;	margin:10px auto 0 auto;border:1px dashed #8b797b;color:#8b797b;	padding:14px 0px;font-size: 14px;text-align: center;display:block;}
	#contact #form_wrapper form input[type="checkbox"]:checked + label {border:1px dashed #8b797b;	background-color:#8b797b;color: white}
	#contact #form_wrapper form label:hover {	cursor: pointer;}	
	
	#contact #form_wrapper form input[type=submit],
	#contact #form_wrapper form input[type=reset] {  -webkit-appearance: none;outline: 0;border: 0; width:100%; margin: 0 ;padding: 16px 0;font-size:18px;letter-spacing:0px;background:#4f3745;color: white;font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;}
	#contact #form_wrapper form input[type=submit].submit_input{width:100% !important;padding:20px 0;}
	#contact #form_wrapper form input[type=submit]:hover,
	#contact #form_wrapper form input[type=reset]:hover{background:#1a1a1a;}
	
	#contact #pp_summary{background:#dddee8;padding: 30px 0}
	#contact #pp_summary .inner{	width:80%;	margin:0 auto;}
	#contact #pp_summary h4{margin:0px auto 20px auto;padding: 0;color: #1a1a1a;font-size: 18px;letter-spacing: 0px;text-align: center;font-weight: normal;}
	#contact #pp_summary h5{margin:20px auto 10px auto;padding: 0;color: #1a1a1a;font-size:16px;letter-spacing: 0px;font-weight: normal;}
	#contact #pp_summary .pp_text{margin:0px auto 0px auto;padding: 0;color: #4D4D4D;font-size: 12px;letter-spacing: 0px;line-height:18px;}	
	
	/*お問い合わせ 確認画面 */
	#check{padding: 90px 0 0 0}
	#check .inner {	width:80%;	margin:0 auto;padding: 30px 0	}
	#check .inner h3{margin:0px auto 30px auto;padding: 0;color:#a4a4a4;font-size: 18px;letter-spacing: 0px;text-align: center;font-weight: normal}
	#check .inner .text{margin:0px auto 30px auto;padding: 0;font-size: 14px;letter-spacing: 0px;line-height: 20px}
	
	#check .inner .error_messe{margin:0px auto 10px auto;padding: 0;font-size:14px;letter-spacing: 0px;color:#c1311a;}
	
	#check .inner > input[type=button] {  -webkit-appearance: none; outline: 0;border: 0;display: block; width:100%; margin:30px auto 0 auto;padding: 16px 0;font-size:16px;letter-spacing:0px;background:#4f3745;color: white;font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;}
	#check .inner > input[type=button]:hover{background:#1a1a1a;}
	
	#check .inner table{	width:100%;	margin:0 auto 30px auto;	border-collapse:collapse;font-size:14px;letter-spacing: 0px;border-top:1px solid #cccccc;}	
	#check .inner table tr{	border-bottom:1px solid #cccccc;}
	#check .inner table th{display: block;padding:14px 0px 3px 0px;	font-weight:normal;text-align:left;color:#4f3745;}		
	#check .inner table td{display: block;padding:0px 0px 14px 0px;}
	
	#check .inner #normal_button {text-align: center}
	#check .inner #normal_button input[type=submit],
	#check .inner #normal_button input[type=button]{  -webkit-appearance: none; outline: 0;border: 0;display:inline-block; width:49%; margin: 0 auto;padding: 20px 0;font-size:14px;letter-spacing:0px;background:#4f3745;color: white;font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;}
	#check .inner #normal_button input[type=submit]:hover,
	#check .inner #normal_button input[type=button]:hover{background:#1a1a1a;}	
	
	/*お問い合わせ 完了画面*/
	#thanks{padding: 90px 0 0 0}
	#thanks .inner{	width:80%;	margin:0 auto;padding: 30px 0	}
	#thanks .inner h3{margin:0px auto 30px auto;padding: 0;color:#a4a4a4;font-size: 18px;letter-spacing: 0px;text-align: center;font-weight: normal}
	#thanks .inner .text{margin:0px auto 30px auto;padding: 0;font-size: 14px;letter-spacing: 0px;line-height:20px}
	#thanks .inner a{display:block; width:100%; margin: 0 auto;padding: 16px 0;font-size:16px;letter-spacing:0px;background:#4f3745;color: white;text-decoration: none;text-align: center;}
	#thanks .inner a:hover{background:#1a1a1a;}
	
	/*施工事例*/
	#gallery #case_list{width:100%;	margin:0 auto;padding:30px 0 30px 0;}	
	#gallery #case_list .unit{width:80%;margin: 0 auto}	
	#gallery #case_list .unit a{display:block;text-decoration: none}
	#gallery #case_list .unit a .photo{position: relative;display: block;width:100%;aspect-ratio:3.2/1;margin: 0 auto 10px auto;padding: 0;overflow: hidden}
	#gallery #case_list .unit a .photo::before{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);content:"詳しくはこちら \f00e";opacity:0;transition:all 0.3s ease;color:white;font-size:11px;letter-spacing:0;padding:10px 15px;font-family: "Font Awesome 5 Free";font-weight: 900;background: #967b83;z-index: 1}
	#gallery #case_list .unit a .photo::after {  position: absolute;  top: 0;  left: 0;  content: "";  width: 100%;  height: 100%;  background: black;  opacity: 0;  transition:all 0.3s ease;}
	#gallery #case_list .unit a .photo img{ width:100%;height: 100%;object-fit: cover;transition: transform .4s ease;}
	#gallery #case_list .unit a .caption .tag{display:inline-block;color: white;font-size: 12px;letter-spacing: 0;background: black;padding: 2px 10px;margin:0 auto 5px auto}
	#gallery #case_list .unit a .caption .name{display: block;color: #967b83;font-size: 14px;letter-spacing:0;}
	
	#gallery #case_list .unit a:hover .photo img{transform: scale(1.1);}	
	#gallery #case_list .unit a:hover .photo::before{opacity: 1;}
	#gallery #case_list .unit a:hover .photo::after{opacity: .8;}
	
	/*施工事例 詳細*/
	#gallery_case #lead_group{width:80%;	margin:0 auto;padding:30px 0 30px 0;}
	#gallery_case #lead_group figure{margin: 0 auto 20px auto;padding: 0;width: 100%;}
	#gallery_case #lead_group figure img{width: 100%;}
	#gallery_case #lead_group .tag{display:inline-block;color: white;font-size: 13px;letter-spacing: 1px;background: black;padding: 3px 10px;margin:0 auto 10px auto}
	#gallery_case #lead_group h3{margin: 0 auto;padding: 0;font-size:16px;letter-spacing: 1px;color: #666666;font-weight: 500}
	
	#gallery_case #photo_group{background:#f2f2f2;padding:30px 0 30px 0;}
	#gallery_case #photo_group .unit{width:80%;	margin:0 auto 10px auto;}
	#gallery_case #photo_group .unit .step{display:inline-block;color: white;font-size: 12px;letter-spacing: 0;background:#aea3a5;padding:3px 10px;margin:0 auto 10px 0}
	#gallery_case #photo_group .unit .photo_area{display: flex;flex-wrap: wrap;justify-content:space-between}
	#gallery_case #photo_group .unit .photo_area a{position: relative;display: block;width: 49%;aspect-ratio:2.5/1;padding-bottom: 20px;margin-bottom: 10px}
	#gallery_case #photo_group .unit .photo_area a img{display: block; width:100%;height: 100%;object-fit: cover;}
	#gallery_case #photo_group .unit .photo_area a::after{position:absolute;bottom:0%;right:0%;content:"\f00e";color:#aea3a5;font-size:12px;letter-spacing:0;font-family: "Font Awesome 5 Free";font-weight: 900;}
	
	/*お知らせ*/
	#news #list_group{width:80%;	margin:0 auto;padding:30px 0;}
	#news #list_group dl{flex-wrap: wrap;display: flex;width:100%;font-size: 14px;letter-spacing: 1px;line-height: 1.75;margin: 0 auto 30px auto;padding: 0;}
	#news #list_group dl dt{width: 100%;margin: 0;padding:20px 0 0 0;}
	#news #list_group dl dd{width: 100%;margin: 0;padding:0 0 20px 0;border-bottom: 1px solid #aea3a5}	
	
	#news #list_group dl a{color: #000}
	#news #list_group dl a:hover{color: #aea3a5;}
	
	/*お知らせ 詳細*/
	#news_post .post_group{width:80%;margin:0 auto;padding:30px 0;}
	#news_post .post_group .date{font-size: 12px;letter-spacing: 1px;line-height: 1.75;margin: 0 auto 0px auto;padding: 0;color: #4f3745}
	#news_post .post_group h3{margin: 0;padding:0px 0 10px 0;border-bottom: 1px solid #aea3a5;font-size: 16px;letter-spacing: 1px;line-height: 1.75;color: #4f3745;font-weight: 600}
	#news_post .post_group .inner{margin: 30px auto 20px auto;}	
	#news_post .post_group .inner figure{width:90%;margin: 0 auto 30px auto ;padding: 0}
	#news_post .post_group .inner figure img{width: 100%}
	#news_post .post_group .inner p{font-size: 13px;letter-spacing: 0;line-height: 1.75;margin: 0 auto 0px auto;padding: 0;}
	#news_post .post_group .return{text-align: center}
	#news_post .post_group .return a{display:block;width: 100%;margin:0 auto;padding: 10px 0;background: #8b797b;color: white;font-size: 12px;letter-spacing: 0;text-decoration: none;border-radius: 50px} 
	#news_post .post_group .return a:hover{background: #4f3745;}
}