@charset "UTF-8";
@import url("http://fonts.googleapis.com/css?family=Roboto:100,300,400,700");

/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    Table of Contents

    ::00 - Basic_Elements

    ::01 - GNB_Area
    ::02 - Main_SlideBanner
    ::03 - Main_Smilesquare
    ::04 - Main_Project
    ::05 - Main_News
    ::06 - Main_Store

    ::10 - Sub_Elements
    ::11 - Sub_Smilesquare
    ::21 - Sub_Product
    ::31 - Sub_Consult
    ::32 - Sub_Contact
    ::41 - Sub_News
    ::51 - Sub_Store
    
    ::89 - Footer
    ::99 - Pagination
*/


/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::00 
    Basic Elements 
*/

html,body{position:relative; width:100%; height:100%; background:#fff}
html,body,ul,ol,img,div,span,iframe,a,p{margin:0; padding:0; border:0; outline:none}
html,body,ul,ol,li,img,div,span,iframe,a,p,input,textarea,select,i{
    font-family:'Roboto','Malgun Gothic','맑은 고딕', sans-serif; font-size:14px; font-weight:400; font-style:normal; word-break:keep-all; color:#444;
}
a,a:hover,a:active,a:focus{text-decoration:none}
img{border:none; width:auto; height:auto;}
ul,ol{list-style:none}
iframe,object,video,embed{position:relative; top:0; left:0; max-width:100%}

/* scroll top btn*/
.btn_top{
    position:fixed; bottom:10px; right:10px; z-index:999; text-decoration:none; text-align:center;
    width:40px; height:40px; border:1px solid #444;
}
.btn_top i{line-height:38px; color:#444}
.fade{opacity:0; transition: all 0.3s ease}
.fade.in{opacity:1; transition: all 0.3s ease}
.btn_top:hover{background:#dc3333; border-color:#dc3333}
.btn_top:hover i{color:#fff}

.twhite{color:#fff !important}
.tred{color:#dc3333 !important}
.tblue{color:#2691e4 !important}
.wrap{position:relative; width:100%; height:100%}



/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::01 
    GNB_Area 
*/
.header{position:absolute; z-index:5; width:100%; height:120px; background:rgba(0,0,0,0.8); border-bottom:1px solid rgba(255,255,255,0.1); box-sizing:border-box; transition:all 0.3s ease}
.header .mban_cover_t{position:absolute; z-index:6; top:0; width:100%; height:390px; overflow:hidden; background:url(../images/common/mban_cover_t.png) no-repeat top; pointer-events:none}

.gnb_quick{z-index:4; width:100%; height:40px; border-bottom:1px solid rgba(255,255,255,0.1); transition:all 0.3s ease}
.gnb_quick>div{position:relative; width:1140px; margin:0 auto}
.gnb_quick>div .slogan{float:left; font-size:12px; line-height:40px; color:rgba(255,255,255,0.5)}
.gnb_quick>div .b_sns{float:right; padding-top:10px}
.gnb_quick>div a{font-size:12px; color:#fff; margin-left:20px; opacity:0.5; transition:all 0.3s ease}
.gnb_quick>div a img{vertical-align:middle}
.gnb_quick>div a:hover{opacity:1}

.gnb{width:1140px; margin:0 auto}
.top_bi{position:absolute; top:54px; width:137px; height:49px; transition:all 0.3s ease}
.top_bi a{position:relative}
.top_bi a div{position:absolute; z-index:99; left:0; top:0; width:137px; height:49px}
.top_bi a div.bi_d{display:none}

.cont{position:relative; width:1140px; margin:0 auto}
.btn_contact{position:absolute; top:18px; right:0; width:120px; height:40px; line-height:40px; color:#fff; font-size:16px; text-align:center; border:1px solid #fff}
.btn_contact i{
    display:inline-block; width:24px; height:20px; overflow:hidden; vertical-align:middle;
    background:url(../images/common/i_contact_white.png) no-repeat; background-size:cover
}
.btn_contact:hover{background:#fff; color:#000}
.btn_contact:hover i{background:url(../images/common/i_contact_blk.png) no-repeat; background-size:cover}

.dropdown-hover{width:720px; margin:0 auto; padding-top:30px}
.dropdown-hover>div{display:inline-block; margin:0 25px}
.dropdown-hover>div:first-child{margin-left:0}
.dropdown-hover>div:last-child{margin-right:0}

.dropdown-hover .gnbm{display:block; height:80px; font-size:16px; color:#fff; opacity:0.5; transition:all 0.3s ease}
.dropdown-hover .sub_box{position:absolute; top:120px; left:0; width:100%; height:0; overflow:hidden; background:rgba(0,0,0,0); transition:all 0.3s ease}
.dropdown-hover .sub_box>div{width:1140px; margin:0 auto; padding-left:245px; box-sizing:border-box}
.dropdown-hover .sub_box h3{float:left; width:185px; color:#e9e9e9; margin-top:25px}
.dropdown-hover .sub_box .depth{float:left; padding:30px 0 30px 50px; color:rgba(255,255,255,0.5); border-left:1px solid rgba(255,255,255,0.1)}
.dropdown-hover .sub_box .depth p{font-size:16px; color:#e9e9e9}
.dropdown-hover .sub_box .depth ul{float:left; margin-right:50px}
.dropdown-hover .sub_box .depth ul li{min-height:26px}
.dropdown-hover .sub_box .depth a{display:block; height:26px; line-height:30px; font-size:13px; color:rgba(255,255,255,0.5); transition:all 0.3s ease}
.dropdown-hover .sub_box .depth a:hover{color:#fff}

.dropdown-hover>div:hover .gnbm{opacity:1}
.dropdown-hover>div:hover .sub_box{background:rgba(0,0,0,0.8)}

.dropdown-hover .dropdown_1:hover .sub_box{height:110px}
.dropdown-hover .dropdown_2:hover .sub_box{height:270px}
.dropdown-hover .dropdown_3:hover .sub_box{height:185px}
.dropdown-hover .dropdown_4:hover .sub_box{height:135px}

/* GNB small */
.navbar-small{position:fixed; z-index:99; top:0; height:80px; background:#fff; border-bottom:1px solid #e4e4e4; box-sizing:border-box; transition:all 0.3s ease}
.navbar-small .mban_cover_t{display:none}
.navbar-small .btn_contact{top:18px; color:#d94444; border:1px solid #d94444; opacity:1}
.navbar-small .btn_contact i{background:url(../images/common/i_contact_red.png) no-repeat; background-size:cover}

.navbar-small .btn_contact:hover{color:#fff; background:#d94444}
.navbar-small .btn_contact:hover i{background:url(../images/common/i_contact_white.png) no-repeat; background-size:cover}
.navbar-small .gnb_quick{height:0; overflow:hidden}
.navbar-small .top_bi{top:14px}
.navbar-small .bi_t{display:none}
.navbar-small .top_bi a div.bi_d{display:block}
.navbar-small .dropdown-hover .gnbm{color:#444; opacity:1; font-weight:700}
.navbar-small .dropdown-hover .sub_box{top:80px; background:#fff}
.navbar-small .dropdown-hover>div:hover .sub_box{background:#fff; border-bottom:1px solid rgba(0,0,0,0.1);}
.navbar-small .dropdown-hover .sub_box h3{color:#444}
.navbar-small .dropdown-hover .sub_box .depth{border-left:1px solid #e4e4e4}
.navbar-small .dropdown-hover .sub_box .depth p{color:#444; font-weight:700}
.navbar-small .dropdown-hover .sub_box .depth a{color:#666}
.navbar-small .dropdown-hover .sub_box .depth a:hover{color:#d94444; font-weight:700}



/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::02 
    Main_SlideBanner 
*/
.mbanner-wrap{position:relative; width:100%; height:920px}
.mbanner{position:relative; width:100%; min-width:1140px; height:100%; background:#fff}
.mbanner .cover-img{min-width:100%; height:100%; overflow:hidden}
.mbanner .banner-inner{position:relative; overflow:hidden; width:100%; height:100%}

.mbanner{position:relative}
.banner-inner{position:relative; width:100%; height:100%; overflow: hidden}
.banner-inner > .item {
    position:relative; background:#000;
    overflow:hidden; height:100%;
    display:none;
    -webkit-transition: .3s ease-in-out left;
         -o-transition: .3s ease-in-out left;
            transition: .3s ease-in-out left;
}
.banner-inner > .item > img, .banner-inner > .item > a > img{
    line-height:1;
}
.banner-inner .item .item-inner{position:absolute; width:1920px; left:50%; margin-left:-960px}
@media all and (transform-3d), (-webkit-transform-3d){
  .banner-inner > .item{
    -webkit-transition: -webkit-transform .3s ease-in-out;
         -o-transition:      -o-transform .3s ease-in-out;
            transition:         transform .3s ease-in-out;

    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    -webkit-perspective: 1000px;
            perspective: 1000px;
  }
  .banner-inner > .item.next,
  .banner-inner > .item.active.right {
    left: 0;
    -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
  }
  .banner-inner > .item.prev,
  .banner-inner > .item.active.left {
    left: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }
  .banner-inner > .item.next.left,
  .banner-inner > .item.prev.right,
  .banner-inner > .item.active {
    left: 0;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
.banner-inner > .active,.banner-inner > .next,.banner-inner > .prev {display: block; max-height:920px}
.banner-inner > .active {left: 0}
.banner-inner > .next,.banner-inner > .prev {position: absolute; top: 0; width: 100%}
.banner-inner > .next {left: 100%}
.banner-inner > .prev {left: -100%}
.banner-inner > .next.left,.banner-inner > .prev.right {left: 0}
.banner-inner > .active.left {left: -100%}
.banner-inner > .active.right {left: 100%}

.ban_navi{position:absolute; z-index:3; bottom:0; left:50%; margin-left:-120px; width:241px; height:241px; background:url(../images/common/ban_navi_bg.png) no-repeat center}
.mbanner .mban{position:absolute; z-index:2; top:85px; width:23px; opacity:0.5; padding:15px 20px}
.mbanner .mban:hover{opacity:1}
.mbanner .b-prev{left:30px}
.mbanner .b-next{right:30px}
.mbanner-wrap .mban_cover{
    position:absolute; top:0; left:0; width:100%; min-width:1140px; height:920px; pointer-events:none; 
    background:url(../images/common/mban_cover_bg.png) no-repeat center;
}

/* banner indicator */
.carousel-indicators{position:absolute; z-index:4; top:230px; left:50%; margin-left:-570px; width:1140px}
.carousel-indicators li{margin-left:120px; padding-left:60px; box-sizing:border-box; width:240px; height:40px; line-height:40px}
.carousel-indicators li:nth-child(2){margin-left:160px}
.carousel-indicators li:nth-child(3){margin-left:200px}
.carousel-indicators li:nth-child(4){margin-left:240px}
.carousel-indicators li:nth-child(5){margin-left:280px}
.carousel-indicators li:nth-child(6){margin-left:320px}
.carousel-indicators li:nth-child(7){margin-left:360px}
.carousel-indicators li:nth-child(8){margin-left:400px}
.carousel-indicators li:nth-child(9){margin-left:440px}

.carousel-indicators li .indi_title{color:#bfbfbf; cursor:pointer}
.carousel-indicators li .indi_title:hover{color:#dc3333}
.carousel-indicators li.active{background:url(../images/common/indi_bg.png) no-repeat center}
.carousel-indicators li.active .indi_title{color:#dc3333; font-weight:700}

/* indicator contents */
.carousel-indicators .mban_con{position:absolute; z-index:7; top:160px; left:-300px; display:none; pointer-events:none}
.carousel-indicators .mban_con span{display:block; width:50px; height:2px}
.carousel-indicators .mban_con .line_indoor{background:#d94444}
.carousel-indicators .mban_con .line_motion{background:#a33cf3}
.carousel-indicators .mban_con .line_vr{background:#2691e4}

.carousel-indicators .mban_con .mban_txt{margin-left:300px}
.carousel-indicators .mban_con .mban_txt h1{color:#222}
.carousel-indicators .mban_con .mban_txt h3{font-weight:100; color:#222}
.carousel-indicators .mban_con .mban_txt p{font-size:20px; line-height:30px; letter-spacing:-1px}
.carousel-indicators .mban_con .mban_img{position:absolute; top:250px; left:150px}

.carousel-indicators .mban_con .mban_img.ban_1{top:240px; left:80px}
.carousel-indicators .mban_con .mban_img.ban_2{top:220px; left:40px}
.carousel-indicators .mban_con .mban_img.ban_3{top:240px; left:30px}
.carousel-indicators .mban_con .mban_img.ban_4{top:220px; left:-120px}
.carousel-indicators .mban_con .mban_img.ban_5{top:195px; left:20px}
.carousel-indicators .mban_con .mban_img.ban_6{top:300px; left:50px}
.carousel-indicators .mban_con .mban_img.ban_7{top:240px; left:150px}
.carousel-indicators .mban_con .mban_img.ban_8{top:270px; left:240px}
.carousel-indicators .mban_con .mban_img.ban_9{top:220px; left:-120px}

.carousel-indicators a.btn_more{
    position:absolute; z-index:9; top:365px; left:0; display:none; transition:all 0.3s ease;
    width:150px; height:50px; line-height:50px; font-size:16px; text-align:center; border:1px solid #444;
}
.carousel-indicators a.btn_more.btn2{top:335px}
.carousel-indicators a.btn_more:hover{background:#dc3333; border-color:#dc3333; color:#fff; font-weight:700}

.carousel-indicators li.active a.btn_more{display:block}
.carousel-indicators li.active .mban_con{display:block}

/* banner animated */
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
@-webkit-keyframes fadeLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-30px);
    transform: translateX(-30px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-30px);
    -ms-transform: translateX(-30px);
    transform: translateX(-30px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeLeft {
  -webkit-animation-name: fadeLeft;
  animation-name: fadeLeft;
}
.fadeLeft_2{
    animation-delay:.2s;
    -webkit-animation-name: fadeLeft;
    animation-name: fadeLeft;
}
.fadeLeft_3{
    animation-delay:.5s;
    -webkit-animation-name: fadeLeft;
    animation-name: fadeLeft;
}



/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::03 
    Main_Smilesquare
*/
.con{position:relative; width:100%; min-width:1140px}
.con_title{width:1140px; margin:0 auto 50px auto; text-align:center}
i.title_p{
    background:url(../images/common/title_p.png) no-repeat center; width:30px; height:20px;
    position:absolute; top:-7px; left:-28px;
}
.con_title h1{position:relative; display:inline-block; font-size:60px; font-weight:300; color:#222; margin-top:85px}

.consult{position:relative; width:1140px; height:500px; margin:0 auto}
.consult .panel{position:absolute; top:0; width:350px; height:400px; text-align:center}
.consult .panel.align_l{left:0; background:#f0f0f0}
.consult .panel.align_c{left:50%; margin-left:-175px; background:#dc3333}
.consult .panel.align_r{right:0; background:#f0f0f0}
.consult .panel>p{margin-top:5px}
.consult h2{margin-top:30px}
.consult .hr{display:block; height:0; border-top:1px solid #d3d3d3; border-bottom:1px solid #fff; margin:40px 0 30px 0}

.consult .align_l li{float:left; width:50%; margin-bottom:30px}

.consult .align_c h2{color:#fff}
.consult .align_c .hr{margin-top:25px; border-top:1px solid #b51b1c; border-bottom:1px solid #e35c5c}
.consult .align_c p.tel{margin-top:0; font-size:30px; color:#fff}
.consult .align_c>div{display:inline-block; width:280px}
.consult .align_c input{display:block; width:100%; height:50px; font-size:16px; margin-bottom:5px; border:none}
.consult .align_c input:focus{box-shadow:3px 3px 3px rgba(0,0,0,0.3)}
.consult .align_c a{display:block; background:#abd138; color:#fff; height:50px; line-height:50px; font-size:16px; transition:all 0.3s ease}
.consult .align_c a:hover{box-shadow:3px 3px 3px rgba(0,0,0,0.3)}

.consult .align_r ol{margin-left:85px}
.consult .align_r li{position:relative; text-align:left; margin-bottom:15px}
.consult .align_r li i{
    position:absolute; top:1px; left:-25px; background:#63717b; display:inline-block;
    width:18px; height:18px; line-height:18px; border-radius:50%; font-size:13px; font-weight:300; color:#fff; text-align:center
}
.consult .align_r li p.d1{font-size:14px; color:#777}
.consult .align_r li p.d2{font-size:16px; color:#444}



/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::04 
    Main_Project 
*/
.project{position:relative; width:100%; height:805px; background:url(../images/common/bg_img1.jpg) no-repeat center}
.project .swiper-container{position:relative; width:1140px; height:465px; margin:0 auto}
.project .swiper-slide .con_box{position:absolute; z-index:2; width:570px; height:465px; padding:50px; box-sizing:border-box; left:0}
.project .swiper-slide .con_indoor{background:#d94444}
.project .swiper-slide .con_vr{background:#2691e4}
.project .swiper-slide .con_motion{background:#a33cf3}
.project .swiper-slide .con_img{position:absolute; z-index:1; width:570px; height:465px; right:0;}
.project .swiper-slide h2{color:#fff}
.project .swiper-slide .d1{font-size:13px; font-weight:300; color:#fff; margin-top:80px}
.project .swiper-slide .d2{font-size:16px; color:#fff; margin-top:20px}
.project .swiper-slide a{display:block; width:150px; height:45px; line-height:45px; margin-top:45px; font-size:18px; color:#fff; text-align:center; border:1px solid #fff; transition:all 0.3s ease}
.project .swiper-slide a:hover{background:#fff; color:#d94444}
.project .sw_btn{background:#fff; width:60px; height:60px; top:auto; bottom:0}
.project .sw_btn i{color:#444; margin:16px 0 0 16px}
.project .swiper-button-prev, .swiper-container-rtl .swiper-button-next{left:50%; margin-left:-60px}
.project .swiper-button-next, .swiper-container-rtl .swiper-button-prev{right:50%; margin-right:-60px}



/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::05 
    Main_News 
*/
.news_wrap{position:relative; width:1140px; margin:0 auto; padding-bottom:70px; overflow:hidden}
.news_wrap .news_box{display:block; float:left; width:260px; height:280px; margin:0 30px 30px 0; border:1px solid #d9d9d9; transition:all 0.3s ease; overflow:hidden}
.news_wrap .news_box a img{width:100%; height:170px}
.news_wrap .news_box:nth-child(4){margin-right:0}
.news_wrap .news_box:nth-child(8){margin-right:0}
.news_wrap .news_box:hover{border-color:#222; box-shadow:1px 3px 6px rgba(0,0,0,0.2)}
.news_wrap .news_box p{margin:15px}
.news_wrap .news_box>div{margin:15px; font-size:13px; color:#999; text-align:right}
.news_wrap .news_box>div span{float:left; font-size:13px; color:#999}
.news_wrap .news_box>div {font-size:13px; color:#999}
.news_wrap .news_box>div i{display:inline-block; width:18px; height:18px; margin-right:3px; vertical-align:middle}
.news_wrap .news_box>div i.youtube{background:url(../images/common/icon_sns_youtube.png) no-repeat;}
.news_wrap .news_box>div i.instar{background:url(../images/common/icon_sns_instar.png) no-repeat;}
.news_wrap .news_box>div i.facebook{background:url(../images/common/icon_sns_facebook.png) no-repeat;}
.news_wrap .news_box>div i.news{background:url(../images/common/icon_sns_news.png) no-repeat;}
.news_wrap .news_box>div i.press{background:url(../images/common/icon_sns_press.png) no-repeat;}

.news_wrap .news_box p{
    line-height:20px; height:42px;
    overflow:hidden; word-wrap:break-word; white-space:normal; text-overflow:ellipsis;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient: vertical;
}



/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::06 
    Main_Store 
*/
.store{position:relative; width:100%; min-width:1140px; background:#eaeaee; text-align:center}
.store_box{display:inline-block; width:360px; min-height:380px; background:#fff}
.store_box img{width:100%; height:240px}
.store_box a{text-align:center}
.store_box a h4{font-weight:700; margin:20px}
.store_box a p{margin:0 30px 30px 30px}

/* swiper */
.store .swiper-container{position:relative; width:1160px; height:430px; margin:0 auto; margin-bottom:20px}
.store .swiper-pagination-bullet-active{background:#dc3333}

.store .btn_more{
    display:inline-block; width:170px; height:50px; line-height:50px; border:1px solid #444; font-size:16px; color:#444; text-align:center; 
    transition:all 0.3s ease; margin-bottom:100px;
}
.store .btn_more:hover{background:#d94444; color:#fff; border-color:#d94444}



/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::10 
    Sub_Elements
*/
.sub_con>div{text-align:center}
.sub-visual{position:relative; width:100%; height:390px; text-align:center}
.sub-visual p{font-size:20px; color:rgba(255,255,255,0.7); padding-top:210px}
.sub-visual h1{font-size:60px; font-weight:300; color:#fff}
.sub-visual.sub_bg1{background:url(../images/common/sub_visual_1.jpg) no-repeat center}
.sub-visual.sub_bg2{background:url(../images/common/sub_visual_2.jpg) no-repeat center}
.sub-visual.sub_bg3{background:url(../images/common/sub_visual_3.jpg) no-repeat center}
.sub-visual.sub_bg4{background:url(../images/common/sub_visual_4.jpg) no-repeat center}
.sub-visual.sub_bg5{background:url(../images/common/sub_visual_5.jpg) no-repeat center}

.sub_title{width:1140px; margin:0 auto 50px auto; text-align:center}
.sub_title h1{position:relative; display:inline-block; font-size:50px; font-weight:300; color:#222; margin-top:85px}
.sub_title h4{line-height:30px; margin-top:20px}

.hori{background:url(../images/common/sub_background.gif) repeat-x bottom}



/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::11 
    Sub_smilesquare
*/
.about_1 .sec_bg{background:url(../images/common/sub_img_2.png) no-repeat center 580px; width:100%; height:860px}
.about_1 .about_img{position:relative; width:100%}

.about_1b .sec_bg{background:url(../images/common/sub_img_3.png) no-repeat center; width:100%; height:760px}
.about_1b .about_img{position:relative; width:1140px; margin:0 auto}
.about_1b .about_img>div{position:absolute; top:0}
.about_1b .about_img>div.bubble_1{left:135px}
.about_1b .about_img>div.bubble_2{top:50px; left:435px}
.about_1b .about_img>div.bubble_3{left:735px}

.con .about_2{text-align:left}
.about_2 .dt_wrap{width:1140px; margin:0 auto; padding-bottom:100px; overflow:hidden}
.about_2 .dt_wrap h4{font-weight:700}
.about_2 h4{position:relative; display:block; padding-top:6px}
.about_2 .sub_dt{position:absolute; top:0; left:0; width:20px; height:1px; background:#e60013}

.about_2 .sub_dt_1 ul{margin-top:20px}
.about_2 .sub_dt_1 li{display:inline-block; vertical-align:top}
.about_2 .sub_dt_1 li:first-child{width:390px}
.about_2 .sub_dt_1 li:last-child{width:740px}
.about_2 p{color:#666; line-height:25px; margin-bottom:20px}
.about_2 h5{color:#444; font-weight:700; margin-top:10px}

.about_2 .sub_dt_2 .color_set{height:150px}
.about_2 .sub_dt_2 .color_box{display:block; width:360px; height:20px}
.about_2 .sub_dt_2 .color_set>div{float:left; width:360px; margin-right:30px}
.about_2 .sub_dt_2 .color_set>div:nth-child(3){margin-right:0}
.about_2 .sub_dt_2 .color_set .color_1{background:#e60012}
.about_2 .sub_dt_2 .color_set .color_2{background:#000}
.about_2 .sub_dt_2 .color_set .color_3{background:#fff; border:1px solid #999; box-sizing:border-box}
.about_2 .sub_dt_2 .palette p{display:inline-block; width:70px; margin:0; padding:0}
.about_2 .sub_dt_2 .color_sys{height:100px}
.about_2 .sub_dt_2 .color_sys>div{float:left; width:360px; margin-right:30px}
.about_2 .sub_dt_2 .color_sys>div:nth-child(3){margin-right:0}
.about_2 .sub_dt_2 .color_sys span{display:block; width:180px; height:20px; background:#fff; border:1px solid #999; box-sizing:border-box}
.about_2 .sub_dt_2 .color_sys .color_1{background:#e60012}
.about_2 .sub_dt_2 .color_sys .color_1 span{float:right; border-left:none}
.about_2 .sub_dt_2 .color_sys .color_2{background:#e60012}
.about_2 .sub_dt_2 .color_sys .color_2 span{float:left; border-right:none}
.about_2 .sub_dt_2 .color_sys .color_3{background:#000}
.about_2 .sub_dt_2 .color_sys .color_3 span{float:right; border-left:none}

.about_2 .sub_dt_3>div{float:left; width:360px; margin-right:30px}
.about_2 .sub_dt_3>div:last-child{margin-right:0}

.about_2 .sub_dt_4>div{float:left; width:360px; margin-right:30px}



/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::21 
    Sub_Product
*/
.pro_tab{width:1140px; height:210px; margin:0 auto; padding-top:100px}
.pro_tab li{float:left; margin-right:12px; margin-bottom:12px}
.pro_tab li:nth-child(6){margin-right:0}
.pro_tab li a{display:block; width:180px; height:50px; line-height:50px; border:1px solid #666; box-sizing:border-box; text-align:center; transition:all 0.3s ease}
.pro_tab li a:hover,.pro_tab li a.on{font-weight:700; color:#fff; border:none; background:#e60013}
.pro_tab li a.off{pointer-events:none; opacity:0.4}

.prod_wrap{position:relative; width:100%}
.prod_wrap .prod_bg{width:100%; height:650px; text-align:center}
.prod_wrap .prod_bg p{color:#fff; font-size:24px; letter-spacing:-1px; margin-top:30px}
.prod_wrap .prod_bg h1{color:#fff; font-size:60px; letter-spacing:-2px}
.prod_wrap .prod_bg img{margin-top:200px}
.prod_wrap .prod_img_1{background:url(../images/common/product_img_1.jpg) no-repeat center}
.prod_wrap .prod_img_2{background:url(../images/common/product_img_2.jpg) no-repeat center}
.prod_wrap .prod_img_3{background:url(../images/common/product_img_3.jpg) no-repeat center}
.prod_wrap .prod_img_4{background:url(../images/common/product_img_4.jpg) no-repeat center}
.prod_wrap .prod_img_5{background:url(../images/common/product_img_5.jpg) no-repeat center}
.prod_wrap .prod_img_6{background:url(../images/common/product_img_6.jpg) no-repeat center}
.prod_wrap .prod_img_7{background:url(../images/common/product_img_7.jpg) no-repeat center}
.prod_wrap .prod_img_8{background:url(../images/common/product_img_8.jpg) no-repeat center}
.prod_wrap .prod_img_9{background:url(../images/common/product_img_9.jpg) no-repeat center}
.prod_wrap .prod_img_10{background:url(../images/common/product_img_10.jpg) no-repeat center}
.prod_wrap .prod_img_11{background:url(../images/common/product_img_11.jpg) no-repeat center}

.prod_con{width:1140px; margin:0 auto}
.prod_con>div{display:inline-block; margin-top:50px; margin-bottom:100px; vertical-align:top}
.prod_con .prod_txt{margin-left:50px}
.prod_con .prod_txt span{display:block; width:140px; height:35px; line-height:35px; color:#fff; text-align:center}
.prod_con .prod_txt span.indoor{background:#ed1c24}
.prod_con .prod_txt span.vr{background:#a33cf3}
.prod_con .prod_txt span.motion{background:#1c94f1}
.prod_con .prod_txt h4{font-weight:700; margin-top:20px}
.prod_con .prod_txt ul{list-style:square; width:495px; margin-top:10px; margin-left:20px}
.prod_con .prod_txt li{line-height:25px}



/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::31 
    Sub_Consult
*/
.consult_1{margin-bottom:70px}
.consult_con{width:1140px; margin:0 auto; overflow:hidden}
.consult_con .point_box{float:left; margin-right:30px; margin-bottom:30px; width:360px; height:360px; border:1px solid #d9d9d9; padding:20px; text-align:center; box-sizing:border-box}
.consult_con .point_box:nth-child(3){margin-right:0}
.consult_con .point_box:nth-child(6){margin-right:0}
.consult_con .point_box h4{font-size:16px; font-weight:700; margin:20px 0}
.consult_con .point_box h4 span{display:block; font-size:16px; font-weight:700}
.consult_con .point_box p{font-size:13px; line-height:20px; color:#666}

.consult_2{background:url(../images/common/consult_bg.jpg) no-repeat center; width:100%; height:685px}
.consult_2 .sub_title h1{color:#fff}
.consult_2 .sub_title h4{color:#999}
.consult_2 .consult_con .point_box{float:left; background:#fff; margin-right:20px; margin-bottom:20px; width:270px; height:300px; border:none; padding:30px; text-align:center; box-sizing:border-box}
.consult_2 .consult_con .point_box:nth-child(4){margin-right:0}
.consult_2 .consult_con .hr{display:block; height:1px; background:#d9d9d9; margin:20px 0 30px 0}

.consult_3 {margin-bottom:70px}
.consult_3 .arrow{width:48px; height:150px; text-align:center}
.consult_3 .arrow i{margin-top:65px}
.consult_3 .consult_con>div{float:left; margin-bottom:30px}
.cons_circle{background:#f1f0f0; display:block; width:150px; height:150px; border-radius:50%; text-align:center}
.cons_circle.open{background:#ed1c24}
.cons_circle.open img{width:70%}
.cons_circle.open p{color:#fff; font-size:20px; font-weight:700}
.cons_circle img{margin-top:40px}

.contact_wrap{width:1140px; height:380px; padding:60px; margin:0 auto; border:1px solid #d9d9d9; box-sizing:border-box}
.contact_wrap .contact_icon{float:left; width:250px; text-align:right}
.contact_wrap .contact_point{float:left; border-left:1px solid #d9d9d9; margin-left:50px; padding-left:50px; box-sizing:border-box}
.contact_wrap .contact_point p{font-size:16px}
.contact_wrap .contact_point h1{font-size:60px; margin-bottom:30px}
.contact_wrap .contact_point h2{margin-top:20px}
.contact_wrap .contact_point a{display:block; width:320px; height:60px; line-height:60px; font-size:18px; text-align:center; color:#fff; background:#ed1c24; transition:all 0.3s ease}
.contact_wrap .contact_point a:hover{background:#cb0209}

.consult_5{margin-bottom:70px}
.consult_5 .point_box{position:relative; width:360px; height:360px; border:none; padding:0; box-sizing:border-box}
.consult_5 .point_box .ovelay{position:absolute; display:block; width:100%; height:100%; background:rgba(0,0,0,0); opacity:0; pointer-events:none; transition:all 0.3s ease}
.consult_5 .point_box .ovelay img{margin-top:155px}
.consult_5 .point_box:hover .ovelay{background:rgba(0,0,0,0.8); opacity:1}



/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::32 
    Sub_Contact
*/
.contact{width:1140px; margin:0 auto}
.privacy{width:100%; text-align:left; margin-bottom:50px}
.privacy h4{font-weight:400; color:#444; margin-bottom:10px}
.privacy ol{
    background:#f6f6f6; text-align:left; list-style:decimal;
    width:100%; margin:0 auto 20px auto; padding:30px 30px 30px 50px; box-sizing:border-box;
}
.privacy li{line-height:23px; padding:5px 0; color:#666}
.privacy li p{color:#666}

.input_wrap{width:100%; text-align:left; margin-bottom:100px}
.input_wrap input,.input_wrap select{display:inline-block; min-width:120px; vertical-align:middle}
.input_wrap textarea{margin:10px 0; width:100%}
.input_wrap h2{font-weight:400; color:#444; margin-bottom:20px}
.input_wrap table{
    width:100%; border-top:2px solid #d90125; margin-bottom:50px; border-collapse:collapse;
}
.input_wrap table th,.input_wrap table td{
    height:60px; font-size:16px; color:#666; padding:0 20px; box-sizing: border-box;
    border-bottom:1px solid #dfdfdf; border-right:1px solid #dfdfdf;
}
.input_wrap table th{text-align:center; width:20%}
.input_wrap table td:last-child{border-right:0}
.input_wrap table th:last-child{border-right:0}
.input_wrap table th{background:#f6f6f6; font-weight:400; color:#444}
.input_wrap .radio{display:inline-block; margin:10px 20px 0 0}
.input_wrap table td input.wid_h{width:100%}

.input_wrap .board_foot{text-align:center}
.input_wrap .board_foot a{display:inline-block; width:320px; height:60px; line-height:60px; font-size:18px; text-align:center; color:#fff; background:#ed1c24; transition:all 0.3s ease}
.input_wrap .board_foot a:hover{background:#cb0209}



/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::41 
    Sub_News
*/
.press_wrap{width:1140px; margin:0 auto; padding-bottom:30px}
.p_panel{width:100%; padding:30px; margin-bottom:30px; border:1px solid #d9d9d9; box-sizing:border-box; overflow:hidden; transition:all 0.3s ease}
.p_panel:hover{border:1px solid #ed1c24}
.p_panel .p_img{float:left; width:240px; height:150px; overflow:hidden}
.p_panel .p_img img{width:100%; height:100%}
.p_panel .p_con{float:left; width:800px; margin-left:30px}
.p_panel .p_con span{display:inline-block; height:25px; padding:0 15px; line-height:25px; border:1px solid #ed1c24; color:#ed1c24; text-align:center}
.p_panel .p_con h4{font-size:20px; margin:15px 0; text-overflow:ellipsis; overflow:hidden; white-space:nowrap}
.p_panel .p_con p.p_txt{
    color:#666; line-height:20px; height:42px;
    overflow:hidden; word-wrap:break-word; white-space:normal; text-overflow:ellipsis;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient: vertical;
}
.press_wrap p.p_date{color:#999; font-size:13px; margin-top:15px}

.video_view{padding-bottom:30px; border-bottom:1px solid #444}
.video_view .video_bg{width:1140px; height:640px; margin:0 auto}

.video_view h4{margin-top:30px}
.video_list{margin-top:50px; margin-bottom:20px; overflow:hidden}
.video_list a{float:left; display:block; width:360px; height:300px; margin-right:30px; border:1px solid #d9d9d9; overflow:hidden; box-sizing:border-box; transition:all 0.3s ease}
.video_list a:last-child{margin-right:0}
.video_list a:hover{border-color:#444}
.video_list .video_img{width:100%; height:210px; overflow:hidden}
.video_list .video_img img{width:100%; height:100%}
.video_list .video_t{margin:20px}
.video_list a p.p_txt{text-overflow:ellipsis; white-space:nowrap; overflow:hidden}
.video_list a p.p_date{margin-top:10px}

.board_t{line-height:40px; margin-bottom:10px}
.board_t .result{display:inline-block}
.board_t .search{float:right; position:relative}
.board_t .search input{width:300px; height:40px; border:2px solid #444}
.board_t .search a{position:absolute; top:0; right:0; background:#444; display:block; width:40px; height:40px; text-align:center}
.board_t .search a i{color:#fff; margin-top:8px}

.board_wrap{border-top:2px solid #444; border-bottom:1px solid #444}
.b_list .head{height:60px; border-bottom:1px solid #444; line-height:60px}
.b_list .head div{text-align:center; float:left; font-size:16px; font-weight:700; width:980px}
.b_list .head div:nth-child(2){width:160px}
.b_list .list a{display:block; border-bottom:1px solid #e9e9e9; height:50px; line-height:50px}
.b_list .list a:hover{background:#f9f9f9}
.b_list .list a:last-child{border-bottom:none}
.b_list .list a p{display:inline-block; margin-left:30px; width:900px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden}
.b_list .list a div{float:right; width:160px; text-align:center}
.board_wrap .i_time{display:inline-block; width:14px; height:14px; background:url(../images/common/icon_clock.png) no-repeat center; vertical-align:middle; margin-right:5px}
.board_wrap .i_loc{display:inline-block; width:14px; height:14px; background:url(../images/common/icon_location.png) no-repeat center; vertical-align:middle; margin-right:5px}

.b_view .head{padding:30px 0; border-bottom:1px solid #444}
.b_view .head h3{margin-left:10px}
.b_view .head div{margin-left:10px; margin-top:10px}
.b_view .view{padding:50px 0; line-height:25px}
.b_view .view img{max-width:100%}
.btn_wrap{text-align:right; padding-top:50px; padding-bottom:70px}
.btn_board{display:inline-block; width:170px; height:50px; line-height:50px; border:1px solid #444; font-size:16px; color:#444; text-align:center; transition:all 0.3s ease}
.btn_board:hover{background:#d94444; color:#fff; border-color:#d94444}



/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::51 
    Sub_Store
*/
.store_wrap{position:relative; width:1140px; margin:0 auto; overflow:hidden; padding-bottom:20px}
.store_list a{float:left; display:block; width:360px; height:380px; margin-right:30px; margin-bottom:30px; border:1px solid #d9d9d9; transition:all 0.3s ease; box-sizing:border-box}
.store_list a:nth-child(3){margin-right:0}
.store_list a:nth-child(6){margin-right:0}
.store_list a:hover{border-color:#444}
.store_list img{width:100%; height:240px}
.store_list a{text-align:center}
.store_list a h4{margin:20px}
.store_list a p{
    height:39px; line-height:20px; margin:0 30px 30px 30px; overflow:hidden; word-wrap:break-word; white-space:normal; text-overflow:ellipsis;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient: vertical;
}

.s_map .head{border-bottom:1px solid #444; padding:30px 0}
.s_map .head h3{margin-bottom:10px}
.s_map .head h3 span{display:inline-block; background:#d9d9d9; width:1px; height:23px; margin:0 20px; vertical-align:middle}
/*.s_map .head div{float:left; font-size:16px; font-weight:700; width:980px}*/
.s_map .head div span{display:inline-block; padding:3px 0; color:#666}
.s_map .view{padding:50px 0; overflow:hidden}
.s_map .view .store_map{width:1140px; height:450px; overflow:hidden; margin-bottom:30px}

.s_map .store_img{position:relative; float:left; margin-right:15px; margin-bottom:15px; width:370px; height:240px; border:none; padding:0; box-sizing:border-box; overflow:hidden}
.s_map .store_img:nth-child(3){margin-right:0}
.s_map .store_img .ovelay{position:absolute; display:block; width:100%; height:100%; text-align:center; background:rgba(0,0,0,0); opacity:0; pointer-events:none; transition:all 0.3s ease}
.s_map .store_img .ovelay img{margin-top:100px}
.s_map .store_img:hover .ovelay{background:rgba(0,0,0,0.8); opacity:1}
.s_map .store_img a img{width:100%; height:240px}



/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::89 
    Footer 영역
*/
.footer{width:100%; min-height:200px; background:#fff; border-top:1px solid #d9d9d9; box-sizing:border-box}
.footer .foot_gnb{width:1140px; margin:0 auto; height:50px; line-height:50px}
.footer .foot_gnb .foot_menu{float:left}
.footer .foot_gnb .foot_menu a{color:#666; margin-right:45px}
.footer .foot_gnb .foot_site{float:right; margin-top:10px}
.footer .foot_gnb .foot_site select{min-width:150px; height:30px}

.footer .foot_copy{width:100%; box-sizing:border-box; border-top:1px solid #d9d9d9}
.footer .copyright{width:1140px; margin:0 auto; padding-top:30px}
.footer .copyright .foot_con{float:left; margin-left:55px}
.footer .copyright .foot_con p{font-size:12px; color:#999; height:20px}
.footer .copyright .foot_contact{position:relative; float:right; width:180px}
.footer .copyright .foot_contact div{position:absolute; left:0}
.footer .copyright .foot_contact p{margin-left:70px; letter-spacing:-1px; font-size:16px; color:#666}
.footer .copyright .foot_contact p span{font-size:24px; color:#666}



/* -----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
    ::99
    게시물 페이지 버튼
*/
.page{clear:both; margin:0 auto 100px auto; text-align:center}
.page a{display:inline-block; border:1px solid #dfdfdf; width:40px; height:40px; line-height:40px; background:#fff; transition:all 0.3s ease}
.page a.on{border:1px solid #d90125; color:#d90125;}
.page a:hover{border:1px solid #d90125; color:#d90125}
.page a.none{pointer-events:none; opacity:0.3}
.respon_show{display:none}