@charset "utf-8";

.schools { width:100%; display:block; }
.school { width:100%; display:flex; flex-wrap:wrap; margin:10px 0 10px 0; }
.schoolCity { width:100%; padding:10px 5%; display:flex; align-items:center; background:rgba(15,49,87,0.2); line-height:1.2; }
.schoolCity h2 { width:100%; display:block;}
.schoolBoxes { width:100%; display:block; }
.schoolBox { width:100%; display:block; }
.schoolBoxTitle { width:100%; padding:10px 5%; display:flex; justify-content:space-between; align-items:center; background:#0D3058; color:#fff; line-height:1.2; }
.schoolBox:last-child .schoolBoxTitle { border-top:1px solid #fff; }
.schoolBoxTitleIcon { width:16px; height:16px; line-height:1.2; transition:0.3s; }
.schoolBoxTitle.close .schoolBoxTitleIcon { transform:rotate(45deg); transition:0.3s; }
.schoolBoxOpen { display:none; }
.schoolBoxOpenInside { width:100%; padding:10px 5% 20px 5%; display:flex; flex-wrap:wrap; align-items:center; background:#f2f2f2; }
.schoolBoxOpenInside a { width:100%; padding:10px 0; display:flex; align-items:center; border-bottom:1px dotted #0D3058; }
.schoolBoxOpenInside a i { margin:0 5px 0 0; }
@media screen and (min-width: 840px) {
    .school { margin:10px 0 40px 0; }
    .schoolCity { width:20%; padding:0; text-align:center; }
    .schoolBoxes { width:80%; }
    .schoolBoxOpen { display:block; }
    .schoolBoxOpenInside { padding:20px 0 20px 5%; }
    .schoolBoxOpenInside a { width:auto; max-width:50%; min-width:25%; padding:10px 0; border-bottom:none; line-height: 1.4em;}
    .schoolBoxOpenInside a:hover { text-decoration:underline; }
}