@charset "utf-8"; /* uracle pjt-team */ #wrapper > .header {height:126px;z-index: 999;max-width:1500px;width:100%;padding-top:25px;box-sizing: border-box;position: relative;} /*newsletter agree*/ .header_2news{height:80px;z-index: 999;width:100%;top:0px;padding:15px 0;overflow: hidden;box-sizing: border-box;z-index:9999;position:relative;margin: 0 auto;background:#243560;} .header_2news h1 {position:relative;width: 100%;height: 80px;z-index: 105;display:inline-block;left:40%;overflow: hidden;} .header_2news h1 p{display: inline-block;float: left;} .header_2news > h1 ul > li{display:block; font-size:1.0rem;font-weight: 700;line-height: 25px;text-align: left;text-indent: 10px;} .header_2news h1 .font-Whit{color:#fff;padding-left:10px;} .header_2news h1 .font-Blue{color:yellow;font-weight: 700;} /*logo*/ .header .head_warp{text-align: right;} .header .head_warp:after {content: '';display: block;clear: both;} .header .head_warp h1 {position: relative;min-width: 200px;width:22.4%;height: 80px;z-index: 105;float:left;text-align: left;} .header .head_warp h1 img{width:100%;} .header .head_warp h1 .logo{float:left;width: 165px;} .header .head_warp h1 li{display:inline;font-size:1.0rem;font-weight: 700;/*word-spacing:-10px;*/display: block;line-height: 25px;text-indent: 10px;} .header .head_warp h1 .font-Whit{color:#fff;padding-left:10px;} .header .head_warp h1 .font-Blue{color:#000d2c;font-weight: 700;word-spacing: -1px;letter-spacing: -1px;} /*.header .header_nav.open {background: linear-gradient( to bottom, #193477, #0d1b3b );height: auto;z-index: 105;}*/ .header .header_nav .pc_menu_bg {display:none;} .header .header_nav.open .pc_menu_bg { display: block;background: linear-gradient( to bottom, #193477, #0d1b3b ); position: absolute;left: 0;right: 0;height: 400px;z-index: 0;top: 0;z-index: 104;} /*언어선택*/ .header.open .lang{display:block;width: 111px;position: absolute;top: 3px;right: 0;} /*언어선택*/ .header .lang{display:block;width:10%;min-width: 111px;position: relative;float: right;z-index: 106;} .header .lang > a {width: 110px;height: 34px;line-height: 34px; position: relative; display: inline-block;padding-right: 1rem;font-size: .8rem;text-align: left;color: #606060;background:#fff; border-radius: 3.6rem;z-index: 2;} .header .lang > a span{display:block;padding: 0px 16px;/*padding: 7px 16px 12px 16px;*/background:url(../../image/front/new/ico_language.png) no-repeat right center;white-space: nowrap;} .header .lang-content{display: none;position: absolute;right:0px;top:0;width: auto;margin: auto;padding-bottom: .4rem;border-radius: 1.1rem;background: #fff;padding-top:35px;} .header .lang-content > li{display: block; } .header .lang-content > li > a {display: block;width: 111px;padding: 6px 16px;color:#606060;font-size: .7rem;text-align: left;} .header .lang-content li a:hover {background:#446ab8;color:#b7ccff;} .header .lang:hover .lang-content {display: block;} /***메뉴**/ .title {display: none;} .btn-setting {display: none;} .menu_bg {display:none;} .header .header_nav:after {content: '';display: block;clear: both;} .header .header_nav {min-width: 500px;display: inline-block;width: 67%;margin: auto;position: absolute;top: 0; padding-top: 25px;left: 22.4%;} .header_nav div {position: relative;margin: 0;box-sizing: border-box;font-size: 0;text-align: center;} .header_nav > div > ul {box-sizing: border-box;font-size: 0;} .header_nav > div > ul > li {position: relative; display: inline-block; font-size: 0;vertical-align: top;word-break: break-word; padding: 0 1px;} /* 20200617 추가 및 수정 */ /* menu 1 item 20200622 추가 및 수정 */ .header_nav > div > ul > li.gnb_list:first-child:nth-last-child(1) {width: 100%;} /* menu 2 item 20200622 추가 및 수정 */ .header_nav > div > ul > li.gnb_list:first-child:nth-last-child(2),li.gnb_list:first-child:nth-last-child(2) ~ li.gnb_list {width: 50%;} /* menu 3 item 20200622 추가 및 수정 */ .header_nav > div > ul > li.gnb_list:first-child:nth-last-child(3),li.gnb_list:first-child:nth-last-child(3) ~ li.gnb_list {width: 33.33333%;} /* menu 4 item 20200622 추가 및 수정 */ .header_nav > div > ul > li.gnb_list:first-child:nth-last-child(4),li.gnb_list:first-child:nth-last-child(4) ~ li.gnb_list {width: 25%;} /* menu 5 item 20200622 추가 및 수정 */ .header_nav > div > ul > li.gnb_list:first-child:nth-last-child(5),li.gnb_list:first-child:nth-last-child(5) ~ li.gnb_list {width: 20%;} /* menu 6 item 20200622 추가 및 수정 */ .header_nav > div > ul > li.gnb_list:first-child:nth-last-child(6),li.gnb_list:first-child:nth-last-child(6) ~ li.gnb_list {width: 16.66666%;} /* menu 7 item 20200622 추가 및 수정 */ .header_nav > div > ul > li.gnb_list:first-child:nth-last-child(7),li.gnb_list:first-child:nth-last-child(7) ~ li.gnb_list {width: 14.28571%;} .header_nav > div > ul > li > a {display: block;text-align: center;font-size: 1.1rem;color: #fff;font-weight: 500;height: 50px;padding-top: 3px;/*outline:none; */} /* 20200617 추가 및 수정 */ .header .header_nav.open .menu_sub {position: absolute;top: 40px;left: 0;right: 0; padding: 10px 0;display: none;height: auto;overflow: hidden;} /* 20200618 top:38px에서 40px로 수정 */ .header .header_nav.open li:last-of-type .menu_sub {} .header .header_nav.open .menu_sub li {display: block;width: 100%;} .header .header_nav.open .menu_sub a {display: block;text-align: center;padding:10px 0;font-size: .9rem;color: #b7ccff;font-weight:500;} .header .header_nav.open .menu_sub a:hover {text-decoration:none; background: #fdd034;color: #0d1b3b;font-weight: 700;} .header .header_nav.open .menu_sub {display:block;} .header .header_nav.open div {position: relative;/*color: #b7ccff;*/z-index: 105;} .content.m_open {margin-top:126px;} /******** Visual 영역 ****** #content{position:relative;top:0px;}*/ html:lang(ar) .no_scroll .header_nav {right:auto;left: 0;} html:lang(ar) .no_scroll .header_nav .title {color: #2c4178} html:lang(ar) .header_nav > div > ul > li > a {text-align: center;} html:lang(ar) .header_nav > div > ul > li > a:after {float: left;} html:lang(ar) .header .header_nav > div > ul > li > a.open-mob + .menu_sub a {text-align: right;} html:lang(ar) .header .header_nav.open .menu_sub a {text-align: center;} html:lang(ar) .header .head_warp h1 li {word-spacing: -10px;} html:lang(vi) .header_nav > div > ul > li {word-spacing: -2px;} html:lang(ar) body {font-family: 'Arabic Transparent', arial, sans-serif;direction: rtl;} html:lang(ar) .header .head_warp h1 {min-width: 350px;float: right;text-align: right;} html:lang(ar) .header .head_warp h1 .logo {float: right;} html:lang(ar) .header .head_warp {text-align: left;} html:lang(ar) .header .header_nav {direction: rtl;float: right;width: 67%;right: 22.4%;left: auto;} html:lang(ar) .header .lang {float: left;width: auto;} html:lang(ar) .header .head_warp h1 .font-Blue {text-align: right;} html:lang(ar) .header .head_warp h1 .font-Whit {text-align: right;} html:lang(ko) .header_nav > div > ul > li > a {line-height: 40px;} /* 20200617 추가 */ @media all and (min-width:767px) and (max-width:1024px) { #wrapper > .header {height: 90px;padding-top: 10px;} .head_warp h1 a > ul { padding-top: 5px;} /* .header .head_warp h1 {width: 40%;top: 14px;} .header .head_warp h1 p{float:left;overflow: hidden;width:140px; } .header .head_warp h1 .logo img{width:92%;margin-left: .5rem;} .header .head_warp h1 li {line-height: 1.3rem;}*/ /*언어선택*/ #wrapper .header .lang{right:50px;top: 9px;position: absolute;} /*menu*/ .no_scroll {overflow: hidden;height: 100%;} .btn-setting {display: block;position: absolute;right: 10px;height: 30px;font-size: 0;z-index: 107;} .btn-setting:before {content:"\f0c9";display: block;width: 29px;height: 30px;font-size:1.8rem;font-family: 'FontAwesome';color:#3b51b4;} .btn-setting.m-open:before {content: "\f00d";width: 29px;height: 30px;font-size:1.8rem;font-family: 'FontAwesome';color:#3b51b4;} .title {display: block;background: #2c4178;height: 50px;padding-left: 15px;font-size: 15px;color: #fff;line-height:48px;} .header .head_warp {text-align: left;} .header_nav li.active a {color: #df3b49;} .header .header_nav {display: none;} .btn-setting.m-open + .header_nav { display: block;position: fixed;top: 0;bottom: 0;right: 0;overflow-y: auto;width: 80%;max-width: 300px;z-index: 106;background: #fff; box-shadow: -13px 18px 30px rgba(0, 0, 0, 0.2);padding: 0;left: unset;} .btn-setting.m-open ~ .menu_bg {display: block;overflow: hidden;position: fixed;top: 0;right: 0;bottom: 0;width: 100%;font-size: 0;background: #000;opacity: 0.7;z-index: 99;} /*#wrapper .header {height: 50px;padding-top: 10px;}*/ .header .header_nav.open .pc_menu_bg {display: none;} .header_nav > div {margin: 0;} .header_nav.open div {background: none;} .header .header_nav.open:after {content: none;} .header_nav li.active .menu_sub {background: none;} .header_nav > div > ul > li {display: block;width: 100% !important;height: auto !important;padding: 0px;border-bottom: 1px solid #ddd;text-indent: 10px;} .header_nav > div > ul > li > a:after {content: '';display: block; float: right;width: 3rem;height: 3rem; background: url(../../image/front/new/select-black.png) no-repeat center center;background-size: 1.5rem auto;} .header_nav > div > ul > li > a.open-mob:after {background: url(../../image/front/new/select-black-close.png) no-repeat center center;background-size: 1.5rem auto;} .header_nav > div > ul > li > a {text-align: left;font-size: 1.2rem;word-spacing: 0;padding-top: 0;height: auto;color: #000;padding: 5px 0; line-height: 40px;overflow: hidden;} .header .header_nav .menu_sub {position: relative;top: auto;left: auto;right: auto;height: auto;min-height: auto;background: none;} .header .header_nav .menu_sub a {color: #000;text-align: left;} .header_nav li .menu_sub a {padding: 0 15px;} .header .header_nav > div > ul > li > a + .menu_sub {display: none;} .header .header_nav > div > ul > li > a.open-mob + .menu_sub {position: relative;display: block;width: 100%;height: auto;padding: 0;background: #ececec;border-top: 1px solid #dbdbdb;top: auto;left: auto;right: auto;} .header .header_nav > div > ul > li > a.open-mob + .menu_sub a {color: #252525;line-height: 50px;width: 100%;background: none;} .header .header_nav > div > ul > li > a.open-mob + .menu_sub li {line-height: 50px;border-bottom: 1px solid #dbdbdb;width: 100%;} .header .header_nav > div > ul > li > a.open-mob + .menu_sub a:last-of-type {border:0;} .header .header_nav > div > ul > li > a.open-mob + .menu_sub li:last-of-type {border:0;} .header .header_nav li .menu_sub {display: none;} .header .head_warp h1 {width: 40%;height:40px;/*top:10px;*/} .header .head_warp h1 p{width:150px;} .header .head_warp h1 .logo img{width:100%;margin-left: .5rem;} .header .head_warp h1 li {line-height: 1.3rem;} .header .header_nav .menu_sub > li > a {position: relative;padding: 0 2.5rem;color: #444;font-size: 1.1rem;line-height: 5rem;} .header .header_nav .menu_sub {display: none;} .header .header_nav.open .menu_sub {display: none;} /*.header .header_nav > div > ul > li > a.open-mob + .menu_sub {display: block;position: relative;top: auto;left: auto;right: auto;}*/ /*.header .header_nav.open .menu_sub a {text-align: left;font-size: 1.1rem;color: #000;}*/ .header .header_nav .menu_sub > li > a, .header .header_nav.open .menu_sub a {text-align: left;font-size: 1.1rem;color: #000;display: block;padding: 5px 10px;font-weight: normal;} .header_nav li.active a {color: initial;} html:lang(ar) .btn-setting { left: 10px;direction: rtl;right: auto;} html:lang(ar) .header .lang { left:50px;right: auto;} html:lang(ar) .header .lang > a span {padding: 0px 8px 0px 16px;background: url(../../image/front/new/ico_language.png) no-repeat 10px center;text-align: right;} html:lang(ar) .header .lang-content > li > a {text-align: right;} html:lang(ar) .header .head_warp h1 .font-Whit {text-align: right;} html:lang(ar) .header .header_nav {right: unset;left: 0;} } /* ===== Media ===== */ @media all and (max-width:766px){ html {font-size:62.5%;} /*menu*/ .no_scroll {overflow: hidden;height: 100%;} .btn-setting {display: block;position: absolute;top: 10px;right: 10px;height: 30px;font-size: 0;z-index: 107;} .btn-setting:before {content:"\f0c9";display: block;width: 29px;height: 30px;font-size:2.5rem;font-family: 'FontAwesome';color:#3b51b4;} .btn-setting.m-open:before {content: "\f00d";width: 29px;height: 30px;font-size:2.5rem;font-family: 'FontAwesome';color:#3b51b4;} .title {position: fixed; display: block;background: #2c4178;height: 50px;padding-left: 15px;font-size: 15px;color: #fff;line-height:48px;z-index: 999;width: 100%;} .header_nav li.active a {color: #df3b49;} .header .header_nav {display: none;} .no_scroll .header_nav {min-width: auto; display: block;position: fixed;top: 0;bottom: 0;right: 0;overflow-y: auto;width: 80%;max-width: 300px;z-index: 106;background: #fff; box-shadow: -13px 18px 30px rgba(0, 0, 0, 0.2);padding: 0;left: unset;} .btn-setting.m-open ~ .menu_bg {display: block;overflow: hidden;position: fixed;top: 0;right: 0;bottom: 0;width: 100%;font-size: 0;background: #000;opacity: 0.7;z-index: 103;} .header .header_nav.open .pc_menu_bg {display: none;} #wrapper > .header {height: 50px;padding-top: 10px;} .header .header_nav div {padding-top: 50px;} .header_nav > div {margin: 0;} .header_nav.open div {background: none;} .header .header_nav.open:after {content: none;} .header_nav li.active .menu_sub {background: none;} .header_nav > div > ul > li {display: block;width: 100% !important;height: auto !important;padding: 0px;border-bottom: 1px solid #ddd;text-indent: 10px;} .header_nav > div > ul > li > a:after {content: '';display: block; float: right;width: 3rem;height: 4.5rem; background: url(../../image/front/new/select-black.png) no-repeat center center;background-size: 1.5rem auto;} .header_nav > div > ul > li > a.open-mob:after {background: url(../../image/front/new/select-black-close.png) no-repeat center center;background-size: 1.5rem auto;} .header_nav > div > ul > li > a {text-align: left;font-size: 1.6rem;word-spacing: 0;padding-top: 0;height: auto;color: #000;padding: 5px 10px; overflow: hidden;line-height: 40px;} .header .header_nav .menu_sub {position: relative;top: auto;left: auto;right: auto;height: auto;min-height: auto;background: none;} .header .header_nav .menu_sub a {color: #000;text-align: left;} .header_nav li.active .menu_sub a {text-align: left;padding: 0 20px;color: #252525;font-size: 1.4rem;line-height: 45px;} .header_nav li .menu_sub a {padding: 0 15px;} .header .header_nav > div > ul > li > a + .menu_sub {display: none;} .header .header_nav > div > ul > li > a.open-mob + .menu_sub {position: relative;display: block;width: 100%;height: auto;padding: 0;background: #ececec;border-top: 1px solid #dbdbdb;top: auto;left: auto;right: auto;} .header .header_nav > div > ul > li > a.open-mob + .menu_sub a {color: #252525;line-height: 50px;width: 100%;background: none;} .header .header_nav > div > ul > li > a.open-mob + .menu_sub li {line-height: 50px;border-bottom: 1px solid #dbdbdb;width: 100%;} .header .header_nav > div > ul > li > a.open-mob + .menu_sub a:last-of-type {border:0;line-height: 24px;} .header .header_nav > div > ul > li > a.open-mob + .menu_sub li:last-of-type {border:0;} .header .header_nav li .menu_sub {display: none;} .header .head_warp h1 {position:absolute; width: 55%;height:40px;top:10px;} .header .head_warp h1 .logo{width:100px;} .header .head_warp h1 .logo img{width:92%;margin-left: .5rem;} .head_warp h1 a > ul { padding-top: 2px;} .header .head_warp h1 li {line-height: 1.3rem;text-indent:0px;} .header .header_nav.open {background: #fff;} .header .header_nav .menu_sub > li > a {position: relative;padding: 0 2.5rem;color: #444;font-size: 1.4rem;line-height: 5rem;} .header .header_nav .menu_sub {display: none;} .header .header_nav.open .menu_sub {display: none;} .header .header_nav > div > ul > li > a.open-mob + .menu_sub {display: block;position: relative;top: auto;left: auto;right: auto;} .header .header_nav .menu_sub > li > a, .header .header_nav.open .menu_sub a {text-align: left;font-size: 1.4rem;color: #000;display: block;padding: 10px 10px;font-weight: normal;} .header_nav li.active a {color: initial;} /*언어선택*/ .header .lang-content > li > a {width: 95px;} .header .lang{/*margin:1.2rem 0;*/right:50px;top: 12px;position: absolute;width: 95px;} .header .head_warp {text-align: left;} .header .lang > a {width: 95px;height: 28px;} .lang-content > li > a {width: 95px;} .header .lang {right: 60px;min-width: auto;} .header .lang > a span {line-height: 27px;} .header .lang-content {width: 95px;padding-top: 25px;top:5px;} html:lang(ar) .btn-setting { left: 10px;direction: rtl;right: auto;} html:lang(ar) .header .lang { left:50px;right: auto;} html:lang(ar) .header .lang > a span {padding: 0px 8px 0px 16px;background: url(../../image/front/new/ico_language.png) no-repeat 10px center;text-align: right;} html:lang(ar) .header .lang-content > li > a {text-align: right;} html:lang(ar) .header .head_warp h1 .font-Whit {text-align: right;} html:lang(ar) .header_nav > div > ul > li > a {text-align: right;} html:lang(ar) .header .header_nav {right: unset;left: 0;} }/*End: @media 320 */