
.ct-select-group {
    display: inline-block;
    position: relative;
    border-radius: 3px;
    box-sizing: border-box;
    .ct-select__inner {
        position: relative;
        border-radius: 3px;
        border: 1px solid $border-color;
        box-sizing: border-box;
        padding-right: 32px;
        box-sizing: border-box;
        min-width: 100px;
        .ct-input  {
            border: none;
            border-radius: 3px;
            padding: 0;
            .ct-input__inner {
                font-size: 12px;
            }
        }
        .ct-tag {
            z-index:2;
            margin: 3px;
            border: 1px solid #e6e6e6;
            background: #f8f8f8;
            box-sizing: border-box;
        } 
        .ct-icon {
            position: absolute;
            top: calc(50% - 8px);
            right: 8px;
            font-weight: 600;
            transition: .3s ease-in-out;
            z-index: 10;
        } 
        .icon-circle-close {
            z-index: 20;
        }
        .ct-select__tip {
            padding:0 10px;
            font-size: 12px;
            color: #7b7b7b;
        }
    }
    .ct-select-dropdown {
        position: relative;
        width: 100%;
        top: 10px;
        left: 0;
        box-sizing: border-box;
        padding: 2px;
        background: #fff;
        opacity: 0;
        transition:.3s ease-in-out;
        transform: rotateX(90deg);
        transform-origin:top;
        z-index: 50;
        .ct-select-dropdown-wrap {
            position: absolute;
            padding: 5px 0;
            box-shadow: 0 0 1px 0px rgba(0,0,0,.5);
            width: 100%;
            background-color: #fff;
            display: block;
            box-sizing: border-box;
            border-radius: 3px;
            .ct-select-dropdow__item {
                &:hover {
                    background: #f2f2f2;
                }
                .ct-select-dropdow__inner {
                    box-sizing: border-box;
                    padding: 5px 10px;
                    width: 100%;
                    display: block;
                    overflow: hidden;
                    color: #666;
                    font-size: 12px;
                }
                &.is-selected {
                    .ct-select-dropdow__inner {
                        color: $primary-bg;
                    }
                }
                &.is-disabled {
                    background: #f8f8f8;
                    cursor: not-allowed;
                }
            }
        }
    }
    &.ct-select__large {
        .ct-select__inner {
            .ct-icon {
                top: calc(50% - 10px);
                font-size: 18px ;
            }
        }
        &.is-multiple {
            .ct-select__inner {
                .ct-tag {
                    height: 33px;
                    line-height: 33px;
                }
            }
        }
    }
    &.ct-select__small {
        .ct-select__inner {
            .ct-icon {
                top: calc(50% - 6px);
                font-size: 14px ;
            }
        }
        &.is-multiple {
            .ct-select__inner {
                .ct-tag {
                    height: 18px;
                    line-height: 18px;
                }
            }
        }
    }
    &.is-show {
        .ct-select__inner {
            .icon-arrow-bottom {
                transform: rotate(180deg);
            }  
        }
        .ct-select-dropdown { 
            opacity: 1;
            visibility: visible;
            transform: rotateX(0deg)
        }
    } 
    &.is-multiple {
        .ct-select__inner {
            .ct-input{
                width: 1px;
                margin: 3px 0;
                opacity: 0; 
            }
        }
    }
    //禁用
    &.is-disabled {
        .ct-select__inner {
            background: #f8f8f8;
            cursor: not-allowed; 
        }
    }

}
