body,td{margin:0;padding:0;font-size:12px;font-family:"굴림",Gulim,"돋움",Dotum,"Lucida Grande",Tahoma,Verdana,AppleGothic,UnDotum,sans-serif; color:#696969; line-height:18px;} ul,li{padding:0px; margin:0px; list-style:none;} p{padding:0px; margin:0px;} img{border:0px; padding:0px; margin:0px;} /*공통*/ #wrap{width:1000px; margin:0px Auto; padding:0px; position:relative;z-index:10;} #s_wrap{width:1000px; margin:0px Auto; padding:0px; position:relative;z-index:10;} #footer{width:1000px; margin:0px Auto; padding:0px; height:Auto;} #sub_bg{ background:url('/eng/common/images/sub_bg.gif') repeat-x;} .promotion_bg_l{position:absolute;top:0;left:-480px;z-index:-1;width:50%;height:548px;background:url('/eng/common/images/left_bg.gif') no-repeat 100% 0;} /*class*/ .mainheader {position:absolute; top:0; left:0; right:0; height:60px; padding:20px 0 0; font-family:'Montserrat'; transition:all 0.3s ease; overflow:hidden; z-index:1000;} .con{float:left; padding:26px 0 0 10px; margin:0px;} .con01{background:url('/eng/common/images/con01_bg.gif') no-repeat; width:319px; height:93px;} .con02{background:url('/eng/common/images/con02_bg.gif') no-repeat; width:319px; height:111px;} .clear{clear:both; padding:0px; margin:0px;} .li_p{padding:3px 0 1px 0;} #footer p{padding:1em; margin:0px;} /* 22.01 수정 */ .mainheader.open {height:240px;} .mainheader .openBg {position:absolute; top:90px; right:0; left:0; height:170px; background:#e0e8f5;} .mainheader .nav {position:absolute; top:0; left:0; right:0; padding:20px 0 0; text-align:center;} .mainheader h1 {position:relative; display:inline-block; z-index:2000;} .mainheader h1 a {} .mainheader .nav {z-index:1000;} .mainheader .topnav > ul {font-size:0; text-align:right;} .mainheader .topnav > ul li {position:relative; display:inline-block; vertical-align:middle; transition:all 0.3s ease;} .mainheader .topnav > ul li:last-child {margin-right:25px;} .mainheader .topnav > ul li > a {position:relative; display:block; padding:0 10px; line-height:20px; font-size:12px; font-weight:600; color:#0c4994;} .mainheader .gnb > ul {font-size:0; text-align:right;} .mainheader .gnb > ul > li {position:relative; display:inline-block; vertical-align:top; transition:all 0.3s ease; z-index:10;} .mainheader .gnb > ul > li:first-child {margin:0 0 0 180px;} .mainheader .gnb > ul > li > a {position:relative; display:block; padding:0 50px; line-height:40px; font-size:15px; font-weight:700; color:#0c4994;} .mainheader .gnb > ul li > a:after {content:''; position:absolute; left:10%; bottom:-5px; width:0; height:2px; background:#0c4994; transition:all 0.3s ease;} .mainheader .gnb > ul li.active > a:after {width:80%;} .mainheader .gnb > ul > li > ul {height:150px; padding:30px 0 0; text-align:center;} .mainheader .gnb > ul > li > ul > li {margin:0 0 15px;} .mainheader .gnb > ul > li > ul > li:last-child {margin:0;} .mainheader .gnb > ul > li > ul > li > a {font-size:13px; line-height:12px; font-weight:400; color:#010101;} .mainheader .gnb > ul > li > ul > li > a:hover {font-weight:600;} #wrap .main_txtBox {position:absolute; top:180px;} #wrap .main_txtBox h2 span {position:relative; top:20px; font-size:36px; letter-spacing:-6px; font-weight:800; font-family:'Montserrat'; color:#3d73b4; animation: bounce 6s ease infinite alternate;} #wrap .main_txtBox p {margin:30px 0 0; font-size:20px; font-family:'Noto Sans KR'; color:#010101;} #wrap .main_txtBox h2 span:nth-child(2) { animation-delay: .1s; } #wrap .main_txtBox h2 span:nth-child(3) { animation-delay: .2s; } #wrap .main_txtBox h2 span:nth-child(4) { animation-delay: .3s; } #wrap .main_txtBox h2 span:nth-child(5) { animation-delay: .4s; } #wrap .main_txtBox h2 span:nth-child(6) { animation-delay: .5s; } #wrap .main_txtBox h2 span:nth-child(7) { animation-delay: .6s; } #wrap .main_txtBox h2 span:nth-child(8) { animation-delay: .7s; } #wrap .main_txtBox h2 span:nth-child(9) { animation-delay: .8s; } #wrap .main_txtBox h2 span:nth-child(10) { animation-delay: .9s; } #wrap .main_txtBox h2 span:nth-child(11) { animation-delay: 1s; } #wrap .main_txtBox h2 span:nth-child(12) { animation-delay: 1.1s; } #wrap .main_txtBox h2 span:nth-child(13) { animation-delay: 1.2s; } #wrap .main_txtBox h2 span:nth-child(14) { animation-delay: 1.3s; } #wrap .main_txtBox h2 span:nth-child(15) { animation-delay: 1.4s; } #wrap .main_txtBox h2 span:nth-child(16) { animation-delay: 1.5s; } #wrap .main_txtBox h2 span:nth-child(17) { animation-delay: 1.6s; } #wrap .main_txtBox h2 span:nth-child(18) { animation-delay: 1.7s; } #wrap .main_txtBox h2 span:nth-child(19) { animation-delay: 1.8s; } #wrap .main_txtBox h2 span:nth-child(20) { animation-delay: 1.9s; } #wrap .main_txtBox h2 span:nth-child(21) { animation-delay: 2s; } #wrap .main_txtBox h2 span:nth-child(22) { animation-delay: 2.1s; } #wrap .main_txtBox h2 span:nth-child(23) { animation-delay: 2.2s; } #wrap .main_txtBox h2 span:nth-child(24) { animation-delay: 2.3s; } @keyframes bounce { 10% { top: -20px; } 20% { top:20px; } } #wrap .mainQickBtn {position:absolute; bottom:0; right:215px; width:225px; height:120px; z-index:100;} #wrap .mainQickBtn a {display:block; width:100%; height:100%;} #s_wrap .subTxtBox {position:absolute; bottom:70px;} #s_wrap .subTxtBox h2 span {position:relative; top:10px; font-size:32px; letter-spacing:-6px; font-weight:800; font-family:'Montserrat'; color:#3d73b4; animation: bounce02 6s ease infinite alternate;} #s_wrap .subTxtBox p {margin:20px 0 0; font-size:17px; font-family:'Noto Sans KR'; color:#010101;} #s_wrap .subTxtBox h2 span:nth-child(2) { animation-delay: .1s; } #s_wrap .subTxtBox h2 span:nth-child(3) { animation-delay: .2s; } #s_wrap .subTxtBox h2 span:nth-child(4) { animation-delay: .3s; } #s_wrap .subTxtBox h2 span:nth-child(5) { animation-delay: .4s; } #s_wrap .subTxtBox h2 span:nth-child(6) { animation-delay: .5s; } #s_wrap .subTxtBox h2 span:nth-child(7) { animation-delay: .6s; } #s_wrap .subTxtBox h2 span:nth-child(8) { animation-delay: .7s; } #s_wrap .subTxtBox h2 span:nth-child(9) { animation-delay: .8s; } #s_wrap .subTxtBox h2 span:nth-child(10) { animation-delay: .9s; } #s_wrap .subTxtBox h2 span:nth-child(11) { animation-delay: 1s; } #s_wrap .subTxtBox h2 span:nth-child(12) { animation-delay: 1.1s; } #s_wrap .subTxtBox h2 span:nth-child(13) { animation-delay: 1.2s; } #s_wrap .subTxtBox h2 span:nth-child(14) { animation-delay: 1.3s; } #s_wrap .subTxtBox h2 span:nth-child(15) { animation-delay: 1.4s; } #s_wrap .subTxtBox h2 span:nth-child(16) { animation-delay: 1.5s; } #s_wrap .subTxtBox h2 span:nth-child(17) { animation-delay: 1.6s; } #s_wrap .subTxtBox h2 span:nth-child(18) { animation-delay: 1.7s; } #s_wrap .subTxtBox h2 span:nth-child(19) { animation-delay: 1.8s; } #s_wrap .subTxtBox h2 span:nth-child(20) { animation-delay: 1.9s; } #s_wrap .subTxtBox h2 span:nth-child(21) { animation-delay: 2s; } #s_wrap .subTxtBox h2 span:nth-child(22) { animation-delay: 2.1s; } #s_wrap .subTxtBox h2 span:nth-child(23) { animation-delay: 2.2s; } #s_wrap .subTxtBox h2 span:nth-child(24) { animation-delay: 2.3s; } @keyframes bounce02 { 10% { top: -10px; } 20% { top:10px; } }