@charset "utf-8";




/* Main root */
html, body,
/* Document metadata */
base, head, link, meta, style, title,
/* Content sectioning */
address, article, aside, footer, h1, h2, h3, h4, h5, h6, header, hgroup, nav, section,
/* Text content */
blockquote, dd, div, dl, dt, figcaption, figure, hr, li, main, ol, p, pre, ul,
/* Inline text semantics */
a, abbr, b, bdi, bdo, br, cite, code, data, dfn, em, i, kbd, mark, q, rp, rt, rtc, ruby, s, samp, small, span, strong, sub, sup, time, u, var, wbr,
/* Image and multimedia */
area, audio, img, map, track, video,
/* Embedded content */
embed, object, param, source, iframe,
/* Scripting */
canvas, noscript, script,
/* Demarcating edits */
del, ins,
/* Table content */
caption, col, colgroup, table, tbody, td, tfoot, th, thead, tr,
/* Forms */
button, datalist, fieldset, form, input, label, legend, meter, optgroup, option, output, progress, select, textarea,
/* Interactive elements */
details, dialog, menu, menuitem, summary,
/* Web Components */
content, element, shadow, slot, template,
/* Obsolete and deprecated elements */
acronym, applet, basefont, big, blink, center, command, content, dir, element, font, frame, frameset, image, isindex, keygen, listing, marquee, multicol, nextid, noembed, plaintext, shadow, spacer, strike, tt, xmp
{margin:0; padding:0; outline:none; box-sizing:border-box;}



*::selection{background:#555/*#ba2727*/; color:#fff; font-weight:bold;}

.JS,
.JS *,
[class*="JS"],
[class*="JS"] *,
[class*=" JS-"],
[class^="JS-"] *,
[class*=" JS-"] *,
[class^="JS-"]{box-sizing:border-box;}

.hide{display:none !important;}
*[use="x"]{display:none !important;}

.cf{}
.cf:after{display:block; content:""; clear:both;}

.tablize{display:table; width:100%; font-size:0; line-height:0; letter-spacing:0;}
.tablize>*{display:inline-block; width:auto; font-size:14px; line-height:1.6; letter-spacing:-0.02em; vertical-align:top;}
.tablize>.tablize{font-size:0; line-height:0;}
.tablize>.tablize>*{font-size:13px; line-height:1.6;}
.split>*{position:relative;}
.split>* + *:after{display:block; position:absolute; top:50%; left:0; content:""; width:1px; height:5px; transform:translateY(-50%); background:rgba(0,0,0,0.2);}

.tablize.cellize>*{display:table-cell;}



@media all and (min-width:768px){

  .tablize>*{font-size:16px;}

}



.numb_font{font-family:'Oswald', 'Roboto', 'Nanum Barun Gothic', Nanum Barun Gothic, Verdana,Dotum,AppleGothic,맑은 고딕, malgun gothic, AppleGothicNeoSD, Apple SD 산돌고딕 Neo, Microsoft NeoGothic, Droid sans, sans-serif;}
.font_serif{font-family:'Noto Serif KR','Montserrat', 'Pretendard', Nanum Barun Gothic, Verdana,Dotum,AppleGothic,맑은 고딕, malgun gothic, AppleGothicNeoSD, Apple SD 산돌고딕 Neo, Microsoft NeoGothic, Droid sans, sans-serif;}



.displaynone { display:none !important; }
.align-right{text-align:right;}



/* tag reset */

html { width:100%; height:100%; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;}
head,style,script{display:none !important;}
body,code {font-family:'IBM Plex Sans KR', 'Pretendard', Nanum Barun Gothic, Verdana,Dotum,AppleGothic,맑은 고딕, malgun gothic, AppleGothicNeoSD, Apple SD 산돌고딕 Neo, Microsoft NeoGothic, Droid sans, sans-serif;
font-size:14px; line-height:1.6; letter-spacing:-0.02em; font-weight:normal; color:var(--c1); background:#fff;  -webkit-text-size-adjust:none;
}
body { min-width:320px; overflow-y:scroll; word-break:keep-all;}
body#popup { min-width:0; }
ul,ol,li,dd,dt,dl{ list-style:none; }
img,fieldset { border:none; vertical-align:middle; border:0;}
img{height:auto; max-width:100%;}
table { width:100%; border:0; border-spacing:0; border-collapse:collapse;}
caption { display:none; }
th,td { border:0; vertical-align:top; }
button {font-family:inherit;  overflow:visible; padding:0; margin:0; border:0; cursor:pointer; outline:none; background:transparent; color:#101010;}
textarea{resize:vertical; min-height:18px; outline:none;}
hr.layout { display:none; }
a { text-decoration:none; color:var(--c1);; }
a:hover{text-decoration:none;}
a:active { text-decoration:none;}
iframe:focus{outline:none;}
iframe[seamless]{display:block;}
.objHidden { visibility:hidden; position:absolute; left:-1000px; top:-1000px; height:0; width:0; }
#content_CONTAINER table, #bi_inquire_content_CONTAINER table { border:0; margin:0 0 -1px; }
#content_CONTAINER table:before, #bi_inquire_content_CONTAINER table:before { display:none; }
#content_CONTAINER td, #bi_inquire_content_CONTAINER td { width:auto !important; padding:0; }
table.nneditor-table { width:auto !important; }



@media all and (min-width:768px){
  body,code { font-size:16px;}
}


/* Form */
input,select,textarea {border-radius:5px; font-size:100%; color:#353535; font-family:inherit; vertical-align:middle; transition:border-color 0.1s;}
input[type=radio],
input[type=checkbox] { width:13px; height:13px; border:0; }
input[type=text],
input[type=password] { height:38px; line-height:40px; padding:2px 4px; border:1px solid #d5d5d5; color:#353535; font-size:14px; box-sizing:border-box;}
input[type=radio] + label, input[type=checkbox] + label { margin:0 4px 0 2px; }
input[type=text]:focus,
input[type=password]:focus{border-color:#101010;}
input[type=text][disabled],
input[type=password][disabled]{background:#eee;}
select { height:24px; border:1px solid #d5d5d5; }
select:focus{border-color:#101010;}
textarea { padding:5px 6px; border:1px solid #d5d5d5; line-height:1.5; font-family:inherit; box-sizing:border-box;}
textarea:focus{border-color:#101010;}
input:-ms-input-placeholder, textarea:-ms-input-placeholder { color:#c1c1c1; }
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color:#c1c1c1; }
input::-moz-placeholder, textarea::-moz-placeholder { color:#c1c1c1; opacity:1; }
legend { visibility:hidden; position:absolute; left:-9999px; top:-9999px; width:0; height:0; line-height:0; }




input[type="checkbox"],
input[type="radio"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  position: relative;  height: 20px;  width: 20px;  border:1px solid #ddd; transition: all 0.15s ease-out 0s;  background: #fff; box-shadow:none !important;
   outline:none !important;
    border-radius:3px;  color: #fdb232;  cursor: pointer;  display: inline-block;  margin-right: 5px;  z-index: 10;}

input[type="checkbox"]:active,
input[type="radio"]:active{ outline:none !important;}
input[type="checkbox"]:hover,
input[type="radio"]:hover {  border-color:#101010;}
input[type="checkbox"]:checked,
input[type="radio"]:checked {  outline:none !important; }
input[type="checkbox"]:checked::before{  height: 20px;  width: 20px;  position: absolute;  content: '✔';  display: inline-block;  font-size: 15px;  text-align: center;  line-height: 20px;}
input[type="radio"]:checked::before{  top:1px;  height: 20px;  width: 20px;  position: absolute;  content: '✔';  display: inline-block;  font-size: 11px;  text-align: center;  line-height: 20px;}

input[type="checkbox"]:checked::after,
input[type="radio"]:checked::after {
  -webkit-animation: click-wave 0.65s;
  -moz-animation: click-wave 0.65s;
  animation: click-wave 0.65s;
   content: '';  display: block;  position: relative;  z-index: 100;}
input[type="radio"]{  border-radius: 50%;}
input[type="radio"]:after {  border-radius: 50%;}

input[readonly][type="checkbox"],
input[readonly][type="radio"]{ pointer-events: none; }

input[readonly][type="checkbox"]:hover,
input[readonly][type="radio"]:hover{background:#eee;}

input[checked][readonly][type="checkbox"]:hover,
input[checked][readonly][type="radio"]:hover{background:#1e9cf1;}










.dimmed{position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.7); z-index:100;}
.dimmed.on{}



.back-bg{background-position:center; background-repeat:no-repeat; background-size:cover;}

.bg-attatch{clip: rect(0, auto, auto, 0); position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.bg-attatch .bg-img{position: fixed; display: block; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center center;}


::-webkit-scrollbar {background: #faf5ff; width: 16px;}
::-webkit-scrollbar-thumb {background: #4C4C4C; border-radius: 50px;border: 4px solid #faf5ff;}
::-webkit-scrollbar-thumb:hover {background: #B4B4B4;}

.liner a[href]>span{position:relative; display:inline-block; line-height:1;}
.liner a[href]>span:after{ content: ''; position: absolute; bottom: -3px; right: 0; height: 1px; width: 0; background:#000; transition: all 0.2s ease-in-out;}
.liner a[href]:hover>span:after {width: 100%; left: 0; right: auto; transition: all 0.2s ease-in-out;}

.liner.l-w a[href]>span:after{background:#fff;}








/* marquee */
.marquee .track span{animation-iteration-count:infinite; animation-timing-function:linear; visibility:hidden; opacity:0; transition:opacity 1s;}
.marquee.on .track span{animation-name:marquee; visibility:visible; opacity:1;}
.marquee .track span.upper{text-transform:uppercase;}

.marquee.small{line-height:50px;}
.marquee.small .track span{font-size:15px;}

.marquee.big{line-height:100px;}
.marquee.big .track span{font-size:40px;}



.marquee{line-height:inherit;}
.marquee .track {line-height:inherit; letter-spacing:0;}
.marquee .track .content{line-height:inherit; width:100%;	 display:flex;	 overflow:hidden;	 white-space:nowrap;	 -webkit-backface-visibility:hidden;	 -webkit-transform-style:preserve-3d;	 transform:translate3d(0, 0, 0);}
.marquee .track .content span{line-height:inherit;}


@media all and (min-width:768px){
  .marquee.big{line-height:200px;}
  .marquee.big .track span{font-size:100px;}
}




.grow-wrap {    display: inline-block;    overflow: hidden;    transition-timing-function: ease-in-out;}
.grow-wrap .img-grow {    transition-timing-function: ease-in-out;}

@keyframes marquee2{
    from {        transform: translateX(100%);    }

    to {        transform: translateX(-100%);    }
}

@keyframes marquee {
  100% {    transform: translateX(-100%); }
}


@keyframes marquee-v {
  100% {    transform: translateY(-100%); }
}



@-webkit-keyframes grow-1 {
    from {
        transform: translate3d(0,100%,0);
    }

    to {
        transform: translate3d(0,0,0);
    }
}

@keyframes grow-1 {
    from {
        transform: translate3d(0,100%,0);
    }

    to {
        transform: translate3d(0,0,0);
    }
}

.grow-1 {
    animation-name: grow-1;
}

@-webkit-keyframes grow-2 {
    from {
        transform: translate3d(0,-100%,0);
    }

    to {
        transform: translate3d(0,0,0);
    }
}

@keyframes grow-2 {
    from {
        transform: translate3d(0,-100%,0);
    }

    to {
        transform: translate3d(0,0,0);
    }
}

.grow-2 {
    animation-name: grow-2;
}





@-webkit-keyframes fadeIn {
  from {opacity: 0;}
  to {opacity: 1;}
}

@-ms-keyframes fadeIn {
  from {opacity: 0;}
  to {opacity: 1;}
}

@-moz-keyframes fadeIn {
  from {opacity: 0;}
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity: 1;}
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}









.vimeo-area{position:relative;}
.vimeo-area .video-btn{position:absolute; text-align:center; bottom:25px; right:25px; z-index:11;}
.vimeo-area .video-btn i{cursor:pointer; font-size:30px; color:#fff; background:rgba(0,0,0,0.8); line-height:30px; padding:5px; border-radius:5px; transition:0.2s;}
.vimeo-area .video-btn i:hover{}
.vimeo-area.muted .video-btn .vid-mute{display:none;}
.vimeo-area.unmuted .video-btn .vid-unmute{display:none;}
.vimeo-area .play-this{position:absolute; top:50%; left:50%; width:60px; height:60px; transform:translate(-50%, -50%); background-position:center; background-repeat:no-repeat; background-size:contain; cursor:pointer;
                        transition:0.2s;}
.vimeo-area .play-this:hover{opacity:0.7;}
.vimeo-area.hide-play-btn .play-this{}

















:root{





  --font_serif:'Noto Serif KR','Montserrat', 'Pretendard', Nanum Barun Gothic, Verdana,Dotum,AppleGothic,맑은 고딕, malgun gothic, AppleGothicNeoSD, Apple SD 산돌고딕 Neo, Microsoft NeoGothic, Droid sans, sans-serif;
  --c1:#333;
  --c2:#4e5c66;
  --c3:#6e808e;
  --c4:#b5c0c6;
  --c5:#e4ebf1;
  --c6:#eff2f9;
  --c7:#f2f5fa;





}




















/* button */
  [class*='btnNormal'], a[class*='btnNormal'],
  [class*='btnSubmit'], a[class*='btnSubmit'],
  [class*='btnEm'], a[class*='btnEm'],
  [class*='btnBasic'], a[class*='btnBasic'],
  [class*='btnLine'], a[class*='btnLine']{
    display:inline-block;
    box-sizing:border-box;
    padding:2px 8px;
    font-size:14px; line-height:20px;
    font-weight:normal; text-decoration:none; vertical-align:middle; word-spacing:-0.5px; letter-spacing:0; text-align:center; white-space:nowrap;
    transition:0.2s; cursor:pointer; border-radius:5px;
  }


  [class*='btnNormal'], a[class*='btnNormal'] { border:1px solid #d1d1d1;  color:#222; background-color:#fff; }
  [class*='btnSubmit'], a[class*='btnSubmit'] {border:1px solid transparent; color:#fff; background-color:var(--c1);}
  [class*='btnEm'], a[class*='btnEm'] {        border:1px solid transparent; color:#fff; background-color:#666;}
  [class*='btnBasic'], a[class*='btnBasic'] {  border:1px solid #eee; color:#222; background-color:#eee; }
  [class*='btnLine'], a[class*='btnLine']{     border:1px solid #323232; color:#323232; }
  [class*='btnLine'].reverse, a[class*='btnLine'].reverse{border-color:#fff; color:#fff;}


    [class*='btnNormal']:not(.disabled):hover {border-color:#999;}
    [class*='btnSubmit']:not(.disabled):hover { background-color:#656565; }
    [class*='btnEm']:not(.disabled):hover { background-color:#999; }
    [class*='btnBasic']:not(.disabled):hover { background-color:#e5e5e5; }
    [class*='btnLine']:not(.disabled):hover {border-color:#999;}
    [class*='btnNormal'].disabled { border-color:#e3e3e3; color:#999; }
    [class*='btnSubmit'].disabled { background-color:#9297a2; color:#f0f0f0; }
    [class*='btnEm'].disabled { background-color:#b5b6b9; color:#f0f0f0; }
    [class*='btnBasic'].disabled { color:#999; }
    [class*='btnLine'].disabled { border-color:#e3e3e3; color:#999; }
  /* size */
    [class*='btn'].sizeS { padding:6px 8px; }
    [class*='btn'].sizeM { padding:8px 16px; }
    [class*='btn'].sizeL { padding:14px 16px; min-width:80px; font-weight:bold; }
    [class*='btn'].size30{padding:14px 16px; width:30%;}
    [class*='btn'].size50{padding:14px 16px; width:50%;}
    [class*='btn'].size70{padding:14px 16px; width:70%;}
    [class*='btn'].size100{padding:14px 16px; width:100%;}

    [class*='btn'].br30 { border-radius:30px;}

    [class*='btn'].bold {font-weight:bold;}
    [class*='btn'].w100 {width:100%;}

  /* font */
    [class*='btn'].f13 {font-size:13px;}



  /* width Fix */
    [class*='btn'][class*='Fix'] { width:72px; word-break:keep-all; word-wrap:break-word; }
    [class*='btn'][class*='Fix'].sizeS { width:96px; }
    [class*='btn'][class*='Fix'].sizeM { width:120px; padding-left:8px; padding-right:8px; }
    [class*='btn'][class*='Fix'].sizeL { width:160px; padding-left:8px; padding-right:8px; }

/* icon button */
  a.btnLink { color:#222; }
  a.btnLink:hover { text-decoration:none; -webkit-box-shadow:0 1px 0 0 #222; -moz-box-shadow:0 1px 0 0 #222; box-shadow:0 1px 0 0 #222; }
  a.btnLink:after { content:""; display:inline-block; margin:-2px -2px 0 3px; vertical-align:middle; border:0 0 0 10px; border-style:solid;  border-color:transparent transparent transparent #666; }
  [class*='btn'] i { display:none \0/IE8; }
  [class*='btn'] .icoArrow { display:inline-block; width:3px; height:3px; margin:-2px 1px 0 1px; border:2px solid #666; border-width:0 2px 2px 0; vertical-align:middle;
    transform:rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform:rotate(-45deg); -ms-transform:rotate(-45deg); -o-transform:rotate(-45deg);
  }


  /* unique */
    .btnLogin, a.btnLogin { display:inline-block; box-sizing:border-box; width:100px; height:70px; line-height:70px; text-align:center;  font-size:12px; font-weight:bold; text-decoration:none; color:#fff; background-color:#101010; }
    .btnLogin:hover { background-color:#000; }
    .btnAgree, a.btnAgree { display:inline-block; box-sizing:border-box; width:80px; height:70px; line-height:70px; border:1px solid #d1d1d1; text-align:center;  font-size:12px; font-weight:bold; color:#222; text-decoration:none; background-color:#fff; }
    .btnAgree:hover { background-color:#f3f3f3; }
    .btnToggle { display:inline-block; font-size:0; line-height:0; }
    .btnToggle button { display:inline-block; box-sizing:border-box; border:1px solid #d1d1d1; margin:0 -1px 0 0; padding:0 7px; height:24px; line-height:24px; text-align:center;  font-size:12px; outline:0; text-decoration:none; color:#222; background:#fff; }
    .btnToggle button:first-child {}
    .btnToggle button:last-child { }
    .btnToggle button.selected { position:relative; border:1px solid #84868b; color:#fff; background:#84868b; }

/* ec-base-button */
.ec-base-button { padding:10px 0; text-align:center; }
.ec-base-button.justify { position:relative; }
.ec-base-button:after { display:block; content:""; clear:both; }
.ec-base-button.left {text-align:left; }
.ec-base-button.right {text-align:right; }
.ec-base-button.justify .gLeft { position:absolute; left:0; }
.ec-base-button.justify .gRight { position:absolute; right:0; }
.ec-base-button .text { margin:0 6px 0 10px; color:#353535; line-height:24px; }
  /* type */
    .ec-base-button.typeBorder { padding:10px 0; }
    .ec-base-button.typeBG { padding:20px 0;}
  /* gColumn */
    .ec-base-button[class*="gColumn"] { margin:0 auto; display:-webkit-flex; display:-moz-flex; display:-ms-flex; display:flex; -webkit-justify-content:center; -moz-justify-content:center; -ms-justify-content:center; justify-content:center; }
    .ec-base-button[class*="gColumn"]:after { display:none; }
    .ec-base-button[class*="gColumn"] [class*='btn'] { margin:0 2px; padding-left:8px; padding-right:8px; word-break:keep-all; word-wrap:break-word; white-space:normal; -webkit-flex:1; -moz-flex:1; -ms-flex:1; flex:1; display:-webkit-flex; display:-moz-flex; display:-ms-flex; display:flex; -webkit-align-items:center; -moz-align-items:center; -ms-align-items:center; align-items:center; -webkit-justify-content:center; -moz-justify-content:center; -ms-justify-content:center; justify-content:center; }
    .ec-base-button[class*="gColumn"] [class*='btn'][class*='Fix'] { -webkit-flex:none; -moz-flex:none; -ms-flex:none; flex:none; }
    /* gFlex */
      .ec-base-button[class*="gColumn"] .gFlex2 { -webkit-flex:2; -moz-flex:2; -ms-flex:2; flex:2; }
      .ec-base-button[class*="gColumn"] .gFlex3 { -webkit-flex:3; -moz-flex:3; -ms-flex:3; flex:3; }
      .ec-base-button[class*="gColumn"] .gFlex4 { -webkit-flex:4; -moz-flex:4; -ms-flex:4; flex:4; }













.btn_01{display:inline-block; padding:5px 10px; background:#111; color:#fff; border-radius:5px; transition:0.2s;}
.btn_01 i{position:relative; margin-left:10px; top:-1px; font-size:10px; line-height:inherit;}
.btn_01:hover{background:#101010;}

@media all and (min-width:768px){
  .btn_01{font-size:15px; padding:10px 20px; width:130px; display:flex; justify-content:space-between; align-items:center;}
  .btn_01 i{font-size:12px;}

}





.btn_go{display:inline-block; font-size:13px; font-weight:600;}
.btn_go i{margin-right:8px; position:relative; font-size:10px; width:17px; height:17px; line-height:17px; border:1px solid #111; text-align:center; border-radius:50%; vertical-align:middle; transition:0.3s;}
.btn_go:hover i{ }

.btn_go.fff{color:#fff;}
.btn_go.fff i{color:#fff; border-color:#fff;}

@media all and (min-width:768px){
  .btn_go{font-size:15px; }
  .btn_go i{position:relative; top:-1px; left:0; margin-right:15px; font-size:20px; width:28px; height:28px; line-height:28px; border-width:2px; transition:left 0.3s;}
  .btn_go:hover i{left:5px;}
}







.btnAct a{position:relative; overflow:hidden; display:inline-block; padding-left:15px; padding-right:40px; transition: color 0.45s cubic-bezier(0.785, 0.135, 0.15, 0.86), border 0.45s cubic-bezier(0.785, 0.135, 0.15, 0.86);}
.btnAct a:before{position: absolute;content: '';display: block;left: 0;top: 0;right: 0;bottom: 0;width: 100%;height: 100%;transform: scale(1, 1);transform-origin: left center;z-index:1;transition:transform 0.45s cubic-bezier(0.785, 0.135, 0.15, 0.86);}
.btnAct a span{position:relative; z-index:11;}
.btnAct a i{position:absolute; top:50%; right:15px;  transform:translateY(-50%); font-size:10px; z-index:11;}

.btnAct.w100 a{width:100%; max-width:100%;}
.btnAct.w100 a i{position:static; transform:none; margin-left:20px;}



/* brown line to */
.btnAct.c1-fill a{color:#fff; border: 1px solid var(--c1); background:var(--c1);}
.btnAct.c1-fill a:hover{color:#fff; border-color:var(--c2); }
.btnAct.c1-fill a:before{background-color:var(--c2);transform-origin: right center;transform: scale(0, 1); }
.btnAct.c1-fill a:hover::before{transform-origin: left center;transform: scale(1, 1); }


/* brown line to */
.btnAct.c1-line a{color:var(--c1); border: 1px solid var(--c1); background:#fff;}
.btnAct.c1-line a:hover{color:#fff; border-color:var(--c1)}
.btnAct.c1-line a:before{background-color:var(--c1); transform-origin: right center;transform: scale(0, 1); }
.btnAct.c1-line a:hover::before{transform-origin: left center;transform: scale(1, 1); }




@media all and (min-width:768px){

  .btnAct a{ padding-left:30px; padding-right:65px;}
  .btnAct a i{right:20px; font-size:13px; }


}



























/**/




























/**/