@charset "utf-8";
/* CSS Document */

/* ===== 初期設定 ===== */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html, body {
  margin: 0;
  padding: 0;
  font-family: 'Noto Sans Japanese', sans-serif;
  line-height: 1.5;
  overflow-x: hidden;
  width: 100%;
}
h1 {
	display : none;
	}
h2, h3, h4, h5, h6, p {
  margin: 0;
  padding: 0;
  line-height: 1.5;
  font-weight: normal;
}
img {
  width: 100%;
  max-width: 100%;
  height: auto;
  border: none;
  display: block;
  vertical-align: bottom;
}
p, ul, ol, li {
	margin: 0;
	padding: 0;
	font-size: 0.9rem;
	width: auto;
}
ul, ol {
  list-style: none;
}
a {
	background-color : transparent;
	text-decoration : none;

	-webkit-text-decoration-skip : objects;
	}

a:active, a:hover {
	outline-width : 0;
	}
table {
	border-collapse : collapse;
	border-spacing : 0;
	}


/*---------------------
  トピック
---------------------*/
.inner {
	width : 90%;
	margin : 0 auto;
	}

.inner-base {
	width : 96%;
	margin : 0 auto;
	padding : 50px 0;
	}

.inner-bottom {
	width : 90%;
	margin : 0 auto;
	padding : 0 0 50px;
	}

.topic-t {
	background-color: #5D3D38;
	color: #ffffff;
	text-align: left; /* 中央 → 左寄せに変更 */
	font-size: 0;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 20px;
	margin-left: 0;
	padding-top: 8px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 20px;
}

.topic-t .main {
	display: inline-block;
	font-size: 1.2rem;
	line-height: 1.2;
	letter-spacing: 2px;
	margin-right: 10px;
}

.topic-t .sub {
	display: inline-block;
	font-size: 0.9rem;
	line-height: 1.2;
}

.topic-td {
	margin : 0 0 30px;
}
.topic-td2  {
	margin : 0 0 30px;
	}
	
#topicsArea {
	width : 96%;
	margin-right: auto;
	margin-left: auto;
	}
	
#topics li,
#list li {
	font-size: 0.95rem; /* 15px */
	margin : 0 0 15px;
	padding : 0 0 15px;
	border-bottom-width: 2px;
	border-bottom-style: dotted;
	border-bottom-color: #D8CBCA;
	color: #930;
	}
#topics li a:link,
#list li a:link {
	color: #402000;          /* 通常のリンク色 */
	text-decoration: none;/* 下線を消す（好みで） */
}

#topics li a:visited,
#list li a:visited {
	color: #402000;          /* 訪問済みも同じ色に */
}

#topics li a:hover,
#list li a:hover {
	color: #C33;          /* ホバー時に少し明るい赤茶に */
	text-decoration: underline; /* ホバー時に下線を付ける */
}

#topics li a:active,
#list li a:active {
	color: #402000;          /* クリック中はさらに濃い赤茶に */
}
#topics li:last-child,
#list li:last-child {
	margin : 0 0 20px;
	padding : 0;
	border-bottom : none;
	}

#topics #topics_date,
#list #topics_date {
	display : block;
	width : 7em;
	font-size: 0.7rem; /* 15px */
	}

#topics #topics_title,
#list #topics_title {
	display : block;
	overflow : hidden;
	width : 100%;
	text-overflow : ellipsis;
	white-space : nowrap;
	}

#topics #topics_title:hover,
#list #topics_title:hover {
	text-decoration : underline;
	}

.topics-left {
	width : 28%;
	}

.topics-right {
	width : 68%;
	}

.property-ttl {
	text-align : center;
	font-size : 3.0rem;
	font-weight : bold;
	margin : 0 0 30px;
	}

.more-btn a {
	display : block;
	background-color : #FFAE88;
	width : 60%;
	font-size : 0.7rem;
	color : #ffffff;
	text-align : center;
	letter-spacing : 2px;
	position : relative;
	border-radius : 6px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-top: 6px;
	padding-right: 5px;
	padding-bottom: 6px;
	padding-left: 5px;
	}

.more-btn i {
	position : absolute;
	position : absolute;
	top : 50%;
	right : 5px;
	transform : translateY(-50%);
	}

.more-btn a:hover {
	background-color : #72b0cf;
	}

.more-btn a:hover:hover, .more-btn a:hover:active, .more-btn a:hover:focus {
	background-color : #5AC9C4;
	}

#topics_paging {
	width : 100%;
	text-align : center;
	margin : 15px 0 0;
	padding : 8px 0;
	}

#topics_paging_previous,
#topics_paging_next {
	display : inline-block;
	background-color : #D5BCB9;
	width : 8em;
	color : #ffffff;
	font-size: 0.95rem; /* 15px */
	line-height : 2;
	margin : 0 5px;
	}

#topics_paging_previous a,
#topics_paging_next a {
	display : inline-block;
	background-color : #72b0cf;
	width : 8em;
	color : #ffffff;
	}

#topics_paging_previous a:hover,
#topics_paging_next a:hover {
	background : #98c5dc;
	}

#detail #topics_date {
	font-size: 0.95rem; /* 15px */
	text-align : right;
	margin : 0 0 20px;
	}

#detail #topics_title {
	font-size: 0.95rem; /* 15px */
	font-weight : bold;
	line-height : 1.3;
	margin : 0 0 30px;
	padding : 0 0 15px;
	word-break : break-all;
	border-bottom : 1px solid #dcdcdc;
	}

#detail #topics_body img[class^="topics_photo_"] {
	max-width : 100%;
	margin : 0 0 10px;
	}

#detail #topics_body {
	height : auto;
	min-height : 150px;
	margin : 0 0 30px;
	}

#detail .back-btn a {
	display : block;
	background-color : #72b0cf;
	width : 8em;
	/* [disabled]color : #ffffff; */
	text-align : center;
	font-size: 0.95rem; /* 15px */
	line-height : 2;
	margin : 0 auto;
	}
	
	
/*---------------------
  コンテンツここから
---------------------*/
.main-cont {
	max-width: 414px;
	width: 100%;
	margin: 0 auto;
}
.topic-cont {
	max-width: 414px;
	width: 100%;
	margin: 0 auto;
}

/* ===== top ===== */
.tophead {
  height: 100vh;
  background: url('../img/menu-bg.webp') center center / cover no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: white;
  position: relative;
}

.hero {
  position: relative;
}
.hero::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0);
  z-index: 0;
}

.cont01 {
  width: 100%;
  background-size: contain;
  background-image: url(../img/bg1.webp);
  background-repeat: no-repeat;
  padding: 100px 0 30px;
}

.cont01-box1 {
  width: 90%;
  max-width: 414px;
  margin: 0 auto;
  padding: 10px;
  background: rgba(255, 255, 255, 0.8);
}

.cont02 {
  width: 100%;
  max-width: 414px;
  margin: 0 auto;
  overflow: hidden;
  padding: 40px 0 30px;
  background-image: url(../img/bg1.webp);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left 150px;
}

.cont02-box1 {
  width: 90%;
  margin: 240px auto 0;
  background-color: #FFF;
  padding-top: 16px;
  clear: both;
}

.cont02-box2 {
  width: 92%;
  margin: 0 auto 28px;
}

.cont02-box2 a {
  text-decoration: none;
}

.cont03 {
	width: 94%;
	background-color: #F0F9F9;
	border-radius: 10px;
	max-width: 414px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 40px;
	margin-left: auto;
	padding-top: 30px;
	padding-bottom: 30px;
}

.cont03-list {
  list-style: none;
}

.cont03-list li {
	font-size: 16px;
	color: #444;
	border-bottom: 1px solid #ddd;
	display: flex;
	align-items: flex-start;
	margin-top: 0;
	margin-bottom: 0;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-right: 15px;
	margin-left: 15px;
	padding-right: 0;
	padding-left: 0;
}

.check-icon {
	color: #39ACA6;
	font-weight: bold;
	margin-right: 10px;
	font-size: 18px;
	line-height: 1.5;
	margin-left: 15px;
	padding-top: 5px;
}

.news-campaign {
  max-width: 414px;
  margin: 0 auto 40px;
  background: #fff;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.tabs {
  display: flex;
  border-bottom: 2px solid #eee;
  margin-bottom: 20px;
}

.tab {
  flex: 1;
  padding: 12px 0;
  text-align: center;
  background: none;
  border: none;
  font-weight: bold;
  color: #666;
  cursor: pointer;
  transition: background 0.3s, color 0.3s;
}

.tab.active {
  color: #2c9e45;
  background: linear-gradient(to bottom, #f0fdf5, #fff);
}

.contents .content {
  display: none;
}
.contents .content.active {
  display: block;
}
.contents li {
  display: flex;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid #eee;
}
.contents .date {
  font-size: 14px;
  color: #999;
  margin-right: 12px;
}

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

.image-box {
  position: relative;
  overflow: hidden;
  background: #f5f5f5;
  margin: 20px 0;
}

.image-box a {
  display: block;
  position: relative;
  color: inherit;
  text-decoration: none;
}

.image-wrapper {
  position: relative;
  width: 100%;
  height: 220px;
  overflow: hidden;
}

.image-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1.1);
  transition: transform 1.2s ease;
}

.image-wrapper .mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: white;
  transform: translateX(0%);
  transition: transform 1.2s ease;
  z-index: 2;
}

.slide-in.active .mask {
  transform: translateX(100%);
}
.slide-in.active img {
  transform: scale(1);
}

.cont04 {
	width: 100%;
	padding-bottom: 50px;
	padding-top: 30px;
}
.cont04-box1 {
	width: 100%;
	max-width: 414px;
	height: 350px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}

/* フッターCSS */
.footer {
	max-width: 414px;
	width: 100%;
	text-align: center;
	color: #333;
	padding-bottom: 20px;
	background-image: url(../img/bg2.webp);
	background-repeat: no-repeat;
	background-size: contain;
	margin-top: 0;
	margin-right: auto;
	margin-left: auto;
	border-top-width: 3px;
	border-bottom-width: 3px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #F63;
	border-bottom-color: #F63;
}

.footer-inner {
  max-width: 414px;
  margin: 0 auto;
}

.footer-logo {
	max-width: 210px;
	margin-top: 30px;
	margin-right: auto;
	margin-bottom: 16px;
	margin-left: auto;
}
.footer-txt {
	font-size: 12px;
	line-height: 1.6;
	font-weight: 400;
	margin-bottom: 15px;
	color: #573934;
}

.footer-address {
	font-size: 14px;
	line-height: 1.5;
	font-weight: 300;
	margin-bottom: 15px;
	color: #573934;
}

.footer-hours {
  font-size: 14px;
  line-height: 1.5;
  font-weight: 300;
}

.footer-cookie {
	font-size: 14px;
	line-height: 2;
	font-weight: 300;
	color: #573934;               /* p に使う場合の余白リセット */
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
}

/* -------------------------
   a要素のリンク状態ごとの色
   ------------------------- */
.footer-cookie a:link,
.footer-cookie__link:link  { color: #573934; text-decoration: underline; }

.footer-cookie a:visited,
.footer-cookie__link:visited { color: #573934; }

.footer-cookie a:hover,
.footer-cookie__link:hover { color: #7a5249; text-decoration: none; }

.footer-cookie a:active,
.footer-cookie__link:active { color: #3f2a24; }

.footer-yoyaku {
	color: #FFFFFF;
	font-weight: 600;
	background-color: #E64F81;
	padding-top: 3px;
	padding-right: 10px;
	padding-bottom: 3px;
	padding-left: 10px;
	letter-spacing: 0.2em;
	font-size: 12px;
}


.footer-tel {
  font-size: 12px;
  line-height: 1.5;
}
.footer-tel span {
  font-size: 26px;
}
.footer-tel a {
	color: #FF6600;
	text-decoration: none;
}
.footer-tel a:hover {
  text-decoration: underline;
}

.footer-copy {
  font-size: 12px;
  line-height: 1.5;
  font-weight: 500;
  color: #573934;
  padding-top: 10px;
}


/* トップへ戻るボタンのスタイル */
.pagetop {
	display: none;
	position: fixed;
	bottom: 20px;
	right: 10px;
	z-index: 100;
}
.pagetop a {
	display: block;
	width: 30px;
	height: 30px;
	background-color: #FF9900;
	border-radius: 50px;
	text-align: center;
	color: #fff;
	font-size: 14px;
	text-decoration: none;
	line-height: 30px;
}



/*---------------------
  フェード効果
---------------------*/
.fadein1 {
  opacity: 0;
  transform: translate(0px, 14px);
  transition: all 1000ms;
}
.fadein1.scrollin {
  opacity: 1;
  transform: translate(0px, 0px);
}
.fadein2 {
  opacity: 0;
  transform: translate(50px, 0px);
  transition: all 1400ms;
}
.fadein2.scrollin {
  opacity: 1;
  transform: translate(0px, 0px);
}
.fadein3 {
  opacity: 0;
  transform: translate(-50px, 0px);
  transition: all 1400ms;
}
.fadein3.scrollin {
  opacity: 1;
  transform: translate(0px, 0px);
}
.fade {
}
.fadeInDown {
	-webkit-animation-fill-mode: both;
	-ms-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-duration: 1s;
	-ms-animation-duration: 1s;
	animation-duration: 1s;
}
@-webkit-keyframes fadeInDown {
 0% {
opacity: 0;
-webkit-transform: translateY(-20px);
-ms-transform: translateY(-20px);
transform: translateY(-20px);
}
 100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes fadeInDown {
 0% {
opacity: 0;
-webkit-transform: translateY(-20px);
-ms-transform: translateY(-20px);
transform: translateY(-20px);
}
 100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
.fadeInDown {
	-webkit-animation-name: fadeInDown;
	animation-name: fadeInDown;
	visibility: visible !important;
}

/* 他 */
.mini1 img {
  width: 100%;
  height: auto;
}
.td1 {
	margin-bottom: 20px;
}
.td2 {
	padding-top: 30px;
}

.table-style02 {
	width : 92%;
	border-top : 1px solid #dcdcdc;
	margin-right: auto;
	margin-left: auto;
	}

.table-style02 th,
.table-style02 td {
	text-align : left;
	border-bottom : 1px solid #dcdcdc;
	padding-top: 8px;
	padding-right: 8px;
	padding-bottom: 8px;
	padding-left: 15px;
	}

.table-style02 td {
	width : 8em;
	text-align : right;
	font-weight: 500;
	letter-spacing: 0.07em;
	font-size: 0.95rem; /* 15px */
	line-height: 1.5;
	color: #F66;
	padding-right: 5px;
	}

.table-style02 th {
	font-weight: 400;
	letter-spacing: 0.07em;
	font-size: 0.85rem; /* 15px */
	line-height: 1.5;
	}
.table-style02 span {
	font-size : 0.7rem;
	}
	
.table-style04 {
	width : 96%;
	margin-right: auto;
	margin-left: auto;
	}	
.table-style04 th,
.table-style04 td {
	text-align : left;
	padding : 10px 5px;
	border-bottom : 1px solid #dcdcdc;
	}
.table-style04 td {
	font-size: 0.85rem; /* 15px */
	font-weight: 300;
	line-height: 1.5;
	color: #333;
	padding-left: 10px;
	}

.table-style04 th {
	width : 6em;
	font-weight: 300;
	letter-spacing: 0.07em;
	font-size: 0.85rem; /* 15px */
	line-height: 1.5;
	background-color: #FFF8F4;
	}
	
.tel-link {
	text-decoration: none;   /* 下線を消してスッキリ */
	color: #333;          /* まわりの文字色に合わせる（強調したいなら任意の色に） */
}