/********************************************* ****************** 공통사용 ******************* *********************************************/ html,body {width:100%; height: 100%; color: #454545; font-family:NanumGothic; font-size:14px; line-height:160%; } a { color: #454545; } a:focus { color: #454545; } a:active, a:hover { color: #454545; } img { width:100%; } #wrapper{min-height: 100%; position: relative; width:100%;overflow-x:hidden;} .paragraph_title { font-size:26px; font-weight:500; color:#333333; clear:both; line-height:110%; } .paragraph_explanation { clear:both; padding-top:20px; } .division_title { background:url(../images/division_title_icon.png) no-repeat left top; padding-left:30px; text-align:left; font-size:18px; line-height:170%; } .division_text { padding-top:10px; text-align:left; } .round_gray_bg { -webkit-border-radius: 8px; -moz-border-radius: 8px; background:#f9f9f9; } .bt { border-top:1px solid #d4d4d4 } .bl { border-left:1px solid #d4d4d4 } .br { border-right:1px solid #d4d4d4 } .bb { border-bottom:1px solid #d4d4d4 } /*--------------------------------------------- 탑 메뉴 ---------------------------------------------*/ #top { } #top #top_container { max-width:750px; min-width:401px; margin:0 auto; } #top #top_container #logo { padding: 10px; text-align:center; background:#f9f9f9; } #top #top_container #logo img { width:186px !important;} #top #top_container #top_nav_1000 { display:none; } #top #top_container #top_nav_800 { display:none; } #top #top_container #top_nav_720 { padding: 12px 0px; background:#f6f6f6; border-top:1px solid #e0e0e0; } #top #top_container #top_nav_720 ul { clear:both; } #top #top_container #top_nav_720 ul li { display:inline-block; float:right; width:25%; text-align:center; } #top #top_container #top_nav_720 ul li a { color:#666666; font-family:NanumGothicBold;padding:12px 12%; line-height:120%;} #top #top_container #top_nav_360 { display:none; } #sub_1000_box { display : none; } #sub_1000_fixed_box { display : none; } #sub_800_box { display : none; } #sub_800_fixed_box { display : none; } #sub_720_box { width:100%; } #sub_720_box #sub_720_container { max-width:750px; min-width:401px; margin:0 auto; padding:0px 20px; } #sub_720_box #sub_720_container #sub_nav_720_sub1 { clear:both;} #sub_720_box #sub_720_container #sub_nav_720_sub1 .sub_nav_step01 { clear:both; margin-top:30px; } #sub_720_box #sub_720_container #sub_nav_720_sub1 .sub_nav_step01 .sub_nav_step01_li { float:left; width:33%;} #sub_720_box #sub_720_container #sub_nav_720_sub1 .sub_nav_step01 .sub_nav_step01_li:nth-child(2) { width:34%;} #sub_720_box #sub_720_container #sub_nav_720_sub1 .sub_nav_step01 .sub_nav_step01_li a { display:block; width:80%; padding:14px; -webkit-border-radius: 8px; -moz-border-radius: 8px; background:#f9f9f9; text-align:center; margin:0px auto; word-break: break-all; } #sub_720_box #sub_720_container #sub_nav_720_sub1 .sub_nav_step01 .sub_nav_step01_li a.on { background:#E8F3FD;} #sub_720_box #sub_720_container #sub_nav_720_sub2 { clear:both;} #sub_720_box #sub_720_container #sub_nav_720_sub2 .sub_nav_step01 { clear:both; margin-top:30px; } #sub_720_box #sub_720_container #sub_nav_720_sub2 .sub_nav_step01 .sub_nav_step01_li { float:left; width:50%;} #sub_720_box #sub_720_container #sub_nav_720_sub2 .sub_nav_step01 .sub_nav_step01_li a { display:block; width:80%; padding:14px; -webkit-border-radius: 8px; -moz-border-radius: 8px; background:#f9f9f9; text-align:center; margin:0px auto; word-break: break-all; } #sub_720_box #sub_720_container #sub_nav_720_sub2 .sub_nav_step01 .sub_nav_step01_li a.on { background:#E8F3FD;} #sub_720_box #sub_720_container #sub_nav_720_sub3 { clear:both;} #sub_720_box #sub_720_container #sub_nav_720_sub3 .sub_nav_step01 { clear:both; margin-top:30px; } #sub_720_box #sub_720_container #sub_nav_720_sub3 .sub_nav_step01 .sub_nav_step01_li { float:left; width:25%;} #sub_720_box #sub_720_container #sub_nav_720_sub3 .sub_nav_step01 .sub_nav_step01_li:nth-child(3) { font-size: 12px; letter-spacing:-0.05em; } #sub_720_box #sub_720_container #sub_nav_720_sub3 .sub_nav_step01 .sub_nav_step01_li a { display:block; width:80%; padding:14px; -webkit-border-radius: 8px; -moz-border-radius: 8px; background:#f9f9f9; text-align:center; margin:0px auto; word-break: break-all; } #sub_720_box #sub_720_container #sub_nav_720_sub3 .sub_nav_step01 .sub_nav_step01_li a.on { background:#E8F3FD;} #sub_360_box { display : none; } /*--------------------------------------------- 메인 사진 ---------------------------------------------*/ @media screen and (min-width:401px) and (max-width:750px) { #top_bg { clear:both; } #top_bg #top_bg_img_400 { display:none; } #top_bg #top_bg_img_750 { display:block; } #top_bg #top_bg_img_800 { display:none; } #top_bg #top_bg_img_1000 { display:none; } } /*--------------------------------------------- YOTTA 소개 ---------------------------------------------*/ #yotta_intro {background:#f9f9f9; } #yotta_intro #yotta_intro_container { margin:0 auto; padding:18px; } #yotta_intro #yotta_intro_container #intro_logo { text-align:center; } #yotta_intro #yotta_intro_container #intro_logo img { width:120px !important;} #yotta_intro #yotta_intro_container #intro_text { padding-top: 10px; text-align:center; line-height:130%; } /*--------------------------------------------- YOTTA 서비스 ---------------------------------------------*/ #yotta_service { clear:both; padding-top:40px; } #yotta_service #yotta_service_title { width:100%; height:40px; background:url(../images/yotta_service_title.png) no-repeat center; text-align:center; color:#ffffff; padding-top: 6px; } #yotta_service #yotta_service_icon { width:100%; padding:40px 0px; } #yotta_service #yotta_service_icon li { width:50%; float:left; text-align:center; padding:0% 5%; text-align:center; } #yotta_service #yotta_service_icon li:nth-child(odd){clear:both;} #yotta_service #yotta_service_icon li:nth-child(3){padding-top:24px;} #yotta_service #yotta_service_icon li:nth-child(4){padding-top:24px;} #yotta_service #yotta_service_icon li img { max-width:90%; } #yotta_service #yotta_service_bottom { width:100%; height:1px; background:url(../images/yotta_service_bottom.png) no-repeat center; text-align:center; } /*--------------------------------------------- 인사말 ---------------------------------------------*/ #greeting { margin:0 auto; padding:40px 10px 0px 10px; text-align:left;} #greeting #greeting_box { clear:both; padding-top:40px; } #greeting #greeting_box #greeting_partner { clear:both;text-align:center; padding:0% 5%; } #greeting #greeting_box #greeting_ceo { clear:both;text-align:center; padding:0% 5%; } /*--------------------------------------------- 시스템진단 ---------------------------------------------*/ #system_diagnosis { margin:0 auto; padding:40px 10px 0px 10px; text-align:left;} #system_diagnosis #diagnosis_box { clear:both; padding-top:10px; } #system_diagnosis #diagnosis_box #diagnosis_schedule { text-align:center; padding:15px 10px; } #system_diagnosis #diagnosis_box #diagnosis_improvement_task { text-align:center; padding:15px 10px; } /*--------------------------------------------- 사업소개 ---------------------------------------------*/ #business_intro { margin:0 auto; padding:40px 10px 0px 10px; text-align:left;} #business_intro #business_intro_img { padding:20px 10px; text-align:center; } #business_intro #business_intro_box { clear:both; padding-top:40px; } #business_intro #business_intro_box .business_intro_list { padding:0px 10px 36px 10px; } /*--------------------------------------------- 주요 사업 – ILM ---------------------------------------------*/ #business_ilm { margin:0 auto; padding:40px 10px 0px 10px; text-align:left;} #business_ilm #business_ilm_point { -webkit-border-radius: 8px; -moz-border-radius: 8px; background:#f9f9f9; padding:16px; text-align:center; width:80%; margin:0px auto; margin-top:20px; } #business_ilm #business_ilm_img { padding-top:20px; text-align:center; } #business_ilm #business_ilm_img img { width:80% !important; } #business_ilm #business_ilm_box { clear:both; padding-top:40px; } #business_ilm #business_ilm_box .business_ilm_contents { margin:0% 5%; padding:20px; background:#f9f9f9; } #business_ilm #business_ilm_box .business_ilm_contents .business_ilm_text { padding-top:10px; padding-left:10px; font-size:14px; } /*--------------------------------------------- 주요 사업 – 개인정보 ---------------------------------------------*/ #business_personal { margin:0 auto; padding:40px 10px 0px 10px; text-align:left;} #business_personal #legislation { padding-top:40px; } #business_personal #legislation #legislation_title { width:100%; background:url(../images/yotta_service_bottom.png) no-repeat center; text-align:center; } #business_personal #legislation #legislation_title span { display:inline-block; background:#ffffff; padding:8px 18px; font-weight:600; font-size:16pt; } #business_personal #legislation #legislation_strong_text { clear:both; text-align:center; color:#ff0000; padding:16px 0px; font-weight:600; font-size:18pt; line-height:120%; } #business_personal #legislation #legislation_enforcement_contents { clear:both; padding-top:20px; } #business_personal #legislation #legislation_enforcement_contents .legislation_enforcement_text { margin:5px 10px; -webkit-border-radius: 8px; -moz-border-radius: 8px; background:#f9f9f9; text-align:center; padding:10px; } #business_personal #legislation #legislation_arrow_img { z-index:2; position:relative; margin:0 auto; padding-top:10px; text-align:center; } #business_personal #legislation #legislation_arrow_img img {width:84px !important;} #business_personal #legislation #legislation_result_contents { -webkit-border-radius: 16px; -moz-border-radius: 16px; background:#f9f9f9; margin-top:-30px; padding:46px 30px 30px 30px; } #business_personal #legislation #legislation_result_contents #legislation_result_title { font-size:18pt; line-height:110%; } #business_personal #legislation #legislation_result_contents .legislation_result_step { padding-top:30px; } #business_personal #legislation #legislation_result_contents .legislation_result_step .legislation_result_text { font-size:12px; padding-left:24px; } #business_personal #legislation #legislation_result_contents .legislation_result_step .half_contents { } #business_personal #legislation #legislation_result_contents .legislation_result_step .half_contents .legislation_table_orange { width:100%; } #business_personal #legislation #legislation_result_contents .legislation_result_step .half_contents .legislation_table_orange th { background:#ffd1ae; border:none; padding:12px 0px; font-size:18px; font-weight:bold; color:#033333; text-align:center; } #business_personal #legislation #legislation_result_contents .legislation_result_step .half_contents .legislation_table_orange td { background:#ffffff; border:none; padding:12px 12px; font-size:18px; font-weight:500; color:#ea8539; } #business_personal #legislation #legislation_result_contents .legislation_result_step .half_contents .legislation_table_green { width:100%; } #business_personal #legislation #legislation_result_contents .legislation_result_step .half_contents .legislation_table_green th { background:#d6edd6; border:none; padding:12px 0px; font-size:16px; font-weight:bold; color:#033333; text-align:center; } #business_personal #legislation #legislation_result_contents .legislation_result_step .half_contents .legislation_table_green td { background:#ffffff; border:none; padding:12px 12px; font-size:16px; font-weight:500; color:#98ca98; } #business_personal #legislation #legislation_result_contents .legislation_result_step .half_contents .legislation_table_title { padding-bottom:10px; text-align:center; } #business_personal #legislation #legislation_result_contents .legislation_result_step .half_contents .general_table { width:100%; } #business_personal #legislation #legislation_result_contents .legislation_result_step .half_contents .general_table th { background:#e8f3fd; padding:8px 0px; font-size:16px; font-weight:bold; text-align:center; } #business_personal #legislation #legislation_result_contents .legislation_result_step .half_contents .general_table td { background:#ffffff; padding:12px 12px; font-size:16px; font-weight:500; } /*--------------------------------------------- 주요 사업 – Outsourcing Service ---------------------------------------------*/ #business_outsourcing { margin:0 auto; padding:40px 10px 0px 10px; text-align:left;} #business_outsourcing #business_outsourcing_img { padding:20px; text-align:center; } #business_outsourcing #business_outsourcing_img img { width:80% !important; } #business_outsourcing #business_outsourcing_box { -webkit-border-radius: 16px; -moz-border-radius: 16px; background:#f9f9f9; padding:30px 10px; width:90%; margin:0 auto; } #business_outsourcing #business_outsourcing_box #business_outsourcing_keypoint { width:100%; border-bottom:1px solid #cccccc; } #business_outsourcing #business_outsourcing_box #business_outsourcing_keypoint #business_outsourcing_keypoint_blue { padding-bottom:16px; color:#2c8fba; font-weight:600; font-size:18px; text-align:center; } #business_outsourcing #business_outsourcing_box #business_outsourcing_keypoint #business_outsourcing_keypoint_red { padding-bottom:16px; color:#e65336; font-weight:600; font-size:18px; text-align:center; } #business_outsourcing #business_outsourcing_box #business_outsourcing_keypoint #business_outsourcing_keypoint_orange { padding-bottom:16px; color:#f3b546; font-weight:600; font-size:18px; text-align:center; } #business_outsourcing #business_outsourcing_box #business_outsourcing_contents { padding-top:20px; } #business_outsourcing #business_outsourcing_box #business_outsourcing_contents .business_outsourcing_contents_list { font-size:14px; padding-bottom:20px; padding-left:20px; } #business_outsourcing #business_outsourcing_box #business_outsourcing_contents .business_outsourcing_contents_list .business_outsourcing_text { padding-top:5px; } /*--------------------------------------------- 주요 사업 – 자체 솔루션 ---------------------------------------------*/ #business_solution { margin:0 auto; padding:40px 10px 0px 10px; text-align:left;} #business_solution .yellow_box { display:block; background:#ffff00; color:#ff0000; font-size:14px; font-style: italic; padding:4px 8px; font-weight:bold;margin-top:10px; } #business_solution #business_solution_box {padding-top:20px;} #business_solution #business_solution_box #business_solution_constitution { padding:0px 10px; } #business_solution #business_solution_box #business_solution_contents { padding:0px 10px; } #business_solution #business_solution_box #business_solution_contents #business_solution_contents_title { border-bottom:1px solid #999999; padding-bottom:3px; } #business_solution #business_solution_box #business_solution_contents .business_solution_contents_text {-webkit-border-radius: 8px; -moz-border-radius: 8px; margin-top:10px; padding:10px 10px 10px 74px; } #business_solution #business_solution_box #business_solution_contents #business_solution_contents_blue { background:#e8f3fd url(../images/business_solution_keypoint_blue.png) no-repeat left center; } #business_solution #business_solution_box #business_solution_contents #business_outsourcing_contents_red { background:#ffdada url(../images/business_solution_keypoint_red.png) no-repeat left center; } #business_solution #business_solution_box #business_solution_contents #business_solution_contents_orange { background:#fdf8e8 url(../images/business_solution_keypoint_orange.png) no-repeat left center; } #business_solution #business_solution_strong { -webkit-border-radius: 8px; -moz-border-radius: 8px; background:#e65336; color:#ffffff; padding:8px 14px; font-weight:bold; margin-top:10px; text-align:center; font-size:18px; } /*--------------------------------------------- 주요 사업 – 구축 실적 ---------------------------------------------*/ #business_history { margin:0 auto; padding:40px 10px 0px 10px; text-align:left;} #business_history #business_history_box {padding-top:20px;} @media screen and (min-width:401px) and (max-width:750px) { #business_history #business_history_box #business_history01 { display:none; } #business_history #business_history_box #business_history02 { display:table; } } #business_history #business_history_box .general_table { width:100%; margin:0 auto; } #business_history #business_history_box .general_table th { padding:8px 0px; font-size:16px; font-weight:bold; text-align:center; vertical-align:middle; border:1px solid #cccccc;width:100%; } #business_history #business_history_box .general_table td { background:#ffffff; padding:12px 12px; font-size:14px; font-weight:500; text-align:left; vertical-align:top; border:1px solid #cccccc; } /*--------------------------------------------- 회사 위치 ---------------------------------------------*/ #company_location { margin:0 auto; padding:40px 10px 0px 10px; text-align:left;} #company_location #company_location_box { -webkit-border-radius: 16px; -moz-border-radius: 16px; background:#f9f9f9; padding:30px; margin-top:20px; } #company_location #company_location_box p { padding-bottom:10px; } #company_location #company_location_box p .division_title { display : block; } #company_location #company_location_box p .division_title:nth-child(1) { padding-bottom:10px; } /*--------------------------------------------- Staff 소개 ---------------------------------------------*/ #staff_member { margin:0 auto; padding:40px 10px 0px 10px; text-align:left;} #staff_member #staff_member_box { padding-top:20px; } #staff_member #staff_member_box .staff_member_list { width:50%; padding:0px 10px; float:left; padding-bottom:30px; } #staff_member #staff_member_box .staff_member_list:nth-child(odd) { clear:both; } #staff_member #staff_member_box .staff_member_list .staff_img { text-align:center; } #staff_member #staff_member_box .staff_member_list .staff_img img { width:130px !important; } #staff_member #staff_member_box .staff_member_list .staff_name { text-align:center; font-weight:bold; } #staff_member #staff_member_box .staff_member_list .staff_text { text-align:left; width:160px; margin:0 auto; font-size:14px; } /*--------------------------------------------- footer ---------------------------------------------*/ #footer { background:#f9f9f9; width:100%; clear:both; margin-top:60px;} #footer #footer_container { max-width:750px; min-width:401px; margin:0 auto; padding:20px 50px; text-align:center; font-size:16px; } #footer #footer_container img { width:180px !important; vertical-align:middle; display:block; margin: 0 auto; padding:3px 0px 7px 0px; }