.wrapper {position: relative;height: 450px;}
.banner-wrapper-fixed {position: fixed;top: 0;left: 0;width: 100%;height: 450px;background-image:none;}
.foreground{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,0.0);background-position: center;background-image: url('../imgs/main/sp-undermain-coinlocker.jpg');background-size: cover;transition: all 0.1s ease 0s;background-repeat: no-repeat;}
.foreground img{width:auto;height:600px;}
/* body#coinlocker .foreground{background-image: url('../imgs/main/sp-undermain-coinlocker.jpg')!important;}
body#parking .foreground{background-image: url('../imgs/main/sp-undermain-parking.jpg')!important;}
body#solar .foreground{background-image: url('../imgs/main/sp-undermain-solar.jpg')!important;} */

.mainvis{display:flex;width:100%;position:relative;overflow:hidden;height:450px;}
.mainvis img{width:auto;height:100%;object-fit: cover;font-family: 'object-fit: cover;';}
.mainvis div.h1box{position:absolute;top:48%;left:50%;transform: translate(-50%,-52%)!important;width:100%;padding:0 .45em;z-index:900;}
.mainvis h1{letter-spacing:2px;font-size:1.4rem;font-weight:700;color:#fff;line-height:1.5;z-index:10;text-align:center;font-family: 'Noto Serif CJK JP', 'Noto Serif JP', sans-serif;}
/* .mainvis p{letter-spacing:2px;font-size:.8rem;font-weight:300;color:#fff;text-align:center;fdisplay:block;line-height:1.9;padding-top:.75em;font-family: 'Noto Serif CJK JP', 'Noto Serif JP', sans-serif;} */
.mainvis p.keisai{font-size:.6rem;padding:2em 0 0 1em;}

@keyframes slideInUp {
from {opacity: 0;transform: translateY(150px);}  
to {opacity: 1;transform: translateX(0);}
}
@keyframes slideInbk {
from {opacity: 0;}  
to {opacity: 1;}
}

.mainvis .mainnavi{position:absolute;bottom:0;right:0;width:37.5%;padding:1em;}
.mainvis .mainnavi p{text-align:right;font-size:.7rem;font-weight:700;line-height:1;letter-spacing:3px;margin-bottom:1em;}
.mainvis .mainnavi ul{width:100%;display: flex; justify-content: flex-end;padding-right:.1em;}
.mainvis .mainnavi li{background-color:#ccc;width:8px;height:8px;border-radius:50%;margin-left:.6em}
.mainvis .mainnavi li.current{background-color:#1a1a1a;}
.white h1,.white p{animation: scrollh1 2s both;}
.white .swiper-container{animation: scrollswiper 8s both;}

@keyframes scrollh1 {
0% {opacity: 1;}
100% {opacity: 0;}
}
@keyframes scrollswiper {
0% {opacity: 1}
100% {opacity: 0;}
}

/* .leadbox{background:#fff;padding:1.5em 1.5em .5em;overflow: hidden;} */
.leadbox ul{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    padding-bottom: 2em;
}
.leadbox li{
    width: 100%;
    background: #89bcd6;
    padding: 1.2em 0;
    color: #fff;
    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
    margin-bottom: 0.5em;
}
.leadbox h2{
    line-height: 1.8em;
    font-size: 1.3rem;
    letter-spacing: 1px;
    text-align: left;
    font-weight: bold;
    padding-bottom: 1em;
}

.leadbox p{
    font-size: 1.2em;
    line-height: 1.9em;
}

.locker-map-img{
    padding-bottom: 3em;
}
.infobox iframe{
    width:100%;
    height:300px;
}
/* .infobox ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    padding-bottom: 3em;
} */

.infobox li{
    width:49%;
}
/* .infobox a{font-size: .7rem;} */
/* .telwrap{
    padding:1.5em;
}
.telbox {border:2px solid;text-align:center;padding:.75em;}
.telbox .tel{font-size:1.3rem;letter-spacing:2px;font-weight:700;line-height:1.7;}
.telbox .tel span{display:block;font-size:.65rem;font-weight:normal;} */

.locker-th-box {
    padding-bottom: 1em;
}
.locker-map-box {
    padding-bottom: 1.5em;
}
.locker-map {
    padding-bottom: 1.5em;
}

@media screen and (min-width:769px){
	
    .wrapper {position: relative;height: 950px;}
    .banner-wrapper-fixed {height:950px;}
    .foreground {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,0.0);}
    .mainvis img{width:100%;height:auto;object-fit: cover;font-family: 'object-fit: cover;';}
	
    .mainvis div.h1box{position:fixed;top:48%;left:50%;transform: translate(-50%,-52%)!important;width:100%;padding:0 .45em;z-index:900;}
    .mainvis h1{font-size:2.2rem;}
    .mainvis p{font-size:1.2rem;padding-top:.75em;font-family: 'Noto Serif JP', sans-serif!important;}
    .mainvis p.keisai{font-size:1rem;padding-top:1.5em;}	
		
    /* .leadbox{padding:2.5em 2.5em .5em;} */
    .leadbox ul{
        flex-direction: row;
        padding-bottom: 2em;
        justify-content: space-between;
    }
    .leadbox li{
        width: 32%;
        padding: 1.5em 0;
        font-size: 1.5em;
        line-height: 1.4;
        margin: 0;
    }
    .leadbox h2{
        font-size: 1.5em;
        line-height: 1.7;
    }
    .leadbox p{
        font-size: 1.2em;
        line-height: 1.8;
    }

    /* .infobox{padding:2.5em 2.5em 0;} */
    .infobox table{font-size:1rem;margin-bottom:3em;width:100%;}
    .infobox th,.infobox td{padding:1em;}
    .infobox iframe{width:100%;height:400px;}
    .infobox a{font-size: .9rem;}
    /* .telwrap{padding:2.5em;}
    .telbox {
        padding:1em;
        width: 70%;
        margin: 0 auto;}
    .telbox .tel{font-size:1.5rem;}
    .telbox .tel span{font-size:.85rem;} */

    .locker-info-wrap {
        display: flex;
        justify-content: space-between;
    }

}


@media screen and (min-width: 960px){

    .wrapper {position: relative;height: 80vh;}
    .banner-wrapper-fixed {position: fixed;top: 0;left: 0;width: 100%;height: 100vh;background-image:none;background-position: center;background-size: cover;transition: all 0.1s ease 0s;}
    /* .foreground {position: absolute;top: 0;left: 0;width: 100%;height: 80vh;background-image: url('../imgs/main/pc-undermain-coinlocker.jpg')}
    body#coinlocker .foreground{background-image: url('../imgs/main/pc-undermain-coinlocker.jpg')!important;}
    body#parking .foreground{background-image: url('../imgs/main/pc-undermain-parking.jpg')!important;}
    body#solar .foreground{background-image: url('../imgs/main/pc-undermain-solar.jpg')!important;} */
    .mainvis img{width:100%!important;}
    .white .swiper-container{animation: scrollswiper 2s both;}

    .mainvis div.h1box{position:absolute;}
    .mainvis h1{letter-spacing:2px;font-size:1.8rem;}
    /* .mainvis p{letter-spacing:2px;font-size:1rem;font-weight:300;color:#fff;text-align:center;fdisplay:block;line-height:1.9;padding-top:.75em;font-family: 'Noto Serif JP', sans-serif!important;} */
    .mainvis p.keisai{font-size:.8rem;padding-top:1.5em;}
	
    /* .leadbox{padding:2.5em 2.5em .5em;} */
    /* .leadbox ul{margin-bottom:1.5em;padding:0 0;} */
    /* .leadbox li{padding:.75em .5em;font-size:1rem;}	 */
    /* .leadbox h2{font-size:1.2rem;line-height:1.7;} */
	
    /* .leadbox p{font-size: 1rem;line-height:1.8;} */
    /* body#solar .leadbox p{text-align:center;} */
    /* .infobox{padding:2.5em 2.5em 0;} */
    .infobox .inner{display: flex; flex-wrap: wrap; justify-content: space-between;}	
    .infobox .inner section{width:60%;}	
    .infobox .inner section:last-child{width:35%;}

    /* body#solar .infobox .inner section{margin-bottom:4em;} */
	
    .infobox table{font-size:1rem;margin-bottom:3em;width:100%;}
    .infobox th,.infobox td{padding:1em;}
    .infobox li img{margin-bottom:0;}	
    .infobox img{width:100%;margin-bottom:3em;}
    .infobox iframe{width:100%;height:400px;}
    .infobox a{font-size: .9rem;}
    /* .telwrap{padding:2.5em;}
    .telbox {padding:1em;}
    .telbox .tel{font-size:1.5rem;}
    .telbox .tel span{font-size:.85rem;} */

}

  /* infobox
========================================= */

.info-box {
    padding-bottom: 4em;
}
.info-box-tbl {
    border-top: 1px solid var(--color-grey2);
    /* border-left: 1px solid var(--color-grey); */
    font-size: 1.2em;
    width: 100%;
}
.info-box-left {
    /* border-right: 1px solid var(--color-grey); */
    border-bottom: 1px solid var(--color-grey2);
    padding: 2em 0;
    width: 26%;
    font-size: .9em;
}
.info-box-right {
    /* border-right: 1px solid var(--color-grey); */
    border-bottom: 1px solid var(--color-grey2);
    padding: 2em 1.2em;
    font-size: .9em;
}
.info-box-left {
    background: #3c41500a;
}
.map-box  {
    width: 100%;
}
@media screen and (min-width: 769px){
    .info-box-left {
        width: 25%;
        font-size: 1em;
    }
    .info-box-right {
        padding-left: 3em;
        font-size: 1em;
    }
}

@media screen and (min-width: 960px){
    
}



  /* 太陽光発電 ページ
========================================= */
.solar-lead-txt {
    font-size: 1.2em;
    padding-bottom: 1.8em;
    line-height: 1.5em;
    }
    .locker-map-box.solar {
    padding: 0;
    }
    
    @media screen and (min-width: 769px){
    
    }




  /* NOAH駐車場 ページ
========================================= */
.map-box.parking {
    padding-bottom: 1.5em;
}
.parking-ttl-r {
    font-size: 2rem;
    color: #dd0000;
    text-align: center;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 1.2;
    margin-bottom: 0.5em;
}
.parking-txt-box {
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding: 1em 0 2em;
}
.parking-txt-r {
    width: 30%;
    padding: 0.75em 0.5em;
    color: #dd0000;
    border: 1.5px solid;
    font-size: 1.1em;
    font-weight: bold;
    text-align: center;
}
.parking-txt {
    font-size: 1.2rem;
    line-height: 1.9em;
}


@media screen and (min-width: 769px){
    .parking-txt-r {
        padding: 1.5em 0;
        font-size: 1.4em;
    }
    .parking-txt {
        font-size: 1.2em;
    }
}

@media screen and (min-width: 960){

}




/* コインロッカー 英語ページ
========================================= */
#coinlocker .breadcrumbs {
  border-top: none;
  padding-top: 1em;
}
.sec_other_brand .sec_ttl{
  color: var(--color-black);
}
.sec_other_brand .work_list {
  padding: 1.5em 0;
}

.en-locker-ttl {
  font-size: 1.2em;
  line-height: 1.5em;
}
.en-locker-txt {
  font-size: 1.2em;
  line-height: 1.5em;
}
.coinlocker_info.en {
  font-size: 1.4em;
}
.coinlocker_info th,
.coinlocker_info td {
  padding: 1em;
}
.locker-map-box ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
  padding-bottom: 3em;
}
.locker-map-box li {
  width: 49%;
}
.locker-img-box {
  display: flex;
  justify-content: space-around;
  flex-direction: row;
  padding-bottom: 3em;
  flex-wrap: wrap;
}
.locker-img {
  width: 49%;
}
.locker-img.locker-map {
  width: 100%;
  padding-top: 2em;
}
@media screen and (min-width: 769px) {
  .en-locker-ttl {
    font-size: 1.2em;
    line-height: 1.5em;
  }
  .en-locker-txt {
    font-size: 1.6em;
    line-height: 1.5em;
    font-weight: 300;
  }
  .locker-img-box {
    padding: 2em 0 4.5em;
  }
  .locker-img {
    width: 32%;
  }
  .locker-img.locker-map {
    width: 32%;
    padding-top: 1em;
  }
  .locker-img.en {
    width: 49%;
  }
}