@charset "utf-8";

/* reset css------------------------- */

*{
    padding: 0;
    margin: 0;
    line-height: 1;
}

ul{
    list-style: none;
}

a{
    text-decoration: none;
    color: inherit;
}

img{
    vertical-align: bottom;
    max-width: 100%;
}


/* container------------------------- */

.container{
    width: 960px;
    margin: 0 auto;
}


/* nav------------------------- */

.g-nav{
    margin-bottom: 60px;
}

.g-nav ul{
    display: flex;
}

.g-nav li{
    width: 20%;
}

.g-nav a{
    border-left: 1px solid #000;
    display: block;
    text-align: center;
    padding: 20px 0 14px;
}

.g-nav li:last-child{
    border-right: 1px solid #000;
}

.g-nav .active a{
    border-bottom: 6px solid #E8B647;
}

.g-nav li a:hover{
    border-bottom: 6px solid #828282;
}

.g-nav .active a:hover{
    border-bottom: 6px solid #E8B647;
}



/* main------------------------- */

.main{
    margin-bottom: 60px;
}

.main h2{
    text-align: center;
    font-size: 36px;
    margin-bottom: 40px;
}

.main p{
    width: 70%;
    margin: 0 auto;
    text-align: center;
    line-height: 1.65;
}


/* footer------------------------- */

.footer{
    padding: 20px 0 60px;
    background-color: #E8B647;
    color: #000;
    text-align: center;
}


/* season 季節のページ stylesheet------------------------- */

.main.season h2{
    text-align: left;
    font-size: 32px;
    border-left: 8px solid #000;
    padding: 5px 0 0 10px;
}

.main p{
    width: 100%;
    text-align: left;
    overflow: hidden;
}

.main.season img{
    float: left;
    padding-right: 20px;
}


/*spring 春のページ stylesheet------------------------- */

.main.spring h2{
    border-left: 8px solid #F19483;
}

body.spring .footer{
    background-color: #F19483;
}

.g-nav .active.spring a{
    border-bottom: 6px solid #F19483;
}

.g-nav .active.spring a:hover{
    border-bottom: 6px solid #F19483;
}


/*summer 夏のページ stylesheet------------------------- */

.main.summer h2{
    border-left: 8px solid #006284;
}

body.summer .footer{
    background-color: #006284;
    color: #fff;
}

.g-nav .active.summer a{
    border-bottom: 6px solid #006284;
}

.g-nav .active.summer a:hover{
    border-bottom: 6px solid #006284;
}


/*summer 秋のページ stylesheet------------------------- */

.main.fall h2{
    border-left: 8px solid #F05E1C;
}

body.fall .footer{
    background-color: #F05E1C;
    color: #fff;
}

.g-nav .active.fall a{
    border-bottom: 6px solid #F05E1C;
}

.g-nav .active.fall a:hover{
    border-bottom: 6px solid #F05E1C;
}


/*summer 冬のページ stylesheet------------------------- */

.main.winter h2{
    border-left: 8px solid #86A697;
}

body.winter .footer{
    background-color: #86A697;
    color: #000;
}

.g-nav .active.winter a{
    border-bottom: 6px solid #86A697;
}

.g-nav .active.winter a:hover{
    border-bottom: 6px solid #86A697;
}