/* sub_contentbox */ .sub_contentbox {margin: 0 auto; width: 100%; max-width: 1200px;} /* okweb 공통 css */ .body_layout {float: left; width: 100%; max-width: 1200px; margin-top: 30px; margin-bottom: 50px;} .leftcont_box {float: left; width: 16.66666666666667% /* 200px */;} .leftgnb_area {float: left; width: 100%;} .leftgnb_area h4 {float: left; width: 100%; height: 75px; font-family: "NanumSquare", sans-serif; font-size: 18px; color: #fff; font-weight: 700; line-height: 77px; text-align: center; background-color: #ed5b3b;} .leftgnb_submenu {float: left; width: 100%; border: 1px solid #e2e2e2; box-sizing:border-box;} .leftgnb_submenu ul li {float: left; width: 100%; height: 50px; border-bottom: 1px solid #e9e8e8;} .leftgnb_submenu ul li a {display: block; font-family: "Noto Sans KR", sans-serif; font-size: 14px; color: #545353; font-weight: 400; line-height: 50px; padding-left: 20px; background: url(/normal_1/img/okweb/sub/images/menu_bullet.png) no-repeat 160px; transition: all 0.3s ease;} .leftgnb_submenu ul li.off a:hover {background: #f1f1f1 url(/normal_1/img/okweb/sub/images/menu_bullet_hover.png) no-repeat 160px;} .leftgnb_submenu ul li.on a {color: #ed5b3b; font-weight: 500; background: #fdfadc url(/normal_1/img/okweb/sub/images/menu_bullet_on.png) no-repeat 160px;} .rightcont_box {float: right; width: 79.16666666666667% /* 950px */;} .sub_page_title {float: left; width: 100%; margin-bottom: 30px;} .page_title_box {float: left; width: 50%;} .sub_page_title .tit_bullet {float: left; width: 34px; height: 5px; background: #f49b1e;} .sub_page_title h3 {float: left; width: 100%; font-family: "NanumSquare", sans-serif; font-size: 26px; color: #252525; font-weight: 800; line-height: 26px; margin-top: 20px;} .page_title_navi {float: left; width: 50%;} .page_title_navi div {float: right; font-family: "Nanum Gothic", sans-serif; font-size: 13px; color: #848282; font-weight: 400; padding-top: 28px; box-sizing: border-box;} .page_title_navi div a {display: inline-block; margin-right: 5px; vertical-align: 2px;} .page_title_navi div a.home {width: 20px; height: 19px; background: url(/normal_1/img/okweb/sub/images/subicon_home.png) no-repeat center center; background-size: 100% 100%; text-indent: -9999px;} .page_title_navi div b {font-family: "Noto Sans KR", sans-serif; color: #ed5b3b; font-weight: 500;} .sub_titletxt {float: left; width:100%; font-family: "Noto Sans KR", sans-serif; font-size: 20px; font-weight: 500; margin-bottom: 10px; padding-left: 38px; box-sizing:border-box; background :url(/normal_1/img/okweb/sub2/images/sub_titletxt_bullet.png) no-repeat left center;} h5.sub_cont_title {float:left; font-family: "Noto Sans KR", sans-serif; font-size:15px; font-weight:500; padding-left:26px; margin-bottom:10px; background:url(/normal_1/img/okweb/sub/images/subtitle_bullet.png) 0 50% no-repeat;} h5.sub_cont_titalign {margin-top:30px;} /* 카페24 기본 컨텐츠 영역 */ #body_layout {float: left; width: 100%; margin-top: 30px; margin-bottom: 50px;} /* 도메인, 호스팅 서브메뉴 */ .leftcon {float: left; width: 100%;} #sub_menu {float: left; width: 100%; font-family: "Noto Sans KR", sans-serif;} #sub_menu th {width: 100%; height: 75px; color: #fff; font-size: 20px; font-weight: 400; line-height: 20px; background-color: #ed5b3b;} #sub_menu td {float: left; width: 100%; border: 1px solid #e2e2e2; box-sizing:border-box;} #sub_menu dd {float: left; width: 100%; height: 50px; font-size: 14px; border-bottom: 1px solid #e9e8e8; cursor: pointer;} #sub_menu .on a {display: block; height: 50px; color: #ed5b3b; font-weight: 500; line-height: 49px; padding-left: 20px; background: #fdfadc url(/normal_1/img/okweb/sub/images/menu_bullet_on.png) no-repeat 160px; text-decoration:none;} #sub_menu .off a {display: block; height: 50px; font-family: "Noto Sans KR", sans-serif; color: #545353; font-weight: 400; line-height: 50px; padding-left: 20px; background:url(/normal_1/img/okweb/sub/images/menu_bullet.png) no-repeat 160px; text-decoration:none; transition: all 0.3s ease;} #sub_menu .off a:hover {background: #f1f1f1 url(/normal_1/img/okweb/sub/images/menu_bullet_hover.png) no-repeat 160px; text-decoration:none;} #sub_menu .dir_module {float: left; width: 100%;} #sub_menu span {float: left; width: 100%; height: 50px; border-bottom:1px solid #e9e8e8;} #sub_menu span a {display: block; width: 100%; font-size: 14px; color: #545353; line-height: 50px; padding-left: 20px; box-sizing: border-box; background: #eaeaea url(/normal_1/img/okweb/sub/images/menu_bullet.png) no-repeat 160px; text-decoration:none; transition: all 0.3s ease;} #sub_menu br {display: none;} /* br 태그삭제 */ #sub_menu .highlight a {display: block; width: 100%; color: #cc0001; font-weight: 500; background: #fdfadc url(/normal_1/img/okweb/sub/images/menu_bullet_on.png) no-repeat 160px; text-decoration:none;} #left_menu span a {display: block; font-size: 14px; color: #cc0001; font-weight: 500; line-height: 50px; padding-left: 20px; background: #fdfadc url(/normal_1/img/okweb/sub/images/menu_bullet_on.png) no-repeat 160px; text-decoration:none; transition: all 0.3s ease;} #left_menu .highlight a {font-weight: 500;} #left_menu div {float: left; width: 198px; border-bottom: 1px solid #e9e8e8; box-sizing:border-box;} #left_menu div a {display: block; height: 37px; font-size: 13px; color: #545353; font-weight: 300; line-height: 37px; padding-left: 10px; transition: all 0.3s ease;} #left_menu div a:hover {color: #cc0001; font-weight: 500; background-color: #f1f1f1;} #left_menu div {background-color: #fff;} #design_shop_typemenu {float: left; width: 198px;} #design_shop_typemenu {border:0px;} #design_shop_typemenu dl dd {float:left; height:40px !important;} #design_shop_typemenu dl dd a {display:block; height:40px !important; font-size: 13px; color: #545353; font-weight: 400; line-height: 40px !important; padding-left: 15px !important; background:#f7f7f7 url(/normal_6/img/wowweb/images/design_typemn_off.png) no-repeat 165px !important; border-bottom:1px solid #d7d7d7 !important; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} #design_shop_typemenu dl dd a:hover {color: #cc0001; font-weight: 400; background:#fcfad8 url(/normal_1/img/okweb/images/design_typemn_on.png) no-repeat 165px !important;} #design_shop_typemenu dl .on a {color: #cc0001; font-weight: 400; background:#fcfad8 url(/normal_1/img/okweb/images/design_typemn_on.png) no-repeat 165px !important;} /* 도메인, 호스팅 연장신청 버튼 */ #myservice_box {float: left; width: 100%; margin-top: 10px;} #myservice_box a {display: block; width: 100%; height:50px; font-family: "Noto Sans KR", sans-serif; font-size:14px; color:#303030; font-weight:500; line-height:50px; padding-left: 20px; background: #f9f9f9 url(/normal_1/img/okweb/sub/images/go_domain_hosting.png) no-repeat 159px; border: 1px solid #d1cfcf; box-sizing:border-box; transition: all 0.3s ease;} #myservice_box a:hover {color:#d80106; background:url(/normal_1/img/okweb/sub/images/goc_domain_hosting.png) no-repeat 159px; border:1px solid #272727;} /* 오른쪽 컨텐츠 영역 */ .rightcon {float: right; width: 79.16666666666667% /* 950px */;} /* 카페24 기본 컨텐츠 스타일 */ .mypage_submenu {display:none;} #page_title {float:left; width:100%; margin-bottom:20px;} #page_title .title {float:left; font-family: "Noto Sans KR", sans-serif; font-size:25px; font-weight:500;} #page_title .history {float:right; font-family:"돋움", dotum, "굴림", Gulim, sans-serif; color:#929292; letter-spacing:1px;} .pagebold {color:#cc0001; font-weight:bold;} .title_comment {float:left; font-family:"Noto Sans KR", "나눔고딕", nanumgothic, "맑은고딕", malgun gothic, arial, "돋움", dotum, sans-serif; font-size:15px; font-weight:300; padding-bottom:15px;} /* 도메인 호스팅 컨텐츠 영역 */ #width {float: left; width: 100%;} #domain_search {float: left; width: 100%;} #module_stitle {float: left; width: 100%; font-family: "Noto Sans KR", sans-serif; font-size: 20px; font-weight: 500; margin-bottom: 10px; padding-left: 38px; box-sizing: border-box; background: url(/normal_1/img/okweb/sub2/images/sub_titletxt_bullet.png) no-repeat left center;} #module_stitle b {font-weight: 500;} #domain_search table {float:left; width:100%;} #domain_search table tr:first-child td.tle1 {border-top: 3px solid #ed5b3b;} #domain_search table tr:first-child td.tle2 {border-top: 3px solid #41bdb4;} #domain_search table td {font-family: "Noto Sans KR", sans-serif; font-size: 13px; letter-spacing: 1px; border-collapse: collapse; border:1px solid #e5e5e5; box-sizing:border-box;} .tle1 {color: #f1744d; height: 30px; font-weight: 500; text-align: center; background-color: #fffaf9;} .tle2 {color: #333; height: 30px; line-height: 30px; padding: 5px 15px 5px 15px;} #domain_search table:nth-child(2) {margin-bottom: 30px;} #domain_search table:nth-child(4) {display: none;} #domain_search table:nth-child(5) {margin-bottom: 30px;} #m_info {float: left; width: 100%;} #m_info2 {float: left; width: 100%; margin-top:20px;} #m_info_tle {height: 22px; font-family: "Noto Sans KR", sans-serif; font-size:18px; font-weight:400; padding-bottom:5px; padding-left:10px; margin-bottom:10px; border-left:5px solid #454444;} #m_info_box {float: left; width: 100%; font-family: "Noto Sans KR", sans-serif; font-size:13px; font-weight:300; background-color:#f6f6f6; line-height:20px; padding:15px; box-sizing: border-box; letter-spacing: 1px;} .m_info_bl {display:none;} .m_info_content {position: relative; float:left;} #m_info div span a {margin-left:10px; vertical-align:3px;} #domain_search .domain_price table:nth-child(2) tr:nth-child(1) td:nth-child(1) {height: 40px; color: #fff; font-weight: 700; text-align: center; padding-top: 8px; padding-bottom: 8px; background-color: #41bdb4; border-top: 0;} #domain_search .domain_price table:nth-child(2) tr:nth-child(1) td:nth-child(2) {border-top: 0;} #domain_search .domain_price table:nth-child(2) tr:nth-child(1) td:nth-child(3) {border-top: 0;} #domain_search .domain_price table:nth-child(2) tr:nth-child(1) td:nth-child(4) {border-top: 0;} #domain_search .domain_price table:nth-child(2) tr:nth-child(1) td:nth-child(5) {border-top: 0;} #domain_search .domain_price table:nth-child(2) tr:nth-child(1) td:nth-child(6) {border-top: 0;} #domain_search .domain_price table:nth-child(2) table tr:nth-child(1) td:nth-child(1) {height: 0px; color: #f1744d; background-color: #fffaf9;} #domain_search .domain_price table:nth-child(2) tr:nth-child(3) td:nth-child(1) {height: 40px; color: #fff; font-weight: 700; text-align: center; padding-bottom: 15px; background-color: #41bdb4;} #domain_search .domain_price table:nth-child(2) table tr:nth-child(3) td:nth-child(1) {height: 0px; color: #f1744d; padding: 5px 0; background-color: #fffaf9;} #domain_search table:nth-child(10) {margin-bottom: 30px;} #domain_search table:nth-child(14) {margin-bottom: 30px;} .btn_process {float: left; width: 100%; /* margin-top:30px; */} .btn_bottom {margin: 0 auto; width: 81px;} .btn_bottom a img {margin-top: 30px;} .mobile_box table select[name="autoInstallAppName"], .mobile_box table select[name="autoInstallAppPath"] {height: 35px; margin-right: 10px;} .hosting_compute table {float: left; width: 100%; margin-bottom: 30px;} #domain_result {float: left; width: 100%;} #domain_result table {float: left; width: 100%; margin-bottom: 20px; border: 1px solid #eee;} #domain_result table tr td {font-size: 14px; font-weight: 500; border-right: 1px solid #eee; border-bottom: 1px solid #eee;} #domain_result table tr td input {margin-right: 7px;} .btn_bottom_domain {float: left; width: 100%;} .btn_bottom_domainbox {margin: 0 auto; width: 140px;} .btn_bottom_domainbox input {margin-right: 10px;} #domain_purch {float: left; width: 100%;} #domain_purch table {margin-bottom: 20px; border: 1px solid #eee;} #domain_purch table tr td {font-size: 14px; border-right: 1px solid #eee; border-bottom: 1px solid #eee;} #domain_purch table tr td.tle1 {font-weight: 500;} #domain_settl {float: left; width: 100%;} #domain_settl table {border: 1px solid #eee;} #domain_settl table tr:nth-child(1) {font-weight: 500;} #domain_settl table tr td {font-size: 14px; border-right: 1px solid #eee; border-bottom: 1px solid #eee;} /* 호스팅 폼 css */ input[name="service_wplset"] {margin-right: 10px;} input[name="service_term"] {margin-right: 5px; margin-left: 10px; vertical-align: -2px;} input:first-child[name="service_term"] {margin-left: 0;} /* 호스팅변경 팝업_pop_layer2 */ #pop_layer2 {margin: 0 auto; width: 728px; height:510px; text-align: center; background-color:#fff; border:1px solid #dbd9d9; border-top:0px;} #pop_layer2 .head_title {height:35px !important; background: url(/normal_1/img/designTemplate/pop_head_bg.gif) repeat-x; width: 100%;} #pop_layer2 .head_title tr td {padding:0 !important;} #pop_layer2 .head_title tr td.head_left img {display:none;} #pop_layer2 .head_title tr td.head_close img {margin-right:10px;} #pop_layer2 .head_title tr td.head_right img {display:none;} #pop_layer2 .head_close {text-align: right; width: 19px; cursor: pointer;} #pop_layer2 .info2 {font-size:13px; font-weight:400; color:#4e4e4e; line-height: 20px; padding: 13px 0 15px 20px; text-align: left;} #pop_layer2 .pop_table2 {float:left; width: 700px; margin-left:14px; border:1px solid #dbd9d9; border-top:2px solid #000;} #pop_layer2 .pop_table2 tr:nth-child(1) {background-color:#eee;} #pop_layer2 .pop_table2 tr:nth-child(7) {display:none;} #pop_layer2 .pop_table2 tr th {background-color:#fdf9ed;} /* 웹사이트 개발 상단안내 */ .websites_contentsbox {float: left; width: 100%;} .websites_titlebox {float: left; width: 100%; height: 430px; margin-bottom: 40px; background:url(/normal_1/img/okweb/sub2/images/website_guide_bg.jpg) no-repeat; border: 1px solid #f2f2f2; box-sizing:border-box;} .websites_titlearea {float: left; width: 100%; font-family: "Noto Sans KR", sans-serif; padding-top: 130px; padding-left: 45px; box-sizing:border-box;} .webtit_txt {font-family: "NanumSquare", sans-serif; font-size: 32px; color: #252525; line-height: 40px; font-weight: 400; margin-bottom: 15px;} .webtit_txt b {font-weight: 800;} .webtit_subtit {font-size: 24px; color: #edab0c; line-height: 40px; margin-bottom: 5px;} .webtit_subtxt {width: 50%; font-size: 15px; color: #676869; font-weight: 400; line-height: 22px; letter-spacing: -0.5px; word-break: keep-all;} /* 반응형웹 개발 상단안내 */ .subtop_res_titletxt {float: left; width: 100%; height: 650px; background: url(/normal_1/img/okweb/sub2/images/responsive_guide_bg.jpg) no-repeat center top; background-size: cover;} .responsive_titlebox {float: left; width: 100%; text-align: center; padding-top: 50px;} .responsive_titlebox li:nth-child(1) b {float: left; width: 100%; font-size: 27px; color: #fff; line-height: 34px;} .responsive_titlebox li b {float: left; width: 100%; font-family: "NanumSquare", sans-serif; font-size: 48px; color: #fff; font-weight: 700; margin-top: 15px; margin-bottom: 10px;} .responsive_stress {font-family: "NanumSquare", sans-serif; font-size: 24px; color: #fff; line-height: 34px; font-weight: 700; margin-bottom: 15px;} .responsive_subtxt {font-family: "Noto Sans KR", sans-serif; font-size: 18px; color: #fff; font-weight: 300; line-height: 24px; letter-spacing: -0.05px;} .responsive_type_box {float: left; padding: 10px 35px 35px; margin-bottom: 40px; background-color: #ececec;} .responsive_type_title {float: left; font-family: "Noto Sans KR", sans-serif; padding: 30px; background-color: #fff;} .responsive_type_txt1 {font-size: 22px; color: #191919; font-weight: 700; margin-bottom: 5px;} .responsive_type_txt2 {font-size: 15px; color: #727171; font-weight: 400; line-height: 20px;} .responsive_smdesign_page {float: left; margin-bottom: 20px;} .responsive_smdesign_page li:nth-child(2) {display: none;} .responsive_titleimgbox {float: left; width: 100%; margin-top: 20px; margin-bottom: 40px;} .mobile_shop3_titleimg {float: left;} .mobile_shop3_titleimg li:nth-child(2) {display: none;} .subtop_mobile_titletxt {background: url(/normal_1/img/okweb/sub2/images/mobile_guide_bg.jpg) no-repeat center top; background-size: cover;} #sub_design_result {float:left; width: 100%; margin-top:10px;} #sub_design_result table {float:left; width:100%; margin-left:0 !important;} #sub_design_result table tr td {float:left; width:230px; margin-right:10px; margin-bottom:20px;} #sub_design_result table tr td:nth-child(4) {margin-right:0px;} #sub_design_result table tr td .img {float:left; width:230px; border:1px solid #d7d7d7; box-sizing:border-box;} #sub_design_result table tr td .imgon {float:left; width:230px; border:1px solid #d7d7d7; box-sizing:border-box;} #sub_design_result table tr td .img img {width:100% !important; padding:0px;} #sub_design_result table tr td .imgon img {width:100% !important; padding:0px;} #sub_design_result table tr td .txtNew {float:left; width:230px; text-align:center;} .buildersite_type_title {float:left; width:100%; text-align:center;} .buildersite_type_title li:nth-child(1) {font-size:30px; color:#161616; font-weight:700;} .buildersite_type_title li span {vertical-align:4px;} .buildersite_type_title li .s_bullettxt_1 {margin-right:10px;} .buildersite_type_title li .s_bullettxt_2 {margin-left:10px;} .buildersite_type_title li {font-size:16px; color:#6a6969;} /* 모바일웹 개발 상단안내 */ .mobile_guidebox {float: left; width: 100%;} .mobile_guide_titleimg {float: left; width: 100%; margin-top: 20px;} .mobile_guide_titleimg li:nth-child(2) {display:none;} .mobile_guide_titleimg li img {width: 100%;} .mobile_guidearea {float: left; width: 100%; border: 1px solid #e0e0e0; box-sizing:border-box;} .mobile_guide_subcon {float: left; width: 100%;} .mobile_guide_subcon ul:nth-child(4) {border-right: 0px;} .mobile_guide_subcontxt {float: left; width: 25% /* 237px */; height: 240px; text-align: center; padding-top: 115px; border-right: 1px solid #e0e0e0; box-sizing:border-box;} .moguide_mtxt {font-size: 17px; color: #000; font-weight: 700;} .moguide_stxt {font-size: 13px; color: #504f4f; font-weight: 300; line-height: 17px; padding: 0 20px; margin-top: 2px; word-break: keep-all;} .m_pointicon1 {background: url("/normal_1/img/okweb/sub/images/mobile_pointicon_1.jpg") no-repeat center 30px; border-bottom: 1px solid #e0e0e0;} .m_pointicon2 {background: url("/normal_1/img/okweb/sub/images/mobile_pointicon_2.jpg") no-repeat center 30px; border-bottom: 1px solid #e0e0e0;} .m_pointicon3 {background: url("/normal_1/img/okweb/sub/images/mobile_pointicon_3.jpg") no-repeat center 30px; border-bottom: 1px solid #e0e0e0;} .m_pointicon4 {background: url("/normal_1/img/okweb/sub/images/mobile_pointicon_4.jpg") no-repeat center 30px; border-bottom: 1px solid #e0e0e0;} .m_pointicon5 {background: url("/normal_1/img/okweb/sub/images/mobile_pointicon_5.jpg") no-repeat center 30px;} .m_pointicon6 {background: url("/normal_1/img/okweb/sub/images/mobile_pointicon_6.jpg") no-repeat center 30px;} .m_pointicon7 {background: url("/normal_1/img/okweb/sub/images/mobile_pointicon_7.jpg") no-repeat center 30px;} .m_pointicon8 {background: url("/normal_1/img/okweb/sub/images/mobile_pointicon_8.jpg") no-repeat center 30px;} .mobile_shop2_titleimg {float: left; margin-bottom: 30px;} .mobile_shop2_titleimg li:nth-child(2) {display: none;} .mobile_shop2_titleimg li img {width: 100%;} .btn_repairmore {margin-left: 10px;} .btn_repairmore a {display: inline-block; height: 30px; font-size: 13px; color: #fff; font-weight: 300; line-height: 30px; padding: 0 17px; background-color: #6080d2; border-radius: 3px; transition: all 0.3s ease;} .btn_repairmore a:hover {color: #fff; background-color: #383838;} /* 제작안내 및 비용 */ .guideprice_typebox {float: left; width: 100%; font-family: "Noto Sans KR", sans-serif;} .guideprice_box {float: left; width:100%; margin-bottom: 40px; background-color: #f9f9f9; border-top: 1px solid #e3e1e1; border-bottom: 1px solid #e3e1e1;} .guideprice_box2 {margin-bottom: 10px;} .guideprice_area {float: left; width: 100%; padding: 30px; box-sizing:border-box;} .guideprice_txt {float: left; width: 610px; font-family: "Noto Sans KR", sans-serif;} .guideprice_txt li:nth-child(1) {float: left; width: 100%; font-size: 20px; color: #595858;} .guideprice_txt li:nth-child(2) {font-size: 15px; color: #302f2f; font-weight: 400; word-break: keep-all;} .type_number {float:left; width:48px; height:48px; font-family:"나눔고딕", nanumgothic, "맑은고딕", malgun gothic, arial, "돋움", dotum, sans-serif; font-size:35px; color:#fff; font-weight:700; text-align:center; background-color:#ed5b3b; border-radius: 24px;} .type_titletxt {float:left; font-size:25px; color:#161616; font-weight:700; margin-top:5px; margin-left:10px;} .type_price {float:left; font-size:50px; color:#ed5b3b; font-weight:700; margin:-15px 5px 0 10px; padding:0;} .type_vat {float:left; margin-top:11px;} .btn_estimateinquiry {float: right; width: 200px;} .btn_estimateinquiry li {float: left; width: 200px;} .inquiry_txt {font-size: 15px; font-weight: 700; color: #595858; text-align: center; margin-top: 10px; margin-bottom: 10px;} .btn_estimateinquiry li a {display: block; width: 200px; height: 50px; font-size: 17px; color: #fff; font-weight: 500; text-align: center; line-height: 50px; background-color: #a2a2a2; transition: all 0.5s ease;} .btn_estimateinquiry li a:hover {background-color: #ed5b3b;} .homepage_titleimgbox {float: left; width: 100%; margin-bottom: 40px;} /* 제작과정 */ .process_contents ul {float: left; width: 100%; height: 225px; text-align:center; padding-top: 75px; box-sizing:border-box; background: url(/normal_1/img/okweb/sub2/images/process_title_bg.jpg) no-repeat;} .process_tittxt {font-family: "NanumSquare", sans-serif; font-size: 24px; color: #fff; font-weight: 700; line-height: 24px; letter-spacing: -0.5px; margin-bottom: 15px;} .process_stxt {font-family: "Noto Sans KR", sans-serif; font-size: 17px; color: #dad9d9; font-weight: 400; line-height: 24px;} .process_contents_area {float: left; width: 100%; padding: 0 30px 50px; box-sizing: border-box; background: #f4f4f4;} .process_contents_area ul {float: left; width: 100%; text-align:center;} .process_contents_area ul.intro_steparea {margin-top: 30px;} .cont-space {float: left; width: 890px; height: 385px; margin-top: 30px; background: #fff; border: 1px solid #dedada; box-sizing:border-box;} .slide_visual_area {float: left; width: 100%;} .cont-tab {float: left; width: 100%; overflow: hidden;} .cont-tab a {display: block; width: 111px; height: 47px; font-family: "Noto Sans KR", sans-serif; font-size: 14px; color: #7d7d7d; font-weight: 500; line-height: 47px; letter-spacing: -0.5px; float: left; text-align: center; border-right: 1px solid #dedada; border-bottom: 1px solid #dedada; -webkit-transition: color 0.2s cubic-bezier(0.68, 0.08, 0.36, 0.94); -moz-transition: color 0.2s cubic-bezier(0.68, 0.08, 0.36, 0.94); -o-transition: color 0.2s cubic-bezier(0.68, 0.08, 0.36, 0.94); transition: color 0.2s cubic-bezier(0.68, 0.08, 0.36, 0.94);} .cont-tab a:first-child {width: 100px;} .cont-tab a:nth-child(2) {width: 73px;} .cont-tab a:nth-child(3) {width: 130px;} .cont-tab a:nth-child(4) {width: 175px;} .cont-tab a:nth-child(5) {width: 120px;} .cont-tab a:nth-child(6) {width: 110px;} .cont-tab a:nth-child(7) {width: 100px;} .cont-tab a:last-child {width: 73px; border-right: 0;} .cont-tab a:hover {color: #fff; background: #ed5b3b; transition: all 0.5s ease;} .cont-tab a.active {color: #fff; background: #ed5b3b;} .swiper-container-4 {position: relative; width: 100%; overflow: hidden;} .swiper-container-4 .swiper-slide {float: left; width: 100%;} .cont-space .swiper-container-4 .swiper-button-prev, .cont-space .swiper-container-4 .swiper-button-next {display: block; width: 50px; height: 50px; background: url(/normal_1/img/okweb/sub2/images/swiper_arrow.png) no-repeat; margin-top: 30px; outline: none;} .cont-space .swiper-container-4 .swiper-button-prev {background-position: 0 0; left: 50%;} .cont-space .swiper-container-4 .swiper-button-prev {margin-left: -18px;} .cont-space .swiper-container-4 .swiper-button-next {background-position: -50px 0; left: auto; right: 50%;} .cont-space .swiper-container-4 .swiper-button-next {margin-right: -19px;} .cont-space .swiper-container-4 .swiper-slide img {margin: 0; padding: 0; border: none; vertical-align: top;} .cont-space .swiper-slide .process_ico {float: left; width: 185px; margin-top: 68px; margin-right: 30px; margin-left: 50px;} .cont-space .swiper-slide .process_infobox {float: left; width: 605px; margin-top: 65px;} .cont-space .swiper-slide .process_infobox .process_nametxt {font-family: "Noto Sans KR", sans-serif; text-align: left;} .cont-space .swiper-slide .process_infobox .process_nametxt li {display: inline; float: left;} .cont-space .swiper-slide .process_infobox .process_nametxt li:nth-child(1) {display: block; width: 100%; font-family: "NanumSquare", sans-serif; font-size: 30px; color: #212121; font-weight: 700; line-height: 30px; margin-bottom: 15px;} .cont-space .swiper-slide .process_infobox .process_nametxt li:nth-child(2) {font-size: 18px; color: #212121; font-weight: 500; line-height: 22px; margin-bottom: 15px; word-break: keep-all;} .cont-space .swiper-slide .process_infobox .process_nametxt li:nth-child(3) {font-size: 14px; color: #525050; font-weight: 300; line-height: 22px; word-break: keep-all;} .process_pointtxt {float: left; width: 100%; font-family: "Noto Sans KR", sans-serif; font-size: 13px; color: #8b8b8b; font-weight: 400; text-align: center; margin-top: 10px;} /* 고객준비사항 */ .sitebuilder_preparebox {float: left; width: 100%;} .sitebuilder_preparearea {float: left; font-family: "Noto Sans KR", sans-serif; width: 100%; margin-bottom: 25px;} .sitebuilder_preparearea2 {margin-bottom: 0;} .builder_prepare_box1 {float: left; width: 31.57894736842105% /*300px*/; margin-right: 2.526315789473684% /*24px*/; word-break: keep-all;} .prepare_box1_align {margin-right: 0;} .builder_prepare_box1 li:nth-child(1) {float: left; margin-bottom: 10px;} .builder_prepare_box1 li:nth-child(2) {float: left; font-family: "NanumSquare", sans-serif; font-size: 18px; color: #2b2b2b; font-weight: 700; line-height: 18px; margin-top: 15px; margin-bottom: 10px;} .builder_prepare_box1 li:nth-child(3) {float: left; font-size: 13px; color: #8f8f8f; font-weight: 300; line-height: 17px; letter-spacing: -0.5px; /* text-align:justify; */} .builder_prepare_box1 li img {width: 100%;} /* 쇼핑몰 개발 상단 안내 및 컨텐츠 영역 */ .shop_contentsbox {float: left; width: 100%; font-family: "Noto Sans KR", sans-serif;} .mall_titlebox {float: left; width: 100%; height: 515px; margin-bottom: 40px; background: url(/normal_1/img/okweb/sub2/images/mall_guide_bg.jpg) no-repeat center top; background-size: cover; border: 1px solid #f2f2f2; box-sizing:border-box;} .mall_titlearea {float: left; width: 100%; font-family: "Noto Sans KR", sans-serif; padding-top: 115px; padding-left: 45px; box-sizing:border-box;} .malltit_txt {font-family: "NanumSquare", sans-serif; font-size: 32px; color: #252525; line-height: 40px; font-weight: 400; margin-bottom: 15px;} .malltit_txt_sub {font-size: 18px; color: #708ca9; line-height: 24px; margin-bottom: 15px;} .malltit_txt b {font-weight: 800;} .malltit_subtit {font-size: 24px; color: #edab0c; line-height: 40px; margin-bottom: 5px;} .malltit_subtxt {width: 50%; font-size: 15px; color: #676869; font-weight: 400; line-height: 22px; letter-spacing: -0.5px; word-break: keep-all;} .shoppingmall_titleimgbox {float: left; width: 100%; margin-bottom: 10px;} .mall_qnaarea {float: left; width: 100%; margin-top: 50px;} .qna_contensbox {float: left; width: 100%; height: inherit;} .qna_contensarea {float: left; font-family: "Noto Sans KR", sans-serif; width: 100%; margin-bottom: 20px; background-color: #f5f5f5;} .qna_contensarea2 {margin-bottom: 0;} .qna_contens_q {float: left; width: 93.68421052631579% /*890px*/; font-size: 20px; color: #ed5b3b; font-weight: 700; padding: 30px 0 0 30px;} .qnabox_q {float: left; width: 33px; height: 33px; font-size: 17px; color: #fff; font-weight: 700; text-align: center; line-height: 32px; margin-top: -1px; margin-right: 10px; background-color: #ed5b3b; border-radius: 6px;} .qna_contens_a {float: left; width: 93.68421052631579% /*890px*/; font-size: 15px; color: #565656; font-weight:300; line-height: 24px; padding: 10px 10px 30px 30px;} .qnabox_a {float: left; width: 33px; height: 33px; font-size: 17px; color: #fff; font-weight: 700; text-align: center; line-height: 32px; margin-top: -5px; margin-right: 10px; background-color: #605ca9; border-radius: 6px;} .qna_contens_a li p {float: left; width: 88.42105263157895‬% /*840px*/;} /* 유지보수 관리 전체 컨텐츠 영역 */ .maintenance_contentsbox {float: left; width: 100%;} .maintenance_contentsbox div img {/*width: 100%;*/} /* 유지보수 안내 컨텐츠 영역 */ .intro_guideimg {float: left; width: 100%; margin-bottom: 30px;} .intro_guideimg li {float: left; width: 50%;} .intro_guideimg li img {width: 100%;} .maintenance_intro {float: left; width: 100%;} .maintenance_intro ul {float: left; width: 100%; text-align: center;} .maintenance_intro ul.intro_steparea {margin-top: 50px;} .maintenance_intro ul .intro_tit {font-family: "NanumSquare", sans-serif; font-size: 30px; color: #161616; font-weight: 400; line-height: 42px;} .maintenance_intro ul .intro_tit strong {font-weight: 800;} .maintenance_intro ul .intro_tit strong.pointcolor {color: #f49b1e;} .maintenance_intro ul .intro_tit_bullet {display: inline-block; width: 1px; height: 42px; margin: 14px 0 10px; background: #f49b1e;} .maintenance_intro ul .intro_subtxt {font-family: "Noto Sans KR", sans-serif; font-size: 15px; color: #7c7c7c; font-weight: 400; line-height: 22px;} .maintenance_intro ul .intro_subtxt2 {margin-top: 20px;} .mainten_need {float: left; width: 100%; margin-top: 5px; background: #f4f4f4; border-right: 1px solid #dddddd; border-bottom: 1px solid #dddddd; box-sizing: border-box;} .mainten_need ul {float: left; width: 33.33333333333333%; padding: 150px 35px 40px; border-top: 1px solid #dddddd; border-left: 1px solid #dddddd; box-sizing: border-box;} .mainten_need ul:nth-child(1) {background: url("/normal_1/img/okweb/maintenance/images/mainten_needico1.png") no-repeat center 40px;} .mainten_need ul:nth-child(2) {background: url("/normal_1/img/okweb/maintenance/images/mainten_needico2.png") no-repeat center 40px;} .mainten_need ul:nth-child(3) {background: url("/normal_1/img/okweb/maintenance/images/mainten_needico3.png") no-repeat center 40px;} .mainten_need ul:nth-child(4) {background: url("/normal_1/img/okweb/maintenance/images/mainten_needico4.png") no-repeat center 40px;} .mainten_need ul:nth-child(5) {background: url("/normal_1/img/okweb/maintenance/images/mainten_needico5.png") no-repeat center 40px;} .mainten_need ul:nth-child(6) {background: url("/normal_1/img/okweb/maintenance/images/mainten_needico6.png") no-repeat center 40px;} .mainten_need ul li:nth-child(1) {font-family: "Noto Sans KR", sans-serif; font-size: 17px; color: #111111; font-weight: 500; line-height: 22px; letter-spacing: -0.8px; margin-bottom: 10px;} .mainten_need ul li:nth-child(2) {font-family: "Noto Sans KR", sans-serif; font-size: 14px; color: #676565; font-weight: 400; line-height: 20px;} .mainten_virtue {float: left; width: 100%; margin-top: 10px;} .virtue_left {float: left; width: 50%;} .virtue_right {float: right; width: 50%; height: 440px; padding: 30px; box-sizing: border-box; border: 1px solid #dddddd; border-left: 0; box-sizing: border-box; box-sizing: border-box;} .virtue_right .virtue_tit {text-align: left !important;} .virtue_right .virtue_tit li:nth-child(1) {font-family: "NanumSquare", sans-serif; font-size: 22px; color: #0c0c0c; font-weight: 700; margin-bottom: 5px;} .virtue_right .virtue_tit li:nth-child(2) {font-family: "Noto Sans KR", sans-serif; font-size: 16px; color: #5f5e5e; font-weight: 400; line-height: 22px; letter-spacing: -0.5px;} .virtue_stepbox {float: left; width: 100%; margin-top: 20px;} .virtue_steparea {float: left; width: 100%; text-align: left !important; margin-bottom: 20px;} .virtue_steparea .virtue_num {float: left; width: 33px; height: 33px; font-family: "Noto Sans KR", sans-serif; font-size: 16px; color: #fff; font-weight: 500; line-height: 33px; text-align: center; margin-right: 10px; background: #f49b1e; border-radius: 8px;} .virtue_steparea .virtue_num_txt {font-family: "Noto Sans KR", sans-serif; font-size: 19px; color: #1f1f1f; font-weight: 500;} .virtue_steparea .virtue_num_txt span {font-size: 15px; color: #5f5e5e; font-weight: 300;} .maintenance_titletxt {float: left; width: 100%; height: 290px; margin-bottom: 40px; background: url(/normal_1/img/okweb/maintenance/images/maintenance_top_bg.jpg) no-repeat center top; background-size: cover;} .maintenance_titletxt2 {background: url(/normal_1/img/okweb/maintenance/images/maintenance_top_bg2.jpg) no-repeat center top; background-size: cover;} .repair_titlebox {float: left; font-family: "Noto Sans KR", sans-serif; padding: 30px;} .repair_stress {font-family: "NanumSquare", sans-serif; font-size: 30px; color: #252525; font-weight: 400; line-height: 38px; margin-bottom: 15px;} .repair_stress b {font-weight: 800;} .repair_tit {font-size: 22px; color: #333; font-weight: 700; margin-bottom: 5px;} .repair_subtxt {font-size: 14px; color: #707070; font-weight: 400; line-height: 20px; letter-spacing: -0.1px;} .maintenance_pricebox {float: left; width: 100%; margin-bottom: 40px;} /* 유지보수 영역별 예시 */ .step_example_area {float: left; width: 100%; padding: 0 30px 30px; box-sizing: border-box; margin-top: 50px; background: #f4f4f4;} .maintenance_example_box {position: relative; float: left; width: 100%; height: 685px; padding-top: 40px; box-sizing: border-box; margin-top: 40px; background: #fff url(/normal_1/img/okweb/maintenance/images/step_example_bg.jpg) no-repeat right top; border: 1px solid #dfdbdb;} .maintenance_example_box .slider {float: left; width: 71.91011235955056% !important; height: 604px !important; margin-left: 25.84269662921348%;} .maintenance_example_box .slider .step_pricearea {width: 640px !important; height: 100% !important;} .maintenance_example_box .slider div.bx-clone {display: none;} .bx-controls {display: none;} #bx-pager {position: absolute; top: 40px; left: 40px; width: 160px;} #bx-pager ul li {float: left; width: 160px;} #bx-pager ul li a {display: block; width: 100%; height: 47px; font-family: "Noto Sans KR", sans-serif; font-size: 15px; color: #6a6969; font-weight: 400; line-height: 47px; text-align: center; background: #fff; border: 1px solid #eee; border-bottom: 0; box-sizing: border-box; transition: all 0.3s ease-in-out;} #bx-pager ul li:last-child a {border-bottom: 1px solid #eee;} #bx-pager li a.active, #bx-pager li a:hover {background-color: #ed5b3b; color: #fff; border: 1px solid #ed5b3b; box-sizing: border-box;} #bx-pager ul li:last-child a.active, #bx-pager li:last-child a:hover {border-bottom: 1px solid #ed5b3b;} .maintenance_example_box .slider div .step_pricearea .step_price {margin: 0 auto; width: 480px;} .maintenance_example_box .slider div .step_pricearea .step_price2 {margin-top: 10px; margin-bottom: 20px;} .maintenance_example_box .slider div .step_pricearea .step_price .step_price_tit {position:relative; display: inline-block; width: 280px; height: 46px; font-family: "Noto Sans KR", sans-serif; font-size: 15px; color: #fff; font-weight: 400; line-height: 46px; padding: 0 0 0 30px; box-sizing:border-box; background: #7292ed; border-radius: 50px; z-index: 2;} .maintenance_example_box .slider div .step_pricearea .step_price .step_price_num {position:relative; display: inline-block; width: 250px; height: 46px; font-family: "Noto Sans KR", sans-serif; font-size: 19px; color: #fff; font-weight: 500; line-height: 42px; text-align: center; padding: 0 0 0 30px; box-sizing:border-box; margin-left: -50px; background: #faa21b; border-radius: 50px; z-index: 1;} .maintenance_example_box .slider div .step_pricearea .step_price2 .step_price_num {line-height: 43px;} /* 테이블 스타일 */ .table_box {border: 1px solid #e5e5e5; box-sizing:border-box;} .table_box tr:first-child th {border-top: 3px solid #ed5b3b;} .table_box tr:first-child td {border-top: 3px solid #41bdb4;} .table_box tr {border-bottom: 1px solid #ddd;} .table_box th {width: 240px; font-family: "Noto Sans KR", sans-serif; font-size: 15px; color: #f1744d; font-weight: 500; text-align: center; padding: 10px 5px; background-color: #fffaf9; border-right: 1px solid #e5e5e5; border-bottom:1px solid #e5e5e5;} .table_box td {font-family: "Noto Sans KR", sans-serif; font-size: 14px; color: #747474; line-height: 21px; font-weight: 400; text-align: center; padding: 10px 15px; border-right: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5;} .maintenance_servicebox {float: left; width: 100%; margin-bottom: 40px;} .maintenance_servicebox p {font-family: "Noto Sans KR", sans-serif; font-size: 14px; line-height: 20px; color: #777; letter-spacing: -0.05em; margin-bottom: 15px;} .maintenance_orderbox {float: left; width: 100%; margin-bottom: 20px;} .tip_box {float: left; font-family: "Noto Sans KR", sans-serif; width: 100%; height: inherit; background-color: #f5f5f5;} .tip_box2 {margin-bottom: 40px;} .tip_box3 {margin-top: 15px; margin-bottom: 40px;} .tip_box4 {margin-top: 15px; margin-bottom: 15px;} .tip_title {clear: both; font-size: 18px; font-weight: 600; color: #222; background: url(/normal_1/img/okweb/maintenance/images/exclamation.png) 0 50% no-repeat; padding-left: 28px; margin-top: 35px; margin-bottom: 15px; margin-left: 35px;} .tip_box ul {padding: 35px; padding-top: 0;} .tip_box ul li {overflow: hidden; color: #666; line-height: 25px;} .tip_box ul li span {float: left;} .tip_box ul li p {font-size: 13px; letter-spacing: -0.7px; padding-left: 10px;} .maintenance_btnbox {float: left; width: 100%;} .maintenance_btnarea {margin: 20px auto 0; width: 200px;} .maintenance_btnarea li a {display: block; height: 50px; font-family: "Noto Sans KR", sans-serif; font-size: 15px; color: #fff; line-height: 50px; text-align: center; background-color: #7d7d7d; border-radius: 4px; transition: all 0.5s ease;} .maintenance_btnarea li a:hover {background-color: #ed5b3b;} #sub_design_detail {float: left; width: 100%; margin-top: 20px;} #designProductDetailContent {float: left; width: 100%; text-align: center; padding: 30px 0; border: 1px solid #e1e1e1; box-sizing:border-box; border-top:0;} #designProductAgreement {float: left; width: 100%; font-family: "Noto Sans KR", 나눔바른고딕, NanumBarunGothic, "Nanum Gothic", 돋움, Dotum, AppleGothic, sans-serif; font-size: 14px; color: #757575; line-height: 20px; text-align: justify; /* 텍스트 양쪽정렬 css */ padding: 20px; border: 1px solid #e1e1e1; box-sizing:border-box; border-top: 0;} /* 마이페이지 컨텐츠 영역 */ #myservice {float:left; width:100%;} #myservice table {float:left; width:100%; border-top:2px solid #000; margin-bottom:40px;} #myservice table tr td {font-family: "Noto Sans KR", sans-serif; font-size:14px; letter-spacing: 1px; border: 1px solid #dedede;} #myservice table input {font-family: "Noto Sans KR", "나눔고딕", nanumgothic, "맑은고딕", malgun gothic, arial, "돋움", dotum, sans-serif; font-size:13px; margin-right:5px;} #myservice table select {height:30px; font-family: "Noto Sans KR", "나눔고딕", nanumgothic, "맑은고딕", malgun gothic, arial, "돋움", dotum, sans-serif; font-size:13px;} #select_id {float:left; width:100%; font-family: "Noto Sans KR", sans-serif; font-size:13px; color: #99a0a9; padding-bottom:10px; margin-bottom:40px; border-bottom: 1px solid #dedede;} .select-styled {display: none;} .select-options {display: none;} #myservice table input[type=image] {margin-top: -5px;} #myservice table input[type=button], #myservice table input[type=submit] {color:#fff; padding:3px 5px; background-color:#000; border:1px solid #000;} #select_id select[name=selected_id] {height:30px; font-family: "Noto Sans KR", "나눔고딕", nanumgothic, "맑은고딕", malgun gothic, arial, "돋움", dotum, sans-serif; font-size:13px; margin-right:15px; border: 1px solid #e5e5e5;} #select_id span {font-size:13px; font-weight: 700; color: #FF6600; margin-right:10px;} #select_id font {float:left; font-size:14px; font-weight: 400; text-align: justify; padding:20px; border: 4px solid #dedede;} #select_id a strong {float:left; width:180px; height:35px; font-size:15px; color:#fff; font-weight:400; text-align:center; line-height:35px; padding:0 15px; margin-top:10px; margin-bottom:20px; background-color:#000;} #select_id .select {display: inline-block; margin-top: -3px;} #select_id .select br:nth-of-type(3) {display:none;} #module_stitle2 {float:left; width:100%; font-size:14px; font-weight:400; margin-bottom:10px;} #module_stitle2 b {font-weight:500;} #module_stitle2 table {margin-top:5px;} #module_stitle2 table tr td:nth-child(2) font {color:red; font-weight:700;} /* #m_info {margin-bottom:30px;} */ /* iframe {display:none;} */ .confirm_btnbox .form_confirm01 {font-family: "Noto Sans KR", "나눔고딕", nanumgothic, "맑은고딕", malgun gothic, arial, "돋움", dotum, sans-serif; font-size: 14px; color: #fff; font-weight: 500; cursor: pointer; padding: 10px 40px; margin-top: -5px; border: 1px solid #000; background: #000; box-sizing: border-box;} #myservice table tr td.tle1 p {text-align:left; padding:8px 20px !important; background-position:-60px !important;} #myservice2 {float:left; width:100%;} #myservice2 table {float:left; width:100%; border-top:2px solid #000; margin-bottom:20px;} #myservice2 table tr td {font-size:14px; letter-spacing: 1px; border: 1px solid #dedede;} #myservice2 table input {font-family: "Noto Sans KR", "나눔고딕", nanumgothic, "맑은고딕", malgun gothic, arial, "돋움", dotum, sans-serif; font-size:13px; margin-right:5px;} #myservice2 table select {height:30px; font-family: "Noto Sans KR", "나눔고딕", nanumgothic, "맑은고딕", malgun gothic, arial, "돋움", dotum, sans-serif; font-size:13px;} #myservice3 {float:left; width:100%;} #myservice3 table {float:left; width:100%; border-top:2px solid #000; margin-bottom:20px;} #myservice3 table tr td {font-size:14px; letter-spacing: 1px; border: 1px solid #dedede;} #myservice3 #module_stitle {border-left: 5px solid #454444;} .module_inputbox {float:right; margin-right:15px;} #myservice3 table:nth-child(2) {display:none;} /* 더미페이지 */ #paging_design2 {float:left; width:100%; text-align:center; color:#fff; margin-bottom:50px;} #paging_design2 a {display:inline-block; width:33px; color:#757575; font-size:12px; margin-left:-1px; padding:9px 0; border:1px solid #d7d5d5; vertical-align:top;} #paging_design2 a:hover {color:#000; font-weight:500; background-color:#eee;} #paging_design2 .current {display:inline-block; width:33px; color:#fff; font-size:12px; font-weight:600; margin-left:-1px; padding:9px 0; background-color:#000; border:1px solid #000; vertical-align:top;} #paging_design2 a:first-child {width:54px; background-color:#eee;} #paging_design2 a:last-child {width:54px; background-color:#eee;} /* 회사소개, 차별화서비스 컨텐츠 영역 */ .company_intro {float:left; width:100%;} .company_intro ul {float:left; width:100%; text-align: center;} .company_intro ul li.intro_tit2 {font-family: "NanumSquare", sans-serif; font-size: 40px; color: #353434; font-weight: 800; line-height: 42px;} .company_intro ul li.intro_tit_bullet {display: inline-block; width: 1px; height: 42px; margin: 14px 0 14px; background: #f49b1e;} .company_intro ul.intro_subbox {padding: 30px; margin-top: 40px; border: 5px solid #e8e5e5; box-sizing:border-box;} .company_intro ul li.intro_subtit {font-family: "Noto Sans KR", sans-serif; font-size:15px; color:#555454; font-weight:400; line-height:23px; margin-bottom:20px; word-break: keep-all;} .company_intro ul li.intro_subtit2 {font-family: "Noto Sans KR", sans-serif; font-size:15px; color:#555454; font-weight:400; line-height:23px; word-break: keep-all;} .company_intro ul li img {width: 100%;} .campany_service {float:left; width:100%; padding: 0 50px 50px; box-sizing:border-box; margin-top: 50px; background: #f4f4f4;} .campany_service ul {float:left; width:100%; text-align: center;} .campany_service ul.intro_steparea {margin-top: 50px;} .intro_steparea .intro_tit {font-family: "NanumSquare", sans-serif; font-size: 30px; color: #161616; font-weight: 400; line-height: 42px;} .intro_steparea .intro_tit strong {font-weight: 800;} .intro_steparea .intro_tit strong.pointcolor {color: #f49b1e;} .intro_steparea .intro_tit_bullet {display: inline-block; width: 1px; height: 42px; margin: 14px 0 10px; background: #f49b1e;} .cp_service_tit {font-family: "NanumSquare", sans-serif; font-size:22px; color: #1e1e1e; font-weight: 400; margin-bottom: 5px;} .cp_service_tit strong {font-weight: 800;} .cp_service_stxt {font-family: "Noto Sans KR", sans-serif; font-size:15px; color: #555454; font-weight:400;} .service_listbox {float:left; width:100%; margin-top: 30px;} .service_listbox > div > [class^=container_] {float: left; position: relative; width: 100%;} .service_listbox > div > .container_1 {width: 33.33333333333333%; padding-right: 2.352941176470588%; padding-bottom: 2.352941176470588%; box-sizing:border-box;} .service_listbox > div > .container_2 {width: 33.33333333333333%; padding-right: 2.352941176470588%; padding-bottom: 2.352941176470588%; box-sizing:border-box;} .service_listbox > div > .container_3 {width: 33.33333333333333%; padding-bottom: 2.352941176470588%;} .service_listbox > div > .container_4 {width: 33.33333333333333%; padding-right: 2.352941176470588%; box-sizing:border-box;} .service_listbox > div > .container_5 {width: 33.33333333333333%; padding-right: 2.352941176470588%; box-sizing:border-box;} .service_listbox > div > .container_6 {width: 33.33333333333333%;} .service_conimgarea {overflow: hidden; position: relative; text-align: left; height: 295px;} .service_conimgarea:after {content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-size: cover; z-index: 1; transform: scale(1); transition: all 0.6s;} .service_conimgarea p {padding: 45px 30px 0; position: relative; z-index: 10;} .service_conimgarea .text_title {font-family: "NanumSquare", sans-serif; font-size: 22px; color: #fff; font-weight: 800; letter-spacing: -1px; padding-top: 145px; transition: all 0.6s;} .service_conimgarea .text_stext {font-family: "Noto Sans KR", sans-serif; font-size:14px; color: #fff; font-weight: 500; line-height: 20px;} .service_conimgarea .text_stext:before {content: ""; display: block; width: 20px; height: 1px; background: #fff; margin: 10px 0px 10px; margin-top: -15px; margin-bottom: 20px;} .service_conimg1 {background:url(/normal_1/img/okweb/sub/images/service_imgbg1.jpg) no-repeat;} .service_conimg2 {background:url(/normal_1/img/okweb/sub/images/service_imgbg2.jpg) no-repeat;} .service_conimg3 {background:url(/normal_1/img/okweb/sub/images/service_imgbg3.jpg) no-repeat;} .service_conimg4 {background:url(/normal_1/img/okweb/sub/images/service_imgbg4.jpg) no-repeat;} .service_conimg5 {background:url(/normal_1/img/okweb/sub/images/service_imgbg5.jpg) no-repeat;} .service_conimg6 {background:url(/normal_1/img/okweb/sub/images/service_imgbg6.jpg) no-repeat;} .business_area {float:left; width:100%; margin-top: 50px;} .business_area ul {float:left; width:100%; text-align: center;} .business_itemlist {float:left; width:100%; margin-top: 30px;} .business_itemlist > div > [class^=container_] {float: left; position: relative; width: 100%;} .business_itemlist > div > .container_1 {width: 33.33333333333333%; padding-right: 34px; padding-bottom: 34px; box-sizing:border-box;} .business_itemlist > div > .container_2 {width: 33.33333333333333%; padding-right: 34px; padding-bottom: 34px; box-sizing:border-box;} .business_itemlist > div > .container_2:before {content: ""; position: absolute; top: 48%; left: -26px; width: 18px; height: 1px; background-color: #e8e5e5;} .business_itemlist > div > .container_3 {width: 33.33333333333333%; padding-bottom: 34px;} .business_itemlist > div > .container_3:before {content: ""; position: absolute; top: 48%; left: -26px; width: 18px; height: 1px; background-color: #e8e5e5;} .business_itemlist > div > .container_4 {width: 33.33333333333333%; padding-right: 34px; box-sizing:border-box;} .business_itemlist > div > .container_5 {width: 33.33333333333333%; padding-right: 34px; box-sizing:border-box;} .business_itemlist > div > .container_5:before {content: ""; position: absolute; top: 48%; left: -26px; width: 18px; height: 1px; background-color: #e8e5e5;} .business_itemlist > div > .container_6 {width: 33.33333333333333%;} .business_itemlist > div > .container_6:before {content: ""; position: absolute; top: 48%; left: -26px; width: 18px; height: 1px; background-color: #e8e5e5;} .workarea {overflow: hidden; position: relative; text-align: left; height: 295px; text-align: center; background: #fff; border: 1px solid #e8e5e5; box-sizing:border-box;} .providearea {height: 325px;} .provide_common {width: 100%;} .provide_common img {width: 100%;} .workarea:hover {background: #f0f0f0; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease;} .workarea img {padding-top: 30px;} .workarea .text_title {font-family: "NanumSquare", sans-serif; font-size: 24px; color: #262626; font-weight: 800; line-height: 24px; letter-spacing: -1px; padding-top: 36px; transition: all 0.6s;} .workarea .text_stext {font-family: "Noto Sans KR", sans-serif; font-size: 14px; color: #898888; font-weight: 400; line-height: 18px;} .workarea .text_stext:before {content: ""; display: block; width: 25px; height: 2px; background: #f9a755; margin: 25px auto 22px;} .textbold {font-weight: 400;} .textcolor {color: #f49b1e;} .about_okweb {float:left; width:100%; margin-top: 50px;} .about_okweb img {width: 100%;} /* 오시는길 컨텐츠 영역 */ .location_area {float: left; width: 100%; height: auto; background-color: #f2f1f1;} .location_area2 {margin-bottom: 50px;} .map_conbox {float: left; width: 97.89473684210526%; margin-top:10px; margin-bottom:10px; margin-left:10px; background-color:#fff; border:1px solid #d7d4d4; box-sizing:border-box;} .map_info_area {float: left; width: 23.54838709677419% /*219px*/; padding: 20px; box-sizing:border-box;} .map_info_title {float: left; width: 100%; margin-bottom: 20px;} .map_info_title li:nth-child(1) {font-size: 24px; font-weight: 700;} .map_info_title li:nth-child(2) {font-size: 14px; color: #a29f9f; font-weight:400; line-height:16px;} .map_info_address {float: left; width: 100%; padding-top: 30px; padding-left: 40px; box-sizing:border-box; margin-bottom:20px; background:url(/normal_1/img/okweb/sub/images/map_icon.png) no-repeat 0 30px; border-top:1px solid #c1c0c0;} .map_info_address li:nth-child(1) {font-size: 13px; font-weight: 500;} .map_info_address li:nth-child(2) {font-size: 14px; color: #797878; font-weight: 400; line-height: 18px; word-break: keep-all;} .map_info_call {float: left; width: 100%; padding-bottom: 30px; padding-left: 40px; box-sizing:border-box; background: url(/normal_1/img/okweb/sub/images/map_call_icon.png) no-repeat 0 3px; border-bottom: 1px solid #c1c0c0;} .map_info_call li:nth-child(1) {font-size:13px; font-weight:500;} .map_info_call li:nth-child(2) {font-size:14px; color:#797878; font-weight:400; line-height:18px;} .map_info_naver {float: left; width: 100%; margin-top:40px;} .map_info_naver li a img {width: 100%;} .consult_btnarea {float: left; width: 100%; margin-top:15px;} .consult_btnarea li a {display: block; width: 100%; height: 43px; font-size: 15px; color: #fff; text-align: center; line-height: 43px; background-color: #000; border: 1px solid #000; box-sizing:border-box; } .consult_btnarea li a:hover {color:#000; background-color:#fff; border:1px solid #7d7d7d; box-sizing:border-box;} .map_naverimg {float: right; width: 76.12903225806452% /*708px*/; border-left: 1px solid #d7d4d4;} .map_naverimg li img {width: 100%;} /* 이용약관, 개인정보처리방침 컨텐츠 영역 */ .member_usebox {float: left; width: 100%; padding: 10px; box-sizing:border-box; background-color: #eeeeee; border-top: 2px solid #000; border-bottom: 1px solid #dddddd;} .member_usearea {float: left; font-family: "Noto Sans KR", 나눔바른고딕, NanumBarunGothic, "Nanum Gothic", 돋움, Dotum, AppleGothic, sans-serif; font-size: 13px; color: #757575; line-height: 20px; white-space:pre-line; /* 텍스트 자동 줄바꿈 css */ text-align:justify; /* 텍스트 양쪽정렬 css */ padding:20px; background-color:#fff; border:1px solid #dddddd; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;} .member_usearea p {float: left; margin-top: -20px;} /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** okweb_pc 1024,1279 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:1024px) and (max-width:1279px) { .sub_menutab {display:none;} .leftgnb_submenu ul li a {background: url(/normal_1/img/okweb/sub/images/menu_bullet.png) no-repeat 135px;} .leftgnb_submenu ul li.on a {background: #fdfadc url(/normal_1/img/okweb/sub/images/menu_bullet_on.png) no-repeat 135px;} .leftgnb_submenu ul li.off a:hover {background: #f1f1f1 url(/normal_1/img/okweb/sub/images/menu_bullet_hover.png) no-repeat 135px;} /* 도메인, 호스팅 서브메뉴 */ #sub_menu .off a {background: url(/normal_1/img/okweb/sub/images/menu_bullet.png) no-repeat 135px;} #sub_menu .off a:hover {background: #f1f1f1 url(/normal_1/img/okweb/sub/images/menu_bullet_hover.png) no-repeat 135px;} #sub_menu .on a {background: #fdfadc url(/normal_1/img/okweb/sub/images/menu_bullet_on.png) no-repeat 135px;} #sub_menu .highlight a {background: #fdfadc url(/normal_1/img/okweb/sub/images/menu_bullet_on.png) no-repeat 135px;} #myservice_box a {background: #f9f9f9 url(/normal_1/img/okweb/sub/images/go_domain_hosting.png) no-repeat 133px;} #myservice_box a:hover {background: url(/normal_1/img/okweb/sub/images/goc_domain_hosting.png) no-repeat 133px;} .homepage_titleimgbox ul li img {width: 100%;} .websites_titlearea {padding-top: 120px;} .responsive_titleimgbox {width: 100%;} .responsive_titlebox {width: 100%;} .responsive_subtxt {font-size: 16px; line-height: 22px;} .mobile_shop3_titleimg li img {width: 100%;} .mobile_guide_subcontxt {height: 255px;} .subtop_res_titletxt {width: 100%;} .guideprice_txt {width: 70%;} .cont-space {width: 100%; height: 325px;} .cont-tab a {width: 10% !important; letter-spacing: -1px; box-sizing:border-box;} .cont-tab a:nth-child(3) {width: 17.5% !important;} .cont-tab a:nth-child(4) {width: 18.5% !important;} .cont-tab a:nth-child(5) {width: 13% !important;} .cont-tab a:nth-child(6) {width: 11% !important;} .cont-space .swiper-slide .process_ico {width: 20.78651685393258%; margin-top: 30px; margin-left: 20px;} .cont-space .swiper-slide .process_ico img {width: 100%;} .cont-space .swiper-slide .process_infobox {width: 67.97752808988764%; margin-top: 30px;} .cont-space .swiper-slide .process_infobox .process_nametxt li:nth-child(1) {font-size: 24px;} .cont-space .swiper-slide .process_infobox .process_nametxt li:nth-child(3) {font-size: 13px;} .cont-space .swiper-container-4 .swiper-button-prev, .cont-space .swiper-container-4 .swiper-button-next {margin-top: 10px;} .mall_titlearea {padding-top: 100px; padding-left: 25px;} .malltit_txt {font-size: 30px;} .malltit_txt_sub {font-size: 17px; line-height: 22px;} .malltit_subtxt br {display: none;} .maintenance_example_box .slider div {width: 100% !important;} .maintenance_example_box .slider .step_pricearea {width: 100% !important;} .maintenance_example_box .slider div .step_pricearea .step_price {width: 480px !important;} .mainten_need ul li:nth-child(1) {font-size: 16px; letter-spacing: -1.5px;} .mainten_need ul li:nth-child(2) {letter-spacing: -1px;} .virtue_left {height: 390px;} .virtue_left img {width: 100%; height: 100%;} .virtue_right {height: 390px;} .virtue_right .virtue_tit li:nth-child(1) {font-size: 20px;} .virtue_right .virtue_tit li:nth-child(2) {font-size: 15px; line-height: 22px;} .virtue_steparea {margin-bottom: 10px;} .virtue_steparea .virtue_num_txt {font-size: 17px;} .virtue_steparea .virtue_num_txt span {font-size: 14px; letter-spacing: -0.5px;} /* 회사소개, 차별화서비스 컨텐츠 영역 */ .service_conimgarea .text_title {font-size: 20px;} } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** okweb_pc 1280,1919 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:1280px) and (max-width:1919px) { .sub_menutab {display:none;} } /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* *** okweb_pc 1920 *** */ /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */ @media screen and (min-width:1920px) { .sub_menutab {display:none;} }