@charset "UTF-8";
 #roop_side.case-material-filter li > a::after {
content: none;
}
@media screen and (min-width: 680px) {
.case-archive-layout {
align-items: flex-start;
gap: 28px;
}
.case-archive-layout #roop_side.case-material-filter {
flex: 0 0 230px;
width: 230px;
margin-right: 0;
}
.case-archive-layout #roop_side.case-material-filter > ul {
width: 100%;
}
.case-archive-layout #roop_side.case-material-filter li {
height: auto;
min-height: 34px;
}
.case-archive-layout #roop_side.case-material-filter li > a {
padding: 6px 4px;
line-height: 1.35;
text-decoration: none;
white-space: nowrap;
}
.case-archive-layout #roop_side.case-material-filter li > a:hover,
.case-archive-layout #roop_side.case-material-filter li > a[aria-current="page"] {
color: #44318f;
font-weight: 600;
}
.case-archive-layout #roop_main {
flex: 1 1 auto;
width: auto;
min-width: 0;
}
.case-archive-layout .case_examp-flex {
margin-bottom: 48px;
}
.case-archive-layout .case_examp-flex__img {
width: 32%;
aspect-ratio: 1 / 1.15;
padding: 16px;
border-bottom: 0;
}
.case-archive-layout .case_examp-flex__img a {
display: flex;
width: 100%;
height: 100%;
align-items: center;
justify-content: center;
}
.case-archive-layout .case_examp-flex__box {
width: 68%;
align-content: stretch;
}
.case-archive-layout .case_examp-flex__box__p {
min-height: 72px;
padding: 0;
line-height: 1.5;
}
.case-archive-layout .case_examp-flex__box__p:last-child,
.case-archive-layout .case_examp-flex__box__p:nth-last-child(2):nth-child(odd) {
border-bottom: 0;
}
.case-archive-layout .case_examp-flex__box__p span {
padding: 10px;
}
.case-archive-layout .case_examp-flex__box__p small,
.case-archive-layout .case_examp-flex__detail > small {
padding: 10px 14px;
line-height: 1.6;
}
.case-archive-layout .case_examp-flex__detail {
min-height: 54px;
line-height: 1.5;
}
.case-archive-layout .case_examp-flex__box + .case_examp-flex__detail {
border-top: 1px solid #aaa;
}
.case-archive-layout .case_examp-flex__btn {
height: 84px;
}
}
@media screen and (max-width: 679px) {
.case-archive-layout #roop_side.case-material-filter {
width: 100%;
margin: 24px 0 32px;
padding: 0 16px;
}
.case-archive-layout #roop_side.case-material-filter ul {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0 16px;
margin-bottom: 24px;
}
.case-archive-layout #roop_side.case-material-filter li {
height: auto;
min-height: 40px;
}
.case-archive-layout #roop_side.case-material-filter li > a {
padding: 7px 2px;
line-height: 1.4;
}
}