/* ------------------------------------------------------------------
 *  name : layout.css
 *  date: 2015.10.06
 * ------------------------------------------------------------------ */

body{min-width:1024px; background: #000;}
.wrapper{height:100%; min-height:99%;}


header{position: absolute; left:0; top:0; z-index:101; width:100%;}
header .inner-wrap{ min-width:1024px; padding-top:37px;  margin:0 auto;}
header .site-logo {display:block; width:140px; height:33px; margin:0 auto;  overflow: hidden;}
header .site-logo a{display: block; font-size: 12px;}
header .site-logo a img{width:100%;}
header nav{padding-top:7px; background: url('../images/common/bg-line-navi.png') repeat-x left bottom; }
header .gnb{}
header .gnb:after{display: block;  clear:both; content:'';}
header .gnb li{position:relative;  float:left; }
header .gnb li > a em.txt{display: inline-block; position:relative;  }
header .gnb > li{position:relative; width:33.333%; }
header .gnb > li > a{display: inline-block; line-height: 1; }

header .gnb li a i{display: inline-block; vertical-align:top; line-height: 1;}
header .gnb li a em.txt i{ background:url('../images/common/txt_gnb.png') no-repeat;  }
header .gnb li a em.txt i.over{position: absolute; left:0; top:0; width:0%; }
header .gnb li a span{position:absolute; left:-9999px; top:-9999px; visibility: hidden;}

header .gnb > li > a{ width:140px; height:9px; padding:26px 80px;}
header .gnb > li > a em.txt i{height:11px;}
header .gnb > li > a + ul{display:none; position: absolute; right:0; top:43px;  width: 650px; background: url('../images/common/blank.png') repeat 0 0; }
header .gnb > li > a + ul li{overflow: hidden; height:0px;}
header .gnb > li > a + ul a{display:block; position:relative;  padding:22px 0 0; height:39px; overflow: hidden; box-sizing:border-box;}
header .gnb > li > a + ul a em.txt i{display:block; width:100%; height:7px; margin-bottom:10px; overflow: hidden;}
header .gnb > li > a + ul a i.line{display:block; position:absolute; left:0; bottom:0; width:0; height:1px; background:#804033;}
header .gnb > li > a + ul li.hover a i.line{display:block; width:0; }

header .gnb li.gmn-1 > a em.txt i.base{width:136px; background-position:0 0;}
header .gnb li.gmn-1 > a em.txt i.over{background-position:0 -14px;}
header .gnb li.gmn-2{text-align: center;}
header .gnb li.gmn-2 > a em.txt i.base{width:103px; background-position:-186px 0;}
header .gnb li.gmn-2> a em.txt i.over{background-position:-186px -14px;}
header .gnb li.gmn-3{text-align: right; }
header .gnb li.gmn-3 > a em.txt i.base{width:155px; background-position:-343px 0;}
header .gnb li.gmn-3 > a em.txt i.over{background-position:-343px -14px;}
/*header .gnb li.gmn-3 > a + ul{width:620px;}*/

header .gnb li.gmn-3 li.submn-1 a em.txt i.base{width:74px; background-position: 0 -28px;}
header .gnb li.gmn-3 li.submn-1 a em.txt i.over{background-position: 0 -40px;}

header .gnb li.gmn-3 li.submn-2{padding:0 30px;}
header .gnb li.gmn-3 li.submn-2 a em.txt i.base{width:111px; background-position: -246px -28px;}
header .gnb li.gmn-3 li.submn-2 a em.txt i.over{background-position: -246px -40px;}

header .gnb li.gmn-3 li.submn-3{padding-right:30px;}
header .gnb li.gmn-3 li.submn-3 a em.txt i.base{width:127px; background-position: -97px -28px;}
header .gnb li.gmn-3 li.submn-3 a em.txt i.over{background-position: -97px -40px;}

header .gnb li.gmn-3 li.submn-4{padding-right:30px;}
header .gnb li.gmn-3 li.submn-4 a em.txt i.base{width:77px; background-position: -379px -28px;}
header .gnb li.gmn-3 li.submn-4 a em.txt i.over{background-position: -379px -40px;}

header .gnb li.gmn-3 li.submn-5 a em.txt i.base{width:109px; background-position: 0px -359px;}
header .gnb li.gmn-3 li.submn-5 a em.txt i.over{background-position: 0px -371px;}


header .def-menu{display:none;}
header .fix-menu{display:none; position:fixed; top:-100px; min-width: 700px; width:100%; background: #000; opacity: 0; filter:alpha(opacity=0); }
header .fix-menu .inner-wrap:after{display:block; clear: both; content:''; }
header .fix-menu .inner-wrap{position:relative; min-width:0; padding-top:0;}
header .fix-menu .site-logo{float:left; width:98px; height:23px; margin:18px 0 0 3.75%; }
header .fix-menu nav{float:right; margin-right:2.5%; padding:0;background: none;}
header .fix-menu .gnb li{width:auto;}
header .fix-menu .gnb li.gmn-2{padding:0 2px;}
header .fix-menu .gnb > li > a{width:auto; padding-left:25px; padding-right:25px;}
header .fix-menu .gnb > li.gmn-3 > a{width:auto; padding-left:25px; padding-right:30px;}
/*header .fix-menu .gnb > li > a + ul{margin-right: 30px;}*/
header .fix-menu .gnb > li > a + ul li{height:auto;}
header .btntgl-mgnb{display: none;}

#container{position:relative;  min-height:100%;}
#container .inner-contain{}
section{position:relative;  }

.btm-cmmon-wrap{position: relative; height:198px; padding-top:60px; box-sizing: border-box; overflow: hidden; background:#232323;}
.btm-cmmon-wrap:after {display: block; position: absolute; left: 0; top: 0; content: ''; width: 100%; height: 198px;}
.btm-cmmon-wrap .sns-btns {position: relative; z-index: 1;}
.btn-top-wrap{position: fixed; z-index: 20; bottom: 32px; width: 100%;}
.btn-top-wrap .inner-wrap{position: relative; width: 100%;  margin: 0 auto;}
.btn-top-wrap .btn-top {
    display: block;
    position: absolute;
    right: 5%; bottom: 0;
    z-index: 2;
    width: 22px;
    height: 82px;
}
.btn-top-wrap .btn-top .arr-top {display: block; position: relative; width: 22px; height: 105px; background: url('../images/common/arr_top.png') 0 0 no-repeat;}
.btn-top-wrap .btn-top .arr-top.active {background: none;}
.btn-top-wrap .btn-top .arr-top img {position: absolute; top:0; left: 0; display: block; width: 100%;}
.btn-top-wrap .btn-top .arr-top-txt {display: block; position: absolute; top: 75px; width: 22px; height: 7px; background: url('../images/common/arr_top_txt.png') 0 0 no-repeat;}
.btn-arr.down {display: block; width: 46px; height: 91px; bottom: 20px!important;}
.btn-top {display: block; position: fixed; right: 11.49%; bottom: 32px; z-index:2; width: 22px; height: 112px;}
.btn-top .arr-top {display: block; width: 22px; height: 105px; background: url('../images/common/arr_top.png') 0 0 no-repeat;}
.btn-top .arr-top-txt {display: block; position: absolute; top: 105px; width: 22px; height: 7px; background: url('../images/common/arr_top_txt.png') 0 0 no-repeat;}
.btn-arr.down {display: block; width: 46px; height: 81px; bottom: 30px!important;}
.btn-arr.down .arr-dn {display: block; width: 46px; height: 50px; overflow: hidden; background: url('../images/common/arr_down.png') 0 0 no-repeat}
.btn-arr.down .arr-dn img,
.btn-arr.down .arr-dn-txt img{display: block; width: 100%;}
.btn-arr.down .arr-dn-txt{display: block; width: 46px; height: 7px; margin-top:14px; background: url('../images/common/arr_dn_txt.png') 0 0 no-repeat}

.sns-btns{ width:254px; max-width:1600px; margin:0 auto; box-sizing: border-box; }
.sns-btns h2{position:relative; margin:0 auto 38px; text-align: center;}
.sns-btns h2:after{display: block; position:absolute; left:0; top:0; width:100%; height:100%; background: url('../images/common/blank.png') no-repeat; content: ''}
.sns-btns h2 a{display: block; font: 12px/1 'plutosans_M'; color:#ccc;}
.sns-btns ul:after{display: block;  clear:both; content:''; }
.sns-btns li{float:left;}
.sns-btns li a{display:block; box-sizing: border-box;}
.sns-btns li a:after{
    display: block;
    width:33px; height: 30px;
    padding:0;
    background: url('../images/common/sprite_sns.png') no-repeat;
    content: '';
    vertical-align: top;
}
.sns-btns li span{position:absolute; left:-9999px; top:-9999px;}
.sns-btns li.slink1{margin-right:49px}
.sns-btns li.slink2{margin-right:40px}
.sns-btns li.slink3{margin-right:32px}

.sns-btns li.slink1 a:after{background-position: 0 0}
.sns-btns li.slink2 a:after{background-position: -38px 0}
.sns-btns li.slink3 a:after{background-position: -76px 0}
.sns-btns li.slink4 a:after{background-position: -114px 0}

.sns-btns li.slink1.js-over a:after{background-position: 0 -30px}
.sns-btns li.slink2.js-over a:after{background-position: -38px -30px}
.sns-btns li.slink3.js-over a:after{background-position: -76px -30px}
.sns-btns li.slink4.js-over a:after{background-position: -114px -30px}

footer {background: #1b1b1b}
footer > .inner-wrap{position:relative; height:45px; margin:0 auto; padding:20px 3.75% 0; box-sizing: border-box;}
footer .ft-menu{position: absolute; top:13px; left:3.75%;  }
footer .ft-menu:after{display:block; clear:left; content:''}
footer .ft-menu ul{float:left; margin-left:-12px; }
footer .ft-menu li{}
footer .ft-menu li:after{display: none;}
footer .ft-menu li > a{display:inline-block; padding:4px 14px 2px 12px;  vertical-align:top; font: 12px/1.2 'plutosans_M'; color:#ccc;}
footer .ft-menu li > a span{display:inline-block; width:18px; overflow: hidden; white-space: nowrap; vertical-align: top;}
footer .ft-menu li > a span em{font-style: normal;}
footer .ft-menu li > a span em:first-child+em{display:none;}
footer .ft-menu li > a:after{
    display:inline-block;
    position:relative;
    left:5px; top:-1px;
    border-bottom: 6px solid #ccc;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    content: '';
    font-size: 0;
}
footer .ft-menu li:first-child{display: none; position: absolute; top: -57px;}
footer .ft-menu li.on:first-child{ display: block; }
footer .ft-menu li.first a {padding:18px 22px 18px 12px; background: #1b1b1b;}
footer .ft-menu li.first a:after{display: none;}
footer .ft-menu li.first a:hover{color:#804033;}
footer .ft-menu li.second{}
footer .ft-menu li.second.over a,
footer .ft-menu li.second.on a{color:#804033;}
footer .ft-menu li.second.over a:after{border-bottom-color: #804033;}
footer .ft-menu li.second.on a:after{
    top:0;
    border-bottom:none;
    border-top: 6px solid #804033;
}
footer .ft-menu .dotcom-site{float:left; height:19px; overflow: hidden;}
footer .ft-menu .dotcom-site:before{display: inline-block; position:relative; top:2px; width:1px; height:16px; margin:0 3px; background: #666;  content:''; vertical-align: top; }
footer .ft-menu .dotcom-site a{display: inline-block; padding: 4px 10px 2px; font: 12px/1.2 'plutosans_M'; color:#ccc;}
footer .ft-menu .dotcom-site a:hover{color:#804033;}
footer .ft-menu .dotcom-site a:after{display:none; width:120px; height:12px; background-position: -110px 2px;}

footer .copyright{width:100%;text-align: right;}
footer .copyright img{width:383px;}


.main-body{}
.main-body header{min-width: 1024px;}
.main-body header .inner-wrap{min-width:904px; max-width:1200px; width: 88.28125%;}
.main-body header .gnb > li > a{ width:auto; padding:26px 80px 24px;}
.main-body header .gnb > li > a + ul a{display:block; position:relative;  padding:27px 0 0; height:41px; overflow: hidden; box-sizing:border-box;}
.main-body footer{position: absolute; left:0; bottom:0; z-index: 1;  width:100%; min-width: 1024px;}
.main-body footer > .inner-wrap {max-width:1600px;}
.main-body .btm-cmmon-wrap{
    position: relative;
    right: 0; top:0;
    width: 100%; height: auto;
    padding-top: 0;
    background: none;
    overflow: visible;
}
.main-body .btm-cmmon-wrap:after {display: none;}
.main-body .sns-btns{
    position: absolute;
    right:0; top:-64px; z-index:1000;
    width:139px; height:30px;
    margin:0;
}
.main-body .sns-btns h2{position:absolute; left:-9999px; top:-9999px; visibility: hidden;}
.main-body .sns-btns h2:after{display: none;}
.main-body .sns-btns h2 a{padding:10px 0;}
.main-body .sns-btns h2 a:after{}
.main-body .sns-btns ul{}
.main-body .sns-btns li a:after{width:25px; height:20px;}
.main-body .sns-btns li.slink1{margin-right:14px;}
.main-body .sns-btns li.slink2{margin-right:15px;}
.main-body .sns-btns li.slink3{margin-right:10px;}

.main-body .sns-btns li.slink1 a:after{background-position: 0 -63px}
.main-body .sns-btns li.slink2 a:after{background-position: -39px -63px}
.main-body .sns-btns li.slink3 a:after{background-position: -79px -63px}
.main-body .sns-btns li.slink4 a:after{background-position: -115px -63px}

.main-body .sns-btns li.slink1.js-over a:after{background-position: 0 -87px}
.main-body .sns-btns li.slink2.js-over a:after{background-position: -39px -87px}
.main-body .sns-btns li.slink3.js-over a:after{background-position: -79px -87px}
.main-body .sns-btns li.slink4.js-over a:after{background-position: -115px -87px}

/* loading */
.loader {position: fixed; top:0; left:0; width: 100%; height: 100%; z-index:1000; background: #000;}
.loader .progress {position: absolute; top:50%; left:50%; width: 0%; height: 1px; background: #666666;}
.loader .loader-logo {position: absolute; top:50%; left:50%; margin-left: -100px; margin-top: -98px;}
.loader .loader-txt {position: absolute; top:50%; left:50%; margin-left: -132px; margin-top: 50px;}
.loader .loader-txt p{
    width:280px; margin:0 auto;
    font:20px/1.9 'plutosans_EL';
    letter-spacing:5px; word-spacing:3px;
    color: #ccc; text-align: center;
}
.loader .loader-txt p:before{display:inline-block; width:2px; height:5px; content:'';} /* text - align */

/* quick menu */
.quick-menu{ }


/* popup */
#overlay {
    background: pink;
    position: fixed;
    top:0; left:0;
    bottom:0; right:0;
    width: 100%; height:100%;
    background: #000;
    z-index: 1000;
    opacity:1;
    filter:alpha(opacity=0);
}

.popup{
    position: fixed;
    top:50%; left:50%;
    width: 370px;
    padding: 46px 40px 40px;
    box-sizing: border-box;
    background: #fff;
    z-index: 1001;
}

.popup .pop-inner-wrap{}
.popup .close-pop{
    position: absolute;
    right:28px; top:22px;

}
.popup .close-pop a{ display: block;}
.popup .close-pop a span{position: absolute;left:-9999px; top:-9999px;}
.popup .close-pop a:after{display:block; content:'';}

.popup.youtube-pop{width:100%; left:0; top:0; bottom:0; padding:0; background: #000;}
.popup.youtube-pop iframe{width:100%; height:100%;}
.popup.youtube-pop .close-pop{top:4%; right:1.14%;}
.popup.youtube-pop .close-pop a{padding:10px; }
.popup.youtube-pop .close-pop a:after{width: 22px; height: 22px;background: url('../images/common/sprite_common.png') no-repeat  right top;}

.alert-holder{height:50px; line-height: 50px; color:#ff0000}



@media only screen and (min-width:1280px) and (max-width:1920px){
	/* widht: 1280~1920px */
}


@media only screen and (max-width:1600px){
    .btn-top-wrap .btn-top{right:4.7%;}
}
@media only screen and (max-width:1279px){
    /* widht: 1279px 이하 */
}

@media only screen and (max-width:1023px){
    /* widht: 1023px 이하 */
}