@charset "utf-8";

/*PC*/
@media print, screen and (min-width: 768px)
{   
.container {
    margin-top: 10px;
    display: grid;
    grid-gap: 10px;
    grid-template-columns:507px 507px;
    grid-template-rows: 325px 464px 325px 650px;
}
    
.container2 {
    margin-top: 10px;
    display: grid;
    grid-gap: 10px;
    grid-template-columns:507px 507px;
    grid-template-rows: 325px 464px 325px 394px 395px 650px;
}
       
.container3 {
    margin-top: 10px;
    display: grid;
    grid-gap: 10px;
    grid-template-columns:440px 577px;
    grid-template-rows: 325px ;
}
    
.container4 {
    margin-top: 10px;
    display: grid;
    grid-gap: 10px;
    grid-template-columns:577px 440px;
    grid-template-rows: 325px ;
}
    
.summary1,.summary2,.summary3,.summary4 {
    padding: 18px;
    font-size: 17.5px;
    text-align: left;
    line-height: 1.5;
    }
    
.summary1 {
    background: #7e288c;
    line-height: 1.4;
    }
    
.summary2 {
    background: #f93a5d;
    }
    
.summary3 {
    background: #33998c;
    font-size: 15px;
    line-height: 1.4;
    }
    
.summary4 {
    background: #f99b07;
    font-size: 15px;
    line-height: 1.4;
    padding: 14px;
    }
    
.box-big1{
    grid-column: 2 / 3;
    grid-row: 1 / 3;
    }
    
.box-big2{
    grid-column: 1;
    grid-row: 2 / 4;
    }
    
.box-big3{
    grid-column: 1 / 3;
    }
    
.box-big4{
    grid-column: 1;
    grid-row: 4 / 5;
    }*/

.box-big6{
    grid-column: 2 / 3;
    grid-row: 4 / 6;
    }
    
.box-big5{
    grid-column: 1;
    grid-row: 5 / 6;
    }*/

}


/*SP*/
@media screen and (max-width: 767px)
{
    .summary1,.summary2,.summary3,.summary4{
    margin: 0 10px;
    text-align: left;
    line-height: 1.5;
    }
    
    .summary1{
    background: #3e0070;
    font-size: 14px;
    padding: 20px;
    }
    
    .summary2{
    background: #f93a5d;
    font-size: 13px;
    padding: 16px;
    }
    
    .summary3{
    background: #33998c;
    font-size: 13px;
    padding: 12px;
    }
    
     .summary4{
    background: #f99b07;
    font-size: 13px;
    padding: 12px;
    }
}

@media screen and (max-width: 320px)
	{
		
	}