/*************************************************************************************************
*	@CreateDate          : 2015.02.10
*	@ModifyDate          : 2015.02.10
*	@FileName            : layout.css
*	@Author-Design       :
*	@Author-Publishing   : inspot_jin
*************************************************************************************************/

@charset "utf-8";

/* -------------------------------------------Layout------------------------------------------- */
.container { position:relative; width:1100px; min-width:1100px; margin:0 auto; }

.wrap { width:100%; min-width:1100px; background:#eee;}

#contents { min-height:300px; background:#fff; }

/* -------------------------------------------- main-nav ------------------------------------- */
#top-wrap { background-color: #211A10; height:130px;}
#top-wrap .top-bar { display: flex; justify-content: space-between; align-items: center; height:90px; background-color: #211A10; }
#top-wrap .top-bar:before { content: ''; width: 110px; }
/* #top-wrap .top-bar>p { float:left; } */
#top-wrap .top-bar>p.logo img { height: 50px; filter: brightness(0) invert(1); }
#top-wrap .top-bar>p.group-btn { align-self: flex-end; }
#top-wrap .top-bar>p.group-btn a { display:block; width:110px; height:60px; line-height: 60px;  }
#top-wrap .top-bar>p.group-btn a span { display: inline-block; width: fit-content; padding: 6px 11px; border-radius: 10px; background-color: transparent; color: #92836E; font-size: 11px; font-weight: 700; line-height: 1; white-space: nowrap;}
#top-wrap .top-bar>p.group-btn a:hover span { background-color: #92836E; color: #fff; }
#top-wrap .top-bar>p.fb-btn { margin-left:3px; }


#top-wrap .nav-bar { position:absolute; height:40px; z-index:999; width:100%; left:0; background-color:#513E2D; }
#top-wrap .nav-bar .nav1 { overflow:hidden; width:1100px; margin:0 auto; display: flex; justify-content: center; align-items: flex-start; }
#top-wrap .nav-bar .nav1>li { float:left; background-color:#513E2D; }
#top-wrap .nav-bar .nav1 .main-btn { width:157px; background:url(../../img/layout/main_navi_m1_btn_bg.png) no-repeat left 40px; }
#top-wrap .nav-bar .nav1 li:nth-child(1) .main-btn { flex: 1; }
#top-wrap .nav-bar .nav1 li:nth-child(2) .main-btn { width: 170px }
/*#top-wrap .nav-bar .nav1 .main-btn:hover { background-position:0 -40px; cursor:pointer; }*/

#top-wrap .nav-bar .nav1 .main-btn>a { display:block; width:100%; text-align:center; font-family: 'Open Sans', sans-serif; font-weight:600; color:#fff; line-height:40px; }

#top-wrap .nav-bar .nav1 .nav2 { background:#38322e; padding:8px 37px 31px 38px; display:none; }
#top-wrap .nav-bar .nav1 .nav2.sub2 { padding: 8px 27px 31px 28px; }
#top-wrap .nav-bar .nav1 .nav2.sub3 { display: none; width: 256px; overflow: hidden; position: absolute; padding: 8px 28px 31px 28x; }
#top-wrap .nav-bar .nav1 .nav2 li { display:block; border-bottom:1px solid #605b58; text-align:center; }
#top-wrap .nav-bar .nav1 .nav2.sub3 li { float: left; width: 108px; margin: 0px 10px; }
/* #top-wrap .nav-bar .nav1 .nav2 li:nth-child(10) { display:none; } */
#top-wrap .nav-bar .nav1 .nav2:not(.sub3) li:last-child { border-bottom:0; }
#top-wrap .nav-bar .nav1 .nav2 li a { display:block; margin-top:14px; color:#9b9998; line-height:30px;}
#top-wrap .nav-bar .nav1 .nav2 li a:hover { background:#605b58; color:#fff; }
#top-wrap .nav-bar .nav1 .nav2 li a.font-e { font-family: 'Open Sans', sans-serif; font-weight:400; white-space: nowrap; }
#top-wrap .nav-bar .nav1 .nav2 li a.font-k { font-family: 'Nanum Gothic', sans-serif; }
#top-wrap .nav-bar .nav1 .nav2.menu li { text-align: left; }
#top-wrap .nav-bar .nav1 .nav2.menu li .new { display: inline-block; background-color: #af937d; color: #000; padding: 2px 4px; border-radius: 16px; font-size: 10px; line-height: 1.2; font-weight: 600; transform: translateY(-2px); }

/* -------------------------------------------- sub_nav -------------------------------------- */

#sub-nav { position:absolute; width:220px; top:50px; z-index:999; }
#sub-nav>div { display:none; }
#sub-nav>div>h2 { border-bottom:2px solid #e6e6e6; }
#sub-nav>div>ul>li>a { display:block; font-size:14px; height:44px; line-height:44px; border-bottom:1px solid #e6e6e6; padding-left:20px; cursor:pointer; color:#6a6a6a; }
#sub-nav>div>ul>li>a:hover, #sub-nav>div>ul>li>a:focus { color:#000; background:#f4f4f4;}
#sub-nav>div>ul>li>a.selected { color:#000; background:#f4f4f4; font-weight:bold;}

/* -------------------------------------------- 본문바로가기 ------------------------------------- */

.skip { margin: 0px -1px -1px 0px; padding: 0px; width: 1px; height: 1px; line-height: 0; overflow: hidden; font-size: 0px; display: block; }
.skip:hover, .skip:active, .skip:focus { margin: 0px; padding: 5px 0px; width: 100%; height: auto; color: rgb(51, 51, 51); line-height: 1; text-indent: 10px; font-family: Tahoma; font-size: 12px; font-weight: bold; text-decoration: none !important; position: absolute; }

/* -------------------------------------------- 본문 contents ------------------------------------- */

/*#contents {  margin-left:270px; margin-top:50px; width:920px; min-height:700px; }
 #page { padding-bottom:80px; padding-top:40px;} */

/* -------------------------------------------- footer -------------------------------------- */
/* #footer-wrap { height:91px; background:url(../../img/layout/footer_bg.gif) repeat-x; } */
#footer-wrap { background:#dddddd; padding:30px 0 50px 0; overflow: hidden; min-width: 1100px;}
.banner_footer{width:100%; background:#fff;border-top:1px solid #ddd; min-width: 1100px;}
.banner_footer ul{margin:0 auto; text-align:center; font-size: 0;}
.banner_footer li{display:inline-block; vertical-align: bottom; }
.banner_footer li a { display: block; margin: 23px 0; padding: 0 25px; }
.banner_footer li img{}

#footer-wrap .footer-inner{margin:0 auto; position:relative; width: 1100px;font-weight: 400;}
#footer-wrap .footer-sns {position: absolute; right: 0; top: -5px; }
#footer-wrap .footer-section{font-size:0}
#footer-wrap .footer-section .arg,
#footer-wrap .footer-section .family{display:inline-block; margin-left: 10px; }

#footer-wrap .footer-section .arg ul{font-size:0}
#footer-wrap .footer-section .arg ul li{display:inline-block; font-size:14px; position:relative; padding:0 10px; height:27px; line-height:27px}
#footer-wrap .footer-section .arg ul li:first-child{padding-left:0}
#footer-wrap .footer-section .arg ul li:last-child:after{display:none;}
#footer-wrap .footer-section .arg ul li a{display:block; color:#222222; font-weight: 600;}
#footer-wrap .footer-section .arg ul li a:hover{text-decoration: underline;}

#footer-wrap .footer-section .family{position:relative;}
#footer-wrap .footer-section .family > p{position:relative; color:#222222; border:1px solid #222222; font-size:13px; width:100px; height:25px; line-height:25px; text-indent:9px; cursor:pointer; font-weight: 600;}
#footer-wrap .footer-section .family > p:after{position:absolute; content:""; height:4px; width:6px;  background:url(../../img/common/icon_selete_b.png); right:7px; top:11px;}

#footer-wrap .footer-section .family .family-on{position:absolute; background:#f5f5f5; border:1px solid #ddd; width:180px; box-sizing:border-box; top:27px; z-index:99999; left:0; display:none;}
#footer-wrap .footer-section .family .family-on ul{padding:5px 0; height: 125px; overflow-y: auto; overflow-x: hidden;}
#footer-wrap .footer-section .family .family-on ul li{font-size:13px; padding:5px 15px;}

#footer-wrap .copy-section{margin-top:20px}
#footer-wrap .copy-section .copy-add{font-size:12px;color:#666666; line-height:145%; width:70%; margin-left: 10px; }
#footer-wrap .copy-section .copy-right {font-size:11px; color:#666666; margin-top: 15px; margin-left: 10px; font-family: 'Open Sans', sans-serif; }


html.popup-lock {overflow: hidden; touch-action: none;}
.footer-popup-bg { position: fixed; z-index: 999999; top: -5000px; right: -5000px; bottom: -5000px; left: -5000px; display: none; background-color: rgba(0, 0, 0, 0.3);}
.footer-popup-wrap { position: fixed; z-index: 1000000; top: 50%; left: 50%; display: none; overflow: auto; text-align: center; -webkit-overflow-scrolling: touch; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); }
.footer-popup-wrap.active{ display: block; width: 40%; }
  /* Fix iPad, iPhone glitches */
  .footer-popup-bg,
  .footer-popup-wrap{ backface-visibility: hidden; -webkit-backface-visibility: hidden; }
  .footer-popup { box-sizing: border-box; width: 100%; margin-bottom: 10px; transform: translate3d(0, 0, 0); color: #2b2e38; text-align: center; display: inline-block; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); position: relative; overflow: hidden; }
  .footer-popup-cnt { background: #fff; font-size: 14px; line-height: 140%; text-align: left; padding: 40px 0 20px; color: #555; box-shadow: 3px 0px 20px rgba(0, 0, 0, 0.2);}
  .footer-popup-cnt h2{font-size:18px;padding-bottom:15px; color:#000; padding-left: 35px; padding-right: 35px; font-weight: 600; text-align: center; }
  .footer-popup-cnt .privacy-version-select { position: relative; display: flex; justify-content: flex-end; align-items: center; gap: 8px; padding: 0 35px 12px; }
  .footer-popup-cnt .privacy-version-select label { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
  .footer-popup-cnt .privacy-version-field { position: relative; display: block; min-width: 140px; }
  .footer-popup-cnt .privacy-version-field select { display: block; width: 100%; min-width: 140px; height: 32px; padding: 0 32px 0 10px; border: 1px solid #c8c8c8; font-size: 14px; line-height: 32px; color: #333; background: #fff; box-sizing: border-box; appearance: none; -webkit-appearance: none; -moz-appearance: none; cursor: pointer; }
  .footer-popup-cnt .privacy-version-arrow { position: absolute; right: 12px; top: 50%; width: 7px; height: 7px; margin-top: -2px; pointer-events: none; border-right: 1px solid #666; border-bottom: 1px solid #666; transform: translateY(-50%) rotate(45deg); }
  .footer-popup-cnt .text { padding: 0 35px; border-top:1px solid #c8c8c8; padding-top: 20px; max-height: 265px; overflow-y: auto; overflow-x: hidden;}
  .footer-popup-close{height: 15px; width: 15px;display: block; position: absolute; background:url(../../img/common/btn_close.png) no-repeat center; top:20px; right: 20px; border: 0; cursor: pointer;}
  .footer-popup-cnt table { text-align: center; margin-top: 8px; }
  .footer-popup-cnt table th, .footer-popup-cnt table td { border: 1px solid #000; padding: 4px 0; }
  .footer-popup-cnt table caption { position: absolute; margin: -1px; width: 1px; height: 1px; padding: 0; border: 0; white-space: nowrap; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); }

/* -------------------------------------------- main -------------------------------------- */
#main { position:relative; width:100%; min-width:1100px; max-width:1920px; height:939px; margin:0 auto; overflow:hidden; }

/* -------------------------------------------- sub -------------------------------------- */
/*#sub {}*/


/* -------------------------------------------- 20260630 popup -------------------------------------- */
.popup-260630 table { width: 100%; }
.popup-260630 table th { background-color: #eeeeee; }
.popup-260630 table td { padding: 4px; text-align: left; }
.popup-260630 thead th { border-bottom: none; }
.popup-260630 .title { color: #5294d5; font-weight: 600; }
.popup-260630 .bold { font-weight: 700; }
.popup-260630 .ta-c { text-align: center; }