#sub_content #subNavi01 ul li a {display:block; width:128px; height:34px; padding-top:142px;} #sub_content #subNavi01 ul li.menu01 a {background:url('../images/system/submenu_01.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu01 a:hover {background:url('../images/system/submenu_01_over.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu01_on a {background:url('../images/system/submenu_01_over.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu02 a {background:url('../images/system/submenu_02.jpg') no-repeat 75% center;background-size:cover;} #sub_content #subNavi01 ul li.menu02 a:hover {background:url('../images/system/submenu_02_over.jpg') no-repeat 75% center;background-size:cover;} #sub_content #subNavi01 ul li.menu02_on a {background:url('../images/system/submenu_02_over.jpg') no-repeat 75% center;background-size:cover;} #sub_content #subNavi01 ul li.menu03 a {background:url('../images/system/submenu_03.jpg') no-repeat 80% center;background-size:cover;} #sub_content #subNavi01 ul li.menu03 a:hover {background:url('../images/system/submenu_03_over.jpg') no-repeat 80% center;background-size:cover;} #sub_content #subNavi01 ul li.menu03_on a {background:url('../images/system/submenu_03_over.jpg') no-repeat 80% center;background-size:cover;} #sub_content #subNavi01 ul li.menu04 a {background:url('../images/system/submenu_04.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu04 a:hover {background:url('../images/system/submenu_04_over.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu04_on a {background:url('../images/system/submenu_04_over.jpg') no-repeat center center;background-size:cover;} #sub_content .subNavi ul li a > span{display:inline-block; background:url('../images/common/bg_dark.png') repeat 0 0; width:100%; color:white; height:29px; padding-top:5px; font-size:15px; font-weight:bold;} #real_cont_wrap h1 {height:40px; padding-top:95px;font-size:30px; color:#444;background:url('../images/common/bg_title.jpg') no-repeat right bottom; text-shadow:2px 2px 3px white;} @media only screen and (min-width:768px) and (max-width:1200px) { #sub_content #subNavi01 ul li a{float:left; width:25%; height:75px; text-align:center;} #sub_content #subNavi01 ul li.menu01 a {background:url('../images/system/submenu_01.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu01 a:hover {background:url('../images/system/submenu_01_over.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu01_on a {background:url('../images/system/submenu_01_over.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu02 a {background:url('../images/system/submenu_02.jpg') no-repeat 75% center;background-size:cover;} #sub_content #subNavi01 ul li.menu02 a:hover {background:url('../images/system/submenu_02_over.jpg') no-repeat 75% center;background-size:cover;} #sub_content #subNavi01 ul li.menu02_on a {background:url('../images/system/submenu_02_over.jpg') no-repeat 75% center;background-size:cover;} #sub_content #subNavi01 ul li.menu03 a {background:url('../images/system/submenu_03.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu03 a:hover {background:url('../images/system/submenu_03_over.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu03_on a {background:url('../images/system/submenu_03_over.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu04 a {background:url('../images/system/submenu_04.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu04 a:hover {background:url('../images/system/submenu_04_over.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu04_on a {background:url('../images/system/submenu_04_over.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li a span { display:block; vertical-align:bottom; width:100%; text-align:center; color:white; font-size:15px; font-weight:bold; text-shadow:1px 1px 3px black; } #sub_content #subNavi01 ul li a span.shadow{background:url('../images/common/bg_dark.png') repeat 0 0; padding-top:0; height:75px;line-height:75px;} #sub_content #subNavi01 ul li a span.shadow:hover{background:none;} #real_cont_wrap h1 {height:30px; padding-top:25px;padding-bottom:20px;font-size:30px;background:#fff;text-shadow:2px 2px 3px white;} .body_cont{padding-bottom:30px;} .body_cont > h2 span{font-size:25px;} .body_cont ul.server_gallery li span, .body_cont ul.server_gallery li span b{font-size:18px; font-weight:bold; color:#666;} /* 01 시스템사업부 소개*/ #real_cont_wrap #real_cont {padding:0 10px; font-size:14px;} #real_cont_wrap #real_cont p.intro_txt {padding:30px 0; line-height:24px; font-size:14px; } #real_cont_wrap #real_cont p.intro_txt span.big{display:block; font-size:20px; padding-bottom:15px;} #real_cont_wrap #real_cont p.intro_txt span.point{color:#1f6aa9; font-weight:bold;} #real_cont ul.about_system h2.list {font-size:18px; margin-bottom:8px;} .body_cont{padding-bottom:30px;} .body_cont *{line-height:22px;} .body_cont ul.about_system li {padding-bottom:30px;} .body_cont ul.server_gallery li span {margin:5px 0 0 15px;} /* 01 시스템사업부 소개*/ /* 02 서버&백업*/ .body_cont ul.server_gallery li, p.right_txt {margin-left:15%;} .body_cont ul.server_gallery li img{width:76%;} .body_cont ul.server_gallery li { width:82%; } p.right_txt{width:82%;} .body_cont p.right_txt span.img_center{ display:inline-block; width:100%; text-align:center; padding-top:20px;} /* 02 서버&백업*/ .right_txt_only {margin-left:20%; width:75%;} .body_cont p.right_txt_only span.img_center {display:inline-block; width:100%; text-align:center; padding-top:20px;} ul.right_txt_only {float:right;} ul.right_txt_icon {margin-left:25%; float:right; } ul.right_txt_icon li.wspaci {width:60%; } ul.right_txt_icon li.w_222 { width:40%; } /*ul.right_txt_icon li.w_222{display:inline-block; width:240px;} ul.right_txt_icon li.w_190{display:inline-block; width:220px; margin-right:25px;} ul.right_txt_icon li { margin-right:15px;} ul.right_txt_icon li.line1 span { display:inline-block; padding-top:15px;}*/ } @media only screen and (max-width:768px) { #sub_content .subNavi {min-width:100%;} #sub_content .subNavi ul {width:100%; overflow:hidden; height:85px; } #sub_content #subNavi01 ul li a{float:left; width:25%; height:85px; text-align:center;padding:0; } #sub_content #subNavi01 ul li.menu01 a {background:url('../images/system/submenu_01.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu01 a:hover {background:url('../images/system/submenu_01_over.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu01_on a {background:url('../images/system/submenu_01_over.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu01_on a span.shadow{background:none;} #sub_content #subNavi01 ul li.menu02 a {background:url('../images/system/submenu_02.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu02 a:hover {background:url('../images/system/submenu_02_over.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu02_on a {background:url('../images/system/submenu_02_over.jpg') no-repeat 75% center;background-size:cover;} #sub_content #subNavi01 ul li.menu02_on a span.shadow{background:none;} #sub_content #subNavi01 ul li.menu03 a {background:url('../images/system/submenu_03.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu03 a:hover {background:url('../images/system/submenu_03_over.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu03_on a {background:url('../images/system/submenu_03_over.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu03_on a span.shadow{background:none;} #sub_content #subNavi01 ul li.menu04 a {background:url('../images/system/submenu_04.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu04 a:hover {background:url('../images/system/submenu_04_over.jpg') no-repeat center center; background-size:cover;} #sub_content #subNavi01 ul li.menu04_on a {background:url('../images/system/submenu_04_over.jpg') no-repeat center center;background-size:cover;} #sub_content #subNavi01 ul li.menu04_on a span.shadow{background:none;} #sub_content #subNavi01 ul li a span { display:block; vertical-align:bottom; width:100%; text-align:center; color:white; font-size:15px; font-weight:bold; text-shadow:1px 1px 3px black; } #sub_content #subNavi01 ul li a span.shadow{background:url('../images/common/bg_dark.png') repeat 0 0; padding-top:30px; height:55px;} #sub_content #subNavi01 ul li a span.shadow:hover{background:none;} #sub_content #subNavi01 ul li.menu01 a span {letter-spacing:-1px;} /* 01 시스템사업부 소개*/ #real_cont_wrap h1 {font-size:21px; padding:20px 10px 0 10px;background:#fff;} #real_cont_wrap #real_cont {padding:0 10px; font-size:15px;} #real_cont_wrap #real_cont p.intro_txt {padding:20px 0; font-size:14px;} #real_cont_wrap #real_cont p.intro_txt span.big{display:block; font-size:17px; padding-bottom:10px; line-height:24px;} #real_cont_wrap #real_cont p.intro_txt span.point{color:#1f6aa9; font-weight:bold;} #real_cont ul.about_system h2.list {font-size:15px; vertical-align:middle; margin-bottom:5px;} #real_cont ul.about_system h2.list img{width:28px;} .body_cont ul.about_system li {padding-bottom:20px;} .body_cont ul.about_system li.num2 img, .body_cont ul.about_system li.num3 img{float:left;padding-bottom:5px;} .body_cont ul.server_gallery li span {margin:5px 0 0 8px;} /* 01 시스템사업부 소개*/ /* 02 서버&백업*/ .body_cont > h2 span{font-size:18px;} .body_cont ul.server_gallery li span, .body_cont ul.server_gallery li span b{font-size:15px; font-weight:bold; color:#666;} .body_cont > h2 {padding-bottom:15px;} .body_cont ul.server_gallery li img {width:100%;} .body_cont p.right_txt span.img_center {display:inline-block;width:100%; padding:10px 0;} .body_cont p.right_txt span.img_center img{width:100%;} /* 02 서버&백업*/ .body_cont p.right_txt_only span.img_center {display:inline-block;width:100%; padding:10px 0;} .body_cont p.right_txt_only span.img_center img{width:100%;} ul.right_txt_only {margin-left:10px;} ul.right_txt_icon li{ width:100%} ul.right_txt_icon li span {display:inline-block; padding-top:7px;} ul.right_txt_icon li img{ width:35px;}*/ } @media only screen and (min-width:1200px) { #sub_content{ width:100%; background:#ffffff; position:absolute;bottom:0;top:75px;left:0;right:0;padding:0 0 0 0;overflow-y:scroll;overflow-x:hidden;} .sub_cont{ width:100%;height:97.5%;max-width:1183px;margin:0 auto;position:relative;} #sub_content .subNavi{ position:relative;width:200px;top:0;left:0;bottom:0;float:left;} #sub_content .subNavi ul{float:right; width:128px;} #sub_content .subNavi ul li {text-align:center;} #real_cont ul.about_system h2.list {font-size:18px; margin-bottom:8px;} .body_cont{padding-bottom:30px;} .body_cont *{line-height:24px;} .body_cont ul.about_system li {padding-bottom:30px;} .body_cont > h2 span{font-size:25px;} .body_cont ul.server_gallery li span, .body_cont ul.server_gallery li span b{font-size:18px; font-weight:bold; color:#666;} .body_cont ul.server_gallery li span {margin:5px 0 0 15px;} .body_cont ul.server_gallery li, p.right_txt {margin-left:15%;} .body_cont ul.server_gallery li img{width:76%;} .body_cont ul.server_gallery li { width:82%; } p.right_txt{width:82%;} .body_cont p.right_txt span.img_center{ display:inline-block; width:100%; text-align:center; padding:20px 0;} #real_cont_wrap #real_cont {padding:0 10px; font-size:14px;} p.right_txt_only {margin-left:20%; width:78%;} .body_cont p.right_txt_only span.img_center {display:inline-block; width:100%; text-align:center; padding-top:20px;} ul.right_txt_only {margin-left:25%;} ul.right_txt_icon {margin-left:25%;} ul.right_txt_icon li {width:50%; } ul.right_txt_icon li span { display:inline-block; padding-top:7px;} /* ul.right_txt_icon li.w_222{display:inline-block; width:230px;} ul.right_txt_icon li.w_190{display:inline-block; width:190px;} ul.right_txt_icon li.pr { margin-right:15px;} ul.right_txt_icon li {padding-bottom:15px;} */ } .body_cont *{font-size:14px;} .body_cont > h2 {border-top:1px solid #d7d7d7; } .body_cont span.txt_en {font-family:"Verdana", "Arial"; } .body_cont > h2 span {display:inline-block; border-top:3px solid #10226a; margin-top:-1px; padding-top:5px; color:#333;} #real_cont ul.about_system h2.list {color:#555;} #real_cont_wrap #real_cont p.intro_txt span.big {color#444;} .body_cont ul.server_gallery li { background:#f3f3f3; border-radius:5px; padding:5px; overflow:hidden; margin-bottom:15px;} .body_cont ul.server_gallery li span { float:left; background:url('../images/common/bullet_subtit.gif') no-repeat 0 5px; padding:0 0 10px 15px; } .body_cont ul.server_gallery li img, .body_cont ul.server_gallery li span, .body_cont ul.server_gallery li span b {vertical-align:top;} .body_cont ul.server_gallery li img{float:right;} .body_cont ul.server_gallery {margin-bottom:30px;} #real_cont h2.list {vertical-align:middle; padding-bottom:5px; border-bottom:1px solid #dcdcdc; } #real_cont h2.list img{vertical-align:middle; padding-right:5px; } ul.right_txt_only li {background:url('../images/common/bullet_subtit.gif') no-repeat 0 9px; padding:0 0 7px 18px;} ul.right_txt_only, ul.right_txt_icon {padding-bottom:30px;} ul.right_txt_icon {overflow:hidden; float:right;} ul.right_txt_icon li img {vertical-align:middle; width:40px; padding-right:13px; float:left;} ul.right_txt_icon li {float:left; overflow:hidden; margin-bottom:10px; /*background:url('../images/system/bg_dotted.gif') repeat-x 0 bottom;*/}