@import url("https://fonts.googleapis.com/css2?family=Audiowide&family=Righteous&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200..900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+JP&family=Zen+Maru+Gothic&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap");
@import url("https://fonts.googleapis.com/icon?family=Material+Icons");
@import url("https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined");
@import url(https://cdn-uicons.flaticon.com/2.6.0/uicons-thin-straight/css/uicons-thin-straight.css);
@import url("https://fonts.googleapis.com/css2?family=Limelight&family=Pacifico&display=swap");
body #wpadminbar {
top: auto;
bottom: 0;
position: fixed; }
.ff_Pacifico {
font-family: "Pacifico", serif; }
.ff_audio {
font-family: "Righteous", serif;
font-family: "Audiowide", serif; }
.ff_maru {
font-family: "Zen Maru Gothic", serif; }
.ff_goz {
font-family: "IBM Plex Sans JP", sans-serif; }
.ff-kiwi {
font-family: "Kiwi Maru", serif;
font-weight: 400;
font-style: normal; }
.ff-notosans {
font-family: "Noto Sans JP", sans-serif; }
.ff_m {
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto; }
html {
scroll-behavior: smooth; }
body {
font-size: 16px;
font-family: "Noto Sans JP", sans-serif;
font-weight: 500;
padding-top: 68px;
color: #3B4043; }
a {
text-decoration: none;
color: #444;
transition-duration: 0.3s; }
a:hover {
color: #d11; }
time {
font-family: Verdana, Geneva, "sans-serif"; }
.global-header {
position: fixed;
z-index: 99;
left: 0;
top: 0;
width: 100%;
height: 68px;
background: #fff;
box-shadow: 0 1px 5px #ccc;
padding: 8px 0;
font-size: 0.85em; }
.global-header .container {
display: flex;
justify-content: space-between;
width: 1600px;
max-width: 98%; }
.header-logo {
flex: 0 0 216px;
padding: 0 16px 0 0; }
.header-body {
flex: 1 1 auto;
display: flex;
justify-content: space-between; }
.header-menu {
flex: 0 0 auto;
padding: 0;
display: flex;
justify-content: center; }
.header-menu ul {
display: flex; }
.header-menu li {
display: flex;
position: relative; }
.header-menu li a {
white-space: nowrap;
display: flex;
align-items: center;
padding: 0 8px; }
.header-menu li ul {
position: absolute;
visibility: hidden;
top: 90%;
left: 8px;
background: #F6FE85;
min-width: 100%;
padding: 0 8px;
border: 1px solid #ccc;
border-top: 0;
border-right: 0;
transition-duration: 0.5s;
opacity: 0;
display: block; }
.header-menu li li {
width: 100%;
display: block;
border-bottom: 1px solid #ddd; }
.header-menu li li a {
display: block;
padding: 8px; }
.header-menu li:hover ul {
opacity: 1;
visibility: visible; }
.header-sub {
flex: 0 0 380px;
display: flex;
align-items: center;
justify-content: flex-end; }
.header-sub form {
flex: 0 0 130px;
padding: 0 4px;
position: relative;
font-size: 13px; }
.header-sub form input[type="text"] {
border: 1px solid #999;
width: 100%;
padding: 4px; }
.header-sub form input[type="text"]:focus::placeholder {
opacity: 0; }
.header-sub form input[type="submit"] {
position: absolute;
right: 8px;
top: 50%;
transform: translate(0, -50%);
width: 1.8em;
height: 80%;
text-indent: -9999px;
background: url(/_assets/images/common/i-search.png) no-repeat;
background-size: contain;
border: 0;
cursor: pointer; }
.header-sub .header-bus {
padding: 0 8px;
flex: 0 0 160px; }
.header-sub .header-bus a {
display: flex;
justify-content: center;
align-items: center;
background: #F6FE85;
border-radius: 8px;
padding: 6px 4px;
font-size: 0.9em; }
.header-sub .header-bus a:hover {
background: #f9f9c0;
color: #444; }
.header-sub .header-bus i {
flex: 0 0 40px;
padding: 0 8px 0 0;
line-height: 0; }
.header-sub .header-bus em {
white-space: nowrap; }
.header-sub ul {
display: flex;
justify-content: flex-end; }
.header-sub ul li {
flex: 0 0 30px;
padding: 0 4px; }
.header-hum {
display: none; }
.donationbtn {
position: fixed;
right: -2px;
top: 50%;
width: 64px;
line-height: 0;
z-index: 99; }
.donationbtn a {
display: block;
border-radius: 8px 0 0 8px;
box-shadow: 0 0 4px #ccc;
border: 2px solid #fff;
padding: 12px;
background: linear-gradient(90deg, #D2FF84 0%, #E2FDFF 100%);
transition-duration: 0.3s; }
.donationbtn a:hover {
background: linear-gradient(90deg, #D2FF84 0%, #E2FDFF 0%); }
.global-footer {
background-image: url(/_assets/images/common/otaru-bg2.jpg);
background-size: 300px;
background-attachment: fixed;
padding: 40px 0;
position: relative; }
.global-footer::after {
content: "";
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
background: rgba(235, 245, 255, 0.7);
left: 0;
top: 0; }
.global-footer .container {
background: rgba(255, 255, 255, 0.96);
padding: 40px;
border-radius: 16px;
text-align: center;
position: relative;
z-index: 2; }
.footer-logo {
margin-bottom: 16px; }
.footer-sub {
font-weight: 400; }
.footer-sub p {
padding-bottom: 1em; }
.footer-sub ul {
display: flex;
justify-content: center;
padding: 0 0 16px 0; }
.footer-sub ul li {
flex: 0 0 64px;
padding: 0 12px; }
.footer-menu ul {
display: flex;
flex-wrap: wrap;
justify-content: center;
font-size: 0.9em; }
.footer-menu li {
padding: 12px; }
.footer-copy {
padding-top: 40px;
font-size: 11px;
font-weight: 400; }
.opening {
position: fixed;
width: 100%;
height: 100%;
background: #fff;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
z-index: 9999;
top: 0;
left: 0; }
.opening h1 {
font-size: 24px;
letter-spacing: 0.25em; }
.top-kv {
position: relative;
box-shadow: 0 2px 4px #ddd;
margin-left: auto;
margin-right: auto;
background: #333; }
.top-kv .slick-next {
right: 32px; }
.top-kv .slick-prev {
left: 16px; }
.top-kv .slick-prev, .top-kv .slick-next {
z-index: 3; }
.top-kv .slick-prev::before, .top-kv .slick-next::before {
border-color: #ccc; }
.top-kv .slick-slide {
opacity: 0.35;
transition-duration: 1.0s; }
.top-kv .slick-slide img {
transition-duration: 10.0s; }
.top-kv .slick-current {
opacity: 1; }
.top-kv .slick-current img {
animation: totop 10.0s 0.4s forwards;
transform-origin: center; }
.top-kv .slick-current.kv3 img {
animation: tobottom 10.0s 0.3s forwards; }
@keyframes totop {
0% {
transform: scale(1) translateY(0); }
100% {
transform: scale(1.025) translateY(-60px); } }
@keyframes tobottom {
0% {
transform: scale(1) translateY(-60px); }
100% {
transform: scale(1.025) translateY(0px); } }
.top-kv-slider {
line-height: 0;
display: flex;
justify-content: center; }
.top-kv-slider p {
overflow: hidden;
position: relative;
height: 580px;
width: 1600px;
margin: auto; }
.top-kv-slider p img {
width: 100%;
object-fit: cover;
height: 640px;
margin: auto; }
.top-kv-slider p strong {
display: block;
white-space: nowrap;
line-height: 1.8;
position: absolute;
z-index: 10;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
color: #fff;
font-size: 1.6rem;
letter-spacing: 0.05em;
left: 50%;
top: 50%;
text-shadow: 0 1px 3px #333, 0 -1px 2px #555;
font-weight: 400; }
.top-kv-slider p.kv_yoko.kv_center strong {
transform: translate(-50%, -50%); }
.top-kv-slider p.kv_left strong {
left: 10%;
top: 10%; }
.top-kv-slider p.kv_right strong {
left: auto;
right: 10%;
top: 60%; }
.top-kv-slider p.kv_tate strong {
writing-mode: vertical-rl;
left: 30%;
top: 10%; }
.top-kv-event {
position: absolute;
right: 8px;
top: 8px;
font-size: 0.9em;
max-width: 50vw; }
.top-kv-event dl {
display: flex;
border-radius: 5px;
overflow: hidden;
margin-bottom: 1px; }
.top-kv-event dt {
flex: 0 0 8em;
text-align: center;
background: #3B6FB3;
color: #fff;
padding: 4px 8px;
display: flex;
justify-content: center;
align-items: center;
white-space: nowrap;
font-size: 0.9em; }
.top-kv-event dd {
flex: 1 1 auto;
padding: 6px 8px;
align-items: center;
background: #eee; }
.top-kv-event dd a {
display: flex;
align-items: center;
text-decoration: none; }
.top-kv-event dd time {
padding: 0 8px 0 0;
white-space: nowrap;
flex: 0 0 6.4em;
display: flex;
align-items: center;
justify-content: center; }
.top-kv-event dd time b {
display: inline-block;
font-family: "Audiowide", serif;
font-size: 1.8em;
transform: translateY(-20%); }
.top-kv-event dd time b:last-of-type {
transform: translateY(20%); }
.top-kv-event dd time i {
display: inline-block;
transform: skewX(-24deg) translateY(-16%); }
.top-kv-event dd time span {
display: inline-block;
transform: translateY(55%);
font-size: 0.8em;
padding-left: 4px; }
.top-kv-event dd em {
min-width: 25vw; }
.top-kv-event dl.top-kv-event-big dt {
background: #F9195B; }
.top-kv-event dl.top-kv-event-big dd {
background: #E1F52E; }
.top-kv-news {
position: absolute;
width: 90%;
max-width: 1200px;
left: 50%;
bottom: 8px;
transform: translateX(-50%);
background: rgba(245, 250, 255, 0.85);
padding: 16px 16px; }
.top-kv-news li a {
display: flex;
align-items: center;
line-height: 1.2; }
.top-kv-news li time {
padding-right: 1em;
font-weight: 400;
color: #555;
font-size: 0.8em; }
.top-pickup {
position: relative;
padding: 80px 0;
background: url(/_assets/images/common/otaru-bg1.jpg);
box-shadow: 0 4px 12px #ddd; }
.top-pickup::before, .top-pickup::after {
content: "";
display: block;
position: absolute;
width: 100%;
height: 40px;
left: 0;
background: url(/_assets/images/common/otaru-pat1.png) repeat-x bottom;
background-size: 400px;
opacity: 0.68;
z-index: 90; }
.top-pickup::before {
top: 0; }
.top-pickup::after {
bottom: 0;
background-image: url(/_assets/images/common/otaru-pat2.png);
background-position: top; }
.top-pickup b {
position: absolute;
display: flex;
writing-mode: vertical-rl;
justify-content: center;
align-items: flex-end;
z-index: 88;
left: 0;
top: 0;
width: 5em;
height: 100%;
padding-left: 8px;
background: linear-gradient(to Right, #fff 50%, rgba(255, 255, 255, 0.5) 80%, rgba(255, 255, 255, 0) 100%);
font-size: 1.5em;
color: #434341;
font-family: "Pacifico", serif;
font-family: "Limelight", serif;
font-weight: 400; }
.top-pickup b img {
width: 24px;
opacity: 0.8; }
.top-pickup b:last-of-type {
right: 0;
left: auto;
transform: scale(-1, -1); }
.top-pickup abbr {
position: absolute;
font-size: 10px;
z-index: 91;
display: block;
right: 0;
padding-right: 1rem; }
.top-pickup .container {
width: auto;
max-width: 100%; }
.top-pickup ul {
display: flex; }
.top-pickup .slick-list {
padding: 16px 0; }
.top-pickup li {
flex: 0 0 16.66666%;
max-width: 300px;
padding: 0 12px;
position: relative;
aspect-ratio: 1 / 1; }
.top-pickup li:nth-child(odd) {
transform: translateY(8px); }
.top-pickup li * {
transition: all 0.3s; }
.top-pickup li a {
position: relative;
display: flex;
border-radius: 50%;
overflow: hidden;
box-shadow: 0 1px 4px #777;
width: 100%;
aspect-ratio: 1 / 1; }
.top-pickup li i {
background: #3B6FB3;
line-height: 0;
aspect-ratio: 1 / 1; }
.top-pickup li i img {
aspect-ratio: 1 / 1;
object-fit: cover;
width: 100%; }
.top-pickup li em {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
padding: 16%;
font-size: 0.85em;
line-height: 1.3;
text-align: center;
color: #fff;
opacity: 0; }
.top-pickup li a:hover img {
opacity: 0.3; }
.top-pickup li a:hover em {
opacity: 1; }
.top-pickup li.new::before {
content: "New";
position: absolute;
right: 5%;
top: 5%;
z-index: 3;
display: inline-block;
font-family: "Zen Maru Gothic", serif;
background: #d11;
color: #fff;
font-size: 12px;
line-height: 1;
padding: 1px 6px 3px 6px;
transform: rotate(-16deg);
box-shadow: -1px 1px 1px #888; }
.top-wellness .container {
display: flex;
justify-content: space-between;
align-items: center; }
.top-wellness-img {
flex: 0 0 50%; }
.top-wellness-img ul {
display: flex;
flex-wrap: wrap; }
.top-wellness-img li {
line-height: 0;
flex: 0 0 50%; }
.top-wellness-img li:first-child {
flex: 0 0 100%; }
.top-wellness-txt {
flex: 0 0 50%;
padding: 24px;
text-align: center; }
.top-wellness-txt p {
padding-bottom: 1rem;
line-height: 2; }
.top-wellness-txt .btn-wrap {
padding-top: 12px; }
.top-wellness-txt a.btn {
display: block;
margin: 0 auto;
max-width: 480px;
padding-top: 16px;
padding-bottom: 16px; }
.newslist-wrap {
display: flex;
flex-wrap: wrap;
margin-bottom: 1rem; }
.newslist-wrap .slick-list {
width: 100%; }
.newslist {
flex: 0 0 25%;
min-width: 240px;
padding: 24px; }
.newslist a {
display: block;
text-decoration: none; }
.newslist i {
display: block;
aspect-ratio: 1 / 1;
overflow: hidden;
line-height: 0;
background: #fff; }
.newslist i img {
aspect-ratio: 1 / 1;
object-fit: cover;
width: 100%; }
.newslist time {
display: block;
padding: 8px 0 0;
font-weight: 400;
font-size: 12px;
text-decoration: none; }
.newslist em {
padding-top: 8px;
font-size: 0.9em;
line-height: 1.3;
display: block; }
.top-news .newslist {
padding-top: 0; }
.top-news .newslist a {
color: #fff; }
.top-news .newslist a:hover {
opacity: 0.8; }
.top-news .newslist time {
color: #E1E7EF; }
.top-news a.btn, .top-news .btn {
color: #fff;
border-color: #fff; }
.top-news a.btn::after, .top-news .btn::after {
border-color: #fff; }
.top-news a.btn:hover, .top-news .btn:hover {
background: none; }
.facilitylist {
display: flex;
justify-content: space-between;
flex-wrap: wrap; }
.facilitylist::after {
width: 17%;
content: ""; }
.facilitylist::before {
width: 17%;
content: "";
order: 10; }
.facilitylist li {
flex: 0 0 17%;
padding: 0 0 2em;
text-align: center; }
.facilitylist li a {
text-decoration: none;
position: relative;
display: block; }
.facilitylist li span {
position: absolute;
left: -4px;
top: 2px;
background: #F6FE85;
display: inline-flex;
align-items: center;
padding: 0 3px 1px 3px;
font-size: 11px;
color: #111;
box-shadow: 0 1px 1px #333;
height: 18px; }
.facilitylist li span::before {
position: absolute;
content: "";
display: block;
width: 4px;
height: 3px;
clip-path: polygon(0 0, 100% 0, 100% 100%);
background: #333;
left: 0px;
top: 18px; }
.facilitylist li i {
display: block;
aspect-ratio: 1 / 1;
overflow: hidden;
margin-bottom: 0.5em; }
.facilitylist li i img {
aspect-ratio: 1 / 1;
object-fit: cover;
transition: all 0.3s; }
.facilitylist li em {
font-size: 0.9em; }
.facilitylist li a:hover i img {
scale: 1.1; }
.top-event {
position: relative; }
.top-event::before {
content: "";
display: block;
position: absolute;
width: 100%;
height: 28px;
left: 0;
top: 0;
background: url(/_assets/images/common/otaru-pat1.png) repeat-x bottom;
background-size: 200px;
opacity: 0.68; }
.eventlist-wrap {
padding-bottom: 2rem; }
.event-list {
display: flex;
border-bottom: 1px solid #999; }
.event-date {
padding: 1rem 0;
flex: 0 0 8em; }
.event-date time {
padding: 0 0 8px 0;
white-space: nowrap;
flex: 0 0 8em;
display: flex;
align-items: center;
justify-content: center; }
.event-date time b {
display: inline-block;
font-family: "Audiowide", serif;
font-size: 2em;
transform: translateY(-20%); }
.event-date time b:last-of-type {
transform: translateY(20%); }
.event-date time i {
display: inline-block;
transform: skewX(-24deg) translateY(-16%); }
.event-date time span {
display: inline-block;
transform: translateY(55%);
font-size: 0.9em;
padding-left: 4px; }
.event-date em {
background: #3B6FB3;
color: #fff;
font-size: 12px;
display: block;
text-align: center; }
.event-body {
flex: 1;
padding-bottom: 8px; }
.event-body .event {
display: flex;
align-items: flex-start;
padding: 16px 24px; }
.event-body .event-place {
flex: 0 0 100px;
padding-top: 8px; }
.event-body .event-place time {
background: #EF914A;
color: #fff;
padding: 4px 4px;
font-size: 12px;
text-align: center;
display: block;
flex: 0 0 110px;
margin-top: 8px;
line-height: 1.4; }
.event-body .event-place em {
background: #3B6FB3;
color: #fff;
font-size: 12px;
display: block;
text-align: center;
padding: 4px 4px;
white-space: nowrap;
margin-bottom: 4px;
line-height: 1.4; }
.event-body .event-txt {
padding-left: 16px;
flex: 1; }
.event-body .event-txt h3 {
font-size: 1.2em; }
.event-body .event-txt p {
padding-top: 0.7em;
padding-bottom: 0;
line-height: 1.4;
font-size: 0.9em; }
.event-body .event-txt img {
max-width: 240px;
float: right;
margin-left: 1em; }
.event-body .event-txt img.alignleft,
.event-body .event-txt img.alignnone {
float: left;
margin-right: 1em;
margin-left: 0; }
.event-body .event-txt img.emoji {
float: none;
margin-left: 0; }
.top-access {
background-image: url(/_assets/images/top/bg-access.png);
background-size: cover; }
.access-lead {
text-align: center;
padding-bottom: 2rem; }
.access-lead p {
text-align: left;
display: inline-block; }
.access-wrap {
display: flex;
justify-content: flex-start; }
.access-map {
flex: 0 0 40%;
padding-right: 2rem; }
.access-map img {
cursor: pointer; }
.access-btn h4 {
margin-bottom: 1em; }
.access-btn ul {
padding-bottom: 24px; }
.access-btn li {
padding-bottom: 8px; }
.access-btn li a {
display: inline-block;
text-decoration: none;
min-width: 240px;
padding: 24px 40px;
border: 1px solid #333;
color: #333;
position: relative;
transition-duration: 0.3s;
line-height: 1.2; }
.access-btn li a:hover {
border-color: #d11;
background: #fff; }
.access-btn li a::after {
content: "";
position: absolute;
right: 24px;
top: 50%;
display: block;
width: 0.7em;
height: 0.7em;
border-right: 1px solid #333;
border-top: 1px solid #333;
transform: rotate(45deg) translateY(-50%);
transition-duration: 0.3s; }
.access-btn li a:hover::after {
right: 20px;
border-color: #d11; }
.access-btn p {
padding-bottom: 40px; }
.access-btn blockquote {
margin-top: 40px;
background: #FAFAF0;
padding: 16px;
border: 1px solid #777; }
.access-btn blockquote a {
display: block;
overflow: hidden;
text-decoration: none; }
.access-btn blockquote b {
font-size: 1.2em; }
.access-btn blockquote small {
text-decoration: underline;
display: block;
padding: 8px 0; }
.access-btn blockquote img {
float: left;
width: 160px;
margin: 0 8px 0 0; }
.access-btn blockquote span {
font-size: 0.85em; }
.access-btn blockquote p {
padding-bottom: 0; } .wellnesstown-kv {
position: relative;
background: #123; }
.wellnesstown-kv h1 {
font-size: 2.5rem;
color: #fff;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
text-shadow: 0 -1px 3px #222, 0 1px 3px #222;
white-space: nowrap;
font-feature-settings: "palt"; }
.wellnesstown-kv-grid {
display: grid;
grid-template-columns: 20% 20% 20% 20% 20%;
grid-auto-rows: 1fr 1fr;
opacity: 0.8; }
.wellnesstown-kv-grid p {
overflow: hidden;
line-height: 0; }
.wellnesstown-kv-grid img {
object-fit: cover;
width: 100%;
height: 100%; }
.wellnesstown-kv-grid p.wellnesstown-kv01 {
grid-row: 1 / 3; }
.wellnesstown-kv-grid p.wellnesstown-kv01 img {
max-height: none; }
.wellnesstown-kv-grid p.wellnesstown-kv03 {
grid-column: 3 / 5; }
.wellnesstown-kv-grid-1 {
display: block; }
.wellnesstown-kv-grid-1 p.wellnesstown-kv01 {
aspect-ratio: 18 / 5; }
.wellnesstown-kv-grid-2 {
grid-template-columns: 50% 50%;
grid-template-rows: 30vw; }
.wellnesstown-kv-grid-2 p.wellnesstown-kv01 {
grid-column: 1 / 2;
grid-row: 1 / 2; }
.wellnesstown-kv-grid-2 p.wellnesstown-kv02 {
grid-column: 2 / 3;
grid-row: 1 / 2; }
.wellnesstown-kv-grid-3 {
grid-template-columns: 33% 34% 33%;
grid-template-rows: 30vw; }
.wellnesstown-kv-grid-3 p.wellnesstown-kv01 {
grid-column: 1 / 2;
grid-row: 1 / 2; }
.wellnesstown-kv-grid-3 p.wellnesstown-kv02 {
grid-column: 2 / 3;
grid-row: 1 / 2; }
.wellnesstown-kv-grid-3 p.wellnesstown-kv03 {
grid-column: 3 / 4;
grid-row: 1 / 2; }
.wellnesstown-kv-grid-4 {
grid-template-columns: 50% 50%;
grid-template-rows: 30vw 30vw; }
.wellnesstown-kv-grid-4 p img {
max-height: none; }
.wellnesstown-kv-grid-4 p.wellnesstown-kv01 {
grid-column: 1 / 2;
grid-row: 1 / 2; }
.wellnesstown-kv-grid-4 p.wellnesstown-kv02 {
grid-column: 2 / 3;
grid-row: 1 / 2; }
.wellnesstown-kv-grid-4 p.wellnesstown-kv03 {
grid-column: 1 / 2;
grid-row: 2 / 3; }
.wellnesstown-kv-grid-4 p.wellnesstown-kv04 {
grid-column: 2 / 3;
grid-row: 2 / 3; }
.wellnesstown-kv-grid-5 {
grid-template-columns: 25% 25% 25% 25%; }
.wellnesstown-kv-grid-5 p.wellnesstown-kv05 {
grid-column: 3 / 5; }
.wellnesstown-kv-grid-6 p.wellnesstown-kv05 {
grid-column: 2 / 4; }
.wellnesstown-kv-grid-6 p.wellnesstown-kv06 {
grid-column: 4 / 6; }
.wellnesstown-kv-grid-7 p.wellnesstown-kv07 {
grid-column: 4 / 6; }
.wellnesstown-kv-grid-9 p.wellnesstown-kv03 {
grid-column: 3 / 4; }
.wellnesstown-kv-grid-10 p.wellnesstown-kv01 {
grid-row: 1 / 2; }
.wellnesstown-kv-grid-10 p.wellnesstown-kv01 img {
max-height: 20vw; }
.wellnesstown-kv-grid-10 p.wellnesstown-kv03 {
grid-column: 3 / 4; }
.wellnesstown-lead p {
line-height: 2; }
.wellnesstown-lead ul {
display: flex;
justify-content: space-around;
padding-top: 2em;
flex-wrap: wrap; }
.wellnesstown-lead ul::after {
content: "";
width: 28%; }
.wellnesstown-lead ul::before {
content: "";
width: 28%;
order: 10; }
.wellnesstown-lead li {
flex: 0 0 28%;
text-align: center;
margin-bottom: 2rem; }
.wellnesstown-lead li em {
display: inline-block; }
.village-lead {
display: flex;
justify-content: space-between;
padding-bottom: 3rem; }
.village-lead-ph {
flex: 0 0 32%; }
.village-lead-ph img {
border: 8px solid #fff;
box-shadow: 0 1px 4px #ccc;
height: 100%;
object-fit: cover; }
.village-lead-tx {
line-height: 2;
flex: 0 0 66%; }
.village-works {
display: flex;
justify-content: space-between;
padding: 0 0 4rem; }
.village-works .slick-track {
display: flex; }
.village-works .slick-slide {
height: auto !important; }
.village-work-wrap {
padding: 0 8px; }
.slick-initialized .village-work,
.village-work {
padding: 16px;
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between; }
.slick-initialized .village-work h3,
.village-work h3 {
text-align: center;
padding: 0 8px 16px;
font-size: 1.2em; }
.slick-initialized .village-work figure,
.village-work figure {
overflow: hidden;
aspect-ratio: 8 / 5; }
.slick-initialized .village-work figure a,
.village-work figure a {
display: block; }
.slick-initialized .village-work figure img,
.village-work figure img {
width: 100%;
aspect-ratio: 8 / 5;
object-fit: cover;
transition-duration: 0.3s; }
.slick-initialized .village-work figure a:hover img,
.village-work figure a:hover img {
scale: 1.1; }
.slick-initialized .village-work p,
.village-work p {
font-size: 0.85em;
padding: 8px 0;
font-weight: 400;
line-height: 1.8; }
.content-page {
padding-top: 40px;
line-height: 2; }
.content-body {
overflow: hidden; }
.content-body p {
line-height: 2;
padding-bottom: 2.5em; }
.content-body h2 {
font-size: 1.4em;
margin-top: 2em;
margin-bottom: 1em;
line-height: 1.3; }
.content-body h3 {
font-size: 1.2em;
margin-top: 2em;
margin-bottom: 1em;
line-height: 1.3; }
.content-body figure {
padding: 0 0 2em; }
.content-body .wp-caption-text {
font-size: 0.8em;
text-align: center; }
.content-body hr {
clear: both;
margin: 0;
height: 2em;
opacity: 0; }
.content-body .alignright {
float: right;
max-width: 48%;
margin-left: 2%;
margin-bottom: 1rem;
text-align: center; }
.content-body .alignleft {
float: left;
max-width: 48%;
margin-right: 2%;
margin-bottom: 1em;
text-align: center; }
.content-body .aligncenter {
text-align: center;
margin: auto; }
.content-page .content-body h2 {
border-left: 7px solid #123;
border-bottom: 1px solid #123;
padding-left: 5px;
padding-bottom: 2px; }
.content-page .content-body p em {
display: inline-block;
background: #3B6FB3;
color: #fff;
font-size: 0.9em;
padding: 1px 8px; }
.content-page .wsp-container {
float: left;
width: 33%;
padding: 2rem; }
.content-page .wsp-container h2 {
padding: 0;
border: 0;
font-size: 1em;
margin-top: 0; }
.page-ai_chatbots .container {
width: 980px; }
.page-ai_chatbots .content-body p {
padding-bottom: 1rem; }
.page-ai_chatbots .content-body li {
list-style-type: disc;
list-style-position: outside;
margin-left: 1em; }
.content-navi {
display: flex;
justify-content: center; }
.content-navi a {
display: inline-block;
padding: .5rem 2rem;
border: 1px solid #3B6FB3;
margin-right: 1rem;
text-decoration: none;
position: relative;
background: #3B6FB3;
color: #fff; }
.content-navi a::after {
content: "";
display: inline-block;
width: 8px;
height: 8px;
border: 1px solid #fff;
border-top: 0;
border-left: 0;
transform: rotate(45deg) translate(4px, -8px); }
.content-navi a:hover {
background: #fff;
color: #3B6FB3; }
.content-navi a:hover::after {
border-color: #3B6FB3; }
.single-lob .content-body p,
.single-info .content-body p {
padding-bottom: 1rem; }
.single-lob .content-body ul.battr,
.single-info .content-body ul.battr {
padding-bottom: 1rem; }
.single-lob .content-body ul.battr li,
.single-info .content-body ul.battr li {
font-size: 0.9em; }
.lobtable {
border-top: 1px solid #ddd;
border-bottom: 1px solid #fff; }
.lobtable th,
.lobtable td {
vertical-align: top;
padding: 8px;
border-top: 1px solid #fff;
border-bottom: 1px solid #ddd; }
.lobtable th {
text-align: right; }
.pagination {
padding: 2em 0; }
.pagination ul {
display: flex;
justify-content: center;
flex-wrap: wrap; }
.pagination li {
padding: 8px; }
.pagination li span, .pagination li a {
display: flex;
justify-content: center;
align-items: center;
width: 2em;
height: 2em;
border-radius: 50%;
line-height: 1;
padding-bottom: 2px;
font-family: "Zen Maru Gothic", serif;
font-weight: 600; }
.pagination li span.current {
background: #3B6FB3;
color: #fff; }
.nav-links {
display: flex;
justify-content: center;
flex-wrap: wrap; }
.nav-links span, .nav-links a {
margin: 8px;
display: flex;
justify-content: center;
align-items: center;
width: 2em;
height: 2em;
border-radius: 50%;
line-height: 1;
padding-bottom: 2px;
font-family: "Zen Maru Gothic", serif;
font-weight: 600; }
.nav-links span.current {
background: #3B6FB3;
color: #fff; }
.single-2column {
display: flex;
justify-content: space-between;
margin: auto;
max-width: 1240px; }
.content-news {
flex: 0 0 76%;
padding: 40px;
margin: 0 auto; }
.content-news .title-wrap {
text-align: left;
border-bottom: 1px dashed #3B4043;
padding-bottom: 1em; }
.content-news .title-wrap time {
font-size: 12px;
padding-right: 2em;
font-size: 0.8em; }
.content-news .title-wrap ul {
display: inline-flex; }
.content-news .title-wrap li {
font-size: 0.8em;
padding: 0 1em 0 0; }
.content-news .title-wrap li a {
color: #3B6FB3; }
.content-news .title-wrap h1 {
padding-top: 8px; }
.content-news .content-body {
padding-bottom: 40px; }
.content-news table {
border-collapse: collapse; }
.content-news th, .content-news td {
padding: 8px;
border: 1px solid #eee; }
.content-news th {
background: #3B6FB3;
color: #fff; }
.Navi-Pre-Next {
border-top: 1px dashed #777;
padding: 40px 0;
display: flex;
font-size: 0.9em; }
.Navi-Pre-Next br {
display: none; }
.Navi-Pre-Next p {
flex: 0 0 48%;
overflow: hidden;
padding: 0; }
.Navi-Pre-Next p.Navi-Next {
text-align: right; }
.side {
flex: 0 0 24%;
padding: 40px 16px; }
.side .container {
width: auto;
position: sticky;
top: 64px; }
.side h3 {
padding: 0 0 1em; }
.side-news {
font-size: 0.85em;
padding: 1em 0;
border-bottom: 1px dotted #ccc;
line-height: 1.2; }
.side-news a {
display: grid;
grid-template-columns: 30% 70%;
grid-template-rows: auto 1fr; }
.side-news a i {
grid-column: 1 / 2;
grid-row: 1 / 3;
padding-right: 8px; }
.side-news a i img {
width: 100%;
aspect-ratio: 1 / 1;
object-fit: cover; }
.side-news a time {
font-size: 11px;
padding-bottom: 4px; }
.related {
border-top: 1px solid #777;
padding: 40px 0 0; }
.related .newslist {
flex: 0 0 33%; }
.pagetopbtn {
position: sticky;
bottom: 8px;
text-align: right;
z-index: 40; }
.pagetopbtn a {
position: absolute;
right: 4px;
bottom: 0;
display: inline-flex;
align-items: center;
justify-content: center;
white-space: nowrap;
width: 3.5em;
height: 3.5em;
border-radius: 50%;
background: #eee;
font-size: 0.8em;
text-align: center; }
.pagetopbtn i {
display: block;
width: 1.2em;
height: 0.6em;
clip-path: polygon(0 100%, 50% 0, 100% 100%);
background: #555;
margin-bottom: 0.253em; }
.pagetopbtn a:hover {
background: #3B6FB3; }
.pagetopbtn a:hover i {
background: #F5FAFF; }
.calendar-nav {
display: flex;
justify-content: space-between;
align-items: flex-end;
font-size: 0.9em;
padding: 0 0 16px;
line-height: 1.1; }
.calendar-nav h2 {
text-align: center;
font-size: 2em; }
.calendar-header {
border-bottom: 1px solid #222; }
.archive-facility h3 {
padding-bottom: 8px; }
.facility-wrap {
padding-bottom: 2rem; }
.facility {
display: flex;
padding: 40px;
background: #fcfcff; }
.facility:nth-child(odd) {
background: #fcfffc; }
.facility-cat {
position: absolute;
left: 0;
top: 0;
line-height: 0; }
.facility-cat i {
font-size: 13px;
background: #3B6FB3;
color: #fff;
padding: 4px 4px;
display: block;
line-height: 1; }
.facility-ph {
position: relative;
flex: 0 0 200px; }
.facility-ph figure {
aspect-ratio: 1 / 1; }
.facility-ph img {
aspect-ratio: 1 / 1;
width: 100%;
height: 100%;
object-fit: cover; }
.facility-tx {
padding-left: 24px; }
.facility-tx h2 {
font-size: 1.3em;
padding-bottom: 0.7em; }
.facility-tx p {
font-weight: 400;
font-size: 0.9em;
line-height: 2; }
.facility-tx blockquote {
display: none;
float: right;
max-width: 500px;
margin-left: 2rem;
font-family: serif;
background: #f4f8fc;
padding: 8px; }
.facility-tx blockquote strong {
display: block;
text-align: center; }
.facility-tx blockquote p {
padding: 0;
white-space: nowrap; }
.searchlist {
padding: 16px 0;
border-bottom: 1px dashed #ccc; }
.searchlist a {
display: flex;
text-decoration: none;
align-items: center; }
.searchlist a:hover {
text-decoration: underline; }
.searchlist i {
flex: 0 0 100px; }
.searchlist span {
padding: 0 16px;
font-weight: 400;
line-height: 1.4;
font-size: 0.9em; }
.searchlist span em {
font-weight: 600;
font-size: 1.1em;
display: inline-block;
padding-bottom: 8px; }
.searchlist time {
display: block;
font-size: 12px;
text-decoration: none; }
.sharedaddy {
padding: 0 1px; }
.page-sitemap .wsp-container ul {
display: flex;
flex-wrap: wrap; }
.page-sitemap .wsp-container li {
padding: 0 16px 0 0;
line-height: 1.4;
font-size: 0.9em;
min-width: 25%; }
.page-sitemap .wsp-container li br {
display: none; }
.page-sitemap .wsp-container li ul {
display: contents; }
.page-sitemap .wsp-container li a {
padding: 8px 0 0;
display: inline-block; }
.archive-info .title-wrap {
margin-bottom: 1rem; }
.info-lead {
padding-bottom: 2rem;
text-align: center; }
.info-lead p {
text-align: left;
display: inline-block; }
.info-lead .kakomi {
display: block;
padding: 1rem;
background: #fff;
border-radius: 8px;
box-shadow: inset 0 2px 4px #ddd; }
.info-lead .kakomi p {
padding-bottom: 0; }
.info-index {
padding: 1rem 0 0; }
.info-index ul {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
font-size: 1.1em; }
.info-index li {
flex: 0 0 49%;
margin-bottom: 2%;
border-radius: 8px 8px 0 0;
border: 1px solid #b1e7f1;
background: #fff;
overflow: hidden; }
.info-index li a {
text-decoration: none;
display: flex;
align-items: center;
justify-content: center;
padding: .5rem;
text-align: center;
background: #b1e7f1; }
.info-index li a span {
margin-right: 4px; }
.info-index li ul {
font-size: 0.75em;
padding: 8px 8px 2rem; }
.info-index li li {
flex: 0 0 49%;
padding: 8px;
border: 0;
margin: 0;
border-bottom: 1px dashed #ddd; }
.info-index li li a {
padding: 0;
background: none;
text-align: left;
justify-content: flex-start; }
.info-index li li a::before {
content: "";
display: inline-block;
width: 6px;
height: 6px;
border-right: 1px solid #444;
border-bottom: 1px solid #444;
transform: rotate(-45deg);
margin-right: 6px; }
.info-index li li a:hover::before {
margin-left: 2px; }
.info-navi {
margin-bottom: 4rem; }
.info-navi ul {
display: flex;
justify-content: center;
flex-wrap: wrap;
position: relative;
font-size: 0.95em; }
.info-navi li {
padding: 0 .5rem; }
.info-navi li a {
text-decoration: none;
display: inline-block;
padding: 4px 16px;
border-radius: 24px;
background: #f0f0f0;
color: #888; }
.info-navi li a:hover {
background: #fff;
color: #222; }
.info-navi li ul {
opacity: 0;
visibility: hidden;
transition-duration: 0.5s;
position: absolute;
left: 0;
top: 110%;
width: 100%; }
.info-navi li li a {
background: none;
color: #555; }
.info-navi li li a:hover {
text-decoration: underline; }
.info-navi li li.current {
font-weight: 800; }
.info-navi li li.current a {
color: #111; }
.info-navi li.current a,
.info-navi li:has(.current) a {
background: #b1e7f1;
color: #111; }
.info-navi li.current ul,
.info-navi li:has(.current) ul {
opacity: 1;
visibility: visible; }
.info-navi li.current li a,
.info-navi li:has(.current) li a {
background: none; }
.bcat-navi {
padding-top: 3rem;
margin-bottom: 2rem; }
.bcat-navi li {
font-size: 0.9em;
padding: 8px; }
.infolist-wrap {
overflow: auto; }
.infolist {
border-collapse: collapse;
font-size: 0.9em;
min-width: 100%; }
.infolist th, .infolist td {
padding: 8px; }
.infolist th {
background: #379CEC;
color: #fff;
border: 1px solid #fff;
white-space: nowrap; }
.infolist td {
background: #f9f9f9;
border: 1px solid #ccc;
border-bottom: 1px solid #888;
min-width: 12em; }
.infolist td b {
display: block;
color: #d23; }
.infolist td p:last-child {
padding-bottom: 0; }
.infolist ul.battr {
padding-top: 8px; }
.infolist ul.battr li {
font-size: 0.8em; }
.lob-index ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between; }
.lob-index li {
flex: 0 0 50%;
padding: 8px;
font-size: 0.9em; }
.lob-index li a {
text-decoration: none;
display: flex;
align-items: center;
justify-content: flex-start;
padding: .5rem;
border: 1px solid #999;
background: #fff;
border-radius: 8px; }
.lob-index li a span {
margin-right: 4px; }
.lob-index li a:hover {
background: #f3feff; }
.ai_banner {
text-align: center;
background: #fff;
margin-top: 2rem; }
.ai_banner a {
display: block;
width: 800px;
max-width: 100%;
margin: 0 auto; }
.kiyaku {
padding: 1px 1.5rem 1rem;
background: #fff;
font-size: 0.85em;
border-radius: 8px;
box-shadow: inset 0 3px 4px #ccc;
max-height: 50vh;
overflow: auto; }
.kiyaku h3 {
margin-top: 1em;
margin-bottom: 8px;
font-size: 1.1em; }
.kiyaku h3.fs16 {
font-size: 1.4em;
margin-top: 2em;
margin-bottom: 1em; } @media screen and (max-width: 1600px) {
.top-kv-slider p {
width: 92vw;
max-width: 100%; } }
@media screen and (max-width: 1180px) {
.global-header {
padding: 0;
height: auto;
width: 100%; }
.global-header .container {
max-width: 100%;
background: #fff; }
.header-logo {
z-index: 6;
background: #fff;
flex: 1 1 auto;
padding: 8px; }
.header-body {
visibility: hidden;
opacity: 0;
display: flex;
flex-direction: column;
justify-content: flex-start;
transform: translateX(100%);
transition: all 0.8s cubic-bezier(0.68, -0.55, 0.27, 1.55);
padding: 0;
position: absolute;
width: 100%;
height: 100vh;
overflow: scroll;
left: 0;
top: 0;
z-index: 5;
background: #fff;
padding: 80px 0 0; }
.header-menu {
display: block;
order: 2;
text-align: left;
padding: 0 0 24px; }
.header-menu ul {
display: block;
text-align: left;
padding: 0; }
.header-menu li {
display: block;
padding: 8px;
border-bottom: 1px dashed #ccc; }
.header-menu li a {
display: block;
padding: 16px; }
.header-menu li ul {
display: block;
position: static;
border: 0;
background: #fcfcfc;
visibility: visible;
opacity: 1; }
.header-menu li ul li {
border: 0;
padding: 0; }
.header-menu li ul li a {
padding: 8px 24px; }
.header-sub {
display: contents; }
.header-sub form {
order: 1;
flex: 0 0 auto;
padding: 0 8px; }
.header-sub form input[type="text"] {
padding: 8px; }
.header-sub form input[type="submit"] {
right: 16px;
top: 55%; }
.header-sub .header-bus {
order: 3;
flex: 0 0 auto; }
.header-sub .header-bus a {
padding: 24px;
display: inline-flex; }
.header-sub ul {
order: 4;
padding: 16px 0;
justify-content: flex-start; }
.header-sub ul li {
flex: 0 0 64px;
padding: 0 12px; }
.header-hum {
display: flex;
align-items: center;
z-index: 6;
position: relative;
line-height: 1;
text-align: center;
background: #fff;
padding: 8px; }
.header-hum a {
display: block; }
.header-hum span {
position: relative;
display: block;
height: 23px; }
.header-hum span i {
width: 100%;
min-width: 32px;
height: 3px;
display: block;
border-radius: 4px;
background: #333;
position: absolute;
left: 0;
transition-duration: 0.4s; }
.header-hum span i:nth-child(1) {
top: 0; }
.header-hum span i:nth-child(2) {
top: calc(50% - 1.5px); }
.header-hum span i:nth-child(3) {
bottom: 0; }
.header-hum em {
font-weight: 400;
font-size: 10px;
white-space: nowrap;
color: #333;
display: block;
padding: 6px 0 0;
letter-spacing: -0.1em; }
.header-menu-active {
overflow: hidden; }
.header-menu-active .header-body {
visibility: visible;
opacity: 1;
transform: translateX(0); }
.header-menu-active .header-hum span i {
top: calc(50% - 2px); }
.header-menu-active .header-hum span i:nth-child(1) {
transform: rotate(45deg); }
.header-menu-active .header-hum span i:nth-child(2) {
opacity: 0; }
.header-menu-active .header-hum span i:nth-child(3) {
transform: rotate(-45deg); }
.top-wellness-img {
flex: 0 0 43%; }
.top-wellness-txt {
flex: 0 0 54%;
padding: 0; }
.access-map {
flex: 0 0 45%; }
.newslist {
flex: 0 0 33%; }
.content-news {
padding: 40px; }
.side-news a {
display: block; }
.side-news a i {
display: block;
overflow: hidden;
aspect-ratio: 16 / 9; }
.side-news a i img {
aspect-ratio: 16 / 9;
object-fit: cover; }
.side-news a time {
display: block; } }
@media screen and (min-height: 840px) {
.top-kv-slider p {
height: 64vw;
max-height: 800px; }
.top-kv-slider p img {
height: calc(64vw + 60px);
max-height: 860px; } }
@media screen and (max-width: 980px) {
.top-kv-slider p {
height: 56vw;
width: 100vw; }
.top-kv-slider p img {
height: calc(56vw + 60px); }
.top-kv-slider p strong {
font-size: clamp(1rem, 3vw, 1.4rem); }
.top-pickup {
padding: 40px 0 24px; } }
.sp {
display: none; }
@media screen and (max-width: 768px) {
.pc {
display: none; }
.sp {
display: block; }
br.sp {
display: inline; }
.top-kv {
background: #fff;
padding: 0 0 8px; }
.top-kv-event {
position: static;
max-width: 100%;
margin: auto;
padding: 8px; }
.top-kv-news {
position: static;
margin: auto;
width: auto;
margin: 0 8px;
transform: translate(0, 0); }
.donationbtn {
width: 44px; }
.donationbtn a {
padding: 8px; }
.content {
padding: 8vw 0; }
.top-pickup {
padding: 72px 0 24px; }
.top-pickup ul {
overflow-x: scroll;
padding-bottom: 16px; }
.top-pickup li {
flex: 0 0 33%; }
.top-pickup b {
transform: rotate(-90deg) translate(0, -50%);
transform-origin: left top;
background: none;
width: 1em;
height: auto;
left: 50%;
top: 78px;
padding: 0; }
.top-pickup b img {
width: 18px; }
.top-pickup b:last-of-type {
display: none; }
.top-pickup abbr {
bottom: 40px; }
.top-wellness .container {
flex-direction: column-reverse; }
.top-wellness-txt {
padding-bottom: 4vw; }
.facilitylist li {
flex: 0 0 31%; }
.facilitylist::before, .facilitylist::after {
width: 31%; }
.newslist {
flex: 0 0 50%; }
.top-news .slick-prev, .top-news .slick-next {
top: 40%; }
.event-list {
padding: 16px 0 0; }
.event-date {
padding: 0; }
.event-body .event {
flex-wrap: wrap;
padding: 0 16px 16px; }
.event-body .event-place {
flex: 0 1 auto;
display: flex;
align-items: flex-end;
flex-wrap: wrap; }
.event-body .event-place em {
margin-right: 4px; }
.event-body .event-place time {
margin-top: 0;
margin-bottom: 4px; }
.event-body .event-txt {
flex: 0 0 100%;
padding: 8px 0; }
.access-map {
flex: 0 0 55%; }
.access-btn {
word-break: break-all; }
.access-btn blockquote img {
float: none;
width: auto;
margin: 0 0 1em; }
.wellnesstown-kv-grid img {
max-height: 100vh; }
.wellnesstown-lead ul {
display: block;
text-align: center; }
.wellnesstown-lead ul li {
padding: 0 0 1em; }
.village-lead {
display: block; }
.village-lead-ph {
margin-bottom: 1rem; }
.village-works .slick-prev {
left: -8px; }
.village-works .slick-next {
right: 0; }
.single-2column {
display: block; }
.content-news {
padding: 4vw; }
.side-news a {
display: grid; }
.facility {
padding: 24px; }
.facility-ph {
flex: 0 0 20%; }
.info-index li ul {
display: block; }
.info-navi ul {
justify-content: flex-start; }
.info-navi li {
margin-bottom: 1rem;
padding: 0 8px 0 0; }
.info-navi li ul {
overflow: auto;
flex-wrap: nowrap;
white-space: nowrap;
top: 100%; }
.info-navi li li {
padding: 0; } }
@media screen and (max-width: 640px) {
.opening h1 {
font-size: 20px; }
.title-wrap {
margin-bottom: 6.4vw; }
.content-title {
font-size: clamp(1rem, 6.4vw, 2rem); }
.header-sub .header-bus a {
display: flex; }
.header-sub ul {
justify-content: center; }
.top-kv-event dl {
display: block;
margin-bottom: 1px; }
.top-kv-news li a {
display: block; }
.top-kv-news li a time {
display: block; }
.top-pickup li {
flex: 0 0 40%; }
.top-wellness-txt p br {
display: none; }
.newslist {
flex: 0 0 100%; }
.facilitylist li {
flex: 0 0 48%; }
.event-list {
display: block; }
.event-body .event {
padding: 0 0 16px; }
.access-wrap {
display: block; }
.access-map {
padding: 0; }
.access-btn {
text-align: center; }
.wellnesstown-kv h1 {
font-size: clamp(20px, 8vw, 32px); }
.wellnesstown-kv-grid-5 {
grid-template-rows: 33vw 33vw; }
.wellnesstown-kv-grid-5 p.wellnesstown-kv01 {
grid-column: 1 / 2;
grid-row: 1 / 2; }
.wellnesstown-kv-grid-5 p.wellnesstown-kv04 {
grid-column: 1 / 2;
grid-row: 2 / 3; }
.wellnesstown-kv-grid-6 {
grid-template-rows: 33vw 33vw; }
.wellnesstown-kv-grid-6 p.wellnesstown-kv01 {
grid-column: 1 / 2;
grid-row: 1 / 2; }
.wellnesstown-kv-grid-6 p.wellnesstown-kv02 {
grid-column: 2 / 3;
grid-row: 1 / 2; }
.wellnesstown-kv-grid-6 p.wellnesstown-kv03 {
grid-column: 3 / 4;
grid-row: 1 / 2; }
.wellnesstown-kv-grid-6 p.wellnesstown-kv04 {
grid-column: 1 / 2;
grid-row: 2 / 3; }
.wellnesstown-kv-grid-6 p.wellnesstown-kv05 {
grid-column: 2 / 3;
grid-row: 2 / 3; }
.wellnesstown-kv-grid-6 p.wellnesstown-kv06 {
grid-column: 3 / 4;
grid-row: 2 / 3; }
.wellnesstown-kv-grid-7 p.wellnesstown-kv04 {
grid-column: 3 / 4;
grid-row: 2 / 3; }
.wellnesstown-kv-grid-7 p.wellnesstown-kv05 {
grid-column: 1 / 2;
grid-row: 3 / 4; }
.wellnesstown-kv-grid-7 p.wellnesstown-kv06 {
grid-column: 2 / 3;
grid-row: 3 / 4; }
.wellnesstown-kv-grid-7 p.wellnesstown-kv07 {
grid-column: 3 / 4;
grid-row: 3 / 4; }
.wellnesstown-kv-grid-9 {
grid-template-columns: 33% 34% 33%; }
.wellnesstown-kv-grid-9 p {
max-height: 34vw; }
.wellnesstown-kv-grid-9 p.wellnesstown-kv01 {
grid-column: 1 / 2;
grid-row: 1 / 2; }
.wellnesstown-kv-grid-9 p.wellnesstown-kv02 {
grid-column: 2 / 3;
grid-row: 1 / 2; }
.wellnesstown-kv-grid-9 p.wellnesstown-kv03 {
grid-column: 3 / 4;
grid-row: 1 / 2; }
.wellnesstown-kv-grid-9 p.wellnesstown-kv04 {
grid-column: 1 / 2;
grid-row: 2 / 3; }
.wellnesstown-kv-grid-9 p.wellnesstown-kv05 {
grid-column: 2 / 3;
grid-row: 2 / 3; }
.wellnesstown-kv-grid-9 p.wellnesstown-kv06 {
grid-column: 3 / 4;
grid-row: 2 / 3; }
.wellnesstown-kv-grid-9 p.wellnesstown-kv07 {
grid-column: 1 / 2;
grid-row: 3 / 4; }
.wellnesstown-kv-grid-9 p.wellnesstown-kv08 {
grid-column: 2 / 3;
grid-row: 3 / 4; }
.wellnesstown-kv-grid-9 p.wellnesstown-kv09 {
grid-column: 3 / 4;
grid-row: 3 / 4; }
.content-body .alignright {
float: none;
max-width: 100%;
margin-left: 0;
margin-bottom: 1rem; }
.content-body .alignleft {
float: none;
max-width: 100%;
margin-right: 0;
margin-bottom: 1em; }
.content-news .content-title {
line-height: 1.4;
font-size: clamp(16px, 6.4vw, 22px); }
.content-news .title-wrap li {
font-size: 1em;
padding: 0 0 0 1em; }
.archive-facility h3 {
text-align: center;
padding-bottom: 2em; }
.facility {
padding: 16px;
display: block; }
.facility-ph {
padding-bottom: 8px; }
.facility-ph figure, .facility-ph img {
aspect-ratio: 16 / 9; }
.facility-tx {
padding-left: 0;
word-break: break-all; }
.facility-tx h2 {
font-size: 1.1em; }
.content-page .wsp-container {
float: none;
width: auto;
padding-left: 0;
padding-right: 0; } }
@media screen and (max-width: 480px) {
.top-kv-slider p {
height: 66vw; }
.top-kv-slider p img {
max-height: none;
height: calc(80vw + 60px); }
.top-kv-slider p strong {
font-size: clamp(0.8rem, 3.1vw, 1.4rem); }
.content {
padding: 8vw 0; }
.content.top-wellness {
padding: 16vw 0; }
.top-wellness-txt {
padding-bottom: 8vw; }
.single-2column .content {
padding: 4vw 4vw 16vw 4vw; }
.Navi-Pre-Next {
flex-direction: column; }
.related .newslist {
flex: 0 0 50%;
min-width: 0; }
.calendar-nav h2 {
font-size: 1.4em; }
.content-navi a {
font-size: 0.9em;
padding: .5rem 1.25rem .5rem 1rem; }
.content-navi.mt2 a {
margin-right: 4px;
padding: .5rem 1rem .5rem .5rem; } }