@charset "euc-kr";
#mvisImgWrap { position:relative; width:100%; background:rgba(255,255,255,1); overflow:hidden; }
.mainVisimg .elem { position:relative; height:100vh; background-repeat:no-repeat; background-size:cover; }
.mainVisimg .elem.visImg_1 { background-image:url(../images/m_vis_1.jpg); }
.mainVisimg .elem.visImg_2 { background-image:url(../images/m_vis_2.jpg); }
.mainVisimg .elem.visImg_3 { background-image:url(../images/m_vis_3.jpg); }
.mainVisimg .elem .visText { position:absolute; top:350px; left:50%; margin-left:-400px; color:#FFF; z-index:5; }
.mainVisimg .elem .visText .vmt { font-size:80px; background:linear-gradient(to right,#7EC1F4,#D8EEFF); -webkit-background-clip:text; -webkit-text-fill-color:transparent; font-weight:700; font-family:'Play', sans-serif; }
.mainVisimg .elem .visText .vst { font-size:24px; font-family:'GmarketSansLight'; margin:10px 0 30px; line-height:1.45; }
.ctrlArea { position:absolute; top:100px; color:#FFF; font-family:'Montserrat', sans-serif; }
.process_bar { position:relative; margin:0; background:rgba(255,255,255,0); width:100vw; height:1px; text-align:center; vertical-align:middle; text-indent:-9999px; overflow:hidden; }
.process_bar:before { content:''; position:absolute; top:0; left:0; height:100%; background:rgba(255,255,255,.2); -webkit-transition:5s ease-in-out; transition:5s ease-in-out; }
.process_bar.active::before { width:100%; -webkit-animation-duration:5s; animation-duration:5s; -webkit-animation-name:PROCBAR; animation-name:PROCBAR; -webkit-animation-fill-mode:both; animation-fill-mode:both; }
@-webkit-keyframes PROCBAR { 0% { width:0; } 100% { width:100%; } }
@keyframes PROCBAR { 0% { width:0; } 100% { width:100%; } }
.ctrlArea > p { position:absolute; top:495px; left:50%; margin-left:-408px; width:31px; height:31px; border-radius:100%; background:rgba(255,255,255,1); }
.ctrlArea > p > .playStop { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:9px; height:11px; background:url('../images/controlBtn_vert.png') no-repeat center -21px; text-indent:-9999px; overflow:hidden; padding:10px; border-radius:100%; -webkit-transition:.2s ease; -moz-transition:.2s ease; -o-transition:.2s ease; transition:.2s ease; }
.ctrlArea > p > .playStop.on { background:url('../images/controlBtn_vert.png') no-repeat center 10px; }
.ctrlArea > .pageWrap { position:absolute; top:500px; left:50%; margin-left:-370px; }
.ctrlArea > .pageWrap > em { font-size:14px; margin-left:10px; text-indent:-9999px; }
.ctrlArea > .pageWrap > strong.page_divi { font-size:12px; color:rgba(255,255,255,.5); }
.ctrlArea > .pageWrap > span { font-size:14px; color:rgba(255,255,255,.5); text-indent:-9999px; }
.scrollDown { position:absolute; left:50%; top:85vh; margin-left:-15px; width:33px; height:20px; z-index:9; -webkit-animation:scrollanim .8s ease-in-out .8s infinite normal; -moz-animation:scrollanim .8s ease-in-out .8s infinite normal; animation:scrollanim .8s ease-in-out .8s infinite normal; }
@keyframes scrollanim { 0%{ top:91vh; }50%{ top:90vh; }100%{ top:91vh; }}
@-webkit-keyframes scrollanim { 0%{ top:91vh; }50%{ top:90vh; }100%{ top:91vh; }}
.optbr { display:block; }
#mainCont { position:relative; width:100%; background:rgba(255,255,255,1); overflow:hidden; }
#noticeArea { position:relative; width:100%; background:#FFF; border-bottom:1px solid rgba(0,0,0,.1); z-index:89; }
#notice { position:relative; width:100%; max-width:1100px; margin:0 auto; border-left:1px solid rgba(0,0,0,.1); padding:70px 0 45px; }
#notice:hover > .notice_more a,
#notice > .notice_more a:focus { filter:alpha(opacity=1); -khtml-opacity:1; -moz-opacity:1; opacity:1; }
#arrow_bg { position:absolute; left:-1px; top:75px; border:10px solid transparent; border-left:10px solid rgba(255, 255, 255, 1); border-right:none; z-index:2; }
#arrow_bd { position:absolute; left:0; top:75px; border:10px solid transparent; border-left:10px solid rgba(0, 0, 0, .2); border-right:none; z-index:1; }
#notice > h3.notice_t { position:absolute; left:66px; font-size:24px; font-family:'GmarketSansBold'; color:#000; }
#notice > .notice_more { position:absolute; top:68px; left:279px; }
#notice > .notice_more a { display:block; width:34px; height:34px; line-height:34px; border-radius:100%; background:rgba(12,84,142,1); font-size:16px; color:#FFF; text-align:center; filter:alpha(opacity=0); -khtml-opacity:0; -moz-opacity:0; opacity:0; -webkit-transition:all .3s ease; -moz-transition:all .3s ease; -o-transition:all 0.3s ease; transition:all .3s ease; }
#notice > .notice_more a i { -webkit-transform:rotate(0deg); -ms-transform:rotate(0deg); transform:rotate(0deg); -webkit-transition:all .3s ease; -moz-transition:all .3s ease; transition:all .3s ease; }
#notice > .notice_more a:hover i,
#notice > .notice_more a:focus i { -webkit-transform:rotate(180deg); -ms-transform:rotate(180deg); transform:rotate(180deg); }
h3.recomm_mtitle { font-size:30px; color:#333; text-align:center; font-family:'GmarketSansBold'; margin-top:70px; }
.recomm_stitle { font-size:16px; color:#888; text-align:center; line-height:18px; margin-bottom:40px; }
#contArea { margin:0; padding:0; }
.contWrap { margin:0 auto; }
.contWrap:before, .contWrap:after, #elemArea:before, #elemArea:after { content:''; display:table; }
.contWrap:after, #elemArea:after { clear:both; }
#elemArea { margin:0 auto; }
#elemArea li { padding-right:3px; }
#elemArea li:last-child { padding-right:0; }
#elemArea li { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
#elemArea li:before, #elemArea li:after { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
#elem { position:relative; height:550px; overflow:hidden; }
#elem a.all_link { display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(255,255,255,0); text-indent:-99999px; z-index:99; }
#elem:hover .on_txtArea { opacity:1; filter:alpha(opacity=100); -moz-opacity:1; }
#elem.elem_1 { background:url('../images/elem_img1.jpg') center center no-repeat; -webkit-background-size:cover; background-size:cover; }
#elem.elem_2 { background:url('../images/elem_img2.jpg') center center no-repeat; -webkit-background-size:cover; background-size:cover; }
#elem.elem_3 { background:url('../images/elem_img3.jpg') center center no-repeat; -webkit-background-size:cover; background-size:cover; }
#elem .titleArea { position:absolute; bottom:0; left:0; width:100%; padding:20px 0; background:#111; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; transition:all .5s ease; }
#elem:hover .titleArea { bottom:-96px; }
#elem .titleArea .title_1 { font-size:20px; font-weight:400; text-align:center; }
#elem .titleArea .title_1 a { display:block; color:#FFF; }
#elem .titleArea .title_2 { font-size:14px; font-weight:400; text-align:center; }
#elem .titleArea .title_2 a { display:block; color:#AAA; }
#elem .on_txtArea { position:absolute; left:0; top:0; width:auto; height:100%; padding:40px 30px 0 30px; background:rgba(30, 50, 97, 0.9); -webkit-transition:all .5s ease; -moz-transition:all .5s ease; transition:all .5s ease; filter:alpha(opacity=0); -khtml-opacity:0; -moz-opacity:0; opacity:0; }
#elem .on_txtArea .imgArea { display:none; }
#elem .on_txtArea .imgArea img { max-width:100%; height:auto; }
#elem .on_txtArea .on_title_1 { font-size:20px; font-weight:400; color:#FFF; text-align:center; }
#elem .on_txtArea .on_title_2 { font-size:14px; font-weight:400; color:#AAA; text-align:center; }
#elem .on_txtArea .on_txt { padding:30px 0; margin:30px 0; font-size:15px; color:#FFF; border-top:1px solid rgba(255, 255, 255, 0.3); border-bottom:1px solid rgba(255, 255, 255, 0.3); text-align:justify; }
#elem .on_txtArea .picto { position:absolute; bottom:180px; left:50%; width:auto; margin-left:-19px; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; transition:all .5s ease; }
#elem .on_txtArea:hover .picto,
#elem .on_txtArea:focus .picto { bottom:110px; }
#elem .on_txtArea .picto a { display:block; width:36px; height:36px; line-height:36px; font-size:26px; color:#FFF; text-align:center; border:1px solid #FFF; -webkit-border-radius:50%; -moz-border-radius:50%; -o-border-radius:50%; border-radius:50%; -webkit-transition:all .5s ease; -moz-transition:all .5s ease; transition:all .5s ease; }
#elem .on_txtArea .picto a:hover,
#elem .on_txtArea .picto a:focus { background:#FFF; color:rgba(71, 97, 21, 1); }
.txtContInner { width:100%; background:rgba(255,255,255,0); padding:100px 0; }
.txtCont { position:relative; margin:0 auto; width:970px; }
.dynamicCont_title { font-size:34px; font-family:"GmarketSansMedium"; line-height:1.4; letter-spacing:-.6px; color:#111; }
.dynamicCont_title .accent { font-family:"GmarketSansBold"; color:#034D84; }
#botContWrap { float:left; width:100%; padding:150px 0; background:rgba(245,252,255,1); overflow:hidden; }
#botCont { position:relative; width:100%; max-width:1200px; height:auto; margin:0 auto; }
#botCont .aa { float:left; width:100%; max-width:600px; height:auto; }
#botCont .aa img { max-width:100%; height:auto; }
#botCont .bb { float:left; width:100%; max-width:300px; height:auto; background:#E8F7FF; }
#botCont .bb img { max-width:100%; height:auto; }
#botCont .cc { float:right; width:100%; max-width:300px; height:auto; overflow:hidden; }
#botCont .cc img { max-width:100%; height:auto; -webkit-transition:all .2s ease-out; transition:all .2s ease-out; -webkit-transform:scale(1); transform:scale(1); }
#botCont .cc:hover img { max-width:100%; height:auto; -webkit-transition:all .2s ease-out; transition:all .2s ease-out; -webkit-transform:scale(1.1); transform:scale(1.1); }
#botCont .dd { float:left; width:100%; max-width:300px; height:auto; overflow:hidden; }
#botCont .dd img { max-width:100%; height:auto; -webkit-transition:all .2s ease-out; transition:0.2s ease-out; -webkit-transform:scale(1); transform:scale(1); }
#botCont .dd:hover img { max-width:100%; height:auto; -webkit-transition:all .2s ease-out; transition:all .2s ease-out; -webkit-transform:scale(1.1); transform:scale(1.1); }
#botCont .ee { float:right; width:100%; max-width:300px; height:auto; background:#F60; }
#botCont .ee img { max-width:100%; height:auto; }
#nd-bdr { position:relative; padding:0; } 
#nd-bdr .nd-bdr { display:block; background:#9BD7F7; position:absolute; text-indent:-99999px; -webkit-transition:all 0.40s cubic-bezier(0.160, 0.87, 0.48, 1); transition:all 0.40s cubic-bezier(0.160, 0.87, 0.48, 1); }
#nd-bdr .nd-bdr_2 { display:block; background:#FFA96F; position:absolute; text-indent:-99999px; -webkit-transition:all 0.40s cubic-bezier(0.160, 0.87, 0.48, 1); transition:all 0.40s cubic-bezier(0.160, 0.87, 0.48, 1); }
#nd-bdr .ll { bottom:0; left:0; width:12px; height:0; } 
#nd-bdr .lt { top:0; left:0; width:0; height:12px; }
#nd-bdr .lr { top:0; right:0; width:12px; height:0; } 
#nd-bdr .lb { bottom:0; right:0; width:0; height:12px; }
#nd-bdr:hover .ll,
#nd-bdr:hover .lr { height:100% } 
#nd-bdr:hover .lt,
#nd-bdr:hover .lb { width:100% }
#boxBannerWrap { width:100%; margin:0 auto; padding:0; background:rgba(255,255,255,0); }
.boxBanner { width:100%; max-width:1200px; margin:0 auto; overflow:hidden; padding:130px 0 103px; }
.banLeft { float:left; width:calc(100% - 700px); }
.banLeft h3 { font-size:46px; color:#333; font-family:'GmarketSansBold'; letter-spacing:-.8px; }
.banLeft dl { margin-top:0; }
.banLeft dt { font-size:24px; font-family:'GmarketSansMedium'; }
.banLeft dd { font-size:15px; color:#888; font-family:'GmarketSansLight'; }
.banLeft a { display:block; width:200px; margin:30px 0 0; padding:13px 0; font-size:24px; color:#333; font-family:'Montserrat'; font-weight:600; text-align:center; border-top:1px solid #BBB; border-bottom:1px solid #BBB; -moz-transition:.3s ease; -webkit-transition:.3s ease; -o-transition:.3s ease; transition:.3s ease; -webkit-transform:rotateY(0deg); -moz-transform:rotateY(0deg); -o-transform:rotateY(0deg); transform:rotateY(0deg); }
.banLeft a:focus,
.banLeft a:hover { color:#FFF; background:#111; border-radius:46px; -webkit-transition:.3s all; -moz-transition:.3s all; -o-transition:.3s all; transition:.3s all; }
.banrightArea { float:right; }
.banrightArea li:nth-child(1) { float:left; width:224px; margin-right:-25px; }
.banrightArea li:nth-child(2) { float:left; width:224px; margin-right:-25px; }
.banrightArea li:nth-child(3) { float:left; width:224px; }
.circle_1_wrap div { overflow:hidden; }
.circle_1 { position:relative; float:right; display:table; width:224px; height:224px; text-align:center; }
.circle_1 > .cir { position:absolute; top:0; left:0; width:216px; height:216px; border-radius:50%; background:transparent; border:3px dotted #BBB; text-indent:-999px; overflow:hidden; -webkit-animation:18s linear infinite rotate; animation:18s linear infinite rotate; -webkit-transform-origin:50% 50%; transform-origin:50% 50%; }
.circle_1 dl { display:table-cell; vertical-align:middle; }
.circle_1 dt { display:none; }
.circle_1 dd { margin-top:5px; color:#222; font-size:20px; font-family:'Montserrat'; font-weight:600; }
.circle_2_wrap div { overflow:hidden; }
.circle_2 { position:relative; float:right; display:table; width:224px; height:224px; text-align:center; background:transparent; }
.circle_2 > .cir_2 { position:absolute; top:0; left:0; width:216px; height:216px; border-radius:50%; background:transparent; border:3px dotted #BBB; text-indent:-999px; overflow:hidden; -webkit-animation:18s linear infinite rotate; animation:18s linear infinite rotate; -webkit-transform-origin:50% 50%; transform-origin:50% 50%; }
.circle_2 dl { display:table-cell; vertical-align:middle; }
.circle_2 dd { display:none; }
.circle_3_wrap div { overflow:hidden; }
.circle_3 { position:relative; float:right; display:table; width:224px; height:224px; text-align:center; background:transparent; }
.circle_3 > .cir_3 { position:absolute; top:0; left:0; width:216px; height:216px; border-radius:50%; background:transparent; border:3px dotted #BBB; text-indent:-999px; overflow:hidden; -webkit-animation:18s linear infinite rotate; animation:18s linear infinite rotate; -webkit-transform-origin:50% 50%; transform-origin:50% 50%; }
.circle_3 dl { display:table-cell; vertical-align:middle; }
.circle_3 dt { display:none; }
.circle_3 dd { margin-top:5px; color:#222; font-size:20px; font-family:'Montserrat'; font-weight:600; }
@keyframes rotate { 0% { transform:rotate(0deg) } 100% { transform:rotate(360deg) } }
@-webkit-keyframes rotate { 0% { transform:rotate(0deg) } 100% { transform:rotate(360deg) } }
.nodepop { position:absolute; width:540px; height:100%; left:50%; top:270px; margin-left:-270px; z-index:9; }
#popWrapper { float:left; width:540px; }
#popWrapper .popImg { width:540px; height:100%; }
#popWrapper .popImg img { border-radius:12px 12px 0 0; }
#popWrapper .popFooter { position:relative; background:#000; height:38px; }	
#popWrapper .popFooter .to_cls { position:absolute; right:60px; line-height:38px; }
#popWrapper .popFooter .to_cls input { vertical-align:middle; margin-right:4px; }
#popWrapper .popFooter .to_cls label { color:#BBB; font-size:12px; cursor:pointer; }
#popWrapper .popFooter .cls { position:absolute; top:0; right:0; }