@charset "utf-8";

/*-------------------------------------------------
fonts 
-------------------------------------------------*/

@font-face {
font-family: 'PressioTEST-No.33';
src: local('PressioTEST-No.33'),
url('../webfont/PressioTEST-No.33.woff') format('woff');
font-style: normal;
font-weight: normal;
font-display:swap;
}

@font-face {
font-family: 'PressioTEST-No.35';
src: local('PressioTEST-No.35'),
url('../webfont/PressioTEST-No.35.woff') format('woff');
font-style: normal;
font-weight: normal;
font-display:swap;
}


/*-------------------------------------------------
base 
-------------------------------------------------*/

html {
scroll-padding-top: 0px;
scrollbar-gutter: stable;
}
body {
font-family: 'Noto Sans JP', sans-serif;
font-size: 1.5rem;
font-weight: 400;
line-height: 1.6;
color: #222;
-webkit-text-size-adjust: 100%;
letter-spacing: 0.1em;
}
a img {
border-style: none;
}
a {
color: inherit;
text-decoration: none;
}
a:link, a:visited {
text-decoration: none;
}
.clear  {
clear: both;
visibility: hidden;
height: 0px;
}
.line_effect {
text-decoration: none;
}
.u_line_wht,
.u_line_blk {
position: relative;
z-index: 1;
}
.u_line_wht:after {
content: '';
position: absolute;
left: 0;
bottom: -8px;/*テキストからの距離*/
width: 0%;/*初期状態では下線非表示*/
height: 1px;/*下線の高さ*/
background: #ccc;/*下線の色*/
z-index: -1;
transition: all 0.3s;/*アニメーション速度*/
}
.u_line_blk:after {
content: '';
position: absolute;
left: 0;
bottom: -8px;/*テキストからの距離*/
width: 0%;/*初期状態では下線非表示*/
height: 1px;/*下線の高さ*/
background: #333;/*下線の色*/
z-index: -1;
transition: all 0.3s;/*アニメーション速度*/
}
.line_effect:hover .u_line_wht:after,
.line_effect:hover .u_line_blk:after{
width: 100%;/*hover時に表示*/
}
::selection {
background: #034E95;
color: #fff;
}
/*Firefox*/
::-moz-selection {
background: #034E95;
color: #fff;
}


/*-------------------------------------------------
	padding margin font-size
-------------------------------------------------*/

.p-0{padding: 0px !important;}
.p-5{padding: 5px !important;}
.p-10{padding: 10px !important;}
.p-15{padding: 15px !important;}
.p-20{padding: 20px !important;}
.p-25{padding: 25px !important;}
.p-30{padding: 30px !important;}
.p-35{padding: 35px !important;}
.p-40{padding: 40px !important;}
.p-45{padding: 45px !important;}
.p-50{padding: 50px !important;}

.pt-0 {padding-top: 0 !important;}
.pt-5 {padding-top: 5px !important;}
.pt-10 {padding-top: 10px !important;}
.pt-15 {padding-top: 15px !important;}
.pt-20 {padding-top: 20px !important;}
.pt-25 {padding-top: 25px !important;}
.pt-30 {padding-top: 30px !important;}
.pt-35 {padding-top: 35px !important;}
.pt-40 {padding-top: 40px !important;}
.pt-45 {padding-top: 45px !important;}
.pt-50 {padding-top: 50px !important;}

.pr-0 {padding-right: 0 !important;}
.pr-5 {padding-right: 5px !important;}
.pr-10 {padding-right: 10px !important;}
.pr-15 {padding-right: 15px !important;}
.pr-20 {padding-right: 20px !important;}
.pr-25 {padding-right: 25px !important;}
.pr-30 {padding-right: 30px !important;}
.pr-35 {padding-right: 35px !important;}
.pr-40 {padding-right: 40px !important;}
.pr-45 {padding-right: 45px !important;}
.pr-50 {padding-right: 50px !important;}

.pb-0 {padding-bottom: 0 !important;}
.pb-5 {padding-bottom: 5px !important;}
.pb-10 {padding-bottom: 10px !important;}
.pb-15 {padding-bottom: 15px !important;}
.pb-20 {padding-bottom: 20px !important;}
.pb-25 {padding-bottom: 25px !important;}
.pb-30 {padding-bottom: 30px !important;}
.pb-35 {padding-bottom: 35px !important;}
.pb-40 {padding-bottom: 40px !important;}
.pb-45 {padding-bottom: 45px !important;}
.pb-50 {padding-bottom: 50px !important;}

.pl-0 {padding-left: 0 !important;}
.pl-5 {padding-left: 5px !important;}
.pl-10 {padding-left: 10px !important;}
.pl-15 {padding-left: 15px !important;}
.pl-20 {padding-left: 20px !important;}
.pl-25 {padding-left: 25px !important;}
.pl-30 {padding-left: 30px !important;}
.pl-35 {padding-left: 35px !important;}
.pl-40 {padding-left: 40px !important;}
.pl-45 {padding-left: 45px !important;}
.pl-50 {padding-left: 50px !important;}

.m-0{margin: 0px !important;}
.m-5{margin: 5px !important;}
.m-10{margin: 10px !important;}
.m-15{margin: 15px !important;}
.m-20{margin: 20px !important;}
.m-25{margin: 25px !important;}
.m-30{margin: 30px !important;}
.m-35{margin: 35px !important;}
.m-40{margin: 40px !important;}
.m-45{margin: 45px !important;}
.m-50{margin: 50px !important;}

.mt-0{margin-top: 0px !important;}
.mt-5{margin-top: 5px !important;}
.mt-10{margin-top: 10px !important;}
.mt-15{margin-top: 15px !important;}
.mt-20{margin-top: 20px !important;}
.mt-25{margin-top: 25px !important;}
.mt-30{margin-top: 30px !important;}
.mt-35{margin-top: 35px !important;}
.mt-40{margin-top: 40px !important;}
.mt-45{margin-top: 45px !important;}
.mt-50{margin-top: 50px !important;}

.mr-0{margin-right: 0px !important;}
.mr-5{margin-right: 5px !important;}
.mr-10{margin-right: 10px !important;}
.mr-15{margin-right: 15px !important;}
.mr-20{margin-right: 20px !important;}
.mr-25{margin-right: 25px !important;}
.mr-30{margin-right: 30px !important;}
.mr-35{margin-right: 35px !important;}
.mr-40{margin-right: 40px !important;}
.mr-45{margin-right: 45px !important;}
.mr-50{margin-right: 50px !important;}

.mb-0{margin-bottom: 0px !important;}
.mb-5{margin-bottom: 5px !important;}
.mb-10{margin-bottom: 10px !important;}
.mb-15{margin-bottom: 15px !important;}
.mb-20{margin-bottom: 20px !important;}
.mb-25{margin-bottom: 25px !important;}
.mb-30{margin-bottom: 30px !important;}
.mb-35{margin-bottom: 35px !important;}
.mb-40{margin-bottom: 40px !important;}
.mb-45{margin-bottom: 45px !important;}
.mb-50{margin-bottom: 50px !important;}
.mb-60{margin-bottom: 60px !important;}
.mb-70{margin-bottom: 70px !important;}
.mb-80{margin-bottom: 80px !important;}
.mb-90{margin-bottom: 90px !important;}
.mb-100{margin-bottom: 100px !important;}
.mb-110{margin-bottom: 110px !important;}
.mb-120{margin-bottom: 120px !important;}

.ml-0{margin-left: 0px !important;}
.ml-5{margin-left: 5px !important;}
.ml-10{margin-left: 10px !important;}
.ml-15{margin-left: 15px !important;}
.ml-20{margin-left: 20px !important;}
.ml-25{margin-left: 25px !important;}
.ml-30{margin-left: 30px !important;}
.ml-35{margin-left: 35px !important;}
.ml-40{margin-left: 40px !important;}
.ml-45{margin-left: 45px !important;}
.ml-50{margin-left: 50px !important;}

.fs-1 {font-size:.1rem !important;}
.fs-2 {font-size:.2rem !important;}
.fs-3 {font-size:.3rem !important;}
.fs-4 {font-size:.4rem !important;}
.fs-5 {font-size:.5rem !important;}
.fs-6 {font-size:.6rem !important;}
.fs-7 {font-size:.7rem !important;}
.fs-8 {font-size:.8rem !important;}
.fs-9 {font-size:.9rem !important;}
.fs-10{font-size:1rem !important;}
.fs-11{font-size:1.1rem !important;}
.fs-12{font-size:1.2rem !important;}
.fs-13{font-size:1.3rem !important;}
.fs-14{font-size:1.4rem !important;}
.fs-15{font-size:1.5rem !important;}
.fs-16{font-size:1.6rem !important;}
.fs-17{font-size:1.7rem !important;}
.fs-18{font-size:1.8rem !important;}
.fs-19{font-size:1.9rem !important;}
.fs-20{font-size:2rem !important;}
.fs-21{font-size:2.1rem !important;}
.fs-22{font-size:2.2rem !important;}
.fs-23{font-size:2.3rem !important;}
.fs-24{font-size:2.4rem !important;}
.fs-25{font-size:2.5rem !important;}
.fs-26{font-size:2.6rem !important;}
.fs-27{font-size:2.7rem !important;}
.fs-28{font-size:2.8rem !important;}
.fs-29{font-size:2.9rem !important;}
.fs-30{font-size:3.0rem !important;}
.fs-31{font-size:3.1rem !important;}
.fs-32{font-size:3.2rem !important;}
.fs-33{font-size:3.3rem !important;}
.fs-34{font-size:3.4rem !important;}
.fs-35{font-size:3.5rem !important;}
.fs-36{font-size:3.6rem !important;}
.fs-37{font-size:3.7rem !important;}
.fs-38{font-size:3.8rem !important;}
.fs-39{font-size:3.9rem !important;}
.fs-40{font-size:4rem !important;}
.fs-41{font-size:4.1rem !important;}
.fs-42{font-size:4.2rem !important;}
.fs-43{font-size:4.3rem !important;}
.fs-44{font-size:4.4rem !important;}
.fs-45{font-size:4.5rem !important;}
.fs-46{font-size:4.6rem !important;}
.fs-47{font-size:4.7rem !important;}
.fs-48{font-size:4.8rem !important;}
.fs-49{font-size:4.9rem !important;}
.fs-50{font-size:5rem !important;}


/*-------------------------------------------------
改行設定
-------------------------------------------------*/

@media screen and (min-width: 768px) {
.pc-hidden{
display:none;
}
}

@media screen and (max-width : 480px ){
.sp-hidden{
display:none;
}
}


/*-------------------------------------------------
loading
-------------------------------------------------*/

.site_loader {
position: fixed;
inset: 0;
z-index: 99999;
width: 100vw;
height: 100vh;
overflow: hidden;
display: flex;
background: none;
opacity: 1;
visibility: visible;
pointer-events: none;
}
.site_loader__bar {
position: absolute;
top: 50%;
left: 50%;
z-index: 6;
width: 300px;
height: 8px;
background: #fff;
transform: translate(-50%, -50%) rotateY(90deg) rotateZ(0deg);
transform-origin: center center;
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
}
.site_loader__count {
position: absolute;
top: 53%;
left: 50%;
z-index: 7;
transform: translateX(calc(-50% - 6px));
color: #fff;
text-align: center;
line-height: 1;
font-size: 2rem;
font-family: "balboa", sans-serif;
font-weight: 300;
letter-spacing: 0.08em;
white-space: nowrap;
width: auto;
margin-left: 0;
}
.site_loader__bg01,
.site_loader__bg02 {
position: absolute;
top: 0;
height: 100%;
background: #293337;
transform: skew(-30deg);
will-change: transform;
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
}
.site_loader__bg01 {
left: 0;
transform-origin: 0 0;
}
.site_loader__bg02 {
right: 0;
transform-origin: 100% 100%;
}
.site_loader__message {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 8;
width: 500px;
height: 2em;
margin: auto;
padding-bottom: 140px;
color: #fff;
text-align: center;
white-space: nowrap;
font-family: 'PressioTEST-No.35';
font-size: clamp(3.2rem, 2.604vw, 5rem);
line-height: 1;
letter-spacing: 0.05em;
opacity: 1;
display: block;
}
body.is-loading {
overflow: hidden;
}

@media all and (max-width: 767px) {
.site_loader {
height: 100dvh;
}
.site_loader__bar {
width: 220px;
height: 8px;
}
.site_loader__count {
top: 54%;
font-size: 1.6rem;
}
.site_loader__message {
width: 300px;
font-size: 3.0rem;
padding-bottom: 80px;
}
}


/*-------------------------------------------------
sec_intro
-------------------------------------------------*/

.sec_intro {
color: #fff;
}
.header_top {
position: fixed;
inset: 0;
width: 100%;
height: 100vh;
z-index: 10;
background: #00377E;
}
.header_top_fx {
position: absolute;
inset: 0;
z-index: 12;
pointer-events: none;
background: rgba(11, 53, 77, 0.001);
backdrop-filter: blur(0px);
-webkit-backdrop-filter: blur(0px);
}
.header_bottom {
position: relative;
z-index: 20;
margin-top: 100vh;
}

@media all and (max-width : 767px ){
.header_top {
height: 100dvh; 
}
.header_bottom {
margin-top: 130dvh;
}
}

.kv_visual_wrap {
position: absolute;
inset: 0;
z-index: 10;
}
.kv_slidebox_wrap {
position: absolute;
left: 29.6%;
top: 3.4vw;
width: 67%;
aspect-ratio: 16 / 9;
}
.kv_slidebox {
position: absolute;
inset: 0;
overflow: hidden;
z-index: 1;
}
.kv_grid_overlay {
position: absolute;
inset: 0;
background-image: url("../img/bg_grid_30.png");
background-repeat: repeat;
z-index: 10;
pointer-events: none;
}
.kv_img {
position: absolute;
inset: 0;
overflow: hidden;
opacity: 0;
visibility: hidden;
}
.kv_img.is-active {
opacity: 1;
visibility: visible;
}
.kv_img picture,
.kv_img img {
width: 100%;
height: 100%;
display: block;
}
.kv_img img {
object-fit: cover;
}
.kv_logo {
font-family: 'PressioTEST-No.35';
font-style: normal;
font-size: clamp(16rem, 17.708vw, 34rem);
line-height: 0.88;
position: absolute;
left: -38%;
bottom: -28%;
z-index: 12;
}
.kv_logo span {
display: block;
}

@media all and (min-width : 2560px ){
.kv_logo {
bottom: -15%;
}
}

@media all and (max-width : 820px ){
.kv_slidebox_wrap {
position: absolute;
left: 0;
top: 0;
width: 100%;
aspect-ratio: auto;
height: 66vh;
}
.kv_slidebox,
.kv_slidebox .kv_img {
height: 100%;
}
.kv_slidebox .kv_img img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.kv_logo {
position: absolute;
left: 4%;
bottom: -30%;
}
}

@media all and (max-width : 768px ){
.kv_logo {
position: absolute;
bottom: -35%;
}
}

@media all and (max-width : 767px ){
.kv_slidebox_wrap {
height: 70vh;
}
.kv_logo {
font-size: 9.0rem;
position: absolute;
bottom: -25.8%;
}
}


/*-------------------------------------------------
ページネーション
-------------------------------------------------*/

.fv-pagination {
position: fixed;
z-index: 11;
display: flex;
gap: 16px;
pointer-events: auto;
}
.fv-dot {
appearance: none;
border: 0;
background: transparent;
padding: 0;
width: 25px;
height: 25px;
position: relative;
cursor: pointer;
pointer-events: auto;
display: block;
touch-action: manipulation;
}
.fv-dot-center {
position: absolute;
width: 6px;
height: 6px;
background: #fff;
border-radius: 50%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
pointer-events: none;
}
.fv-dot svg {
width: 100%;
height: 100%;
transform: rotate(-90deg);
}
.fv-dot .progress {
fill: none;
stroke: #fff;
stroke-width: 3;
opacity: 0;
}
.fv-dot.is-active .progress {
opacity: 1;
}

@media all and (max-width : 767px ){
.fv-pagination {
gap: 10px;
}
.fv-dot-center {
width: 4px;
height: 4px;
}
.fv-dot {
width: 20px;
height: 20px;
}
.fv-dot::after {
width: 4px;
height: 4px;
}
}


/*-------------------------------------------------
scroll menu
-------------------------------------------------*/

.scroll_menu {
position: fixed;
inset: 0;
pointer-events: none;
z-index: 9999;
mix-blend-mode: normal;
}
.scroll_menu.is-blend {
mix-blend-mode: difference;
}
.scroll_menu ul {
position: absolute;
top: 3.4vw;
left: 4.0%;
color: #fff;
pointer-events: auto;
}

@media all and (max-width : 1650px ){
.scroll_menu ul {
left: 3.0%;
}
}

@media all and (max-width : 1535px ){
.scroll_menu {
position: absolute;
}
}

@media all and (max-width : 1023px ){
.scroll_menu {
display: none;
}
}

.scroll_menu ul li {
position: relative;
padding-left: 12px;
}
.scroll_menu ul li::before {
content: "";
display: block;
width: 5px;
height: 5px;
border-radius: 50%;
background-color: #fff;
position: absolute;
left: 0;
top: 32%;
}
.scroll_menu ul li .en {
font-family: "balboa", sans-serif;
font-weight: 300;
font-size: clamp(1.8rem,1.1458vw,2.2rem);
letter-spacing: 0.08em;
line-height: 1.0;
display: block;
padding-right: 20px;
}
.scroll_menu ul li .ja {
font-family: 'Noto Sans JP', sans-serif;
font-weight: 700;
font-size: 1.4rem;
letter-spacing: 0.05em;
}

@media all and (max-width : 1650px ){
.scroll_menu ul li .ja {
font-size: 1.3rem;
}
}

.scroll_menu ul li {
margin-bottom: 20px;
}

@media all and (max-width : 1200px ){
.scroll_menu ul li {
margin-bottom: 15px;
}
}

.scroll_menu ul li a {
display: flex;
align-items: center;
position: relative;
text-align: left;
opacity: 1;
transform: translateY(0);
}
.scroll_menu ul li a .roll_txt {
position: relative;
display: inline-block;
overflow: hidden;
}
.scroll_menu ul li a .en {
display: block;
animation: menu-first-in 0.6s cubic-bezier(0.32, 0.95, 0.6, 1) both;
}
.scroll_menu ul li a .ja {
display: block;
position: absolute;
top: 1px;
left: 50%;
width: 100%;
transform: translateX(-50%);
white-space: nowrap;
animation: menu-out 0.6s cubic-bezier(0.32, 0.95, 0.6, 1) both;
}
.scroll_menu ul li a:hover .en {
animation: menu-first-out 0.6s cubic-bezier(0.32, 0.95, 0.6, 1) both;
}
.scroll_menu ul li a:hover .ja {
animation: menu-in 0.6s cubic-bezier(0.32, 0.95, 0.6, 1) both;
}

@keyframes menu-in {
0% {
transform: translate(-50%, 100%);
}
100% {
transform: translate(-50%, 0);
}
}

@keyframes menu-out {
0% {
transform: translate(-50%, 0);
}
100% {
transform: translate(-50%, 100%);
}
}

@keyframes menu-first-in {
0% {
transform: translateY(-100%);
opacity: 0;
}
100% {
transform: translateY(0);
opacity: 1;
}
}

@keyframes menu-first-out {
0% {
transform: translateY(0);
opacity: 1;
}
100% {
transform: translateY(-100%);
opacity: 0;
}
}


/*-------------------------------------------------
sec_concept
-------------------------------------------------*/

.content_side {
width: 100%;
max-width: 710px;
margin: 0 auto;
padding-bottom: 200px;
}
.intro_title {
display: flex;
align-items: center;
margin-bottom: 20px;
}
.intro_title dt {
max-width: 187px;
height: auto;
margin-right: 10px;
}
.intro_title dt img {
width: 100%;
}
.intro_title dd {
font-family: "balboa", sans-serif;
font-weight: 300;
font-size: 3.0rem;
letter-spacing: 0.05em;
}
.concept_copy_en {
font-family: "balboa", sans-serif;
font-weight: 300;
font-size: clamp(2.0rem, 3.125vw, 6.0rem);
letter-spacing: 0.05em;
line-height: 1;
margin-bottom: 30px;
}
.concept_copy_jp {
font-size: 2.4rem;
font-weight: 700;
letter-spacing: 0.25em;
margin-bottom: 30px;
}
.concept_txt {
font-size: 1.6rem;
font-weight: 500;
line-height: 2.4;
letter-spacing: 0.2em;
}

@media all and (max-width : 767px ){
.content_side {
padding-bottom: 100px;
}
.content_side .intro_title {
margin-bottom: 15px;
}
.intro_title {
margin-bottom: 10px;
}
.intro_title dt {
max-width: 150px;
}
.intro_title dd {
font-size: 2.2rem;
}
.concept_copy_en {
font-size: 2.7rem;
letter-spacing: 0.08em;
margin-bottom: 20px;
}
.concept_copy_jp {
font-size: 1.7rem;
letter-spacing: 0.25em;
margin-bottom: 20px;
}
.concept_txt {
font-size: 1.4rem;
line-height: 2.0;
letter-spacing: 0.08em;
}
}



/*-------------------------------------------------
sec_facility
-------------------------------------------------*/

.sec_facility {
padding: 60px 0 100px;
}
.facility_title {
margin-bottom: 35px;
}
.facility_title dt {
font-family: 'PressioTEST-No.35';
font-style: normal;
font-size: clamp(3.0rem,5.208vw,10.0rem);
letter-spacing: 0.05em;
line-height: 1;
margin-bottom: 10px;
}
.facility_title dd {
font-size: 1.8rem;
font-weight: 500;
letter-spacing: 0.1em;
padding-left: 15px;
position: relative;
}
.facility_title dt span {
color: #034E95;
}
.facility_title dd::before {
content: "/";
display: inline-block;
font-size: 1.4rem;
font-weight: 500;
color: #222;
position: absolute;
left: 0;
top: 3px;
}
.facility_copy {
font-size: clamp(1.6rem,1.25vw,2.4rem);
font-weight: 700;
letter-spacing: 0.3em;
margin-bottom: 25px;
}
.facility_txt {
font-size: 1.6rem;
line-height: 180%;
margin-bottom: 40px;
}

@media all and (max-width : 820px ){
.sec_facility {
padding: 50px 0 50px;
}
}

@media all and (max-width : 767px ){
.sec_facility {
padding: 30px 0 50px;
}
.facility_title {
margin-bottom: 20px;
}
.facility_title dt {
margin-bottom: 5px;
}
.facility_title dd {
font-size: 1.1rem;
padding-left: 15px;
}
.facility_title dd::before {
font-size: 1.0rem;
top: 1px;
}
.facility_copy {
letter-spacing: 0.2em;
margin-bottom: 15px;
}
.facility_txt {
font-size: 1.3rem;
margin-bottom: 30px;
}
}


/*-------------------------------------------------
sec_title
-------------------------------------------------*/

.sec_titlebox {
margin-bottom: 40px;
}
.sec_titlebox dt {
font-weight: 500;
font-size: 2.2rem;
letter-spacing: 0.2em;
line-height: 1;
padding-left: 35px;
margin-bottom: 10px;
position: relative;
}
.sec_titlebox dt::before {
content: "";
display: inline-block;
background-color: #000;
width: 28px;
height: 1px;
position: absolute;
left: 0;
top: 50%;
}
.sec_titlebox dd {
font-family: "balboa", sans-serif;
font-weight: 300;
font-size: 1.2rem;
letter-spacing: 0.05em;
color: #034E95;
margin-left: 37px;
}

@media all and (max-width : 820px ){
.sec_titlebox {
margin-bottom: 25px;
}
.sec_titlebox dt {
font-size: 1.8rem;
margin-bottom: 5px;
}
}

@media all and (max-width : 767px ){
.sec_titlebox {
margin-bottom: 20px;
}
.sec_titlebox dt {
font-size: 1.4rem;
padding-left: 13px;
}
.sec_titlebox dt::before {
width: 10px;
height: 1px;
position: absolute;
left: 0;
top: 50%;
}
.sec_titlebox dd {
font-size: 1.0rem;
margin-left: 13px;
}
}


/*-------------------------------------------------
施設一覧表示
-------------------------------------------------*/

.spot_box_wrap {
display: flex;
flex-wrap: wrap;
margin-bottom: 50px;
}
.spot_box {
width: calc(33.3333333% - 60px / 3);
margin-right: 30px;
margin-bottom: 30px;
padding-bottom: 30px;
border: solid 1px #ddd;
position: relative;
}
.spot_box:nth-child(3n) {
margin-right: 0;
}
.spot_img {
width: 100%;
margin-bottom: 20px;
position: relative;
background: #000;
overflow: hidden;
}
.spot_img img {
width: 100%;
aspect-ratio: 3 / 2;
object-fit: cover;
transition-duration: 0.7s;
transform: translateZ(0);
backface-visibility: hidden;
will-change: transform;
}
.spot_img img:hover {
transform: scale(1.05);	
transition-duration: 0.7s;	
opacity: 0.8;
}
.area_txt {
font-weight: 400;
font-size: 1.2rem;
padding: 4px 20px;
background-color: rgba(29,80,162,0.95);
text-align: center;
display: block;
color: #fff;
position: absolute;
right: 10px;
bottom: 10px;
border-radius: 3px;
}
.spot_box .spot_title {
font-weight: 500;
font-size: 1.8rem;
letter-spacing: 0.2em;
margin: 0 0 15px 15px;
padding-right: 10px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}

@media all and (max-width : 1024px ){
.spot_box .spot_title {
font-size: 1.6rem;
margin: 0 0 10px 15px;
}
}

.spot_read {
font-size: 1.3rem;
line-height: 180%;
padding: 0 15px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 25px;
}
.spot_category {
display: flex;
align-items: center;
margin-left: 15px;
padding-right: 15px;
}
.spot_category li {
font-weight: 400;
font-size: 1.1rem;
padding: 8px 15px 8px;
line-height: 110%;
}
.cate_main {
background-color: #eee;
border: solid 1px #ccc;
color: #000;
border-radius: 3px;
margin-right: 10px;
white-space: nowrap;
}
.cate_sub {
color: #000;
border: solid 1px #111;
border-radius: 3px;
}

@media all and (max-width : 820px ){
.spot_box {
width: calc(50% - 20px / 2);
margin-right: 20px;
margin-bottom: 20px;
padding-bottom: 30px;
}
.spot_box:nth-child(3n) {
margin-right: 20px;
}
.spot_box:nth-child(2n) {
margin-right: 0px;
}
.spot_box .spot_title {
font-size: 1.6rem;
letter-spacing: 0.2em;
margin: 0 0 15px 15px;
}
.spot_read {
-webkit-line-clamp: 2;
}
.area_txt {
font-size: 1.2rem;
}
}

@media all and (max-width : 767px ){
.spot_box_wrap {
margin-bottom: 20px;
}
.spot_box {
width: 100%;
margin-right: 0px;
margin-bottom: 20px;
padding-bottom: 20px;
}
.spot_box:nth-child(3n) {
margin-right: 0px;
}
.spot_img {
margin-bottom: 15px;
}
.spot_box .spot_title {
font-size: 1.5rem;
letter-spacing: 0.2em;
margin: 0 0 10px 15px;
padding-right: 10px;
}
.spot_read {
font-size: 1.2rem;
line-height: 160%;
padding: 0 15px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 20px;
}
.spot_category li {
font-size: 1.0rem;
padding: 10px 15px 11px;
}
.area_txt {
font-size: 1.0rem;
}
}

.c_title {
font-family: "balboa", sans-serif;
font-weight: 300;
font-size: 2.2rem;
letter-spacing: 0.05em;
line-height: 100%;
padding-left: 22px;
margin-bottom: 20px;
position: relative;
}
.c_title::before {
content: "";
display: block;
width: 6px;
height: 6px;
border-radius: 50%;
background-color: #034E95;
position: absolute;
left: 6px;
top: 36%;
}
.facility_link_txt {
font-size: 1.5rem;
margin: 0 0 40px 22px;
}
.work_list_wrap {
display: flex;
flex-wrap: wrap;
}
.work_list {
width: calc(33.33333333% - 40px / 3);
margin-right: 20px;
margin-bottom: 20px;
}
.work_list:nth-child(3n) {
margin-right: 0px;
}
.work_list a {
width: 100%;
height: 100%;
padding: 45px 20px 45px 30px;
display: flex;
justify-content: space-between;
align-items: center;
background: #00377E;
transition: all .5s ease;
}
.w_cate_title {
display: flex;
align-items: center;
color: #fff;
}
.w_cate_title dt {
font-size: 2.4rem;
font-weight: 500;
letter-spacing: 0.2em;
margin-right: 5px;
}
.w_cate_title dd {
font-family: "balboa", sans-serif;
font-weight: 300;
font-size: 1.2rem;
letter-spacing: 0.05em;
padding-left: 10px;
margin-top: 10px;
position: relative;
}
.w_cate_title dd::before {
content: "/";
display: inline-block;
font-size: 1.1rem;
color: #fff;
position: absolute;
left: 0;
top: 1px;
}

@media all and (max-width : 1366px ){
.w_cate_title {
font-size: 1.8rem;
letter-spacing: 0.1em;
}
}

.work_link_btn {
z-index: 3;
display: block;
width: 40px;
height: 40px;
margin-left: 15px;
position: relative;
border-width: 1px;
border-style: solid;
border-color: rgba(255, 255, 255, 0.9);
border-image: initial;
border-radius: 50%;
transition: all 0.5s ease 0s;
}
.work_link_btn::before {
position: absolute;
z-index: 2;
display: block;
content: "";
top: 0px;
left: 15px;
bottom: 0px;
width: 6.5px;
height: 6.5px;
transform: rotate(45deg);
margin: auto;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
transition: all 0.12s ease-in 0s;
}
.work_list a:hover {
background: #008CCF;
transition: all .5s ease;
}
.work_list a:hover .work_link_btn {
opacity: 1;
background-color: #fff;
border: solid 1px #fff;
transition: all 0.5s ease 0s;
}
.work_list a:hover .work_link_btn::before {
border-top: 2px solid #034E95;
border-right: 2px solid #034E95;
}

@media all and (max-width : 900px ){
.work_list {
width: calc(50% - 20px / 2);
}
.work_list:nth-child(2n) {
margin-right: 0px;
}
.work_list:nth-child(3n) {
margin-right: 20px;
}
.work_list:nth-child(6) {
margin-right: 0px;
}
.w_cate_title dt {
font-size: 2.0rem;
letter-spacing: 0.15em;
}
}

@media all and (max-width : 767px ){
.c_title {
font-size: 2.0rem;
padding-left: 22px;
margin-bottom: 15px;
}
.facility_link_txt {
font-size: 1.2rem;
margin: 0 0 20px 5px;
}
.work_list {
width: calc(50% - 10px / 2);
margin-right: 10px;
margin-bottom: 10px;
}
.work_list:nth-child(3n) {
margin-right: 10px;
}
.work_list:nth-child(6) {
margin-right: 0px;
}
.work_list a {
padding: 20px 10px 20px 15px;
}
.w_cate_title {
display: flex;
flex-direction: column;
align-items: flex-start;
color: #fff;
}
.w_cate_title dt {
font-size: 1.6rem;
letter-spacing: 0.1em;
}
.w_cate_title dd {
font-size: 1.0rem;
padding-left: 5px;
margin-top: 0px;
margin-left: 2px;
}
.w_cate_title dd::before {
font-size: 0.9rem;
top: 0;
}
.work_link_btn {
width: 25px;
height: 25px;
margin-left: 0px;
}
.work_link_btn::before {
top: 0px;
left: 8px;
bottom: 0px;
width: 5.5px;
height: 5.5px;
}
}


/* -------------------------------------------------
service sticky boxes
------------------------------------------------- */

.sec_service_sticky {
position: relative;
background: #192630;
color: #fff;
}
.service_sticky_boxes {
position: relative;
overflow: visible;
}
.service_sticky_box {
position: sticky;
top: 0;
min-height: 100vh;
z-index: 1;
background: #192630;
}

@media screen and (min-width: 768px) {
.service_sticky_box {
height: 100vh;
min-height: 780px;
}
}

.service_sticky_box__panel {
position: relative;
width: 100%;
height: 100%;
display: flex;
align-items: center;
overflow: hidden;
--service-overlay-alpha: 0.42;
will-change: transform, filter;
}

@media screen and (min-width: 768px) {
.service_sticky_box__panel {
display: flex;
align-items: center;
}
}

.service_sticky_box__bg {
position: absolute;
inset: 0;
z-index: 0;
overflow: hidden;
}
.service_sticky_box__bg::after {
content: "";
position: absolute;
inset: 0;
background: rgba(25, 38, 48, var(--service-overlay-alpha));
pointer-events: none;
}
.service_sticky_box__bg img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
transform: translateZ(0);
}
.service_sticky_box .box_s {
position: relative;
z-index: 2;
}
.service_sticky_box__body {
max-width: 865px;
margin: 0 auto;
display: flex;
flex-direction: column;
align-items: center;
}
.sec_service_sticky .intro_title {
margin-bottom: 20px;
}
.service_sticky_box__title_wrap {
display: flex;
align-items: center;
justify-content: center;
}
.service_sticky_box__title_en {
font-family: 'PressioTEST-No.35';
font-weight: normal;
font-size: clamp(5.0rem,5.208vw,10.0rem);
letter-spacing: 0.05em;
margin-bottom: 20px;
margin-right: 20px;
line-height: 1;
}
#sec_bmx .service_sticky_box__title_en {
margin-right: 0px;
}
.service_sticky_box__title_en span {
color: #034E95;
}
.service_sticky_box__title_jp {
font-size: clamp(2.2rem,1.875vw,3.6rem);
font-weight: 700;
letter-spacing: 0.3em;
padding-left: clamp(20px,1.71875vw,33px);
line-height: 1;
position: relative;
margin-top: -5%;
}
.service_sticky_box__title_jp::before {
content: "/";
display: inline-block;
font-size: clamp(2.0rem,1.5625vw,3.0rem);
color: #fff;
position: absolute;
left: 0;
top: 2px;
}
.service_sticky_box__copy {
font-size: 2.4rem;
font-weight: 700;
letter-spacing: 0.2em;
margin-bottom: 40px;
}
.service_sticky_box__lead {
font-size: 1.6rem;
font-weight: 600;
line-height: 2.4;
letter-spacing: 0.1em;
}
.service_sticky_box__num {
font-family: "balboa", sans-serif;
font-weight: 500;
font-size: 10.0rem;
color: #fff;
line-height: 1;
letter-spacing: 0.05em;
position: absolute;
top: 50%;
right: 0;
padding-right: 15px;
}
.service_sticky_box__num::after {
content: "";
display: inline-block;
width: 20px;
height: 1px;
background: #fff;
position: absolute;
right: 0;
top: 50%;
}
.service_sticky_box .link_btn_box {
margin-top: 50px;
}

/* contact-tel-block
-------------------------------------------------- */

.contact-tel-block {
width: 100%;
border-left: 1px solid #d9d9d9;
border-right: 1px solid #d9d9d9;
border-bottom: 1px solid #d9d9d9;
padding: 0px 0px 40px;
margin-top: 50px;
text-align: center;
}
.lbd-ttl {
font-size: clamp(2.0rem,1.354vw,2.6rem);
font-weight: 700;
letter-spacing: 0.1em;
display: flex;
align-items: center;
margin-top: clamp(-21px, -1.09375vw, -16px);
margin-bottom: 20px;
}
.lbd-ttl::before,
.lbd-ttl::after {
content: "";
height: 1px;
flex-grow: 1;
background: #d9d9d9;
}
.lbd-ttl::before {
margin-right: 2rem;
}
.lbd-ttl::after {
margin-left: 1.7rem;
}
.contact-tel-block a {
display: block;
}
.contact-tel-block .tel_txt {
font-size: 2.4rem;
font-size: clamp(2.0rem,1.25vw,2.4rem);
font-weight: 700;
letter-spacing: 0.2em;
}
.contact-tel-block .tel {
font-family: "balboa", sans-serif;
font-weight: 300;
font-size: clamp(3.0rem,2.083vw,4.0rem);
line-height: 1.4;
letter-spacing: 0.1em;
margin-top: 5px;
margin-bottom: 10px;
}
.contact-tel-block .tel span {
font-size: clamp(4.0rem,2.604vw,5.0rem);
margin-left: 8px;
letter-spacing: 0.05em;
}
.contact-tel-block .note {
font-size: 1.4rem;
}

@media all and (max-width : 767px ){
.contact-tel-block {
	margin: 40px 0 0px;
	padding: 0px 0px 25px;
}
.lbd-ttl {
font-size: 1.6rem;
line-height: 1.75;
margin-top: -14px;
margin-bottom: 5px;
}
.contact-tel-block .tel_txt,
.contact-tel-block .note {
font-size: 1.6rem;
}
.contact-tel-block .tel {
font-size: 2.4rem;
font-weight: 500;
letter-spacing: 0.05em;
margin-bottom: 0;
}
.contact-tel-block .tel {
font-size: 1.6rem;
}
.contact-tel-block .tel span {
font-size: 2.6rem;
letter-spacing: 0.08em;
margin-left: 5px;
}
.contact-tel-block .note {
font-size: 1.1rem;
}
}


@media all and (max-width: 1260px) {
.service_sticky_box__title {
font-size: 3.6rem;
}
.service_sticky_box__lead {
font-size: 1.5rem;
line-height: 2;
}
.service_sticky_box__num {
font-size: 7.5rem;
}
}

@media all and (max-width : 1024px ){
.service_sticky_box__body {
max-width: 700px;
}
.service_sticky_box__num {
font-size: 4.5rem;
top: 33%;
padding-right: 10px;
}
.service_sticky_box__num::after {
width: 10px;
height: 1px;
}
}

@media all and (max-width: 980px) {
.service_sticky_box__title {
font-size: 2.8rem;
margin-bottom: 25px;
}
}

@media all and (max-width : 820px ){
.service_sticky_box__title_en {
font-size: 6.0rem;
}
}

@media all and (max-width: 767px) {
.content {
padding: 30px 0 0;
}
.service_sticky_box {
min-height: 100vh;
}
.service_sticky_box__panel {
min-height: 100vh;
display: flex;
align-items: center;
}
.service_sticky_box__body {
max-width: 100%;
}
.sec_service_sticky .intro_title {
margin-bottom: 10px;
}
.service_sticky_box__body .c_title {
margin-bottom: 10px;
}
.service_sticky_box__title_en {
margin-bottom: 20px;
margin-right: 10px;
}
.service_sticky_box__title_jp {
font-size: 1.6rem;
letter-spacing: 0.1em;
padding-left: 15px;
margin-top: -5%;
}
#sec_skate .service_sticky_box__title_jp {
font-size: 1.5rem;
}
.service_sticky_box__title_jp::before {
content: "/";
font-size: 1.4rem;
position: absolute;
left: 0;
top: 1px;
}
.service_sticky_box__copy {
font-size: 1.8rem;
letter-spacing: 0.15em;
margin-bottom: 20px;
}
.service_sticky_box__lead {
font-size: 1.3rem;
line-height: 2.0;
letter-spacing: 0.1em;
}
.service_sticky_box__num {
font-size: 3.6rem;
top: 7%;
}
.service_sticky_box .link_btn_box {
margin-top: 30px;
}
}


/* sec_golf
-------------------------------------------------- */

#sec_golf .service_sticky_box__body,
#sec_golf .service_sticky_box__title_en,
#sec_golf .service_sticky_box__title_jp,
#sec_golf .service_sticky_box__copy,
#sec_golf .service_sticky_box__lead {
position: relative;
z-index: 3;
color: #fff;
}


/*------------------------------------------------- 
scroll bar
------------------------------------------------- */

.scroll_bar a {
position: absolute;
top: -150px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
z-index: 11;
padding: 10px 10px 110px;
color: #ddd;
}
.scroll_bar a::after {
content: '';
position: absolute;
bottom: -100px;
left: 50%;
width: 1px;
height: 200px;
background: #ddd;
}
.scroll_bar a::before {
content: '';
position: absolute;
bottom: -100px;
left: 50%;
width: 1px;
height: 200px;
background-color: rgba(131, 131, 127, 0.4);
}
.scroll_bar a::after {
animation: sdl 1.5s cubic-bezier(1, 0, 0, 1) infinite;
}

@keyframes sdl {
0% {
transform: scale(1, 0);
transform-origin: 0 0;
}
50% {
transform: scale(1, 1);
transform-origin: 0 0;
}
50.1% {
transform: scale(1, 1);
transform-origin: 0 100%;
}
100% {
transform: scale(1, 0);
transform-origin: 0 100%;
}
}

@media all and (max-width : 767px ){
.scroll_bar a::after {
bottom: -30px;
height: 60px;
}
.scroll_bar a::before {
bottom: -30px;
height: 60px;
}
}


/*-------------------------------------------------
golf_inner
-------------------------------------------------*/

#sec_golf {
position: relative;
width: 100%;
height: 100vh;
z-index: 3;
color: #fff;
}
#golf_inner {
position: relative;
width: 100%;
background: #fff;
padding: 100px 0 50px;
}
.tab-contents {
position: relative;
}
.golf_intro_txt {
font-size: 1.5rem;
margin-left: 35px;
margin-bottom: 30px;
letter-spacing: 0.2em;
}
.program_map_wrap {
margin-bottom: 30px;
}
.golf_list_ttl {
font-size: 1.7rem;
font-weight: 600;
color: #034E95;
padding-left: 16px;
margin-bottom: 10px;
letter-spacing: 0.15em;
}
.program_map_ttl {
margin-bottom: 15px;
font-size: 1.4rem;
padding-left: 18px;
}

@media all and (max-width : 820px ){
#golf_inner {
padding: 60px 0 30px;
}
}

@media all and (max-width : 767px ){
#golf_inner {
padding: 40px 0 30px;
}
.golf_intro_txt {
font-size: 1.3rem;
margin-left: 5px;
margin-bottom: 25px;
letter-spacing: 0.1em;
}
.program_map_wrap {
margin-bottom: 20px;
}
.program_map_ttl {
margin-bottom: 10px;
font-size: 1.3rem;
padding-left: 18px;
letter-spacing: 0;
}
.golf_list_ttl {
font-size: 1.4rem;
padding-left: 5px;
margin-bottom: 10px;
letter-spacing: 0.1em;
}
.program_map_ttl {
margin-bottom: 15px;
font-size: 1.2rem;
padding-left: 5px;
}
}

.area_tab_nav {
margin-top: 40px;
position: relative;
}
.area_tab_nav:before {
content: "";
position: absolute;
left: 0;
bottom: 0;
right: 0;
z-index: 0;
}
.area_tab_nav ul {
display: flex;
font-weight: 500;
font-size: 1.6rem;
line-height: 100%;
}

@media all and (max-width : 767px ){
.area_tab_nav {
margin-top: 20px;
}
.area_tab_nav ul {
display: flex;
font-size: 1.0rem;
}
}

.area_tab_nav ul li:first-child {
margin-left: 0;
}
.area_tab_nav ul li {
width: 100%;
margin: 0 1px;
}
.area_tab_nav ul li>*:hover, .area_tab_nav ul li.cur>* {
background: #00377E;
color: #fff;
}
.area_tab_nav ul li>a, .area_tab_nav ul li>span {
display: flex;
height: 52px;
align-items: center;
justify-content: center;
background: #EEEEEE;
color: #333;
border-radius: 20px 20px 0 0;
position: relative;
transition: all 0.3s ease;
cursor: pointer;
}

@media all and (max-width : 767px ){
.area_tab_nav ul li>a, .area_tab_nav ul li>span {
display: flex;
height: 32px;
text-align: center;
border-radius: 5px 5px 0 0;
}
}

/* タブコンテンツ
-------------------------------------------------- */

.tab-contents {
position: relative;
}
.tab-contents-list {
display: none;
opacity: 0;
}
.tab-contents-list.cur {
display: block;
opacity: 1;
}
.map_imgbox {
border: solid 1px #ddd;
padding: 10px 20px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-bottom: 20px;
}
.map_img {
max-width: 676px;
height: auto;
}
.area_map_nav {
height: 143px;
overflow-y: auto;
}

@media all and (max-width : 767px ){
.area_map_nav {
height: 82px;
}
}

.area_map_nav ul {
display: flex;
flex-wrap: wrap;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
counter-reset: item;
padding-left: 0;
margin: 0;
}
.area_map_nav ul li {
width: 50%;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
padding: 12px 20px 12px 50px;
position: relative;
list-style: none;
}
.area_map_nav ul li::before {
counter-increment: item;
content: counter(item) ".";
position: absolute;
left: 20px;
top: 10px;
}
.area_map_nav ul li a {
font-size: 1.4rem;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}

@media all and (max-width : 820px ){
.area_map_nav ul li a {
font-size: 1.3rem;
}
}

@media all and (max-width : 767px ){
.area_map_nav ul li {
width: 100%;
padding: 10px 10px 10px 45px;
}
.area_map_nav ul li::before {
font-size: 1.2rem;
left: 20px;
top: 10px;
}
.area_map_nav ul li a {
font-size: 1.2rem;
}
}

.area_map_nav ul li a:hover {
text-decoration: underline;
color: #034E95;
}



/*-------------------------------------------------
footpath_inner
-------------------------------------------------*/

.footpath_inner {
position: relative;
width: 100%;
padding: 80px 0 50px;
background: #00377E;
color: #fff;
}
.footpath_inner .sec_titlebox dt,
.footpath_inner .sec_titlebox dd {
color: #fff;
}
.footpath_inner .sec_titlebox dt::before {
background: #fff;
}
.footpath_intro_txt {
font-size: 1.5rem;
margin-left: 35px;
margin-bottom: 40px;
letter-spacing: 0.2em;
}
.footpath_box_wrap {
display: flex;
flex-wrap: wrap;
}
.footpath_box {
width: calc(50% - 40px / 2);
margin-right: 40px;
margin-bottom: 40px;
position: relative;
z-index: 3;
}
.footpath_box:nth-child(2n) {
margin-right: 0;
}

@media all and (max-width : 1024px ){
.footpath_box {
width: calc(50% - 30px / 2);
margin-right: 30px;
}
}

.footpath_img {
position: relative;
margin-bottom: 20px;
}
.footpath_img::after {
content: "";
display: block;
background: #000;
opacity: 0.2;
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}
.footpath_img img {
width: 100%;
}
.footpath_img .num {
font-family: "balboa", sans-serif;
font-weight: 300;
font-size: 7.0rem;
letter-spacing: 0;
line-height: 100%;
position: absolute;
bottom: -5px;
left: 10px;
color: transparent;
-webkit-text-stroke: 1px #fff;
z-index: 2
}
.footpath_img .num::before {
content: '#';
color: #fff;
font-size: 4.0rem;
font-weight: 400;
display: inline-block;
margin-right: 5px;
}
.footpath_txtbox {
margin-bottom: 30px;
}
.footpath_txtbox dt {
font-size: 2.2rem;
font-weight: 500;
letter-spacing: 0.2em;
margin-left: -10px;
margin-bottom: 20px;
}
.footpath_txtbox dd {
font-size: 1.5rem;
line-height: 200%;
}

@media all and (max-width : 1024px ){
.footpath_txtbox dt {
font-size: 2.0rem;
}
}

@media all and (max-width : 820px ){
.footpath_intro_txt {
font-size: 1.45rem;
line-height: 1.8;
margin-bottom: 30px;
letter-spacing: 0.2em;
}
.footpath_box {
width: calc(50% - 20px / 2);
margin-right: 20px;
}
.footpath_txtbox dt {
font-size: 1.7rem;
}
.footpath_txtbox dd {
font-size: 1.4rem;
line-height: 180%;
}
}

@media all and (max-width : 767px ){
.footpath_inner {
padding: 40px 0 20px;
}
.footpath_intro_txt {
font-size: 1.2rem;
margin-left: 5px;
margin-bottom: 30px;
letter-spacing: 0.1em;
}
.footpath_box_wrap {
display: flex;
flex-direction: column;
}
.footpath_box {
width: 100%;
margin-right: 0px;
margin-bottom: 30px;
}
.footpath_img .num {
font-size: 5.0rem;
}
.footpath_img .num::before {
font-size: 3.0rem;
}
.footpath_txtbox {
margin-bottom: 15px;
}
.footpath_txtbox dt {
font-size: 1.6rem;
}
.footpath_txtbox dd {
font-size: 1.3rem;
}
}




/*-------------------------------------------------
ハンバーガーメニュー背景
-------------------------------------------------*/

#open_navi {
position:fixed;
z-index: 999;
/*ナビのスタート位置と形状*/
top:-120%;
left:0;
width:100%;
height: 100vh;/*ナビの高さ*/
background: rgba(25, 38, 48, 0.95);
transition: all 0.5s ease;
}

/*アクティブクラスがついたら位置を0に*/
#open_navi.panelactive{
top: 0;
}

/*ナビゲーションの縦スクロール*/
#open_navi.panelactive .open_navi_list {
position: fixed;
z-index: 999; 
width: 100%;
height: 100vh;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
#open_navi .ham_logo {
max-width: 130px;
height: auto;
margin: 15px 0 0 15px;
}

@media all and (max-width : 767px ){
#open_navi .ham_logo {
max-width: 120px;
margin: 15px 0 0 15px;
}
}

/*ナビゲーション*/
#open_navi ul {
/*ナビゲーション天地中央揃え*/
position: absolute;
z-index: 999;
top:50%;
left:50%;
transform: translate(-50%,-50%);
white-space: nowrap; 
}
#open_navi ul li a {
padding: 15px 10px 15px;
display: block;
font-family: 'PressioTEST-No.35';
font-weight: normal;
font-size: 3.0rem;
letter-spacing: 0.08em;
color: #fff;
transition: all 0.6s ease;
}
#open_navi ul li .ham_menu_ja {
font-family: 'Noto Sans JP', sans-serif;
font-weight: 500;
font-size: 1.4rem;
letter-spacing: 0.1em;
color: #ddd;
position: relative;
padding-left: 10px;
margin-left: 15px;
}
#open_navi ul li .ham_menu_ja::before {
content: "/";
color: #ddd;
font-size: 1.2rem;
position: absolute;
left: -5px;
top: -2px;
}

@media all and (max-width : 767px ){
#open_navi ul li a {
padding: 10px;
font-size: 2.2rem;
letter-spacing: 0.08em;
}
#open_navi ul li .ham_menu_ja {
font-size: 1.0rem;
padding-left: 6px;
margin-left: 10px;
}
#open_navi ul li .ham_menu_ja::before {
font-size: 1.1rem;
}
}

#open_navi ul li a:hover {
color: #999;
transition: all 0.6s ease;
}


/* ハンバーガーメニュー
-------------------------------------------------- */

.openbtn {
opacity: 0;
visibility: hidden;
pointer-events: none;
position: fixed;
z-index: 9999;
top: 0.5vw;
left: 1.5%;
cursor: pointer;
width: 30px;
height: 45px;
mix-blend-mode: difference;
transform: translateY(-10px);
transition: all 0.4s ease;
display: none;
}
.openbtn.fadeDown {
opacity: 1;
visibility: visible;
pointer-events: auto;
transform: translateY(0);
animation: fadeDownAnime 0.5s ease forwards;
}

@keyframes fadeDownAnime {
from {
opacity: 0;
transform: translateY(-10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}

/* ×に変化 */	
.openbtn span{
display: inline-block;
transition: all .4s ease;
position: absolute;
left: 0px;
height: 1px;
background-color: #fff;
width: 100%;
}
.openbtn span:nth-of-type(1) {
top:15px;	
}
.openbtn span:nth-of-type(2) {
top:27px;
}
.openbtn span:nth-of-type(3) {
top:37px;
}
.openbtn.active span:nth-of-type(1) {
top: 18px;
left: 0px;
transform: translateY(6px) rotate(-45deg);
width: 100%;
background-color: #fff;
}
.openbtn.active span:nth-of-type(2) {
opacity: 0;
}
.openbtn.active span:nth-of-type(3){
top: 30px;
left: 0;
transform: translateY(-6px) rotate(45deg);
width: 100%;
background-color: #fff;
}

@media all and (max-width : 1535px ){
.openbtn {
display: block;
}
}

@media all and (max-width: 1023px) {
.openbtn {
opacity: 1 !important;
visibility: visible !important;
pointer-events: auto !important;
transform: none !important;
}
}

@media all and (max-width : 767px ){
.openbtn {
top:10px;
right: 15px;
width: 32px;
height:32px;
}
.openbtn span{
position: absolute;
left: 16px;
height: 1px;
width: 60%;
}
.openbtn span:nth-of-type(1) {
top:9px;	
}
.openbtn span:nth-of-type(2) {
top:16px;
}
.openbtn span:nth-of-type(3) {
top:23px;
}
.openbtn.active span:nth-of-type(1) {
top: 11px;
left: 10px;
width: 75%;
}
.openbtn.active span:nth-of-type(3){
top: 23px;
left: 10px;
width: 75%;
}
}




/*-------------------------------------------------
コンテンツ領域
-------------------------------------------------*/

main {
position: relative;
z-index: 30;
background: #fff;
}

.box_s {
max-width: 980px;
margin: 0 auto;
}

@media all and (max-width : 980px ){
.box_s {
padding: 0 20px;
}
}

.box_m {
max-width: 1260px;
margin: 0 auto;
}

@media all and (max-width : 1260px ){
.box_m {
padding: 0 20px;
}
}

.box_l {
max-width: 1536px;
margin: 0 auto;
}

@media all and (max-width : 1536px ){
.box_l {
padding: 0 20px;
}
}


/*-------------------------------------------------
Footer 
-------------------------------------------------*/

footer {
width: 100%;
position: relative;
padding: 50px 0 20px;
z-index: 40;
background: #293337;
}
.foot_logo_wrap {
display: flex;
flex-direction: column;
align-items: center;
}
.foot_logo {
font-family: 'PressioTEST-No.35';
font-style: normal;
font-size: 5.0rem;
letter-spacing: 0.06em;
color: #fff;
line-height: 1;
margin-bottom: 30px;
}
.foot_c_name {
font-size: 1.4rem;
font-weight: 500;
letter-spacing: 0.3em;
color: #eee;
margin-bottom: 15px;
}
.address_txt {
font-size: 1.2rem;
font-weight: 400;
color: #ccc;
display: block;
letter-spacing: 0.2em;
margin-bottom: 30px;
}
.foot_sns {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 35px;
}
.foot_sns li a {
width: 20px;
margin-right: 23px;
transition-duration: 0.7s;
}
.foot_sns li:last-of-type a {
margin-right: 0px;
}
.foot_sns li a:hover {
opacity: 0.7;
transition-duration: 0.7s;	
}
.copyright {
font-family: "balboa", sans-serif;
font-weight: 200;
font-size: 1.1rem;
color: #ddd;
letter-spacing: 0.1em;
line-height: 1;
}

@media all and (max-width : 820px ){
.foot_logo {
font-size: 4.0rem;
margin-bottom: 20px;
}
}

@media all and (max-width : 767px ){
footer {
padding: 30px 0 20px;
}
.foot_logo {
font-size: 3.6rem;
margin-bottom: 15px;
}
.address_txt {
font-size: 1.0rem;
margin-left: 0;
letter-spacing: 0.15em;
text-align: center;
line-height: 180%;
}
.foot_sns {
margin-bottom: 30px;
}
.foot_sns li a {
margin-right: 20px;
}
.copyright {
font-size: 1.0rem;
display: block;
text-align: center;
}
}


/*-------------------------------------------------
page top
-------------------------------------------------*/

.page_top {
width: 48px;
height: 48px;
position: fixed;
right: 20px;
bottom: 40px;
background: #0055B4;
opacity: 0.9;
z-index: 999;
border-radius: 50px;
}
.page_top a::before{
font-family: 'Font Awesome 5 Free';
font-weight: 700;
content: '\f106';
font-size: 17px;
color: #fff;
position: absolute;
width: 30px;
height: 30px;
top: 0px;
bottom: 0;
right: 0;
left: 0;
margin: auto;
text-align: center;
}

@media all and (max-width : 767px ){
.page_top a {
width: 40px;
height: 40px;
}
.page_top {
width: 40px;
height: 40px;
position: fixed;
right: 10px;
bottom: 200px;
}
}


/*-------------------------------------------------
矩形ボタン
-------------------------------------------------*/

.link_btn {  
position: relative;
font-size: 1.4rem;
font-weight: 500;
letter-spacing: 0.1em;
text-decoration: none;
display: inline-block;
color:#fff;
padding: 20px 100px 20px 100px;
background-color: transparent;
border: 1px solid #fff;
text-align: center;
outline: none;
transition: ease .3s;
}
.link_btn:hover {
background: #008CCF;
color:#fff;
border: 1px solid #008CCF;
transition: ease .3s;
}
.btn_arrow::after{ 
content: '';
position: absolute;
top:44%;
right: 20px;
width: 8px; 
height: 8px;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
transform: rotate(45deg);
transition: ease .3s;
}
.btn_arrow:hover::after {
right: 15px;
transition: .3s;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
}
.link_btn_box {
display: flex;
justify-content: center;
}

@media all and (max-width : 767px ){
.link_btn {  
font-size: 1.2rem;
font-weight: 400;
padding: 15px 35px 15px 35px;
}
.btn_arrow::after { 
top: 44%;
right: 12px;
width: 6px;
height: 6px;
}
}


/*-------------------------------------------------
circle btn
-------------------------------------------------*/

.all_more .all_more_inner {
padding: 15px 58px 16px 0;
position: relative;
display: inline-block;
line-height: 1;
}
.all_more .all_more_inner .all_more_line {
position: relative;
display: inline-block;
line-height: 1;
font-weight: 600;
font-size: 1.4rem;
color: #fff;
letter-spacing: 0.1em;
}
.all_more .all_more_inner .all_more_line::after {
content: "";
background: #fff;
width: 0;
height: 1px;
position: absolute;
bottom: -4px;
left: 0;
transition: all .3s;
}
.all_more .all_more_inner .all_more_icon {
background: #FFF;
border: 1px solid #EDEDED;
border-radius: 55px;
height: 44px;
width: 44px;
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
transition: all .3s;
}
.all_more .all_more_inner .all_more_icon::before {
content: "";
background: url(../img/arrow_circle_l.svg) no-repeat center / contain;
width: 45px;
height: 45px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%) scale(0);
transition: .3s;
}
.all_more .all_more_inner:hover { 
opacity: 1; 
}
.all_more .all_more_inner .all_more_icon::after {
content: "";
background: #000;
width: 6px;
height: 6px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
border-radius: 10px;
transition: opacity .2s, transform .3s;
}
.all_more a:hover .all_more_line::after {
width: 100%;
}
.all_more a:hover .all_more_icon {
border-color: transparent;
}
.all_more a:hover .all_more_icon::after {
transform: translate(-50%, -50%) scale(3);
opacity: 0;
}
.all_more a:hover .all_more_icon::before {
transform: translate(-50%, -50%) scale(1);
}

@media screen and (max-width:767px) {
.all_more .all_more_inner {
padding: 15px 45px 16px 0;
}
.all_more .all_more_inner .all_more_line {
font-size: 1.2rem;
letter-spacing: 0.05em;
}
.all_more .all_more_inner .all_more_icon {
border-radius: 35px;
height: 35px;
width: 35px;
}
.all_more .all_more_inner .all_more_icon::after {
width: 5px;
height: 5px;
}
}