@charset "utf-8";

.text-overlay {
  top:50%;
}
.js-text {
  color: rgba(255, 255, 255, 1);
  letter-spacing: 0.06em;
  text-align: center;
  text-shadow: 1px 1px 3px rgba(255, 255, 255, 0.5);
  white-space: nowrap;
}
.js-textA {
	text-align: start;
	font-weight: 500;
}
.js-textB {
	text-align: start;
}
/* CSS Document */
#header {
  position: sticky;
}
.mb_12vh{
	margin-bottom: 12vh;
}
/*======================*/
.loc02{
	text-align: center;
	margin-bottom: 15vh;
}
.loc02 h2{
  font-size: var(--fs-40);
  margin-bottom: 1.0em;
}
.loc02 p {
  font-size: var(--fs-20);
  line-height: 1.8em;
  margin-bottom: 10vh;
}
.loc02 p>img {
	width: 80%;
	height:auto;
}
.loc02 ul{
	display: grid;
	grid-template-columns: 1fr 1fr;
	margin-bottom: 10vh;
}
/**/

.loc03 ul{
	width: 90%;
	margin: 0 auto 15vh;
	display: flex;
	flex-direction: column;
	grid-row-gap: 3vh;
}
/**/
.loc04{
	margin-bottom: 15vh;
}
.loc04_container{
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}
.place_list1{
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 10%;
	margin-bottom: 5vh;
}
.loc04 h2{
	font-size: var(--fs-35);
}
.loc04 p{
	font-size: var(--fs-18);
	line-height: 1.8em;
}
.loc04 .caption{
	font-size: var(--fs-16);
	text-align: end;
  margin-bottom: 2.5em;
}
.loc04 .list_item>p{
	font-size: var(--fs-16); 
	line-height: 1.2em;
}
.place_list2{
 display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	grid-row-gap: 3vh;
	align-items: flex-start;
	text-align: center;
}
.place_list2 .list_item{
	flex-basis: 30%;
}
/**/
.loc05{
	margin-bottom: 15vh;
}
.loc05 h3{
	font-size: var(--fs-35);
  margin-bottom: 1.0em;
}
.loc05 p {
  font-size: var(--fs-18);
  line-height: 1.8em;
  margin-bottom: 10vh;
}
.loc05_list{
	display: grid;
	grid-template-columns: 1.5fr 1fr;
	column-gap: 3.0em;
	align-items: center;
	padding: 0 10%;
}

/*=========レスポンシブ=====================

=======SP対応・ブレイクポイント768px=========*/
@media (max-width: 768px) {
.loc02 p>img{
		width: 100%;
		height:auto;
		overflow: visible;
	margin-left: 0;
	margin-right: 0;
	}
.place_list1{
    display: flex;
	flex-direction: column;
	grid-row-gap: 1.0em;
    margin-bottom: 5vh;
}
	.only_tb{
		display: none;
	}
.place_list2 .list_item {
    flex-basis: 45%;
}
.loc05_list {
    display: flex;
	flex-direction: column-reverse;
	grid-row-gap: 0;
    margin-bottom: 5vh;
	align-items: start;
}
	.loc05_tx{
		margin-top: -3.5em;
	}
}

@media (max-width: 500px) {
.text-overlay {
    top: 46%;
}
	.js-textA{
		font-size: 12px;
	}
.loc02 {
    margin-bottom: 7vh;
	}
.loc02 h2 {
    font-size: var(--fs-30);
    margin-bottom: 1.0em;
}	

.loc02 p {
    margin-bottom: 5vh;
	}
.loc02 ul {
	display: flex;
	flex-direction: column;
	grid-row-gap: 1.5em;
	}
	
	.loc02 img{
		width: 90%;
		height:auto;
		overflow: visible;
		margin-left: 0;
	margin-right: 0;
	}
	.loc03 ul {
    width: 100%;
    margin: 0 auto;
	}
	.loc02 .tukin_img{
		text-align: center;
	}
	.loc02 .tukin_img img{
		width: 80%;
		height: auto;
	}
.loc04 h2 {
    font-size: var(--fs-23);
}	
.loc04 p {
    font-size: var(--fs-16);
    line-height: 1.8em;
}
    .place_list2 .list_item {
        flex-basis: 100%;
    }
.loc05 h3 {
    font-size: var(--fs-28);
    margin-bottom: 1.0em;
}
.loc05 p {
    font-size: var(--fs-18);
    line-height: 1.8em;
    margin-bottom: 8vh;
}
    .last_sec {
        margin-bottom: 10vh;
	}
}