@charset "UTF-8";
/* hhi */
* { margin: 0; padding: 0; box-sizing: border-box;}
body { word-break: break-word; color: #333; background-color: #fff; font-family: 'Nanum Gothic', sans-serif;}
body.on { overflow: hidden;}
a { text-decoration: none; color: #333;}
ul, li, ol {list-style: none;}
img { vertical-align: middle; max-width: 100%;}
.wrap { width: 1180px; margin: 0 auto;}
button { cursor: pointer; padding: 0;}
button, input { border: none; background:transparent; font-family: 'Nanum Gothic', sans-serif;}
button, :focus, :active { outline: 0;}
button:focus, button:active { padding: 0;}
button span, button img { position: relative;}
.hidden { text-indent: -99999px; overflow: hidden; font-size: 0; display: none;}
.cb:after, .adminBtn:after { clear: both; display: block; content: '';}
table {border-collapse: collapse;}


header {}
header .topInner {padding: 20px 0;}
header .topInner .logo { float:left;}
header .topInner ul {padding: 32px 0 0; float:right; font-size: 0; text-align: right;}
header .topInner ul li { display: inline-block;} 
header .topInner ul li a {padding-left: 28px; font-size: 14px; font-weight: bold; color: #666;}
header nav { border-top: 1px solid #dedede; border-bottom: 1px solid #dedede;}
header nav ul {}
header nav .gnb {float:left; width: 16.666%;}
header nav .gnb a {display: block; width: 100%; padding: 14px 0; text-align: center;}

.containerBox { position: relative;}
.sideMenu {position: absolute; top: 80px; right: 286px; transition: top 0.8s;}
.sideMenu.on {position: fixed; top:50%; margin-top: -64px; z-index: 999;}
.sideMenu li {display: table; width: 64px; height: 64px; background: #fadb32;}
.sideMenu li:nth-of-type(2) {background: #c99869;}
.sideMenu li a { display: table-cell; vertical-align: middle; width: 100%; height: 100%; text-align: center; font-size: 12px; color:#402c33;}
.sideMenu li:nth-of-type(2) a { color: #fff;}
.sideMenu li:nth-of-type(2) a img {padding-bottom: 12px;}
.sideMenu li a img {display: block; margin: 0 auto;}

footer {}
footer section { padding: 220px 0 85px;}
footer section { background: url('../img/footerTitle.png') no-repeat center top 64px/1180px auto;}
footer section ul li {float: left; width: 33.333%; display: table; text-align: center;}
footer section ul li img { display: block; margin: 0 auto;}
footer section ul li .list {display: table-cell; vertical-align: top; width: 100%; height: 100%;}
footer section ul .num1 {border-right: 1px solid #dedede; }
footer section ul .num1 strong {display: block; padding: 34px 0; font-size: 20px; font-weight: 700; color: #000;}
footer section ul .num1 p {padding-bottom: 26px; font-size: 32px; font-weight: bold; color: #e69f5c;}
footer section ul .num1 span {display: block; font-size: 16px;}
footer section ul .num2 .img { display: block; width: 100%; height: 170px; overflow: hidden;}
footer section ul .num2 .usLink {text-align: center;font-size:0; margin-top: 10px;}
footer section ul .num2 .usLink > span {display: inline-block;}
footer section ul .num2 .usLink > span:nth-of-type(2) {padding:0 42px;}
footer section ul .num2 .usLink > span a { display: block; font-size: 14px;font-weight: 700;}
footer section ul .num2 .usLink > span em { display: block; margin-bottom: 10px; width: 60px; height: 60px; border-radius: 50%; background: #f7f7f7 url('../img/icon04.png') no-repeat center top 50%/29px 27px;}
footer section ul .num2 .usLink > span:nth-of-type(2) em {background-image: url('../img/icon14.png');}
footer section ul .num2 .usLink > span:nth-of-type(3) em {background-image: url('../img/icon15.png');}


footer .bottomInner {padding: 20px 0; border-top: 1px solid #dedede; border-bottom: 1px solid #dedede;}
footer .bottomInner ul {float:left;margin-top: 14px;}
footer .bottomInner .sns {float:right;}

footer .bottomInner ul li {float:left; font-size:14px;}
footer .bottomInner ul li a {display: block; position: relative; padding: 0 18px;color:#666;}
footer .bottomInner ul li a::after { position: absolute; content: ''; width: 1px; height: 100%; right: 0; top: 0; background: #666;}
footer .bottomInner ul li:last-of-type a::after { display: none;} 
footer .sns {font-size: 0; text-align: right;}
footer .sns a {display: inline-block;padding-left: 30px;}
footer .addressInner {padding: 40px 0; background:#f7f7f7;}
footer address {font-style: normal; font-size: 0; text-align: left;}
footer address .left { float:left; padding-right: 55px;}
footer address .right { float:left;}
footer address span {display: inline-block; padding:0 13px; margin: 0 0 10px; position: relative; font-size: 14px; color: #888;}
footer address span::after { position: absolute; content: ''; width: 1px; height: 100%; left: 0; top: 0; background: #888;}
footer address span:nth-of-type(1)::after, footer address span:nth-of-type(4)::after {display: none;}
footer address p {padding-left: 13px; font-size: 14px; color: #888;}


@media screen and (max-width: 1880px){
    .sideMenu { position: absolute; right: 20px;}
    .sideMenu.on {right: 20px;}
}

@media screen and (max-width: 1220px){
    header, footer { width: 1200px;}
}