.ptc-wrapper { @include media-breakpoint-up(md) { background: #fff; &:only-of-type { min-height: 1084px; } .ptc-block { margin-bottom: 0; } } } .ptc-inner { @include media-breakpoint-up(md) { margin: auto; padding: 0 36px; width: 750px; } } .ptc-inner-md { @include media-breakpoint-up(md) { margin: auto; width: 1168px; } } .ptc-title { padding: 36px 24px; line-height: 56px; font-size: 40px; font-weight: 600; color: #333; @include media-breakpoint-up(lg) { padding-left: 0; } } .ptc-block { margin-bottom: 24px; padding: 48px 36px; background: #fff; &:last-child { margin-bottom: 0; } @include media-breakpoint-up(md) { padding: 64px 0; } } .ptc-button-group { margin: 48px 36px 0; .ptc-button + .ptc-button { margin-top: 36px; } @include media-breakpoint-up(md) { margin: 0; padding: 32px 0 64px; } } .ptc-button { display: flex; justify-content: center; align-items: center; width: 100%; height: 92px; background: $primary-color; border-radius: 8px; font-size: 32px; font-weight: 600; color: #fff; &:active { background: $primary-color-lighten; } &--stroke { background: none; border: 2Px solid $primary-color; color: $primary-color; &:active { background: #f2f5fb; } } &--loading { pointer-events: none; opacity: 0.75; position: relative; &::before { content: ''; margin-right: 8px; margin-top: -4px; animation: rotate 2s linear infinite; @include icon('@img/loading2.svg', 48px); } } } .ptc-form { &-item { margin-top: 36px; } } .ptc-input { display: block; padding: 0 28px; width: 100%; height: 100px; border-radius: 8px; border: 2px solid #d9d9d9; font-size: 32px; color: #333; } .ptc-cell { + .ptc-cell { margin-top: 84px; } } .ptc-label { margin-bottom: 48px; line-height: 44px; font-size: 32px; color: #999; } .ptc-value { font-size: 32px; color: #1A1A1A; line-height: 44px; } .ptc-tag { display: inline-block; margin-left: 32px; padding: 0 24px; line-height: 52px; font-size: 28px; font-weight: 600; color: #fff; background: $danger-color; border-radius: 30px 4px 30px 4px; } .ptc-select { position: relative; padding: 0 114px 0 34px; line-height: 84px; border-radius: 8px; border: 2px solid #D9D9D9; font-size: 32px; color: #1a1a1a; &__placeholder { color: $placeholder-color; } &::after { content: ''; position: absolute; top: 50%; right: 34px; transform: translateY(-50%); width: 44px; height: 44px; background: #eee; } } .ptc-comboinput { display: flex; .ptc-input { flex: 1; border-radius: 8px 0 0 8px; border-right: 0; } .ptc-button { padding: 0 16px; height: auto; width: auto; border-radius: 0 8px 8px 0; font-size: 28px; } }