@charset "utf-8";

/*common*/
.pc-only { display: block!important; }
.sp-only { display: none!important; }

section, main { position: relative; display: block; }
body { width: 100%; overflow-x: hidden; }

img { max-width: 100%; }

@media screen and (max-width: 900px) {
	.pc-only { display: none!important; }
	.sp-only { display: block!important; }
    
    html, body { width: 100%; overflow-x: hidden; }
}

/*no-js*/
.no-js .js-scroll-fade,
.no-js .top_main_txt.is-animation .catch,
.no-js .top_main_txt.is-animation .read { opacity: 1!important; }
.no-js body #loading { display: none; }

/*loading*/
body #loading {
    background: #fff;
    display: block;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100010;
    pointer-events: none;
    -webkit-transition: opacity 1.5s cubic-bezier(.16,1,.3,1) 0.5s; transition: opacity 1.5s cubic-bezier(.16,1,.3,1) 0.5s;
}

body #loading.is-animation {
    opacity: 0;
}

/*fade*/
.js-scroll-fade { opacity: 0; }
.isActive  {
    -webkit-animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
    animation-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
    -webkit-animation-duration: 1.8s;
    animation-duration: 1.8s;
    -webkit-animation-name: fadeUp;
    animation-name: fadeUp;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}
@-webkit-keyframes fadeUp{
	0%{opacity:0;-webkit-transform:translateY(50px);transform:translateY(50px)}
    10%{opacity:0; }
	to{opacity:1;-webkit-transform:none;tansform:none}
}
@keyframes fadeUp{
	0%{opacity:0;-webkit-transform:translateY(50px);transform:translateY(50px)}
    10%{opacity:0; }
	to{opacity:1;-webkit-transform:none;transform:none}
}

/*top*/
.header_logo { width: 14.39%; position: absolute; top: calc( 72 / 1980 * 100vw); left: 7.07%; z-index: 2; }
.top_main_ph { width: 100%; height: 100dvh; }
.top_main_ph img { width: 100%; height: 100dvh; object-fit: cover; }
.top_main_copy { width: 14.79%; position: absolute; top: 12.92%; right: 7.07%; }

.top_about > .inner { width: 85.85%; margin: 0 auto; padding:  calc( 140 / 1980 * 100vw) 0; border-bottom:  1px solid #ababac; }
.common_hd { text-align: center; }
.common_hd .ja { font-size: calc( 35 / 1980 * 100vw); line-height: 1.5; }
.common_hd .en { font-size: calc( 25 / 1980 * 100vw); line-height: 1.5; }

.top_about_item { display: flex; justify-content: space-between; margin-top: calc( 140 / 1980 * 100vw); }
.top_about_item .ph { width: 50%; }
.top_about_item:first-child .ph { padding-bottom: 4em; }
.top_about_item .txt { width: 45.70%; position: relative; }
.top_about_item .hd { display: flex; width: 100%; position: absolute; top: 0; }
.top_about_item .en { width: 2.83%; font-size: calc( 25 / 1980 * 100vw); position: relative; }
.top_about_item .en span { display: inline-block; width: 100%; position: absolute; white-space: nowrap; -webkit-transform:rotate(90deg) translateY(-100%); -webkit-transform:rotate(90deg) translateY(-100%); transform-origin: top left; transform-origin: top left; line-height: 1.5; }
.top_about_item .ja { font-size: calc( 35 / 1980 * 100vw); -ms-writing-mode: tb-rl; writing-mode: vertical-rl; line-height: 1.75; font-feature-settings: initial; }
.top_about_item .ico { width: 27.35%; }
.top_about_item .body { position: absolute; bottom: 0; }
.top_about_item .more { margin-top: calc( 60 / 1980 * 100vw); }
.top_about_item .more a { width: calc( 160 / 1980 * 100vw); padding: 10px; font-size: calc( 15 / 1980 * 100vw); display: flex; align-items: center; border: 1px solid #000; }
.top_about_item .more a .linktxt { font-size: calc( 15 / 1980 * 100vw); }
.top_about_item .more a .arrow { width: calc( 28 / 1980 * 100vw); margin-left: calc( 5 / 1980 * 100vw); line-height: 0; }

.top_about_item:nth-child(1) .en,
.top_about_item:nth-child(2) .en { width: 8.53%; }
.top_about_item:nth-child(2n+1) .hd { justify-content: flex-end; }
.top_about_item:nth-child(2n+1) .en { order: 3; margin-left: 2.18%; }
.top_about_item:nth-child(2n+1) .ja { order: 2; }
.top_about_item:nth-child(2n+1) .ico { order: 1; margin-right: 5.27%; }

.top_about_item:nth-child(2n) { flex-direction: row-reverse; }
.top_about_item:nth-child(2n) .en { order: 2; margin-left: 2.18%; }
.top_about_item:nth-child(2n) .ja { order: 1; }
.top_about_item:nth-child(2n) .ico { order: 3; margin-left: 5.27%; }

.top_access > .inner { width: 93.93%; margin: calc( 140 / 1980 * 100vw) auto; }
.top_access_body { text-align: center; }
.top_access_body address { margin: calc( 50 / 1980 * 100vw) 0 calc( 60 / 1980 * 100vw); font-size: calc( 32 / 1980 * 100vw); }
.top_access_body .map {
    position: relative;
    width: 100%;
    padding-top: 43.01%;
    height: 0;
}

 .top_access_body .map iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.top_access_body .parking { font-size: calc( 25 / 1980 * 100vw); margin: calc( 40 / 1980 * 100vw) 0 calc( 20 / 1980 * 100vw); }
.top_access_body .data { font-size: calc( 22 / 1980 * 100vw); }
.parking_list { display: flex; justify-content: center; }
.parking_list { margin-top: calc( 25 / 1980 * 100vw); }
.parking_list > div { width: calc( 70 / 1980 * 100vw); margin: 0 calc( 8 / 1980 * 100vw); }

footer { background: #000; padding: calc( 85 / 1980 * 100vw) 0 calc( 135 / 1980 * 100vw); }
footer > .inner { width: 85.86%; margin: 0 auto; display: flex; }
.footer_logo { width: 14.23%; }
.footer_info { margin: calc( 50 / 1980 * 100vw) 0 0 7.29%; }
.footer_info th, .footer_info td { font-size: calc( 15 / 1980 * 100vw); color: #fff; }
.footer_info th { width: 8em;}

@media screen and (max-width: 900px) {
    .header_logo { width: 38%; position: absolute; top: calc( 72 / 768 * 100vw); left: 50%;-webkit-transform:translateX(-50%);transform:translateX(-50%) z-index: 2; }
.top_main_ph { width: 100%; height: 100dvh; }
.top_main_ph img { width: 100%; height: 100dvh; object-fit: cover; }
    .top_main_copy { width: 32%; position: absolute; top: 30.92vw; right: 7.07%; }

.top_about > .inner { width: 85.85%; margin: 0 auto; padding:  calc( 140 / 768 * 100vw) 0; border-bottom:  1px solid #ababac; }
.common_hd { text-align: center; }
    .common_hd .ja { font-size: calc( 35 / 768 * 100vw); line-height: 1.5; }
.common_hd .en { font-size: calc( 25 / 768 * 100vw); line-height: 1.5; }

    .top_about_item { display: block; justify-content: space-between; margin-top: calc( 80 / 768 * 100vw); }
    .top_about_item .ph { width: auto; }
    .top_about_item:first-child .ph { padding-bottom: 0; }
    .top_about_item .txt { width: auto; position: relative; text-align: center; }
    .top_about_item .hd { display: block; width: 100%; position: relative; top: 0; }
    .top_about_item .en { margin: calc( 35 / 768 * 100vw) 0 0; font-size: calc( 25 / 768 * 100vw); width: auto!important; text-align: center; }
    .top_about_item .en span { display: inline-block; width: 100%; position: relative; white-space: nowrap; -webkit-transform:rotate(0) translateY(0); -webkit-transform:rotate(0) translateY(0); transform-origin: top left; transform-origin: top left; line-height: 1.5; }
    .top_about_item .ja { margin-bottom: calc( 15 / 768 * 100vw); font-size: calc( 35 / 768 * 100vw); -ms-writing-mode: rl; writing-mode: horizontal-tb; line-height: 1.5; }
    .top_about_item .ico { width: 32.35%; margin: 0 auto calc( 35 / 768 * 100vw); }
    .top_about_item .body { position: relative; bottom: 0; }
.top_about_item .more { margin-top: calc( 60 / 768 * 100vw); }
    .top_about_item .more a { width: calc( 256 / 768 * 100vw);  margin: 0 auto; display: flex; justify-content: center; align-items: center; }
.top_about_item .more a .linktxt { font-size: calc( 25 / 768 * 100vw); }
.top_about_item .more a .arrow { width: calc( 28 / 768 * 100vw); margin-left: calc( 5 / 768 * 100vw); line-height: 0; }

.top_about_item:nth-child(2n+1) .hd { justify-content: flex-end; }
.top_about_item:nth-child(2n+1) .en { order: 3; margin-left: 2.18%; }
.top_about_item:nth-child(2n+1) .ja { order: 2; }
.top_about_item:nth-child(2n+1) .ico { order: 1; margin-right: auto; }

.top_about_item:nth-child(2n) { flex-direction: row-reverse; }
.top_about_item:nth-child(2n) .en { order: 2; margin-left: 2.18%; }
.top_about_item:nth-child(2n) .ja { order: 1; }
.top_about_item:nth-child(2n) .ico { order: 3; margin-left: auto; }

.top_access > .inner { width: 93.93%; margin: calc( 140 / 768 * 100vw) auto; }
.top_access_body { text-align: center; }
.top_access_body address { margin: calc( 50 / 768 * 100vw) 0 calc( 60 / 768 * 100vw); font-size: calc( 32 / 768 * 100vw); }
    .top_access_body .map {
        position: relative;
        width: 100%;
        padding-top: 111.01%;
        height: 0;
    }

 .top_access_body .map iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.top_access_body .parking { font-size: calc( 25 / 768 * 100vw); margin: calc( 40 / 768 * 100vw) 0 calc( 20 / 768 * 100vw); }
    .top_access_body .data { font-size: calc( 25 / 768 * 100vw); }
.parking_list { display: flex; justify-content: center; }
.parking_list { margin-top: calc( 25 / 768 * 100vw); }
    .parking_list > div { width: calc( 100 / 768 * 100vw); margin: 0 calc( 8 / 768 * 100vw); }

footer { background: #000; padding: calc( 85 / 768 * 100vw) 0 calc( 135 / 768 * 100vw); }
    footer > .inner { width: 85.86%; margin: 0 auto; display: flex; flex-direction: column; align-items: center; }
.footer_logo { width: 30.23%; }
    .footer_info { margin: calc( 60 / 768 * 100vw) 0 0; }
    .footer_info th, .footer_info td { font-size: calc( 25 / 768 * 100vw); color: #fff; }
.footer_info th { width: 8em;}
    
}

/*link*/
*.link_txt { text-decoration: underline!important; }
.partner_list_item .link a { border-bottom: 1px solid #000; }

@media screen and (min-width: 900px) {   
    *.link_txt:hover { text-decoration: none!important; }
    .partner_list_item .link a:hover { border-bottom: none; }
    
    .more a { -webkit-transition: opacity 1.0s cubic-bezier(.16,1,.3,1); transition: opacity 1.0s cubic-bezier(.16,1,.3,1); }
    .more a:hover { opacity: 0.5; }
    
}
