:root {
    --body-color: #EFE; /* body-color */
    --container-color: #CCF; /* container-color */
    --normal-color: #080; /* normal-color */
    --highlight-color: #090; /* highlight-color */
}

html { 
    height: 100%; 
}
body {
    height: 100%; 
    background-color: #EFE; /* body-color */
}
    h1 {
        margin: 1rem;
        text-align: center;
        font: bold 3.2rem "Noto Sans JP", arial, sans-serif;
        color: #080; /* normal-color */
    }
    #menu-type {
        margin: 1rem;
        text-align: center;
    }
    #menu-type li {
        width: 10%;
        display: inline-block;
        font: normal 1.8rem "Noto Sans JP", arial, sans-serif;
        background-color: #090; /* highlight-color */
        color: #FFF;
    }
    #menu-type li:hover {
        box-shadow: 0px 0px 5px 2px rgba(31, 127, 31, 0.5);
        transition: all 0.1s;/*状態変化の時間を指定*/
        cursor: pointer;
    }
    #menu-type li:not(.selected) {
        background-color: #888; /* unselected-color */
    }
    #menu-month {
        margin: 1rem;
        text-align: center;
    }
    #menu-month li {
        width: 5%;
        display: inline-block;
        font: normal 1.8rem "Noto Sans JP", arial, sans-serif;
        background-color: #090; /* highlight-color */
        color: #FFF;
    }
    #menu-month li:hover {
        box-shadow: 0px 0px 5px 2px rgba(31, 127, 31, 0.5);
        transition: all 0.1s;/*状態変化の時間を指定*/
        cursor: pointer;
    }
    #menu-month li:not(.selected) {
        background-color: #888; /* unselected-color */
    }
    .button-all {
        margin: 1rem 3rem 1rem 1rem;
        border-radius: 4px;
    }


    #plant-list {
        margin: 5rem 0 5rem 0;
    }
        #plant-list table {
            table-layout:fixed;
            border-collapse: separate;
            border-spacing: 2px 2px;
            margin: 0 auto;  
        }
            #plant-list td {
                vertical-align: top;
                text-align: center;
                border: 1px solid #AAA;
                width: 350px;
                background-color: #EFE; /* body-color */
            }
            #plant-list td:hover {
                box-shadow: 0px 0px 5px 2px rgba(31, 31, 31, 0.5);
                transform: scale(1.05); /*画像の拡大/縮小(xy)*/
                transition: all 0.3s;/*状態変化の時間を指定*/
                cursor: pointer;
            }
                #plant-list h4 {
                }
        #calendar {
            max-width: 900px;
            margin: 1rem auto;
            text-align: center;
        }
            #calendar-table {
                width: 100%;
                border-collapse: collapse;
                text-align: center;
                line-height: 1.5rem;
                font-size: 1rem;
                table-layout: fixed;
            }
                  #calendar-table .photoset {
                        width: 25rem;
                        border-collapse: collapse;
                        text-align: left;
                        line-height: 1.5rem;
                        border: 1px solid #000;
                        font-size: 1.4rem;
                        font-weight: normal;
                  }
                  #calendar-table th {
                        border-collapse: collapse;
                        text-align: center;
                        line-height: 1.5rem;
                        border: 1px solid #000;
                        font-size: 1.4rem;
                        font-weight: normal;
                  }
                  #calendar-table td{
                        border-collapse: collapse;
                        text-align: center;
                        line-height: 1.5rem;
                        border: 1px solid #000;
                        font-size: 1rem;
                        vertical-align: middle;
                  }
                  #calendar-table img {
                        max-width: 100%;
                        vertical-align: middle;
                  }


/*************************************
	スマホ用
**************************************/	
@media only screen and ( max-width:1000px )
{


}