@charset "utf-8";

html {
    font-size: 62.5%;
}

.bd-wrap {
    width: 100%;
    background-image: url(../images/system_bg.jpg);
    background-size: 559px;
    background-color:rgba(255,255,255,0.8);
    background-blend-mode:lighten;
}

h1,dl,small {
    font-family: Verdana,"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",sans-serif;
    font-weight: 400;
}

.hd-wrap {
    width: 100%;
    background-color: #6E767E;
}

.hd-container {
    width: 960px;
    padding: 90px 0 50px;
    margin: 0 auto;
    box-sizing: border-box;
}

@media screen and (max-width: 960px) {
    .hd-container {
        width: 100%;
        padding: 90px 50px 50px;
    }
}

@media screen and (max-width: 768px) {
    .hd-container {
        padding: 90px 25px 50px;
    }
}

.pg-title {
    font-size: 1.8rem;
    color: #fff;
    font-size: 2.2rem;
    font-weight: 400;
}

.pg-title span {
    display: block;
    margin: 10px 0 0;
    font-size: 1.3rem;
}

.main-wrap {
    width: 960px;
    margin: 0 auto;
    padding: 80px 0 90px;
    box-sizing: border-box;
}

@media screen and (max-width: 960px) {
    .main-wrap {
        width: 100%;
        padding: 80px 50px 90px;
    }
}

@media screen and (max-width: 768px) {
    .main-wrap {
        padding: 80px 25px 90px;
    }
}

dl {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    font-size: 1.6rem;
}

dt {
    width: 18%;
    padding: 20px 0;
    border-bottom: 1px solid #EAEAEA;
    line-height: 1.4em;
}
  
dd {
    width: 82%;
    padding: 20px 0;
    border-bottom: 1px solid #EAEAEA;
    line-height: 1.4em;
}

@media screen and (max-width: 768px) {
    dt {
        width: 24%;
    }
      
    dd {
        width: 76%;
    }
}

.ft-wrap {
    width: 100%;
    margin: 0 auto;
    padding: 0 0 30px;
}

small {
    display: block;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    font-size: 1.2rem;
}