h2{
  font-size: 2.0rem;
  font-weight: bold;
  margin-bottom: 20px;
}
.text_right{
  text-align: right;
}

.flex{
  display: flex;

}

.flex .img{
  width: 50%;
}
.flex .text_wrap{
  width: 44%;
  margin-right: 6%;
}
.flex .text_wrap h2{
  font-size: 2.8rem;
  margin-bottom: 80px;
}
.text_right{
  margin-top: 30px;
}

dl{
  display: flex;
  flex-wrap: wrap;
}
dl dt{
  width: 15%;
  padding-right: 5%;
  border-bottom: 1px solid #999;
  padding: 20px 0;
}
dl dd{
  width: 80%;
  border-bottom: 1px solid #999;
  padding: 20px 0;  
}
.outline{
  padding: 80px 0;
}
.access{
  padding: 80px 0;
}
.access a{
  border-bottom: solid #333 1px;
}
.access .map iframe{
  width: 100%;
}
.history{
  padding: 80px 0;
}






  @media screen and (max-width: 800px){
    .flex{
      flex-wrap: wrap;
      flex-direction: column-reverse;
    }
    .flex .text_wrap{
      width: 100%;
      margin-right: 0;
    }
    .flex .img{
      width:70%;
      margin: 0 auto;
    }
    .flex .text_wrap h2{
      font-size: 2.0rem;
      text-align: center;
      margin-top: 20px;
      margin-bottom: 40px;
    }
    .outline,.history,.access{  
      padding: 40px 20px;
    }
    dl{

      box-sizing: border-box;
      font-size: 1.2rem;
    }
    dl dt{
      width: 20%;
      padding: 10px 5% 10px 0;
      font-weight: bold;
    }
    dl dd{
      width: 75%;
      padding: 10px 0;
    }
    .history dl dt{
      width: 25%;
      padding: 10px 5% 10px 0;
      font-weight: bold;
    }
    .history dl dd{
      width: 70%;
      padding: 10px 0;
    }
    .access .map iframe{
      height: 300px;
    }

  }