@charset "utf-8";

/* indexのみ上書き
------------------ */
@media print, screen and (min-width: 980px){
#main{
	margin: 0;
}
}


.mv_wrap{
	/*display: grid;
	grid-template-columns: repeat(16, 1fr);	
	justify-items: center;*/
	
	display: flex;
	justify-content: space-between;
    align-items: center;
	padding: 0 0.75rem;
}

#mv{
	/*grid-column: 1 / 17;*/
	margin-bottom: 2rem;
	position: relative;
}

#mv img{
	vertical-align: top;
}

.mv_wrap .h{
	display: none;
}

@media print, screen and (min-width: 640px){

	#mv{
		/*grid-column: 5 / 17;*/
		width: 80%;
		margin: 0 0 2rem auto;
		border-left: 1px solid #9D9D9D;
		border-bottom: 1px solid #9D9D9D;
	}

	#mv img{
		vertical-align: top;
	}

	.mv_wrap .h{
		display: block;
		/*grid-column: 2 / 4;*/
		width: 10%;
		margin: 0 0 0 auto;
	}

}

@media print, screen and (min-width: 1024px){
	
	
	#mv{ 
		width: 75%;
		margin: 0 0 0 auto; 
	}
	
	.mv_wrap .h{
		width: 8%;
	}
}


.about_list_wrap dl{
	margin-bottom: 3rem;
}

.about_list_wrap dt{
	font-size: 1.25rem;
	margin-bottom: 1rem;
	padding-bottom: 0.5rem;
	border-bottom: 1px solid #1E6276;
}

.about_list_wrap dd{
	border-bottom: 1px solid #eee;
    padding: 0.75rem 0;
}


.about_list_wrap dt::before{
	content: "";
	display: inline-block;
	width: 1.75rem; height: 1.75rem;
	margin-right: 0.75rem;
	vertical-align: middle;
}

.about_list_wrap .about_list dt::before{background: url("../../img_index/icon_about01.png") no-repeat center / contain;}
.about_list_wrap .time_list dt::before{background: url("../../img_index/icon_about02.png") no-repeat center / contain;}
.about_list_wrap .call_list dt::before{background: url("../../img_index/icon_about03.png") no-repeat center / contain;}


.t-column_2 .ph_map_wrap{
	width: 100%;
}

.ph_map_wrap .google_map_wrap{
	margin-bottom: 1rem;
}

.google_map_wrap{
	position:relative;
	width:100%;
	height:0;
	padding-top:75%;
}

.google_map_wrap iframe{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}


@media print, screen and (min-width: 640px){
	
	.t-column_2 .ph_map_wrap{
		width: 45%;
	}
}


@media print, screen and (min-width:1024px){



	.about_list_wrap dt{
		font-size: 1.75rem;
	}
	
	
	.about_list_wrap dt::before{
		width: 2rem; height: 2rem;
	}
	
	.t-column_2 .ph_map_wrap{
		width: 40%;
	}
	
	a.call{
		color: #333;
		text-decoration: none;
		pointer-events: none;
	}
}



/* 業務内容 */


.bg_work{
	position: relative;
	z-index: 0;
}

/*.bg_work::before{
	content: "";
	display:block;
	width:6rem; height:6rem;
	background: #3197B5;
	position:absolute;
	left:0; top:-2rem;
	z-index:-1;
}*/

.bg_work::after{
	content: "";
	display:block;
	width:100%; height:90%;
	background: #3197B5;
	position:absolute;
	right:0; bottom:0;
	z-index:-1;
}

.work_wrap{
	padding:  2rem 0 4rem;
}

.work_wrap .ph_wrap{
	width: 90%;
	height: 30vh;
	margin: 0 auto 4rem;
	background: url("../img/work.jpg") no-repeat center / cover;
	position: relative;
}

.work_wrap .ph_wrap::before{
	content: "";
	display:block;
	width:4rem; height:4rem;
	background: #3197B5;
	position:absolute;
	left:-1rem; top:-1rem;
	z-index:-1;
}


.work_wrap .work_box_wrap{
	width: 100%;
}

.work_box{
	text-align: center;
	color: #fff;
	line-height: 2;
	padding: 0 2rem;
	margin-bottom: 2rem;
	box-sizing: border-box;
}

.work_box .work_icon{
	/*width: 70%;*/
	width: 15rem;
    height: 13rem;
	margin: 0 auto 2rem;
	padding: 2rem 1rem;
	font-size: 1.25rem;
	text-align: center;
	color: #333;
	background: #fff;
	box-sizing: border-box;
	border-radius: 0.5rem;
	position: relative;
}

.work_box .work_icon::before{
	content: "";
	display: block;
	width: calc(100% - 1.5rem);
	height: calc(100% - 1.5rem);
	border: 1px solid #aaa;
	border-radius: 0.5rem;
	position: absolute;
	top: 50%; left: 50%;
	transform: translate(-50%,-50%);
}

.work_box .work_icon img{
	width: 6.5rem;
	margin: 0 auto;
}


.work_box p{
	display: inline-block;
	text-align: left;
}


@media print, screen and (min-width: 640px){

	.work_box .work_icon{
		/*width: 50%;*/
	}
	
	
	.work_box p{
		display: block;
	}

}


@media print, screen and (min-width: 1024px){


	.bg_work::after{
		width:80%; height:90%;
		right:0; bottom:0;
	}
	
	.work_wrap{
		padding:  2rem 0 6rem;
	}
	
	
	.work_box .work_icon{
		/*width: 70%;*/
	}

	
	.work_wrap .ph_wrap{
		width: 40%;
		height: 80vh;
	}
	
		
	.work_wrap .ph_wrap::before{
		width:15rem; height:15rem;
		top: -4rem; left: -4rem;
	}
	
	
	.work_wrap .work_box_wrap{
		width: calc(60% - 4.5rem);
	}
	
	.work_box{margin-bottom: 2rem;}
}


/* 当事務所の特徴 */

#feature{
	max-width: 1060px;
	position: relative;
}


#feature .t{
	line-height: 2;
}


#feature > .h{
	background: #3197B5;
	color: #fff;
	font-weight: 300;
	letter-spacing: 2px;
	padding: 1rem 2rem;
	margin-bottom: 4rem;
	text-align: left;
	position: relative;
}

#feature > .h::after{
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 1.5rem 3rem 0 3rem;
	border-color: #3197B5 transparent transparent transparent;
	
	position: absolute;
	bottom: -1rem;
	left: 50%;
	transform: translateX(-50%);
}

#feature .icon{
	width: 1.5rem;
	display: inline-block;
	vertical-align: middle;
	margin-right: 1rem;
}

@media print, screen and (min-width: 1024px){


	#feature > .h{
		letter-spacing: 3px;
		padding: 1rem;
	}


}


@media print, screen and (min-width:1280px){
	/*#feature > .h{
		max-width: 80%;
		margin-left: auto;
		margin-right: auto;
	}*/
}



.feature_wrap{
	margin-bottom: 2rem;
	position: relative;
	z-index: 0;
}

.feature_wrap > div:last-of-type{
	margin-bottom: 0;
}

.feature_wrap::after{
	content: "";
	display: block;
	width: 2rem; height: 80%;
	background-color: #E48125;
	
	position: absolute;	
	top: 50%; left: 50%;
	transform:translate(-50%,-50%);
	z-index: -3;
}


.feature_box{
	max-width: 70%;
    margin: 0 auto 2rem;
	padding: 2rem 1rem;
	border: 3px solid #139BB9;	
	background: #fff;
	box-sizing: border-box;
	position: relative;
	z-index: 0;
}


.feature_box::before{
	content: "";
	display: block;
	width: 3rem;
	height: 3rem;
	margin: 0 auto 0.25rem;
}

.feature_box.shiho::before{
	background: url("../../img_index/icon_work01.png") no-repeat center / contain;
}

.feature_box.totikaoku::before{
	background: url("../../img_index/icon_work02.png") no-repeat center / contain;
}

.feature_box.gyosei::before{
	background: url("../../img_index/icon_work03.png") no-repeat center / contain;
}

.feature_box.shakaihoken::before{
	background: url("../../img_index/icon_work04.png") no-repeat center / contain;
}


.feature_box > .h{
	font-size: 1.25rem;
	text-align: center;
	letter-spacing: 2px;
}


.feature_box > .h{
	
}

@media print, screen and (min-width: 640px){

	.feature_wrap::after{
		width: 80%; height: 2rem;
	}
	
	
	.feature_box{
		max-width: auto;
    	margin: 0;
	}
	
	
	.feature_box::before{
		width: 5rem;
		height: 5rem;
		margin: 0 auto 1rem;
	}

}


@media print, screen and (min-width:1060px){
	/*.p-column_3 > .feature_box{
		width: calc(100% / 3 - 6rem);
	}*/
	
	.feature_box{
		padding: 4rem 2rem;
	}
	
	
	.feature_box > .h{
		font-size: 1.5rem;
		letter-spacing: 4px;
	}
}



.name_box{	margin-bottom: 4rem;}

.name_box .content_t{
	padding:2rem 2rem 4rem;
}

.name_box{
	background: #fff;
	position: relative;
	box-shadow: 10px 8px 5px -10px #777777;
	position: relative;
}

.name_box .content_t::after{
	content: "";
	display: block;
	width: 1.5rem; height: 1.5rem;
	background: #E78831;
	position: absolute;
	right: 0; bottom: 0;
}

/*.name_box .content_t{
	padding:2rem 2rem 4rem;
	background: #fff;
	position: relative;
	box-shadow: 10px 8px 5px -10px #777777;
}

.name_box .content_t::after{
	content: "";
	display: block;
	width: 1.5rem; height: 1.5rem;
	background: #E78831;
	position: absolute;
	right: 0; bottom: 0;
}*/


.name_box .h{
	font-weight: 300;
	color: #fff;
	text-align: center;
	padding: 1.5rem 1.75rem;
	background: #3197B5;
}

.name_box .license_list{
	font-size: 1.125rem;
	margin-bottom: 1rem;
}

.name_box .license_list li{
	padding: 0.75rem 0.5rem;
	/*border-bottom: 1px solid #ccc;*/
}

.name_box .history_list dt{
	color: #1E6276;
	padding: 0.75rem 0.5rem;
}

.name_box .history_list dd{
	font-size: 1rem;
	padding: 0.75rem 0.5rem;
	border-bottom: 1px solid #ccc;
}


@media print, screen and (min-width: 640px){

	.name_wrap{
		margin-top: 5rem;
	}
	
	.name_box .h{
		text-align: left;
	}

}


@media print, screen and (min-width:1060px){
	
	.column_2 .name_box{
		width: calc(50% - 4rem);
	}
}


/*eof*/