@charset "UTF-8";
.line-box::before { background: #008e93; }
.line-box .block { width: 80%; max-width: 700px; }
.line-box .block:nth-of-type(even) { margin-right: 0; margin-left: auto; }
.line-box .block:nth-of-type(even) .maincopy, .line-box .block:nth-of-type(even) .subcopy { text-align: right; }
.line-box.r .maincopy, .line-box.r .subcopy { text-align: right; }
.line-box.r .block { margin-right: 0; margin-left: auto; }
.line-box.r .block .maincopy, .line-box.r .block .subcopy { text-align: right; }
.line-box.r .block:nth-of-type(even) { margin-right: auto; margin-left: 0; }
.line-box.r .block:nth-of-type(even) .maincopy, .line-box.r .block:nth-of-type(even) .subcopy { text-align: left; }
@media screen and (max-width: 600px) { .line-box .block { width: 100%; }
  .line-box .block:nth-of-type(even) { margin-right: auto; }
  .line-box .block:nth-of-type(even) .maincopy, .line-box .block:nth-of-type(even) .subcopy { text-align: left; }
  .line-box.r .block { margin-right: auto; }
  .line-box.r .block:nth-of-type(even) { margin-left: auto; } }

.bg-section, section .bg-section { background: url("../images/location/bg01.jpg") no-repeat 0% 0%; background-size: cover; padding: 5rem 0; }
.bg-section::before, section .bg-section::before { display: none; }
.bg-section .maincopy, .bg-section .lead, .bg-section .note, section .bg-section .maincopy, section .bg-section .lead, section .bg-section .note { color: #fff; }
.bg-section .maincopy, section .bg-section .maincopy { text-align: center; }
.bg-section .lead, section .bg-section .lead { max-width: 800px; margin-right: auto; margin-left: auto; }

.loc-head { padding-bottom: 1rem; }

.img01 { width: 90%; max-width: 800px; margin: 3rem auto 0 auto; }
@media screen and (max-width: 600px) { .img01 { margin: 3rem auto 0 0; } }

.img02 { max-width: 700px; margin: 3rem auto 0 auto; }
.img02 .note { text-align: right; }

.img03 { width: 90%; max-width: 800px; margin: 3rem auto 0 auto; }
@media screen and (max-width: 600px) { .img03 { margin: 3rem 0 0 auto; } }

.convenience .shoplist01 { margin: 3rem auto 0 auto; display: grid; gap: 3rem; grid-template-columns: repeat(3, 1fr); }
.convenience .shoplist01 .li-item .icon { width: 25%; position: absolute; top: -1rem; right: -1rem; z-index: 2; }
.convenience .shoplist01 .li-item .name { margin-top: 1rem; font-size: 1.6rem; line-height: 1.2; }
.convenience .shoplist01 .li-item .name .txt-s { display: inline-block; font-size: 80%; }
.convenience .shoplist01 .li-item .detail-ttl { margin-top: 2rem; width: 100%; position: relative; }
.convenience .shoplist01 .li-item .detail-ttl .txt { font-family: "Helvetica Neue", "Helvetica","Yu Gothic",  'Noto Sans JP', "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Meiryo", sans-serif; font-weight: normal; font-size: 1.3rem; line-height: 1; display: inline-block; background: #fff; padding: 0 .5rem 0 0; position: relative; z-index: 2; }
.convenience .shoplist01 .li-item .detail-ttl::after { content: ""; display: block; width: 100%; height: 1px; background: rgba(0, 0, 0, 0.5); position: absolute; top: calc(50% - .5px); left: 0; }
.convenience .shoplist01 .li-item .detail-list { margin-top: .5rem; display: grid; gap: .5rem 1rem; grid-template-columns: 1fr; font-size: 1.1rem; line-height: 1.6; }
.convenience .conv { width: 100%; max-width: 100%; }
.convenience .conv .lead { max-width: 700px; margin-right: 0; margin-left: auto; }
.convenience .shoplist02 { margin: 3rem auto 0 auto; display: grid; gap: 2rem; grid-template-columns: repeat(4, 1fr); }
.convenience .shoplist02 .name { margin-top: .5rem; font-size: 1.4rem; line-height: 1.4; }
.convenience .shoplist02 .name .time { font-size: 90%; }
@media screen and (max-width: 864px) { .convenience .shoplist01 { gap: 2rem; grid-template-columns: 1fr; }
  .convenience .shoplist01 .li-item .detail-list { grid-template-columns: repeat(2, 1fr); }
  .convenience .shoplist02 { grid-template-columns: repeat(2, 1fr); } }
@media screen and (max-width: 600px) { .convenience .shoplist01 .li-item .detail-list { grid-template-columns: 1fr; } }

.shotenkai { color: #fff; }
.shotenkai .img08 { margin: 8rem auto 0 auto; max-width: 900px; }
.shotenkai .img08 .note { text-align: right; }
.shotenkai .shoplist { margin: 3rem auto 0 auto; max-width: 800px; display: grid; gap: 2rem; grid-template-columns: repeat(2, 1fr); }
.shotenkai .shoplist .li-item.li-l { grid-column: span 2; }
.shotenkai .shoplist .li-name { margin-top: 1rem; text-align: center; font-size: 1.7rem; padding-bottom: 1rem; border-bottom: solid 1px rgba(255, 255, 255, 0.5); }
.shotenkai .shoplist .li-name .txt-s { font-size: 80%; }
.shotenkai .shoplist .li-txt { margin-top: 1rem; display: grid; gap: .5rem; grid-template-columns: auto 1fr; font-size: 1.4rem; line-height: 1.8; }
@media screen and (max-width: 480px) { .shotenkai .shoplist { grid-template-columns: 1fr; }
  .shotenkai .shoplist .li-item { width: 90%; margin: 0 auto; }
  .shotenkai .shoplist .li-item.li-l { grid-column: span 1; width: 100%; } }

.peaceful .img12 { width: 90%; max-width: 800px; margin: 3rem auto 0 auto; }
.peaceful .img12 .note { margin: .5rem 0 0 0; }
.peaceful .pe01 .grid { margin: 3rem auto 0 auto; display: grid; gap: 2rem; grid-template-columns: 1fr 30%; }
.peaceful .pe01 .grid .img-box .img { border: solid 1px rgba(0, 0, 0, 0.5); }
.peaceful .pe01 .grid .img-box .note { text-align: right; margin-top: .5rem; }
.peaceful .loc-link { margin: 3rem auto 0 auto; }
.peaceful .loc-link a { display: block; position: relative; max-width: 460px; margin: 0 auto; padding: 1.5rem .5rem; text-align: center; color: #fff; background: #44696C; font-size: 2rem; line-height: 1.2; transition: .3s; }
.peaceful .loc-link a:hover { filter: brightness(120%); }
.peaceful .loc-link a:after { content: "▲"; font-size: 10px; position: absolute; z-index: 1; top: 50%; right: 1.5rem; transform: translateX(-50%) translateY(-50%) rotate(90deg); color: #fff; }
.peaceful .pe02 { width: 100%; max-width: 100%; }
.peaceful .pe02 .medi-list { margin: 3rem auto 0 auto; display: grid; gap: 2rem; grid-template-columns: repeat(4, 1fr); }
.peaceful .pe02 .medi-list .img14 { grid-column: span 2; grid-row: span 2; }
.peaceful .pe02 .medi-list .img14 .img { height: calc(100% - 4rem); }
.peaceful .pe02 .medi-list .img14 .img img { height: 100%; object-fit: cover; }
.peaceful .pe02 .medi-list .waku { border: solid 1px rgba(0, 0, 0, 0.5); padding: 10px; }
.peaceful .pe02 .medi-list .waku .name { margin-top: 1rem; }
.peaceful .pe02 .medi-list .waku .name:first-of-type { margin-top: 0; }
.peaceful .pe02 .medi-list .waku .txt { display: block; }
.peaceful .pe02 .medi-list .icon-area { position: absolute; bottom: 5px; left: 5px; display: inline-block; z-index: 2; }
.peaceful .pe02 .medi-list .icon { background: #44696C; color: #fff; font-size: 12px; line-height: 1; padding: 5px 10px; display: inline-block; margin-right: 5px; }
.peaceful .pe02 .medi-list .name { margin-top: .5rem; font-size: 1.4rem; line-height: 1.4; }
.peaceful .pe02 .medi-list .name .time { font-size: 90%; }
@media screen and (max-width: 1024px) { .peaceful .pe02 .medi-list { grid-template-columns: repeat(2, 1fr); }
  .peaceful .pe02 .medi-list .img14 { grid-column: span 2; grid-row: span 1; }
  .peaceful .pe02 .medi-list .img14 .img { height: auto; }
  .peaceful .pe02 .medi-list .img14 .img img { width: 100%; height: auto; object-fit: auto; } }
@media screen and (max-width: 600px) { .peaceful .img12 { margin: 3rem auto 0 0; }
  .peaceful .img12 .note { margin-left: calc(5% + 1rem); } }
@media screen and (max-width: 480px) { .peaceful .pe01 .grid { grid-template-columns: 1fr; }
  .peaceful .pe01 .grid .img-box { width: 80%; margin: 0 auto; }
  .peaceful .pe02 .medi-list { grid-template-columns: 1fr; }
  .peaceful .pe02 .medi-list .li-item { width: 80%; margin: 0 auto; }
  .peaceful .pe02 .medi-list .img14 { width: 100%; grid-column: span 1; }
  .peaceful .pe02 .medi-list .waku { width: 100%; } }

.healthy { max-width: 100%; }
.healthy .img16 { width: 90%; max-width: 800px; margin: 3rem auto 0 auto; }
.healthy .school { width: 100%; max-width: 100%; }
.healthy .school-list { margin: 3rem auto 0 auto; display: grid; gap: 2rem; grid-template-columns: repeat(4, 1fr); }
.healthy .school-list .img17 { grid-column: span 2; grid-row: span 2; }
.healthy .school-list .img17 .img { height: calc(100% - 4rem); }
.healthy .school-list .img17 .img img { height: 100%; object-fit: cover; }
.healthy .school-list .name { margin-top: .5rem; font-size: 1.4rem; line-height: 1.4; }
.healthy .school-list .name .time { font-size: 90%; }
.healthy .meimon { margin-top: 5rem; }
.healthy .meimon .maincopy { text-align: center; }
.healthy .meimon .img21 { max-width: 800px; margin: 3rem auto 0 auto; }
.healthy .meimon .img21 .note { margin-top: .5rem; text-align: right; }
.healthy .park { width: 100%; max-width: 100%; }
.healthy .park .img21 { margin: 3rem auto 0 auto; max-width: 800px; }
.healthy .park .img21 .note { text-align: right; }
.healthy .park .park-list { margin: 3rem auto 0 auto; display: grid; gap: 3rem; grid-template-columns: repeat(3, 1fr); }
.healthy .park .park-list .img .icon { width: 25%; position: absolute; top: -1rem; right: -1rem; z-index: 2; }
.healthy .park .park-list .name { margin-top: .5rem; font-size: 1.4rem; line-height: 1.4; }
.healthy .park .park-list .name .time { font-size: 90%; }
.healthy .park .park-list .point-list { margin-top: 1rem; display: grid; gap: .5rem; grid-template-columns: repeat(2, 1fr); }
.healthy .park .park-list .point-list .point { font-family: "Helvetica Neue", "Helvetica","Yu Gothic",  'Noto Sans JP', "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Meiryo", sans-serif; font-weight: normal; font-size: 1.2rem; line-height: 1.2; color: #fff; background: #BCB5AD; padding: .5rem; text-align: center; }
.healthy .park .park-list .point-list .point.etc { color: #222; background: none; text-align: left; }
.healthy .park .park-list .point-list + .note { margin-top: 1rem; }
@media screen and (max-width: 1024px) { .healthy .school-list { grid-template-columns: repeat(2, 1fr); }
  .healthy .school-list .img17 { grid-column: span 2; grid-row: span 1; }
  .healthy .school-list .img17 .img { height: auto; }
  .healthy .school-list .img17 .img img { width: 100%; height: auto; object-fit: auto; }
  .healthy .park .park-list { grid-template-columns: repeat(2, 1fr); } }
@media screen and (max-width: 600px) { .healthy .img16 { margin: 3rem 0 0 auto; }
  .healthy .park .park-list { grid-template-columns: 1fr; }
  .healthy .park .park-list .point-list { grid-template-columns: repeat(3, 1fr); } }
@media screen and (max-width: 480px) { .healthy { /*.school-list{
	grid-template-columns: 1fr;
	.li-item{
		width: 80%;
		margin: 0 auto;
	}
	.img17{
		width: 100%;
		grid-column: span 1;
	}
}*/ }
  .healthy .school-list { gap: 1rem; }
  .healthy .park .park-list .point-list { grid-template-columns: repeat(2, 1fr); } }

.leisure .leisure01 { margin: 3rem auto 0 auto; color: #fff; }
.leisure .leisure01 .li-name { margin-top: 1rem; text-align: center; font-size: 1.7rem; padding-bottom: 1rem; border-bottom: solid 1px rgba(255, 255, 255, 0.5); }
.leisure .leisure01 .li-name .txt-s { font-size: 80%; }
.leisure .leisure01 .li-txt { margin-top: 1rem; display: grid; gap: .5rem; grid-template-columns: auto 1fr; font-size: 1.4rem; line-height: 1.8; }
.leisure .leisure01 .li-icon-box { margin-top: 1rem; }
.leisure .leisure01 .li-icon-box .li-icon { display: inline-block; padding: .5rem 1rem; font-size: 1.1rem; line-height: 1.2; border: solid 1px rgba(255, 255, 255, 0.5); margin-right: 1rem; }
.leisure .leisure01 .li-icon-box .li-icon.etc { padding: 0; border: none; }
.leisure .leisure01 .li-icon-box + .note { margin-top: 1rem; }
.leisure .leisure01 .li01-list { margin: 3rem auto 0 auto; display: grid; gap: 3rem; grid-template-columns: repeat(2, 1fr); }
.leisure .leisure01 .li02 .img-list { display: grid; gap: 1rem; grid-template-columns: 38% 1fr; }
.leisure .leisure01 .li02 .img-list .img-item01 { grid-column: span 2; }
.leisure .leisure02 { margin: 10rem auto 0 auto; }
.leisure .leisure02 .img-list, .leisure .leisure02 .img-list2 { margin: 3rem auto 0 auto; display: grid; gap: 2rem; grid-template-columns: repeat(2, 1fr); }
.leisure .leisure02 .img-list .li-item .li-name, .leisure .leisure02 .img-list2 .li-item .li-name { margin-top: 1rem; font-size: 1.4rem; color: #fff; }
.leisure .leisure02 .img-list2 { margin-top: 2rem; max-width: 800px; }
.leisure .leisure02 .img-list2 .li-name { text-align: right; }
@media screen and (max-width: 1024px) { .leisure .leisure01 .li01-list { grid-template-columns: 1fr; } }
@media screen and (max-width: 864px) { .leisure .leisure02 .img-list { grid-template-columns: 1fr; } }