@charset "utf-8";

@media screen and (max-width:500px) {



    /*============================================
全般的なスタイル
============================================*/
    body {
        width: 100%;
        /*ページ全体の横幅*/
    }

    div#pagebody {
        width: 100%;
        margin: 0 auto;
        /*内容全体をセンタリング*/
    }


    div.small {
        font-size: 80%;
        /* フォントのサイズを80％にする */
        margin: 20px 0px 20px 0px;
        /*マージン*/
    }

    /*============================================
ヘッダ
============================================*/
    h1#header {
        height: 46px;
        /*ヘッダ部分の高さ*/
    }

    h1#header h1 {
        padding: 0px;
        /*見出しの位置調整*/
    }

    h1#header a {
        text-decoration: none;
        /*リンクの下線を無くす*/


    }

    /*============================================
上メニュー
============================================*/
    ul#menu1 {
        width: 100%;
        /*上メニュー部分の幅*/
    }

    #menu1 li {
        list-style-type: none;
        /*リストマーカー無しにする*/
    }

    #menu1 li a {
        width: 90px;
        height: 45px;
        /*幅と高さ*/
        padding: 0px 0px 0px 30px;
        /*パディング*/
        background-image: url(../images/bullet005.gif);
        /*背景画像を指定*/
        background-repeat: no-repeat;
        /*背景画像を繰り返さない*/
        font-size: 120%;
        /*文字サイズを120%にする*/
        text-decoration: none;
        /*リンク部分を下線無しにする*/
    }



    /*============================================
中段メニュー
============================================*/

    ul#menu3 {
        width: 100%;
        /*中段メニュー部分の幅*/
    }

    #menu3 li {
        list-style-type: none;
        /*リストマーカー無しにする*/
    }

    #menu3 li a {
        width: 90px;
        height: 45px;
        /*幅と高さ*/
        padding: 0px 0px 0px 30px;
        /*パディング*/
        background-image: url(../images/bullet005.gif);
        /*背景画像を指定*/
        background-repeat: no-repeat;
        /*背景画像を繰り返さない*/
        font-size: 120%;
        /*文字サイズを120%にする*/
        text-decoration: none;
        /*リンク部分を下線無しにする*/
    }









    /*============================================
下メニュー
============================================*/
    ul#menu2 {
        width: 100%;
        /*メインメニュー部分の幅*/
        margin: 0px;
        /*マージン0px*/
    }

    #menu2 li {
        list-style-type: none;
        /*リストマーカー無しにする*/
    }

    #menu2 li a {
        width: 90px;
        height: 45px;
        /*幅と高さ*/
        padding: 0px 0px 0px 30px;
        /*パディング*/
        background-image: url(../images/bullet005.gif);
        /*背景画像を指定*/
        background-repeat: no-repeat;
        /*背景画像を繰り返さない*/
        font-size: 120%;
        /*文字サイズを120%にする*/
        text-decoration: none;
        /*リンク部分を下線無しにする*/
    }

    /*============================================
トップページ　本文
============================================*/


    /*　１つめのコンテンツ　*/
    div#r_letter1 {
        width: 390px;
        height: 260px;
        /*幅と高さ*/
        padding: 10px 5px 0px 5px;
        /*パディング*/
    }

    div#l_letter1 {
        display: none;
    }

    div#r_letter1 h2 {
        width: 390px;
        height: 106px;
        /*幅と高さ*/
        background-color: #ffffff;
        /*背景色*/
        text-align: center;
        /*テキストをセンター揃えにする*/
        background-image: url(../images/button003.gif);
        /*背景画像*/
        background-repeat: no-repeat;
        /*背景画像を繰り返さない*/
    }


    div#r_letter1 h2 a {
        font-size: 30px;
        /*フォントサイズ*/
        display: block;
        /*リンク部分をブロック表示にする*/
        width: 390px;
        height: 106px;
        /*幅と高さ*/
        padding: 16px 0px 10px 0px;
        /*パディング*/
        text-decoration: none;
        /*リンク部分を下線無しにする*/
    }



    /*　２つめのコンテンツ　*/
    div#l_letter2 {
        width: 390px;
        height: 260px;
        /*幅と高さ*/
        padding: 30px 5px 60px 5px;
        /*パディング*/
    }

    div#r_letter2 {
        display: none;
    }

    div#l_letter2 h2 {
        width: 390px;
        height: 106px;
        /*幅と高さ*/
        background-color: #ffffff;
        /*背景色*/
        text-align: center;
        /*テキストをセンター揃えにする*/
        background-image: url(../images/button003.gif);
        /*背景画像*/
        background-repeat: no-repeat;
        /*背景画像を繰り返さない*/
    }


    div#l_letter2 h2 a {
        font-size: 30px;
        /*フォントサイズ*/
        display: block;
        /*リンク部分をブロック表示にする*/
        padding: 35px 0px 6px 0px;
        /*パディング*/
        width: 390px;
        height: 106px;
        /*幅と高さ*/
        text-decoration: none;
        /*リンク部分を下線無しにする*/
    }


    /*　３つめのコンテンツ　*/
    div#l_letter3 {
        display: none;
    }

    div#r_letter3 {
        width: 390px;
        height: 260px;
        /*幅と高さ*/
        padding: 30px 5px 0px 5px;
        /*パディング*/
    }

    div#r_letter3 h2 {
        width: 390px;
        height: 106px;
        /*幅と高さ*/
        background-color: #ffffff;
        /*背景色*/
        text-align: left;
        /*テキストを左寄せにする*/
        background-image: url(../images/button003.gif);
        /*背景画像*/
        background-repeat: no-repeat;
        /*背景画像を繰り返さない*/
    }


    div#r_letter3 h2 a {
        font-size: 26px;
        /*フォントサイズ*/
        display: block;
        /*リンク部分をブロック表示にする*/
        padding: 20px 0px 6px 20px;
        /*パディング*/
        width: 390px;
        height: 106px;
        /*幅と高さ*/
        text-decoration: none;
        /*リンク部分を下線無しにする*/
    }


    /*　４つめのコンテンツ　*/
    div#l_letter4 {
        width: 390px;
        height: 260px;
        /*幅と高さ*/
        padding: 30px 5px 0px 5px;
        /*パディング*/
    }

    div#l_letter4 {
        display: none;
    }

    div#l_letter4 h2 {
        width: 390px;
        height: 106px;
        /*幅と高さ*/
        background-color: #ffffff;
        /*背景色*/
        text-align: center;
        /*テキストをセンター揃えにする*/
        background-image: url(../images/button003.gif);
        /*背景画像*/
        background-repeat: no-repeat;
        /*背景画像を繰り返さない*/
    }


    div#l_letter4 h2 a {
        font-size: 30px;
        /*フォントサイズ*/
        display: block;
        /*リンク部分をブロック表示にする*/
        padding: 35px 0px 6px 0px;
        /*パディング*/
        width: 390px;
        height: 106px;
        /*幅と高さ*/
        text-decoration: none;
        /*リンク部分を下線無しにする*/
    }



    /*　５つめのコンテンツ　*/
    div#l_letter5 {
        width: 390px;
        height: 260px;
        /*幅と高さ*/
        padding: 12px 5px 0px 5px;
        /*パディング*/
    }

    div#r_letter5 {
        display: none;
    }

    div#l_letter5 h2 {
        width: 390px;
        height: 106px;
        /*幅と高さ*/
        background-color: #ffffff;
        /*背景色*/
        text-align: center;
        /*テキストをセンター揃えにする*/
        background-image: url(../images/button003.gif);
        /*背景画像*/
        background-repeat: no-repeat;
        /*背景画像を繰り返さない*/
    }


    div#l_letter5 h2 a {
        font-size: 30px;
        /*フォントサイズ*/
        display: block;
        /*リンク部分をブロック表示にする*/
        padding: 35px 0px 6px 0px;
        /*パディング*/
        width: 390px;
        height: 106px;
        /*幅と高さ*/
        text-decoration: none;
        /*リンク部分を下線無しにする*/
    }



    /*============================================
本文
============================================*/




    div#message {
        display: none;
    }




    /*============================================
テーブル
============================================*/
    table {
        border-collapse: collapse;
        /*セル同士の間に隙間を空けない*/
    }

    table th {
        padding: 5px;
        /*パディング*/
        background-color: #666666;
        /*セルの背景色*/
        text-align: left;
        /*左寄せにする*/
        border: solid #000000 1px;
        /*セルのボーダー*/
        color: #ffffff;
        /*文字色*/
    }

    table td {
        padding: 5px;
        /*パディング*/
        background-color: #ffffff;
        /*セルの背景色*/
        border: solid #000000 1px;
        /*セルのボーダー*/
    }



    /*============================================
googleカレンダー用
============================================*/

.cal_wrapper {
max-width: 960px;
min-width: 300px;
margin: 2.0833% auto;
}

.googlecal {
position: relative;
padding-bottom: 100%;
height: 0;
}

.googlecal iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}

@media only screen and (min-width: 768px) {
.googlecal { padding-bottom: 75%; }
}








}