
html {
font-size: 0.555vw;
}
@media (max-width:1800px){
html {
font-size: 10px;
}
}
@media (max-width:1400px){
html {
font-size: 0.714vw;
}
}
@media (max-width:1000px){
html {
font-size: 7.14px;
}
}

body {
  font-size: 1.5rem;
}
a {
  transition: opacity 0.3s;
}

a:hover {
  opacity: 0.7;
}

#container{min-width: 1000px;}

h2{font-size: 4.3rem;}

/*header*/

header .block-hamburger{
padding: 0 4rem 0 ;
height: 12rem;
}

header .block-hamburger .box-hamburger{
}
header .block-hamburger h1 img{
width: 22.8rem;
}
header .block-hamburger h1{
padding: 1.4rem 0 .8rem;
}

.hamburger {
margin-right: 1.5rem;
}
.hamburger .box {
width: 2.5rem; height: 3rem; 
}
/*link-reserve*/

main{margin-top:12rem;}

.section.line:before{
  margin-left: 2rem; margin-right: 2rem;
}

.link-reserve{
}
.link-reserve a{
  padding:1rem 3rem;
  font-size: 1.6rem;
}
.link-reserve a .en1{
  font-size: 2rem; 
}



.home .section1{
  /*background-image:url(/common/images/section1.jpg) ;*/
  min-height: 88.4rem;
}
.home .section2 .inner{
  background-image:url(/common/images/section2.jpg) ;
  min-height: 88.4rem;
}
.home .section-spot.spot1{
  background-image:url(/motohakone/images/spot_image.jpg);
  min-height: 88.4rem;
}

.motohakone .section-spot{
  background-image:url(/motohakone/images/spot_image.jpg);
  min-height: 88.4rem;
}
.motohakone .spot-map{
  background-image:url(/motohakone/images/map.jpg);
  min-height: 88.4rem;
}

.section1 .copy1 h2{
  font-size: 4.1rem;
  line-height:1.2;
  position:absolute;
  top: 50%; left: 50%;
  transform:translate(-50%, -50%);
  text-align:center;
  width: 70%;
}

.section1 .copy2 {
  padding:4rem;
}

.section2 .copy {
width: 90rem;
}
.section2 .copy h3{
  font-size: 2.6rem;
}
.section2 .copy h2{
  font-size: 3.6rem;
  padding: 3rem 0 0;
}
.section-spot .name{font-size: 4.1rem; padding: 0 0 5rem}
.section-spot .spot-number{font-size: 4.1rem; position:absolute; top: 0 ; left: 50%; margin-left: -44rem}
.section-spot p{font-size: 2rem; }
.spot-link a{
  margin-top: 4rem;
  padding: .7rem 4rem;
}

.gd1{
  margin-left: 3.4rem;
  margin-right: 3.4rem;
}

/*page*/
.page main {
margin-top: 14rem;
}
.page .title h1{
  font-size: 4.3rem;
}

/*faq*/

.section-faq .inner{display:flex; justify-content:space-between;}
.section-faq .inner .body-faq{width: 66%;}

.faq-q p{padding-top: .3rem;padding-right: 5rem}
.faq-q .inner:before,
.faq-a .inner:before{
font-size: 1.8rem;
width: 2.8rem; height: 2.8rem;
}

.faq-btn{
width: 2rem; height: 2rem;
right: 1rem; top: 1.8rem;
}

/*terms*/
/*privacypolicy*/

.section-terms .inner,
.section-pp .inner{display:flex; justify-content:space-between;}
.section-terms .inner .body-terms,
.section-pp .inner .body-pp{width: 66%;}
.body-terms,
.body-pp{
margin-bottom: 8rem;
}


/*spnav*/

.spnav .lang{
  position:absolute;
  bottom: 5rem; left: 4rem;
}
.spnav .blc-link{
position:absolute;
  top: 50%;
left: 4rem;
transform:translateY(-50%);
}
.spnav .blc-link .link-top{font-size: 3.3rem;}
.spnav .blc-link h2{font-size: 3.3rem; padding:0; margin-top: 4rem}
.spnav .blc-link .blc-spot{font-size: 2.5rem;}

.spnav .blc-other{
  width: 33rem;
  position:absolute;
  right: 0;
  bottom: 5rem;
}

/*splide*/
.blc-splide h3{font-size: 3.2rem; padding-left:2rem; margin-top:1rem }
.blc-splide h4{font-size: 2rem; padding-left:2rem}
.blc-splide li p{ padding:  2rem;}

.blc-splide{
padding-bottom: 10rem;
}
.splide {
width: 86%;
margin-left: 2rem;
}
.col2 .splide {
width: 86%;
margin-left: 2rem;
}

.blc-splide .splide__arrow{
  width: 9.8rem; height:9.8rem;
}

.blc-splide .splide__pagination__page {
height: 1.2rem;
width: 1.2rem;
margin: .6rem;
}

.spot-experiences .blc-splide .splide__arrow{
  transform: translateY(-100%);
  top: 40rem;
}

/*page spot*/

.blc-spec .icon img{width: 3.2rem }

.spot-spec .blc{display:flex;margin: 2rem 2rem 0; align-items:center}
.blc-floor{
width: 57%; 
height: 80rem;
margin-right: 5rem;
}
.blc-spec {width: 40rem}
.blc-spec h3{
font-size: 1.5rem;
}
.blc-spec .icon img,
.blc-address .icon img{width: 4rem }

.spot-map .text-map{
  position:absolute; left: 50%; top:50%;
  margin-left: 25rem; 
}
.spot-map .text-map h2{font-size:2.5rem; }
.spot-map .text-map p{font-size:2rem;}

.blc-facilities{margin-top:1em}

.spot-location .blc{display:flex;margin: 0 3.4rem; align-items:center; justify-content:space-between}
.spot-location .blc-text{height: 88.4rem;flex: 1; display:flex; flex-direction:column; justify-content:space-between; margin-right:8%}
.spot-location .blc-image{width: 50%; height: 88rem}
.spot-location .blc-image img {width: 100%; height: 100%; object-fit:cover}

.blc-address{margin-top: 4rem; flex: 1;}
.spot-access .blc{display:flex;margin: 2rem 2rem 0; }
.spot-access .blc-map{
width: 57%; height: 70rem;
margin-right: 5rem;
}
.blc-address ul{max-width: 60rem}

/*footer*/


footer{padding: 27.3rem 0 3rem; position:relative}

.footer-copy{
position:absolute;
top: 26rem; left: 4rem;
}
.footer-copy p{font-size: 4.1rem; }

.footer-block{width: 42rem; margin-left: auto}
.copyright{font-size: 1.2rem;}


.blc-other .blc-link2 {margin-top: 8rem}
.blc-other .blc-sns {margin-top: 8rem}
.blc-other .copyright {margin-top: 2rem}



.footer-logo {
position:absolute;
bottom: 2rem; left: 4rem;
}
.footer-logo img{
width: 33.2rem;
}

/*other*/
.flex {
  display: flex;
}

.flex1 {
  align-items: center;
}

.flex2 {
  flex-direction: row-reverse;
}

.flex3 {
  justify-content: space-between;
}

a .up {
  transition: 0.3s;
  transform: translateY(0);
}

a .up:hover {
  transform: translateY(-3px);
}


.w100 {
  max-width: 100%;
}

.ib{display:inline-block;}

.pc {
  display: block !important;
}

.pc2 {
  display: inline-block !important;
}

.sp {
  display: none !important;
}

.sp2 {
  display: none !important;
}

.sss {
  font-size: 0.7em;
}

.ss {
  font-size: 0.87em;
}

.lll {
  font-size: 1.2em;
}

.ll {
  font-size: 1.1em;
}

.tc {
  text-align: center;
}

.tl {
  text-align: left;
}

.tr {
  text-align: right;
}

