| | |
| | | @import "../../common/sassMixin"; |
| | | |
| | | .c-home-nav { |
| | | width: 100%; |
| | | margin-bottom: 20px; |
| | | .c-home-nav-title { |
| | | width: 100%; |
| | | color: #666; |
| | | text-align: center; |
| | | background-color: #fff; |
| | | border-top: #e2e2e2 1PX solid; |
| | | } |
| | | .c-home-nav-content { |
| | | width: 100%; |
| | | } |
| | | &.col-two { |
| | | @include clearfix; |
| | | .c-home-nav-content { |
| | | @include clearfix; |
| | | } |
| | | .c-home-item { |
| | | float: left; |
| | | width: 50%; |
| | |
| | | } |
| | | } |
| | | .c-home-item-icon { |
| | | width: 100px; |
| | | height: 100px; |
| | | width: 110px; |
| | | height: 110px; |
| | | margin: 0 20px 0 40px; |
| | | } |
| | | .c-home-item-label { |
| | | max-width: calc(100% - 160px - 40px); |
| | | max-width: calc(100% - 170px - 40px); |
| | | padding-right: 40px; |
| | | line-height: 46px; |
| | | vertical-align: middle; |
| | |
| | | } |
| | | @at-root .super & { |
| | | .c-home-item-label { |
| | | max-width: calc(100% - 160px - 20px); |
| | | max-width: calc(100% - 170px - 20px); |
| | | padding-right: 20px; |
| | | } |
| | | } |
| | | } |
| | | &.col-three { |
| | | width: 100%; |
| | | @include flexbox(flex, flex-start center, n wrap); |
| | | .c-home-nav-content { |
| | | @include flexbox(flex, flex-start center, n wrap); |
| | | } |
| | | .c-home-item { |
| | | width: 33.3%; |
| | | height: 246px; |
| | | padding: 36px 0 0; |
| | | text-align: center; |
| | | box-sizing: border-box; |
| | | border-right: 1px solid #e2e2e2; |
| | | border-bottom: 1px solid #e2e2e2; |
| | | border-right: 1PX solid #e2e2e2; |
| | | border-bottom: 1PX solid #e2e2e2; |
| | | box-sizing: border-box; |
| | | background-color: #fff; |
| | | &:active { |
| | | background-color: #f2f2f2; |
| | | } |
| | | &:nth-child(1) { |
| | | border-top: #e2e2e2 1PX solid; |
| | | } |
| | | &:nth-child(2) { |
| | | border-top: #e2e2e2 1PX solid; |
| | | } |
| | | &:nth-child(3) { |
| | | border-top: #e2e2e2 1PX solid; |
| | | } |
| | | &:nth-child(3n+3) { |
| | | border-right: none; |
| | |
| | | } |
| | | .c-home-item-icon { |
| | | display: block; |
| | | width: 120px; |
| | | height: 120px; |
| | | width: 110px; |
| | | height: 110px; |
| | | margin: 0 auto 8px; |
| | | } |
| | | } |