@charset "UTF-8";

.classList{margin:3rem auto;}
.classList #con_com_box {margin-top: 2.3rem;}
.classList #con_com_box ul {display: flex; flex-wrap: wrap; margin: -0.75rem -0.95rem;}
.classList #con_com_box ul li {width: calc(100% / 3); padding: 0.75rem 0.95rem;}
.classList #con_com_box ul li a {display: block; height: 100%; text-align: center; border-radius: 0.5rem; border: 1px solid #c9ced6; padding: 0.5rem; position: relative; transition: all 0.15s;}
.classList #con_com_box ul li a .img {border-radius: 0.5rem; font-size: 0; line-height: 0; overflow: hidden; isolation: isolate;}
.classList #con_com_box ul li a .img img {width: 100%; height: 8.1rem; object-fit: cover;}
.classList #con_com_box ul li a .tit {margin: 0.75rem 0; position: relative;}
.classList #con_com_box ul li a .tit::after{content:"\e900"; font-family: 'xeicon'; color: #fff; display: block; width: 2rem; height: 2rem; line-height: 1.9rem; text-align: center; font-size: 1.1rem; border-radius: 50%; position: absolute; right: 0.2rem; top: -1.7rem; background: #525c6e; transition: all 0.15s;}
.classList #con_com_box ul li a .tit h4 {font-size: 0.9rem; color: #000000; font-weight: 600; transition: all 0.15s;}
.classList #con_com_box ul li a .tit p {font-size: 0.8rem; text-align: center;}

/* active */
.classList #con_com_box ul li a:hover,
.classList #con_com_box ul li a:focus{border-color: #1b6dd1;}
.classList #con_com_box ul li a:hover .tit::after,
.classList #con_com_box ul li a:focus .tit::after{background: #1b6dd1;}
.classList #con_com_box ul li a:hover .tit h4,
.classList #con_com_box ul li a:focus .tit h4 {color: #1b6dd1;}


.classList #con_com_box ul li.no_data {width: 100%;}
.classList #con_com_box ul li.no_data p {display: flex; justify-content: center; align-items: center; height: 14.45rem; border-radius: 0 0.5rem 0.5rem 0.5rem; border: 1px solid #c9ced6; background: #fff; box-shadow: 0 0.15rem 0.15rem rgba(198,198,198,0.15); padding: 1rem 1rem 0.75rem; position: relative;}
.classList #con_com_box ul li.no_data p:before {content: ""; display: block; width: 3px; height: calc(100% - 3.5rem); max-height: 4.35rem; border-radius: 0 0 3px 3px; background: #b0c4fc; position: absolute; left: -1px; top: -1px; z-index: 1;}
.classList #con_com_box ul li.no_data p:after {content: ""; display: block; width: calc(100% - 1.5rem); max-width: 6.35rem; height: 3px; border-radius: 0 3px 3px 0; background: #4a97ff; position: absolute; left: -1px; top: -1px; z-index: 2;}