@charset "utf-8";
header{
  display: block;
}

@media screen and (max-width: 640px) {
header {
  display: flex;
}
}


/* aspect ------------------------------------------------*/
.aspect-569-63 { aspect-ratio: 569 / 63;}
.aspect-293-239 { aspect-ratio: 293 / 239;}
.aspect-591-701 { aspect-ratio: 591 / 701;}
.aspect-500-379 { aspect-ratio: 500 / 379;}
.aspect-500-237 { aspect-ratio: 500 / 237;}


#MAP{
  margin-top: 16rem;
  text-align: center;
  padding: 0 2rem;
}

.map-title{
  margin-top: 4rem;
  font-weight: bold;
  font-size: 1.2em;
  color: #bf1f21;
}

.map-box{
  margin: 1rem 0;
  text-align: center;
}

.map-box-sp{
  display: none;
}

area{
    cursor: pointer;
}

.m-60{
  padding: 0 2rem;
}

/* modal ------------------------------------------*/
.modal_overlay {
  display: none;
  position: fixed;
    top: 0;
    left: 0;
    display: none;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 10000;
}

.modal {
  background: #f4f4f4;
  border: .1rem solid #dddddd;
  padding: 2rem;
  width: 95%;
  max-width: 80rem;
  max-height: 50rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
  overflow-y: auto;
}


.modal_title {
  font-weight: bold;
  margin: 2rem auto 1.5rem;
  font-size: 1.1em;
  color: #333333;
}

.modal_text {
    margin-top: .5re,;
    color: #404040;
}

.modal.show, .modal_overlay.show {
  display: block;
}

.close-btn-top {
    position: absolute;
    cursor: pointer;
    font-size: 3em;
    top: 0;
    right: 1.5rem;
    color: #bbb;
}

.close-btn-bottom {
    text-align: center;
}

.close-btn-bottom button {
    padding: 0.6rem 4rem;
    margin-top: 2rem;
    cursor: pointer;
    background: #bf1f21;
    color: #fff;
    letter-spacing: .1rem;
    transition: all .8s ease;
}


.close-btn-bottom button:hover {
    opacity: .8;
}

/* Google Mapを囲う要素 */
.googlemap {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 40%;
    max-width: 60rem;
    margin: 2rem auto;
  }

  /* Google Mapのiframe */
.googlemap  iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

/* movie ------------*/
section.jihanki-subsection{
  text-align: center;
  padding: 0 2rem;
  margin: 10rem auto;
}

video{
  width: 100%;
  max-width: 76rem;
}

.jihanki-subtitle{
  font-size: 1.8rem;
  font-weight: bold;
  letter-spacing: 0.1rem;
}

/* partner ------------*/
.btn04{
  display: inline-block;
}

.jihanki{
  width: 100%;
  max-width: 60rem;
  display: block;
  margin: 2rem auto;
}

.sp-block{
  display: none;
}


@media screen and (max-width: 768px) {
#MOVIE video {
  max-width: 50rem;
}
}



@media screen and (max-width: 640px){
  #MAP {
    margin-top: 10rem;
}
.map-box-pc{
  display: none;
}

.sp-block,
.map-box-sp{
  display: block;
}
}