@charset "utf-8";
/* CSS Document */

.caseWrap{
margin-bottom: 2em;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}

.caseBox{
margin-bottom: 10px;
width: 100%;
max-width: 160px;
box-sizing: border-box;
border: solid 2px var(--cp-blue);
}

.caseDate{
margin-bottom: 3px;
background-color: var(--cp-blue);
color: #fff;
text-align: center;
font-size: 1rem;
}

.caseThum{
max-height: 200px;
text-align: center;
}

.caseThum img{
height: 200px;
object-fit: cover;
}

.caseTopTit{
margin: 3px;
font-size: 1rem;
font-weight: normal;
line-height: 1.5em;
color: #2E2E2E;
border-bottom: dotted 1px var(--cp-blue);
}

.caseTopTxt{
margin: 3px;
font-size: 1rem;
line-height: 1.5em;
color: #2E2E2E;
}

.caseBtnArea{
margin-bottom: 2em;
}

.caseBtnArea button{
margin-right: 10px;
margin-bottom: 10px;
padding: 0.4em 0.8em;
}



@media screen and (max-width: 450px) { /* スマホ450以下 *************************************************************************************/

.caseWrap{
justify-content: space-around;
}

.caseBtnArea{
padding: 0 5%;
}

.caseBtnArea form{
display: flex;
flex-wrap: wrap;
justify-content: space-around;
line-height: 2em;
}

.caseBtnArea button{
display: block;
width: 45%;
}

}