@charset "UTF-8";

@media screen and (min-width: 900px) {
    #products-page {

        #section-furusato-nozei-rank {

            position: relative;
            margin-bottom: 10rem;
            margin-top: 26%;

            & > .disp-grid {
                position: absolute;
                top: 0;
                left: 0;
                height: 100%;
                width: 100%;

                grid-template-columns: 48% 1% 1fr;
                grid-template-rows: 50% 50%;

                & > div:nth-child(1) {
                    grid-column: 2 / 4;
                    grid-row: 1 / 2;

                    & > img {
                        width: 60%;
                        margin-top: 13%;
                    }
                }

                & > div:nth-child(2) {
                    grid-column: 1 / 3;
                    grid-row: 2 / 3;

                    & > img {
                        margin-top: 16%;
                        width: 60%;
                        margin-left: 38%;
                        transition-delay: 1.5s!important;
                    }

                }
            }
        }

        #section-ikiya-story {

            h2 {
                width:30%;
            }

            #three-line-words {
                font-size: 1.8rem;
            }

            #ikiya-story {

                font-size:1.1rem;

                display: grid;
                grid-template-columns: 50% 50%;
                grid-template-rows: auto auto auto auto auto;

                background-size : contain;
                background-position : top;
                background-repeat : repeat-y;

                & > li {

                    padding : 8% 20%;

                    &:nth-child(1) {
                        grid-column: 1 / 2;
                        grid-row: 1 / 2;
                    }
                    &:nth-child(2) {
                        grid-column: 2 / 3;
                        grid-row: 1 / 2;
                    }
                    &:nth-child(3) {
                        grid-column: 2 / 3;
                        grid-row: 2 / 3;
                        padding-left:10%;

                        & > img {
                            margin-bottom: 6em;
                        }
                    }
                    &:nth-child(4) {
                        grid-column: 1 / 2;
                        grid-row: 2 / 3;

                        & > div.story-text {
                            top: 100%;
                            transform: translateY(-100%);
                        }
                    }
                    &:nth-child(5) {
                        grid-column: 1 / 2;
                        grid-row: 3 / 4;
                    }
                    &:nth-child(6) {
                        grid-column: 2 / 3;
                        grid-row: 3 / 4;
                    }
                    &:nth-child(7) {
                        grid-column: 2 / 3;
                        grid-row: 4 / 5;
                    }
                    &:nth-child(8) {
                        grid-column: 1 / 2;
                        grid-row: 4 / 5;
                    }
                    &:nth-child(9) {
                        grid-column: 1 / 2;
                        grid-row: 5 / 6;
                    }
                    &:nth-child(10) {
                        grid-column: 2 / 3;
                        grid-row: 5 / 6;
                    }

                    & > div.story-text {
                        top: 50%;
                        position: relative;
                        transform: translateY(-50%);
                        white-space: nowrap;
                    }

                    & > #president-name {
                        text-align: center;
                        margin-top: 2.5rem;
                    }
                }

            }
        }

    }
}

/** 1201px以上 の場合にフォントサイズなどをさらに大きくする **/
@media screen and (min-width: 1201px) {
}