@charset "UTF-8";


.mv {
	position: relative;
}
.mv img.mv-msg {
    max-width: 1180px;
    width: 60%;
    position: absolute;
    left: 50%;
    top: 10%;
    transform: translate(-50%, 0);
}
.mv.blog-mv {
	
}


.sv {
	padding: 32px 0;
    background: #00634d;
}

@media screen and (max-width: 768px) {
	.mv .mv-inner {
		padding: 0;
	}
}



/* 見出し
 * ************************************************ */

.sec-title {
	
}


.block-title {
	overflow: hidden;
	background: #FFF;
	text-align: left;
	padding-left: 78px;
	margin: 0 0 18px 0;
	border-radius: 12px;
	position: relative;
}
.block-title span {
	display: block;
    line-height: 1.2;
    padding: 18px 12px 18px 12px;
}
.block-title:before {
	content: "";
	position: absolute;
	left: 0;
	background: #00634d;
	width: 78px;
	height: 100%;
}
.block-title:after {
	content: "";
	position: absolute;
	left: 18px;
	top: 50%;
	transform: translateY(-50%);
	background: url(../images/icon/clover-FFF.svg) no-repeat;
	background-size: 100%;
	width: 42px;
	height: 42px;
}
.block-subtitle {
	
}


/* ジャンプ 
 * ************************************************ */

.jump {
	
}
.jump ul.jump-items {
	display: grid;
    grid-template-columns: repeat(4, 1fr);
	gap: 12px;
}
.jump ul.jump-items li {
	text-align: center;
}
.jump ul.jump-items li a {
	display: block;
    width: 100%;
    background: #00634d;
    color: #FFF;
    border-radius: 12px;
    padding: 28px 12px;
}


/* 中のブロック
 * ************************************************ */

.block-items:not(:first-child) {
	margin-top: 60px;
}
.inbox {
	padding-left: 30px;
	
}
.inbox .inbox-in {
	margin-top: 30px;
}
.inbox .inbox-in .inbox-in-title {
	font-size: 1.2em;
	line-height: 1.4;
	margin-bottom: 18px;
}
.inbox .inbox-in .inbox-in-title:before {
	content: "●";
	margin-right: 6px;
}


/* テキスト
 * ************************************************ */

.small {
	font-size: .8em;
}


/* バナー
 * ************************************************ */

.banner {
	padding: 30px 0;
	text-align: center;
	line-height: 1;
}
.banner a.banner-real-estate {
	display: inline-block;
	max-width: 860px;
	width: 860px;
}
.banner a.banner-real-estate img {
	border-radius: 12px;
}






/* トップページ
 * ************************************************ */

/* 冒頭のあいさつ */
.greeting {
	
}
.greeting .sec-title img.logo-yoko {
	    display: block;
    margin-top: 6px;
}
.greeting .greeting-outline {
	
}
.greeting .greeting-outline img.photo {
	width: 30%;
	max-width: 300px;
	float: left;
	    margin: 0 36px 18px 0;
	border-radius: 12px;
}
.greeting .greeting-outline .greeting-text {
	
}
.greeting .greeting-about {
	margin-top: 30px;
    padding: 18px;
    border-top: 1px solid #DCD7C5;
    border-bottom: 1px solid #DCD7C5;
}
.greeting .greeting-news {
	margin-top: 30px;
	position: relative;
}
.greeting .greeting-news .greeting-news-title {
	text-align: left;
	font-size: 1.2em;
	margin-left: 14px;
	margin-bottom: 12px;
}
.greeting .greeting-news .greeting-news-past {
	position: absolute;
    right: 0;
    top: 0;
    font-size: .8em;
}
.greeting .greeting-news .greeting-news-past span {
	display: inline-block;
	padding-left: 18px;
	color: #8ba17e;
	position: relative;
}
.greeting .greeting-news .greeting-news-past span:before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	background: url(../images/icon/enpitsu.svg) no-repeat;
	background-size: 100%;
	width: 14px;
	height: 14px;
}
.greeting .greeting-news ul.news-list {
	border-top: 1px solid #DCD7C5;
}
.greeting .greeting-news ul.news-list li {
	border-bottom: 1px solid #DCD7C5;
}
.greeting .greeting-news ul.news-list li:not(:first-child) {
	
}
.greeting .greeting-news ul.news-list li a.news-post {
	display: flex;
	align-items: center;
	padding: 12px 18px;
	line-height: 1.4;
}
.greeting .greeting-news ul.news-list li time {
	min-width: 100px;
	font-family: "SN Pro", sans-serif;
	margin-right: 12px;
}
.greeting .greeting-news ul.news-list li span.new {
	display: inline-block;
	min-width: 35px;
    font-size: 10px;
    font-family: "SN Pro", sans-serif;
    background: #cf6541;
	color: #FFF;
	text-align: center;
    padding: 4px 6px;
	margin-right: 12px;
    border-radius: 4px;
}



/* 取扱業務 */
.service {
	
}
.service .service-items {
	
}
.service .service-item {
	display: flex;
	overflow: hidden;
	border-radius: 12px;
}
.service .service-item:not(:first-child) {
	margin-top: 18px;
}
.service .service-item img {
	display: block;
	max-width: 300px;
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
}
.service .service-item .service-text {
	max-width: 542px;
	background: #FFF;
	padding: 38px;
}



/* 選ばれる理由 */
.reasons {
	
}
.reasons .reasons-items {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 32px 22px;
}
.reasons .reasons-items > *:last-child {
	grid-column: 1 / -1;
	background: #8ba17e;
	padding: 18px 30px 18px 110px;
	color: #FFF;
	border-radius: 12px;
}
.reasons .reasons-item {
	position: relative;
}
.reasons .reasons-item img.reasons-number {
	position: absolute;
    width: 48px;
    height: auto;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
}
.reasons .reasons-item img.photo {
	border-radius: 12px;
}
.reasons .reasons-item .reasons-item-text {
	margin-top: 18px;
}
.reasons .reasons-item .reasons-item-title {
text-align: center;
	    margin-bottom: 12px;
}
.reasons .reasons-promise {
	position: relative;
}
.reasons .reasons-promise img.reasons-promise-hato {
	position: absolute;
	width: 80px;
	left: 18px;
	top: -10px;
}



/* 手続きの流れ */
.flow .flow-items {
	
}
.flow .flow-item {
	    background: #FFF;
    border-radius: 12px;
    padding: 30px;
}
.flow .flow-item:not(:first-child) {
	margin-top: 18px;
}
.flow .flow-item-flex {
	display: flex;
}
.flow .flow-item-flex .flow-item-flex___title {
	    max-width: 220px;
    width: 30%;
}
.flow .flow-item-flex .flow-item-flex___text {
max-width: 565px;
    width: 72%;
    padding-left: 30px;
}
.flow .flow-item-title {
	
}
.flow .flow-item-title span {
	display: block;
	font-family: "SN Pro", sans-serif;
	font-size: .7em;
}





/* 相続・遺言の民法解説 */
.articles {

}
.articles .articles-summary {
	margin-bottom: 30px;
}
.articles-items {
	columns: 2;
	column-gap: 22px;
}
#archive .articles-items {
	columns: unset;
}
.articles-categories {
    display: inline-block;
    width: 100%;
    margin-bottom: 32px;
    break-inside: avoid;
    background: #FFF;
    padding: 30px;
    border-radius: 12px;
}
.articles-categories .articles-categories-title {
	font-size: 1.1em;
	margin-bottom: 12px;
}
.articles-categories .articles-categories-description {
	font-size: .8em;
    margin-bottom: 12px;
}

.articles-categories ul.articles-posts {
	    border-top: 1px solid #ededed;
}
.articles-categories ul.articles-posts li {
	    border-bottom: 1px solid #ededed;
}
.articles-categories ul.articles-posts li a.articles-post {
	display: flex;
    align-items: center;
padding: 12px 0;
    line-height: 1.4;
}
.articles-categories ul.articles-posts li a.articles-post time {
	min-width: 63px;
	font-family: "SN Pro", sans-serif;
    font-size: 12px;
	margin-right: 6px;
}
.articles-categories ul.articles-posts li a.articles-post span.new {
	display: inline-block;
    min-width: 40px;
    font-size: 10px;
    font-family: "SN Pro", sans-serif;
    background: #cf6541;
    color: #FFF;
	text-align: center;
    padding: 4px 6px;
    margin-right: 9px;
    border-radius: 4px;
}
.articles-categories ul.articles-posts li a.articles-post span {
	font-size: .9em;
}


.articles .caution {
	margin-top: 30px;
	padding-top: 30px;
	border-top: 1px solid #DCD7C5;
}



/* はじめての方へ
 * ************************************************ */

#first-guide {
	
}
#first-guide .first-guide-msg {
	margin-bottom: 60px;
}
#first-guide .first-guide-msg ul.first-guide-msg-problem {
	margin-bottom: 30px;
}
#first-guide .first-guide-msg ul.first-guide-msg-problem li {
	padding-left: 32px;
	font-size: 1.1em;
	font-weight: 500;
	position: relative;
}
#first-guide .first-guide-msg ul.first-guide-msg-problem li:before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	background: url(../images/icon/check.svg) no-repeat;
	background-size: 100%;
	width: 18px;
	height: 18px;
}
#first-guide .first-guide-msg ul.first-guide-msg-problem li:not(:first-child) {
	margin-top: 9px;
}
#first-guide .first-guide-msg img.msg {
float: right;
    border-radius: 12px;
    max-width: 300px;
    margin: 0 0 18px 32px;
}







/* 選ばれる理由
 * ************************************************ */

#reasons {
	
}
#reasons .reasons-items {
	
}
#reasons .reasons-item {
	overflow: hidden;
    background: #FFF;
	border-radius: 12px;
}
#reasons .reasons-item:not(:first-child) {
	margin-top: 30px;
}
#reasons .reasons-item img.reasons-number {
	position: absolute;
	z-index: -1;
}
#reasons .reasons-item img.photo {
	float: left;
	max-width: 380px;
	display: block;
	border-radius: 0 0 12px;
	margin: 0 38px 18px 0;
}
#reasons .reasons-item .reasons-item-title {
	margin-bottom: 12px;
}
#reasons .reasons-item .reasons-item-title span.reason {
	display: inline-block;
    background: #00634d;
    color: #FFF;
    padding: 3px 12px;
    border-radius: 4px;
    font-size: .6em;
}
#reasons .reasons-item .reasons-item-title span.reason-title {
	display: block;
	margin-top: 3px;
}
#reasons .reasons-item .reasons-item-text {
	padding: 30px;
}






/* 業務料金
 * ************************************************ */

#fee .fee-frame {
	position: relative;
    padding: 30px;
    margin-bottom: 30px;
    background: #FFF;
    border-radius: 12px;
}
#fee .fee-frame img.fee-frame-illustration {
	width: 420px;
    margin: -52px auto 0;
}


#fee .fee-block {
	
}
#fee .fee-block:not(:first-child) {
	margin-top: 60px;
}
#fee .price-box {
}
#fee span.price {
	display: inline-block;
	font-family: "Outfit", sans-serif;
    font-weight: 500;
	font-size: 1.8em;
}
#fee span.yen {
	display: inline-block;
	font-size: .8em;
}
#fee .price-box ul.price-list {
	list-style: disc;
    margin: 0 0 0 1.6em;
    padding: 0;
}
#fee .price-box ul.price-list li {
	
}
#fee .price-box table,
#fee .price-box table tr,
#fee .price-box table th,
#fee .price-box table td {
	border: 1px solid #8ba17e;
	text-align: center;
}
#fee .price-box table {
	overflow: hidden;
	width: 100%;
	margin-bottom: 18px;
	border-radius: 12px;
}
#fee .price-box table th,
#fee .price-box table td {
	padding: 12px;
	font-weight: normal;
	line-height: 1.2;
}
#fee .price-box table th {
	background: #FFF;
}
#fee .price-box table td {
	background: #F9F8F5;
}
#fee .price-box .example {
	background: #F9F8F5;
    padding: 30px;
	margin-bottom: 18px;
    border-radius: 12px;
	position: relative;
}
#fee .price-box .example:before {
	content: "";
	position: absolute;
	    left: 30px;
    top: -18px;
	background: url(../images/fee/example.svg) no-repeat;
	background-size: 100%;
	width: 42px;
	height: 42px;
}


#fee ol.number-list {
	list-style: auto;
    margin: 0 0 0 1.6em;
	padding: 0;
}
#fee ol.number-list li:not(:first-child) {
	margin-top: 3px;
}

#fee .fee-request {
	background: #F9F8F5;
	padding: 30px;
	border-radius: 12px;
}



/* 相談の流れ
 * ************************************************ */

#flow .flow-items {
	
}
#flow .flow-item {
	background: none;
	padding: 0;
	position: relative;
}
#flow .flow-item:not(:first-child) {
	margin-top: 30px;
}
#flow .flow-item .flow-item-frame {
	margin-right: -60px;
}
#flow .flow-item .flow-item-frame .flow-item-frame-title {
	display: flex;
    align-items: center;
	margin-bottom: 18px;
}
#flow .flow-item .flow-item-frame .flow-item-frame-title span {
	display: inline-block;
    background: #00634d;
    color: #FFF;
    padding: 3px 12px;
	margin-right: 12px;
    border-radius: 4px;
    font-size: .6em;
}
#flow .flow-item .flow-item-frame .flow-item-frame-text {
width: 67%;
    max-width: 620px;
    padding: 30px 90px 30px 30px;
    background: #FFF;
    border-radius: 12px;
}
#flow .flow-item img.step {
	    display: block;
    border-radius: 12px;
    position: absolute;
    right: 0;
    top: 0;
    width: 36%;
    max-width: 291px;
}







/* よくある質問
 * ************************************************ */

#faq .faq-summary {
	margin-bottom: 30px;
}
#faq .faq-block:not(:first-child) {
	margin-top: 60px;
}
#faq .faq-item-title {
	
}
#faq ul.block-item-list {
	padding-left: 30px;
}
#faq ul.block-item-list li:not(:first-child) {
	
}
#faq ul.block-item-list li .faq-item-title {
	font-size: 1.2em;
    margin: 0;
	padding: 18px 0 18px 40px;
	transition: all .3s ease;
	cursor: pointer;
	position: relative;
}
#faq ul.block-item-list li .faq-item-title:hover {
	opacity: .7;
}
#faq ul.block-item-list li .faq-item-title.close {
	
}
#faq ul.block-item-list li .faq-item-title span.markQ {
	position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 30px;
    font-weight: 400;
    font-family: "SN Pro", sans-serif;
    color: #FFF;
    background: #8ba17e;
}
#faq ul.block-item-list li .faq-item-title span.markQ-title {
	
}
#faq ul.block-item-list li .box {
	display: none;
	background: #FFF;
    padding: 30px 30px 30px 70px;
	margin-bottom: 30px;
    border-radius: 12px;
	position: relative;
}
#faq ul.block-item-list li .box span.markA {
	position: absolute;
	left: 30px;
	top: 30px;
	font-weight: 400;
	font-family: "SN Pro", sans-serif;
	width: 30px;
    height: 30px;
	line-height: 28px;
    text-align: center;
    border-radius: 30px;
	color: #8ba17e;
	border: 1px solid #8ba17e;
}
#faq ul.block-item-list li .box a {
	display: inline-block;
	text-decoration: underline;
}
#faq p.tojump {
	margin: 30px 0 0 0;
	text-align: right;
}
#faq p.tojump a.button-tojump {
	display: inline-block;
	font-size: .8em;
}



/* 事務所概要
 * ************************************************ */

#office .office-about {
	
}
#office .office-about table,
#office .office-about table tr,
#office .office-about table th,
#office .office-about table td {
	border: 1px solid #8ba17e;
	text-align: center;
}
#office .office-about table {
	overflow: hidden;
	width: 100%;
	margin-bottom: 18px;
	border-radius: 12px;
}
#office .office-about table th,
#office .office-about table td {
	padding: 22px 18px;
	font-weight: normal;
	line-height: 1.6;
}
#office .office-about table th {
	width: 30%;
    max-width: 240px;
	background: #FFF;
}
#office .office-about table td {
	width: 70%;
	max-width: 588px;
	background: #F9F8F5;
	text-align: left;
}
#office .office-about table td.office-hour span {
	display: inline-block;
	margin-left: 6px;
	font-weight: 500;
}
#office .office-about table td.office-info span {
display: inline-block;
}
#office .office-about table td.office-service ul {
	    list-style: disc;
    margin: 0 0 0 1em;
	padding: 0;
}
#office .office-about table td.office-service ul li {
	
}
#office .office-about table td a {
	display: inline-block;
	text-decoration: underline;
}

#office .office-map {
	
}
#office .office-map .office-map-grid {
	overflow: hidden;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	border-radius: 12px;
}



/* アクセスマップ
 * ************************************************ */

#access img.map-wide {
	display: block;
	border-radius: 12px;
}
#access .access-add {
	text-align: center;
}
#access .access-add p.access-add-sta {
	margin-bottom: 12px;
}
#access .access-add p.access-add-sta span {
	display: inline-block;
	padding: 6px 18px;
	margin-left: 12px;
	background: #cf6541;
	color: #FFF;
	border-radius: 5px;
}

#access .access-route-item {
	display: flex;
	align-items: center;
}
#access .access-route-item:not(:first-child) {
	margin-top: 30px;
}
#access .access-route-item img.route {
	display: block;
	max-width: 420px;
	border-radius: 12px;
}
#access .access-route-item .access-route-item-text {
	max-width: 400px;
	width: 51%;
	padding-left: 30px;
}
#access .access-route-item .access-route-item-text .access-route-item-title {
	margin-bottom: 12px;
	font-size: 1.4em;
	position: relative;
}
#access .access-route-item .access-route-item-text .access-route-item-title span {
	    position: absolute;
    left: -49px;
    background: #00634d;
    color: #FFF;
    width: 38px;
    height: 38px;
    line-height: 38px;
    border-radius: 30px;
    font-family: "SN Pro", sans-serif;
    font-size: .7em;
    text-align: center;
}



/* 司法書士紹介
 * ************************************************ */

#judicial-scrivener .judicial-scrivener-greeting {
	
}
#judicial-scrivener .judicial-scrivener-greeting img.photo {
	    width: 30%;
    max-width: 300px;
    float: left;
    margin: 0 36px 18px 0;
    border-radius: 12px;
}
#judicial-scrivener .judicial-scrivener-greeting .judicial-scrivener-greeting-text {
	
}

#judicial-scrivener .judicial-scrivener-profile {
	
}
#judicial-scrivener .judicial-scrivener-profile ul.qualification-list {
	display: grid;
    grid-template-columns: repeat(3, 1fr);
}
#judicial-scrivener .judicial-scrivener-profile ul.qualification-list li {
	list-style: disc;
	margin: 0 0 0 1em;
	padding: 0;
}
#judicial-scrivener .judicial-scrivener-profile dl:not(:first-child) {
	margin-top: 30px;
}
#judicial-scrivener .judicial-scrivener-profile dl dt {
	font-weight: 500;
}
#judicial-scrivener .judicial-scrivener-profile dl dt span {
	display: inline-block;
	background: #E6E2D5;
	padding: 3px 12px;
	border-radius: 4px;
}
#judicial-scrivener .judicial-scrivener-profile dl dd {
	padding-left: 18px;
	margin-top: 12px;
}

#judicial-scrivener .judicial-scrivener-about {
	background: #E6E2D5;
	padding: 30px;
	border-radius: 12px;
}
#judicial-scrivener .judicial-scrivener-about .judicial-scrivener-about-inbox:not(:first-child) {
	margin-top: 30px;
}
#judicial-scrivener .judicial-scrivener-about .judicial-scrivener-about-inbox .about-inbox-title {
	font-size: 1.1em;
	margin-bottom: 12px;
}





