@charset "utf-8";
html { font-size: 62.5%; }
body {margin: 0;} 
.key-visual { background: url('../img/bg.jpg') center bottom; background-size: cover;padding: 40px 0;}
h1 { font-size: 3.25rem; text-align: center;}
h2 { font-size: 2.5rem; text-align: center;}
h3 { font-size: 2rem; text-align: center;}
.message { text-align: center; color: #fff; font-weight: bold;}
.message p { font-size: 2rem; line-height: 1.75;}
.logo { margin: 20px auto 0; display: block;}
.info { text-align: center; padding-right: 20px; border:1px solid #eaeaea;}
.info .inner { width: 560px; display: inline-block;}
.info dl { display: flex; flex-wrap: wrap; font-size: 1.8rem;}
.info dt { width: 30%; text-align: right;}
.info dd { width: 60%; text-align: left;}
section { padding: 100px 0;}
section:nth-child(odd) { background: #fafafa; }
.business ol { width: 100%; max-width: 430px; margin: 0 auto; border: 2px solid #eaeaea; padding: 40px 60px;}
.business li {font-size: 2rem; line-height: 2.5;}
.hide-area{	display: none;}
.news ol, .news ul, .achievement ol { list-style-type: none; padding-left: 0;}
.news ol > li { margin: 0 auto; width: 75%; max-width: 1000px; }
.news ul, .news dl { display: flex; font-size: 2rem; }
.gallery-list li { margin-right: 5px;}
.news dt { width: 20%; text-align: right; }
.news dd { padding-left: 0; width: 60%; }
.news dd p { margin-top: 0;}
.btn { display: inline-block; background: #eaeaea; text-decoration: none; padding: 12px 28px; border-radius: 10px; color: #000; margin-top: 20px;}
.btn:hover { background-color: #90bdff;}
.achievement ol { font-size: 2rem; margin-bottom: 80px; }
.achievement ol > li, .achievement h3 { width: 60%; margin: 0 auto; max-width: 1000px; }
.achievement li img { margin: 0 auto; max-width: 90%; display: block;}
.achievement ol > li dt { border-bottom: 1px solid; display: inline-block; }
@media screen and (max-width:415px) { 
    h1 { font-size: 2.25rem; }
    h2 { font-size: 2.1rem; }
    .key-visual { background-position: left bottom; padding: 40px 0 60px;}
    .message p { font-size: 1.5rem;}
    .logo { width: 60%;}
    section { padding: 60px 20px;}
    .business ol {padding: 40px 0 40px 40px; width: 80%;}
    .business li { font-size: 1.4rem;}
    .info { padding: 0 20px;}
    .info .inner { width: 100%;}
    .info dl, .news dl, .achievement dl { font-size: 1.4rem; }
    .info dt { width: 25%; }
    .info dd { margin-left: 15px; width: 70%; }
    .news ol > li { width: 100%; font-size: 1.4rem;}
    .gallery-list { flex-wrap: wrap;}
    .achievement ol > li, .achievement h3 { width: 100%;  }
    .achievement ol dd {margin-left: 0;}
}