.workpage_main{
    grid-template-rows: 300px 300px 300px 300px 300px 300px 300px;
}


#page_prev{
    position: fixed;
	text-align: center;
	right: 5%;
    bottom: 5%;
	transform: translate(-50%, -50%);
    border: none;
}

#mainvisual{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    margin: 20px auto 0px; 
    }

.image {
    width: 90%;
	height: auto;
	display: block;
    margin: auto;
}

.dllink a{
	position: fixed;
	left: 50%;
    top: 95%;
	transform: translate(-50%, -50%);
	z-index: 2;
	white-space: nowrap;
	color: #FFFFFF;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	height: 10px;
	line-height: 10px;
	text-align: center;
	font-size: 16px;
	font-weight: 100;
	padding: 13px 23px ;
	background-color: #000000;
	text-decoration: none;
	display: inline-block;
	cursor: pointer;
}


.pageExtender {
	height: 2000px;
	background-color:#FFFFFF;
}


@media screen and (min-width: 769px) {

    #mainvisual{
        aspect-ratio: 5 / 3;
        }
    
    #mainvisual img{
        width: 85%;
        height: auto;
        object-fit: contain;
    }

    #sp_archive{
        display: none;
    }

    #home, #concept{
        display: block;
    }

    #mainvisual{
        display: flex;
    }

    .workpage_main{
        display: grid;
    }

    #itemA{
        grid-row: 1 ;
        grid-column: 1 ;
    }

    #itemB{
        grid-row: 1;
        grid-column: 2;
    }
    
    #itemC{
        grid-row: 1;
        grid-column: 3;
    }

    #itemD{
        grid-row: 2;
        grid-column: 1;
    }

    #itemE{
        grid-row: 2;
        grid-column: 2;
    }

    #itemF{
        grid-row: 2;
        grid-column: 3;
    }

    #itemG{
        grid-row: 3;
        grid-column: 1;
    }

    #itemH{
        grid-row: 3;
        grid-column: 2;
    }

    #itemI{
    grid-row: 3;
    grid-column: 3;
    }

    #itemJ{
    grid-row: 4;
    grid-column: 1;
    }

    #itemK{
        grid-row: 4;
        grid-column: 2;
        }

    #itemL{
    grid-row: 4;
    grid-column: 3;
    }

    #itemM{
    grid-row: 5;
    grid-column: 1/4;
    }

    #itemN{
    grid-row: 6;
    grid-column: 1/4;
    }

    #itemO{
        grid-row: 7;
        grid-column: 1/4;
        }

    #itemP{
    grid-row: 8;
    grid-column: 1/4;
    }



#page_prev{
    position: static;
    text-align: right;
    transform: translate(0%, 0%);
    right: 0;
    bottom: 0;
}

}