h4.subtitle {
	color:#ffffff;
	font-size:60px;
	margin-top:40px;
	font-weight:300;
}

.wrap {
	text-align:left;
	vertical-align: top;
	padding:0;
}

.subtitle-wrap {
	padding-top:230px;
	
}

.sub_top_area {
	height:420px;
	padding-top:75px;
}

.sub_top_bg {
	height:100%;
	background-size:cover;
	background-position:center center;
}

.wrap .line_deco {
	width: 70px;
	display: inline-block;
	height: 2px;
	position: relative;
	background: rgba(255, 255, 255, 0.3);
}

.wrap .line_deco::before {
	right: 0;
}

.wrap .line_deco::after {
	left: 0;
}

.wrap .line_deco::after, .wrap .line_deco::before {
	width: 2px;
	height: 2px;
	background: #fff;
	content: "";
	position: absolute;
}

.subpos {
	position:relative;
	margin-right:20px;
	text-align:right;
	color:#ffffff;
	font-size:16px;
	letter-spacing:1px;
	font-weight:300;
	padding-top:30px;
}

.sub-contents-title {
	text-align: center;
	padding:50px 0;
}

.sub-contents-title h5 {
	font-size:40px;
	line-height:50px;
}

.sub-contents-title h2 {
	font-weight:300;
	margin-top:0;
}

.sub-contents-main {
	padding:80px 0 0;
	font-size:0;
}

.sub-contents-text {
	display:inline-block;
	width:calc(55% - 40px);
	padding:0 40px 0 0;
	vertical-align: bottom;
}

.sub-contents-text h4 {
	font-size:50px;
	font-family:'Arita buri';
	font-weight:500;
	padding: 60px 0 30px;
	color:#999999;
	line-height:140%;
	letter-spacing: -0.03em;
}

.sub-contents-text h4 span {
	color: #cda381;
}

.sub-contents-text p {
	font-size:20px;
	line-height:150%;
	padding:20px 0 0;
	font-weight:300;
	color:#777777;
}

.sub-contents-text p.signature {
	font-size:22px;
	font-weight:600;
	font-family:'Arita buri';
	color:#444444;
	padding-top:70px;
}

.sub-contents-images {
	display:inline-block;
	width:calc(45% - 40px);
	height:680px;
	margin:0 0 0 40px;
	background-color:#f4f4f4;
	background-size:cover;
	background-position:center center;
	vertical-align: bottom;
}

.quotes {
	width: 145px;
	height: 91px;
	background: url('/images/quotes.png') no-repeat left / contain;
	display: inline-block;
	position: absolute;
}

.add-contents {
	padding:100px 0;
}

.add-contents-etitle {
	font-size:14px;
	font-weight:800;
	letter-spacing: 2px;
}

.lines_bk {
	position: relative;
	left: 0;
	top:20px;
	width: 17px;
	height: 1px;
	background-color: #121212;
}

.add-contents-title {
	margin-top:40px;
	font-size:32px;
	font-weight:400;
	letter-spacing: 2px;
}

.upper-dot {
	position:absolute;
	width:5px;
	height:5px;
	background-color:#cda381;
	border-radius:2px;
}

.add-contents ul {
	padding:40px 0 0 0;
	font-size:0;
}

.add-contents ul li {
	display:inline-block;
	width:calc(25% - 10px);
	font-size:16px;
	padding:12px 10px 12px 0;
}

.add-contents ul li span {
	color:#cda381;
}

ul.lawyers {
	padding:0 20px 80px;
	font-size:0;
}

ul.lawyers li {
	display:inline-block;
	background-color:#f4f4f4;
	width:calc(33.3% - 20px);
	height:450px;
	margin:0 20px 20px 0;
	overflow:hidden;
}

ul.lawyers li .lawyer {
	width:100%;
	height:100%;
	background-position:center top;
	background-size:cover;
	background-repeat: no-repeat;
	filter:grayscale(1);
	cursor:pointer;
	transition-duration: 0.3s;
}

ul.lawyers li .lawyer:hover {
	filter:grayscale(0);
	.lawyer-info {
		opacity:1;
		bottom:0;
	}
}

.lawyer-info {
	position:absolute;
	padding:30px;
	bottom:-100px;
	text-align: left;
	color:#ffffff;
	opacity: 0;
	transition-duration: 0.3s;
}

.lawyer-info hr {
	display:inline-block;
	position:relative;
	left:0;
	width:30px;
	border:0 solid #ffffff;
	border-width:1px 0 0 0;
	margin:15px 0 25px 3px;
}

.lawyer-info .lawyer-history {
	font-size:16px;
	font-weight:500;
}

.lawyer-info .lawyer-name {
	font-size:28px;
	font-weight:500;
}

.submap {
	display:flex;
	width:100%;
	height:500px;
	overflow:hidden;
	justify-content: center;
	align-items: center;
	text-align:center;
}

.mapwrap {
	width:1400px;
	height:500px;
}

.contactwrap {
	display:block;
	padding:80px 0;
}

.contactwrap ul {
	font-size:0;
}

.contactwrap ul li {
	display:inline-block;
	width:calc(25% - 30px);
	margin:0 10px 50px 0;
	padding:10px;
	vertical-align: top;
}

.contactwrap ul li:nth-child(4n){
	margin-right:0;
}

.contact-info .contact-etitle {
	font-weight:800;
	font-size:14px;
	letter-spacing:1px;
}

.contact-info .contact-title {
	font-size:28px;
}

.contact-info .contact-content {
	font-size:16px;
	margin-top:20px;
	line-height:140%;
	font-weight:300;
}

.contact-info hr {
	display:inline-block;
	width:30px;
	border:0 solid #999999;
	border-width:1px 0 0 0;
	margin:20px 0;
}

@media screen and (min-width: 901px) {
	
	ul.lawyers li:nth-child(3n) {
		margin-right:0;
	}
}

@media screen and (max-width: 1300px) {
	
	h4.subtitle {
		font-size:40px;
		margin-top:30px;
	}
	
	.sub-contents-title h5 {
		font-size:34px;
	}
	
	.sub-contents-title h2 {
		font-size:20px;
		margin-top:10px;
	}
	
	.sub_top_area {
		height:250px;
		padding-top:75px;
	}
	
	.subtitle-wrap {
		padding-top:120px;
		margin-left:20px;
	}
	
	.subpos {
		font-size:14px;
	}
	
	.sub-contents-main {
		padding:30px 0;
	}
	
	.sub-contents-text {
		padding:0 20px 30px;
	}
	
	.sub-contents-text h4 {
		font-size:40px;
	}
	
	.sub-contents-images {
		margin:0 20px;
	}
	
	ul.lawyers li {
		height:350px;
	}
}

@media screen and (max-width: 900px) {
	
	h4.subtitle {
		font-size:28px;
		margin-top:20px;
	}
	
	.sub-contents-title {
		padding: 30px 0 25px;
	}
	
	.sub-contents-title h5 {
		font-size:28px;
	}
	
	.sub-contents-title h2 {
		font-size:16px;
		margin-top:0px;
	}
	
	.sub_top_area {
		height:130px;
		padding-top:75px;
	}
	
	.subtitle-wrap {
		padding-top:25px;
		margin-left:20px;
	}
	
	.subpos {
		font-size:12px;
	}
	
	.sub-contents-main {
		display:flex;
		flex-direction: column-reverse;
		padding:0;
	}
	
	.sub-contents-text {
		display:block;
		width:calc(100% - 40px);
	}
	
	.sub-contents-text h4 {
		font-size:28px;
		padding-bottom:0;
		letter-spacing:-2px;
	}
	
	.sub-contents-text p {
		font-size:16px;
	}
	
	.sub-contents-text p.signature {
		font-size:18px;
		padding-top:30px;
	}
	
	.sub-contents-images {
		display:block;
		width:100%;
		margin:0;
		height:75vw;
		background-position:center -30px;
		background-repeat: no-repeat;
	}
	
	.add-contents {
		padding:40px 20px 70px;
	}
	
	.add-contents ul li {
		width:calc(100% - 20px);
	}
	
	ul.lawyers li {
		display:inline-block;
		background-color:#f4f4f4;
		width:calc(50% - 5px);
		height:230px;
		margin:0 10px 20px 0;
		overflow:hidden;
	}
	
	ul.lawyers li:nth-child(2n) {
		margin-right:0;
	}
	
	ul.lawyers li .lawyer {
		filter:grayscale(0);
	}
	
	.lawyer-info {
		display:block;
		position:relative;
		padding:10px;
		left:0;
		top: 160px;
		text-align: left;
		color:#ffffff;
		opacity: 1;
		transition-duration: 0.3s;
	}
	
	.lawyer-info .lawyer-history {
		font-size:13px;
		font-weight:400;
	}
	
	.lawyer-info .lawyer-name {
		font-size:16px;
		font-weight:600;
	}
	
	.lawyer-info hr {
		margin:7px 0 12px 3px;
	}
	
	.submap {
		height:400px;
	}
	
	.contactwrap {
		padding:30px 0;
	}
	
	.contactwrap ul li {
		display:inline-block;
		width:calc(100% - 40px);
		margin:0 0 10px 0;
		padding:20px;
		vertical-align: top;
	}
	
	.contact-info .contact-title {
		font-size:18px;
		font-weight:600;
	}
	
	.contact-info hr {
		margin:10px 0;
	}
}