/* root */
:root {
    /* color */
    /* option : white / black / main */
    --color-white-fff: #fff;
    --color-white-eee: #eee;
    --color-white-ccc: #ccc;
    --color-white-ddd: #ddd;
    --color-term-bg: #fbfaff;
    --color-crm-bg: #f5f5f5;

    --color-black-999: #999;
    --color-black-666: #666;
    --color-black-555: #555;
    --color-black-444: #444;
    --color-black-222: #222;
    
    --color-main-light: #e0ceff;
    --color-main-middle: #8266d3;
    --color-main-original: #743cf7;
    --color-main-deep: #4e3185;
    --color-main-dark: #3e1f8d;
    --color-main-pink: #ff799b;

    /* space (px to vw)*/
    /* margin / padding / position / gap */
    --space-m128: -128px;
    --space-m60: -60px;
    --space-m39: -39px;
    --space-m30: -30px;
    --space-m15: -15px;
    --space-1: 1px;
    --space-2: 2px;
    --space-3: 3px;
    --space-4: 4px;
    --space-5: 5px;
    --space-6: 6px;
    --space-7: 7px;
    --space-9: 9px;
    --space-10: 10px;
    --space-11: 11px;
    --space-12: 12px;
    --space-13: 13px;
    --space-14: 14px;
    --space-15: 15px;
    --space-20: 20px;
    --space-21: 21px;
    --space-24: 24px;
    --space-25: 25px;
    --space-30: 30px;
    --space-32: 32px;
    --space-35: 35px;
    --space-37: 37px;
    --space-40: 40px;
    --space-44: 44px;
    --space-45: 45px;
    --space-49: 49px;
    --space-50: 50px;
    --space-60: 60px;
    --space-63: 63px;
    --space-65: 65px;
    --space-70: 70px;
    --space-72: 72px;
    --space-77: 77px;
    --space-78: 78px;
    --space-80: 80px;
    --space-90: 90px;
    --space-95: 95px;
    --space-110: 110px;
    --space-120: 120px;
    --space-125: 125px;
    --space-130: 130px;
    --space-140: 140px;
    --space-150: 150px;
    --space-155: 155px;
    --space-160: 160px;
    --space-180: 180px;
    --space-183: 183px;
    --space-200: 200px;
    --space-225: 225px;
    --space-260: 260px;
    --space-285: 285px;
    --space-322: 322px;
    --space-325: 325px;
    --space-315: 315px;
    --space-350: 350px;
    --space-360: 360px;
    --space-485: 485px;
    --space-1008: 1008px;

    /* size (px to vw) */
    /* width / height / border-radius / font-size */
    --size-1: 1px;
    --size-2: 2px;
    --size-5: 5px;
    --size-7: 7px;
    --size-10: 10px;
    --size-12: 12px;
    --size-13: 13px;
    --size-14: 14px;
    --size-15: 15px;
    --size-16: 16px;
    --size-18: 18px;
    --size-20: 20px;
    --size-21: 21px;
    --size-25: 25px;
    --size-26: 26px;
    --size-27: 27px;
    --size-30: 30px;
    --size-35: 35px;
    --size-40: 40px;
    --size-42: 42px;
    --size-45: 45px;
    --size-50: 50px;
    --size-55: 55px;
    --size-70: 70px;
    --size-75: 75px;
    --size-85: 85px;
    --size-100: 100px;
    --size-115: 115px;
    --size-124: 124px;
    --size-188: 188px;
    --size-190: 190px;
    --size-195: 195px;
    --size-408: 408px;
    --size-415: 415px;
    --size-490: 490px;
    --size-518: 518px;
    --size-550: 550px;
    --size-570: 570px;
    --size-720: 720px;
    --size-770: 770px;
    --size-755: 755px;
    --size-850: 850px;
    --size-900: 900px;
    --size-944: 944px;
    --size-996: 996px;
    --size-1024: 1024px;
    --size-1152: 1152px;
    --size-1200: 1200px;
    --size-1220: 1220px;
    --size-1439: 1439px;
    --size-1527: 1527px;
    --size-1920: 1920px;

    /* size (px to rem) */
    /* font-size */
    --font-12: 0.75rem;
    --font-14: 0.875rem;
    --font-16: 1rem;
    --font-17: 1.063rem;
    --font-20: 1.25rem;
    --font-22: 1.375rem;
    --font-25: 1.563rem;
    --font-30: 1.875rem;
    --font-35: 2.188rem;
    --font-40: 2.5rem;
    --font-45: 2.813rem;
    --font-50: 3.125rem;

    /* transition */
    --animation-2: 0.2s ease-in-out;
    --animation-3: 0.3s ease-in-out;


    /* Mobile */
    /* space */
    --m-space-m1: -1rem;
    --m-space-4: 4rem;
    --m-space-5: 5rem;
    --m-space-8: 8rem;
    --m-space-10: 10rem;
    --m-space-13: 13rem;
    --m-space-14: 14rem;
    --m-space-16: 16rem;
    --m-space-20: 20rem;
    --m-space-22: 22rem;
    --m-space-24: 24rem;
    --m-space-25: 25rem;
    --m-space-28: 28rem;
    --m-space-30: 30rem;
    --m-space-36: 36rem;
    --m-space-40: 40rem;
    --m-space-44: 44rem;
    --m-space-48: 48rem;
    --m-space-50: 50rem;
    --m-space-55: 55rem;
    --m-space-57: 57rem;
    --m-space-60: 60rem;
    --m-space-70: 70rem;
    --m-space-74: 74rem;
    --m-space-80: 80rem;
    --m-space-87: 87rem;
    --m-space-90: 90rem;
    --m-space-100: 100rem;
    --m-space-110: 110rem;
    --m-space-140: 140rem;
    --m-space-200: 200rem;
    --m-space-250: 250rem;
    --m-space-260: 260rem;
    
    /* size */
    --m-size-m84: -84rem;
    --m-size-2: 2rem;
    --m-size-4: 4rem;
    --m-size-10: 10rem;
    --m-size-20: 20rem;
    --m-size-24: 24rem;
    --m-size-26: 26rem;
    --m-size-30: 30rem;
    --m-size-34: 34rem;
    --m-size-35: 35rem;
    --m-size-40: 40rem;
    --m-size-42: 42rem;
    --m-size-50: 50rem;
    --m-size-55: 55rem;
    --m-size-70: 70rem;
    --m-size-59: 59rem;
    --m-size-82: 82rem;
    --m-size-95: 95rem;
    --m-size-100: 100rem;
    --m-size-140: 140rem;
    --m-size-112: 112rem;
    --m-size-135: 135rem;
    --m-size-165: 165rem;
    --m-size-198: 198rem;
    --m-size-280: 280rem;
    --m-size-310: 310rem;
    --m-size-668: 668rem;
    
    /* font */
    --m-font-14: 14rem;
    --m-font-20: 20rem;
    --m-font-22: 22rem;
    --m-font-24: 24rem;
    --m-font-26: 26rem;
    --m-font-28: 28rem;
    --m-font-30: 30rem;
    --m-font-36: 36rem;
    --m-font-50: 50rem;
    --m-font-55: 55rem;
    --m-font-60: 60rem;

}


/* common area */

.font-color1{
    color:#777;
}

.dd-margin-top {
    display: inline-block;
    margin-top: 5px;
}

.dd-margin-bottom {
    display: inline-block;
    margin-bottom: 7px;
}

.line-height {
    line-height: 1.3;
}

* {
    box-sizing: border-box;
    word-break: keep-all;
}

html {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
}

body {
    -webkit-touch-callout: none;
    margin: 0;
    width: 100%;
    font-size: 16px;
    font-family: "Montserrat", "Noto Sans KR", "Malgun Gothic", "맑은 고딕", "Apple SD Gothic Neo", Arial, Sans-serif, serif;
}

h1, h2, h3, h4, h5, h6, p, span {
    line-height: 1;
    margin: 0;
    padding: 0;
}

button {
    padding: 0;
    border: 0;
    background-color: inherit;
    font-family: "Montserrat", "Noto Sans KR", "Malgun Gothic", "맑은 고딕", "Apple SD Gothic Neo", Arial, Sans-serif, serif;
}

input {
    font-family: "Montserrat", "Noto Sans KR", "Malgun Gothic", "맑은 고딕", "Apple SD Gothic Neo", Arial, Sans-serif, serif;
}

dl, dt, dd, ol, ul, li {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    line-height: 1;
    vertical-align: baseline;
    list-style: none;
}

a, a:hover, a:active, a:visited {
    color: inherit;
    text-decoration: unset;
}

pre {
    font-family: "Montserrat", "Noto Sans KR", "Malgun Gothic", "맑은 고딕", "Apple SD Gothic Neo", Arial, Sans-serif, serif;
    font-size: 0.9rem;
    white-space: pre-wrap;
    line-height: 1.8rem;
    background: #333;
    margin: 0;
    border-radius: 20px;
    padding: 20px;
    color: #fff;
}

.img-rendering {
    image-rendering: -webkit-optimize-contrast;
}

.special-color {
    color: #0a87f5;
}

.bold {
    font-weight: 500;
}

.bolder {
    font-weight: 600;
}