@charset "utf-8";

/* 全体の設定 */
html{
	overflow-x: hidden;
}

body {
	background-color: white;
	margin: 0;
	padding: 0;
	font-family: 'HG丸ｺﾞｼｯｸM-PRO','HG丸ｺﾞｼｯｸM-PRO', sans-serif;
	letter-spacing:0.05em;
	overflow-x: hidden;
}

body footer {
	margin-top: 200px;
	padding-top: 5px;
}

img {
    -webkit-user-drag: none;  /* Chrome, Safari */
    user-drag: none;           /* 標準 */
    user-select: none;         /* 画像選択禁止 */
    -webkit-user-select: none; /* Safari用 */
}

div, section,iframe {
	max-width: 100%;
	box-sizing: border-box;
}

nav, video {
	margin: 0;
	padding: 0;
	display: block;
}

label img{
	display: block;
	width: 100%;
	height:auto;
	cursor: pointer;
}

a {
	text-decoration: none;
	touch-action: manipulation; /* または pan-y */
}

a:link,
a:visited{
	color: inherit;
}

input:focus{
	outline: none;
}

textarea{
	outline: none;
}

table{
	border-collapse: collapse;
}

th,td {
	border: 2px solid #ccc;
	padding: 10px;
}

.row-Rght_edge-And-Left_edge {
	padding: 0 1%;
}

.space_right_left{
	padding:0 5vw;
}

/* ダウンロードボタン */
.download-button{
	text-align: center;
}

.download-button a{
	display: inline-block;
	padding: 10px 20px;
	background-color: rgb(12, 47, 79);
	color: white !important;
	text-decoration: none;
	border-radius: 5px;
	font-weight: bold;
	transition: background-color 0.3s;
}

.athome-button{
	text-align: center;
}

.athome-button a{
	display: inline-block;
	padding: 10px 20px;
	background-color: red;
	color: white !important;
	text-decoration: none;
	border-radius: 5px;
	font-weight: bold;
	transition: background-color 0.3s;
}

/* ダウンロードやアットホームリンク先がなかった場合ボタンを非表示 */
.download-button a[href=""],
.athome-button a[href=""] {
    display: none;
}

/* ダウンロードやアットホームリンク先がなかった場合売り物件のテーブル行を非表示 */
.realestate-table tr:has(a[href=""]),.parking-info tr:has(a[href=""]){
    display: none;
}

/* フッター */
footer {
	background-color:rgb(12, 47, 79);
	color: white;
}

.footer-information{
	font-size: 12px;
	text-align: center;
}

footer h2{
	color: white;
}

.footer-menu {
	display: flex;
	justify-content: center;
	gap: 5%;
}

.footer-menu-name{
	text-align: center;
	padding-bottom: 0px;
	margin-bottom: 0px;
}

.footer-menu ul {
	padding: 0;
}

.footer-menu ul li {
	margin-left: 21px;
	padding-bottom: 5px;
}

.footer-menu ul,.footer-menu ul li{
	font-size: 20px;
}

/* Googleマップ */
.footer-map{
	text-align: center;
}

/* コンテナの幅指定なし、空きは左右均等 */

/* 見出し */
h1, h2, h3, h4, h5, h6 {
	font-family: 'HG丸ｺﾞｼｯｸM-PRO','HG丸ｺﾞｼｯｸM-PRO', sans-serif;
	font-weight: normal;
	color:#222;
	line-height: 1.1;
}

h1 {
	font-size: 34px;
	text-shadow: 1px 1px 5px #666b70;
	letter-spacing: 15px;
	margin-top: 40px;
	margin-bottom: 20px;
	text-align: center;
}
h2 {
	font-size: 26px;
	font-weight: bold;
}

/* 本文 */
p {
	line-height: 1.7;
	margin: 0;
}

/* inputのセキュリティ設定 */
input[type="number"]::-webkit-outer-spin-button, 
input[type="number"]::-webkit-inner-spin-button { 
	-webkit-appearance: none; 
	margin: 0; 
} 

input[type="number"] { 
  -moz-appearance:textfield; 
} 

/* 写真 */
.photo{
	overflow: auto;
}

/* ヘッダー */
.header-row {
	display: flex;
	justify-content:space-between;
}


.header-right {
	text-align: right;
	float:right;
}

.header-image {
	display: block;
	width: 100%;
	float: none;
}

.telephone {
	margin: 12.5px;
	width: 50%;
}

.sns-logo {
	width: 40px;
	margin: 12.5px;
}

/* キャプション */
.caption{
	font-size:30px;
}
/* 会社概要テーブル */
.company-info {
	border: 2px solid #ccc;
	border-collapse: collapse;
	margin:auto;
}

.company-info th {
	background-color:#ffd700;
}

.company-info td{
	background-color:#fff;
	padding-left: 5px;
	line-height: 1.3;
}

.goodslist{
	margin: auto;
}

.greeting-back{
	background-color:rgb(12, 47, 79);
}

.greeting-back h1{
	color: white;
	padding-left: 10px;
	padding-top: 10px;
}

.greeting{
	margin: auto;
	width: 65%;
	background-color: white;
	padding: 20px;
}

.greeting p{
	line-height: 2.5;
	font-size: clamp(14px, 1.5vw, 23px);
}

.name_sign{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	background-color: white;
}

.name_sign img{
	padding-left: 10px;
	padding-right: 10%;
}

.motto{
	font-size: clamp(18px, 3vw, 48px) !important;
}
/* グローバルメニュー */

.nav-list {
	text-align: center;
	padding-left: 0px;
}

.nav-item {
	display: inline-block;
	position: relative;
	background-color: white;
}

.nav-item:hover .main-title,
.nav-item-under:hover .main-title-under{
	border-bottom: 2px solid rgb(12, 47, 79);/* border-bottomのpxは「.main-title」のものと同じにするように */
	display: inline-block;
}
	/*ホバー青線両端〇 */
.nav-item:hover .main-title::before,
.nav-item:hover .main-title::after,
.nav-item-under:hover .main-title-under::before,
.nav-item-under:hover .main-title-under::after{
	content:"";
	position:absolute;
	bottom: 0;
	width: 4px;
	height: 4px;
	background-color: white;
	border: 2px solid rgb(12, 47, 79);
	border-radius: 50%;
	transform: translateX(-2.5px) translateY(50%); /* 線の中心に揃える */
}

.nav-list ul{
	display: none;
	position: absolute;
	top: 100%; /* 親の真下に表示 */
	left: 0;
	z-index: 10;
	background-color: white;
	padding: 0;
	margin: 0;
	list-style: none;
}

.nav-list li:hover ul {
	display: block;
	list-style-type: none;
}

.nav-image{
	width: auto;
	height: 35px;
}
.nav-item-under{
	background-color: white;
}
/* グローバルメニューアイコン上下カッコと文字 */
.frame-box {
	position: relative;
	padding: 15px 10px;
	text-align: center;
	width: 15vw;
}

.frame-deco {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

.frame-deco .line {
	position: absolute;
	left: 20px;
	right: 20px;
	height: 0;
	border-top: 2px solid rgb(172, 168, 168);
}
.frame-deco .line.top {
	top: 0;
}
.frame-deco .line.bottom {
	bottom: 0;
}

.frame-deco .corner {
	position: absolute;
	width: 20px;
	height: 20px;
}

.frame-deco .top-left {
	top: 0;
	left: 0;
	border-top: 2px solid rgb(172, 168, 168);
	border-left: 2px solid rgb(172, 168, 168);
}

.frame-deco .top-right {
	top: 0;
	right: 0;
	border-top: 2px solid rgb(172, 168, 168);
	border-right: 2px solid rgb(172, 168, 168);
}

.frame-deco .bottom-left {
	bottom: 0;
	left: 0;
	border-bottom: 2px solid rgb(172, 168, 168);
	border-left: 2px solid rgb(172, 168, 168);
}

.frame-deco .bottom-right {
	bottom: 0;
	right: 0;
	border-bottom: 2px solid rgb(172, 168, 168);
	border-right: 2px solid rgb(172, 168, 168);
}

.main-title ,.main-title-under{
	font-size: 1.8vw;
	margin-bottom: 10px;
	color: #000;
	font-family: "MS Mincho";
	border-bottom: 2px solid transparent;/* border-bottomのpxは「.nav-item:hover .main-title」のものと同じにするように */
	padding-bottom: 4px;
	position: relative;
	display: inline-block;
}
.sub-title,.sub-title-under {
	font-size: 1.1vw;
	letter-spacing: 2px;
	color: #333;
}

/* ハンバーガーメニュー */
#menu {
	display: none;
}

#menu ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

#menu li {
	padding: 5px 10px;
}

#menu a {
	text-decoration: none;
	display: block;
}

#menu .submenu {
	display: none;
	margin-left: 15px;
	padding: 5px;
}

#menu .open > .submenu {
	display: block;
}

.hamburger-button{
	text-align: right;
}

.hamburger-button button{
	cursor: pointer;
}

.hamburger-button li{
	text-align: left;
}

/* ハンバーガーメニュー横線 */
.hamburger-button span{
	display: block;
	width: 30px;
	height: 4px;
	background-color: #333;
	margin: 5px 0;
	border-radius: 2px;
	transition: all 0.3s ease;
}

.hamburger-button-text{
	font-style:italic;
}

.hamburger-gloval-nav {
	display: none;
	position: absolute;
	right: 0;
	background: white;
	width: 250px;
	padding: 20px;
	text-align: left;
	z-index: 1000;
}

.hamburger-nav-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.hamburger-nav-list li {
	padding: 10px 0;
	border-bottom: 1px solid #eee;
	text-align: left;
}

.hamburger-telephone {
	width: 80%;
	padding: 5px;
}

.hamburger-sns{
	display: flex;
}

/* トップページ動画 */
.topmovie {
	width:80%;
	height:auto;
	margin: auto;
}

/* トップ画像 */
.topimage-worry{
	text-align: center;
	margin-top: 10vw;
}
.topimage-worry img{
	width: 100%;
}

.topimage-assesment{
	text-align: center;
}

.topimage-assesment img{
	width: 100%;
}

.topmap iframe{
	border:0;
	width: 50%;
}

.top-pickup-realestate {
	background: linear-gradient(to right,white 0%,pink 20%,pink 80%,white 100%);
	margin-top: 10vw;
}

.top-realestate-row{
	display: flex;
	flex-wrap: wrap;
	gap:10px;
	width: 820px;
}

.top-realestate-row .table-wrapper table{
	width: 100%;
}

.top-realestate-kind {
	text-align: center;
	display: block;
}

.top-realestate-kind >h2{
	background-color: white;
	border: 2px solid #ccc;
	display: inline-block;
	margin: 7px;
	padding:5px;
}

.top-realestate-row > div{
	text-align: left;
}

.top-realestate-table{
	margin-bottom: 20px;
}

.top-realestate-table tr,
.top-realestate-table th{
	background-color: white;;
}

.table-container.top-realestate-place{
	justify-content: center;
}

/* お知らせ一覧ページ */
.top-new-information{
	margin-top: 10vw;
}

.top-new-information table{
	margin:0 auto;
}

.top-new-information table,
.top-new-information table th,
.top-new-information table td {
	border: none;
	padding:0;
}

.top-new-information table{
	width: 60%;
}

.top-new-information img{
    width: 60%;
    display: block;
	margin: 0 auto;
}

.top-new-information iframe{
	height: 170px;
	width: 100%;
}

.top-new-information table td{
	text-align: center;
}

.top-info-list{
	display: block;
	margin:0 auto;
	width:60%;
	background-color: rgb(12, 47, 79);
	padding:5px 0;
	color:white;
}

.news-table{
	margin:0 auto;
	margin-top: 3vw;
}

.news-table tr th,.news-table tr td{
	text-align: left;
	line-height: 1.7;
	
}

.news-table tr td{
	border-top: none;
	padding-top: 0px;
}

.news-table tr th{
	border-bottom: none;
	padding-bottom: 0px;
}

.news-table a{
	color: blue;
}

/* スワイプ */
.swipe-group {
	width: 100%;
	overflow: hidden;
	position: relative;
}

.table-container {
	display: flex;
	transition: transform 0.3s ease; /* JavaScriptでtransformが設定される */
}

.table-wrapper {
	flex-shrink: 0;
	box-sizing: border-box;
	width: var(--slide-width); /* 幅をCSS変数で管理 */
}

.indicator {
	text-align: center;
	margin-top: 10px;
}

.dot {
	display: inline-block;
	width: 10px;
	height: 10px;
	margin: 5px;
	border-radius: 50%;
	background: #ccc;
	cursor: pointer;
}

.dot.active {
	background: #333;
}

:root {                    	 /* :rootはhtml全体を指す。 */
	--slide-width: 100%;     /* カスタムプロパティ。スマホ画面（600pxより狭い場合）の想定幅。JavaScriptで引っ張りやすくするため */
	--swipe-threshold: 50px; /* この長さだけ指をスライドさせると次の要素に移動 */
}

/* 画像重ねる */
.image-back{
	position: relative;
}

.image-ahead{
	position: absolute;
	bottom: 0%;
	width:10%;
}

/* タブ切り替え表示 */

.tab-wrap {
    display: flex;
    flex-wrap: wrap;
	text-align: center;
	justify-content: center;
}
.tab-label {
    order: -1;
	display: inline-block;
	width: 36vw;
}

.tab-label-left{
	padding-right: 0.5vw;
}

.tab-label-right{
	padding-left: 0.5vw;
}

.tab-content {
    width: 100%;
    display: none;
}


/* アクティブなタブ */
.tab-switch:checked+.tab-label+.tab-content {
    display: block;
}

/* ラジオボタン非表示 */
.tab-switch {
    display: none;
}

/* 査定お問い合わせタブ切り替え */
.tab-switch-realestate {
    display: none;
}

.tab-wrap-realestate {
    display: flex;
    flex-wrap: wrap;
	text-align: center;
	justify-content: center;
}
.tab-content-realestate {
    width: 100%;
    display: none;
}

.tab-label-realestate {
	order: -1;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: bolder;
	width: 300px;
	background-color: aqua;
	height: 30px;
	border:solid 1px white;
}

.tab-switch-realestate:checked+.tab-label-realestate+.tab-content-realestate {
    display: block;
}

.tab-switch-realestate:checked+.tab-label-realestate{
	background-color: #ffd700;
}

/* 相続相談 */
.consultation{
	text-align: center;
}
.consultation img{
	width: 100%;
}


/* 駐車場情報テーブル */
.parking-kind{
	margin: auto;
}

.parking-nav td:first-child{
	color: blue;
	text-decoration: underline;
}

.parking-info {
	width: 480px;
	margin-bottom: 2em;
	margin: auto;
	
}

.parking-info td {
	border: 1px solid #ccc;
	padding: 8px;
	vertical-align: top;
}

.parking-info thead img {
	width: 100%;
	height: auto;
	display: block;
	justify-content: center;
}

/* 売買物件地図 */
.map-image{
	width: 100%;
	height: auto;
	max-width: 500px; /* 最大幅は元画像サイズに合わせて調整 */
	display: block;
	margin: auto;
}

.map-position {
	text-align: center;
	margin: 0px;
}

.realestate-announce {
	width: fit-content;         /* コンテンツ幅に合わせる */
	margin: 0 auto;          /* 上下中央寄り + 横中央 */
	text-align: left;           /* 文章を左揃えに */
}
/* 売買物件情報テーブル */
.realestate-kind-name {
	font-size: 19px;
	font-weight: bolder;
	border: 2px solid #ccc;
	width:fit-content;
	padding: 5px;
}

.realestate-area{
	margin:0px;
	padding:20px 0 0 0;
}

.realestate-table{
	width: 400px;
}

.realestate-picture-frame {
	width: 400px;
	height: 200px;
    padding: 0;
    text-align: center;
	vertical-align: middle;
}

.realestate-picture {
	display: block;
	margin: auto;
	max-width: 100%;
	max-height: 100%;
}

.realestate-table tbody th{
	width: 85px; /* th内の文字数によって調整 */
}

.realestate-table tbody td{
	padding-left:0.4rem;
}

/* 売買・賃貸物件がない時のメッセージや画像 */
.no-realestate-message {
	display: none;
	text-align: center; /* 子要素を横方向中央揃え */
	margin: 20px 0;     /* 上下に少し余白を追加 */
}

.no-realestate-message p{
	padding: 20px;
	font-size: 25px;
	width: fit-content;         /* コンテンツ幅に合わせる */
	margin: 0 auto;          /* 上下中央寄り + 横中央 */
	text-align: left;           /* 文章を左揃えに */
}

/* 売買情報並び方 */
.realestate-row {
	display: flex;
	flex-wrap: wrap;
	gap:10px;
}

/* 無料査定ページ */
.assesment{
	text-align: center;
	margin-top: 10px;
}

.assesment img{
	width:70%;
}

.assesment p{
	background-color: rgb(12, 47, 79);
	color: white;
	font-size: 6vw;
	text-align: center;
	margin: 0 auto;
	width:70%;
}

/* 問い合わせテーブル */
.question{
	display: flex;
	justify-content: center;
	width:95%;
	margin: 0 auto;
}

.question th,.question td{
	padding-left:0px;
}

.question tr th{
	height: 100%;
	border:none;
	text-align: left;
}

.question tr td{
	width: 80%;
	padding: 0px 5px;
	height: 100%;
	padding-bottom:5px;
}

.question tr td textarea,input[type=text],input[type=email],input[type=tel],input[type=number]{
	width: 100%;
	font-size: 20px;
	border-style: none;
}

.question td div{
	margin-top: 5px;
	margin-bottom: 5px;
}
.question_radio td{
	text-align: left;
}

.question tr td textarea{
	resize: none;
}

.question-attention{
	color:white;background-color: tomato;
	border-radius: 12px;
	padding: 2px 8px;
	margin-left: 8px;
	font-weight: normal;
	width:fit-content;
	text-align: center;
	margin-top: 5px;
}

.question_realestate{
	display: flex;
	text-align: center;
}

.question_realestate td{
	text-align: left;
}

.question-note{
	text-align: center;
}

.question-check tr td{
	border: none;
}

.question-check tr th,.question-check tr td{
	white-space: nowrap;
}

.privacy-policy-style{
	text-align: center;
	font-weight: bold;
}

.privacy-policy-style a:link{
	color: blue;
	text-decoration: underline;
	text-underline-offset: 5px;
}

.privacy-policy-style a:visited{
	color: purple;
	text-decoration: underline;
	text-underline-offset: 5px;
}

/* 問い合わせ確認ボタン */
.submit-style{
	padding-top: 10px;
	display: flex;
	justify-content: center;
}

.checkbox-group{
	display: flex;
	flex-wrap: wrap;
}

.checkbox-group label {
	display: inline-flex;          /* チェックボックスとテキストを一塊に */
	align-items: center;
	white-space: nowrap;           /* □とテキストの間で改行しない */
}

/* 問い合わせエラーメッセージ設定 */
.error-messages{
	margin: 20px auto;
	width: 40%;
}

.error-messages-realestate{
	margin: 20px auto;
	list-style: none;
	width:60%;
}

/* スマホサイズ時の左右余白調整 */
@media (max-width: 814px) {
	p,h1,h2,h3,h4,h5,h6{
		padding:2px 0.3em;
	}
}

/* 画像が小さくなった際にハンバーガーメニューへ切り替え */
@media(min-width: 806px){
	.menu-smartphone{display: none;}
}

@media (max-width: 805px) {
	.menu-pc{display: none;}
}

/* 画面小でのトップページお知らせ */
@media (max-width: 805px) {
	.top-new-information table{width:95%;}
	.top-new-information iframe{height:100px;}
	.top-new-information img{width:90%;}
}

/* 画面小さくなった際の会社挨拶設定 */
@media (max-width: 665px) {
	.greeting{width: 80%;}
}
@media (max-width: 543px) {
	.greeting{width: 90%;}
}


/* 画面サイズに応じたフッターメニューの文字大きさ調整 */
@media (max-width: 805px) {
	.footer-menu ul,.footer-menu ul li{font-size: 2.3vw;}
}

/* 駐車場情報スマホ表示 */
@media(max-width: 600px){
	.parking-info {width: 90%;}
}

/* 画面縮小フッターメニュー表示 */
@media(max-width: 915px){
	.footer-menu ul,.footer-menu ul li {font-size: 20px;}
	.footer-menu{gap: 2%;}
}

@media(max-width: 805px){
	.footer-menu{flex-direction: column;align-items: center;}
	.footer-menu ul{width: 250px;text-align: left;margin:0 auto;padding-left: 80px;}
	.footer-menu ul li{margin-left: 20px;padding-left: 0;}
}

/* お問い合わせタブメニュー画面サイズ対応 */
@media(max-width: 614px){
	.tab-label-realestate {width: 50%;}
}

/* ハンバーガーメニューになった時のトップ動画 */
@media (max-width: 805px) {
	.topmovie{padding-top: 10px;}
}

/* 売物件テーブル画面サイズ対応 */
@media (max-width: 814px) { /* スマホ判定。Javascriptの「style.js」の「const isMobile = window.innerWidth <=」と同じ数字にするように */
	.table-container {
		justify-content: center;
	}
	.table-wrapper {
        display: flex;
        justify-content: center;
    }
	.realestate-row{
		flex-wrap: nowrap;
		gap:0px;
	}
	.top-realestate-row{
		flex-wrap: nowrap;
		gap:0px;
	}
	.row-Rght_edge-And-Left_edge{
		padding: 0;
	}
}

/* スワイプ切り替え */
@media screen and (min-width: 815px) {
	:root {
	--slide-width: auto;   /* PCでは自動幅 */
	}
	.table-wrapper {
	width: var(--slide-width);
	}
	.table-container {
	transform: none !important;
	cursor: default;
	}
	.indicator {
	display: none;
	}
}

/* スマホサイズ時売り物件の項目を中央に移動 */
@media (max-width: 814px) {
	.realestate-area{text-align: center;margin-top: 10px;}
	.realestate-kind-name{margin-left: auto;margin-right: auto;margin-bottom: 0;margin-top: 10px;}
}

/* スマホサイズ時エラーメッセージの位置変更 */
@media (max-width: 614px) {
	.error-messages{width:100%;}
	.error-messages-realestate{width: 100%;}
}

/* 売上テーブルのth文字小さくなった際設定 */
@media (max-width: 312px){
	.realestate-table tbody tr th{font-size: 5vw;padding: 3px;}
}

/* プリンター設定 */
@media print {
	.realestate-area{
		text-align: left;
	}
	.realestate-kind-name{
		margin-left: 0;
		margin-top: 10px;
	}

	.table-container,.table-wrapper {
		justify-content: start;
	}

    .realestate-row,
    .top-realestate-row {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }

    .realestate-row > *,
    .top-realestate-row > * {
        width: 48%;
    }

    thead {
        display: table-row-group;
    }

	body {
        zoom:0.8;
    }
}