@charset "utf-8";

/* 모든 디바이스 공통 */
/* 공통 레이아웃 border: 1px solid red; */

html{overflow-x:hidden;}

#wrap{width:100%;min-width:320px;  }
#wrapper {background:#58696a;}
#gnb,.innerWrap{margin: 0px auto;padding:0 8px;overflow:hidden}

/* topTitArea */
.topTitArea{padding-left:20px;border-bottom:1px solid #e2e2e2}
.topTitArea h3{float:left;padding:10px 0;font-size:13px;color:#454545}
.topTitArea .btnArea{float:right;}
.topTitArea .btnArea a{display:block;float:left;width:16px;height:14px;padding:10px;text-align:center;border-left:1px solid #e2e2e2}

.topTitArea .btnRArea a.on{background:url(../images/common/bg_on.png) no-repeat}
.topTitArea .btnRArea a{float:left;display:block;width:12px;height:12px;margin-left:5px;text-indent:-9999px;overflow:hidden;background:url(../images/common/bg_off.png) no-repeat}

.contBox{width:100%;border:1px solid #e2e2e2;}/*min-width:302px;*/

#header { position:relative; z-index:3; }
#header h1{margin:20px 0 10px; text-align:center; font-weight:bold; font-size:2.8em; font-family: "Varela Round","Helvetica Neue","Helvetica","Roboto","Arial",sans-serif;
    font-feature-settings: "kern", "liga", "pnum"; -webkit-font-smoothing: antialiased;}
#header h1 a {color:#a9fd00}
#header h1 a span {color:#fff; font-size:0.9em;}
#topArea{background-color:#494c51}
#topArea ul li{float:left;padding:10px 0;height:32px;line-height:32px;}
#topArea li a{color:#c5c3c4;}

#header #topArea .innerWrap .login{position:relative;min-width:300px;}
#topArea .login li{padding:0 2px;background:url(../images/common/bg_bar_01.gif) no-repeat left center}
#topArea .login li:first-child{background-image:none;}

#topArea .login li.end .csListArea{position:absolute;top:0px;right:0px;width:42px;height:20px;line-height:20px;padding:0 8px;margin:4px 0 0 8px;text-align:center;border:1px solid #3e4146;background-color:#606368;}
#topArea .login li.end .csListArea #csCenter{position:relative;background-color:#e2e2e2;}
#topArea .login li.end .csListArea #csCenter ul{position:absolute;left:-8px;top:0px;width:48px;height:60px;padding:0 5px;overflow-y:scroll;background-color:#e2e2e2}
#topArea .login li.end .csListArea #csCenter li{clear:both;background-color:#e2e2e2;background-image:none}
#topArea .login li.end .csListArea #csCenter .btn{position:absolute;top:4px;right:0px;}
#topArea .login li.end .csListArea a{color:#bec0bf;}
html.ie7 #topArea .csListArea .csList a.btn { margin-top:3px;}

/* search */
#header .search{position:relative;width:296px;hegith:32px;margin:0 auto 15px;border:3px solid #f59034;}
#header .search .inputArea{display:block;float:left;width:220px;padding:0 15px;text-align:left;background:url(../images/common/bg_search.gif) no-repeat left center;}
#header .search button.btnSrch{ margin:5px 0 0 5px;}
#header .search .inputArea input{width:175px;height:30px;padding:0 8px;margin-right:15px;border:0px;color:#999;background-color:transparent; line-height:30px;}

/* gnb */
#gnb{position:relative;margin-bottom:15px; z-index:3;}
#gnb .gnbMenu{height:35px;overflow:hidden;}
#gnb .gnbMenu li{float:left;}
#gnb .menuM li{line-height:35px;padding:0 5px;font-size:16px;font-weight:bold;background:url(../images/common/bg_bar_02.gif) no-repeat left center}
#gnb .menuM li:first-child{background-image:none;padding-left:0px;}
#gnb .menuM li a{color:#fff}

#gnb .btnArea{position:absolute;right:8px;top:0; z-index:10;}
#gnb .btnArea .dpBlock{float:left;height:13px;width:6px;padding:10px 13px 10px 14px;margin-left:-1px;color:#666;border:1px solid #e2e2e2;background-color:#fff;}
#gnb .btnArea .btnAll{position:relative;float:left; z-index:10;}
#gnb .btnArea .btnAll .dpBlock{background:#fff url(../images/common/ico_01.gif) no-repeat center}
#gnb .btnArea .btnAll .dpBlock span{display:none;}

/* btnAllMenu */
#gnb .btnArea .btnAllMenu{position:absolute;right:0;top:34px;width:138px;padding:2px 0;border:1px solid #66696c;background-color:#fff;z-index:3}
#gnb .btnArea .btnAllMenu li{display:block;float:none;border-top:1px solid #e2e2e2}
#gnb .btnArea .btnAllMenu li:first-child{border-top:0px;}
#gnb .btnArea .btnAllMenu li a{display:block;padding:10px 20px;font-size:13px;color:#666;}
#gnb .btnArea .btnAllMenu li a:hover{font-weight:bold;background-color:#f4f4f4}
#gnb .btnArea .btnAll.on .dpBlock{color:#fff;border:1px solid #66696c;background:#66696c url(../images/common/ico_01_on.gif) no-repeat center}

/* clearfix */
.clearfix:after { content: "."; display: block; height: 0; overflow: hidden; clear: both;}
html.ie .clearfix { zoom: 1;}

/* footer */
#footer{background-color:#fafafa; border-top:12px solid #494c51}
#footer .footMenuWrap{padding:7px 0;background-color:#7e8083}
#footer .footMenuWrap a{color:#fff}
#footer .footMenuWrap ul li{display:inline-block;padding:7px 1%;text-align:center;background:url(../images/common/bg_bar_03.gif) no-repeat left center;}
html.ie7 #footer .footMenuWrap ul li { display:inline;}

#footer .footMenuWrap ul li:first-child{padding-left:0px;background-image:none;}
#footer .footMenuWrap .innerWrap{position:relative}
#footer .footMenuWrap .innerWrap .btnTop{position:absolute;right:8px;top:-6px;padding:13px 15px 13px 27px;background:#5c5e61 url(../images/common/bg_top.png) no-repeat 13px center;}

#footer .copyRight h2{margin:20px 0}
#footer .copyRight address{margin:20px 0;line-height:18px;font-size:11px;color:#848484;font-style:normal}
#footer .copyRight em{font-size:10px;color:#aaa}

/* etcCenter */
.etcCenter{margin:30px auto}
.etcCenter li{display:inline-block;width:20%;margin:10px 2%;text-align:center}
html.ie7 .etcCenter li { display:inline;}


/*!
 * Tablet
 * min-width:768px and max-width:959px
 **/
html.tablet #gnb,
html.tablet .innerWrap{max-width:714px;padding:0 27px;}
html.tablet #gnb .btnArea{right:27px;}

html.tablet #topArea .unit{display:block;float:left}
html.tablet #topArea .login{float:right}
html.tablet #topArea .unit li{padding:0 15px;border-right:1px solid #929292;}
html.tablet #topArea .unit li:first-child{border-left:1px solid #929292;}
html.tablet .searchInput > ul > li.keyword > dl > dd .inputBox{width:90%;}

/* search */
html.tablet #header .innerWrap.center{width:470px;margin:10px auto;}
html.tablet #header .center h1{float:left;}
html.tablet #header .center .search{float:right;margin-top:15px;}

/* etcCenter */
html.tablet .etcCenter li{width:8%}

/* btnArea */
html.tablet #gnb .btnArea .btnAll .dpBlock{width:42px;padding:10px 8px 10px 6px;background:#fff url(../images/common/ico_01.gif) no-repeat 35px}
html.tablet #gnb .btnArea .btnAll.on .dpBlock{background:#66696c url(../images/common/ico_01_on.gif) no-repeat 35px}
html.tablet #gnb .btnArea .btnAll .dpBlock span{display:block;}
html.tablet #gnb .menuS{float:left;margin:11px 60px 0 0}
html.tablet #gnb .menuS li{padding:0 6px;background:url(../images/common/bg_bar_03.gif) no-repeat left center;}
html.tablet #gnb .menuS li:first-child{padding-left:0;background-image:none;}
html.tablet #gnb .menuS a{color:#666}

/* footer */
html.tablet #footer .copyRight address span{display:block}
html.tablet #footer .copyRight h2{float:left;margin-right:5%}
html.tablet #footer .copyRight .inner{float:left}
html.tablet #footer .footMenuWrap .innerWrap .btnTop{right:27px}
html.tablet .tourCenter {clear:both;}


/* ie7 */
html.tablet.ie7 #footer .copyRight h2 { float:none; margin-bottom:0;}


/*!
 * Desktop
 * min-width:960px
 **/
html.desktop #gnb,
html.desktop .innerWrap{max-width:960px;padding:0}

html.desktop #topArea .login{float:right}
html.desktop #topArea .unit{display:block;float:left}
html.desktop #topArea .unit li{padding:0 15px;border-right:1px solid #929292;}
html.desktop #topArea .unit li:first-child{border-left:1px solid #929292;}
html.desktop .searchInput > ul > li.keyword > dl > dd .inputBox{width:90%;}


html.desktop #gnb .btnArea{right:0px}
html.desktop #gnb .btnArea .btnL,
html.desktop #gnb .btnArea .btnR{display:none;}

html.desktop #gnb .menuM{float:left;}/* margin-right:80px */
html.desktop #gnb .menuS{float:right;margin:11px 60px 0 0}
html.desktop #gnb .menuS li{padding:0 6px;background:url(../images/common/bg_bar_03.gif) no-repeat left center;}
html.desktop #gnb .menuS li:first-child{background-image:none;}
html.desktop #gnb .menuS a{color:#fff}

/* search */
html.desktop #header .innerWrap.center{width:470px;margin:10px auto;}
html.desktop #header .center h1{}
html.desktop #header .center .search{float:right;margin-top:15px;}

/* btnArea */
html.desktop #gnb .btnArea .btnAll .dpBlock{width:42px;padding:10px 8px 10px 6px;background:#fff url(../images/common/ico_01.gif) no-repeat 35px}
html.desktop #gnb .btnArea .btnAll.on .dpBlock{background:#66696c url(../images/common/ico_01_on.gif) no-repeat 35px}
html.desktop #gnb .btnArea .btnAll .dpBlock span{display:block;}

/* etcCenter */
html.desktop .etcCenter {clear:both;}
html.desktop .etcCenter li{width:4.7%}


/* footer */
html.desktop #footer .copyRight address span{display:block}
html.desktop #footer .copyRight h2{float:left;margin-right:5%}
html.desktop #footer .copyRight .inner{float:left}
html.desktop #footer .footMenuWrap .innerWrap .btnTop{right:0}
/* .sideArea */
html.desktop .sideArea{display:block;}