@charset "utf-8";

/* ---------------------------------
  _01 スタイルリセット
------------------------------------*/

html { 
	font-size: 62.5%;
	scroll-behavior: smooth;
}
body {
	margin: 0;
	padding: 0;
	line-height: 1.0;
	color: #333333;
	font-family: zen-kaku-gothic-new, sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 1.6rem;}
	

h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;}
p {
	margin: 0 0 1em 0;
	padding: 0;
	line-height: 1.6;}
img {
	border: 0;
	display: block;}

a { text-decoration: inherit; /* 必要に応じて「none」に */}
a:link { color: #603813;}
a:visited { color: inherit;}
a:hover { color: #eeb821;}

ul {
	margin: 0;
	padding: 0;
	list-style: none;}
ol {
	margin: 0;
	padding: 0;}
li {
	margin: 0;
	padding: 0;}
dl, dt, dd {
	margin: 0;
	padding: 0;}
form {
	margin: 0;
	padding: 0;}

hr { display: none;}

/* Adobe Fonts

Zen Kaku Gothic New
font-family: zen-kaku-gothic-new, sans-serif;
font-weight: 300;
font-weight: 400;
font-weight: 500;
font-weight: 700;
font-weight: 900;
font-style: normal;

ab-kirigirisu
font-family: "ab-kirigirisu", sans-serif;
font-weight: 400;
font-style: normal;
*/


/* ---------------------------------
  _02 共通クラス
------------------------------------*/
.content_title {
	padding: 3em 0;
	display: flex;
	flex-direction: column-reverse;}
.content_title .content_title_ja {
	color: #006150;
	font-size: 1.8rem;
	font-weight: 700;
	text-align: center;}
.content_title .content_title_en {
	margin-bottom: 0.25em;
	font-family: "ab-kirigirisu", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 2.7em;
	text-align: center;}
.content_title .content_title_en span { display: inline-block;}
.content_title .content_title_en span::first-letter {
	color: #33b458;}

@media screen and (max-width: 640px){

.content_title {
	padding: 2em 0;}
.content_title .content_title_en {
	letter-spacing: -0.12em;
}
}

.reserve {
	position: fixed;
	bottom: 30px;
	right: 30px;
}
.supplement { /* 補助的に入れる見出しを表示しないようにするクラス */
	position: absolute;
	left: -10000em;}
.flexbox_space-between {
	display: flex;
	justify-content: space-between;
}
.flexbox {
	display: flex;	
	justify-content: center;}

.yellow_font {
	color: #ffcc00;
}
.bold {
	font-weight: bold;
}
.text-center {
	text-align: center;
}

@media screen and (min-width: 641px){

.hide_pc { display: none;}
p.guide {
	margin-bottom: 1em;
	text-align: center;}

}
@media screen and (max-width: 640px){

.hide_sp { display: none;}
.flexbox_space-between {
	flex-direction: column;}
.flexbox {
	flex-direction: column;
}

}

section {
	padding: 0 0 3em 0;
}
section .container {
	margin: 0 auto;
	width: 1100px;}
@media screen and (max-width: 640px){

section .container {
	width: 100%;
	padding: 0 1.2em;
	box-sizing: border-box;}
	
}


.pagetop {
  opacity: 0;
  transition: opacity 0.3s ease;
  position: fixed;
  bottom: 3rem;
  right: 3rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: white;
  text-decoration: none;
  width: 6rem;
  height: 6rem;
  border: 2px solid #fff;
  background:rgba(255,255,255,0.3);
  border-radius: 100%;
  cursor: pointer;
}
.pagetop__arrow {
    height: 10px;
    width: 10px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: translateY(20%) rotate(-45deg);
}
@media screen and (max-width: 640px){
	.pagetop {
	  bottom: 2rem;
	  right: 2rem;
	}
}

/* ---------------------------------
  _01 ヘッダー
------------------------------------*/

header {
	width: 100%;
	height: 110px;
	position: sticky;
	top: 0;
	box-shadow: 0px 1px 4px 1px rgba(0,0,0,0.5);
	background-color: #fff;
	z-index: 10;}
header .container {
	margin: 0 auto;
	width: 1100px;
	height: 110px;
	display: flex;
	align-items: center;
	justify-content: space-between;}
header nav {
	display: flex;
	flex-direction: column;}
header nav ul {
	display: flex;
	justify-content: flex-end;
	font-size: 1em;
	color: #603813;}
header nav ul.gnavi li {
	padding: 0 0.75em;
	border-right: solid 2px #96c958;
	height: 24px;
	line-height: 24px;
	font-weight: 600;}
header nav ul.gnavi li:first-child {
	border-left: solid 2px #96c958;	}
header nav ul.pnavi {
	margin-bottom: 3em;
}
header nav ul.pnavi li {
    position: relative;
    padding: 0px 1.5em 0px 0.8em;
	font-size: 90%;
	font-weight: 500;
}
header nav ul.pnavi li::before {
    position: absolute;
    top: 50%;
    left: 0px;
    transform: translateY(-50%);
    width: 0px;
    height: 0px;
    border: 0.3em solid transparent;
    border-left: 0.6em solid #33b458;
    content: "";
}
header nav ul.pnavi li:last-child {
	padding-right: 0;
}
header img.logo-pc { width: 180px; }
@media screen and (max-width: 640px){

	header {
		height: 80px;}
	header .container {
		width: 100%;
		height: 80px;}
	header h1 { width: calc(100vw - 80px); }
	header div.logo { width: calc(100vw - 80px); }
	header img.logo-sp {
		margin-left: 5%;
		width: 90%; }
}



/* ---------------------------------
  _02 フッター
------------------------------------*/
footer {
	border-top: solid #006150 7px;
	font-size: 90%;
}
footer .container {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.address {
	display: flex;
	align-items: flex-start;
	line-height: 1.5;
}
.address img {
	width: 180px;
	margin-right: 2em;
}
footer ul.fmenu {
	display: flex;
	margin-bottom: 1em;
}
footer ul.fmenu li {
	transform: skewX(150deg);
	border-right: 1px solid #000;
}
footer ul.fmenu li:last-child {
	border-right: 0;
}
footer ul.fmenu li a {
	display:block;
	transform: skewX(-150deg);
	padding:0 14px;
}
footer img.banner {
	width: 240px;
	margin-left:auto;
}


@media screen and (min-width: 641px){

footer .container {
	margin: 0 auto;
	padding: 50px 0;
	width: 1100px;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;}

}
@media screen and (max-width: 640px){

	footer > .container {
		padding: 2em 1.2em;
		flex-direction: column-reverse;
		justify-content: center;
		align-items: center;}
	footer .address {
		flex-direction: column;
		align-items: center;
		text-align: center;}
	.address img {
		width: 180px;
		margin-right: 0;
		margin-bottom: 1em;
	}
	footer ul.fmenu {
		display: none;
	}
	footer img.banner {
		width: 90%;
		margin:0 auto 2em;
	}
}

footer .dhrealty {
	color: #4d4d4f;
	background-color: #fff;
	border-top: 1px solid #ccc;
	font-family: "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
footer .dhrealty li { background: none;}
footer .dhrealty a {
	color: #4d4d4f;
	text-decoration: none;}
footer .dhrealty img { vertical-align: inherit;}
footer .dhrealty ul.linkB li:nth-of-type(2) { display: none;}

@media screen and (min-width:641px){
footer .dhrealty .container {
	margin: 0 auto;
	padding: 0;
	position: relative;
	width: 1100px;
	height: 96px;
}
footer .dhrealty .logomark {
	position: absolute;
	left: 0;
	top: 0;
}
footer .dhrealty .logomark .hide_pc { display: none;}
footer .dhrealty ul {
	margin: 0;
	position: absolute;
	width: auto;
}
footer .dhrealty ul li {
	margin: 0 10px 0 0;
	padding: 0 10px 0 0;
	border-right: solid 1px #4d4d4f;
	float: left;
	height: 1em;
	line-height: 1.0;
	background-color: inherit;
	border-radius: 0;
}
footer .dhrealty ul li:last-child { border-right: none;}
footer .dhrealty ul.linkA {
	left: 128px;
	top: 24px;
}
footer .dhrealty ul.linkA li {	
	font-size: 12px !important;}
footer .dhrealty ul.linkB {
	left: 128px;
	top: 48px;}
footer .dhrealty ul.linkB li {	
	font-size: 11px !important;}
footer .dhrealty .logo {
	right: 32px;
	position: absolute;
	top: 24px;}
footer .dhrealty .dhrealtyroyal img {
	vertical-align: inherit;}
footer .dhrealty p.copy {
	margin-top: 0;
	position: absolute;
	right: 32px;
	top: 48px;
	text-align: right;
	font-size: 11px;}
}

@media screen and (max-width:640px){
	
footer .dhrealty .container {
	padding: 30px 0 0 0;
	border-top: solid 4px #fa0046;
    width: auto;
    height:  auto;
	font-size: 0.8em;
    text-align: center;
    overflow: hidden;
	flex-direction: column;
	align-items: center;
}
footer .dhrealty a {
	color: #4d4d4f !important;}
footer .dhrealty .logomark {
	position: relative;
    text-align: center;
}
footer .dhrealty .logomark img { display: inline-block; width: 70%;}
footer .dhrealty .logomark .hide_sp { display: none;}

footer .dhrealty ul.linkA { display: none;}
footer .dhrealty ul.linkB {
	margin-bottom: 1em;
}
footer .dhrealty .logo { display: none;}
footer .dhrealty p.copy {
    margin-bottom: 30px;
	font-size: 0.8em;
}

}



/* ---------------------------------
  スマホmenu
------------------------------------*/
.openbtn{
	position: relative;
	background:#006150;
	cursor: pointer;
    width: 80px;
    height: 80px;
	z-index: 1200;}
.openbtn span{
    display: inline-block;
    transition: all .4s;/*アニメーションの設定*/
    position: absolute;
    left: 23px;
    height: 4px;
	background: #fff;
  	width: 34px;}
.openbtn span:nth-of-type(1) {
	top: 15px;}
.openbtn span:nth-of-type(2) {
	top: 28px;}
.openbtn span:nth-of-type(3) {
	top: 41px;}
.openbtn span:nth-of-type(3)::after {
	content:"メニュー";/*3つ目の要素のafterにMenu表示を指定*/
	position: absolute;
	top: 8px;
	left: -23px;
	width: 80px;
	color: #fff;
	font-size: 1.2rem;
	font-weight: 600;
	text-align: center;}
/*activeクラスが付与されると線が回転して×に*/
.openbtn.active span:nth-of-type(1) {
    top: 26px;
    left: 25px;
    transform: translateY(6px) rotate(-45deg);
    width: 30%;}
.openbtn.active span:nth-of-type(2) {
	opacity: 0;/*真ん中の線は透過*/}
.openbtn.active span:nth-of-type(3){
    top: 38px;
    left: 25px;
    transform: translateY(-6px) rotate(45deg);
    width: 30%;}
.openbtn.active span:nth-of-type(3)::after {
	content:"閉じる";/*3つ目の要素のafterにClose表示を指定*/
    transform: translateY(0) rotate(-45deg);
	top: 10px;
	left: -9px;
}


@media screen and (max-width: 640px){
	.sitemap {
		/*margin-right: -100vw;*/
		margin-right: -100vw;
		/*margin-top: 100px;*/
		padding-top: 120px;
		position:fixed;
		top: 0;
		right: 0;
		/*width: 100vw;*/
		width: 100vw;
		height: 100vh;
		background-color: rgba(255,255,255,0.9);
		z-index: 8;
		overflow: scroll;
		
		color: #333333;
		font-family: "dnp-shuei-nmincho-std", sans-serif;
		font-weight: 400;
		font-style: normal;
	}
	.sitemap a {
		color: inherit!important;
	}
	.sitemap .sitemap_inner {
		margin: 0 auto;
		width:85%;
		padding: 20px 0;
	}
	.sitemap ul.gmenu {
		border-bottom: 1px solid #333;
		margin-bottom: 1.5em;
	}
	.sitemap ul.gmenu li{
		text-align: center;
		margin-bottom: 1.5em;
		font-size: 1.2em;
	}
	.sitemap ul.pmenu li{
		text-align: center;
		margin-bottom: 1.5em;
		font-size: 1em;
	}
	.sitemap ul.pmenu li a.btn_yoyaku {
		width: fit-content;
		margin: 0 auto;
		color: #330000;
		background-color: #eeb821;
		border-radius: 100vh;
		transition: 0.3s;
		text-decoration: none;
		cursor: pointer;
		display: block;
		background-image: url("../images/common/icon_yoyaku.png");
		background-position: left 16px center;
		background-repeat: no-repeat;
		padding: 8px 20px 8px 44px;
	}
	.sitemap ul.pmenu li a.btn_yoyaku:hover {
		text-decoration: none;
		background-color: #fbd876;
	}
	.sitemap ul.pmenu li.insta {
		display: flex;
		justify-content: center;
	}
	
	
}

/* ボタン */
a.btn {
	display: flex;
	justify-content: center;
	align-items: center;
	background: #fff;
	border-radius: 50vh;
	border: 1px solid #006150;
	box-sizing: border-box;
	width: fit-content;
	max-width: 100%;
	height: 35px;
	padding: 0 12% 0 12%;
	color: #006150;
	font-family: "dnp-shuei-nmincho-std", sans-serif;
	font-size: 0.9em;
	font-weight: 600;
	font-style: normal;
	text-align: left;
	text-decoration: none;
	position: relative;
	transition-duration: 0.2s;
}
a.btn:hover {
	background: #d7f4ee;
}
a.btn::after {
    transform: rotate(45deg);
    width: 6px;
    height: 6px;
    border-top: 2px solid #006150;
    border-right: 2px solid #006150;
    content: '';
	position: absolute;
	top: 50%;
	right: 8%;
	margin-top: -4px;
}
a.btn-center {
	margin: 0 auto;
}
@media screen and (max-width: 640px){
	a.btn {
		width: auto;
	}
}


a.btn2 {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #eeeeee;
  box-sizing: border-box;
  border-radius: 1em;
  width: fit-content;
  height: 2em;
  padding: 0 6% 0 3%;
  font-size: 0.9em;
  text-align: left;
  text-decoration: none;
  position: relative;
  transition-duration: 0.2s;
}
a.btn2:before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 5px 0 5px 8px;
  border-color: transparent transparent transparent #333333;
  position: absolute;
  top: 50%;
  right: 6%;
  margin-top: -5px;
}

/* ---------------------------------
  _ for print
------------------------------------*/

@media print {

.hide_pc { display: none;}

}

/* ---------------------------------
  _ clearfix
------------------------------------*/

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {
	display: inline-block;
}

/* Hides from IE-mac \*/
* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}
/* End hide from IE-mac */