@charset "UTF-8";
/* =========================================================
mv
========================================================= */
#mv {
	background-image: url(../img/mv-photo.jpg);
}
/* =========================================================
lawlers
========================================================= */
#lawyers {}
#lawyers h2 {}
#lawyers .lawyer {
	width: 980px;
	padding: 6em 0;
	letter-spacing: 0.2em;
	border-width: 0 0 1px;
	border-style: solid;
	border-image: linear-gradient(to right, #005e9c, #00A0C1) 1 100%;
	border-image-slice: 1;
}
#lawyers .lawyer .photo {
	width: 830px;
	text-align: justify;
	padding: 3em 0 3em 360px;
	background: url(../img/lawyer1-photo.jpg) no-repeat top left / auto;
}
#lawyers .lawyer .photo .name {
	font-size: 160%;
	font-weight: bold;
}
#lawyers .lawyer .photo .name span {
	font-size: 55%;
	letter-spacing: 0.1em;
	padding: 0 0 0 3em;
}
#lawyers .lawyer .photo .post {
	padding: 2em 0;
	letter-spacing: 0.1em;
	line-height: 2;
}
#lawyers .lawyer .photo .post span {
	display: block;
	font-size: 80%;
}
#lawyers .lawyer .photo .history {
	letter-spacing: 0.1em;
}
#lawyers .lawyer .photo .history h3 {
	font-size: 100%;
}
#lawyers .lawyer .photo .history dl {
	width: 100%;
}
#lawyers .lawyer .photo .history dl:after {
	content: "";
	display: block;
	clear: both;
}
#lawyers .lawyer .photo .history dl dt {
	float: left;
	width: 17%;
}
#lawyers .lawyer .photo .history dl dd {
	float: right;
	width: 83%;
}
#lawyers .lawyer .lead {
	width: 830px;
	text-align: justify;
	padding: 3em 0 0;
	border-top: 1px dashed #ddd;
	font-size: 100%;
	letter-spacing: 0;
}
#lawyers .lawyer:nth-of-type(1) .photo {
	background: url(../img/lawyer3-photo.jpg) no-repeat top left / auto;
}
#lawyers .lawyer:nth-of-type(2) .photo {
	background: url(../img/lawyer2-photo.jpg) no-repeat top left / auto;
}
#lawyers .lawyer:nth-of-type(3) .photo {
	background: url(../img/lawyer3-photo.jpg) no-repeat top left / auto;
}
/* =========================================================
outline
========================================================= */
#outline {}
#outline h2 {
	margin-bottom: 3em;
}
#outline dl {
	width: 700px;
	text-align: justify;
}
#outline dl:after {
	content: "";
	display: block;
	clear: both;
}
#outline dl dt {
	float: left;
	width: 20%;
	padding: 0.5em 0 0.5em;
}
#outline dl dd {
	float: right;
	width: 80%;
	border-left: 1px solid #ddd;
	padding: 0.5em 0 0.5em 8%;
}
/* =========================================================
access
========================================================= */
#access {}
#access h2 {
	margin-bottom: 3em;
}
#access ul {
	width: 700px;
	text-align: justify;
	padding: 0 0 2em;
}
#access ul li {
	padding: 0 0 2em;
}
#access ul li h3 {}
#access ul li p {
	letter-spacing: 0;
}
#access .googlemap {
	height: 500px;
	background: #ddd;
}
#access .googlemap iframe{
	width:100%;
	height:100%;
}
@media screen and (max-width: 768px) {
	/*============================
#contents
============================*/
	#contents {
		padding: 0 0 100px;
	}
	/*============================
#mv
============================*/
	#contents #mv {
		padding: 0 0 31%;
	}
	#contents .page-ttl {
		width: auto;
		padding: 1.5em 0 0.5em;
	}
	/*============================
#lawyers
============================*/
	#contents #lawyers {
		padding: 2.5em 0 0 0;
	}
	#contents #lawyers .ttl {}
	#contents #lawyers .lawyer {
		width: 90%;
		padding: 3em 0;
	}
	#contents #lawyers .lawyer .photo {
		width: auto;
		background-position: top center;
		padding: 250px 0 2em 0;
		background-size: 200px;
	}
	#contents #lawyers .lawyer .photo .name {}
	#contents #lawyers .lawyer .photo .post {
		padding: 0.5em 0;
	}
	#contents #lawyers .lawyer .photo .history {}
	#contents #lawyers .lawyer .photo .history h3 {}
	#contents #lawyers .lawyer .photo .history dl {}
	#contents #lawyers .lawyer .photo .history dl:after {}
	#contents #lawyers .lawyer .photo .history dl dt {
		width: 25%;
	}
	#contents #lawyers .lawyer .photo .history dl dd {
		width: 75%;
	}
	#contents #lawyers .lawyer .lead {
		width: auto;
		padding: 2em 0 0;
		font-feature-settings: "palt";
	}
	/*============================
#outline
============================*/
	#contents #outline {
		width: 90%;
		padding: 5em 0 0 0;
	}
	#contents #outline .ttl {}
	#outline dl {
		width: auto;
	}
	#outline dl:after {}
	#outline dl dt {
		width: 25%;
	}
	#outline dl dd {
		width: 75%;
		padding: 0.5em 0 0 2%;
	}
	/*============================
#access
============================*/
	#contents #access {
		padding: 5em 0 0 0;
		width: 90%;
	}
	#contents #access .ttl {}
	#contents #access ul {
		width: auto;
		padding: 0 0 2em;
	}
	#contents #access ul li {
		padding: 0 0 1em;
	}
	#contents #access ul li h3 {}
	#contents #access ul li p {}
	#contents #access .googlemap {}
}
