|
|
| 第101行: |
第101行: |
| font-weight: bold; | | font-weight: bold; |
| color: #ff6600; | | color: #ff6600; |
| }
| |
|
| |
| .main-line-wrap {
| |
| width: 100%;
| |
| margin: 0px;
| |
| }
| |
| .resp-tabs {
| |
| width: 100%;
| |
| }
| |
|
| |
| .resp-tabs-list {
| |
| list-style: none;
| |
| padding: 0;
| |
| display: flex;
| |
| flex-wrap: wrap;
| |
| gap: 10px;
| |
| }
| |
| .resp-tabs-list.clearfix::after {
| |
| content: "";
| |
| display: table;
| |
| clear: both;
| |
| }
| |
|
| |
| .czn-list-style {
| |
| display: inline-block;
| |
| cursor: pointer;
| |
| transition: all 0.3s ease;
| |
| }
| |
|
| |
| .tab-panel {
| |
| position: relative;
| |
| display: inline-block;
| |
| background: #b9b9b9;
| |
| color: #000;
| |
| padding: 5px 30px;
| |
| font-size: 12px;
| |
| text-align: center;
| |
| clip-path: polygon(5% 0%, 95% 0%, 100% 50%, 95% 100%, 5% 100%, 0% 50%);
| |
| min-width: auto;
| |
| transition: all 0.3s ease;
| |
| }
| |
|
| |
| .czn-list-style.active .tab-panel {
| |
| background: #ff5514;
| |
| color: white;
| |
| }
| |
|
| |
| .tab-panel::before {
| |
| content: "✦";
| |
| position: absolute;
| |
| left: 5px;
| |
| top: 50%;
| |
| transform: translateY(-50%);
| |
| font-size: 16px;
| |
| color: inherit;
| |
| opacity: 0;
| |
| transition: opacity 0.3s ease;
| |
| }
| |
|
| |
| .tab-panel::after {
| |
| content: "✦";
| |
| position: absolute;
| |
| right: 5px;
| |
| top: 50%;
| |
| transform: translateY(-50%);
| |
| font-size: 16px;
| |
| color: inherit;
| |
| opacity: 0;
| |
| transition: opacity 0.3s ease;
| |
| }
| |
|
| |
| .czn-list-style.active .tab-panel::before,
| |
| .czn-list-style.active .tab-panel::after {
| |
| opacity: 1;
| |
| }
| |
|
| |
| .resp-tabs-container {
| |
| padding-left: 0px;
| |
| }
| |
|
| |
| .resp-tab-content {
| |
| display: none;
| |
| animation: fadeIn 0.3s ease;
| |
| }
| |
| .resp-tab-content[style*="display:block"],
| |
| .resp-tab-content[style*="display: block"] {
| |
| display: block !important;
| |
| }
| |
|
| |
| @keyframes fadeIn {
| |
| from {
| |
| opacity: 0;
| |
| }
| |
| to {
| |
| opacity: 1;
| |
| }
| |
| } | | } |
| }} | | }} |