@charset "utf-8";

/* ====================================================================== */
/* ====================================================================== */
/* ---------------------------------------------------------------------- */
/* 1200px */
@media screen and (max-width:1220px){
	img{
		max-width: 100%;
	}
	
	
	/* base */
	/* ======================================================== */
	#header_base ,
	.contents_base ,
	#footer_base,
	#footer_top {
		width: 960px;
	}
	
	/* header */
	#header_base {
		width: 960px;
	}
	header .head_copy{
		font-size: 12px;
		left: 0;
	}
	#gnav ul{
		margin: 95px 0 0 0;
	}
	#gnav ul li{
		height: 15px;
	}
	#gnav ul li img{
		height: 15px;
	}
	#gnav ul li#gnav2{
		padding-left: 40px;
	}
	#gnav ul li#gnav3{
		padding-left: 40px;
	}
	#gnav ul li#gnav4{
		padding-left: 40px;
	}
	
	#gnav ul li{
		font-size: 20px;
		letter-spacing: 0.1em;
	}
	#gnav ul li .gon{
		display: none;
		font-size: 18px;
	}
	#gnav ul li#gnav1 a{
		width: 70px;
	}
	#gnav ul li#gnav2 a{
		width: 90px;
	}
	#gnav ul li#gnav3 a{
		width: 115px;
	}
	#gnav ul li#gnav4 a{
		width: 120px;
	}
	
	
	
	
	/* ====================================================== */
	/* 1.home ----------------------------------------------- */
	/*
	#home .contents_base{
		width: 960px;
	}
	#home_concept{
		min-height: 960px;
	}
	#home_concept h2{
		padding: 120px 0 0 0;
	}
	#home_concept h2 img{
		width: 760px;
	}
	#home_concept h3{
		margin: 0 0 40px 0;
		font-size: 18px;
	}
	#home_concept p{
		font-size: 14px;
	}
	#home_concept_color{
		height: 300px;
	}
	*/
	/* home_detail1 */
	#home_detail1 .contents_base{
		width: 960px;
	}
	#home_detail1 h2{
		margin: -220px 0 120px 145px;
	}
	#home_detail1 h2 img{
		width: 105px;
	}
	.hd1_image{
		width: 420px;
		margin: -175px 130px 0 0;
	}
	

	.home_feature{
		position: relative;
		clear: both;
		margin: 9.5vw 0 90px 0;
	}
	.feature_detail{
		width: 210px;
		margin: 0 35px 0 0;
		text-align: center;
	}
	.feature_detail:last-child{
		margin: 0;
	}
	.feature_detail h3{
		width: 210px;
		height: 210px;
		font-size: 25px;
	}
	#hf1 h3,
	#hf3 h3{
		padding-top: 85px;
	}
	#hf2 h3{
		font-size: 25px;
		padding-top: 75px;
	}
	#hf2 h3 em{
		font-size: 18px;
	}
	#hf4 h3{
		padding-top: 75px;
	}
	.feature_detail p{
		font-size: 14px;
	}
	
	
	#f2_1 figure{
		float: left;
		width: 490px;
		padding: 0 0 80px 0;
	}
	#f2_1 .f2_detail{
		float: left;
		padding: 65px 0 0 32px;
		width: 430px;
	}
	#f2_1 .f2_detail p{
		font-size: 16px;
	}

	#f2_2 .f2_detail,
	#f2_4 .f2_detail{
		margin-left: 90px;
		width: 400px;
		min-height: 320px;
	}
	#f2_2 .f2_detail h4 img,
	#f2_3 .f2_detail h4 img,
	#f2_4 .f2_detail h4 img{
		height: 110px;
		
	}
	#f2_2 .f2_detail h5,
	#f2_4 .f2_detail h5{
		width: 370px;
		font-size: 18px;
		
	}
	#f2_2 .f2_detail p,
	#f2_4 .f2_detail p{
		font-size: 14px;
	}
	#f2_2 figure,
	#f2_4 figure{
		width: 400px;
		padding: 60px 0 110px 40px;
	}

	#f2_3 .f2_detail{
		margin-left: 48px;
		width: 400px;
		min-height: 263px;
	}
	#f2_3 .f2_detail h5{
		width: 370px;
		font-size: 18px;
	}
	#f2_3 .f2_detail p{
		font-size: 14px;
	}
	#f2_3 figure{
		float: left;
		line-height: 0;
		font-size: 0;
		width: 400px;
		padding: 52px 0 100px 91px;
	}
	#f2_4 figure{
		padding-bottom: 100px;
	}
	
	#home_shitaji{
		min-height: 750px;
	}
	#home_shitaji .contents_base{
		width: 960px;
	}
	#shitaji_image{
		width: 600px;
		margin-right: 0;
	}
	#shitaji_image article{
		width: 290px;
		padding: 0 20px 0 0;
	}
	#home_shitaji h2{
		width: 150px;
		margin-right: 50px;
	}
	
	#home_works .contents_base{
		width: 960px;
	}
	#home_works article{
		width: 300px;
		margin: 0 30px 60px 0;
	}


	#home_gallery .contents_base{
		width: 960px;
	}
	#home_gallery article{
		width: 170px;
		margin: 0 20px 55px 0;
	}
	#home_gallery article figure{
		line-height: 0;
		font-size: 0;
		width: 170px;
		height: 170px;
		overflow: hidden;
	}
	#home_gallery article figure img{
		border-radius: 50%;
		width: 100%;
	}
	
	.risou_title_base p{
		width: 960px;
	}
	#home_risou .contents_base{
		width: 960px;
	}
	.risou_wrap{
		width: 960px;
	}
	.risou_wrap:nth-child(1){
		padding-left: 0;
	}
	.risou_wrap h3{
		width: 170px;
		margin: 20px 0 60px 0;
	}
	.risou_wrap p{
		float: left;
		padding: 75px 50px 0 40px;
		width: 180px;
		font-size: 14px;
	}
	.risou_wrap figure{
		float: left;
		width: 500px;
		margin-bottom: 62px;
	}
	
	
	
	
	/* ====================================================== */
	/* 2.flow ----------------------------------------------- */
	.flow_title{
		min-height: 428px;
	}
	.flow_title_innter{
		width: 960px;
		min-height: 428px;
		background-size: 900px;
		box-sizing: border-box;
	}
	.flow_title h1{
		padding: 103px 0 0 0;
		width: 260px;
	}
	
	.flow_copy{
		width: 860px;
	}

	.flow_detail{
		width: 960px;
		box-sizing: border-box;
	}
	.flow_detail .flow_text{
		min-height: 360px;
	}
	.flow_detail .flow_text h3{
		width: 300px;
	}
	.flow_detail .flow_text p{
		font-size: 16px;
	}
	.flow_detail figure{
		width: 400px;
	}
	#flow1 .flow_text .flow_subimage{
		width: 140px;
	}

	#flow2 .flow_text{
		min-height: 380px;
		padding-left: 40px;
	}
	#flow2 .flow_text p{
		padding: 0;
		width: 400px;
	}
	#flow2 .flow_text .flow_subimage{
		width: 110px;
	}

	#flow3 .flow_text{
		min-height: 380px;
	}
	#flow3 .flow_text .flow_subimage{
		width: 120px;
		margin: -20px 0 0 0;
	}

	#flow4 .flow_text{
		min-height: 380px;
		padding-left: 30px;
	}
	#flow4 .flow_text p{
		padding: 0;
	}
	#flow4 .flow_text .flow_subimage{
		width: 240px;
	}
	#flow4 figure{
		width: 380px;
	}

	#flow5 .flow_text{
		min-height: 380px;
	}
	#flow5 .flow_text .flow_subimage{
		width: 120px;
		margin: -20px 0 0 0;
	}

	#flow .pagetop{
		padding-top: 130px;
	}
	
	
	

	/* ====================================================== */
	/* 3.works ----------------------------------------------- */
	.works_wrap{
		width: 960px;
	}
	.works_base{
		width: 960px;
	}
	.works_detail_wrap{
		width: 960px;
	}
	.works_detail .works_detail_text p{
		font-size: 16px;
	}

	
	
	
	/* ====================================================== */
	/* 4.gallery -------------------------------------------- */
	.gallery_wrap{
		width: 960px;
	}
	.gallery_base{
		width: 960px;
	}
	.gallery_base article{
		width: 300px;
		margin: 0 30px 80px 0;
	}
	
}




/* ====================================================================== */
/* ====================================================================== */
/* ---------------------------------------------------------------------- */
/* 980 */
@media screen and (max-width:980px){
	/* base */
	/* ======================================================== */
	#header_base ,
	.contents_base ,
	#footer_base,
	#footer_top {
		width: 720px;
		box-sizing: border-box;
	}
	
	/* header */
	#header_base {
		width: 720px;
	}
	header .head_copy{
		font-size: 11px;
		left: 0;
	}
	header h1{
		width: 30%;
		padding: 70px 0 40px 0
	}
	#gnav ul{
		margin: 80px 0 0 0;
	}
	#gnav ul li#gnav2,
	#gnav ul li#gnav3,
	#gnav ul li#gnav4{
		padding-left: 25px;
	}
	
	.footer_add,
	.footer_maker{
		width: 720px;
		box-sizing: border-box;
	}
	.footer_add1{
		width: 340px;
	}
	.footer_add2{
		width: 380px;
	}
	
	#gnav ul li{
		font-size: 17px;
		letter-spacing: 0.1em;
	}
	#gnav ul li .gon{
		display: none;
		font-size: 16px;
	}
	#gnav ul li#gnav1,
	#gnav ul li#gnav1 a{
		width: 65px;
	}
	#gnav ul li#gnav2,
	#gnav ul li#gnav2 a{
		width: 75px;
	}
	#gnav ul li#gnav3,
	#gnav ul li#gnav3 a{
		width: 100px;
	}
	#gnav ul li#gnav4,
	#gnav ul li#gnav4 a{
		width: 120px;
	}
	
	/* ====================================================== */
	/* 1.home ----------------------------------------------- */
	/*
	#home .contents_base{
		width: 720px;
	}
	#home_concept{
		min-height: 600px;
	}
	#home_concept h2 img{
		width: 90%;
	}
	#home_concept_color{
		height: 250px;
	}
	*/
	#home_concept h2{
		padding: 10.75vw 0 4.1vw 0;
		width: auto
	}
	#home_concept h3{
		margin: 0 0 4.75vw 0;
		font-size: 2.3vw;
	}
	#home_concept p{
		margin: 0 0 9vw 0;
	}
	#home_concept h4{
		margin: 0 auto 6.25vw auto;
		height: 10.5vw;
	}
	#home_concept figure{
		height: 21.25vw;
	}

	/* home_detail1 */
	#home_detail1 .contents_base{
		width: 720px;
	}
	#home_detail1 h2{
		margin: -187px 0 120px 70px;
	}
	#home_detail1 h2 img{
		width: 90px;
	}
	.hd1_image{
		width: 380px;
		margin: -175px 080px 0 0;
	}
	
	.home_feature2,
	.home_feature{
		width: 720px;
		margin: 9.5vw auto 90px auto;
		box-sizing: border-box;
	}
	.feature_detail{
		width: 160px;
		margin: 0;
		padding: 0 10px;
		text-align: center;
	}
	.feature_detail:last-child{
		padding: 0 10px;
	}
	.feature_detail h3{
		width: 160px;
		height: 160px;
		font-size: 22px;
	}
	#hf1 h3,
	#hf3 h3{
		padding-top: 60px;
	}
	#hf2 h3{
		font-size: 22px;
		padding-top: 55px;
	}
	#hf2 h3 em{
		font-size: 17px;
	}
	#hf4 h3{
		padding-top: 55px;
	}
	.feature_detail p{
		font-size: 14px;
	}
	
	
	#f2_1 figure{
		float: left;
		width: 350px;
		padding: 0 0 80px 0;
	}
	#f2_1 .f2_detail{
		float: left;
		padding: 20px 0 0 20px;
		width: 320px;
	}
	#f2_1 .f2_detail p{
		font-size: 14px;
	}

	#f2_2 .f2_detail,
	#f2_4 .f2_detail{
		margin-left: 0;
		width: 350px;
		min-height: 290px;
	}
	#f2_2 .f2_detail h4 img,
	#f2_3 .f2_detail h4 img,
	#f2_4 .f2_detail h4 img{
		height: 110px;
		
	}
	#f2_2 .f2_detail h5,
	#f2_4 .f2_detail h5{
		width: 320px;
		font-size: 16px;
		
	}
	#f2_2 .f2_detail p,
	#f2_4 .f2_detail p{
		font-size: 14px;
	}
	#f2_2 figure,
	#f2_4 figure{
		width: 320px;
		padding: 60px 0 80px 40px;
	}

	#f2_3 .f2_detail{
		margin-left: 30px;
		width: 350px;
		min-height: 263px;
	}
	#f2_3 .f2_detail h5{
		width: 300px;
		font-size: 16px;
	}
	#f2_3 .f2_detail p{
		font-size: 14px;
	}
	#f2_3 figure{
		float: left;
		line-height: 0;
		font-size: 0;
		width: 320px;
		padding: 52px 0 80px 0;
	}
	#f2_4 figure{
		padding-bottom: 100px;
	}
	
	#home_shitaji{
		min-height: 600px;
		width: 100%;
		box-sizing: border-box;
	}
	#home_shitaji .contents_base{
		width: 720px;
		box-sizing: border-box;
	}
	#shitaji_image{
		width: 500px;
		margin-right: 0;
		padding: 0 0 0 20px;
	}
	#shitaji_image article{
		width: 220px;
		padding: 0 20px 0 0;
	}
	#shitaji_image p{
		font-size: 14px;
	}
	#home_shitaji h2{
		width: 120px;
		margin: 0;
		padding: 0 0 0 40px;
		float: left;
	}
	
	#home_works .contents_base{
		width: 720px;
	}
	#home_works article{
		width: 220px;
	}
	#home_works article a h3{
		font-size: 14px;
	}
	#home_works .flow_btn a{
		font-size: 16px;
	}


	#home_gallery .contents_base{
		width: 720px;
	}
	#home_gallery article{
		width: 165px;
	}
	#home_gallery article:nth-child(4){
		margin-right: 0;
	}
	#home_gallery article figure{
		width: 165px;
		height: 165px;
	}
	#home_gallery article:nth-child(5){
		display: none;
	}
	#home_gallery .flow_btn a{
		font-size: 16px;
	}
	
	.risou_title_base h2{
		font-size: 32px;
	}
	.risou_title_base p{
		width: 720px;
		font-size: 15px;
	}
	
	#home_risou .contents_base,
	.risou_wrap{
		width: 720px;
	}
	.risou_wrap:nth-child(1){
		padding-left: 0;
	}
	.risou_wrap h3{
		width: 140px;
		margin: 10px 0 60px 0;
	}
	.risou_wrap p{
		float: left;
		padding: 55px 20px 0 40px;
		width: 210px;
		font-size: 13px;
		box-sizing: border-box;
	}
	.risou_wrap figure{
		float: left;
		width: 350px;
		margin-bottom: 62px;
	}
	
	.pagetop{
		padding-top: 60px;
	}
	
	
	
	
	/* ====================================================== */
	/* 2.flow ----------------------------------------------- */
	.flow_title{
		min-height: 328px;
	}
	.flow_title_innter{
		min-height: 328px;
		width: 700px;
		background-size: 620px;
	}
	.flow_title h1{
		padding: 83px 0 0 20px;
		width: 200px;
	}

	.line_midashi{
		font-size: 28px;
		margin-bottom: 35px;
		background-size: 620px;
	}
	.flow_copy{
		width: 660px;
		font-size: 14px;
	}

	.flow_detail{
		width: 700px;
	}
	.flow_detail .flow_text{
		width: 320px;
		min-height: 300px;
		padding-right: 30px;
	}
	.flow_detail .flow_text p{
		font-size: 14px;
		width: 320px;
	}
	.flow_detail figure{
		position: absolute;
		left: 20px;
		top: 30px;
		width: 320px;
	}
	#flow1 .flow_text .flow_subimage{
		text-align: right;
		width: 100px;
		margin: -30px -10px 0 0;
		float: right;
	}

	#flow2 .flow_text{
		float: left;
		min-height: 320px;
		width: 300px;
		padding-left: 30px;
	}
	#flow2 figure{
		left: auto;
		right: 0;
		top: 70px;
	}
	#flow2 .flow_text p{
		padding: 0 0 0 0;
		width: 320px;
	}
	#flow2 .flow_text .flow_subimage{
		text-align: right;
		width: 80px;
		margin: -10px -10px 0 0;
		z-index: 2;
		float: right;
	}

	#flow3 .flow_text{
		min-height: 320px;
		width: 300px;
		padding-right: 30px;
	}
	#flow3 figure{
		top: 32px;
	}
	#flow3 .flow_text .flow_subimage{
		text-align: right;
		width: 100px;
		margin: -20px -10px 0 0;;
		float: right;
	}

	#flow4 .flow_text{
		float: left;
		min-height: 300px;
		width: 280px;
		padding-left: 30px;
	}
	#flow4 figure{
		width: 320px;
	}
	#flow4 .flow_text p{
		padding: 0;
		width: 320px;
	}
	#flow4 .flow_text .flow_subimage{
		width: 150px;
	}

	#flow5 .flow_text{
		min-height: 320px;
		width: 300px;
		padding-right: 22px;
	}
	#flow5 figure{
		top: 32px;
	}
	#flow5 .flow_text .flow_subimage{
		width: 120px;
		margin: -20px -10px 0 0;
	}

	#flow .pagetop{
		padding-top: 80px;
	}
	.flow_caution{
		text-align: left;
	}
	.flow_caution p{
		font-size: 13px;
	}
	
	
	
	

	/* ====================================================== */
	/* 3.works ----------------------------------------------- */
	.gallery_title h2,
	.works_title h2{
		font-size: 28px;
		width: 519px;
	}
	.gallery_title h1,
	.works_title h1{
		font-size: 21px;
	}
	.works_wrap{
		width: 700px;
		padding: 120px 0 0 0;
	}
	.works_base{
		width: 700px;
	}
	.works_base article h3{
		font-size: 16px;
	}
	.works_base article p{
		font-size: 14px;
	}


	.corp_list{
		width:700px;
	}
	
	.pagenav span{
		font-size: 14px;
	}
	.pagenav a{
		font-size: 14px;
	}


	.works_detail_wrap{
		width: 700px;
	}
	.works_detail_wrap h1{
		font-size: 21px;
	}
	.works_detail .works_detail_text p{
		font-size: 16px;
	}


	/* ====================================================== */
	/* 4.gallery -------------------------------------------- */
	.gallery_wrap{
		width: 700px;
	}
	.gallery_base{
		width: 700px;
	}
	.gallery_base article{
		width: 48%;
		margin: 0 0 60px 0;
	}
	.gallery_base article:nth-child(even){
		float: right;
		margin: 0 0 60px 0;
	}
	.gallery_base article:nth-child(3n){
		margin: 0 0 60px 0;
	}
	.gallery_base article figure{
		margin-bottom: 0;
		line-height: 0;
		font-size: 0;
	}
	.gallery_base article figure img{
		width: 100%;
	}
	.gallery_base article p{
		padding: 0 0 26px 10px;
		margin: 0;
		background:url(../images/gallery/ten_back.jpg) no-repeat -2px bottom;
	}
	.gallery_base article a ,
	.gallery_base article a p{
		text-decoration: none;
	}





	/* ====================================================== */
	/* 5.aboutus -------------------------------------------- */
	.about_wrap{
		width: 650px;
	}
	.about_wrap h1{
		font-size: 21px;
	}
	.about_wrap h1 em{
		font-size: 16px;
	}
	.about_wrap table{
		width: 650px;
	}
	#map{
		width: 650px;
	}

}





/* ====================================================================== */
/* ====================================================================== */
/* ---------------------------------------------------------------------- */
/* 700 */
@media screen and (max-width:740px){
	/* base */
	/* ======================================================== */
	#header_base ,
	.contents_base ,
	#footer_base,
	#footer_top ,
	#header_base {
		width: 540px;
	}
	header .head_copy{
		font-size: 11px;
		left: 0;
	}
	header h1{
		width: 30%;
		margin: 0 auto;
		padding: 70px 0 20px 0;
		float: none;
		text-align: center;
	}
	#gnav ul{
		float: none;
		margin: 0 0 0 70px;
	}
	#gnav ul li#gnav2,
	#gnav ul li#gnav3,
	#gnav ul li#gnav4{
		padding-left: 25px;
	}
	
	.footer_add,
	.footer_maker{
		width: 100%;
	}
	.footer_add1,
	.footer_add2{
		width: 100%;
		float: none;
	}
	.footer_add p{
		margin-bottom: 1em;
	}
	.footer_maker figure{
		margin: 0;
		float: none;
	}
	.footer_maker p{
		margin-bottom: 2em;
	}
	
	/* ====================================================== */
	/* 1.home ----------------------------------------------- */
	/*
	#home .contents_base{
		width: 540px;
	}
	#home_concept h2{
		padding-top: 90px;
	}
	#home_concept{
		min-height: 750px;
	}
	#home_concept h2 img{
		width: 90%;
	}
	#home_concept_color{
		height: 250px;
	}
	*/
	
	/* home_detail1 */
	#home_detail1 .contents_base{
		width: 540px;
	}
	#home_detail1 h2{
		margin: -187px 0 120px 0;
	}
	#home_detail1 h2 img{
		width: 90px;
	}
	.hd1_image{
		width: 380px;
		margin: -175px 0 0 0;
	}
	
	.home_feature2,
	.home_feature{
		width: 540px;
		margin: 9.5vw auto 90px auto;
		box-sizing: border-box;
	}
	.feature_detail{
		width: 150px;
		padding: 0 20px;
	}
	.feature_detail:nth-child(1),
	.feature_detail:nth-child(3){
		margin-left: 90px;
	}
	.feature_detail h3{
		width: 150px;
		height: 150px;
		font-size: 22px;
	}
	
	
	#f2_1 figure{
		width: 220px;
	}
	#f2_1 .f2_detail{
		padding: 0;
		width: 300px;
	}
	#f2_1 .f2_detail p{
		font-size: 14px;
		font-weight: normal;
		line-height: 2em;
	}

	#f2_2 .f2_detail,
	#f2_4 .f2_detail{
		margin-left: 0;
		width: 280px;
		min-height: 300px;
		background: none;
		padding: 0;
	}
	#f2_2 .f2_detail h4 img,
	#f2_3 .f2_detail h4 img,
	#f2_4 .f2_detail h4 img{
		height: 80px;
	}
	#f2_2 .f2_detail h4,
	#f2_4 .f2_detail h4,
	#f2_2 .f2_detail h5,
	#f2_4 .f2_detail h5,
	#f2_2 .f2_detail p,
	#f2_4 .f2_detail p{
		margin-left: 0;
	}
	#f2_2 .f2_detail h5,
	#f2_4 .f2_detail h5{
		width: 260px;
		font-size: 14px;
		padding-left: 0;
		
	}
	#f2_2 .f2_detail p,
	#f2_4 .f2_detail p{
		font-size: 14px;
		padding-left: 0;
	}
	#f2_2 figure,
	#f2_4 figure{
		width: 240px;
		padding: 60px 0 80px 20px;
	}

	#f2_3 .f2_detail{
		margin-left: 20px;
		width: 280px;
		min-height: 263px;
		background: none;
	}
	#f2_3 .f2_detail h5{
		width: 260px;
		font-size: 14px;
	}
	#f2_3 .f2_detail p{
		font-size: 14px;
	}
	#f2_3 figure{
		float: left;
		line-height: 0;
		font-size: 0;
		width: 240px;
		padding: 52px 0 80px 0;
	}
	#f2_4 figure{
		padding-bottom: 100px;
	}
	
	#home_shitaji{
		min-height: 500px;
		width: 100%;
		box-sizing: border-box;
	}
	#home_shitaji .contents_base{
		width: 540px;
		box-sizing: border-box;
	}
	#shitaji_image{
		width: 400px;
		padding: 0 0 0 0;
	}
	#shitaji_image article{
		width: 190px;
		padding: 0 20px 0 0;
	}
	#shitaji_image p{
		font-size: 13px;
	}
	#home_shitaji h2{
		width: 100px;
	}
	
	#home_works .contents_base{
		width: 540px;
	}
	#home_works article{
		width: 170px;
		margin: 0 15px 0 0;
	}
	#home_works article a h3{
		font-size: 14px;
		font-weight: normal;
	}


	#home_gallery .contents_base{
		width: 540px;
	}
	#home_gallery article{
		width: 120px;
		margin-right: 15px;
	}
	#home_gallery article figure{
		width: 120px;
		height: 120px;
	}
	
	.risou_title_base h2{
		font-size: 24px;
	}
	.risou_title_base p{
		width: 540px;
		font-size: 14px;
	}
	
	#home_risou .contents_base,
	.risou_wrap{
		width: 540px;
	}
	.risou_wrap:nth-child(1){
		padding-left: 0;
	}
	.risou_wrap h3{
		width: 140px;
		margin: 10px 0 20px 100px;
	}
	.risou_wrap p{
		float: left;
		padding: 40px 20px 0 30px;
		width: 250px;
		font-size: 14px;
	}
	.risou_wrap figure{
		clear: both;
		float: none;
		width: 350px;
		margin: 0 0 62px 100px;
	}
	.risou_wrap figure.pcv{
		display: none;
	}
	.risou_wrap figure.mpv{
		display: block;
	}
	.rwrap2 h3{
		padding-left: 0;
		float: left;
	}
	.rwrap2 p{
		float: right;
		width: 275px;
		padding-left: 0;
		padding-right: 80px;
	}
	
	.pagetop{
		padding-left: 60px;
	}
	
	
	
	
	
	/* ====================================================== */
	/* 2.flow ----------------------------------------------- */
	.flow_title{
		min-height: 250px;
	}
	.flow_title_innter{
		min-height: 250px;
		width: 520px;
		background-size: 450px;
	}
	.flow_title h1{
		padding: 53px 0 0 20px;
		width: 160px;
	}

	.line_midashi{
		font-size: 22px;
		margin-bottom: 35px;
		background-size: 450px;
	}
	.flow_copy{
		width: 440px;
		font-size: 14px;
	}

	.flow_detail{
		width: 520px;
		box-sizing: border-box;
	}
	.flow_detail .flow_text{
		width: 250px;
		min-height: 280px;
		padding-right: 0;
	}
	.flow_detail .flow_text h3{
		width: 250px;
	}
	.flow_detail .flow_text p{
		font-size: 14px;
		width: 250px;
	}
	.flow_detail figure{
		position: absolute;
		left: 0;
		top: 30px;
		width: 250px;
	}
	#flow1 .flow_text .flow_subimage{
		text-align: right;
		width: 100px;
		margin: -30px -10px 0 0;
		float: right;
	}

	#flow2 .flow_text{
		float: left;
		min-height: 250px;
		width: 280px;
		padding-left: 0;
	}
	#flow2 figure{
		left: auto;
		right: 0;
		top: 70px;
	}
	#flow2 .flow_text p{
		padding: 0 0 0 0;
		width: 250px;
	}
	#flow2 .flow_text .flow_subimage{
		width: 70px;
		margin: -10px 10px 0 0;
	}

	#flow3 .flow_text{
		min-height: 280px;
		width: 250px;
		padding-right: 0;
	}
	#flow3 figure{
		top: 32px;
	}
	#flow3 .flow_text .flow_subimage{
		text-align: right;
		width: 80px;
		margin: -20px -10px 0 0;
		float: right;
	}

	#flow4 .flow_text{
		float: left;
		min-height: 280px;
		width: 250px;
		padding-left: 0;
	}
	#flow4 figure{
		width: 250px;
	}
	#flow4 .flow_text p{
		padding: 0;
		width: 250px;
	}
	#flow4 .flow_text .flow_subimage{
		width: 120px;
		margin: -10px -10px 0 0;
	}

	#flow5 .flow_text{
		min-height: 280px;
		width: 250px;
		padding-right: 0;
	}
	#flow5 figure{
		top: 32px;
	}
	#flow5 .flow_text .flow_subimage{
		width: 80px;
		margin: -10px -10px 0 0;
	}

	#flow .pagetop{
		padding-top: 80px;
	}
	.flow_caution p{
		font-size: 12px;
	}
	
	
	


	/* ====================================================== */
	/* 3.works ----------------------------------------------- */
	.gallery_title,
	.works_title{
		padding: 70px 0 0 0;
		height: 200px;
	}
	.gallery_title h2,
	.works_title h2{
		background: url(../images/works/title_line.svg) no-repeat center center;
		font-size: 28px;
		width: 520px;
		background-size: 500px;
	}
	.gallery_title h1,
	.works_title h1{
		font-size: 18px;
	}
	.works_wrap{
		width: 520px;
		padding: 80px 0 0 0;
	}
	.works_base{
		width: 520px;
	}
	.works_base article h3{
		font-size: 14px;
	}
	.works_base article p{
		font-size: 13px;
	}


	.corp_list{
		width:520px;
	}
	.corp_list li{
		font-size:13px;
	}

	.pagenav span{
		font-size: 13px;
	}
	.pagenav a{
		font-size: 13px;
	}


	.works_detail_wrap{
		width: 520px;
		padding-top: 100px;
	}
	.works_detail_wrap h1{
		font-size: 18px;
		margin-bottom: 30px;
	}
	.works_detail_wrap .spec{
		font-size: 14px;
		margin-bottom: 100px;
	}
	.works_detail .works_detail_text p{
		font-size: 13px;
	}


	/* ====================================================== */
	/* 4.gallery -------------------------------------------- */
	.gallery_wrap{
		width: 520px;
		padding: 50px 0 0 0;
	}
	.gallery_base{
		width: 520px;
	}
	.pagetop{
		padding-left: 0;
	}




	/* ====================================================== */
	/* 5.aboutus -------------------------------------------- */
	.about_wrap{
		width: 520px;
		padding: 50px 0 0 0;
	}
	.about_wrap h1{
		font-size: 18px;
	}
	.about_wrap h1 em{
		font-size: 14px;
	}
	.about_wrap table{
		width: 520px;
		margin-bottom: 60px;
	}
	.about_wrap table th,
	.about_wrap table td{
		font-size: 14px;
	}
	#about .contents h2{
		font-size: 14px;
	}
	#about .contents h2{
		width: 520px;
		margin: 0 auto 1em auto;
	}
	#map ,
	#map iframe{
		width: 520px !important;
		margin: 0 auto !important;
		padding: 0;
	}

}





/* ====================================================================== */
/* ====================================================================== */
/* ---------------------------------------------------------------------- */
/* 560px */
@media screen and (max-width:560px){
	
	.pcv {
		display: none;
	}
	.spv{
		display: block;
	}
	
	
	/* base */
	/* ======================================================== */
	#header_base ,
	.contents_base ,
	#footer_base,
	#footer_top ,
	#header_base {
		width: 100%;
	}
	/* sp nav */
	#spnav_btn{
		position: absolute;
		right:10px;
		top:5px;
		display: block;
		width: 36px;
		height: 36px;
		border-radius: 3px;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		border: 1px solid #002A5A;
		background: #fff;
		cursor: pointer;
		z-index:9999;
	}
	#spnav_btn i{
		color:#002A5A;
		position: absolute;

		top: 50%;
		left: 50%;
		margin-top: -0.53em;
		margin-left: -0.4em;

		cursor:pointer;
		font-size:22px;
		line-height:1.1em;
	}
	#spnav_btn:hover{
		background:#002A5A;
	}
	#spnav_btn:hover i{
		color:#FFF;
	}
	
	#gnav{
		display: none;
		position:absolute;
		width:100%;
		background:#FFF;
		padding: 0;
		top:95px;
		left:0;
		z-index:999999;
	}
	#gnav ul{
		list-style:none;
		width: 80%;
		margin: 0 auto;
		padding: 0;
		box-sizing: border-box;
	}
	#gnav ul li{
		float: none;
		padding: 0 !important;
		width: 100% !important;
		box-sizing: border-box;
	}
	#gnav ul li a{
		border-top:1px solid #002A5A;
		width: 100% !important;
		box-sizing: border-box;
		text-align: center;
		display:block;
		line-height:1.1em;
		padding: 20px 0 0 0; 
	}
	
	header .head_copy{
		display: none;
	}
	header h1{
		width: auto;
		padding: 30px 0 20px 0;
	}
	header h1 img{
		height: 40px;
		width: auto;
	}
	
	#footer_base{
		width: 90%;
		padding: 0 5%;
	}
	.footer_co,
	.footer_add,
	.footer_maker{
		width: 100%;
	}
	.footer_co{
		width: 100%;
		padding-left: 0;
	}
	.footer_co h2{
		float: none;
		padding-right: 0;
		margin: 0 auto 17px auto;
	}
	.footer_co h2 img{
		width: 232px;
	}
	
	.footer_add1,
	.footer_add2{
		width: 100%;
		float: none;
	}
	.footer_add p{
		margin-bottom: 1em;
	}
	.footer_maker figure{
		margin: 0;
		float: none;
	}
	.footer_maker p{
		margin-bottom: 2em;
	}
	
	/* ====================================================== */
	/* 1.home ----------------------------------------------- */
	/*
	#home .contents_base{
		width: 100%;
	}
	#home_concept{
		width: 100%;
		padding: 0 5%;
		height: auto;
		min-height: inherit;
	}
	#home_concept h2{
		font-size: 18px;
		line-height: 1.5em;
		text-align: center;
		color: #FFF;
		padding: 15px 0;
		margin: 40px 0 ;
		border: 1px solid #FFF;
	}
	#home_concept h3{
		font-size: 14px;
		padding: 0 5%;
		text-align: left;
		width: 100%;
		box-sizing: border-box;
	}
	#home_concept_color{
		display: none;
	}
	*/
	#home_concept{
		height: 110%;
		padding-bottom: 10%;
	}
	#home .contents_base{
		height: 100%;
	}
	#home_concept h2{
		height: auto;
		width: 90%;
		margin: 0 auto;
	}
	#home_concept h3{
		margin: 0 0 4.75vw 0;
		font-size: 3.5vw;
	}
	#home_concept p{
		margin: 0 0 9vw 0;
	}
	#home_concept h4{
		margin: 0 auto 6.25vw auto;
		height: 10.5vw;
	}
	#home_concept figure{
		height: 21.25vw;
	}


	/* home_detail1 */
	.feature_detail:nth-child(1),
	.feature_detail:nth-child(3){
		margin-left: 0;
	}
	.feature_detail{
		width: 50%;
		padding: 0 5px;
		box-sizing: border-box;
	}
	.feature_detail h3{
		width: 130px;
		height: 130px;
		font-size: 22px;
	}
	#home_detail1 .contents_base{
		width: 90%;
		padding: 0;
	}
	#home_detail1 h2{
		margin: 20px 0;
		line-height: 1.6em;
		font-size: 21px;
		color: rgba(0,42,90,1.00);
	}
	.hd1_image{
		width: 100%;
		margin: 0 0 0 0;
	}
	
	.home_feature2,
	.home_feature{
		width: 100%;
		margin: 20px auto;
		box-sizing: border-box;
	}
	.home_feature {
		padding-top: 60px;
	}
	#hf1 h3,
	#hf3 h3{
		padding-top: 50px;
	}
	#hf2 h3,
	#hf4 h3{
		padding-top: 45px;
	}
	.feature_detail p{
		font-size: 12px;
	}
	
	
	
	#f2_1 figure{
		width: 100%;
		padding-bottom: 20px;
	}
	#f2_1 .f2_detail{
		width: 100%;
		margin-bottom: 40px;
	}
	
	#f2_2 .f2_detail,
	#f2_4 .f2_detail{
		width: 100%;
		min-height:inherit;
	}
	#f2_2 .f2_detail h4 img,
	#f2_3 .f2_detail h4 img,
	#f2_4 .f2_detail h4 img{
		height:auto;
		max-height: 100px;
	}
	#f2_2 .f2_detail h5,
	#f2_4 .f2_detail h5{
		width: 100%;
		
	}
	#f2_2 .f2_detail p,
	#f2_4 .f2_detail p{
		font-size: 14px;
		padding-left: 0;
		margin-bottom: 1em;
	}
	#f2_2 figure,
	#f2_4 figure{
		width: 100%;
		padding: 0 0 40px 0;
	}

	#f2_3 .f2_detail{
		margin-left: 0;
		width: 100%;
		min-height: inherit;
	}
	#f2_3 .f2_detail p{
		margin: 0 0 20px 0;
	}
	#f2_3 .f2_detail h5{
		width: 100%;
	}
	#f2_3 figure{
		width: 100%;
		padding: 0 0 40px 0;
	}
	#f2_4 figure{
		padding-bottom: 40px;
	}
	
	#home_shitaji{
		min-height: inherit;
		width: 100%;
		box-sizing: border-box;
	}
	#home_shitaji .contents_base{
		width: 90%;
		box-sizing: border-box;
	}
	#shitaji_image{
		width: 100%;
		padding: 0 0 0 0;
	}
	#shitaji_image article{
		width: 48%;
		padding: 0;
		clear: both;
	}
	#shitaji_image article:nth-child(even){
		float: right;
		clear: inherit;
	}
	#shitaji_image p{
		font-size: 12px;
	}
	#home_shitaji h2{
		width: auto;
		line-height: 1.5em;
		font-size: 16px;
		color: rgba(0,42,90,1.00);
		padding: 0;
		box-sizing: border-box;
		float: none;
	}
	
	#home_works .contents_base{
		width: 90%;
	}
	#home_works article{
		width: 100%;
		margin: 0 0 15px 0;
		float: none;
	}
	#home_works article a h3{
		font-size: 14px;
		font-weight: normal;
	}


	#home_gallery .contents_base{
		width: 90%;
		margin: 0 auto;
	}
	#home_gallery article{
		width: 47%;
		margin-right: 0;
	}
	#home_gallery article:nth-child(even){
		float: right;
	}
	#home_gallery article figure{
		width: 100%;
		height: 100%;
	}
	
	.risou_title_base h2{
		font-size: 21px;
	}
	.risou_title_base p{
		width: 90%;
		margin: 0 auto;
		font-size: 14px;
	}
	
	#home_risou .contents_base,
	.risou_wrap{
		width: 90%;
		margin: 0 auto;
	}
	.risou_wrap:nth-child(1){
		padding-left: 0;
	}
	.risou_wrap h3{
		width: 140px;
		float: none;
		margin: 10px auto 20px auto;
	}
	.risou_wrap p{
		float: none;
		padding: 0 0 0 0;
		width: 100%;
		margin: 0 auto 20px auto;
		font-size: 14px;
	}
	.risou_wrap figure{
		clear: both;
		float: none;
		width: 100%;
		margin: 0 0 62px 0;
	}
	.risou_wrap figure.pcv{
		display: none;
	}
	.risou_wrap figure.mpv{
		display: block;
	}
	.rwrap2 h3{
		padding-left: 0;
		float: none;
	}
	.rwrap2 p{
		float: none;
		width: 100%;
		padding-left: 0;
		padding-right: 0;
	}
	
	.pagetop{
		padding-left: 0;
	}
	
	
	/* ====================================================== */
	/* 2.flow ----------------------------------------------- */

	.flow_title{
		min-height: 200px;
		margin-bottom: 60px;
	}
	.flow_title_innter{
		min-height: 170px;
		width: 100%;
		background-size: 300px;
		background-position: 70px top;
	}
	.flow_title h1{
		padding: 33px 0 0 10px;
		width: 130px;
	}
	
	.line_midashi{
		font-size: 18px;
		margin-bottom: 20px;
		background-size: 90%;
	}
	.flow_copy{
		width: 100%;
		margin-bottom: 30px;
	}

	.flow_detail{
		width: 100%;
		box-sizing: border-box;
		padding: 0 5%;
	}
	.flow_detail .flow_text{
		width: 100%;
		min-height: inherit;
		padding-right: 0;
	}
	.flow_detail .flow_text h3{
		width: 100%;
	}
	.flow_detail .flow_text p{
		font-size: 14px;
		width: 100%;
	}
	.flow_detail figure{
		position: relative;
		left: auto;
		top: auto;
		width: 100%;
		margin-bottom: 40px;
	}
	#flow1 .flow_text .flow_subimage{
		text-align: right;
		width: 100px;
		margin: -30px -10px 0 0;
		float: right;
	}

	#flow2 .flow_text{
		float: none;
		min-height: inherit;
		width: 100%;
	}
	#flow2 figure{
		left: auto;
		right: 0;
		top: 0;
	}
	#flow2 .flow_text p{
		padding: 0 0 0 0;
		width: 100%;
	}
	#flow2 .flow_text .flow_subimage{
		width: 70px;
		margin: -10px 10px 0 0;
	}

	#flow3 .flow_text{
		min-height: inherit;
		width: 100%;
		padding-right: 0;
	}
	#flow3 figure{
		top: auto;
	}
	#flow3 .flow_text .flow_subimage{
		text-align: right;
		width: 80px;
		margin: -20px -10px 0 0;
		float: right;
	}

	#flow4 .flow_text{
		float: none;
		min-height: inherit;
		width: 100%;
		padding-left: 0;
	}
	#flow4 figure{
		width: 100%;
		top: auto;
	}
	#flow4 .flow_text p{
		padding: 0;
		width: 100%;
	}
	#flow4 .flow_text .flow_subimage{
		width: 120px;
		margin: -10px -10px 0 0;
	}

	#flow5 .flow_text{
		min-height: 280px;
		width: 100%;
		padding-right: 0;
	}
	#flow5 figure{
		top: auto;
	}
	#flow5 .flow_text .flow_subimage{
		width: 80px;
		margin: -10px -10px 0 0;
	}

	#flow .pagetop{
		padding-top: 0;
	}
	.flow_caution{
		padding-top: 0;
		width: 90%;
		margin: 0 auto 60px auto;
	}
	.flow_caution p{
		font-size: 12px;
	}
	
	

	/* ====================================================== */
	/* 3.works ----------------------------------------------- */
	.gallery_title h2,
	.works_title h2{
		background: none;
		font-size: 28px;
		width: 90%;
		background-size: cover;
	}
	.gallery_title h1,
	.works_title h1{
		font-size: 18px;
	}
	.works_wrap{
		width: 90%;
		margin: 0 auto;
		padding: 60px 0 0 0;
	}
	.works_base{
		width: 100%;
	}
	.works_base article h3{
		font-size: 13px;
	}
	.works_base article p{
		font-size: 12px;
	}


	.corp_list{
		width:100%;
	}
	.corp_list li{
		font-size:12px;
	}
	


	.works_detail_wrap{
		width: 90%;
		padding-top: 60px;
	}
	.works_detail_wrap h1{
		font-size: 18px;
		margin-bottom: 30px;
	}
	.works_detail_wrap .spec{
		font-size: 14px;
		margin-bottom: 2em;
	}
	.works_detail .works_detail_text {
		position: relative;
		left: auto;
		bottom: auto;
		margin: 0 0 2em 0;
		width: 100%;
	}
	.works_detail .works_detail_image{
		position: relative;
		width: 100%;
		float: none;
	}
	.works_detail .works_detail_text p{
		font-size: 13px;
	}
	
	.works_detail figure{
		width: 100%;
		float: none;
		margin-bottom: 2%;
	}
	.works_detail figure:nth-child(2n){
		float: none;
	}
	.works_detail figure:nth-child(2n+1){
		clear: none;
	}
	
	
	
	.worksdetail .works_base{
		width: 90%;
		margin: 0 auto;
	}
	.works_base article{
		width: 48%;
		float: left;
		padding: 0 2% 30px 0;
	}
	.works_base article:nth-child(odd){
		clear: both;
	}
	.works_base article:nth-child(even){
		float: right;
		padding: 0 0 30px 0;
	}
	.worksdetail .works_base article:nth-child(3n){
		display: none;
	}
	/*
	.works_base article:nth-child(3n){
		display: none;
	}
	*/
	.worksdetail .works_base article{
		width: 48%;
	}
	
	
	/* ====================================================== */
	/* 4.gallery -------------------------------------------- */
	.gallery_wrap{
		width: 90%;
		margin: 0 auto;
		padding: 50px 0 0 0;
	}
	.gallery_base{
		width: 100%;
	}
	.pagetop{
		padding-left: 0;
	}
	.gallery_base article,
	.gallery_base article:nth-child(even),
	.gallery_base article:nth-child(3n){
		margin-bottom: 30px;
	}



	/* ====================================================== */
	/* 5.aboutus -------------------------------------------- */
	.about_wrap{
		width: 90%;
		margin: 0 auto;
		padding: 50px 0 0 0;
	}
	.about_wrap h1{
		font-size: 18px;
		float: none;
		text-align: center;
	}
	.about_wrap h1 em{
		display: inline-block;
		margin: 0;
		font-size: 14px;
	}
	.about_wrap table{
		width: 100%;
		margin-bottom: 60px;
	}
	.about_wrap table th,
	.about_wrap table td{
		display: list-item;
		list-style: none;
		padding: 0;
		font-size: 14px;
		width: 100%;
		border: none;
	}
	.about_wrap table td{
		border-bottom: 1px dotted #CCC;
		padding: 0 0 1em 0;
		margin: 0 0 1em 0;
	}
	#about .contents h2{
		font-size: 14px;
	}
	#about .contents h2{
		width: 90%;
		margin: 0 auto 1em auto;
	}
	#map ,
	#map iframe{
		width: 100% !important;
		margin: 0 auto !important;
		padding: 0;
		height: 350px !important;
		min-height: inherit;
	}
}