/*
    dvmenu.css
    部門ガイド[menu01.html][menu02.html]で使用されるスタイルです
    デザインを調整するにはここで行います
*/


/*画面サイズ共通設定*/
html {
    height: 100%;
    width: 100%;
    font-size: 100%;
}

body {
    font-size: 1em;
}


/*横幅1280px以上の設定*/
@media screen and (min-width: 1280px) {
    .tbl {
        width: 60%;
        height: auto;
    }
    .trx {
        height: 8vw;
    }
    .trs {
        height: 4vw;
    }
    .aimg {
        width: 800px;
        height: auto;
    }
    .dimg {
        width: 20vw;
        height: auto;
    }
    .td{
        font-size: 2vw;
    }

    /* valiable font base Width*/
    h1#w1 {        font-size: 1.5vw;    }
    h1#w2 {        font-size: 2vw;  }
    h1#w3 {        font-size: 3vw;  }
    h1#w4 {        font-size: 3.5vw;  }
    h1#w5 {        font-size: 4vw;    }
}

/*横幅800px〜1280px以上の設定*/
@media screen and (max-width: 1280px) {
    .tbl {
        width: 80%;
        height: auto;
    }
    .trx {
        height: 12vw;
    }

    .trs {
        height: 6vw;
    }
    .aimg {
        width: 640px;
        height: auto;
    }
    .dimg {
        width: 25vw;
        height: auto;
    }
    /* valiable font base Width*/
    h1#w1 {        font-size: 2vw;    }
    h1#w2 {        font-size: 3vw;    }
    h1#w3 {        font-size: 4vw;    }
    h1#w4 {        font-size: 5vw;  }
    h1#w5 {        font-size: 6vw;    }
}

/*横幅800px以下の設定*/
@media screen and (max-width: 800px) {
    .tbl {
        width: 95%;
        height: auto;
    }
    .trx {
        height: 16vw;
    }
    .trs {
        height: 8vw;
    }
    .aimg {
        width: 100%;
        height: auto;
    }
    .dimg {
        width: 30vw;
        height: auto;
    }
    h1#w1 {        font-size: 3vw;    }
    h1#w2 {        font-size: 4vw;  }
    h1#w3 {        font-size: 5vw;  }
    h1#w4 {        font-size: 6vw;  }
    h1#w5 {        font-size: 7vw;  }
}