@charset "UTF-8";
:root {
	--color-brw: #a48b78;
	--color-grey: #595757;
	--color-grey2: rgba(200, 202, 204,0.2);
	--color-wh: #fff;
	--color-bk: #333;
	--font-goc: "游ゴシック", "Yu Gothic", YuGothic, "游ゴシック体", "Lucida Grande", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif !important;
	--font-min: "fot-tsukuaoldmin-pr6n", sans-serif;
	--font-forum: "Forum", "Noto Serif JP", serif;
}

.p-location-area1 {
	padding: 0;
}
.p-location-addarea {
	background: #fff;
	background-image: url(../images/location/location-bg-03.webp);
	background-size: cover;
	background-repeat: no-repeat;
	color: var(--color-brw);
}
@media screen and (max-width: 767px) {
	.p-location-addarea {
		background-image: url(../images/location/location-bg-03-sp.webp);
	}
}
.p-location-addarea h2.-title {
	font-family: var(--font-min);
	text-align: center;
	font-weight: normal;
	display: block;
	font-style: normal;
	font-size: clamp(3.3rem, 2.52rem + 2.4375vw, 7.2rem);
	line-height: 1.3;
	letter-spacing: 0.1em;
	margin-block-end: clamp(2rem, 1.4rem + 1.875vw, 5rem);
}
.p-location-addarea h2.-title span {
	display: block;
	font-size: clamp(2.2rem, 1.92rem + 0.875vw, 3.6rem);
	margin-block-start: clamp(1rem, 0.8rem + 0.625vw, 2rem);
}
.p-location-addarea p.-txt {
	font-size: clamp(1.7rem, 1.52rem + 0.5625vw, 2.6rem);
	line-height: 2.25;
	text-align: center;
	margin-block-end: clamp(2.5rem, 0.8rem + 5.3125vw, 11rem);
}
.p-location-addarea hr {
	width: 100%;
	border: none;
	border-top: 1px solid #656565;
	margin-block: clamp(2rem, 0.8rem + 3.75vw, 8rem);
}
@media screen and (max-width: 1025px) {
	.p-location-addarea dl.-txt2 {
		margin-block-end: 20px;
	}
}
.p-location-addarea dl.-txt2 dt {
	font-size: clamp(1.7rem, 1.32rem + 1.1875vw, 3.6rem);
	line-height: 1.6;
	margin-block-end: clamp(1.5rem, 1.2rem + 0.9375vw, 3rem);
}
.p-location-addarea dl.-txt2 dt span {
	display: block;
	font-size: clamp(1rem, 0.84rem + 0.5vw, 1.8rem);
	margin-block-end: clamp(1.5rem, 1.2rem + 0.9375vw, 3rem);
}
.p-location-addarea dl.-txt2 dt em {
	font-style: normal;
	font-size: 70%;
}
.p-location-addarea dl.-txt2 dd {
	font-size: clamp(1.4rem, 1.2rem + 0.625vw, 2.4rem);
	line-height: 2.2;
	color: #656565;
}
@media screen and (max-width: 767px) {
	.p-location-addarea dl.-txt2 dd {
		line-height: 1.9;
	}
}
.p-location-addarea__column {
	margin-block-start: -170px;
	padding-block-start: 170px;
}
@media screen and (max-width: 767px) {
	.p-location-addarea__column {
		margin-block-start: -70px;
		padding-block-start: 70px;
	}
}
.p-location-addarea__box1 {
    width: 90%;
    max-width: 1500px;
    margin-inline: auto;
    margin-block-end: clamp(4.5rem, 3.4rem + 3.4375vw, 10rem);
    background-color: rgba(255, 255, 255, 0.7);
    border: 1px solid #231815;
    padding: clamp(3rem, 1.9rem + 3.4375vw, 8.5rem) 0;
    
    /* -------------------------------------------------- */
    /* Gridの定義を分解して指定 */
    /* -------------------------------------------------- */
    display: grid;
    justify-content: space-between;
    grid-template-columns: 4% 42% 45% 4%;
    
    /* Safari対策：すべての行を minmax(auto, max-content) または auto で明示 */
    grid-template-rows: repeat(13, auto);
    
    grid-template-areas: 
        ". txt1 txt1 ." 
        ". pic1 txt2 ." 
        ". pic1 pic2 ." 
        ". hr1 hr1 ." 
        ". txt3 txt3 ." 
        ". txt4 txt4 ." 
        ". pic3 pic3 ." 
        ". hr2 hr2 ." 
        ". txt5 txt5 ." 
        ". box1 box1 ." 
        ". txt6 txt6 ." 
        "box2 box2 box2 box2" 
        "txt7 txt7 txt7 txt7";
}

/* 2. グリッド直下要素のSafari計算バグ防止 */
.p-location-addarea__box1 > * {
    min-height: 0;
    min-width: 0;
    /* SafariでWOW.js等のアニメーションによる高さ0化を防ぐ */
    will-change: transform, opacity; 
}

/* 3. 各グリッドエリア個別の崩れ防止 */
.p-location-addarea__box1 h3 { grid-area: txt1; }
.p-location-addarea__box1 dl.-txt2 { grid-area: txt2; }
.p-location-addarea__box1 h4:nth-of-type(1) { grid-area: txt3; }
.p-location-addarea__box1 p.-txt4 { grid-area: txt4; }
.p-location-addarea__box1 h4:nth-of-type(2) { grid-area: txt5; }
.p-location-addarea__box1 h4:nth-of-type(3) { grid-area: txt6; }
.p-location-addarea__box1 .caption.-txt7 { grid-area: txt7; }
.p-location-addarea__box1 .blocks { grid-area: box1; }
.p-location-addarea__box1 .gallery { grid-area: box2; }

/* 4. 画像要素（pic1, pic2, pic3）の修正 */
.p-location-addarea__box1 figure:nth-of-type(1) {
    grid-area: pic1;
    align-self: start;
    height: auto;
}
.p-location-addarea__box1 figure:nth-of-type(2) {
    grid-area: pic2;
    align-self: end;
}
.p-location-addarea__box1 figure:nth-of-type(3) {
    grid-area: pic3;
}

/* 画像自体のサイズ確定（高さ0化を防ぐ） */
.p-location-addarea__box1 img,
.p-location-addarea__box1 picture {
    width: 100%;
    height: auto;
    display: block;
}

/* 5. hr（水平線）のSafariバグ防止 */
.p-location-addarea__box1 hr {
    width: 100%;
    border: none;
    border-top: 1px solid #ccc; /* 必要に応じて色を調整してください */
    margin: 30px 0;
    height: 1px;
}
.p-location-addarea__box1 hr:nth-of-type(1) { grid-area: hr1; }
.p-location-addarea__box1 hr:nth-of-type(2) { grid-area: hr2; }

/* 6. SP表示時の切り替え */
@media screen and (max-width: 767px) {
    .p-location-addarea__box1 {
        display: flex !important;
        flex-direction: column;
        padding-inline: 5%;
        overflow: hidden;
    }
}
/* --------------------------------------------------
   ギャラリー画像と注釈テキストの被り解消（Safari対策）
   -------------------------------------------------- */

/* 1. ギャラリー（box2）要素の高さ・マージン確定 */
.p-location-addarea__box1 .gallery {
    grid-area: box2;
    margin-block-end: 2rem !important; /* 画像の下側に余白を強制確保 */
}

/* 2. 注釈テキスト（txt7）を必ず画像の下へ配置する設定 */
.p-location-addarea__box1 .caption.-txt7 {
    grid-area: txt7 !important;
    
    /* 位置の強制修正 */
    position: relative !important;
    z-index: 1;
    
    /* マージンの上書き（重要：マイナス値や margin:0 による被りを防止） */
    margin-block-start: 1.5rem !important; /* 画像との間の距離 */
    margin-block-end: 0 !important;
    margin-inline: 0 0 !important;
    
    /* パディングの設定 */
    padding: 1rem 3% !important;
    
    /* テキストの整列 */
    text-align: right;
    line-height: 1.8;
}

/* 3. Safariでグリッドの自動計算が崩れる場合のフォールバック（バックアップ指定） */
@supports (-webkit-touch-callout: none) {
    .p-location-addarea__box1 {
        /* Safariのみ、最後のキャプション行の高さをしっかり確保 */
        grid-template-rows: repeat(11, auto) max-content auto !important;
    }
}

.p-location-addarea__box1 h3 {
	grid-area: txt1;
	margin-block-end: clamp(2rem, 0.6rem + 4.375vw, 9rem);
	text-align: center;
	color: #706975;
	font-weight: 400;
	line-height: 1.5;
	font-size: clamp(2rem, 1.56rem + 1.375vw, 4.2rem);
}
@media screen and (max-width: 767px) {
	.p-location-addarea__box1 h3 {
		white-space: nowrap;
	}
}
.p-location-addarea__box1 figure:nth-of-type(1) {
	grid-area: pic1;
	margin-block: 0 auto;
}
.p-location-addarea__box1 dl.-txt2 {
	grid-area: txt2;
}
@media screen and (max-width: 767px) {
	.p-location-addarea__box1 dl.-txt2 {
		margin-block-start: 30px;
	}
}
.p-location-addarea__box1 figure:nth-of-type(2) {
	grid-area: pic2;
	margin-block: auto 30px;
}
@media screen and (max-width: 767px) {
	.p-location-addarea__box1 figure:nth-of-type(2) {
		margin-block: auto 0;
	}
}
.p-location-addarea__box1 figure:nth-of-type(2) .caption {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 10px;
	bottom: -30px;
}
@media screen and (max-width: 767px) {
	.p-location-addarea__box1 figure:nth-of-type(2) .caption {
		position: static;
	}
}
.p-location-addarea__box1 figure:nth-of-type(2) .caption em {
	font-style: normal;
	margin-inline: 0 auto;
}
.p-location-addarea__box1 figure:nth-of-type(2) .caption span {
	background-color: #de6378;
	width: 55px;
	height: 18px;
	display: inline-block;
}
@media screen and (max-width: 767px) {
	.p-location-addarea__box1 figure:nth-of-type(2) .caption span {
		width: 25px;
		height: 8px;
	}
}
.p-location-addarea__box1 hr:nth-of-type(1) {
	grid-area: hr1;
}
.p-location-addarea__box1 hr:nth-of-type(2) {
	grid-area: hr2;
}
.p-location-addarea__box1 h4 {
	text-align: center;
	font-size: clamp(1.7rem, 1.4rem + 0.9375vw, 3.2rem);
	font-weight: 400;
	line-height: 1.8;
	margin-block-end: clamp(2rem, 1.4rem + 1.875vw, 5rem);
}
@media screen and (max-width: 767px) {
	.p-location-addarea__box1 h4 {
		text-align: left;
	}
}
.p-location-addarea__box1 h4:nth-of-type(1) {
	grid-area: txt3;
}
@media screen and (max-width: 767px) {
	.p-location-addarea__box1 h4:nth-of-type(1) {
		margin-block-end: 10px;
	}
}
.p-location-addarea__box1 h4:nth-of-type(2) {
	grid-area: txt5;
}
.p-location-addarea__box1 h4:nth-of-type(3) {
	grid-area: txt6;
}
.p-location-addarea__box1 p.-txt4 {
	grid-area: txt4;
	text-align: center;
	color: #656565;
	font-size: clamp(1.4rem, 1.28rem + 0.375vw, 2rem);
	line-height: 2;
	margin-block-end: clamp(2.5rem, 1.9rem + 1.875vw, 5.5rem);
}
@media screen and (max-width: 767px) {
	.p-location-addarea__box1 p.-txt4 {
		text-align: left;
		line-height: 1.8;
	}
}
.p-location-addarea__box1 p.-txt4 span {
	font-size: clamp(1rem, 0.96rem + 0.125vw, 1.2rem);
}
@media screen and (max-width: 767px) {
	.p-location-addarea__box1 p.-txt4 span {
		display: block;
	}
}
.p-location-addarea__box1 figure:nth-of-type(3) {
	grid-area: pic3;
}
.p-location-addarea__box1 .caption.-txt7 {
	grid-area: txt7;
	padding: clamp(1rem, 0.8rem + 0.625vw, 2rem) clamp(1.5rem, 1.2rem + 0.9375vw, 3rem);
	margin: 0;
	color: #656565;
}
@media screen and (max-width: 767px) {
	.p-location-addarea__box1 .caption.-txt7 {
		text-align: left;
		padding: 10px 0;
	}
}
.p-location-addarea .blocks {
	grid-area: box1;
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: max-content 1fr;
	gap: clamp(1.2rem, 0.64rem + 1.75vw, 4rem);
	margin-block-end: clamp(3rem, 2.2rem + 2.5vw, 7rem);
}
@media screen and (max-width: 767px) {
	.p-location-addarea .blocks {
		display: flex;
		flex-direction: column;
	}
}
.p-location-addarea .blocks-area {
	background-color: #fff;
	border: 1px solid #231815;
	position: relative;
	display: flex;
}
.p-location-addarea .blocks-area figure {
	order: 1;
	width: 50%;
	object-fit: cover;
}
.p-location-addarea .blocks-area figure img {
	object-fit: cover;
	height: 100%;
}
.p-location-addarea .blocks-area dl {
	order: 2;
	width: 50%;
	padding: clamp(1rem, 0.6rem + 1.25vw, 3rem);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
@media screen and (max-width: 767px) {
	.p-location-addarea .blocks-area dl {
		padding-block: 10px 30px;
	}
}
.p-location-addarea .blocks-area dl dt {
	font-size: clamp(1.1rem, 0.86rem + 0.75vw, 2.3rem);
	text-align: center;
	line-height: 1.2;
}
.p-location-addarea .blocks-area dl dt:after {
	content: "";
	width: 40px;
	height: 1px;
	background-color: #9d887a;
	display: block;
	margin-inline: auto;
	margin-block: clamp(0.5rem, 0.3rem + 0.625vw, 1.5rem);
}
@media screen and (max-width: 767px) {
	.p-location-addarea .blocks-area dl dt:after {
		width: 20px;
		margin-block: 2px;
	}
}
.p-location-addarea .blocks-area dl dd {
	font-size: clamp(1rem, 0.92rem + 0.25vw, 1.4rem);
	line-height: 1.3;
	color: #656565;
}
.p-location-addarea .blocks-area .caption {
	color: #656565;
	position: absolute;
	right: 10px;
	bottom: 5px;
	font-size: clamp(1rem, 0.96rem + 0.125vw, 1.2rem);
	margin: 0;
}
@media screen and (max-width: 767px) {
	.p-location-addarea .blocks-area .caption {
		transform-origin: right bottom;
		transform: scale(0.8);
	}
}
.p-location-addarea .gallery {
	grid-area: box2;
	display: grid;
	grid-template-columns: 33.7fr 7.2fr 25.9fr 33.2fr;
	grid-template-rows: 34.6fr 14.4fr 15.9fr 35.1fr;
	gap: 2px;
	aspect-ratio: 1511/824;
	margin: 0 auto;
}
@media screen and (max-width: 767px) {
	.p-location-addarea .gallery {
		width: 114%;
		transform: translateX(-6%);
		gap: 1px;
	}
}
.p-location-addarea .gallery__item {
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 2rem;
	font-weight: 700;
}
.p-location-addarea .gallery__item figure {
	object-fit: cover;
	height: 100%;
	width: 100%;
}
.p-location-addarea .gallery__item figure img {
	object-fit: cover;
	height: 100%;
}
.p-location-addarea .gallery__item span {
	position: absolute;
	top: 8px;
	left: 8px;
	background: #231815;
	color: #fff;
	border: 1px solid #fff;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: clamp(1rem, 0.54rem + 1.4375vw, 3.3rem);
	font-weight: 400;
	z-index: 2;
}
@media screen and (max-width: 767px) {
	.p-location-addarea .gallery__item span {
		width: 15px;
		height: 15px;
		top: 4px;
		left: 4px;
	}
}
.p-location-addarea .gallery__item--1 {
	grid-column: 1/3;
	grid-row: 1/3;
}
.p-location-addarea .gallery__item--2 {
	grid-column: 3/4;
	grid-row: 1/3;
}
.p-location-addarea .gallery__item--3 {
	grid-column: 4/5;
	grid-row: 1/2;
}
.p-location-addarea .gallery__item--4 {
	grid-column: 1/2;
	grid-row: 3/5;
}
.p-location-addarea .gallery__item--5 {
	grid-column: 2/4;
	grid-row: 3/5;
}
.p-location-addarea .gallery__item--6 {
	grid-column: 4/5;
	grid-row: 2/4;
}
.p-location-addarea .gallery__item--7 {
	grid-column: 4/5;
	grid-row: 4/5;
}
.p-location-addarea__box2 {
	background-color: #fff;
	padding-block: clamp(3.5rem, 1rem + 7.8125vw, 16rem);
}
.p-location-addarea__box2inn {
	width: 90%;
	max-width: 1380px;
	margin-inline: auto;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-template-rows: max-content max-content 1fr;
	column-gap: clamp(4rem, 3rem + 3.125vw, 9rem);
}
@media screen and (max-width: 767px) {
	.p-location-addarea__box2inn {
		display: flex;
		flex-direction: column;
	}
}
.p-location-addarea__box2inn hr {
	grid-column: 1/-1;
}
.p-location-addarea__box2inn .caption {
	color: #656565;
}
@media screen and (max-width: 767px) {
	.p-location-addarea__box2inn .caption {
		line-height: 1.1;
	}
}
.p-location-addarea__box2inn .-txt2:nth-of-type(2) {
	grid-column: 2;
	grid-row: 3;
}
.p-location-addarea__box2inn .p-location-addarea__box4 {
	grid-column: 1;
	grid-row: 3;
}
.p-location-addarea__box3 {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: clamp(0.7rem, 0.54rem + 0.5vw, 1.5rem);
}
.p-location-addarea__box3 figure:nth-of-type(1) {
	grid-column: 1/4;
}
.p-location-addarea__box3 figure:nth-of-type(2) {
	grid-column: 4/7;
}
.p-location-addarea__box3 figure:nth-of-type(3) {
	grid-column: 1/3;
}
.p-location-addarea__box3 figure:nth-of-type(4) {
	grid-column: 3/5;
}
.p-location-addarea__box3 figure:nth-of-type(5) {
	grid-column: 5/7;
}
.p-location-addarea__box4 {
	display: grid;
	grid-template-columns: 47.92% 46.84%;
	grid-template-rows: repeat(2, 1fr);
	justify-content: space-between;
}
@media screen and (max-width: 767px) {
	.p-location-addarea__box4 {
		grid-template-columns: 48.94% 44.5%;
	}
}
.p-location-addarea__box4 figure:nth-of-type(1) {
	grid-row: 1/-1;
}
.p-location-addarea {
	padding-block: clamp(5rem, 4rem + 3.125vw, 10rem);
	overflow: hidden;
}
.p-location-addarea .location-slider-container {
	margin: clamp(5rem, 4rem + 3.125vw, 10rem) 0 0 0;
}
.location-slider .slick-slide {
    color: #fff;
}
/*# sourceMappingURL=location-add.css.map */