spdp/*
제주넷 2017 레이아웃
*/
@import url(font.css);
body {font-family: "맑은 고딕"; letter-spacing:-0.5px;  min-width: 320px; overflow-x: hidden;}
h1,h2,h3,h4,h5,h6 {margin: 0; font-weight: bold;}
p, dl, ol, ul {margin: 0;}
.clearfix:after { clear:both; display:table; content:'';  }

i span{  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); border: 0; }


@media (min-width: 992px) {
  .container {position: relative;}
  .header {z-index: 100; position: relative; height: 130px; word-break: keep-all;   }
  .header .header-util-bg {width: 100%;  background: #f0f0f0; height: 40px; border-bottom: 1px solid #d8d8d8; position: absolute; top: 0;}
  .header .container {   height: 130px;}
  .header .header-site-link {height:40px; padding-top:10px;}
  .header .header-site-link li { float:left; padding-left:24px; padding-right:24px; background:url(../images/common/u_line.png) no-repeat left 5px;  }
  .header .header-site-link li:first-child { background:none;  }
  .header .header-site-link li a { color:#000;  }
  .header h1 {position: absolute; z-index:100;  top: 60px; left: 24;}
  .header h1 span { font-size:22px; letter-spacing:-0.5px; color:#fff;  font-family: 'NanumSquare';display:inline-block; vertical-align:middle;  }
  .header-util {position: absolute; top: 0px; right: 24px; padding-top:10px;  list-style: none; font-size: 0;}
  .header-util > li {display: inline-block; font-size: 14px;}
  .header-util > li > a {color:#000;}
  .header-util > li + li:before {content: "|"; padding: 0 20px; color: #000;}
  .header-util .dropdown-menu {right: 0; left: inherit; min-width: 100px;}

	#gnb:after {display:table; content:''; clear:both;   }
  .gnb {z-index: 0; position: absolute; padding-left:260px;  left: 0; top:70px; width: 100%;}
  .gnb .gnb-menus , .all-menu .gnb-menus {float:left; margin-left: 0 !important;}
  .gnb .gnb-menus h3, .all-menu .gnb-menus h3  {margin: 0 20px; font-weight:normal; }
  .gnb .gnb-menus h3 a, .all-menu .gnb-menus h3 a {display: inline-block; height: 60px; font-size: 18px; letter-spacing:-0.5px; padding: 5px 5px 0;  color: #000;}
  .gnb .gnb-menus h3 a:hover, .gnb .gnb-menus h3 a.active {border-bottom: 6px solid #ff8500; text-decoration: none;}
  h3 i {display: none;}
  .gnb .gnb-menus ul { display:none; position:absolute; background: rgba(0, 0, 0, .6); padding-top:15px; padding-bottom:15px;  top:60px; left:0px; right:0px; width:100%;  }
  .gnb .gnb-menus ul:after { clear:both; display:table; content:'';  }
  .gnb .gnb-menus ul li { letter-spacing:0.5px; float:left; padding: 0 16px;  }
  .gnb .gnb-menus ul li a, .all-menu .gnb-menus ul li a { color:#fff; font-size:16px; letter-spacing:-0.6px; font-weight: normal; }
  .gnb .gnb-menus ul li a:hover, .gnb .gnb-menus ul li a.active { font-weight: bold; color:#ff9601; text-decoration:underline;   }
  .gnb .gnb-menus1 ul li:first-child {  padding-left:280px;   }
  .gnb .gnb-menus2 ul li:first-child {  padding-left:280px;   }
  .gnb .gnb-menus3 ul li:first-child {  padding-left:380px;   }
  .gnb .gnb-menus4 ul li:first-child {  padding-left:250px;   }
  .gnb .gnb-menus5 ul li:first-child {  padding-left:380px;   }
  .gnb .gnb-menus6 ul li:first-child {  padding-left:620px;   }

  .all-menu {z-index: 100; position: absolute; /*background:url(../images/common/all_bg.jpg) no-repeat left top;*/ background: #fff; border-bottom: 2px solid #ffa202; width: 100%; left: 0; right: 0; top:40px;}
  .all-menu .gnb-menus {width: 16.6666%;}
  .all-menu .gnb-menus h3 {margin: 0; padding: 0; background: #ffa202; width: 100%;}
  .all-menu .gnb-menus h3 a {display: block; padding-top: 37px; height: 90px; width: 100%; font-weight: bold; text-align: center;}
  .all-menu .gnb-menus h3 a:hover, .all-menu .gnb-menus h3 a.active {border-bottom: none; text-decoration: none;}
  .all-menu .gnb-menus ul { min-height:230px; padding: 30px 10px 20px 30px; }
  .all-menu .gnb-menus ul li { padding-bottom:15px; letter-spacing:0.5px;}
  .all-menu .gnb-menus ul li a {color: #000; word-break: break-all;}
  .all-menu .gnb-menus ul li a:hover, .all-menu .gnb-menus ul li a.active { color: #000;  }

  .all-menu-view {z-index: 10;  position: absolute;  top:65px; right:100px; }
  .all-menu-view a {color: #666; font-size: 28px;}
  .all-menu-close {display:none;  position:absolute; bottom:-60px; right:0px;  }
  .all-menu-close a { color: #000; font-size: 26px; display: block; width: 60px; height: 60px; padding-top: 11px; background: #ffa202; text-align: center; }


  /*.header-search-view { position:absolute; top:75px; right:24px; z-index: 100; }
  .header-search-view a { color:#666; font-size:26px;  }
  .header-search-close { position:absolute; top:25px; right:24px;}
  .header-search-close a { color:#666; font-size:26px;  }
  .header-search {z-index: 101; position: absolute;text-align:center; display:none;  top: 40px; padding: 20px 0; left: 0px; width:100%; height: 90px; background: #ffa201; }
  .header-search h3 {color:#000; font-weight:normal; margin-bottom:20px; display: none;}
  .header-search input {width: 460px;border:0px;  height: 45px;background:#fff; margin-right:10px;  padding-left: 30px;  font-size: 20px;}
  .header-search button {width:65px; height:45px; background-color: #707070; color: #fff; border: 0; font-size: 26px;}*/

  .header-search-view { position:absolute; top:68px; right:24px;  }
  .header-search-view a { color:#666; font-size:26px;  }
  .header-search {position: absolute;text-align:center; display:none;  top: 130px; padding-top:30px; padding-bottom:30px; left: 0px; width:100%;  font-size: 0; background: #ffa201;  }
  .header-search h3 {color:#000; font-weight:normal; margin-bottom:20px; }
  .header-search input {width: 530px;border:0px;  height: 50px;background:#fff;border-radius:10px;  margin-right:10px;    font-size: 20px;}
  .header-search button {width:65px; height:50px; border-radius:10px;  background-color: #707070; vertical-align: top; color: #fff; border: 0; font-size: 25px;}




.footer { padding: 60px 0; z-index:100; position:relative; border-top: 1px solid #b2b2b2; background: #fff;}
.footer address {font-size: 14px; color: #555; float: left; letter-spacing: -0.5px;}
.footer .link-btn {float: left; padding-left: 25px;}
.footer .link-btn a {color: #000; font-weight: bold; font-size: 14px;}
.footer .sns-btn {float: left; padding-left: 90px;}
.footer .sns-btn a {display: inline-block; padding-right: 35px;}
.footer .footer-site {float: right;}
.footer .footer-site dl {position:relative;  width:140px; height:35px;}
.footer .footer-site dt a {display:block;  color:#000; padding: 5px; width:140px; height:35px; border-bottom: 1px solid #000;}
.footer .footer-site dt a i {float: right;}
.footer .footer-site dd {display:none;  position:absolute; width:100%;  bottom:36px;left:0px;  padding:10px 5px; border: 1px solid #555; background: #fff; }
.footer .footer-site dd a {letter-spacing:-0.7px; display:block; text-align:left;  width:100%; color:#000; padding:5px 0px;  }


#backtotop {    position: fixed;    bottom: 0;    right: 0;    z-index: 9999;    width: 60px;    height: 60px;    text-align: center;    line-height: 60px;    background: rgba(0,0,0,0.3);    font-size: 40px;    color: #fff;    cursor: pointer;    text-decoration: none;    /* transition: opacity 0.2s ease-out; */    opacity: 0;}
#backtotop.show {    opacity: 1;}
.show {    display: block !important;}

}




@media (min-width: 992px) and (max-width: 1199px) {

	.header-util > li + li:before {padding: 0 10px;}
	.gnb { padding-left:210px;  }
	.gnb .gnb-menus h3 {padding-right: 15px; font-weight:normal; }
	.gnb .gnb-menus1 ul li:first-child {  padding-left:150px;   }
	.gnb .gnb-menus2 ul li:first-child {  padding-left:250px;   }
	.gnb .gnb-menus3 ul li:first-child {  padding-left:100px;   }
	.gnb .gnb-menus4 ul li:first-child {  padding-left:150px;   }
	.gnb .gnb-menus5 ul li:first-child {  padding-left:470px;   }

	.all-menu-view {right: 60px;}
	.all-menu {background:url(../images/common/t_m_bg.jpg) no-repeat left top;}


	h3 i {display: none;}

	.footer address {width: 35%;}



}







@media (min-width: 1200px) {

}
@media (min-width: 992px) {

}
@media (min-width: 768px) {

}
