@charset "utf-8"; *, ::after, ::before { box-sizing: border-box; } .ace-article-top { background: #c1c1c1 url(../img/bg.webp) center center/cover no-repeat; padding: 50px 0; color: #000; font-size: 18px; } .ace-article-top h1 { font-size: 2.5rem; font-weight: 400; margin-bottom: 15px; } .ace-article-top .form-search { display: flex; } .ace-article-top .form-search .search-put { width: 30%; border-radius: 0; } .ace-article-top .form-search .btn-secondary { height: 34px; padding: 0 20px; line-height: 34px; } .ace-article-info { padding: 50px 0; } .ace-article-info .sidebar { width: 21%; float: left; border-top: 5px solid #0071d1; box-shadow: 0 0 10px rgba(53, 49, 50, .2); color: #000; padding: 15px; } .ace-article-info .sidebar h3 { font-size: 24px; line-height: 1.2em; border-bottom: 1px solid #cbcbcb; padding: 10px; margin-bottom: 15px; font-weight: 400; } .ace-article-info .sidebar dl { padding: 0 10px; } .ace-article-info .sidebar dl dt { font-size: 18px; font-weight: 400; padding: 10px 0; } .ace-article-info .sidebar dl dd { margin-bottom: 15px; } .ace-article-info .sidebar dl a { font-size: 16px; font-weight: 300; display: block; } .ace-article-info .sidebar dl dd.active a, .ace-article-info .sidebar dl a:hover { color: #0071d1; text-decoration: none; } .ace-article-info .sidebar dl dd.active a { font-weight: 700; text-decoration: none; } .ace-article-info .right-list { float: right; width: 74%; } .ace-article-info .tab-change .tab-nav ul { display: flex; padding-top: 15px; } .ace-article-info .tab-change .tab-nav ul li { font-weight: 400; font-size: 20px; padding: 0 20px; position: relative; cursor: pointer; } .ace-article-info .tab-change .tab-nav ul li::before { content: ""; border-left: 1px solid #ddd; height: 36px; display: block; position: absolute; left: 0; top: -3px; } .ace-article-info .tab-change .tab-nav ul li:first-child { padding-left: 0; } .ace-article-info .tab-change .tab-nav ul li:first-child::before { border-left: 0; } .ace-article-info .tab-change .tab-nav ul li:hover, .ace-article-info .tab-change .tab-nav ul li.active { color: #0071d1; } .ace-article-info .right-list .tab-info { padding: 15px 0; } .ace-article-info .right-list .tab-info .item { display: block; float: none; width: 100%; position: relative; padding-left: 195px; margin-top: 15px; margin-bottom: 20px; border-bottom: 1px solid #ddd; padding-bottom: 15px; min-height: 140px; } .ace-article-info .right-list .tab-info .item:hover { text-decoration: none; } .ace-article-info .right-list .tab-info .item .img { position: absolute; left: 0; width: 180px; overflow: hidden; max-height: 120px; } .ace-article-info .right-list .tab-info .item .img img { max-width: 180px; } .ace-article-info .right-list .tab-info .item .message { font-size: 14px; } .ace-article-info .right-list .tab-info .item .message .title { font-size: 20px; margin-bottom: 15px; font-weight: 400; display: block; } .ace-article-info .right-list .tab-info .item.author .message .title .title-link { margin-right: 10px; } .ace-article-info .right-list .tab-info .item.author .message .title img { max-width: 24px; } .ace-article-info .right-list .tab-info .item:hover .message .title { color: #0071d1; text-decoration: underline; } .ace-article-info .right-list .tab-info .item .message .time { color: #999; } .ace-article-info .right-list .tab-info .item:hover .message .title, .ace-article-info .right-list .tab-info .item .message .title:hover { color: #0071d1; text-decoration: underline; } .ace-article-info .right-list .tab-info .item.author:hover .message .title { text-decoration: none; } .ace-article-info .right-list .tab-info .item.author .message .title a:hover { text-decoration: underline; } .ace-article-info .right-list h2 { font-weight: 400; padding-top: 15px; } .ace-article-info .right-list .tab-info .item .message .desc { font-size: 14px; color: #666; } @media (min-width: 992px) { .articles3-splash .author-content .table-cell { padding: 15px 0 } } @media (min-width: 992px) { .d-lg-none { display: none !important; } .pl-lg-5, .px-lg-5 { padding-left: 3rem !important; } .pb-lg-5, .py-lg-5 { padding-bottom: 3rem !important; } .pt-lg-5, .py-lg-5 { padding-top: 3rem !important; } .pr-lg-5, .px-lg-5 { padding-right: 3rem !important; } } @media (max-width: 769px) { .main-content, .category-nav { width: 90%; font-size: 16px; } .app-review-content .navIcon, .article-review-sitesphp .custom-main-content .navIcon { display: none } .articles3-splash .header-content h1 { font-size: 40px } .articles3-splash .include-content { margin-top: 20px } .articles3-splash .author-content .table-cell { padding: 20px 0 20px } .article .chart_table, .article .table, .article .table2 { table-layout: fixed } .article .chart_table td, .article .chart_table th, .article .table td, .article .table th, .article .table2 td, .article .table2 th { padding: 12px 5px } .ace-article-top { padding-top: 80px; } .ace-article-info .right-list, .ace-article-info .sidebar { float: none; width: 100%; } .ace-article-info { padding: 20px 0; } .ace-article-info .right-list .tab-info .item { padding-left: 140px; } .ace-article-info .right-list .tab-info .item .img { width: 130px; } .ace-article-info .right-list .tab-info .item .img img { max-width: 130px; height: auto; } .ace-article-info .right-list .tab-info .item .message .title { font-size: 16px; font-weight: 400; } .ace-article-top h1 { font-size: 2rem; } .ace-article-top .form-search .search-put { width: 68%; } }