/*
	ID : LAYOUT CSS
	WORK : Shinjunho
	NOTE : 레이아웃 / 공통 CSS
*/
/* font */
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900&display=swap');

/* browser reset */
* {margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; box-sizing:border-box;}
body{font-size: 15px; font-family: 'Noto Sans KR', sans-serif; line-height: 1.4em;}
body {word-wrap: break-word; word-break: keep-all; -webkit-text-size-adjust: none; line-height: 1;}
/*body::selection {background:#ff0; color:#d73d29; text-shadow:none;} /* 드래그 색상 */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
ul,li,ol,dl,dt,dd {list-style:none;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
table {border-collapse: collapse; border-spacing: 0;}
img, video {vertical-align: bottom; border:0;}
button {background: none; outline: none; border: none; cursor: pointer; background-color: transparent; border-radius: 0px;}
label {cursor: pointer; vertical-align: middle;}
input, select, textarea, button {font: inherit; color: inherit; vertical-align: middle; -webkit-border-radius:0;} /* -webkit-appearance:none; */
input:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px #f6f8f9 inset !important;} /*크롬에서 자동완성된 input의 노란색을 삭제*/
textarea {resize: none;}
a, a:hover, a:focus {color: inherit; text-decoration: none;}
i, em, address {font-style: normal; font-weight: normal;}
label img {pointer-events: none;} /* label 클릭불가 해결*/
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}/*number ui 삭제*/

/* preset */
@import url(animate.css);

/* Wide css */
.wrap {margin:0 auto; width:1280px; position:relative; }
.ellipsis {white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}/* 글줄임 */
.ani_3s {-webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s;}
.ani_5s {-webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s;}
section {} /* 인터넷창 최소 여백 */

/* GNB (WEB)*/
.GNB {position:fixed; width:100%; top:0; border-bottom:#fff solid 1px; z-index:10; transition: all 0.3s ease; background:#1934a5;}
.GNB .wrap {position:relative; overflow:hidden;}
.GNB .wrap .ci {display:inline-block; width:100px; height:75px; margin-top:7px; float:left; background:url("../images/layout/ci_w.png") no-repeat center; background-size:100%;}

.GNB .wrap .menu {display:none; position:absolute; right:10px; top:20px; width:23px; height:17.5px; background:url("../images/layout/btn_menu_w.png") no-repeat center; background-size:100%;} /*mobile*/
.GNB .wrap ul.bt1 {float:left; display:flex; margin-left:85px; width:870px; transition: all 0.3s ease;}
.GNB .wrap ul.bt1 a {position:relative; flex:1; text-align:center; line-height:90px; height:90px; color:#fff; font-size:18px; font-weight:500; cursor:pointer;}
.GNB .wrap ul.bt2 {float:left; font-size:14px; color:#fff; display:flex; line-height:90px;}
.GNB .wrap ul.bt2 a {padding:0 10px; position:relative;}
/*
.GNB .wrap ul.bt2 a:first-child::before {content:""; position:absolute; top:38px; right:0px; width:1px; height:14px; background:#fff; opacity:0.4;}
*/
.GNB.active {background:#fff; border-bottom-color:#ddd;}
.GNB.active .wrap .ci {background-image:url("../images/layout/ci.png");}
.GNB.active .wrap ul.bt1 a {color:black;}
.GNB.active .wrap ul.bt2 a {color:#888;}
.GNB.active .wrap ul.bt2 a:first-child::before {background:#888;}
.GNB.active .wrap .menu {background-image:url("../images/layout/btn_menu.png");}

/*GNB 2Depth (WEB) */
.GNB_dep2 {background:#fff; position:absolute; top:91px; width:100%; font-weight:200; font-size:16px; height:0px; overflow:hidden; z-index:90; transition: all 0.3s; }
.GNB_dep2.active {height:230px; border-bottom:#ddd solid 1px;}
.GNB_dep2 .wrap {overflow:hidden; letter-spacing:-0.5px; }
.GNB_dep2 .wrap ul {margin-left:185px; width:870px; display:flex; padding:50px 0;}
.GNB_dep2 .wrap li {flex:1; text-align:center;}
.GNB_dep2 .wrap li a {color:black; padding-bottom:22px; display:block;}
.GNB_dep2 .wrap li a:hover, .GNB_dep2 .wrap li a.active{color:#1f54c9; }

/* Right Banner */
.quickmenu {position:fixed; right:10px; top:50%; transform:translateY(-50%); width:100px; z-index:1000;}
.quickmenu a {text-align:center; position:relative; display:block; width:100px;}
.quickmenu a.title {}
.quickmenu a+a{height:100px; border-bottom:#e0e0e8 solid 1px; border-left:#e0e0e8 solid 1px; border-right:#e0e0e8 solid 1px; background:#fff;}
.quickmenu a+a img {margin-top:20px;}
.quickmenu a+a span {color:#000; font-size:14px; display:block; margin-top:10px;}
.quickmenu .top {border:none; padding:0; background:none; margin-top:10px;}
.quickmenu a:hover {}

/* footer */
.footer {position:relative; background:#4e4e5b; font-family:'Noto Sans KR', sans-serif; font-size:15px; font-weight:300; color:#b0b0b0; margin-top:140px; line-height:20px; }
.footer .wrap {position:relative; padding:40px 150px;}
.footer .wrap img {position:absolute; top:35px; left:10px; opacity:0.7;}
.footer .wrap ul {position:absolute; top:30px; right:0px; text-align:right;  color:#fff; line-height:30px;}
.footer .wrap ul h1 {font-size:24px; letter-spacing:-1px;}
.footer .wrap ul h2 {font-size:36px; letter-spacing:-1px;}
.footer .wrap ul p {font-size:12px; font-weight:400;}