p{
    line-height: 33px;
}
.grid {
display: grid;
gap: 10px;
grid-template-columns: 1fr 2fr;
}
.main,
.side {
padding: 2%;
border-radius: 10px
}
@media(max-width: 900px){
.grid {
grid-template-columns: 1fr;
}
}
details {
margin: 0 auto 10px;
width: 580px;
}
.agreement-item-border{
    border-bottom:1px solid white;
}

@media(max-width: 900px){
.agreement-item{
    font-size: 13px !important;
}
}

.agreement-item{
display: flex; /*質問文とプラスアイコンを横並びとデフォルトの三角矢印をリセット*/
justify-content: space-between; /*左右両端に配置*/
align-items: center; /*上下中央配置*/
padding: 20px;
font-size: 16px;
background-color: #d6d6d6;
cursor: pointer; /*カーソルをのせたときにpointer表示に指定*/
}
summary {
display: flex; /*質問文とプラスアイコンを横並びとデフォルトの三角矢印をリセット*/
justify-content: space-between; /*左右両端に配置*/
align-items: center; /*上下中央配置*/
padding: 20px 30px; font-size: 18px;
background-color: #d6d6d6;
border-radius: 10px;
cursor: pointer; /*カーソルをのせたときにpointer表示に指定*/
}