@charset "utf-8";
/* Reset */
html,body{min-height:100%}
body{margin:0}

/* Skin to content */
.skip{margin:0}
.skip>a{display:block;text-align:center;line-height:28px;height:1px;overflow:hidden}
.skip>a:focus{height:auto}

/* Layout */

/* 반응형 시작 */

@media all and (max-width: 1200px) {
        .container,
        .footer_contents>p{width:96%;margin:0 auto}
}
@media all and (min-width: 1200px) {
        .container,
        .footer_contents>p{width:960px;margin:0 auto}
}

/* 반응형 끝 */

.header{position:relative;z-index:2;zoom:1;margin:0 0 17px 0}
.header>.side{position:absolute;z-index:2;right:0;bottom:57px;zoom:1}
.visual{position:relative;z-index:1;overflow:hidden;width:100%;margin:0 0 20px 0}
.body{position:relative;z-index:1}
.header:after,
.body:after{content:"";display:block;clear:both}
.content{padding:0 0 40px 0;zoom:1}
.content>*:first-child{margin-top:0}
.content img{max-width:100%;height:auto}

/* Header */
.header>h1{display:inline-block;*display:inline;zoom:1;margin:19px 0}
.header>h1>a,
.header>h1 img{display:block}
.header>h1>a{font-family:'Apple SD Gothic Neo','AppleGothic','Tahoma','맑은 고딕','Malgun Gothic','dotum';font-weight:bold;font-size:32px;text-decoration:none;color:#333}

/* Footer */
.footer{padding:2em 2em 4em 2em;background:#f8f8f8;border-top:1px solid #f4f4f4;color:#666;text-align:center;}
/*.footer p{font-size:12px}*/
.footer a{text-decoration:none;color:#666}
.footer a:hover,
.footer a:focus{text-decoration:underline}

/* 반응형 시작 */

@media all and (max-width: 1200px) {
        .footer_contents{width:96%;margin:0 auto}
}
@media all and (min-width: 1200px) {
        .footer_contents{width:960px;margin:0 auto}
}

/* 반응형 끝 */

/* Login */
.account{margin-right:15px !important}

/* Search */
.header .search{display:inline-block;*display:inline;zoom:1;vertical-align:top;margin:0}
.header .search>input{font-size:12px;vertical-align:top;border-radius:2px}
.header .search>input[type="text"]{background:#e5e6e8;border:1px solid #dedede;height:21px;line-height:21px;padding:0 4px;margin:0 -6px 0 0;width:126px}
.header .search>input[type="submit"]{background:#484d51;border:1px solid #272b30;color:#fff;height:23px;line-height:23px;padding:0 15px;margin:0;cursor:pointer;box-shadow:0 1px 0 #6d7174 inset}

/* GNB */
.gnb{position:relative;z-index:1;border:1px solid #080808;font-size:13px;height:31px;clear:both;background-color:#080808;background:-webkit-linear-gradient(top, #2e2d32, #0c0c0e);background:-moz-linear-gradient(top, #2e2d32, #0c0c0e);background:-o-linear-gradient(top, #2e2d32, #0c0c0e);background:-ms-linear-gradient(top, #2e2d32, #0c0c0e);background:linear-gradient(top, #2e2d32, #0c0c0e);filter:progid:DXImageTransform.Microsoft.gradient(startColorStr=#2e2d32, endColorStr=#0c0c0e)}
.gnb:before{content:"";display:block;background:#3e3e40;width:100%;height:1px}
.gnb ul{margin:0;padding:0;list-style:none}
.gnb a{text-decoration:none;white-space:nowrap}
.gnb>ul{position:absolute;top:32px;left:-1px;right:-1px;background:#464d5d;opacity:.98;filter:alpha(opacity=98);height:0}
.gnb.open>ul{height:auto;border-bottom:1px solid #333}
.gnb>ul:after{content:"";display:block;clear:both}
.gnb>ul>li{position:relative;top:-32px;float:left;margin:0 -1px -8px 0}
.gnb>ul>li>a{display:block;border-left:1px solid #3e3e40;border-right:1px solid #3e3e40;line-height:32px;padding:0 20px;color:#fff;position:relative}
.gnb>ul>li>a:after{content:"";position:absolute;width:1px;height:100%;right:0;top:0;background:#080808;overflow:hidden}
.gnb>ul>li.active>a,
.gnb>ul>li.hover>a{border-top:1px solid #4a505c;line-height:30px;padding-bottom:1px;background-color:#2f333b;background:-webkit-linear-gradient(top, #383c45, #0c0d0f);background:-moz-linear-gradient(top, #383c45, #0c0d0f);background:-o-linear-gradient(top, #383c45, #0c0d0f);background:-ms-linear-gradient(top, #383c45, #0c0d0f);background:linear-gradient(top, #383c45, #0c0d0f);filter:progid:DXImageTransform.Microsoft.gradient(startColorStr=#383c45, endColorStr=#0c0d0f)}
.gnb ul ul{display:block;position:relative;z-index:2;padding:0 20px;margin:0 0 0 -1px;border-left:1px solid #424856;height:0;overflow:hidden}
.gnb.open ul ul{margin-top:6px}
.gnb ul ul:before{content:"";position:absolute;left:0;top:0;width:1px;height:100%;background:#4b5265}
.gnb.open ul ul{padding:13px 20px;height:auto}
.gnb>ul>li:first-child>ul{border:0}
.gnb>ul>li:first-child>ul:before{content:normal}
.gnb ul ul a{display:block;line-height:20px;font-size:12px;color:#fff}
.gnb ul ul a:hover,
.gnb ul ul a:focus{text-decoration:underline}

/* Visial */
.visual>.list{position:relative;width:300%;left:-100%;z-index:1}
.visual>.list:after{content:"";display:block;clear:both}
.visual>.list.total1{width:auto;left:0}
.visual img{display:block;max-width:100%;height:auto;margin:0 auto}
.visual a{display:block;float:left;position:relative;color:#fff;text-decoration:none;font-family:Corbel,Arial,Helvetica,sans-serif}
.visual a[href=""]{cursor:default}
.visual .total1 a{float:none}
.visual .total2 a,
.visual .total3 a{width:33.33%;}
.visual a>p{margin:-24px 0 0 0;padding:0 100px;position:absolute;top:50%;left:0;right:0;text-align:center;font-size:47px;letter-spacing:-1px;line-height:1}
.visual.sub a>p{font-size:32px;text-align:left}
.visual>button{zoom:1;border:0;background:url(blank.gif);cursor:pointer;width:100px;position:absolute;z-index:2;top:0;bottom:0;margin:0;padding:0;color:#fff}
.visual>button:hover,
.visual>button:focus{background-color:rgba(0,0,0,.25)}
.visual>button>i{position:absolute;top:50%;left:50%;width:25px;height:50px;background:url(slideNav.png) no-repeat;margin:-25px 0 0 -12px;zoom:1}
.visual>.prev{left:0}
.visual>.next{right:0}
.visual>.prev>i{background-position:0 0}
.visual>.next>i{background-position:-25px 0}

/* LNB */
.body.sub .lnb{float:left;width:210px;margin:0 0 40px 0}


/* 반응형 시작 */

@media all and (max-width: 1200px) {
       .body.sub .content{float:right;width:72%}
}
@media all and (min-width: 1200px) {
       .body.sub .content{float:right;width:720px}
}

/* 반응형 끝 */


.body.sub .lnb>h1{margin:0;position:relative;z-index:2}
.body.sub .lnb>h1>a{display:block;line-height:36px;padding:0 18px;border-radius:3px;color:#fff;text-decoration:none;font-size:14px;border:1px solid #939395;background-color:#19191b;background:-webkit-linear-gradient(top, #2d2c31, #0c0c0e 80%, #131418 80%);background:-moz-linear-gradient(top, #2d2c31, #0c0c0e 80%, #131418 80%);background:-o-linear-gradient(top, #2d2c31, #0c0c0e 80%, #131418 80%);background:-ms-linear-gradient(top, #2d2c31, #0c0c0e 80%, #131418 80%);background:linear-gradient(top, #2d2c31, #0c0c0e 80%, #131418 80%);zoom:1}
.body.sub .lnb ul{list-style:none;margin:0;padding:0}
.body.sub .lnb ul a{display:block;text-decoration:none;color:#333;font-size:13px}
.body.sub .lnb>ul{position:relative;z-index:1;border:1px solid #dcdcdc;padding:1px;margin:-1px 0 0 0;border-radius:3px}
.body.sub .lnb>ul>li>a{line-height:36px;padding:0 10px 0 18px;border-top:1px solid #eee}
.body.sub .lnb>ul>li.active>a,
.body.sub .lnb>ul>li>a:hover,
.body.sub .lnb>ul>li>a:focus{background:#f5f5f5;color:#3192d7}
.body.sub .lnb>ul>li:first-child>a{border-top:0}
.body.sub .lnb ul ul{padding:10px 0;border-top:1px solid #eee}
.body.sub .lnb li li>a{line-height:20px;padding:0 10px 0 25px}
.body.sub .lnb li li.active>a,
.body.sub .lnb li li>a:hover,
.body.sub .lnb li li>a:focus{background:#f5f5f5;color:#3192d7}


/*각 페이지 */

.titlebox     { margin:0 1.2em 1.2em 1.2em;padding:0.2em 1.5em;border:6px solid #666666;} /*각페이지최상단박스임*/
.box          { margin:1.2em;padding:0.5em 1.5em;border:1px solid #E1E1DD;} 
.imagebox { margin:1.2em;padding:0.5em 1.5em;border:1px solid #E1E1DD;}
.box h1{color:black;font-size:1.1em; border-bottom: 16px solid #666; margin:0 10em 10px 2em; padding: 10px}
.imagebox h1{color:black;font-size:1.1em; margin:0 10em 10px 2em; padding: 10px}
.box h2{color:black;font-size:1.1em; border-bottom: 16px solid #666; margin:0 10em 10px 2em; padding: 10px}
.imagebox h2{color:black;font-size:1.1em; margin:0 10em 10px 2em; padding: 10px}
.telephone_guide { margin:1.2em;padding:0.5em 1.5em 0.5em 5em;border:1px solid #E1E1DD;} 
.telephone_guide span {font-size:1.1em;font-weight:bold;color:red}
strong{ color:#2E3641; important!}
.strong_white{color:#FFFFFF;}
.strong_black{color:#555555;}
p{line-height:1.7em}
span{line-height:1.7em}
/*.highlighterA{background-color:#7DFB00;}연두형광펜 보기싫어 삭제함. 타사이트 활용하자*/


/*메인페이지상단박스 */
.mainTitleBox {border:1px solid #E1E1DD; margin:2px 4px 3px 0;padding:0;}
/*메인페이지 6개의 이미지박스 */
.mainImageBox {width:251px;float:left;border:1px solid #E1E1DD; margin: 1px 1px 3px 1px; padding:0;}
/*키워드맞춤페이지 하단박스 */









h1{color:#5e5e5e;font-size:1.1em;} 
.titlebox h2{color:black;font-size:1.1em; border-bottom: 8px solid #ff6600; padding-bottom: 10px;}

.textbox h2{color:black;font-size:1.1em; border-bottom: 8px solid #ff6600; padding-bottom: 10px;}
/* h2는 그 페이지의 타이틀. 검은색이고 1.1배로 아래 h3와 같다. 너무 크게하면 보기 싫기 때문. 그래도 검색에서 중요도는 달리 취급된다.8픽셀짜리 굵은 주황색 밑줄. 아래 내부여백은 10픽셀 */


.box h3 {color:#FF6600;/*주황폰트*/ font-size:1.1em;text-decoration:none;border-left: 10px solid #ff6600;/*주황좌측바*/padding: 0.1em 2em 0.1em 1em; }
.applybox h3 {color:#FF6600;/*주황폰트*/ font-size:1.1em;text-decoration:none;padding: 0.1em 2em 0.1em 1em; }
td h3 {color:#FF6600;/*주황폰트*/ font-size:1.1em;text-decoration:none;padding: 0.1em 2em 0.1em 1em; }
/*applybox는 각p신청하기버튼이 있는 박스로 box와의 차이는 주황좌측바가 없다는 것*/
/* 이하 3가지 다 box종류 안의 소타이틀. h3 폰트. 1.1배. 그리고 좌측바와 패딩*/
.box h3{color:#66cc00;/*연두폰트*/font-size:1.1em;border-bottom: 5px solid #66cc00;/*연두밑줄*/padding: 1em 2em 1em 1em; } 
.boxB h3{color:#FF6600;/*주황폰트*/font-size:1.1em;border-left: 10px solid #FF6600;/*주황좌측바*/padding: 0.1em 2em 0.1em 1em; }
.boxC h3{color:#008000;/*초록폰트*/font-size:1.1em;border-left: 10px solid #008000;/*초록좌측바*/padding: 0.1em 2em 0.1em 1em; }
.boxC h3{color:#666666;/*회색폰트*/font-size:1.1em;border-left: 10px solid #666666;/*회색좌측바*/padding: 0.1em 2em 0.1em 1em; }




.boxContent {/*margin-top:0.5em;*/padding: 0em 2em 0.25em 2em;}/*boxContent는 위 외부여백이 0.5em, 내부여백은 상하좌우가 각각 다르다*/
/*#telephonRight { position:relative; width:201px; float:left;background:url(../images/white/phone.jpg) no-repeat right center;}*/

blockquote{border:1px solid #ff8800;padding:.5em 1.5em;}
.Squ {padding:2em 2em; margin-bottom: 1.5em;border: solid 1px #558800;}  
.SquareB {padding: 0.1em 2em 0.1em 1em;margin-bottom: 1.5em;border: solid 1px #006600;}  
.SquareC {padding: 0.1em 2em 0.1em 1em;margin-bottom: 1.5em;border: solid 1px #666666;} 

.numberA {font-family:arial black; font-weight:bold; color:#ff6600;  font-size:1.1em;}
.numberB {font-family:Gulim;font-weight:bold;  }

/*ol과 ul의 변화*/

/*ol li {font-weight:bold;color:#ff6600;} */  /*참고로 이 볼드체 방법은 ul에는 먹히지 않는다. font가 아니라고 봐서인것 같다.*/
ol li span {font-weight:normal; color:#000000;}
ul li span {font-weight:normal; color:#333333;}
/*위의 두줄은 li span 안에 있는 것은 전부 검은색 보통 글꼴이라는 것이다. */

/*여기서부터 테스트*/
ol.ordered_listA{font-weight:bold;color:#ff6600;font-family:arial black;}
ol.ordered_listB{font-weight:bold;color:#66cc00;}
/*여기까지 테스트*/

ul.bulletA {list-style-type: disc;color: #ff6600;/*주황색 동그라미*/}
ul.bulletB {list-style-type: disc;list-style-position:outside;/*inside라고 하면 안으로 들어감*/color: #66cc00; /*연두색 동그라미*/}
ul.bulletC {list-style-type: circle;color: #ff6600;  /*주황색 써클*/}
ul.bulletD {list-style-type: circle;color: #66cc00; /*연두색 써클*/}
ul.bulletE {list-style-type: square;color: #ff6600;  /*주황색 사각형*/}
ul.bulletF {list-style-type: square;color: #66cc00; /*연두색 사각형*/}