@charset "UTF-8";

/* ========================================
   @media screen and (min-width: 768px),print
======================================== */
@media screen and (min-width: 768px),print {

/* topics -------------------------------------*/
#topics .system-list {
   display: grid;
   grid-template-columns: 1fr;
   gap: 0;
}
#topics .system-list li {
   border-bottom: 1px solid #a4a4a4;
}
#topics .system-list li a {
   display: flex;
   gap: 23px;
   padding: 29px 39px;
}
#topics .system-list li:first-child {
   border-top: 1px solid #a4a4a4;
}
#topics .system-date {
   font-size: 16px;
   color: #269a6f;
}
#topics .system-list li .system-ttl-01 {
   font-weight: 500;
   font-size: 14px;
   letter-spacing: 0.05em;
   line-height: 1.85714;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
   overflow: hidden;
}
#topics .system-contents .system-ttl{font-size: 26px;font-weight: bold;margin-bottom: 30px;padding: 25px 0;border-bottom: 1px #ccc solid;line-height: 1.4;}
}


/* ========================================
   @media screen and (max-width: 767px)
======================================== */
@media screen and (max-width: 767px) {

/* topics -------------------------------------*/
#topics .system-list {
   display: grid;
   grid-template-columns: 1fr;
   gap: 0;
   order: 3;
   margin-bottom: 7.05vw;
}
#topics .system-list li {
   border-bottom: 0.2vw solid #a4a4a4;
   padding: 2.83vw 0 3.83vw;
}
#topics .system-list li:first-child {
   border-top: 0.2vw solid #a4a4a4;
}
#topics .system-date {
   font-size:3.865vw;
   color: #269a6f;
   margin-bottom: 1.42vw;
}
#topics .system-list li .system-ttl-01 {
   font-weight: 500;
   font-size:3.382vw;
   letter-spacing: 0.05em;
   line-height: 1.85714;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 4;
   overflow: hidden;
}
#topics .system-contents .system-ttl{font-size: 5.2vw;font-weight: bold;margin-bottom: 4vw;padding-bottom: 2vw;border-bottom: 0.2vw #ccc solid;line-height: 1.4;}
}