@charset "utf-8";

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


    /*--since1981------------------------------------------*/



    #history #since1981 .items {
        height: calc((100vw - 4px) / 3 * 9 + 16px);
    }

    #history #since1981 h2 {
        width: calc((100vw - 4px) / 3 * 1 + 0px);
        height: calc((100vw - 4px) / 3 * 2 + 2px);
    }


    #history #since1981 .item#y1981 {
        left: calc((((100vw - 4px) / 3) + 2px) * 1);
        top: calc((((100vw - 4px) / 3) + 2px) * 0);
    }


    #history #since1981 .item#y1982 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 2);
    }

    #history #since1981 .item#y1983 {
        left: calc((((100vw - 4px) / 3) + 2px) * 1);
        top: calc((((100vw - 4px) / 3) + 2px) * 2);
    }

    #history #since1981 .item#photo6 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 2);
    }


    #history #since2010 .item#photo5 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 7);
    }

    #history #since2020 .item#photo7 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 0);
    }



    #history #since1981 .item#y1984 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 3);
    }


    #history #since1981 .item#y1984 .dish img {
        width: 45%;
    }

    #history #since1981 .item#y1984 .product img {
        width: 30%;
    }


    #history #since1981 .item#y1985 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 3);
    }

    #history #since1981 .item#photo1_sp {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 4);
    }






    #history #since1981 .item#y1986 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 5);
    }

    #history #since1981 .item#y1986 .dish {
        width: 32%;
        margin-right: 4vw;
    }

    #history #since1981 .item#y1986 .dish img {
        /*        width: 60%;*/
    }

    #history #since1981 .item#y1986 .product {
        width: 42%;
    }

    #history #since1981 .item#y1986 .product img {
        width: 80%;
        margin-left: auto;
        margin-right: auto;
        display: block;
    }






    #history #since1981 .item#y1987 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 6);
    }

    #history #since1981 .item#y1987 .content {
        flex-direction: row-reverse;
    }

    #history #since1981 .item#y1987 .dish {
        width: 32%;
        margin-right: 4vw;
    }

    #history #since1981 .item#y1987 .dish img {
        /*        width: 60%;*/
    }

    #history #since1981 .item#y1987 .product {
        width: 42%;
    }

    #history #since1981 .item#y1987 .product img {
        width: 80%;
        margin-left: auto;
        margin-right: auto;
        display: block;
    }


    #history #since1981 .item#y1988 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 7);
    }


    #history #since1981 .item#photo2_sp {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 8);
    }




    #history #since1981 .item#y1989 {
        left: calc((((100vw - 4px) / 3) + 2px) * 1);
        top: calc((((100vw - 4px) / 3) + 2px) * 7);
    }


    #history #since1981 .item#y1989 .dish img {
        width: 40%;
    }

    #history #since1981 .item#y1989 .product img {
        width: 27%;
    }




    /*--since1990------------------------------------------*/



    #history #since1990 {}


    #history #since1990 .items {
        height: calc((100vw - 4px) / 3 * 7 + 12px);
    }


    #history #since1990 h2 {
        width: calc((100vw - 4px) / 3 * 2 + 2px);
        height: calc((100vw - 4px) / 3 * 1 + 0px);
    }



    #history #since1990 .item#y1990 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 0);
    }





    #history #since1990 .item#y1991 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 1);
    }

    #history #since1990 .item#y1991 .dish {
        width: 28%;
        /*        margin-right: 3vw;*/
        margin-right: -3vw;
        margin-left: 6vw;
    }

    #history #since1990 .item#y1991 .dish img {
        /*        width: 60%;*/
    }

    #history #since1990 .item#y1991 .product {
        width: 65%;
        margin-top: 5vw;
    }

    #history #since1990 .item#y1991 .product img {
        width: 70%;
        margin-left: auto;
        margin-right: auto;
        display: block;
        margin-bottom: 3vw;
    }




    #history #since1990 .item#y1992 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 2);
    }


    #history #since1990 .item#y1992 .dish img {
        width: 50%;
    }

    #history #since1990 .item#y1992 .product img {
        width: 40%;
    }




    #history #since1990 .item#y1993 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 2);
    }





    #history #since1990 .item#y1994 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 3);
    }



    #history #since1990 .item#y1995 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 4);
    }



    #history #since1990 .item#y1996 {
        left: calc((((100vw - 4px) / 3) + 2px) * 1);
        top: calc((((100vw - 4px) / 3) + 2px) * 4);
    }


    #history #since1990 .item#y1997 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 5);
    }


    #history #since1990 .item#y1997 .content {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        justify-content: center;
        -ms-align-items: center;
        align-items: center;
    }

    #history #since1990 .item#y1997 .dish {
        width: 40%;
        margin-top: -2vw;
    }

    #history #since1990 .item#y1997 .dish img {
        width: 100%;
    }

    #history #since1990 .item#y1997 .dish .cap {
        font-size: 90%;
    }

    #history #since1990 .item#y1997 .product {
        margin-top: -2vw;
        width: 50%;
    }

    #history #since1990 .item#y1997 .product img {
        width: 40%;
        margin-left: auto;
        margin-right: auto;
        display: block;
        /*        margin-bottom: 3vw;*/
    }

    #history #since1990 .item#y1997 .product .cap {
        font-size: 90%;
    }





    #history #since1990 .item#y1998 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 4);
    }


    #history #since1990 .item#photo3_sp {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 5);
    }



    #history #since1990 .item#y1999 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 6);
    }

    #history #since1990 .item#y1999 .dish {
        width: 28%;
        /*        margin-right: 4vw;*/
    }

    #history #since1990 .item#y1999 .dish img {
        /*        width: 60%;*/
    }

    #history #since1990 .item#y1999 .product {
        width: 52%;
    }

    #history #since1990 .item#y1999 .product img {
        width: 50%;
        margin-left: auto;
        margin-right: auto;
        display: block;
    }






    /*--since2000------------------------------------------*/



    #history #since2000 .items {
        height: calc((100vw - 4px) / 3 * 6 + 10px);
    }


    #history #since2000 h2 {
        width: calc((100vw - 4px) / 3 * 2 + 2px);
        height: calc((100vw - 4px) / 3 * 1 + 0px);
    }

    #history #since2000 .item#y2000 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 0);
    }



    #history #since2000 .item#y2001 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 1);
    }

    #history #since2000 .item#y2001 .dish {
        width: 28%;
        /*        margin-right: 4vw;*/
    }

    #history #since2000 .item#y2001 .dish img {
        /*        width: 60%;*/
    }

    #history #since2000 .item#y2001 .product {
        width: 52%;
    }

    #history #since2000 .item#y2001 .product img {
        width: 70%;
        margin-left: auto;
        margin-right: auto;
        display: block;
        margin-bottom: 3vw;
    }




    #history #since2000 .item#photo4_sp {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 2);
    }


    #history #since2000 .item#y2002 {
        left: calc((((100vw - 4px) / 3) + 2px) * 1);
        top: calc((((100vw - 4px) / 3) + 2px) * 2);
    }

    #history #since2000 .item#y2003 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 2);
    }


    #history #since2000 .item#y2004 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 3);
    }


    #history #since2000 .item#y2005 {
        left: calc((((100vw - 4px) / 3) + 2px) * 1);
        top: calc((((100vw - 4px) / 3) + 2px) * 3);
    }

    #history #since2000 .item#y2005 .dish img {
        width: 60%;
    }




    #history #since2000 .item#y2006 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 4);
    }



    #history #since2000 .item#y2007 {
        left: calc((((100vw - 4px) / 3) + 2px) * 1);
        top: calc((((100vw - 4px) / 3) + 2px) * 4);
    }



    #history #since2000 .item#y2008 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 4);
    }



    #history #since2000 .item#y2009 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 5);
    }

    #history #since2000 .item#y2009 .dish {
        width: 28%;
        /*        margin-right: 4vw;*/
    }

    #history #since2000 .item#y2009 .dish img {
        /*        width: 60%;*/
    }

    #history #since2000 .item#y2009 .product {
        width: 60%;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        -ms-align-items: center;
        align-items: center;
    }

    #history #since2000 .item#y2009 .product img {
        width: 30%;
        margin-left: auto;
        margin-right: auto;
        display: block;
        margin-bottom: 3vw;
    }






    /*--since2010------------------------------------------*/



    #history #since2010 .items {
        height: calc((100vw - 4px) / 3 * 7 + 12px);
    }


    #history #since2010 h2 {
        width: calc((100vw - 4px) / 3 * 3 + 4px);
        height: calc((100vw - 4px) / 3 * 1 + 0px);
    }


    #history #since2010 .item#y2010 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 1);
    }

    #history #since2010 .item#y2011 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 2);
    }



    #history #since2010 .item#y2012 {
        left: calc((((100vw - 4px) / 3) + 2px) * 1);
        top: calc((((100vw - 4px) / 3) + 2px) * 1);
    }

    #history #since2010 .item#y2012 .content {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        justify-content: center;
        -ms-align-items: center;
        align-items: center;
    }

    #history #since2010 .item#y2012 .dish {
        margin-top: 5vw;
        width: 50%;
    }

    #history #since2010 .item#y2012 .dish img {
        width: 100%;
    }

    #history #since2010 .item#y2012 .product {
        width: 60%;
    }

    #history #since2010 .item#y2012 .product img {
        width: 50%;
    }


    #history #since2010 .item#y2013 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 3);
    }



    #history #since2010 .item#y2014 {
        left: calc((((100vw - 4px) / 3) + 2px) * 1);
        top: calc((((100vw - 4px) / 3) + 2px) * 3);
    }



    #history #since2010 .item#y2015 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 3);
    }



    #history #since2010 .item#y2016 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 4);
    }

    #history #since2010 .item#y2016 .dish {
        width: 32%;
        margin-right: 4vw;
    }

    #history #since2010 .item#y2016 .dish img {
        /*        width: 60%;*/
    }

    #history #since2010 .item#y2016 .product {
        width: 50%;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        -ms-align-items: center;
        align-items: center;
    }

    #history #since2010 .item#y2016 .product img {
        width: 30%;
        margin-left: auto;
        margin-right: auto;
        display: block;
        margin-bottom: 3vw;
    }

    #history #since2010 .item#y2017 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 5);
    }





    #history #since2010 .item#y2018 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 5);
    }

    /*
    #history #since2010 .item#y2018 .content{
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        justify-content: center;
        -ms-align-items: center;
        align-items:center ;
    }
*/
    #history #since2010 .item#y2018 .dish img {
        width: 80%;
    }

    /*
    #history #since2010 .item#y2018 .product{
        width: 40%;
    }
    #history #since2010 .item#y2018 .product img{
        width: 60%;
    }
    
    
*/



    #history #since2010 .item#y2019 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 6);
    }



    /*--since2020------------------------------------------*/


    #history #since2020 .items {
        height: calc((100vw - 4px) / 3 * 1 + 12px);
    }

    #history #since2020 h2 {
        position: relative;
        left: inherit;
        top: inherit;
        width: auto;
        height: auto;
        padding-top: 30px;
        padding-bottom: 30px;
    }

    #history #since2010 .item#y2020 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 0);
    }

    #history #since2020 .item#photo8 {
        left: calc((((100vw - 4px) / 3) + 2px) * 1);
        top: calc((((100vw - 4px) / 3) + 2px) * 0);
    }

    #history #since2020 .item#y2021 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 0);

    }

    #history #since2020 .item#y2021 .dish img {
        width: 90%;
    }

    #history #since2020 .item#y2022 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 1);

    }

    #history #since2020 .item#y2021 .dish img {
        width: 90%;
    }

    #history #since2020 .item#y2023 {
        left: calc((((100vw - 4px) / 3) + 2px) * 1);
        top: calc((((100vw - 4px) / 3) + 2px) * 1);

    }

    #history #since2020 .item#y2024 {
        left: calc((((100vw - 4px) / 3) + 2px) * 2);
        top: calc((((100vw - 4px) / 3) + 2px) * 1);

    }

    #history #since2020 .item#y2025 {
        left: calc((((100vw - 4px) / 3) + 2px) * 0);
        top: calc((((100vw - 4px) / 3) + 2px) * 2);

    }

    #history #since2020 .item#y2026 {
        left: calc((((100vw - 4px) / 3) + 2px) * 1);
        top: calc((((100vw - 4px) / 3) + 2px) * 2);

    }




}