@charset "euc-kr";

/*intro*/
#intro { width:100%; height:100vh; overflow:hidden; }
#intro .video_wrap { position:relative; }
#intro .video { height:100vh; position:relative; }

.intro_txt { position:absolute; top:0; left:0; z-index:1; text-align:center; text-align:center; width:100%; height:100vh; display:table; margin-top:-40px; }
.intro_txt > div { display:table-cell; vertical-align:middle; }
.intro_txt .skip { display:block; margin-top:15px; }
.intro_txt .skip a { color:#fff; display:inline-block; font-weight:500; font-size:16px; letter-spacing:0; padding:10px 0; padding-left:40px; border:3px solid #fff; background:rgba(0, 0, 0, 0.4); -webkit-transition:all 0.3s ease-in-out;  -moz-transition:all 0.3s ease-in-out;  -o-transition:all 0.3s ease-in-out;  transition:all 0.3s ease-in-out; }
.intro_txt .skip a:after { display:inline-block; width:8px; height:14px; background:url(../images/main/skip.png) 0 0 no-repeat; content:''; margin-left:20px; margin-right:40px; }
.intro_txt .skip a:hover { /*background:rgba(121, 7, 74, 1);*/ background:#d4074a; }
/*intro*/

#main_mobile { display:none; }
#main { background:#eaeaea; }

#main .main_bg { position:relative; z-index:0; width:100%; height:728px; overflow:hidden; text-align:center; background:#000; }
#main .main_bg .bxslider { }


#main .main_sec01 { display:none; }

#main .slogan { position:absolute; top:-250px; left:0; z-index:1; width:475px; height:220px; background:url(../images/eng/main/slogan.png) 0 0 no-repeat; text-indent:-99999px; }

#main .min_btn { position:absolute; top:0; right:-77px; }
#main .min_btn ul li { display:block; /*width:70px; height:70px; text-indent:-99999px;*/ margin-top:6px; }
#main .min_btn ul li a { display:block; width:100%; height:100%; }
#main .min_btn ul li.min_1 { margin-top:0; }
#main .min_btn ul li.space { display:none; }


#main .main_sec02 { width:1200px; margin:0 auto; height:326px; z-index:1; position:relative; margin-top:-163px; padding-bottom:100px; }
#main .main_sec02 > ul { }
#main .main_sec02 > ul > li { width:222px; height:324px; border:1px solid #868687; background:#120907; float:left; overflow:hidden; margin-left:20px; text-align:center; box-shadow:0 0 3px #808181; position:relative; }
#main .main_sec02 > ul > li:first-child { margin-left:0; }
#main .main_sec02 > ul > li p { color:#fff; font-size:13px; font-weight:300; letter-spacing:-1px; position:relative; z-index:1; }
#main .main_sec02 > ul > li p strong { color:#fff; font-size:26px; font-weight:500; text-shadow:0px 0px 8px #000; }
#main .main_sec02 > ul > li p.alt { padding-top:26px; text-align:center; }
#main .main_sec02 > ul > li p.alt2 { padding-bottom:10px; padding-top:18px; }
#main .main_sec02 > ul > li p.alt3 {  }

#main .main_sec02 > ul > li.main_bn3 span { display:inline-block; background:#ff7300; padding:1px 7px; border-radius:10px; margin-right:3px; }
#main .main_sec02 > ul > li a { display:block; width:100%; height:100%; }

#main .main_sec02 > ul > li.main_bn0 { background:url(../images/main/main_bnn0.jpg) 50% 50% no-repeat; background-size:225px; }
#main .main_sec02 > ul > li.main_bn1 { background:url(../images/main/main_bnn1.jpg) 50% 50% no-repeat; background-size:225px; }
#main .main_sec02 > ul > li.main_bn2 { background:url(../images/main/main_bnn2.jpg) 50% 50% no-repeat; background-size:225px; }
#main .main_sec02 > ul > li.main_bn3 { background:url(../images/main/main_bnn3.jpg) 50% 50% no-repeat; background-size:225px; }
#main .main_sec02 > ul > li.main_bn4 { background:url(../images/main/main_bnn4.jpg) 50% 50% no-repeat; background-size:225px; }
#main .main_sec02 > ul > li.main_bn5 { background:url(../images/main/main_bn5.jpg) 50% 50% no-repeat; position:relative; }
#main .main_sec02 > ul > li.main_bn5.alt { background:url(../images/main/main_bn6.jpg) 0 0 no-repeat; }

#main .main_sec02 > ul > li.main_bn5 .sns_ctrl { position:absolute; top:0; left:0; width:100%; margin-top:19px; }
#main .main_sec02 > ul > li.main_bn5 .sns_ctrl ul { }
#main .main_sec02 > ul > li.main_bn5 .sns_ctrl ul li { width:24px; height:24px; display:inline-block; margin-left:5px; }
#main .main_sec02 > ul > li.main_bn5 .sns_ctrl ul li:first-child { margin-left:0; }
#main .main_sec02 > ul > li.main_bn5 .sns_ctrl ul:after { width:90px; height:1px; content:''; display:block; background:#fff; margin:0 auto; opacity:0.2; margin-top:6px; }
#main .main_sec02 > ul > li.main_bn5 .sns_ctrl ul li.sctrl_1 { background:url(../images/main/sctrl_1.png) 0 0 no-repeat }
#main .main_sec02 > ul > li.main_bn5 .sns_ctrl ul li.sctrl_2 { background:url(../images/main/sctrl_2.png) 0 0 no-repeat }
#main .main_sec02 > ul > li.main_bn5 .sns_ctrl ul li.sctrl_3 { background:url(../images/main/sctrl_3.png) 0 0 no-repeat }
#main .main_sec02 > ul > li.main_bn5 .sns_ctrl ul li.sctrl_1:hover { background:url(../images/main/sctrl_1_on.png) 0 0 no-repeat }
#main .main_sec02 > ul > li.main_bn5 .sns_ctrl ul li.sctrl_2:hover { background:url(../images/main/sctrl_2_on.png) 0 0 no-repeat }
#main .main_sec02 > ul > li.main_bn5 .sns_ctrl ul li.sctrl_3:hover { background:url(../images/main/sctrl_3_on.png) 0 0 no-repeat }
#main .main_sec02 > ul > li.main_bn5 .sns_ctrl ul li.sctrl_1.on { background:url(../images/main/sctrl_1_on.png) 0 0 no-repeat }
#main .main_sec02 > ul > li.main_bn5 .sns_ctrl ul li.sctrl_2.on { background:url(../images/main/sctrl_2_on.png) 0 0 no-repeat }
#main .main_sec02 > ul > li.main_bn5 .sns_ctrl ul li.sctrl_3.on { background:url(../images/main/sctrl_3_on.png) 0 0 no-repeat }

#main .main_sec02 > ul > li.main_bn5 .sns_title { color:#fff; font-size:24px; margin-top:67px; margin-bottom:18px; letter-spacing:0; }
#main .main_sec02 > ul > li.main_bn5 .sns_title span { display:block; font-size:16px; font-weight:100; }
#main .main_sec02 > ul > li.main_bn5 .sns_title strong { display:block; line-height:1; font-weight:400; padding-top:3px; }

#main .main_sec02 > ul > li.main_bn5 .sns_1 { text-align:center; }
#main .main_sec02 > ul > li.main_bn5 .sns_2 { display:none; } 
#main .main_sec02 > ul > li.main_bn5 .sns_3 { display:none; }

#main .main_sec02 > ul > li.main_bn5 .sns_1 .sns_box1 { width:204px; height:85px;  background:url(../images/main/fb_img.gif) 0 0 no-repeat; margin:0 auto; }
#main .main_sec02 > ul > li.main_bn5 .sns_1 .sns_box2 { font-size:12px; text-align:left; color:#fff; padding:0 10px; margin-top:12px; } 

#main .main_sec02 > ul > li.main_bn5 .sns_2 { }
#main .main_sec02 > ul > li.main_bn5 .sns_2 .sns_box3 > li { padding:10px; width:100%; float:left; }
#main .main_sec02 > ul > li.main_bn5 .sns_2 .sns_box3 > li:first-child { border-bottom:1px dashed #4d598f; }
#main .main_sec02 > ul > li.main_bn5 .sns_2 .sns_box3 > li .ul_img { float:left; }
#main .main_sec02 > ul > li.main_bn5 .sns_2 .sns_box3 > li .ul_txt { float:left; text-align:left; width:90px; margin-left:10px; font-weight:300; color:#fff; font-size:12px; padding-top:5px; }
#main .main_sec02 > ul > li.main_bn5 .sns_2 span { display:block; font-size:10px; padding-top:5px; }
#main .main_sec02 > ul > li.main_bn5 .sns_2 strong { display:block; font-weight:300; }

#main .main_sec02 > ul > li.main_bn5 .sns_3 { color:#fff; font-size:14px; font-weight:500; }
#main .main_sec02 > ul > li.main_bn5 .sns_3 .sns_box4 { margin-top:94px; }
#main .main_sec02 > ul > li.main_bn5 .sns_3 .insta_a1 { background:url(../images/main/insta_i1.png) 0 3px no-repeat; padding-left:30px; }
#main .main_sec02 > ul > li.main_bn5 .sns_3 .insta_a2 { background:url(../images/main/insta_i2.png) 0 3px no-repeat; padding-left:30px; margin-left:27px; }

#main .bn_blank { background:rgba(0, 0, 0, 0.8); width:100%; height:120px; position:absolute; bottom:0; left:0; /*opacity:0.5;*/ }

@media only screen and (max-width:1200px) {
#main { display:none; }

#main_mobile { background:url(../images/main/m_bg.jpg) 50% 0% no-repeat; background-size:cover; padding-bottom:40px; display:block; }
#main_mobile .main_visual { overflow:hidden; }
#main_mobile .main_visual img { width:100%; }

#main_mobile .main_icon { padding:30px 20px; padding-top:30px; text-align:center; }
#main_mobile .main_icon h3 { text-align:center; margin-bottom:20px; }
#main_mobile .main_icon h3 img { width:100%; }
#main_mobile .main_icon ul { }
#main_mobile .main_icon ul li { text-align:center; }
#main_mobile .main_icon ul li a { color:#fff; display:block; padding-top:30px; padding-bottom:30px; }
#main_mobile .main_icon ul li strong { display:block; font-size:16px; margin-top:12px; font-weight:400; }
#main_mobile .main_icon ul li span { display:block; font-size:12px; margin-top:5px; display:none; }
#main_mobile .main_icon ul li span.m_icon { display:block; text-align:center; }
#main_mobile .main_icon ul li span.m_icon img { height:40px; }
#main_mobile .main_icon ul li.micon1 a { width:100%; background-color:rgba(0, 160, 232, 0.6); }
#main_mobile .main_icon ul li.micon1 a:before { display:block; width:100%; height:40px; content:''; background:url(../images/main/m_icon1.png) 50% 0 no-repeat; background-size:75px; display:none; }

#main_mobile .main_icon ul li.micon2 { width:49%; float:left; margin-top:2%; }
#main_mobile .main_icon ul li.micon2 a { background:rgba(50, 69, 137, 0.6); }
#main_mobile .main_icon ul li.micon2 a:before { display:block; width:100%; height:40px; content:''; background:url(../images/main/m_icon2.png) 50% 0 no-repeat; background-size:70px; display:none; }

#main_mobile .main_icon ul li.micon3 { width:49%; float:right; margin-top:2%; }
#main_mobile .main_icon ul li.micon3 a { background:rgba(50, 69, 137, 0.6); }
#main_mobile .main_icon ul li.micon3 a:before { display:block; width:100%; height:40px; content:''; background:url(../images/main/m_icon3.png) 50% 0 no-repeat; background-size:42px; display:none; }

#main_mobile .main_icon ul li.micon4 { width:49%; float:left; margin-top:2%; }
#main_mobile .main_icon ul li.micon4 a {background:rgba(182, 59, 144, 0.6); }
#main_mobile .main_icon ul li.micon4 a:before { display:block; width:100%; height:40px; content:''; background:url(../images/main/m_icon4.png) 50% 0 no-repeat; background-size:32px; display:none; }

#main_mobile .main_icon ul li.micon5 { width:49%; float:right; margin-top:2%; }
#main_mobile .main_icon ul li.micon5 a { background:rgba(182, 59, 144, 0.6); }
#main_mobile .main_icon ul li.micon5 a:before { display:block; width:100%; height:40px; content:''; background:url(../images/main/m_icon5.png) 50% 0 no-repeat; background-size:30px; display:none; }

#main_mobile .main_icon ul li.micon_add a { width:100%; background-color:rgba(71, 223, 255, 0.6); margin-top:2%; padding:20px 0;  }
#main_mobile .main_icon ul li.micon_add strong { margin-top:0; display:inline-block; }
#main_mobile .main_icon ul li.micon_add span { display:inline-block; font-size:14px; margin-left:5px; position:relative; top:-2px; }

#main_mobile:after { clear:both; content:''; width:100%; display:block; }


}