@charset "UTF-8";

/* browser reset */
* {margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline;}
*, :after, :before {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
body {word-wrap: break-word; word-break: keep-all; -webkit-text-size-adjust: none;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
ul,li,ol,dl,dt,dd {list-style:none;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
table {border-collapse: collapse; border-spacing: 0;}
img, video {vertical-align: top; border:0;}
button {background: none; outline: none; border: none; cursor: pointer; background-color: transparent; border-radius: 0px;}
label {cursor: pointer; vertical-align: middle;}
input, select, textarea, button {font: inherit; color: inherit; vertical-align: middle; -webkit-border-radius:0;} /* -webkit-appearance:none; */
input:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px #f6f8f9 inset !important;} /*Å©·Ò¿¡¼­ ÀÚµ¿¿Ï¼ºµÈ inputÀÇ ³ë¶õ»öÀ» »èÁ¦*/
textarea {resize: none;}
div, article { box-sizing:border-box; }
a, a:hover, a:focus {color: inherit; text-decoration: none;}
p { letter-spacing:-1px; }
section { display:block; clear:both; }
i, em, address {font-style: normal; font-weight: normal;}
label img {pointer-events: none;} /* label Ŭ¸¯ºÒ°¡ ÇØ°á*/
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}/*number ui »èÁ¦*/

* { font-family: 'Spoqa Han Sans', 'sans-serif'; }

/* °øÅë css ½ÃÀÛ */
html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
	overflow-x:hidden;
}

#wrap { width:1920px; height:auto; overflow:hidden; padding:0; margin:0 auto; }

.visual_center { position:absolute; left:50%; top:42%; transform:translate(-50%, -42%); width:500px; height:500px; background:rgba(255, 255, 255, 0.94); border-radius:100%; text-align:center; padding:54px; overflow:hidden; }
.visual_center p { letter-spacing:-2px; }
.visual_center .main_txt { font-size:45px; color:#ff2c2c; line-height:56px; font-weight:600; margin-top:20px; }
.visual_center .sub_txt { font-size:32px; color:#343434; line-height:40px; font-weight:300; }

.app_down { position:absolute; width:366px; height:154px; right:0; bottom:60px; background:#fff; border-radius:100px 0 0 100px; z-index:300;
-webkit-box-shadow: 0px 0px 20px 4px rgba(0,0,0,0.06); 
box-shadow: 0px 0px 20px 4px rgba(0,0,0,0.06);
}

.header { position:fixed; left:0; top:0; width:100%; min-width:1600px; height:84px; z-index:200; 
-webkit-box-shadow: 0px 0px 20px 4px rgba(0, 0, 0, ,0.1); 
box-shadow: 0px 0px 20px 4px rgba(0 ,0, 0, 0.1);
background:rgba(255, 255, 255,0.9);
}
.header .header_inner { width:1600px; margin:0 auto; }
.header .header_inner .logo_area { float:left; padding:22px 0; }

.header .gnb_menu { float:right;  }
.header .gnb_menu li { color:#ababab; display:block; float:left; padding:27px 0; font-weight:700; margin-right:60px; }
.header .gnb_menu li.on { color:#ff5f2c; border-bottom:3px solid #ff5f2c; }
.header .gnb_menu li a { padding:34px 0; font-size:18px; }

.header_height { display:block; width:100%; height:84px; clear:both; }

#visual-wrap { position:relative; width:100%; height:100vh; overflow:hidden; background-size:cover; background:url('../../img/main_visual01.png') 0 0 no-repeat; }
#visual-wrap .arrow-down { position: absolute; left:50%; bottom:40px; display:block; width:30px; z-index:200; 
animation:animatedarrow 2s infinite; }
@keyframes animatedarrow {
0%{transform:translateY(4px);}
50%{transform:translateY(-14px);}
100%{transform:translateY(4px);}
}

#intro-cont { position:relative; width:100%; height:auto; min-height:900px; background:#f9f9f9; }
#intro-cont .cont_inner { width:1280px; margin:0 auto; }

#intro-cont .section_title { padding-top:180px; }
#intro-cont .section_title .title_line { display:block; width:80px; height:10px; background:#ff5f2c; }
#intro-cont .section_title .main_txt { font-family:'KoPubWorldDotum', sans-serif; font-size:60px; font-weight:700; line-height:70px; margin-top:54px; letter-spacing:-3px; }
#intro-cont .section_title .sub_txt { font-size:34px; font-weight:300; line-height:44px; color:#686868; margin-top:60px; }
#intro-cont .section_title .tag_group { width:640px; height:auto; margin-top:60px; }
#intro-cont .section_title .tag_group li { font-size:20px; display:block; float:left; padding:8px 16px; border:1px solid #ebebeb; background:#fff; color:#828282; font-weight:300; border-radius:30px; margin:10px 22px 10px 0; }

#intro-cont .app_mockup { position:absolute; bottom:0; right:338px; }

#advantage { width:100%; height:auto; height:1408px; background:url('../../img/bg_advantage.png') 0 0 no-repeat; }
#advantage .main_title { font-size:62px; color:#351c1f; line-height:76px; padding-top:200px; text-align:center; letter-spacing:-2px; font-weight:600; }
#advantage span.impact { color:#ce0014 !important; }

#advantage ul.advantage_group { width:1500px; margin:100px auto 0 auto; }
#advantage ul.advantage_group li { display:inline-block; margin:0 90px; text-align:center; }
#advantage ul.advantage_group li .group_txt_bold { font-size:40px; color:#3f2200; line-height:54px; font-weight:600; padding-top:60px; }
#advantage ul.advantage_group li .group_txt_small { font-size:30px; color:#3f2200; line-height:40px; font-weight:300; padding-top:40px; }

#tip { position:relative; width:100%; height:auto; }
#tip .tip_arrow { width:100%; height:278px; text-align:center; background:url('../../img/tip_topbg.png') 0 0 no-repeat; }
#tip .tip_arrow .arrow_btn { position:absolute; top:0; left:50%; transform:translate(-50%, 0); width:174px; height:174px; text-align:center; margin:0 auto; z-index:400; }
#tip .tip_arrow .arrow_btn a { display:block; }
#tip .tip_inner { position:absolute; left:0; top:90px; width:100%; height:710px; background:url('../../img/tip_bg.png') 0 0 no-repeat; }
#tip .tip_inner ul.tip_group { text-align:center; height:auto; padding-top:100px; margin:0 auto; }
#tip .tip_inner ul.tip_group li { display:inline-block; margin:0 200px; }
#tip .tip_inner p.tip_txt { font-size:26px; color:#fff; line-height:36px; font-weight:300; }

#app_downpage { width:100%; height:780px; text-align:center; padding:160px 0; margin-top:522px; }
#app_downpage .app_icon { width:219px; height:219px; margin:0 auto; }
#app_downpage p.down_txt { font-size:34px; font-weight:600; color:#000; margin:50px auto; }
#app_downpage ul.download_group { width:100%; text-align:center; }
#app_downpage ul.download_group li { display:inline-block; margin:0 30px; }

#footer { width:100%; height:auto; min-height:200px; background:#424242; }
#footer .footer_inner { width:980px; height:auto; min-height:200px; padding:40px 0; margin:0 auto; overflow:hidden; }

#footer .logo_area { float:left; width:310px; height:126px; padding-top:20px; border-right:1px solid #202020; }
#footer .logo_area p.logo_txt { font-size:20px; color:#fff; margin-top:24px; font-weight:300; }

#footer .text_area { float:left; height:126px; padding-left:80px; color:#fff; border-left:1px solid #5d5d5d; }
#footer .text_area p.intro {font-size:20px; }
#footer .text_area p.company_info { font-size:18px; font-weight:300; line-height:26px; padding-top:20px; }
#footer .text_area p.company_info a.email { display:inline-block; text-decoration:underline; }

#qr_down { width:900px; height:488px; border-radius:30px; background:#fff;
-webkit-box-shadow: 0px 0px 20px 4px rgba(0,0,0,0.06); 
box-shadow: 0px 0px 20px 4px rgba(0,0,0,0.06);
z-index:90; }
#qr_down .title_area { width:100%; font-weight:700; font-size:34px; padding:30px 0; text-align:center; }
#qr_down .cont_area { width:100%; padding:0 46px 40px 46px; } 

/* ·¹À̾î Æ˾÷ */
.pop-layer .pop-container { padding:20px 24px; }
.pop-layer p.ctxt { color:#666; line-height:24px; }
.pop-layer .btn-r { width:100%; margin:10px 0 20px; padding-top:10px; text-align: right; }
.pop-layer { display:none; position: absolute; top:50%; left:50%; width: auto; height: auto; z-index:300; }

.dim-layer { display:none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; }
.dim-layer .dimBg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: .5; filter: alpha(opacity=50); }
.dim-layer .pop-layer { display: block; }

a.btn-layerClose { position:absolute; right:60px; top:48px; border:0; }
a.btn-layerClose:hover { }