@media (max-width: 767px) {
 html, body { min-width: 0; }
 img { max-width: 100%; }
 video, iframe { max-width: 100%; }
 #content-video { width: 100%; height: auto; }
 .article-content { box-sizing: border-box; min-width: 0; max-width: 100%; padding: 14px !important; text-align: left; font-size: 16px; line-height: 1.85; overflow-wrap: anywhere; }
 .article-content h1 { font-size: 24px; line-height: 1.4; margin: 0 0 16px; white-space: normal; }
 .article-content p { margin: 0 0 14px; }
 .article-content img { height: auto; }
 .article-content pre { white-space: pre-wrap; overflow-wrap: anywhere; }
 .article-content table { display: block; max-width: 100%; overflow-x: auto; }
}
@media (max-width: 767px) {
 body { width: 100%; }
 .wrapper, .works_recommend { width: auto; max-width: 100%; margin-left: 12px; margin-right: 12px; }
 .headerSearch { height: auto; padding: 14px 0; }
 .header .logoIcon { float: none; }
 .headerNav { height: auto; }
 .headerNav .wrapper { margin: 0; }
 .headerNav ul { display: flex; flex-wrap: wrap; }
 .headerNav .navItems { float: none; flex: 0 0 25%; }
 .headerNav .navItems a { box-sizing: border-box; width: auto; height: auto; min-height: 44px; line-height: 24px; padding: 10px 4px; font-size: 14px; }
 .works_recommend { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
 .works_recommend ul.left, .works_recommend ul.right { float: none; width: auto; min-width: 0; height: auto; margin: 0; padding: 0; }
 .works_recommend ul.left { grid-column: 1 / -1; }
 .works_recommend ul.left li.pic, .works_recommend ul.right li.pic { width: 100%; height: auto; aspect-ratio: 16 / 10; }
 .works_recommend ul.left li.pic img, .works_recommend ul.right li.pic img { width: 100%; height: 100%; object-fit: cover; }
 .works_recommend ul.left li.title, .works_recommend ul.right li.title { margin: 10px; font-size: 16px; white-space: normal; overflow-wrap: anywhere; }
 .works_recommend ul.left li.describe, .works_recommend ul.right li.describe { margin: 0 10px 10px; font-size: 13px; }
 .classification { width: calc(50% - 14px); margin: 8px 6px; padding: 8px; vertical-align: top; overflow-wrap: anywhere; }
 .classification .tit_img { height: auto; aspect-ratio: 1; object-fit: cover; }
 .comic-content { padding: 12px; }
 .ctDetialBrief .ctDetialBriefLeft, .ctDetialBrief .ctdbLeft { float: none; width: auto; }
 .ctDetialBrief .ctdbLeft img { width: 100%; max-width: 280px; height: auto; margin: auto; }
 .ctDetialBrief .ctdbRight { margin-left: 0; margin-top: 16px; }
 .ctDetialBrief.comic .ctDetialBriefLeft .title { max-width: 100%; max-height: none; font-size: 24px; line-height: 1.45; }
 .ctDetialBrief .ctdbRight .author { max-width: 100%; }
 .ctDetialBrief .ctdbRight .clickCountStr { position: static; font-size: 16px; }
 .breadCrumb, .subtitle, .paging { max-width: 100%; overflow-wrap: anywhere; }
}

img[src=""], img:not([src]) { display: none !important; }
/* library media */
.library-media { box-sizing: border-box; clear: both; width: 100%; max-width: 960px; margin: 20px auto; padding: 12px; text-align: center; }
.library-media[hidden], .library-media [hidden] { display: none !important; }
#library-picture { display: block; max-width: 100%; max-height: 560px; width: auto; height: auto; margin: auto; object-fit: contain; }
#content-video { display: block; width: 100%; max-width: 100%; height: auto; aspect-ratio: 16 / 9; background: #111; }
#video-start { min-height: 44px; padding: 10px 24px; border: 1px solid currentColor; border-radius: 4px; font: inherit; cursor: pointer; }
#video-message { margin: 12px 0 0; line-height: 1.6; }