@charset "utf-8";

/* common */
html{
    font-size: 100%;
}

body{
    font-family: "Bookman Old Style","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN",
    "HG明朝E","MS P明朝","MS 明朝", serif;
    color: #555;
    line-height: 1.0;
}

img{
    width:100%;
}

.wrapper{
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 10px;
}

 /* header */
 header{
     border-top: 8px solid #8c6239;
 }
 .logo {
     color: #fff;
     font-family: serif;
     font-size: 24px;
     position: absolute;
     top: 80px;
     left: 34px;
 }
 
 .catch-copy {
     text-align: right;
     color: #fff;
     font-family: serif;
     font-size: 24px;
     position: absolute;
     top: 360px;
     right:80px;
 }

 .header_content{
     display: flex;
     align-items: center;
     justify-content: flex-end;
     margin: 10px auto;
 }

 header nav ul {
     display: flex;
     list-style-type: none;
 }

 header nav ul li {
     margin-left: 30px;
 }

 header nav ul li a {
     text-decoration: none;
     color: #555;
 }

 header nav ul li a:hover,
 header nav ul li a:active,
 header nav ul li.current a {
     color: #8c6239;
 }

 #main_image {
     width: 100%;
     height: 70vh;
     background-image: url(../images/headerimage.jpg);
     background-repeat: no-repeat;
     background-position: center;
     background-size: cover;
 }
 
 /* contents */

 .contents {
     display: flex;
     justify-content: space-between;
     margin-top: 30px;
 }

 #main_content {
     width: 65%;
 }

 #sidebar {
     width: 31%;
 }

 #home h2 {
      margin-bottom: 20px;
      padding-bottom: 5px;
      border-bottom: 1px solid #8c6239;
      font-size: 1.2rem;
  }

 #info dl {
     display: flex;
     flex-wrap: wrap;
     margin-bottom: 50px;
 }

 #info dt {
     width: 7em;
 }

 #info dd {
     width: calc(100% - 7em);
 }

 #info dt,
 #info dd {
     margin-bottom: 10px;
 }

 #pickup ul li {
     margin-bottom: 10px;
     list-style-type: none; 
 }

 #pickup ul {
    margin-bottom: 50px;   
 }

 #sidebar ul li {
     margin-bottom: 20px;
     list-style-type: none;
 }

 /* footer */

 footer {
     margin-top: 100px;
     padding: 30px;
     text-align: center;
     color: #fff;
     background-color: #8c6239;
 }

 footer ul {
     margin-bottom: 20px;
     font-size: 0.9rem;
 }

 footer ul li {
     display: inline-block;
     margin: 5px;
 }

 footer ul li a {
     color: #fff;
 }

 footer ul li a:link {
     text-decoration: none;
 }

 footer ul li a:hover,
 footer ul li a:active {
     opacity: .7;
 }

 small {
     font-size: 0.7rem;
 }
.twitter-btn {
    display: block;
    width: 32px;
    height: 32px;
    margin: 32px auto;
}
 /* responsive */

 @media print,screen and (max-width:640px)  {
    html {
        font-size: 0.8rem;
     }

     .header_content {
         font-size: 10px;
     }

     .contents {
         flex-direction: column;
         margin-top: 10px;
     }

     #main_content,
     #sidebar {
         width: 100%;
     }
 }