@import url('https://fonts.googleapis.com/css?family=Jua:400');
@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic:400,700,800');

/*한글 범위:  U+AC00-D7A3*/
/*영어 대문자 범위 :  U+0041-005A*/
/*영어 소문자 범위 :   U+0061-007A*/
/*숫자 범위 : U+0030-0039*/
/*특수 문자: U+0020-002F, U+003A-0040, U+005B-0060, U+007B-007E*/



/* ------------------------------------------------------------------------------------------------
Core:General style
-------------------------------------------------------------------------------------------------*/
:root{
    --fontNanum:'Nanum Gothic', sans-serif;
    --fontjua:'jua', sans-serif;
    --mainTxt:#c4c4c4;  /* c4c4c4 *//* 212121 */
    --mainBg:#212121;  /* 212121 *//* f9f9f9 */
    --mainScroll:#ffbd1b; /* a181f8 *//* ffbd1b */
    --subBg:#f9f9f9;  /* 212121 *//* f9f9f9 */


    --bgTxt:#fff;
    --aTxt:#c4c4c4;      /* c4c4c4 *//* 212121 */
    --activeTxt:#ffbd1b; /* ffbd1b *//* a181f8 */
    --navTxt:#212121;
    --activeNavTxt:#fff;
    --contentBg:#efefef; /* efefef *//* fff */
    --tabTxt:#c4c4c4;      /* c4c4c4 *//* 212121 */
    --activeTabTxt:#fff;
    --accordionTxt:#c4c4c4;      /* c4c4c4 *//* 212121 */
    --activeAccordionTxt:#fff;
    --listTxt:#c4c4c4;      /* c4c4c4 *//* 212121 */
    --listActiveTxt:#ffbd1b; /* ffbd1b *//* a181f8 */

    --bgAtlas:#a181f8; /* Atlas */
    --bgDefault:#dbdbdb; /* Default */
    --bgPrimary:#3457d5; /* Byzantine Blue */
    --bgSuccess:#138808; /*India Green */
    --bgWarning:#FEBE10; /* Real Madrid Gold */
    --bgDanger:#BA0021; /* Angels Red */
    --bgInfo:#00BFFF; /* Capri */
}
* { box-sizing: border-box; }
::-webkit-scrollbar { width: 2px; }
::-webkit-scrollbar-track { box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.25); }
::-webkit-scrollbar-thumb { background:var(--mainScroll); border-radius: 1px; }

html, body { font-family:var(--fontjua), sans-serif; width:100%; background:var(--mainBg); font-size:10px !important; color:var(--mainTxt); -webkit-font-smoothing:antialiased;  overflow-x:hidden; word-wrap:break-word; word-break:keep-all; }

.wrapper { margin:0 0; padding:0; /* transition:all 0.5s ease-in; -webkit-transition:all 0.5s ease-in; -moz-transition:all 0.5s ease-in; -o-transition:all 0.5s ease-in; */ }
.wrapper:before, .wrapper:after { display:table; content:" "; }
.wrapper:after { clear:both; }

section { position:relative; margin:0 0; padding:3rem 0; background:#f9f9f9; overflow:hidden; }
article { position:relative; margin:0; padding:0 0; }

.container { position:relative; width:1180px; padding:0 1rem; margin:0 auto; }

@media screen and (max-width:1200px) {
    .container { position: relative; width: 100%; padding: 0 1rem; margin: 0 auto; }
}

a { text-decoration: none; color:var(--aTxt); }
a:hover, a:active, a:focus { outline:none; text-decoration:none; color:var(--activeTxt); }

h1 { font-size:3.0rem; }
h2 { font-size:2.4rem; }
h3 { font-size:1.8rem; }
h4 { font-size:1.6rem; }
h5 { font-size:1.2rem; }
h6 { font-size:1.0rem; }
h1, h2, h3, h4, h5, h6 { margin:0; font-weight:400; }

.ellipsis { width:100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.img-responsive { width:100% !important; }

@media screen and (max-width:1200px){
    html, body { font-size:9px !important; }
}
@media screen and (max-width:993px){
    html, body { font-size:8px !important; }
}
@media screen and (max-width:768px){
    html, body { font-size:9px !important; }
}
@media screen and (max-width:414px){
    html, body { font-size:8px !important; }
}