@charset "UTF-8";

.pagetop
    {position: fixed;
    bottom: 550px;
    right: 10px;}
.pagetop a
    {display: block;
    text-decoration: none;}
 .pagetop:hover
    {opacity: 0.85 ;}


.grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 1fr);}

#cell1 {
    grid-column: 1 / 2;
    grid-row: 1 / 2;}
#cell2 {
    grid-column: 2 / 3;
    grid-row: 1 / 3;
    animation-name: fadeup;
    animation-duration: 2s;
    animation-iteration-count: 1;
    }
@keyframes fadeup {
from {
    opacity: 0;
    transform: translateY(20px);
}
to {
    opacity: 1;
    transform: translateY(0);
}}

#cell3 {
    grid-column: 2 / 4;
    grid-row: 3 / 4;
	
    animation-name: fadeup;
    animation-duration: 2s;
    animation-iteration-count: 1;
}
@keyframes fadeup {
from {
    opacity: 0;
    transform: translateY(20px);
}
to {
    opacity: 1;
    transform: translateY(0);
}}


#cell4 {
    grid-column: 1 / 2;
    grid-row: 2 / 4;
    animation-name: fadeup;
    animation-duration: 2s;
    animation-iteration-count: 1;
}
@keyframes fadeup {
from {
    opacity: 0;
    transform: translateY(20px);
}
to {
    opacity: 1;
    transform: translateY(0);
}}

.copy {display: block;
    margin-left: auto;
	margin-right: auto;}

.ome {  position: relative;}
.ome p {
    text-align: center;
    position: absolute;
    top: 75px;
    left: 26px;
    font-size: 10px;
    font-family:"Hiragino Sans";
    width: 288px;
    height: 100px;
	line-height: 13px
}

.shikaku {position: relative;}
.shikaku p{
    position: absolute;
	font-size:16px;
	font-family: "Hiragino Sans";
    color: white;
    left: 20px;
    top: 12px;
	 text-shadow    : 
       2px  2px 1px #000,
      -2px  2px 1px #000,
       2px -2px 1px #000,
      -2px -2px 1px #000,
       2px  0px 1px #000,
       0px  2px 1px #000,
      -2px  0px 1px #000,
       0px -2px 1px #000;
}

.gimonn{
display: block;
margin-left: auto;
margin-right: auto;
}

.mita {position: relative;}
.mita p{
    position: absolute;
    font-size: 17px;
    font-family: "Hiragino Sans";
    color: white;
    left: 26px;
    top: 33px;
}


.text {font-size: 17px;
    font-family: "Hiragino Sans";
    width: 288px;
    height: 100px;
	text-align: center;
	display: block;
    margin-left: auto;
    margin-right: auto;
}


.mita2  {position: relative;}
.mita2 p{
    position: absolute;
    font-size: 17px;
    font-family: "Hiragino Sans";
    color: white;
    left: 26px;
    top: 27px;
}

.add {position: relative;}
.add p {
    position: absolute;
    font-size: 17px;
    font-family: "Hiragino Sans";
    color: white;
    left: 50px;
    top: 30px;
}




.show {position: relative;}
.show p{
	text-align: center;
    position: absolute;
    font-size: 16px;
    font-family: "Hiragino Sans";
    color: white;
    left: 28px;
    top: 40px;
    width: 278px;
    height: 128px;
}