/*Textarea Common Css*/
textarea.form-control {
    font-weight : 400;
    color       : var(--basic-black);
    font-size   : var(--font-16);
    line-height : var(--line-20);
    padding     : 16px;
    border      : var(--border-1px) transparent;
}

textarea.form-control::placeholder {
    color       : var(--basic-gray-medium);
    font-weight : inherit;
}

textarea.form-control:hover {
    border-color : var(--basic-black);
}

textarea.form-control:focus {
    border-color : var(--basic-black);
}

textarea.hover-brand-primary:hover {
    border-color : var(--brand-primary) !important;
}

textarea.hover-brand-primary:hover + i {
    color : var(--brand-primary) !important;
}

textarea.hover-brand-primary:hover + i + i {
    color : var(--brand-primary) !important;
}

textarea.focus-brand-primary:focus {
    border-color : var(--brand-primary) !important;
}

textarea.focus-brand-primary:focus + i {
    border-color : var(--brand-primary) !important;
}

textarea.focus-brand-primary:focus + i + i {
    border-color : var(--brand-primary) !important;
}

textarea.hover-brand-primary-opacity:hover {
    border-color : var(--brand-primary-opacity) !important;
}

textarea.hover-brand-primary-opacity:hover + i {
    border-color : var(--brand-primary-opacity) !important;
}

textarea.hover-brand-primary-opacity:hover + i + i {
    border-color : var(--brand-primary-opacity) !important;
}

textarea.focus-brand-primary-opacity:focus {
    border-color : var(--brand-primary-opacity) !important;
}

textarea.focus-brand-primary-opacity:focus + i {
    border-color : var(--brand-primary-opacity) !important;
}

textarea.focus-brand-primary-opacity:focus + i + i {
    border-color : var(--brand-primary-opacity) !important;
}

textarea.hover-brand-secondary:hover {
    border-color : var(--brand-secondary) !important;
}

textarea.hover-brand-secondary:hover + i {
    border-color : var(--brand-secondary) !important;
}

textarea.hover-brand-secondary:hover + i + i {
    border-color : var(--brand-secondary) !important;
}

textarea.focus-brand-secondary:focus {
    border-color : var(--brand-secondary) !important;
}

textarea.focus-brand-secondary:focus + i {
    border-color : var(--brand-secondary) !important;
}

textarea.focus-brand-secondary:focus + i + i {
    border-color : var(--brand-secondary) !important;
}

textarea.hover-brand-secondary-opacity:hover {
    border-color : var(--brand-secondary-opacity) !important;
}

textarea.hover-brand-secondary-opacity:hover + i {
    border-color : var(--brand-secondary-opacity) !important;
}

textarea.hover-brand-secondary-opacity:hover + i + i {
    border-color : var(--brand-secondary-opacity) !important;
}

textarea.focus-brand-secondary-opacity:focus {
    border-color : var(--brand-secondary-opacity) !important;
}

textarea.focus-brand-secondary-opacity:focus + i {
    border-color : var(--brand-secondary-opacity) !important;
}

textarea.focus-brand-secondary-opacity:focus + i + i {
    border-color : var(--brand-secondary-opacity) !important;
}

textarea.hover-impact-primary:hover {
    border-color : var(--impact-primary) !important;
}

textarea.hover-impact-primary:hover + i {
    border-color : var(--impact-primary) !important;
}

textarea.hover-impact-primary:hover + i + i {
    border-color : var(--impact-primary) !important;
}

textarea.focus-impact-primary:focus {
    border-color : var(--impact-primary) !important;
}

textarea.focus-impact-primary:focus + i {
    border-color : var(--impact-primary) !important;
}

textarea.focus-impact-primary:focus + i + i {
    border-color : var(--impact-primary) !important;
}

textarea.hover-impact-secondary:hover {
    border-color : var(--impact-secondary) !important;
}

textarea.hover-impact-secondary:hover + i {
    border-color : var(--impact-secondary) !important;
}

textarea.hover-impact-secondary:hover + i + i {
    border-color : var(--impact-secondary) !important;
}

textarea.focus-impact-secondary:focus {
    border-color : var(--impact-secondary) !important;
}

textarea.focus-impact-secondary:focus + i {
    border-color : var(--impact-secondary) !important;
}

textarea.focus-impact-secondary:focus + i + i {
    border-color : var(--impact-secondary) !important;
}

textarea.hover-basic-black:hover {
    border-color : var(--basic-black) !important;
}

textarea.hover-basic-black:hover + i {
    border-color : var(--basic-black) !important;
}

textarea.hover-basic-black:hover + i + i {
    border-color : var(--basic-black) !important;
}

textarea.focus-basic-black:focus {
    border-color : var(--basic-black) !important;
}

textarea.focus-basic-black:focus + i {
    border-color : var(--basic-black) !important;
}

textarea.focus-basic-black:focus + i + i {
    border-color : var(--basic-black) !important;
}

textarea.hover-basic-black-medium:hover {
    border-color : var(--basic-black-medium) !important;
}

textarea.hover-basic-black-medium:hover + i {
    border-color : var(--basic-black-medium) !important;
}

textarea.hover-basic-black-medium:hover + i + i {
    border-color : var(--basic-black-medium) !important;
}

textarea.focus-basic-black-medium:focus {
    border-color : var(--basic-black-medium) !important;
}

textarea.focus-basic-black-medium:focus + i {
    border-color : var(--basic-black-medium) !important;
}

textarea.focus-basic-black-medium:focus + i + i {
    border-color : var(--basic-black-medium) !important;
}

textarea.hover-basic-gray-dark:hover {
    border-color : var(--basic-gray-dark) !important;
}

textarea.hover-basic-gray-dark:hover + i {
    border-color : var(--basic-gray-dark) !important;
}

textarea.hover-basic-gray-dark:hover + i + i {
    border-color : var(--basic-gray-dark) !important;
}

textarea.focus-basic-gray-dark:focus {
    border-color : var(--basic-gray-dark) !important;
}

textarea.focus-basic-gray-dark:focus + i {
    border-color : var(--basic-gray-dark) !important;
}

textarea.focus-basic-gray-dark:focus + i + i {
    border-color : var(--basic-gray-dark) !important;
}

textarea.hover-basic-gray-medium:hover {
    border-color : var(--basic-gray-medium) !important;
}

textarea.hover-basic-gray-medium:hover + i {
    border-color : var(--basic-gray-medium) !important;
}

textarea.hover-basic-gray-medium:hover + i + i {
    border-color : var(--basic-gray-medium) !important;
}

textarea.focus-basic-gray-medium:focus {
    border-color : var(--basic-gray-medium) !important;
}

textarea.focus-basic-gray-medium:focus + i {
    border-color : var(--basic-gray-medium) !important;
}

textarea.focus-basic-gray-medium:focus + i + i {
    border-color : var(--basic-gray-medium) !important;
}

textarea.hover-basic-gray-light:hover {
    border-color : var(--basic-gray-light) !important;
}

textarea.hover-basic-gray-light:hover + i {
    border-color : var(--basic-gray-light) !important;
}

textarea.hover-basic-gray-light:hover + i + i {
    border-color : var(--basic-gray-light) !important;
}

textarea.focus-basic-gray-light:focus {
    border-color : var(--basic-gray-light) !important;
}

textarea.focus-basic-gray-light:focus + i {
    border-color : var(--basic-gray-light) !important;
}

textarea.focus-basic-gray-light:focus + i + i {
    border-color : var(--basic-gray-light) !important;
}

textarea.hover-basic-gray-medium-light:hover {
    border-color : var(--basic-gray-medium-light) !important;
}

textarea.hover-basic-gray-medium-light:hover + i {
    border-color : var(--basic-gray-medium-light) !important;
}

textarea.hover-basic-gray-medium-light:hover + i + i {
    border-color : var(--basic-gray-medium-light) !important;
}

textarea.focus-basic-gray-medium-light:focus {
    border-color : var(--basic-gray-medium-light) !important;
}

textarea.focus-basic-gray-medium-light:focus + i {
    border-color : var(--basic-gray-medium-light) !important;
}

textarea.focus-basic-gray-medium-light:focus + i + i {
    border-color : var(--basic-gray-medium-light) !important;
}

textarea.hover-basic-gray-high-light:hover {
    border-color : var(--basic-gray-high-light) !important;
}

textarea.hover-basic-gray-high-light:hover + i {
    border-color : var(--basic-gray-high-light) !important;
}

textarea.hover-basic-gray-high-light:hover + i + i {
    border-color : var(--basic-gray-high-light) !important;
}

textarea.focus-basic-gray-high-light:focus {
    border-color : var(--basic-gray-high-light) !important;
}

textarea.focus-basic-gray-high-light:focus + i {
    border-color : var(--basic-gray-high-light) !important;
}

textarea.focus-basic-gray-high-light:focus + i + i {
    border-color : var(--basic-gray-high-light) !important;
}

textarea.hover-basic-white:hover {
    border-color : var(--basic-white) !important;
}

textarea.hover-basic-white:hover + i {
    border-color : var(--basic-white) !important;
}

textarea.hover-basic-white:hover + i + i {
    border-color : var(--basic-white) !important;
}

textarea.focus-basic-white:focus {
    border-color : var(--basic-white) !important;
}

textarea.focus-basic-white:focus + i {
    border-color : var(--basic-white) !important;
}

textarea.focus-basic-white:focus + i + i {
    border-color : var(--basic-white) !important;
}


textarea.textarea-xl {
    padding     : 20px 16px;
    font-size   : var(--font-20);
    line-height : var(--line-24);
}

textarea.textarea-lg {
    padding     : 16px;
    font-size   : var(--font-16);
    line-height : var(--line-20);
}

textarea.textarea-md {
    padding     : 12px;
    font-size   : var(--font-16);
    line-height : var(--line-20);
}

textarea.textarea-sm {
    padding     : 12px;
    font-size   : var(--font-14);
    line-height : var(--line-16);
}

/*반응형 CSS*/
@media (min-width : 576px) {
    textarea.textarea-sm {
        padding     : 12px;
        font-size   : var(--font-14);
        line-height : var(--line-16);
    }
}

@media (min-width : 768px) {
    textarea.textarea-md {
        padding     : 12px;
        font-size   : var(--font-16);
        line-height : var(--line-20);
    }
}

@media (min-width : 992px) {
    textarea.textarea-lg {
        padding     : 16px;
        font-size   : var(--font-16);
        line-height : var(--line-20);
    }
}

@media (min-width : 1200px) {
    textarea.textarea-xl {
        padding     : 20px 16px;
        font-size   : var(--font-20);
        line-height : var(--line-24);
    }
}