@charset "UTF-8";
/* css変数-------- */
:root {--shibaura-blue: #134D8A;--accent-gold: #A58022;--bg-color: #EDEBE7;}
/* ここからコンテンツの内容 --------*/
html { font-size: 62.5%; } /* font-sizeは16pxの62.5%の10px */
body{background-color: var(--bg-color);color: #000;font-family: YakuHanJP,"Zen Kaku Gothic New", sans-serif;font-weight: 400;}
/* modal top -----------*/
dialog{width: 445px;border-radius: 16px;padding: 0;}
dialog::backdrop {background-color: rgba(0, 0, 0, 0.20);}
.modal_wrap {padding: 40px 40px;display: flex;flex-wrap: wrap;flex-direction: column;gap: 32px;justify-content: center;text-align: center;position: relative;}
#close-x-button {position: absolute;top: 20px;right: 20px;width: 24px;height: 24px;background: none;cursor: pointer;padding: 0;}
#close-x-button::before,#close-x-button::after {content: "";position: absolute;top: 50%;left: 50%;width: 17.8px;height: 1.2px;background-color: #1C1B1F;}
#close-x-button::before {transform: translate(-50%, -50%) rotate(45deg);}
#close-x-button::after {transform: translate(-50%, -50%) rotate(-45deg);}
.modal_wrap h2{font-size: 2.6rem;line-height: 1.65;font-weight: 700;letter-spacing: 2.6px;color: var(--shibaura-blue);}
.modal_wrap p,.modal_wrap b{font-size: 2rem;line-height: 1.95;letter-spacing: 2px;}
.modal_wrap b{font-weight: 700;}
.modal_wrap a{border-bottom: 1px solid #000;}
.modal_wrap button{background-color:#75818E ;font-size: 19.972px;line-height: 1.65;border-radius: 30px;color: #fff;width: fit-content;margin: 0 auto;}
#close-button {padding: 1px 16px;cursor: pointer;}
/* backToTop -----------*/
.backToTop{position: fixed;background-image: linear-gradient(120deg, #134d8a 60%, #88bacd);border-radius: 50%;width: 64px;height: 64px;bottom: 64px;right: 32px;z-index: 999;border: var(--bg-color) 0.5px solid;opacity: 0;visibility: hidden;pointer-events: none;transform: translateY(20px);transition: all 0.3s ease;}
.backToTop span{display: block;width: 4px;height: 20px;background: #fff;position: absolute;top: 55%;left: 50%;transform: translate(-50%, -50%);}
.backToTop span::before {content: "";display: block;width:16px;height: 16px;border-top: 4px solid #fff;border-left: 4px solid #fff;position: absolute;top: 0;left: 50%;transform: translate(-50%, -2px) rotate(45deg);}
.backToTop.is-show {opacity: 1;visibility: visible;pointer-events: auto;transform: translateY(0);}
/* main visual -----------*/
.header_fix{position: sticky;height: 10.3rem;background-image: linear-gradient(0deg, transparent, #fff);display: flex;justify-content: center;align-items: center;top: 0;z-index: 10;}
.header_fix img{width: 442px;display: block;}
.mainheader{background:url(../img/main_visual.png);height: 570px;position: relative;background-repeat: no-repeat;background-size: cover;background-position: center;}
.header_contents{max-width: 1728px;margin: 0 auto;}
.header_contents h1{font-size: 11.1482rem;text-align: center;font-family: YakuHanMP,"Cormorant Garamond", serif;margin-top: 108px;line-height: 1.2;}
.header_contents p{text-align: center;font-size: 2.6rem;line-height: 2;font-family: "Yu Gothic Pr6N";}
/* main -----------*/
/* global nav */
.nav_contents_wrap{max-width: 1728px;margin: 0 auto;display: flex;flex-wrap: wrap;justify-content: center;padding-top: 104px;gap: 32px;}
.access_bill_wrap{display: flex;flex-wrap: wrap;align-items: center;}
.access_gallery_wrap{display: flex;flex-wrap: wrap;align-items: center;}
.access_bill_list{display: flex;flex-wrap: wrap;justify-content: flex-start;gap: 16px;}
.toBill_title{color: var(--accent-gold);font-weight: bold;font-size: 1.4rem;padding: 10px 15px;}
.access_bill_button{color: #fff;font-size: 1.6rem;width: 310px;height: 64px;align-content: center;padding: 16px 20px;position: relative;display: block;border-radius: 40px;}
.access_bill_button::after{position: absolute;content: "";border: 6px solid transparent;border-top: 6px solid #fff;top: 55%;right: 20px;transform: translateY(-50%);}
.toBill{background-image: linear-gradient(120deg, #A58022 60%, #CDC688);}
.toGallery_title{color: var(--shibaura-blue);font-weight: bold;font-size: 1.4rem;padding: 10px 15px;}
.toGallery{background-image: linear-gradient(120deg, #134d8a 60%, #88bacd);}
/* section */
#fromHamamatsu,#fromEntrance,#fromParking,#fromEntranceBarrierFree{position: relative;}
/* section title */
.section_wrap{max-width: 1728px;margin: 0 auto;padding-top: 80px;}
.sectionn_title_wrap{border-bottom: #ccc solid 2px;display: flex;flex-wrap: wrap;position: sticky;top: 0;z-index: 50;background-color: var(--bg-color);padding-top: 24px;}
#basicInfo .sectionn_title_wrap {position: static; /* stickyを解除して、元の配置に戻します */}
.section_title_en{font-family: YakuHanMP,"Cormorant Garamond", serif;font-size: 2.4rem;display: flex;align-items: center;gap: 8px;}
.section_title_en span{font-family: YakuHanMP,"Zen Old Mincho", serif;font-size: 2rem;line-height: 1.65;}
.section_title{font-size: 4rem;letter-spacing: 0.05em;padding: 15px 0;font-weight: 400;}
.title_event_wrap{width: 40%;margin-left: auto;align-content: center;}
.event_list{display: flex;flex-wrap: wrap;justify-content: flex-end;gap: 10px;}
.event_list li a{padding:16px 20px;border-radius: 30px;color: #fff;font-size: 1.6rem;width: 243px;height: 64px;text-align: center;align-content: center;display: flex;gap: 8px;align-items: center;justify-content: center;position: relative;}
.icon_guide{display: block;}
.icon_movie{width: 20px;height: auto;}
.icon_pdf{width: 24px;height: auto;}
.event_movie{background: linear-gradient(to right,  #228da5 31%,#a7eed9 100%);display: block;}
.event_pdf{background: linear-gradient(to right,  #ab442f 31%,#c2a14f 100%);display: block;}
/* section contents */
.section_contents_wrap{display: grid;padding-top: 24px;position: relative;}
.is-top-floorSection{padding-top: 32px;}/* 必ず .section_contents_wrapの下で指示を出す*/
.floor_tag{background-image: linear-gradient(90deg, #D7CBAC 30%, transparent); color: var(--accent-gold);padding: 16px;font-size: 2.4rem;font-family: Arial;font-weight: 400;}
.floor_tag span{display: block;width: 108px;}
.section_contents img{width: 100%;height: auto;}
.stationMap img{position: sticky;top: 152px;z-index: 10;}
/* guidance parking---------- start */
.guidance_parking_wrap{padding: 32px;background-color: #fff;max-width: 1440px;margin: 32px auto 0;display: grid;gap: 32px;grid-template-columns: 1fr 1fr;}
.guidance_parking_wrap h3{color: var(--shibaura-blue);font-size: 2rem;font-weight: 700;line-height: 2;display: flex;align-items: center;gap: 16px;}
.guidance_parking_wrap h3::before,.guidance_parking_wrap h3::after {content: "";height: 1.8px;background-color: var(--shibaura-blue);flex-grow: 1;flex-grow: 0;flex-shrink: 0;width: 6px;}
.guidance_parking_wrap ul li{font-size: 2rem;line-height: 1.9;position: relative;padding-left: 28px;}
.guidance_parking_wrap ul li::before{position: absolute;content: "";width: 4px;height: 4px;border-radius: 50%;background-color: #000;top: calc(1em * 1.9 / 2);transform: translateY(-50%);left: 12px;}
.guidance_text_item{margin-top: 8px;}
.u-text-primary{color:#A51717;font-style: normal;}
.guidance_img_wrap img,.guidance_text_wrap img{width: 100%;height: auto;}
.accordion_title::-webkit-details-marker {display: none;}
.accordion_title{position: relative; background-color: #fff;max-width: 1440px;color: var(--shibaura-blue);font-size: 2rem;font-weight: 700;line-height: 2;display: flex;align-items: center;gap: 16px;padding: 32px;margin: 32px auto 0;}
.accordion_title::before,.accordion_title::after {content: "";height: 1.8px;background-color: var(--shibaura-blue);flex-grow: 1;flex-grow: 0;flex-shrink: 0;width: 6px;}
.accordion_wrap{padding: 0 32px 32px;background-color: #fff;max-width: 1440px;margin: 0 auto;display: grid;gap: 32px;grid-template-columns: 1fr 1fr;transform: translateY(-10px);opacity: 0;transition: transform .5s, opacity .5s;}
details[open] .accordion_wrap {transform: none;opacity: 1;}
.accordion_icon {position: absolute;right: 32px;top: 50%;transform: translateY(-50%);width: 24px;height: 24px;}
.accordion_icon::before,.accordion_icon::after {position: absolute;content: '';width: 3px;height: 100%;background-color: var(--shibaura-blue); left: 50%;top: 0;}
.accordion_icon::before {rotate: 90deg;}
.accordion_icon::after {transition: rotate .3s;}
details[open] .accordion_icon::after {rotate: 90deg;}
/* guidance parking---------- end*/
.is-station{grid-template-columns: 499fr 353fr;gap: 24px;}
.is-floorRoute{grid-template-columns: 1fr 8.9fr 8.9fr;grid-gap: 16px;}
.route_list_item{display:grid;padding-bottom: 24px;}
.is-route{grid-template-columns: 36fr 319fr 319fr;grid-gap: 16px;}
.route_number{width: 36px;height: 36px; font-size: 2.4rem;font-family: Arial, sans-serif;font-weight: 700;display: flex;align-items: center;justify-content: center;}
.bill_color{background-color: var(--accent-gold);color: #fff;}
.gallery_color{background-color: var(--shibaura-blue);color: #fff;}
.route_img{width: 100%;}
.route_img img{width: 100%;}
.route_description{font-size: 2rem;line-height: 1.9;}
/* basic Information */
.access_contents_title{font-size: 1.8rem;font-weight: bold;padding: 10px 0 24px 0;}
.access_contents_wrap{padding-bottom: 15px;margin-top: 32px;}
.access_contents_item li{font-size: 1.6rem;line-height: 2;}
.basicInfoMap{width: 850px;display: block;}
.is-basic{display: grid;gap: 24px;grid-template-columns: 850px 1fr;}
/* footer */
footer{margin-top: 104px;}
.footer_nav{background-image: linear-gradient(120deg, #134d8a 60%, #88bacd);color: #fff;}
.footer_nav_wrap{max-width: 1728px;margin: 0 auto;padding: 120px 16px;display: flex;flex-wrap: wrap;gap: 60px;justify-content: center;align-items: center;}
.footer_toBill_title,.footer_toGallery_title{font-size: 1.6rem;line-height: 2;font-weight: 700;opacity: 0.6;}
.footer_access_bill_wrap,.footer_access_gallery_wrap{display: flex;flex-wrap: wrap;align-items: center;gap: 40px;}
.footer_nav_list{display: flex;flex-wrap: wrap;justify-content: center;gap: 40px;}
.footer_nav_list li{font-size: 1.8rem;}
.footer_nav_list li a{position: relative;display: flex;gap: 16px;align-items: center;}
.footer_nav_list li a::after{content: "";border: 5px solid transparent;border-bottom: 5px solid #fff;}
.logo_area{background-color: #fff;}
.logo_area_wrap{max-width: 1728px;margin: 0 auto;}
.logo_list{display: flex;flex-wrap: wrap;justify-content: center;gap: 72px;padding: 72px 0;}
.logo_list_item{display: flex;flex-direction: column;align-items: center;}
.logo_img{display: block;height: 53px;}
.logo_name{font-size: 1.2rem;padding-top: 20px;font-weight: 700;}
.copy{background-color: #fff;text-align: center;font-size: 1.4rem;padding-bottom: 72px;color: rgba(35,24,2,0.5);}
/* only device*/
.only-pc{display: block;}
.only-sp{display: none;}
/* hover*/
.u-hover-shadow{transition: transform 0.3s ease, opacity 0.3s ease, box-shadow 0.3s ease;}
.u-hover-shadow:hover {opacity: 0.85;box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);}
.u-hover-opacity{transition: transform 0.3s ease, opacity 0.3s ease;}
.u-hover-opacity:hover {opacity: 0.7;}
.u-hover-color{transition: transform 0.3s ease, opacity 0.3s ease;}
.u-hover-color:hover{color: #a7eed9;}
.u-hover-color:hover::after {border-bottom-color: #a7eed9; /* 三角形の色も同じ色に変える！ */}
/* js floor tag */
.sp-fixed-tag{display: none;}

@media screen and (max-width: 1728px) {
    .is-basic{display: grid;gap: 24px;grid-template-columns: 620px 1fr;}
    .basicInfoMap{width: 100%;}
    .section_wrap{padding-left: 20px;padding-right: 20px;}
    .nav_contents_wrap{padding-left: 20px;padding-right: 20px;justify-content: flex-start;width: 90%;margin: 0 auto;}
    .access_bill_wrap,.access_gallery_wrap{display: grid;grid-template-columns: 200px 1fr;grid-gap: 32px;}
    .title_event_wrap{margin-bottom: 16px;}
     /* footer */
    footer{margin-top: 40px;}
    .footer_nav{background-image: none;padding: 0 16px;background-color: var(--shibaura-blue);}
    .footer_nav_wrap{padding: 120px 20px;gap: 104px;align-items: flex-start;}
    .footer_basicInfo_wrap{display: flex;flex-wrap: wrap;align-items: center;}
    .footer_access_bill_wrap,.footer_access_gallery_wrap,.footer_basicInfo_wrap{gap: 8px;flex-direction: column;align-items: flex-start;}
    .footer_nav_list{gap: 8px;flex-direction: column;}
    .footer_nav_list li{font-size: 1.8rem;line-height: 1.65;padding: 0;}
    .footer_nav_list li a::after{right: -30px;}
    .footer_nav_list{margin-top: 8px;}
    .footer_basicInfo_title{display: block;height: 32px;}
}
@media screen and (max-width: 1294px) {
    /* section contents */
    .is-basic,.is-station,.is-floorRoute{display: grid;gap: 24px;grid-template-columns: 1fr;}
    .sectionn_title_wrap{flex-direction: column;}
    .title_event_wrap{margin-left: 0;width: 100%;margin-top: 16px;}
    .event_list{justify-content: flex-start;}
    
}
@media screen and (max-width: 897px) {
    .footer_nav_wrap{gap: 32px;}
    .guidance_parking_wrap,.accordion_wrap{grid-template-columns: 1fr;}
}
/* smp */
@media screen and (max-width: 767px) {
    /* modal top */
    dialog{width: 288px;border-radius: 11.091px;}
    .modal_wrap {padding: 24px 24px;gap: 16px;}
    #close-x-button {top: 13.86px;right: 13.4px;width: 16.636px;height: 16.636px;}
    #close-x-button::before,#close-x-button::after {width: 12.4px;height: 1px;}
    .modal_wrap h2{font-size: 2rem;letter-spacing: 2px;}
    .modal_wrap p,.modal_wrap b{font-size: 1.6rem;letter-spacing: 1px;}
    .modal_wrap button{font-size: 13.844px;border-radius: 20.795px;}
    #close-button {padding: 0.69px 11.09px;}
    /* backToTop */
    .backToTop{width: 48px;height: 48px;right: 16px;}
    .backToTop span{width: 2px;height: 16px;background: #fff;position: absolute;top: 55%;left: 50%;transform: translate(-50%, -50%);}
    .backToTop span::before {content: "";display: block;width:12px;height: 12px;border-top: 2px solid #fff;border-left: 2px solid #fff;position: absolute;top: 0;left: 50%;transform: translate(-50%) rotate(45deg);}
    /* main visual -----------*/
    .header_fix{position: sticky;height: 10.3rem;background-image: linear-gradient(0deg, transparent, #fff);display: flex;justify-content: center;align-items: center;position: sticky;
        top: 0;z-index: 10;}
    .header_fix img{width: 295px;display: block;}
    .header_contents{max-width: 1728px;margin: 0 auto;}
    .header_contents h1{font-size: 7.2rem;margin-top: 70px;}
    .header_contents p{font-size: 1.8rem;margin-top: 28px;}
    /* main */
    /* global nav */
    .global_nav{margin-top: 48px;}
    .nav_contents_wrap{padding: 0 16px;justify-content: center;width: 100%;margin: 0;flex-direction: column;}
    .is-basic,.is-station,.is-route,.is-floorRoute{grid-template-columns: 1fr;display: block;}
    .access_bill_wrap,.access_gallery_wrap{grid-template-columns:1fr;grid-gap: 11px;}
    .toBill_title,.toGallery_title{font-size: 1.6rem;line-height: 2;padding: 0;text-align: center;}
    .access_bill_list{gap: 11px;flex-direction: column;}
    .access_bill_button{width: 295px;margin: 0 auto;height: 64px;align-content: center;}
    .access_bill_button::after{position: absolute;content: "";border: 5.5px solid transparent;border-top: 5.5px solid #fff;top: 55%;right: 20px;transform: translateY(-50%);}
    /* section */
    .section_wrap{padding: 0px 16px;margin-top: 48px;}
    /* section. title */
    .sectionn_title_wrap{margin-left: -16px;margin-right: -16px;padding-left: 16px;padding-right: 16px;padding-top: 16px;}
    .section_title_en{font-family: YakuHanMP,"Cormorant Garamond", serif;font-size: 1.8rem;padding-top: 24px;line-height: 1.2;padding-top: 0;}
    .section_title_en span{font-size: 1.6rem;line-height: 1.2;gap: 4px;}
    .section_title{font-size: 2.6rem;letter-spacing: 0.05em;line-height: 1.4;padding: 0;margin-top: 4px;}
    .access_contents_wrap{padding: 0;}
    .access_contents_title{font-size: 1.8rem;line-height: 2;padding: 0;margin-top: 8px;}
    .access_contents_item{margin-top: 8px;}
    .access_contents_item li{margin-top: 8px;line-height: 1.6;}
    .title_event_wrap{margin-left:0;margin-bottom: 4px;margin-top: 4px;}
    .event_list{justify-content: flex-start;margin-top: 4px;}
    .event_list li a{font-size: 1.4rem;line-height:2;width: 176px;height: 40px;}
    .icon_movie{width: 16px;height: auto;}
    .event_pdf{display: none;}
    /* section. contents */
    .is-top-floorSection{padding-top: 20px;}
    .section_contents img{margin-top: 4px;}
    .basicInfoMap{width: 100%;}
    .floor_tag{background-color: var(--accent-gold);color: #fff;padding: 8px 20px;font-size: 1.8rem;height: 36px;font-weight: 700;background-image: none;width: 78px;margin-left: auto;margin-right: -16px;display: flex;justify-content: center;align-items: center;font-family: yakuHanMP,"Zen Kaku Gothic New", sans-serif;}
    .floor_tag span {width: auto;}
    .route_number{margin-top: 8px;font-size: 1.8rem;}
    /* guidance parking---------- start */
    .guidance_parking_wrap{padding: 16px;width: 100%;margin: 54px 0 0;gap: 16px;margin-bottom: 0;}
    .guidance_parking_wrap h3,.accordion_title{font-size: 1.6rem;line-height: 1;gap: 16px;}
    .guidance_parking_wrap h3::before,.guidance_parking_wrap h3::after {width: 5px;}
    .guidance_text_item{margin-top: 16px;}
    .guidance_parking_wrap ul li{font-size: 1.6rem;line-height: 1.65;padding-left: 24px;letter-spacing: -0.025em;}
    .guidance_parking_wrap ul li::before{left: 8px;top:14px;}
    .accordion_wrap{margin-bottom: 16px;}
    .accordion_title{padding: 16px;margin-top: 16px;}
    .accordion_icon {width: 16px;height: 16px;}
    .accordion_icon::before,.accordion_icon::after {width: 2px;}
    /* guidance parking---------- end*/
    .route_order{margin-top: 8px;}
    .route_list_item{padding-bottom: 0;}
    .route_img,.route_description{margin-top: 4px;}
    .route_img{display: flex;flex-direction: column;gap: 4px;}
    .route_description{ font-size: 1.6rem;line-height: 1.65;margin-bottom: 24px;}
    /* footer */
    .footer_nav_wrap{padding: 120px 20px;gap: 32px;align-items: flex-start;justify-content: flex-start;flex-direction: column;}
    .footer_basicInfo_title{display:inline;height: 0;}
    .footer_basicInfo_wrap{gap: 0;}
    .copy{padding-left: 41px;padding-right: 41px;}
    /* only device */
    .only-pc{display: none;}
    .only-sp{display: block;}
    /* js */
    .sp-fixed-tag{display: block;position: fixed;top: 116px;right: 0;z-index: 1000;background-color: var(--accent-gold);color: #fff;padding: 8px 20px;font-size: 1.8rem;height: 36px;opacity: 0;visibility: hidden;transition: all 0.2s ease;pointer-events: none;font-weight: 700;width: 78px;display: flex;justify-content: center;align-items: center;}
    .sp-fixed-tag.is-active {opacity: 1;visibility: visible;pointer-events: auto;}
}