/** * Theme styleseet file * * @Program DWEBS * @Type css * @author DWEBS * @link https://www.dwebs.kr */ @import url(//fonts.googleapis.com/earlyaccess/nanummyeongjo.css); /* ------------------------------------------------------------------- | Custom selection color | ------------------------------------------------------------------*/ ::selection { background-color: #5d5d5d; color: #58FAF4; } ::-moz-selection { background-color: #cccccc; color: white; } /* ------------------------------------------------------------------- | Custom mark tag | ------------------------------------------------------------------*/ mark { background: #CEECF5; border-radius: 3px; padding:4px; color: #000; font-weight:bold; } /* ------------------------------------------------------------------------------------ | Custom bootstrap breadcrumb | | 서브페이지 타이틀 영역 | 부트스트랩 breadcrumb 기본 구분자 및 속성 수정 | | 부트스트랩은 페이지 로케이션을 위한 breadcrumb 클래스를 기본 제공합니다. | 이러한 페이지로케이션의 각 영역간 구분자는 따로 명시하지 않으면 기본 / 로 표시하게되며, | 이것을 변경하려면 .breadcrumb>li+li:before {content: ">";}등과 같이 재선언 합니다. | -----------------------------------------------------------------------------------*/ .breadcrumb {color:#9c9c9c; font-size:12px; padding: 5px 0px 0; margin-bottom: 10px; list-style: none; border-radius: 4px; background:none;font-family: "NotoSans-Medium", sans-serif} .breadcrumb>li+li:before {padding: 0 5px; color: #9c9c9c; content: ">";} .breadcrumb .active{color:#9c9c9c;} /* ------------------------------------------------------------------- | Header section | | 테마의 헤더영역내의 속성을 정의합니다. | ------------------------------------------------------------------*/ /* #navitop_mobile {vertical-align:middle;background:#fff;background: rgba(19,35,52,0.8);position:absolute; z-index: 999; width: 100%;} */ #navitop_mobile {vertical-align:middle; height: 65px; background-color: transparent; position:absolute; z-index: 999; width: 100%; transition: all .3s; border-bottom: 1px solid rgba(255,255,255,.3); display: flex; justify-content: center; align-items: center;} .logo {text-align: center;} .logo a{ height: 35px; line-height: 58px;} .logo img {height :100%;} .mobile_btn { position:relative; background-color:#000;border:0px solid #2f2f2f; position: absolute; right: 20px; top:12px;} .mobile_btn .lines, .mobile_btn .lines::before, .mobile_btn .lines::after {background-color: #fff; transition: all .3s; } .plus .mobile_btn .lines, .plus .mobile_btn .lines::before, .plus .mobile_btn .lines::after {background-color: #197cfa; } .icon-bar {margin-top:4px;margin-bottom:4px;background-color:#939393;display:block;width:22px;height:2px;border-radius:1px} .top_navi{background:#151314;padding:5px 0 7px} .top_navi ul{;} .top_navi ul li{display:inline;padding:0 2.3% 0;} .top_navi ul li a{font-size:9pt;color:#fff;text-decoration:none;letter-spacing:0.5px;font-family: "nanumMJ_B", sans-serif} .top_navi ul li a.active{color:#666} /* -------------------------------------------------------------------\ | Foot section | | 테마의 푸터영역의 속성을 정의합니다. | ------------------------------------------------------------------*/ .footer_area {text-align:center;padding:3%; border-top:1px solid #ddd; position: relative; padding-bottom: 30px;} .f_right_icon {width: 350px;position: absolute; top: 20px; left: 50%; font-size: 0; margin-left: -175px;} .f_r_logo { display: inline-block; border: 1px solid #ccc; padding: 10px; position: relative;} .f_img_box {text-align: center;} .f_right_t {font-size: 13px;color: #6d727a; font-family: 'nanum', sans-serif; margin-top: 5px; letter-spacing: -1px;} .click_box {position: absolute; top: 0; left: 0; width: 100%; height: 100%;} .click_box a {display: block; width: 100%; height: 100%;} .f_logo {display:block; text-align: center; margin:20px auto 10px auto; width: 150px; } .f_logo img {width: 100%;} .footer_logo ul{display:table; margin:0 auto;} .footer_logo ul li {display:table-cell; width:33%;} .footer_logo ul li img{max-width:90%; height:auto;} .footer_sns {text-align:center;} .footer_sns ul {margin-top:20px;} .footer_sns ul li {display:inline-block; margin-right:10px;} .footer_sns ul li:last-child {margin-right:0;} .footer_sns ul li:nth-child(1) a span { background: url('../images/ft_sns1.jpg') no-repeat 0 0;} .footer_sns ul li:nth-child(2) a span {background: url('../images/ft_sns2.jpg') no-repeat 0 0; } .footer_sns ul li:nth-child(3) a span {background: url('../images/ft_sns3.jpg') no-repeat 0 0;} .footer_sns ul li a span { transition: all 0.3s ease; opacity: 1; zoom:1; display: inline-block; width:50px; height:50px;} .footer_sns ul li a:hover span {text-decoration: none; opacity:0.5;} .footer_copy{position: relative; width: 100%; font-size:12px; letter-spacing: -0.5px; font-weight: 300; color:#8f8f8f; line-height:20px; padding: 10px 0; word-break: keep-all;} /* 퀵배너 */ .quick_banner { position:fixed; right:20px; bottom:70px; z-index: 5; display: flex; flex-direction: column; transition: right .2s linear;} #wrap.visible .quick_banner { right:270px } .quick_banner a {display: block; } .quick_banner a img {width: 80px;} .quick_banner a + a {margin-top: 3px; } .quick_menu {display:block; position:fixed; width:100%;; height:50px; bottom:0; z-index: 3; } .quick_menu ul {height:100%;} .quick_menu ul li{width:50%; float:left; text-align:center; height:100%; padding-top:5px;} .quick_menu ul li:first-child {background-color: rgba( 59, 120, 216, 0.9 ); } .quick_menu ul li:last-child {background-color: rgba( 255, 235, 0, 0.9 );} .quick_menu ul li:last-child a {color:#3a1f1e;} .quick_menu a {display:block; width:100%; height:100%; color:#fff; font-weight:500; padding-top:9px; font-size:15px;} .quick_menu a i {font-size:20px; padding-right:3%; padding-top:2px;} .quick_menu a img {max-width:36px; padding-right:3%;} .quick_menu a:hover {text-decoration: none;} .footer_icon {width: 100%; margin: 20px 0 15px 0; text-align: center;} .footer_icon ul li {display: inline-block; margin-right: 40px;} .footer_icon ul li:last-child {margin-right: 0;} .ft_btn {width: 180px; margin: 0 auto;} .ft_btn a {width: 180px; padding: 3px 0; background: #0077d3; border-radius: 3px; display: block; text-decoration: none; font-size: 13px; font-weight: 300; color:#fff; text-align: center; transition: all 0.3s;} .ft_btn a.gray {background: #cacaca; margin-top: 10px; border-color: #cacaca;} .ft_btn a:hover {background: #333} /* 이용약관 p */ .age_p {font-size:13px; font-weight: 300; letter-spacing: -.5px; word-break: keep-all; line-height: 20px; } /* .quick_menu.tel { background: #3b78d8;} .quick_menu.kakao {background: #f7e626; bottom:70px;} .quick_menu.kakao a {color:#3a1f1e; font-size:13px; padding-top:13px;} .quick_menu.kakao a img {max-width:60%; height: auto;} .quick_menu.tel a:hover {color:#fff; text-decoration: none;} .quick_menu.kakao a:hover {color:#3a1f1e; text-decoration: none; } */ .admin{;} .admin a{font-size:10px;color:#ccc;border:1px solid #666;background:#333;padding:3px 7px;border-radius:3px;font-family: "nanum_B", sans-serif;letter-spacing:0.5px;text-decoration:none} .dwebs_logo{;} .footer_area .btn-default{font-size:10px;background:#fff;color:#666} .footer_area .btn-primary.active, .btn-primary.active:hover{font-size:10px;background:#ececec;border:1px solid #ccc;color:#666} .footer_device{display:block; margin-top:5px;} .footer_device .btn-default{font-size:10px;background:#2c2c2c;color:#ccc;border:1px solid #474747;} .footer_device .btn-primary.active, .btn-primary.active:hover{font-size:10px;background:#000;border:1px solid #474747;color:#ccc} .quick_wrap{width:100%} .quick{position:relative;text-align:center;padding:20px 0} .quick img{width:80%} .quick a{text-decoration:none} .quick ul{;} .quick ul:after {display:block;clear:both;content:"";} .quick ul li{width:48%;float:left;margin:0 1%} /* ------------------------------------------------------------------- | Button section | | 테마내의 버튼들의 속성을 정의 합니다. | ------------------------------------------------------------------*/ .btn_page_up{position:fixed; bottom:20px; right:20px; z-index:1000; display:none; transition: right .2s linear;} #wrap.visible .btn_page_up {right: 270px;} .page_up { transition: all 0.3s; width: 44px; height: 43px; border:1px solid rgba(255,255,255,.2); overflow: hidden; background: transparent; border-radius: 50%; } .page_up img {max-width: 100%;} /* .btn_page_up{position:fixed; bottom:50px; right:50px; z-index:1000; display:none;} .btn_page_up img:hover{opacity:0.5; cursor:pointer;} */ .login_btn_default { background-color:#474a4d; border:1px solid #474a4d; color:#3c4349; font-size:12pt; height:68px; color:#ccc; } .login_btn_default:hover { background-color:#333; color:#fff; } #device_btn {vertical-align:middle; margin:0 auto;} .board_btn_default { background-color:#474a4d; border:1px solid #474a4d; color:#d8d8d8; font-size:10pt; padding-left:10px; padding-right:10px; height:30px; } .board_btn_default:hover { color:#fff; } /* ------------------------------------------------------------------- | Bxslider section | | 테마의 Body영역의 속성을 정의합니다. | ------------------------------------------------------------------*/ /* BXSLIDER */ .bxslider li img { margin:0 auto; } .bxslider_btn_prev { position: absolute; left: 2%; top: 55%; z-index: 99; background: url('../images/bxslider_btn_prev.png') no-repeat 0 50%; border: 0; width: 30px; height: 57px; text-indent: -9999px; margin-top: -30px; opacity:0.6; } .bxslider_btn_next { position: absolute; right: 2%; top: 55%; z-index: 99; background: url('../images/bxslider_btn_next.png') no-repeat 0 50%; border: 0; width: 30px; height: 57px; text-indent: -9999px; margin-top: -30px; opacity:0.6; } /* 메인레이아웃 */ h1, h2, h3, h4, h5 {margin: 0;} /* ------------------------------------------------------------------- | Body section | | 테마내에 일반적인 컨텐츠들의 속성을 정의합니다. | ------------------------------------------------------------------*/ /* warp */ #wrap {} /* 서브 레이아웃 */ #sub_top_area_wrap{width:100%;height:100%;} .sub_top_area{position:relative;width:100%;margin:0 auto;text-align:center;color:#fff;padding:110px 0 50px 0;} .sub_top_area_t{font-size:24px; font-weight: 500;} .sub_top_area_line{width:100px;height:1px;border-bottom:1px solid #fff;margin:0 auto;padding-top:10px;} .sub_article{position:relative;width:1300px;margin:0 auto;padding-bottom:50px;border-bottom:1px solid #151314} #sub_top_title {text-align:center;padding: 0 20px 20px;border-bottom: 1px solid #eee; margin-bottom: 30px;} #sub_top_title .sub_title{color:#222;font-size:18px; padding-bottom: 22px; } #sub_top_title .sub_t_line {width: 80px; height: 1px; background: #2359f5; margin: 0 auto; position: relative; top: 21px;} #sub_top_title .sub_tt_line {width: 80px; height: 1px; background: #2359f5; margin: 0 auto; position: relative; top: 21px;} .contents{min-height:350px;padding:0 15px 30px;} .sub_title_blet > img {width: 21px;} /*secureon*/ .secureon {width: 100%;} .secu1_article {margin-top: 10px;width: 100%;} .secu1_icon_box{margin-top: 25px;} .secu1_icon_box1 {display: flex; flex-direction: row; justify-content: space-between;} .secu1_icon_box2 {display: flex; flex-direction: row; flex-wrap: wrap;} .secu1_icon {width: 50%; height: 275px; border: 1px solid #ddd; background: #fafafa; text-align: center; padding: 45px 20px 0 20px;} .secu1_icon2 {width: 50%; height: 180px; position: relative; border: 1px solid #ddd; background: #fafafa; margin-left: -1px; margin-top: -1px; padding: 40px 10px 20px 10px;} .secu1_icon2:nth-child(2) {background: #fff;} .secu1_icon2:nth-child(3) {background: #fff;} .secu1_icon_box p {font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 500; color: #333; } .secu1_arrow {position: absolute; left: -1px; top: 50%; margin-top: -24px;} .secu1_icon2:nth-child(4) .secu1_arrow {position: absolute; top: 13px; left: 50%; margin-left: -15px;z-index: 3} .secu1_icon2:nth-child(4) .secu1_arrow img {transform: rotate(90deg);} .secu1_icon2:nth-child(3) .secu1_arrow {position: absolute; left: calc(100% - 28px); top: 50%; margin-top: -24px;z-index: 3; width: 29px; } .secu1_icon2:nth-child(3) .secu1_arrow img {transform: rotate(180deg);} .secu1_icon2 .sub_p_line {margin: 15px 0 5px 0;} .secu_process { position: relative; min-height: 70px;} .secu_process ul {position: relative; z-index: 2} .secu_process ul li {width: 100%; height: 70px; background: #fff; border: 1px solid #ddd; margin-bottom: 20px; line-height: 70px; text-align: center; font-size: 16px; font-weight: 400; color:#333; } .secu_process ul li:last-child {margin-right: 0;} .secu_process_line4 {width: 1px ; height: 300px; background: #ddd; position: absolute; top: 0; left: 50%; z-index: 0} .secu_process_line3 {width: 1px; height: 200px; background: #ddd; position: absolute; top: 0; left: 50%; z-index: 0} .secu_title_bg {width: 100%; height: auto; background: url('../images/sub/secu_title_bg.jpg') no-repeat 50% 50%; background-size: cover; padding:40px 0;} /* .secu_title_bg .sub_title_box {padding-top: 100px;} */ .secu_title_bg .sub_title_box h1 {color:#fff;} .secu_logo {margin-bottom: 20px;} .secu_logo img {width:200px;} .check_table {width: 100%;} .check_table table {width: 100%;} .check_table table thead th { background: #484848; text-align: center; color:#fff; padding: 15px 15px; font-size: 18px; font-weight: 400; letter-spacing: -0.3px; font-family: 'Montserrat', 'Noto Sans KR', sans-serif;} .check_table table thead th:nth-child(2) {background: #3bcacc} .check_table table thead th:nth-child(3) {background: #9068d7} .check_table table tbody th, .check_table table tbody td {border: 1px solid #ddd; padding: 5px 10px; font-size: 14px; font-weight: 300; font-family: 'Noto Sans KR', sans-serif; letter-spacing: -1px; line-height: 26px;} .check_table table tbody th {text-align: center; font-weight: 400; font-size: 15px; color:#333; background: #f7f7f7; line-height: 26px;} .check_table table tbody td {font-size: 14px; font-weight: 300; color:#666; line-height: 22px; letter-spacing: -1px; line-height: 26px;} .check_table table tbody td span {color:#e06900} .check_g { color:#3bcacc!important; font-size:30px!important; text-align: center!important;} .check_b { color:#9068d7!important; font-size:30px!important; text-align: center!important;} .secu_table_p {color: #e88521; font-size: 14px; font-weight: 300; line-height: 20px; letter-spacing: -.5px; margin-top:5px; word-break: keep-all; display: flex; align-items: flex-start;} .secu_table_p span {display: inline-block; margin-right:4px;} .test_ul {margin-top: 10px;} .test_ul li {font-size: 13px; color:#888; padding-left: 10px; } /*cloudon*/ .clo1_article {margin-top: 20px;} .clo1_icon_box {margin-top: 80px; display: flex; flex-direction: row;} .clo1_icon {width: 426px; border-right: 1px solid #efefef; padding: 0 50px;} .clo1_icon:last-child {border-right: 0;} .clo1_icon h1 {font-family: 'Montserrat', sans-serif; font-size: 16px; font-weight: 500; color: #333; } .clo1_txt {margin-top: 30px; background: #f7f7f7; border-radius: 30px 0 0 0; padding: 30px; text-align: left; min-height: 210px;} .clo1_txt ul li {margin-bottom: 10px; background: url('../images/sub/s_blet.png') no-repeat 0% 7px; padding-left: 15px; font-size: 14px; color:#666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all} .clo2_article {width: 100%; display: flex; flex-direction: row; margin-top: 40px; background: transparent; border-radius: 0 30px 30px 30px; border: 3px solid #0077d3; flex-wrap:wrap; justify-content: space-between; border-radius: 0; border:0;} .clo2_box {width:48%; background: #fff; border-top: 3px solid #0077d3; border-right:0; border-bottom-right-radius: 30px; text-align: center;} .clo2_box:nth-child(n+3) {margin-top:20px;} .clo2_box .sub_p_line {margin:20px 0 10px 0;} .clo2_box a {display: block; text-decoration: none; padding: 20px 20px;} .clo2_icon img {transition: all 0.3s; transform: scale(1);} .clo2_box:hover .clo2_icon img {transform: scale(1.1);} .clo2_box p { font-size: 14px; font-weight: 400; color: #333; letter-spacing: -1px; word-break: keep-all;} .clo2_article2 {margin-top: 70px;} .clo2_box2 {width: 100%; display: flex; flex-direction: column; margin-bottom:30px;} .clo2_box2:last-child {margin-bottom:0;} .clo2_img {width: 100%; } .clo2_img img {width: 100%; height:auto;} .clo2_txt {width: 100%; background: #fff; padding: 30px 25px;} .clo2_txt_line {width: 50px; height: 2px; background: #0077d3;} .clo2_txt h1 {font-size: 22px; font-weight: 500; color:#000; margin: 18px 0 15px 0; font-family: 'NanumSquare', sans-serif;} .clo2_txt p {font-size: 15px; font-weight: 300; color:#666; line-height: 24px; word-break: keep-all; letter-spacing: -1px;} .clo2_tt_box {width: 100%; background: #f7f7f7; padding: 20px; margin-top: 20px;} .clo2_tt_box ul li {font-size: 14px; color:#666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all; margin-bottom: 5px; background: url('../images/sub/s_blet.png') no-repeat 0% 7px; padding-left: 15px;} /* .clo2_box2:nth-child(1) .clo2_img { background: url('../images/sub/clo2_img1.jpg') no-repeat 50% 50%; background-size: cover;} .clo2_box2:nth-child(2) .clo2_img { background: url('../images/sub/clo2_img2.jpg') no-repeat 50% 50%; background-size: cover;} .clo2_box2:nth-child(3) .clo2_img { background: url('../images/sub/clo2_img3.jpg') no-repeat 50% 50%; background-size: cover;} .clo2_box2:nth-child(4) .clo2_img { background: url('../images/sub/clo2_img4.jpg') no-repeat 50% 50%; background-size: cover;} */ .clo3_article {} .clo3_article .check_table {margin-bottom: 30px;} .clo3_article .check_table table thead th:nth-child(2) {background: #484848} .clo3_article .check_table table thead th:nth-child(3) {background: #484848} .clo3_article .check_table table i { color:#197CFA!important; font-size:22px!important; text-align: center!important;} .clo3_article .check_table table thead th { background: #484848; text-align: center; color:#fff; padding: 15px 15px; font-size: 16px; font-weight: 400; letter-spacing: -0.3px; font-family: 'Noto Sans KR', sans-serif; border: 1px solid rgba(255,255,255,0.1); word-break: keep-all;} .clo3_article .check_table table tbody th, .clo3_article .check_table table tbody td {border: 1px solid #ddd; padding: 10px 15px; font-size: 16px; font-weight: 300; font-family: 'Noto Sans KR', sans-serif; letter-spacing: -0.5px; word-break: keep-all; vertical-align: middle} .clo3_article .check_table table tbody th {text-align: center; font-weight: 400; font-size: 16px; color:#333; background: #f7f7f7; line-height: 30px;} .clo3_article .check_table table tbody td {font-size: 14px; font-weight: 300; color:#333; line-height: 26px;} .clo3_article .drag_img {width: 100%; margin: 0 0 10px; text-align: right;} .clo3_article .drag_img img {width: 30px; } .clo3_box{padding: 20px; width:100%; position: relative;} .clo3_box:nth-child(1) { background: #f7f7f7;} .clo3_box:nth-child(2) { background: #3b658c;} .clo3_box:nth-child(3) {background: #1d354a;} .clo3_box:nth-child(1) h1 {color: #3f6990;} .clo3_box h1 {color:#fff;font-weight: 700; font-size: 22px; margin: 15px 0 25px 0;} .clo3_table table { width: 100%;} .clo3_table table th, .clo3_table table td { padding: 15px 10px; word-break: keep-all; text-align: center; letter-spacing: -0.5px;} .clo3_table table th{font-size: 14px; font-weight: 500; font-family: 'Montserrat', sans-serif; background: #656e77; color:#fff; border: 1px solid rgba(255,255,255,0.2);} .clo3_table table td{font-size: 14px; font-weight: 400; font-family: 'Montserrat','Noto Sans KR', sans-serif; background: #fff; color:#333; border: 1px solid #ddd; height: 40px;} .clo3_box:nth-child(2) .clo3_table table th {background: #fff; color:#3b658c;border:none;} .clo3_box:nth-child(2) .clo3_table table td {background: #c0bfbe; color:#333;border:none; border-top: 1px solid rgba(255,255,255,0.2)} .clo3_box:nth-child(3) .clo3_table table th {background: #fff; color:#3b658c;border: 1px solid #ddd} .clo3_box:nth-child(3) .clo3_table table td {background: #acb7c7; color:#333; border: 1px solid rgba(255,255,255,0.2)} .clo3_box_p {text-align: left; display:flex; align-items:flex-start; word-break: keep-all; margin-top:20px;} .clo3_box_p span {color:#666 !important; display:inline-block; margin-right:6px; } .clo4_article {width: 100%; margin-top: 40px; display: flex; flex-direction: column;} .clo4_box {width : 100%; margin-bottom:30px;} .clo4_box:last-child {margin-bottom:0;} .clo4_img_box {width: 100%; border: 1px solid #ddd; } .clo4_img_box img {width: 100%; height:auto;} .clo4_img_box:nth-child(even) {border: 1px solid #0077d3} .clo4_txt {margin-top: 20px; padding-left:10px;} .clo4_txt h1 {font-family: 'NanumSquare', sans-serif; font-size: 18px; font-weight: 700; color: #333; margin-bottom: 15px;} .clo4_txt h1 span {color:#0077d3; font-weight: 900; font-size: 26px; padding-right: 10px; } .clo4_tt_box {width: 100%; margin-top: 20px;} .clo4_tt_box ul li {font-size: 14px; color:#666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all; margin-bottom: 5px; background: url('../images/sub/s_blet.png') no-repeat 0% 7px; padding-left: 15px;} .clo4_txt .clo2_txt_line { width: 40px; height: 1px; background: #666;} /*surface*/ /* about */ .ab1_txt2 {width: 100%; border-top: 1px solid #000; margin-top: 45px;} .ab1_txt2 .box {padding: 30px 0; border-bottom: 1px solid #ddd;} .ab1_txt2 .box h1 {font-size: 20px; font-weight: 500; color:#000; margin-bottom: 15px;} .ab1_txt2 .box p {padding-left: 28px; font-size: 14px; font-weight: 300; word-break: keep-all; line-height: 26px;} .ab1_txt2 .box h1 i {color: #197cfa} .ab1_txt2 .box h1 span {color:#197cfa; font-size: 24px; font-weight: 700;} .about2_img {position: absolute; left:0; top:0; width:100%; height:400px; background: url('../images/sub/about2_bg.jpg') no-repeat center center; z-index:-1; background-size:cover; background-attachment: fixed; text-align:center; padding-top:70px;} .about2_img h1 {color:#fff;} .about2_article { background: #f7f7f7; margin-top:220px; padding:40px 70px 60px 70px;} .about2_article ul li {width:100%; display: flex; padding:18px 0; border-bottom:1px dashed #ddd; align-items: center;} .about2_article ul li:last-child {border-bottom:none;} .about2_article ul li h2 {font-family: 'Montserrat', sans-serif; font-size:400; color:#333; font-size:22px; width:300px;} .about2_article ul li h2 b {display: inline-block; width:50px; height:45px; border:1px solid #e5e5e5; border-top-left-radius: 15px; border-bottom-right-radius: 15px; background: #fff; color:#197cfa; text-align:center; line-height: 45px; font-size:26px; text-transform: uppercase; font-weight: 800; margin-right:10px;} .about2_article ul li > div {margin-right:50px;} .about1_article {display: inline-block; position: relative; z-index: 1; width:100%;} .about_title_bg {width:100%; text-align:center; margin-bottom:50px; background:#fff; } .about1_txt { background: url('../images/sub/about1_txt_bg.jpg') no-repeat ; text-align:center;} /* about4_article */ /* .about4_article {width:100%; display:flex; flex-wrap:wrap; justify-content: space-between; margin-top:40px;} .about4_article > div {border:1px solid #ddd; background: #fff; width:300px; height:230px; display: flex; justify-content: center; flex-wrap:wrap; align-content:center; flex-direction: column; text-align:center; margin-bottom:26px; transition: border 0.3s ease;} .about4_article > div:hover img {transform: rotateY(180deg);transition: transform 500ms;} .about4_article > div img {transition: transform 500ms;} .about4_article > div:hover {border:1px solid #197cfa;} .about4_article > div a:hover {text-decoration: none;} .about4_article > div h3 {font-size:18px; font-weight: 600; color:#333; font-family: 'NanumSquare'; margin-top:25px;} .about4_article > div span {display: block; width:30px; height:1px; background: #000; margin:15px auto 15px;} .about4_article > div p {font-size:15px; line-height: 22px;} .about4_article > div.about_logo {width:625px; border-top:2px solid #197cfa;} .about4_article > div.list {width:625px; height:auto; display: block; text-align:left; padding:40px 30px; } .about4_article > div.list h3 {margin-top:0;} .about4_article > div.list h3 img {margin-right:10px;} .about4_article > div.list ul {margin-top:20px; padding-left:50px;} .about4_article > div.list ul li {font-size: 14px;color: #666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all; margin-bottom: 8px; background: url(../images/sub/s_blet.png) no-repeat 0% 7px; padding-left: 20px;} .about4_article > div.about_logo img {transition: none;} .about4_article > div.about_logo:hover img {transform: none; transition: none;} */ .about4_article {width: 100%;margin-top: 50px; display: flex; flex-direction: row; justify-content: space-between;} .about4_box {width: 600px; } .about4_txt {width: 640px;} .about4_img {width: 640px;overflow: hidden;} .about4_img img {transform: scale(1); transition: all 0.6s;} .about4_box .list {width:625px; height:auto; display: block; text-align:left; padding:40px 30px; } .about4_box .list h3 {font-size: 30px; font-weight: 500; color:#000; margin: 18px 0 30px 0; font-family: 'NanumSquare', sans-serif;} .about4_box .list h3 img {margin-right:10px;} .about4_box .list ul {margin-top:20px; } .about4_box .list ul li {font-size: 14px;color: #666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all;margin-bottom: 8px; background: url(../images/sub/s_blet.png) no-repeat 0% 7px; padding-left: 20px;} .about4_box:hover .about4_img img {transform: scale(1.1);} /* about5_article */ .about5_article {width:100%; background: url('../images/common/c3_bg.jpg') no-repeat ; } .about5_article .sub_con {padding:50px 0;} .about5_article table td {text-align:center;} .about5_article table span {font-size:22px; margin-right:3px; margin-bottom:3px;} /* about3_article */ .about3_article {position: relative; margin:70px 0 0 0;} .about3_head {position:absolute; right:35px; text-align:right; top:60px;} .about3_head h2 {font-size:38px; font-weight: 400; font-family: 'NanumSquare'; line-height: 65px; color:#333;} .about3_head h2 b {font-size:4 6px; font-weight: 600; color:#0078d6;} .about3_txt {position: absolute; right:35px; bottom:50px; padding:30px 40px; background: #f7f7f7; border:1px solid #ddd; padding-top:50px;} .about3_txt > img {position: absolute; top:10px; left:-231px;} .about3_txt > h3 {position: absolute; position: absolute; top: -25px; left: 30px; min-width: 280px; height: 50px; background: #333; line-height: 50px; border-radius: 0 30px 30px 30px; text-align: center; font-size: 20px; font-family: 'NanumSquare', sans-serif; color:#fff;} .about3_txt ul li {font-size: 16px;color: #666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all; width:400px; margin-bottom: 15px; background: url('../images/sub/s_blet.png') no-repeat 0% 10px; padding-left: 20px;} .about3_txt ul li:last-child {margin-bottom:0;} /* his_article1 */ .his_article1 {width:100%; padding:140px 0;position: relative; text-align:center; margin:50px 0;} .his1_head {font-size:22px; font-weight: 400; color:#fff; margin:55px auto 0; width:720px; height:60px; line-height: 60px; text-align:center; background:#666;} .his_article1 h2 {font-family: 'NanumSquare'; font-weight: 400; color:#333; font-size:18px;line-height: 22px; margin-top:10px;} .his1_bg {width:333px; height:333px; background: url('../images/sub/his1_bg.png') no-repeat ; margin:0 auto; display: flex; flex-wrap:wrap; flex-direction: column; justify-content: center;} .his1_txtbox {position: absolute; width:375px; height:240px; background: url('../images/sub/his1_txtbg1.jpg') no-repeat ; padding:0 20px;} .his1_cir{position: absolute; background: url('../images/sub/his1_cir1.png') no-repeat ; width:194px; height:193px; display: flex; flex-wrap:wrap; flex-direction: column; justify-content: center; } .his1_txtbox h3 {line-height: 45px; border-radius: 0 30px 30px 30px; height: 45px; position: absolute; top: -25px; left: 10px; color:#fff; font-size: 20px; font-family: 'NanumSquare', sans-serif; font-weight: 600; background: #0077d3; min-width:70px;} .his1_txtbox h4 {padding:10px 15px; color:#333; font-weight: 500; font-size:14px; line-height: 24px; letter-spacing: -.5px; background: #fff; margin-top:35px;} .his1_txtbox ul { margin-top:20px;} .his1_txtbox ul li {font-size: 14px;color: #666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all; margin-bottom: 8px; background: url(../images/sub/s_blet.png) no-repeat 0% 7px; text-align:left; padding-left:20px;} /* box 위치 좌표 */ .his1_txtbox.color1 {top:0; left:0;} .his1_txtbox.color1 .his1_cir {top:35px; right:-185px;} .his1_txtbox.color2 {top:0; right:0;} .his1_txtbox.color2 .his1_cir {top:35px; left:-185px; background: url('../images/sub/his1_cir2.png') no-repeat ;} .his1_txtbox.color2 h3 {background: #009aca;} .his1_txtbox.color3 {bottom:0; left:0;} .his1_txtbox.color3 .his1_cir {top:55px; right:-185px; background: url('../images/sub/his1_cir3.png') no-repeat ;} .his1_txtbox.color3 h3 {background: #9068d7;} .his1_txtbox.color4 {bottom:0; right:0;} .his1_txtbox.color4 .his1_cir {top:55px; left:-185px; background: url('../images/sub/his1_cir4.png') no-repeat ;} .his1_txtbox.color4 h3 {background: #3bcacc;} .his1_txtbox.color3, .his1_txtbox.color4 {height:290px;} .his1_txtbox.color3, .his1_txtbox.color2 {background: url('../images/sub/his1_txtbg2.jpg') no-repeat ;} /*his2*/ .his2_article {margin-top: 50px; display: flex; flex-direction: row; justify-content: space-between;} .his2_box_wrap {width: 600px;} .his2_box {width: 100%; display: flex; flex-direction: row; justify-content: space-between; margin-bottom: 30px;} .his2_title {width: 230px; height: 150px;padding-top: 25px;} .his2_title h1 {color:#fff; font-size: 18px; text-align: center;} .his2_icon {text-align: center; margin-bottom: 15px;} .his2_icon img {vertical-align:middle; transition:transform 500ms} .his2_box_wrap .his2_box:nth-child(1) {background: #0077d3;} .his2_box_wrap .his2_box:nth-child(2) {background: #009aca;} .his2_box_wrap .his2_box:nth-child(3) {background: #9068d7;} .his2_box_wrap .his2_box:nth-child(4) {background: #3bcacc;} .his2_txt {background: #fff; width: 370px; padding: 25px 30px 0 30px;} .his2_txt ul {display: flex; flex-direction: row; flex-wrap: wrap;} .his2_txt ul li {width: 50%;font-size: 14px;color: #666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all; margin-bottom: 8px; background: url('../images/sub/s_blet.png') no-repeat 0% 7px; text-align:left; padding-left:20px;} .his2_box:hover .his2_icon img {transform:rotateY(180deg); transition:transform 500ms} .his_img_box {float: left; width: 50%; height: 250px; text-align: right; padding-right: 90px; margin-top: 20px;} .his_img_box img {width: 400px; height: 200px;} /* 0514 추가 */ .secu1_icon_img {width: 100%;} .secu1_icon_img img {width:60px;} .sub_p_line {margin: 25px 0 10px 0;} /* .secu1_icon2:nth-child(odd) {background:#f4f8f9;} */ .site_link_menu {width: 100%;} .site_link_menu ul {display: flex; flex-direction: row;} .site_link_menu ul li {width: 33.33%; border-right: 1px solid rgba(255,255,255,0.05);} .site_link_menu ul li a {font-size: 12px; background: #222; display: block; text-decoration: none; height: 54px; padding-top: 10px; text-align: center; letter-spacing: -0.5px; font-weight: 300} /* adobe */ .adobe_article1 p {margin:35px 0 60px 0;} .adobe_article1 img {max-width:100%;} .adobe_article2 ul {display: flex; text-align: center; margin-top:50px; flex-direction: column; align-items: center;} .adobe_article2 ul li {background: #fff; position: relative; width:100%; border-right:5px solid #eee; border-bottom:5px solid #eee; max-width:400px; margin-bottom:50px; padding:65px 20px 40px 20px;} .adobe_article2 ul li:last-child {margin-bottom:0;} .adobe_article2 ul li h2 {position: absolute; width:65px; height:45px; background: #3bcacc; color:#fff; font-family: 'Montserrat'; left:0; top:-23px; font-weight: 700; font-size:22px; line-height: 45px;} .adobe_article2 ul li > div{height:114px; line-height: 114px;} .adobe_article2 ul li > span {display: block; width:60px; height:1px; background: #3bcacc; margin:45px auto 30px;} .adobe_article2 ul li p {font-size:15px; font-weight: 300; color:#666; line-height: 24px; letter-spacing: -.5px; word-break: keep-all;} .adobe_article2 ul li h3 {font-size:20px; font-weight: 400; color:#3bcacc; margin-bottom:10px; font-family: "NanumSquare";} .adobe_article2 ul li:nth-child(2) h2, .adobe_article2 ul li:nth-child(2) > span {background: #009aca;} .adobe_article2 ul li:nth-child(2) h3 {color:#009aca;} .adobe_article2 ul li:nth-child(3) h2, .adobe_article2 ul li:nth-child(3) > span {background: #0077d3;} .adobe_article2 ul li:nth-child(3) h3 {color:#0077d3;} .adobe_article2 ul li img { vertical-align: middle; transition: transform 500ms;} /* .adobe_article2 ul li:hover img {transform:rotateY(180deg); transition:transform 500ms;} */ .adobe_article3 ul {display: flex; text-align: center; margin-top:60px; text-align: center; flex-direction: column; align-items: center;} .adobe_article3 ul li {background: #fff; position: relative; width:100%; border:1px solid #eee; padding:30px 25px 25px 25px; margin-bottom:60px; max-width:450px;} .adobe_article3 ul li:last-child {margin-bottom:0;} .adobe_article3 ul li h2 {padding:15px 0; background:#00a4e4; color:#fff; font-size:24px; font-family: 'Montserrat'; position: absolute; top:-28px; width:80%; transition: background .3s ease; left:50%; transform:translateX(-50%); border-radius: 0 30px 30px 30px;} .ado_a3_img {height:152px; line-height: 152px; margin:20px 0;} .ado_a3_txt {width:100%; padding:25px; background: url('../images/sub/a3_pat.png') repeat #fbfbfb; } .ado_a3_txt h3 {font-size:20px; font-weight: 400; color:#00a4e4; margin-bottom:12px;font-family: 'Montserrat'; transition: color .3s ease;} .ado_a3_txt p {font-size:15px; font-weight: 300; color:#666; line-height: 24px; letter-spacing: -.5px; word-break: keep-all;} .adobe_article3 ul li:nth-child(2) h2 {background: #c1d82f;} .adobe_article3 ul li:nth-child(2) h3 {color:#c1d82f;} .adobe_article3 ul li:nth-child(3) h2 {background: #8348b5;} .adobe_article3 ul li:nth-child(3) h3 {color:#8348b5;} /* .adobe_article3 ul li:hover h2 {background: #333;} .adobe_article3 ul li:hover h3 {color: #333;} */ .adobe_article4 { text-align: center;} .ado_a4_img { margin:40px 0; width:100%;} .ado_a4_img img { border:1px solid #eee; transition: border .3s ease; max-width:100%} .ado_a4_img:hover img {border: 1px solid #0077d3;} .ado_a4_con {background: #fff; padding:0; max-width:450px; display: inline-block; width:100%;} .ado_a4_con ul {display: flex; flex-direction: column; align-items: center;} .ado_a4_con ul li {width:100%; display: flex; flex-direction: column; background: #fff; align-items: center; padding:35px 20px; max-width:450px;} .ado_a4_con ul li > div {width:180px; height:180px; border-radius: 50%; background: #fbfbfb; line-height: 180px; border:4px solid #eee;} .ado_a4_con ul li > span {display: block; width:60px; height:1px; background: #000; margin:45px auto 30px;} .ado_a4_con ul li p {font-size:15px; font-weight: 300; color:#666; line-height: 24px; letter-spacing: -.5px;} .ado_a4_con > div { width: 100%; background: #333; border-radius: 0; padding: 20px 0; margin-top: 0; font-size: 20px; font-weight: 500; color: #fff; font-family: 'Montserrat', sans-serif;} .ado_a4_con ul li:nth-child(even) {background: #fbfbfb;} .ado_a4_con ul li:nth-child(even) > div {background: #fff;} /* .ado_a4_con ul li > div img {vertical-align: middle; transition: transform 500ms;} */ /* .ado_a4_con ul li:hover > div img {transform:rotateY(180deg); transition:transform 500ms;} */ .sub_title_box4 h1 {font-size: 28px; font-weight: 500; text-align: left; font-family: 'Montserrat', 'NanumSquare', sans-serif; padding-bottom: 40px; border-bottom: 1px solid #ddd;} .sub_title_box4 h1::before {content: ""; width: 40px; height: 2px; background: #0077d3; margin: 0 0 15px 0; display: block;} .sub_top_btn2 {margin: 30px 15px 50px 15px;} .sub_top_btn2 ul {display: flex; flex-direction: row; justify-content: center;} .sub_top_btn2 ul li {width: 300px; line-height: 50px; margin-left: -1px;} .sub_top_btn2 ul li a {padding: 0; display: block; border: 1px solid #ddd; width: 100%; height: 50px; text-align: center; color:#666; transition: all 0.3s; font-size: 12px;} .sub_top_btn2 ul li a:hover {background: #f7f7f7;} .sub_top_btn2 ul li.active a {background: #f7f7f7;} /*tm*/ .tm_s_title {font-size: 24px; font-weight: 600; font-family: 'Montserrat', sans-serif; color:#197cfa; margin-bottom: 15px;} .tm_c2_article {width: 100%; background: #fff; margin-top: 30px; } .s_child_title {font-size: 18px; width: 100%; text-align: center; height: 40px; line-height: 40px; background: #197cfa; color:#fff;} .tm_c2_txt {width:100%; padding: 30px 20px;border-bottom: 1px solid #ddd;} .tm_c2_txt:last-child {border-bottom: 0;} .tm_c2_txt h1 {font-size: 17px; font-weight: 700; font-family: "NanumSquare"; margin-bottom: 15px; line-height: 30px;} .list_ul li {font-size: 14px; color:#666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all; margin-bottom: 5px; background: url('../images/sub/s_blet.png') no-repeat 0% 7px; padding-left: 15px;} #tm_c3 .tm_c2_article {border: 1px solid #ddd; border-top: 3px solid #197cfa;} /* #tm_c3 .s_child_title {position: absolute; top: -3px; left: -1px;} */ .tm_img {width: 100%; border: 1px solid #ddd; padding: 15px; text-align: center; margin-top: 30px;} .tm_img img {width: 100%;} /*pa*/ .pa_c1_article {width: 100%; border: 1px solid #ddd;padding: 20px; text-align: center; margin-top: 30px;} .pa_c1_article h1 {font-size: 17px; font-weight: 700; font-family: "Montserrat"; margin-bottom: 20px; color:#333; word-break: keep-all;} .pa_c1_article img {max-width: 100%;} #cho_article {width: 100%; height: 100vh; padding-top:65px;} .cho_box {width: 100%; transition: all 0.3s; height: 50%;} .cho_box:nth-child(1) {background: url('../images/common/cho_bg1.jpg')no-repeat 50% 50%; background-size: cover;} .cho_box:nth-child(2) {background: url('../images/common/cho_bg2.jpg')no-repeat 50% 50%; background-size: cover;} .cho_box .inner {width: 100%; height: 100%; background: rgba(0,0,0,0.5); padding: 0 15px; transition: all 0.10s; } .cho_box .inner a {width: 100%; height: 100%; text-decoration: none; text-align: center; display: flex; flex-direction: column; justify-content: center;} .cho_box .inner a h1 {font-size: 30px; color:#fff; line-height: 45px; margin-bottom: 20px; font-family: "NanumSquare"; font-weight: 700; word-break: keep-all;} .cho_box .inner a p {font-size: 14px; color: rgba(255,255,255,0.8); line-height: 30px; font-weight: 300; letter-spacing: -0.3px; word-break: keep-all;} .cho_btn {width: 280px; height: 60px; line-height: 60px; color:#fff; border: 1px solid #fff; font-size: 16px; font-weight: 300; text-align: center; margin: 0 auto; border-radius: 3px; transition: all 0.3s;} .cho_btn span {width: 24px; height: 10px; background: url('../images/common/c_arrow_w.png')no-repeat; display: inline-block; margin-left: 10px; position: relative; top: -2px; transition: all 0.3s;} /* .cho_box:hover {} .cho_box .inner:hover {background: linear-gradient(-17deg, rgba(78,60,201,0.8) 0%, rgba(0,119,211,0.8) 100%); } .cho_box .inner:hover .cho_btn {background: #1e2476; border: 1px solid #1e2476;} .cho_box .inner:hover .cho_btn span {margin-left: 15px;} */ .modal-backdrop {z-index: 2} #ms4 {padding: 0 15px;} #ms4 ul li {text-align: center;} #ms4 ul li img {max-width: 100%} /* 210414 추가 */ .ann {font-weight: 500; border-bottom: 1px solid #197cfa; white-space: nowrap; } .secu_g_box .img_box {margin:30px 0 0;} .secu_g_box p span {color: #197cfa; font-weight: 400; } .secu_g_box h2 { font-size: 16px; color: #333; font-weight: 500; word-break: keep-all; line-height: 26px; position: relative; padding-left:20px; } .secu_g_box h2::before {content: ''; display: block; width: 8px; height: 8px; background: #197cfa; transform: rotate(45deg); position: absolute; left:0; top:10px; } .secu_g_box .img_box ul {display: flex; align-items: center; justify-content: space-between; margin:20px 0 0; flex-wrap:wrap; } .secu_g_box .img_box ul li {width: 100%;margin-bottom: 15px; text-align: center; } .secu_g_box .img_box ul li:last-child {margin-bottom: 0; } .secu_g_box .img_box ul li img {max-width: 100%; } .secu_g_box .img_box .img {margin:20px 0 0; text-align: center; padding:15px; background: #fff; border:1px solid #eee; } .secu_g_box .img_box .img a {display: inline-block;} .secu_g_box .img_box .img img {max-width: 100%; } .secu_g_box .img_box span { color: #e88521; display: block; font-size: 14px; font-weight: 300; line-height: 25px; margin-top: 15px; word-break: keep-all;} /* major */ #major_sec1 {padding-top:0; } #major .maj_logo {text-align: center; margin-bottom: 20px; } #major .maj_logo img {max-width:80%;} #major .img {width: 100%; padding:15px; border:1px solid #ddd; margin-top:30px ; text-align: center; } #major .img img {max-width: 100%; } #major .apos_head {text-align: center; position: relative; padding:10px 25px 0; } #major .apos_head h1 { font-size: 15px; font-weight:400; color: #000; line-height:30px; word-break: keep-all; letter-spacing: -.5px;} #major .apos_head > img {position: absolute; top:-0; width: 20px;} #major .apos_head > img.apos1 {left:0;} #major .apos_head > img.apos2 {right:0;} #major .flex_box {display: flex; flex-direction: column; padding:30px 15px; border-bottom: 1px solid #ddd; background-color: #fff; } #major .flex_box.fir {border-top: 1px solid #000; margin-top:40px ;} #major .flex_box h1 {white-space: nowrap; font-size: 22px; font-weight:400; color: #000; font-family:'NanumSquare', sans-serif; ;} #major .flex_box h1::before {content: ''; display: block; width: 40px; height: 2px;background: #0077d3; margin: 0 0 20px ;} #major .maj_list, #major .maj_check_list {padding-top: 20px; } #major .maj_list li {font-size:14px; font-weight: 300; color:#666; letter-spacing: -.5px;padding-left:20px ; margin-bottom: 12px; position: relative; word-break: keep-all;} #major .maj_list li:last-child {margin-bottom: 0; } #major .maj_list li::before {content: ''; display: block; width: 6px; height: 6px; background-color: #0077d3; position: absolute; left:0; top:7px ; transform: rotate(45deg);} #major .maj_check_list li {font-size:14px; font-weight: 300; color:#666; letter-spacing: -.5px; margin-bottom: 12px; display: flex; align-items: flex-start; word-break: keep-all;} #major .maj_check_list li:last-child {margin-bottom: 0;} #major .maj_check_list li i {font-size:15px; margin-right: 15px; color:#000; position: relative; top:2px; } /* 모달 유투브 */ #modal_yt .modal-title {font-size: 14px; font-weight: 600; color: #000; font-family: 'Montserrat', 'NanumSquare', sans-serif; word-break: keep-all; width: 100%; line-height: 22px;} #modal_yt .modal-dialog { vertical-align: middle; top: 50%; margin-top: -50%;} #modal_yt .modal-content {width: 100%; } #modal_yt .modal_script_box {padding:15px; } #modal_yt .modal_script_box > div { position: relative;height: 0; padding-bottom: 56.25%;width: 100%; } #modal_yt .modal_script_box iframe { position: absolute; width: 100%; height: 100%; left: 50%; transform: translateX(-50%);} /*공통*/ .sub_top_btn {width: 100%; font-size: 0; text-align: center; margin-bottom: 30px; display: flex; flex-direction: column; align-items: center; padding: 0 15px;} .sub_top_btn ul {width: 100%; max-width: 600px; margin: 0 auto;} .sub_top_btn ul li {width: 100%; margin-bottom:10px;} .sub_top_btn ul li:last-child {margin-bottom: 0;} .sub_top_btn ul li a {background: #f7f7f7; width: 100%; display: block; text-decoration: none; border-radius: 3px; font-size: 15px; font-weight: 400; color:#333; transition: all 0.3s; letter-spacing: -0.5px; line-height: 25px; padding:10px 15px !important;} .sub_top_btn ul li a.active {background: #197cfa; color:#fff;} .sub_top_btn ul li a:hover {background: #197cfa; color:#fff;} .sub_top_btn ul li.active a {background: #197cfa; color:#fff;} .sub_top_btn .nav>li>a {padding: 0} .sub_top_btn.long ul li {width:300px; margin-right: auto; margin-left: auto;} .sub_title_box {width: 100%; text-align: center;} .sub_title_box h1 {font-size: 26px; font-weight: 400; color:#000; font-family: 'Montserrat', 'NanumSquare', sans-serif; margin-top: 10px; font-weight: 500; line-height: 38px; word-break: keep-all;} .sub_p {font-size :15px ;font-weight: 300; color:#666; letter-spacing: -1px; line-height: 28px; word-break: keep-all;} .sub_p span {font-weight: 400; color:#197cfa;} .sub_p_line {width: 35px; height: 1px; background: #000; display: inline-block; margin: 30px 0 10px 0;} .sub_p_box {font-size :15px ;font-weight: 400; color:#333; letter-spacing: -1px; line-height: 34px; word-break: keep-all; padding: 20px; background: #f7f7f7; } .sub_title_box2 { text-align: left; border-bottom: 1px solid #ddd; padding-bottom: 15px; position: relative; margin-bottom: 20px;} .sub_title_box2 h1 {font-size: 22px; font-weight: 400; color:#000; font-family: 'Montserrat', 'NanumSquare', sans-serif; display: flex; align-items: flex-start;} .sub_title_box2 h1 img {margin-right: 10px; width: 21px; flex-shrink: 0;} .sub_title_line {width: 35%; height: 1px; background: #0077d3; position: absolute; bottom: -1px;} .sub_h2 {width: 100%; font-size: 22px; color:#333; font-weight: 500; text-align: left; display: flex; align-items: flex-start; line-height: 28px;} .sub_h2 span {color:#0077d3; position: relative; top: 2px; display: inline-block; margin-right:8px;} .sub_h3{font-size: 20px; color:#000; font-weight: 500; padding-bottom: 20px; border-bottom: 1px solid #ddd; line-height: 28px;} .sub_con_wrap {width: 100%; } .sub_con {width: 100%; margin: 0 auto; padding: 40px 15px;} .sub_con_gray { background: #f7f7f7;} .sub_con_blue { background: #e3eff6;} .res_img {width:100%; height:auto;} /* about */ /*his3*/ .about2_title {width:100%; padding: 40px 0 80px 0; background: url('../images/sub/his3_bg.jpg')50% 50% no-repeat; text-align: center; } .about2_title h1 {} .a4_article_wrap {width: 100%;display: flex;flex-direction: column; } .about_article h1 {font-size: 24px; font-weight: 500; letter-spacing: -0.5px; color:#333;} .about4 {background: #fff; padding-top: 20px; margin: -40px auto 40px auto; width: 92%; min-height: 113px; text-align: center;} .about4_btn ul li {display: block; width: 100%; height: 57px; margin-right: 20px;} .about4_btn ul li a {background: #fff; color:#333; border: 1px solid #ddd; display: block; text-align: center; line-height: 57px; text-decoration: none; font-size: 18px; transition: all 0.3s} .about4_btn ul li a:hover {background: #197cfa; color:#fff; border: 1px solid #197cfa;} .about_article {position: relative; width: 100%; margin-top: 30px;} .about_article::before { content: ""; display: block; position: absolute; width: 1px; height: 94.5%; background: #ddd; top: 20px; left: 20px; } .about_article > ul > li {width: 100%; margin-bottom:30px;} .his_r_box { width: calc(100% - 20px); text-align: left; padding-left: 50px; position: relative; left:20px; padding-right: 15px; padding-top:8px;} .his_bar {position: absolute;top: 10px; left: -5px;} .his_bar2 {position: absolute;top: 10px; right: -5px;} .his_txt {margin-top: 20px;} .his_txt ul li {margin-bottom: 5px; background: url(../images/sub/s_blet.png) no-repeat 0% 7px; padding-left:20px; font-size:15px; letter-spacing: -.5px; word-break: keep-all;} .his_txt ul li:last-child {margin-bottom: 0;} .his_txt div {display: inline-block;margin-right: 15px; font-size: 18px; font-weight: 700; color:#197cfa; vertical-align: top} .his_txt p {display: inline-block; font-size: 16px; font-weight: 400; color:#333; line-height: 26px; vertical-align: top} /* ci */ .about_6_h {font-size:24px; font-weight: 300; font-family: 'NanumSquare', sans-serif; margin-top: 10px; margin-bottom: 30px;} .about_6_h span {} .about6_article { width: 100%; background: #fff; margin: 0 auto 50px auto; border-bottom: 10px solid #f7f7f7; padding-bottom: 50px;} .about6_article:last-child {border-bottom: 0;} .about6_article ul {display: flex; flex-direction: column; margin-top:40px; justify-content: center;} .about6_article ul li {width:100%; text-align:center; margin-bottom:40px;} .about6_article ul li:last-child {margin-bottom:0;} .about6_article ul li > div {width:200px; height:200px; background: #fff; border:8px solid #efefef; text-align:center; line-height: 180px; border-radius: 100%; display: inline-block; transition: all 0.3s;} .about6_article ul li:nth-child(2) > div {border:8px solid #0078d7;} .about6_article ul li img {width:80px;} .about6_article ul li > span {display: block; width:45px; height:1px; background: #000; margin:20px auto 15px;} .ci_symbol {width:100%; display: flex; flex-direction: column; background: #fff; margin-top:30px;} .ci_img {padding-left:0;} .ci_symbol_txt { text-align:left; width: 100%; } .ci_symbol_txt h3{font-size:24px; font-family: 'Montserrat', sans-serif; font-weight: 700; color:#0e75bc;} .ci_symbol_txt h3.gray {color:#6c6e71;} .ci_symbol_txt p {margin-top:5px;} .ci_symbol_txt {text-align: left; padding-top: 20px; } .ci_symbol_img {border: 1px solid #ddd; width: 100%;} .ci_symbol_img img {width:100%; height:auto;} .secu_table {width: 100%; margin: 0 auto;} .secu_table table {width: 100%;} .secu_table table thead th {background: #0077d3; color:#fff; font-weight: 400; font-size: 16px;text-align: center; } .secu_table table th, .secu_table table td {padding: 12px 3%;} .secu_table table tbody th {background: #484848; color:#fff; font-weight: 400; font-size: 15px; line-height: 30px; border-bottom: 1px solid rgba(255,255,255,0.2); text-align: center; word-break: keep-all;} .secu_table table tbody td {background: #fff; color:#666; font-weight: 300; font-size: 15px; line-height: 26px; border-bottom: 1px solid #ddd; word-break: keep-all; padding: 12px 3%; text-align:left; border-top: 1px solid #ddd;} .about .secu_table th {background: #0077d3;} .about4_wrap .nsub_title { margin:0; } /* about6 추가 */ .about6_wrap { position:relative; } .about6_wrap::before { content:""; position:absolute; left:50%; transform: translateX(-50%); top:-10px; width:calc(100% - 30px); height: 1px; background:#ddd; } .about6_wrap br { display: none; } .about6_wrap .ab6_list { margin: 30px 0; } .about6_wrap .ab6_list li { text-align: center; padding:0 0 50px; } .about6_wrap .ab6_list li:last-child { border-bottom: 0; padding:0; } .about6_wrap .ab6_list .new { background:url('../images/sub/ab6_new.png') no-repeat right top; } .about6_wrap .ab6_list .new2 { background:url('../images/sub/ab6_new2.png') no-repeat right top; } .about6_wrap .ab6_list .gold::after { content:""; position:absolute; right:15px; bottom:15px; width:35px; height:39px; background:url('../images/sub/ab6_gold.png') no-repeat center; } .about6_wrap .ab6_list .ico_area { display: flex; align-items: center; margin:0 0 15px; } .about6_wrap .ab6_list .ico_area .icon { display: block; width:80px; height: 80px; background:#f9f9fa; border-radius: 50%; margin:0 15px 0 0; text-align: center; line-height: 75px; } .about6_wrap .ab6_list .ico_area .icon img { width:45px; } .about6_wrap .ab6_list .ico_area h2 { margin:20px 0; font-size: 18px; letter-spacing: -0.2px; color: #000; font-weight: bold; } .about6_wrap .ab6_list .box_area .box { position:relative; width:100%; padding:20px; border:1px solid #ddd; border-radius: 6px; display: flex; text-align: left; align-items: center; } .about6_wrap .ab6_list .box_area .box ~ .box { margin-top: 15px; } .about6_wrap .ab6_list .box_area .box .logo { position:relative; width:auto; height: auto; line-height: 1; padding-right: 15px; } .about6_wrap .ab6_list .box_area .box .logo::before { content:""; position:absolute; right:0; top:5px; width:1px; height: 60px; background:#b3b3b3; } .about6_wrap .ab6_list .box_area .box .txt { position:relative; padding-left: 15px; font-size: 14px; letter-spacing: -0.15px; color: #000; line-height: 1.25; } .about6_wrap .ab6_list .box_area .box .txt span { display: block; margin-bottom: 6px; color:#197cfa; } /* about 끝 */ /*job 시작 */ .job {overflow: hidden;} .j_title {text-align: center; width: 100%; text-align: center; margin: 0 auto; line-height: 45px; font-size: 26px; font-family: 'NanumSquare', sans-serif; font-weight: 700; padding: 0 15px; word-break: keep-all;} .j_title span {color:#197cfa} .job .top {width: 100%; background: url('../images/sub/job_bg.jpg')no-repeat 50% 50%; background-size: cover; padding-top: 50px; margin-top: 35px; padding: 50px 15px 0; text-align: center; position: relative;} .job .top::after {width: 100%; height: 130px; background: #fff; position: absolute; bottom: 0; left: 0; z-index: 2; display: block; content: "";} .job .top .j_logo {} .job .top .j_logo img {max-width: 70%;} .job .top .txt {margin-top: 20px; font-size: 17px; font-weight: 400; color:#fff; line-height: 30px; letter-spacing: -0.24px; word-break: keep-all;} .job .top .txt span {font-weight: 700; color:#ffd800} .job .top .img{} .job .top .img img{max-width: 100%;} .job1_img { left:0; top:0; width:100%; padding:40px 0 80px 0; background: url('../images/sub/job1_bg.jpg')50% 50% no-repeat; z-index:-1; background-size:cover; text-align:center; height:auto; position: static; z-index: 1;} .job1_img h1 {color:#fff;} .job1_article { background: #fff; text-align: center; width: 92%;position: absolute; margin-left:0; padding:20px 0; height:auto; z-index: 2; margin:-60px auto 0; left:50%; transform:translateX(-50%);} .job1_article h1 {font-size: 22px; font-family: 'NanumSquare', sans-serif; font-weight: 700;line-height: 36px; word-break: keep-all;} .job1_article h1 span {color:#0077d3} .job_title_line {width: 50px; height: 4px; background: #0077d3; margin-bottom: 20px;} .job_title {font-size: 20px;font-weight: 600; color:#000; font-family: 'NanumSquare', sans-serif; display: flex; align-items: flex-start; word-break: keep-all;} .job_title span {color:#0077d3; padding-right: 10px;} .job_table {margin-top: 20px; } .job_table table {width: 100%; border-top: 10px solid #eee} .job_table table th, .job_table td { padding: 12px 10px; } .job_table table th {text-align: center;font-size: 15px; color:#fff; font-weight: 500; background: #0077d3;border-bottom: 1px solid rgba(255,255,255,0.2); word-break: keep-all; width: 100px!important;} .job_table table td { width:calc(100% - 100px)!important; background: #fff;border-bottom: 1px solid #ddd; font-size: 14px;color: #666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all;} .job_table table tr:last-child th {border-bottom: 1px solid #ddd;} .job_table td ul li {font-size: 14px;color: #666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all; margin-bottom: 8px; background: url('../images/sub/s_blet.png') no-repeat 0% 7px; text-align:left; padding-left:20px;} .job_table td ul li:last-child {margin-bottom:0;} .job_table td ul li span {font-weight: 700; color:#0077d3} /*bmc*/ .cm1_txt {width: 100%; margin-top: 40px; border-top: 2px solid #f86e00;} .cm1_txt ul li {padding: 15px; border-bottom: 1px solid #ddd; font-size: 15px; font-weight: 400; color:#333; display: flex; align-items: flex-start; letter-spacing: -.5px;} .cm1_txt ul li:nth-child(2n) {background: #f7f7f7;} .cm1_txt ul li span {font-weight: 400; color:#333; word-break: keep-all;} .cm1_txt ul li span.fonti {color:#f86e00; margin-right: 15px;} .cm1_txt ul li a {padding-left: 0;} .tom1_img {width: 100%; border: 1px solid #ddd; padding: 20px;} .tom1_img img{ width: 100%;} /*Symantec*/ .cloud1_article {margin-top: 40px;} .cloud1_img {width: 100%; padding: 10px; border: 1px solid #ddd; text-align: center; margin-top: 20px; background: #fff;} .cloud1_img img {width:100%; height:auto;} .cloud1_article2 {margin-top: 40px;} .cloud1_title_box p {margin-top: 15px; font-weight: 700; color:#333; font-size: 24px; font-family: 'Montserrat', sans-serif; } .cloud1_line {width: 1px; height: 40px; background: #000; display: inline-block; margin: 15px 0 20px 0;} .cloud1_box_wrap {width : 100%; display: flex; flex-direction: column;} .cloud1_box {width: 100%; margin-bottom:30px;} .cloud1_box:last-child {margin-bottom:0;} .cloud1_box h1 {font-size: 20px; margin-bottom:15px; width: 100%; border-radius: 0 50px 50px 50px; padding: 5px 0; } .cloud1_box:nth-child(1) h1 {background: #bebebe } .cloud1_box:nth-child(2) h1 {background: #ed7d31 } .cloud1_box:nth-child(3) h1 {background: #5b9bd5;} .cloud1_box img {margin-right: 15px;} .cloud1_box div {width: 100%; background: #f7f7f7; border: 1px solid #ddd; padding: 20px 15px;} .cloud1_box h2 {font-size: 18px;font-weight: 500; word-break: keep-all; line-height: 24px; letter-spacing: -0.5px;} .cloud1_box ul {width: 100%; padding: 20px; background: #FFF; border: 1px solid #ddd; margin-top: 20px; text-align: left;} .cloud1_box ul li {font-size: 14px; color:#666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all; margin-bottom: 5px; background: url('../images/sub/s_blet.png') no-repeat 0% 7px; padding-left: 15px;} .cloud1_article3_txt ul li span {color: red;} .cloud1_article4 {width: 100%; display: flex; flex-direction: column;} .cloud1_a4_img {width: 100%; padding: 15px; text-align: center; border: 1px solid #ddd; background: #fff;} .cloud1_a4_img img {width: 100%;} .cloud1_a4_txt {width: 100%;} .cloud1_a4_txt h1{width: 150px; height: 40px; background: #0077d3; color:#fff; font-size: 18px; color:#fff; font-weight: 500; text-align: center; line-height: 40px; margin: 25px 0 15px 0;} .cloud1_a4_txt ul li {font-size: 15px; line-height: 26px; color:#666; letter-spacing: -1px; font-weight: 300; word-break: keep-all; margin-bottom: 15px; background: url('../images/sub/s_blet.png') no-repeat 0% 12px; padding-left: 15px;} .cloud1_article6 {width: 100%; margin-top: 30px;} .cloud1_a6_box1 {width: 100%; padding: 8px 10px; border: 1px solid #ddd;background: #f7f7f7; display: flex; flex-direction: column; align-items: center;} .cloud1_a6_box1 p { font-weight: 500; color: #000; margin:15px 0; font-size: 20px; line-height: 26px;} .cloud1_a6_box2_wrap {width: 100%; position: relative; padding-top: 0; text-align:center; display: block;} .cloud1_a6_box2 {width: 205px; text-align: center;} .cloud1_a6_box2 ul li {height: 150px; font-size: 16px;font-weight: 400; word-break: keep-all} .cloud1_a6_box2 ul li:nth-child(1) {background: #ddd; padding-top: 30px;} .cloud1_a6_box2 ul li:nth-child(2) {background: #f2b01e; padding: 50px 15px 0 15px;} .cloud1_a6_box2 ul li:nth-child(3) {background: #44546a; padding: 50px 15px 0 15px; color:#fff;} .cloud_arrow_img1 {position: absolute; top: 0; left: 179px; } .cloud_arrow_img2 {position: absolute; top: 0; right: 179px;} .cloud1_a6_box3 {margin-top: 10px; background: #a1b8e1; color:#000; font-size: 16px; font-weight: 400; padding: 15px; text-align: center;} .atp_txt ul li{font-size: 15px; line-height: 24px; color:#666; letter-spacing: -1px; font-weight: 300; word-break: keep-all; margin-bottom: 10px; background: url('../images/sub/s_blet.png') no-repeat 0% 8px; padding-left: 15px;} .atp_img {width: 100%; padding: 15px; background: #f4f4f4; text-align: center; border: 1px solid #ddd;} .atp_img img {width:100%; height:auto;} .net1_img {width: 100%; padding: 25px 10px; background: #fff; border: 1px solid #ddd; text-align: center;} .net1_img img {width:100%; height:auto;} .net1_box_wrap {display: flex; flex-direction: column; margin-top: 30px; } .net1_box {width: 100%; border-bottom: 1px solid #ddd; padding: 25px 10px; border-right:0;} .net1_box:last-child {border-bottom: 0; padding-bottom:0;} .net1_box h1 {font-size: 18px; font-weight: 500; color:#0077d3;} .net1_box .sub_p_line {margin:20px 0 15px 0;} .net1_box ul li {font-size: 14px; color:#666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all; margin-bottom: 5px; background: url('../images/sub/s_blet.png') no-repeat 0% 7px; padding-left: 15px;} .net2_article {display: flex; flex-direction: column; margin-top: 30px; background: #fff; border: 1px solid #ddd; padding: 20px 10px;} .net2_box {width: 100%;border-right: 0px solid #ddd; padding: 40px 0; border-bottom:1px solid #ddd; text-align:center;} .net2_box:nth-child(1) {padding-top:25px;text-align: center;} .net2_box:nth-child(1) p {font-size: 22px; margin-top: 20px; font-weight: 500; line-height: 32px;} .net2_box:last-child {border-bottom: none; width:100%;} .net2_box ul li {display: flex; flex-direction: column; margin-bottom:30px; } .net2_box ul li:last-child {margin-bottom:0;} .net2_box ul li p {line-height: 20px; margin-left: 0; font-size: 15px; font-weight: 400; letter-spacing: -0.5px; margin-top:20px;} /* Azure */ .az1_article {margin-top: 40px; display: flex; flex-direction: column; width: 100%;} .az1_box {width: 100%; padding: 25px 20px; border-right: 0px solid #ddd;} .az1_box:first-child{border-left: 1px solid #ddd;} .az1_box:nth-child(1) {border-top: 3px solid #197cfa; border-bottom:1px solid #ddd;} .az1_box:nth-child(2) {border-bottom: 0px solid #197cfa; border-right:1px solid #ddd;} .az1_box:nth-child(3) {border-top: 3px solid #197cfa; border-left:1px solid #ddd; border-bottom:1px solid #ddd;} .az1_box:nth-child(4) {border-bottom: 3px solid #197cfa; border-right:1px solid #ddd;} .az_icon {margin-bottom: 30px;} .az1_box h1 {font-family: 'NanumSquare', sans-serif; font-size: 18px; font-weight: 700; color: #0077d3; margin-bottom: 15px;} .az1_box p {font-size: 14px; color:#666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all;} .az1_txt_box {width: 100%; border: 1px solid #ddd; background: #f7f7f7; padding: 30px 25px; margin-top: 50px; text-align: left;} .az1_txt_box h1 {font-size: 18px; font-weight: 900; font-family: 'NanumSquare', sans-serif; color:#197cfa; margin-bottom: 15px;} .az1_txt_box p {font-size: 14px; color:#666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all; line-height: 26px;} .az_btn {margin-top: 20px; display: inline-block; } .az_btn a { font-size: 14px; font-weight: 400; background: #333; width: auto; height: 40px; display: block; color: #fff;line-height: 40px; text-align: center; text-decoration: none; transition: all 0.3s; border-radius: 3px; padding:0 15px; min-width:250px;} .az_btn a:hover {color: #fff; background: #0077d3} .az3_article {display: flex; flex-direction: column; width: 100%;} .az3_box {width: 100%; padding: 25px 10px;} .az3_box h1 {font-family: 'NanumSquare', sans-serif; font-size: 18px; font-weight: 700; color: #333; margin-bottom: 15px;} .az3_box p {font-size: 14px; color:#666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all;} .az3_box p span {color:#0077d3; font-weight: 500; } .az4_article {display: flex; flex-direction: row; justify-content: space-between; width: 100%; flex-wrap: wrap} .az4_box {width: 100%; border: 1px solid #ddd; margin-bottom: 15px; position: relative; padding: 20px; text-align: left; transition: all 0.3s;} .az4_box:hover {border: 1px solid #197cfa;} .az4_icon { position: absolute; top: 20px; right: 20px;} .az4_icon img {vertical-align:middle; transition:transform 500ms; } .az4_box:hover img {transform:rotateY(180deg); transition:transform 500ms} .az4_box h1 {font-size: 15px; font-weight: 700; color: #333; line-height: 26px;letter-spacing: -0.5px;} .az4_line {width: 50px; height: 2px; background: #197cfa; margin: 15px 0;} .az4_box p {font-size: 14px; color:#666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all;} .az_map {width: 100%; padding: 20px 20px; background: #243a5e;} .az5_box {width: 92%; margin: 0 auto; text-align: center; background: #fff; padding: 25px;} .az5_box h1 {font-size: 22px; font-weight: 700; font-family: 'NanumSquare', sans-serif; color:#243a5e; line-height: 34px; word-break: keep-all;} .az5_btn { margin-top: 30px;} .az5_btn ul {display: flex; flex-direction: column; justify-content: center; width:100%; text-align:center; align-items: center;} .az5_btn ul li {width: 300px; height: 50px; margin-bottom: 20px; margin-right:0; } .az5_btn ul li:last-child {margin-bottom: 0;} .az5_btn ul li a {width: 100%; height: 50px; line-height: 50px; text-align: center; color:#333; font-weight: 400;text-decoration: none; background: #ddd; border-radius: 3px; transition: all 0.3s; display: inline-block;} .az5_btn ul li a:hover {color:#fff;background: #0077d3;} .ms1_article1 {margin-top: 40px;} .ms1_logo_box ul {display: flex; flex-direction: column;} .ms1_logo_box ul li {width: 100%; height:auto; border: 1px solid #ddd; padding:25px 0; background: #fff; border-bottom:0; line-height:0;} .ms1_logo_box ul li:first-child {padding:35px 0;} .ms1_logo_box ul li:last-child {border-bottom:1px solid #ddd;} .ms1_logo_box ul li img {max-width:80%; height:auto;} .ms1_logo_txt {width: 100%; background: #efefef; border-radius: 10px; padding: 20px 0; margin-top: 30px; font-size: 20px; font-weight: 500; color:#333;font-family: 'Montserrat', sans-serif; } .ms_arrow {margin: 30px 0; text-align: center; font-size: 40px; color: #666;} .ms1_article2 {display: flex; flex-direction: column; justify-content: space-between; flex-wrap: wrap;} .ms1_box {position: relative; ; border: 1px solid #ddd; padding: 50px 20px 10px 20px; margin-bottom: 40px;} .ms1_box h1 {position: absolute; top: -25px; left: 20px; min-width: 280px; height: 50px; line-height: 50px; border-radius: 0 30px 30px 30px; text-align: center;font-size: 18px; font-family: 'NanumSquare', sans-serif;} .ms1_box1 h1 {background: #ffc300; color:#fff;} .ms1_box2 h1 {background: #3a3a3a; color:#fff;} .ms1_box3 h1 {background: #9d9d9d; color:#fff; min-width: 300px;} .ms1_box1 {width: 100%; margin-right: 0; margin-top:25px;} .ms1_box1 ul {display: flex; flex-direction: row; flex-wrap: wrap;} .ms1_box1 ul li {width: 94px; margin:0; margin-bottom: 30px;} .ms1_box1 ul li div {width: 70px; height: 70px; line-height: 70px; border-radius: 50%; background: #f7f7f7; margin: 0 auto;} .ms1_box1 ul li div img {width: 50%;} .ms1_box1 ul li p {font-size: 14px; color:#666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all; margin-top: 10px;} @media (max-width:640px) {.ms1_box1 ul li {width:16%;}} @media (max-width:580px) {.ms1_box1 ul li {width:20%;}} @media (max-width:460px) {.ms1_box1 ul li {width:25%;}} @media (max-width:380px) {.ms1_box1 ul li {width:33.3%;}} @media (max-width:320px) {.ms1_box1 ul li {width:50%;}} .ms1_box2 {width: 100%; margin-top:25px;} .ms1_box2 ul{display: flex; flex-direction: row; flex-wrap: wrap; margin: 15px 0;} .ms1_box2 ul li {width: 50%; padding: 20px 20px; word-break: keep-all;} .ms1_box2 ul li:nth-child(1) {border-right: 1px solid #ddd; border-bottom: 1px solid #ddd;} .ms1_box2 ul li:nth-child(2) {border-bottom: 1px solid #ddd;} .ms1_box2 ul li:nth-child(3) {border-right: 1px solid #ddd;} .ms1_box2 ul li:nth-child(4) {} .ms1_box3 {width: 100%; margin-top:25px;} .ms1_box3 ul{display: flex; flex-direction: row; justify-content: center; flex-wrap: wrap; padding:20px 0;} .ms1_box3 ul li {width: 50%; padding: 2px 0; word-break: keep-all;} .ms1_article2 .sub_p_line {margin: 10px;} .ms2_article {width: 100%; display: flex; flex-direction: row; justify-content: space-between; flex-wrap: wrap; margin-top: 40px;} .ms2_box1 {width: 100%; display: flex; flex-direction: column; background: #fff;border: 1px solid #ddd; text-align: center;} .ms2_icon {background: #0077d3;} .ms2_box1 .ms2_icon {width: 100%;padding: 30px 0; } .ms2_icon h1, .ms2_icon h1 {font-size: 16px; font-weight: 700; color:#fff; margin-top: 15px; } .ms2_box1_txt {width: 100%;} .ms2_box1_txt > ul {display: flex; flex-direction: row; justify-content: space-between; flex-wrap:wrap;} .ms2_box1_txt > ul > li {width: 50%; padding: 15px 15px; text-align: left; border-right: 1px solid #ddd;border-bottom:1px solid #ddd;} .ms2_box1_txt > ul > li:nth-child(even) {border-right: 0;} .ms2_box1_txt > ul > li:nth-child(n+5) {border-bottom:0;} .ms2_box1_txt > ul > li > h1 {font-size: 15px; font-weight: 700; margin-bottom: 15px; color:#0077d3;} .ms2_box1_txt > ul > li > ul > li {font-size: 13px; color:#666; letter-spacing: -0.6px; font-weight: 300; word-break: keep-all; margin-bottom: 5px; background: url('../images/sub/s_blet.png') no-repeat 0% 5px; padding-left: 10px;} .ms2_box1_txt > ul > li > ul > li:last-child {margin-bottom: 0;} .ms2_box2_wrap {display: flex; flex-wrap:wrap; justify-content: space-between; width:100%;} .ms2_box2 {margin-top: 20px; width: 48%; background: #fff;} .ms2_box2 .ms2_icon {width: 100%; text-align: center; padding: 25px 0;} .ms_box2_txt { padding: 15px 15px;} .ms_box2_txt > ul > li {font-size: 13px; color:#666; letter-spacing: -0.6px; font-weight: 300; word-break: keep-all; margin-bottom: 5px; background: url('../images/sub/s_blet.png') no-repeat 0% 7px; padding-left: 10px;} .ms_box2_txt > ul > li:last-child {margin-bottom: 0;} .ms3_article {margin-top: 40px; display: flex; flex-direction: column; justify-content: space-between; } .ms3_box {width: 100%; padding: 30px 15px; background: #fff;box-shadow: 0 5px 15px 0 rgba(0,0,0,.1); margin-bottom:30px;} .ms3_box:last-child {margin-bottom:0;} .ms3_img {width: 100%; overflow: hidden;} .ms3_img img {width: 100%; transition: all 0.3s; transform: scale(1);} .ms3_box:hover .ms3_img img { transform: scale(1.1);} .ms3_box h1 {font-size: 22px; font-weight: 500; color:#333; margin: 40px 0 15px 0; display: flex; align-items: flex-start;} .ms3_box h1 img {position: relative; top: -3px; padding-right: 15px; flex-shrink: 0;} .ms3_txt ul li {font-size: 15px; color:#666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all; margin-bottom: 5px; background: url('../images/sub/s_blet.png') no-repeat 0% 7px; padding-left: 15px; line-height: 24px;} .cloud1_txt {margin-top: 20px;} .cloud1_txt h1 {width: 150px; height: 40px; background: #0077d3; color:#fff; font-size: 18px; color:#fff; font-weight: 500; text-align: center; line-height: 40px; margin-bottom: 15px;} .cloud1_txt ul li {font-size: 14px; color:#666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all; margin-bottom: 5px; background: url('../images/sub/s_blet.png') no-repeat 0% 7px; padding-left: 15px;} .cloud1_article3_txt h1 {background: #fff; border: 1px solid #000; color:#333; width: 280px; font-size:16px;} /*surface*/ .sur1_article {width: 100%; height: auto; background: url('../images/sub/sur1_bg.jpg') no-repeat 50% 50%; background-size: cover; padding:60px 25px;} .sur1_article h1 { font-size: 32px; font-family: 'NanumSquare', sans-serif; color:#000; font-weight: 500; line-height: 42px;} .sur1_article p { font-size: 20px; font-family: 'NanumSquare', sans-serif; color:#333; font-weight: 500; margin-top: 20px; } .sur2_article {margin-top: 50px; display: flex; flex-direction: column; justify-content: space-between} .sur2_box {width: 100%; margin-bottom:30px; } .sur2_box:last-child {margin-bottom:0;} .sur2_img {overflow: hidden;} .sur2_img img {width:100%; height:auto;} .sur2_box h1 {font-family: 'NanumSquare', sans-serif; font-size: 18px; font-weight: 700; color: #333; margin-bottom: 15px;} .sur2_box p {font-size: 14px; color:#666; letter-spacing: -0.5px; font-weight: 300; word-break: keep-all; line-height: 26px; } .sur2_box p span {color:#0077d3; font-weight: 500; } .sur3_article {width: 100%; display: flex; flex-direction: column;} .sur3_box1_wrap {width: 100%; min-height: 400px; background: url('../images/sub/sur3_bg1.jpg') no-repeat 50% 50%; background-size: cover; position: relative; height:auto;} .sur3_box1_wrap2 {width: 100%; height: auto; background: url('../images/sub/sur4_bg1.jpg') no-repeat 50% 50%; background-size: cover;} .sur3_box2_wrap {width: 100%; height: auto; display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; margin-top:0; justify-content: center;} .sur3_box2_txt {width: 50%; height: auto; padding:20px 15px;} .sur3_box2_img {width: 50%; height: auto;} @media (max-width:414px) { .sur3_box2_txt {width: 100%; height: auto; border:1px solid #ddd; border-top:0;} .sur3_box2_img {width: 100%; height: auto; text-align: center;} .sur3_box2_wrap{margin-bottom:20px;} .sur3_box2_wrap.reverse {flex-direction: column-reverse ; margin-top:20px;} } .sur3_box2_img img {width:100%; height:auto;} .new_mark {background: #ffd618; color:#000; width: 50px; height: 20px; text-align: center; margin-bottom: 15px;} .sur3_article h1 {font-family: 'NanumSquare', sans-serif; font-size: 20px; font-weight: 700; color: #333; margin-bottom: 10px; line-height: 28px;} .sur3_article p {font-size: 14px; color:#666; line-height: 26px; letter-spacing: -1px; font-weight: 300; word-break: keep-all;} .sur3_box1_txt {width :100%; padding: 0 15px; position: absolute; bottom: 20px; left: 0;} .sur3_article .sub_p_line{ margin: 15px 0 10px 0;} /* 2022 추가 */ /* 공통 */ .sec_wrap .con_wrap { width:100%; margin:0 auto; padding:0 15px; } .nsub_title { text-align: center; line-height: 1; margin-bottom: 25px; } .nsub_title .nsub_ico { margin-bottom: 10px; } .nsub_title h1 { font-size:22px; word-break: keep-all; font-weight: bold; line-height: 35px; } .nsub_title h1 span { font-weight: 300; } .nsub_title p { margin-top: 20px; font-size:15px; line-height:28px; word-break: keep-all; font-weight: 300; } .nsub_title p span { color:#197cfa; font-weight: 500;} .nsub_title p br { display: none; } .list_type1 { display: flex; flex-wrap: wrap; } .list_type1 li { width:50%; } .list_type1 li:nth-child(n+3) { margin-top: 10px; } .list_type1 li .ico { display: block; height: 45px; line-height: 45px; margin-bottom:10px; text-align: center; } .list_type1 li .ico img { height: 100%; } .list_type1 li h2 { font-size: 15px; font-weight: 500; color:#fff; line-height: 40px; text-align: center; word-break: keep-all; } .list_type1 li:nth-child(1) h2 { background:url('../images/sub/prog_list1.png') no-repeat center / cover; } .list_type1 li:nth-child(2) h2 { background:url('../images/sub/prog_list2.png') no-repeat center / cover; } .list_type1 li:nth-child(3) h2 { background:url('../images/sub/prog_list3.png') no-repeat center / cover; } .list_type1 li:nth-child(4) h2 { background:url('../images/sub/prog_list4.png') no-repeat center / cover; } .list_type1 li p {font-size: 14px; font-weight: 300; color:#333; word-break: keep-all; line-height: 24px;text-align: center; margin-top: 10px;} .list_type1 li p span {color:#197cfa} .list_type2 { position:relative; display: flex; justify-content: center; flex-wrap: wrap; } .list_type2 li { position:relative; width:50%; background:#fff; padding:25px 20px; border-bottom: 1px solid #eee; } .list_type2 li .ico { margin:20px 0 12px; } .list_type2 li .txt { display: flex; align-items: center; justify-content: center; flex-direction: column; position:relative; z-index: 2; } .list_type2 li:nth-child(odd) { border-right: 1px solid #eee; } /* .list_type2 li .txt:after { content:""; position:absolute; left:50%; transform: translateX(-50%); bottom:-45px; width:1px; height: 44px; background:#43d1a1; } */ .list_type2 li .txt p { font-size:16px; word-break: keep-all; color: #000; font-weight: 500; word-break: keep-all; } .list_type2 li .txt b { display: inline-block; padding:0 3px; line-height: 25px; border-bottom: 2px solid #43d1a1; font-size:18px; color:#43d1a1; font-weight: 500; } .list_type2 li:nth-child(2) .txt b { border-color:#40d4e2; color:#40d4e2; } .list_type2 li:nth-child(3) .txt b { border-color:#41a7e1; color:#41a7e1;} .list_type2 li:nth-child(4) .txt b { border-color:#4383dd; color:#4383dd;} /* secureon */ #secureon #s1 { padding-bottom: 40px; } #secureon #s1 .article {width: 100%; display: flex; justify-content: center; flex-wrap: wrap;} #secureon #s1 .article .box {width: 50%; border: 1px solid #ddd; background: #fff; margin-left: -1px; padding: 35px 15px; text-align: center; margin-top: -1px;} #secureon #s1 .article .box:last-child {width: 100%; margin-left: 0;} #secureon #s1 .article .box .icon {width: 100px; height: 100px; background: #a2ddfd; line-height: 100px; text-align: center; font-size: 0; border-radius: 50%; margin: 0 auto 20px;} #secureon #s1 .article .box p {font-size: 14px; color:#000; line-height: 22px; letter-spacing: -0.05px; text-align: center; word-break: keep-all; font-weight: 400;} #secureon #s1 .article .box p span {color:#197cfa; font-weight: 500;} #secureon #s1 .article .box:nth-child(2) .icon {background: #7dcbfb } #secureon #s1 .article .box:nth-child(3) .icon {background: #33a2f3 } #secureon #s1 .article .box:nth-child(4) .icon {background: #197ae1 } #secureon #s1 .article .box:nth-child(5) .icon {background: #0b4e95 } #secureon #s2 { padding:40px 0; background:#f6f8f9; } #secureon #s2 .s2_txt { margin-top: 25px; width:100%; padding:20px; border:1px solid rgba(25, 124, 250, 0.38); background:#e3eff6; } #secureon #s2 .s2_txt p { position:relative; font-size:15px; font-weight: 300; color: #333; padding-left: 18px; word-break: keep-all; } #secureon #s2 .s2_txt p:before { content:""; position:absolute; left:-5px; top:5px; width:17px; height: 14px; background:url('../images/sub/sec_s2_ico1.png') no-repeat center;} #secureon #s2 .s2_txt p ~ p { margin-top: 15px; } #secureon #s3 { padding:40px 0; background:#e3eff6; } #secureon #s4 { padding:40px 0; } #secureon #s4 .s4_img_box { width:100%; border:1px solid #bac4ca; } #secureon #s4 .s4_img_box > div { padding:30px 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; } #secureon #s4 .s4_img_box .left { position:relative; background:#f6f8f9; } #secureon #s4 .s4_img_box .left img { width:75%; } #secureon #s4 .s4_img_box .left:after { content:""; position:absolute; left:50%; transform: translateX(-50%) rotate(90deg); bottom:-95px; width:54px; height: 152px; background:url('../images/sub/sec_s4_bu.png') no-repeat center / contain; } #secureon #s4 .s4_img_box .right { padding-top: 70px; background:#e5ebee; } #secureon #s4 .s4_img_box .right img { width:35%; } #secureon #s4 .s4_img_box .right h2 { margin:30px 0 15px; font-size: 22px; font-weight: bold; } #secureon #s4 .s4_img_box .right p { font-size: 15px; font-weight: 300; color:#333; line-height: 28px; word-break: keep-all; } #secureon #s4 .s4_img_box .right p b { color:#197cfa; } #secureon #s4 .s4_txt > div { margin-top: 30px; } #secureon #s5 { padding:40px 0; background:#f6f8f9; } #secureon #s5 .list_type1 li:first-child h2 { padding-left: 8px; } #secureon #s6 { position:relative; padding:40px 0 60px; background:#fff; text-align: center; z-index: 1; } #secureon .s6_con img { max-width:90%; } #secureon .s6_con h2 { margin-top: 25px; font-size: 20px; font-weight: bold; word-break: keep-all; } /* easyapps */ .easy_wrap > div:not(#s1) { padding:40px 0; } .easy_wrap > div:nth-child(2n) { background:#f7f7f7; } .easy_wrap img { max-width: 100%; } .easy_wrap br { display: none; } #easyapps #s1 { padding:0 0 40px; } #easyapps #s1 .blue_box { background:#0087c9; padding:40px 20px; display: flex; align-items: center; justify-content: space-between; margin:0 0 40px; flex-direction: column; } #easyapps #s1 .blue_box .img { order:1; margin:0 0 30px; text-align: center; } #easyapps #s1 .blue_box .img img { max-width: 80%; } #easyapps #s1 .blue_box .txt { order:2; text-align: center; line-height: 1; } #easyapps #s1 .blue_box .txt small { display: block; font-size: 14px; font-weight: normal; letter-spacing: 1.28px; color: #fff; } #easyapps #s1 .blue_box .txt strong { margin:20px 0; display: block; font-size: 20px; font-weight: bold; letter-spacing:-0.42px; color: #fff; line-height: 1.5; } #easyapps #s1 .blue_box .txt h1 { font-size: 40px; font-weight: bold; letter-spacing: -0.94px; color: #31b3ac; } #easyapps #s1 .blue_box .txt p { margin:20px 0 30px; font-size: 15px; font-weight: normal; line-height: 1.89; color: rgba(255, 255, 255, 0.6); } #easyapps #s1 .blue_box .txt a { display: block; width: 200px; height: 50px; border-radius: 30px; background-color: #fff; text-align: center; line-height: 48px; font-size: 16px; color: #0087c9; transition: all .3s; margin:0 auto; } #easyapps #s1 .blue_box .txt a:hover { text-decoration: none; background:#85c14c; color:#fff; } #easyapps #s1 .nsub_title .img { margin:30px 0 0; } #easyapps #s2 .nsub_title { margin:0; } #easyapps #s2 .nsub_title .img { margin:20px 0 30px; } #easyapps #s3 .con_wrap { display: flex; flex-direction: column; align-items: center; text-align: center; } #easyapps #s3 .img img { width:150px; } #easyapps #s3 .nsub_title { margin:30px 0 0; } #easyapps #s3 .txt a { margin:20px auto 0; display: block; width: 200px; height: 50px; border-radius: 30px; background-color: #85c14c; text-align: center; line-height: 48px; font-size: 16px; color: #fff; transition: all .3s; } #easyapps #s3 .txt a:hover { text-decoration: none; background:#197cfa; } #easyapps #s4 .nsub_title { margin:0; } #easyapps #s4 .nsub_title .img { margin:20px 0 30px; } #easyapps #s5 { background:#e3eff6; } #easyapps #s5 .video { margin: 0 0 30px; } #easyapps #s5 .nsub_title { margin:0; } #easyapps #s5 a { margin:20px auto 0; display: block; width: 200px; height: 50px; border-radius: 30px; background-color: #85c14c; text-align: center; line-height: 48px; font-size: 16px; color: #fff; transition: all .3s; } #easyapps #s5 a:hover { text-decoration: none; background:#197cfa; } #easyapps #s6 { background:#fff; } #easyapps #s6 .nsub_title { margin:0 0 20px; } /* #easyapps #s6 .nsub_title h1 { color:#243a5e; } */ #easyapps #s6 a { margin:20px auto 0; display: block; width: 200px; height: 50px; border-radius: 30px; background-color: #85c14c; text-align: center; line-height: 48px; font-size: 16px; color: #fff; transition: all .3s; } #easyapps #s6 a:hover { text-decoration: none; background:#197cfa; } /* adobe */ #adobe #sec6 { padding-top: 0; padding-bottom: 0; } #adobe #sec6 .img_box { width:100%; background:url('../images/sub/ado_s6_bg.jpg') no-repeat left center / cover; padding:40px 20px; text-align: center; color:#fff; } #adobe #sec6 .img_box small { font-size: 14px; font-weight: 300; } #adobe #sec6 .img_box h2 { margin: 20px 0; font-size: 20px; font-weight: bold; line-height: 1.5; word-break: keep-all; } #adobe #sec6 .img_box h2 strong { display: block; font-size: 30px; font-weight: bold; color: #99e83f; } #adobe #sec6 .img_box p { font-size: 17px; font-weight: 300; line-height: 1.75; color: rgba(255, 255, 255, 0.75); word-break: keep-all; } #adobe #sec6 .img_box a { margin: 30px auto; display: block; width: 200px; height: 50px; line-height: 48px; border-radius: 30px; background-color: #85c14c; text-align: center; font-size:16px; font-weight: bold; color:#fff; transition: all .3s; } #adobe #sec6 .img_box a:hover { text-decoration: none; background-color: #197cfa; } #adobe #sec7 .wh_box { background:#fff; padding:40px 20px; text-align: center; } #adobe #sec7 .wh_box img { max-width: 100%; } #adobe #sec7 .wh_box h2 { font-size: 18px; font-weight: bold; margin-bottom: 20px; line-height: 1.6; word-break: keep-all; } #adobe #sec7 .ico_list { margin:30px 0 0; display: flex; justify-content: center; flex-wrap: wrap; } #adobe #sec7 .ico_list li { width:33%; } #adobe #sec7 .ico_list li:nth-child(n+4) { margin-top: 30px; } #adobe #sec7 .ico_list li img { max-width: 60%; } #adobe #sec7 .ico_list p { margin-top: 10px; font-size: 14px; font-weight: 300; line-height: 1.44; color: #666; } #adobe #sec7 .wh_box .bl { margin-top: 30px; width: 100%; padding:25px; color:#fff; background-color: #333; border-radius: 10px; font-size: 16px; font-weight: 500; } #adobe #sec8 .img_list li { margin-bottom: 40px; text-align: center; } #adobe #sec8 .img_list li:last-child { margin-bottom: 0; } #adobe #sec8 .img_list img { max-width: 100%; } #adobe #sec8 .img_list p { position:relative; text-align: center; margin-top: 20px; padding-top: 12px; font-size: 15px; color: #333; } #adobe #sec8 .img_list p::before { content:""; position:absolute; left:50%; transform: translateX(-50%); top:0; width:20px; height: 1px; background:#000000; } #adobe #sec8 .gr_box { margin-top: 40px; text-align: center; background-color: #f7f7f7; padding:40px 20px; } #adobe #sec8 .gr_box h2 { font-size: 20px; font-weight: bold; line-height: 1.6; color: #000; word-break: keep-all; } #adobe #sec8 .gr_box h2 br { display: none; } #adobe #sec8 .gr_box h2 span { color: #d81923; } #adobe #sec8 .gr_box a { display: block; margin:30px auto 0; width:200px; height:50px; line-height: 48px; border-radius: 30px; background-color: #85c14c; color:#fff; font-size: 16px; transition: all .3s; } #adobe #sec8 .gr_box a:hover { background:#0077d3; text-decoration: none; } /* bigdata */ #bigdata {word-break: keep-all;} #bigdata br {display: none;} #bigdata img {max-width: 100%;} #bigdata .fs_18 {font-size: 14px; font-weight: 500; color:#333; line-height: 1.33; letter-spacing: -.5px;} #bigdata .fs_16 {font-size: 13px; font-weight: 300; color:#333; line-height: 1.63; letter-spacing: -.5px;} #bigdata .sub_con {padding-top: 0; padding-bottom: 0;} #bigdata .tab-pane > section {padding: 40px 0;} #bigdata .tab-pane > section:nth-child(even) {background-color: #f6f8f9; } #bigdata .btn_wrap {padding: 40px 0;} /* tab - sec1 */ #bigdata #tab1 .sec1 h2 {font-size: 18px; font-weight: 500; color:#000; line-height: 2; letter-spacing: -.5px; margin: 0; text-align: center; } /* #bigdata #tab1 .sec1 .blue_box { text-align: left; } #bigdata #tab1 .sec1 .blue_box ul li {position: relative; padding-left: 20px; font-weight: 400; line-height: 1.63;} #bigdata #tab1 .sec1 .blue_box ul li::before {content: ''; display: block; width: 12px; height: 12px; background:url('../images/sub/bigdata_tab1_s1_arrow.png') no-repeat center; position: absolute; left: 0; top:6px; background-size: contain;} #bigdata #tab1 .sec1 .blue_box ul li + li {margin-top: 20px;} */ /* tab - sec2 */ #bigdata #tab1 .sec2 .list {display: flex; justify-content: space-between; flex-direction: column; } #bigdata #tab1 .sec2 .list > li { position: relative; z-index: 1;} #bigdata #tab1 .sec2 .list > li::before {content: ''; display: block; width: 100%; height: 1px; background-color: #ccc; position: absolute; left: 0; top:90px; z-index: -1;} #bigdata #tab1 .sec2 .list > li:nth-child(n+2) {margin-top: 40px;} #bigdata #tab1 .sec2 .list h3 {display: flex; align-items: center; justify-content: center; width: 215px; height: 50px; border-radius: 3px; background-color: #43d1a1; font-weight: 400; color:#fff; margin: 0 auto; } #bigdata #tab1 .sec2 .list .line {content: ''; display: block; width: 1px; height: 30px; background: #ccc; margin: 0 auto; } #bigdata #tab1 .sec2 .list .dot {width: 20px; height: 20px; background: #f6f8f9; border:3px solid #43d1a1; margin: 0 auto 15px; border-radius: 50%;} #bigdata #tab1 .sec2 .list .dot_list > li {position: relative; padding-left: 11px;} #bigdata #tab1 .sec2 .list .dot_list > li + li {margin-top:5px;} #bigdata #tab1 .sec2 .list .dot_list > li::before {content: ''; display: block; width: 4px; height: 4px; border-radius: 50%; background-color: #43d1a1; position: absolute; left: 0; top:9px; } #bigdata #tab1 .sec2 .list > li:nth-child(2) h3 {background-color:#40d4e2;} #bigdata #tab1 .sec2 .list > li:nth-child(2) .dot {border-color:#40d4e2;} #bigdata #tab1 .sec2 .list > li:nth-child(2) .dot_list > li::before {background-color:#40d4e2;} #bigdata #tab1 .sec2 .list > li:nth-child(3) h3 {background-color:#41a7e1;} #bigdata #tab1 .sec2 .list > li:nth-child(3) .dot {border-color:#41a7e1;} #bigdata #tab1 .sec2 .list > li:nth-child(3) .dot_list > li::before {background-color:#41a7e1;} #bigdata #tab1 .sec2 .list > li:nth-child(4) h3 {background-color:#4383dd;} #bigdata #tab1 .sec2 .list > li:nth-child(4) .dot {border-color:#4383dd;} #bigdata #tab1 .sec2 .list > li:nth-child(4) .dot_list > li::before {background-color:#4383dd;} /* tab - sec3 */ #bigdata #tab1 .sec3 {background-color: #e3eff6; } #bigdata #tab1 .sec3 .img {display: flex; align-items: center; justify-content: center; } /* tab - sec4 */ #bigdata #tab1 .sec4 {background-color: #fff;} #bigdata #tab1 .sec4 .box_wrap {border-top: 1px solid #bac4ca; } #bigdata #tab1 .sec4 .box {display: flex; align-items: center; padding: 20px 0; flex-direction: column; border-bottom: 1px solid #bac4ca; text-align: center;} #bigdata #tab1 .sec4 .icon {text-align: center; flex-shrink: 0; width: 132px;} #bigdata #tab1 .sec4 .icon h3 {margin-top: 10px; } #bigdata #tab1 .sec4 .arrow {flex-shrink: 0; margin:15px 0; transform: rotate(90deg);} #bigdata #tab1 .sec4 .cont h4 {color:#177dfb; font-weight: 700; } #bigdata #tab1 .sec4 .cont h5 {font-weight: 500; margin: 8px 0 15px;} #bigdata #tab1 .sec4 .cont ul > li {position: relative; padding-left: 12px; font-size: 13px; font-weight: 300; color:#333; line-height: 1.6; text-align: left; } #bigdata #tab1 .sec4 .cont ul > li + li {margin-top: 7px;} #bigdata #tab1 .sec4 .cont ul > li::before {content: ''; display: block; width: 4px; height: 4px; border-radius: 50%; background-color: #333; position: absolute; left: 0; top:7px; } /* tab - sec5 */ #bigdata #tab1 .sec5 {background-color: #f6f8f9;} #bigdata #tab1 .sec5 .img {display: flex; align-items: center; justify-content: center;} #bigdata #tab1 .sec5 .box_wrap { margin-top: 30px; } #bigdata #tab1 .sec5 .box {width: 100%;} #bigdata #tab1 .sec5 .box + .box {margin-top: 10px;} #bigdata #tab1 .sec5 .box h3 {text-align: center; padding: 15px 0;background-color: #177dfb; color:#fff; } #bigdata #tab1 .sec5 .box .cont {width: 100%; background-color: #fff; border:1px solid #bac4ca; border-top: 0; padding:20px 15px; height: calc(100% - 60px);} #bigdata #tab1 .sec5 .box .cont ul > li {position: relative; padding-left: 14px; font-size: 13px; font-weight: 300; color:#666; line-height: 1.6; } #bigdata #tab1 .sec5 .box .cont ul > li::before {content: ''; display: block; width: 5px; height: 5px; background: #177dfb; transform: rotate(45deg); position: absolute; left: 0; top:7px; } #bigdata #tab1 .sec5 .box .cont ul > li + li {margin-top: 10px;} #offering img{max-width: 100%;} #offering .container {padding: 40px 15px;} #offering .nsub_title span{font-size: 13px; line-height: 1.7; color: #777; font-weight: 300; margin-top: 15px; display: inline-block;} #offering .oper_img{text-align: center;} #offering article:nth-of-type(odd){background-color: #f6f8f9;} #offering .sec1 .nsub_title{margin-bottom: 0;} #offering .logo_box{max-width: 500px; width: 100%; padding: 15px; background-color: #fff; border: solid 1px #ccc; display: flex; align-items: center; justify-content: center; margin: 0 auto; height: 90px;} #offering .logo_box img{transform: scale(.8);} #offering .logo_wrap p{font-size: 15px; font-weight: 300; color: #333; line-height: 28px; margin-top: 20px; text-align: center;} #offering .logo_wrap p b{font-weight: 400; color: #197cfa;} #offering .logo_wrap + .logo_wrap{margin-top: 45px;} #offering .down_wrap{margin-top: 25px; display: flex; flex-wrap: wrap;} #offering .down_box{border: solid 1px #ccc; padding: 20px; border-top: solid 3px #43d1a1; width: 100%; margin-bottom: 15px; background-color: #fff;} #offering .down_box:last-of-type{margin-bottom: 0;} #offering .down_box h3{font-size: 17px; font-weight: 700; color: #333; min-height: 31px; line-height: 31px;} #offering .down_box h3 img{margin-right: 5px; max-width: 25px;} #offering .down_list{border-top: solid 1px #ccc; margin-top: 10px; padding-top: 10px;} #offering .down_list li{position: relative; padding-left: 12px; margin-bottom: 7px;} #offering .down_list li:last-child{margin-bottom: 0;} #offering .down_list li::before{content: ''; display: block; width: 5px; height: 5px; border-radius: 50%; background-color: #43d1a1; position: absolute; top: 10px; left: 0;} #offering .down_list li a{display: flex; align-items: center; justify-content: space-between;} #offering .down_list li a span{font-size: 14px; font-weight: 300; color: #555; line-height: 1.7; display: inline-block; transition: .3s;} #offering .down_list li a i{font-size: 18px; color: #ccc; transition: .3s;} #offering .down_list li a.soon span {color:#a3a3a3;} #offering .down_list li a:hover{text-decoration: none;} #offering .down_list li a:hover span{font-weight: 500; } #offering .down_list li a:hover i{color: #43d1a1;} #offering .down_box.youtube{border-top: solid 3px #40d4e2;} #offering .down_box.youtube li::before{background-color: #40d4e2;} #offering .down_box.youtube li a:hover i{color: #40d4e2;} #offering .down_box.html{border-top: solid 3px #41a7e1;} #offering .down_box.html li::before{background-color: #41a7e1;} #offering .down_box.html li a:hover i{color: #41a7e1;} /* ethics */ /* .ethics .sub_con {padding-left: 0; padding-right: 0;} */ .ethics .top {text-align: center; width: 100%; padding:20px; background-color: #f7f7f7; word-break: keep-all;} .ethics .top h2 {font-size: 15px; font-weight: 500; color:#000; line-height: 1.55; margin:0 0 10px;} .ethics .top p {font-size: 14px; font-weight: 400; color:#333; } .ethics .job_table {margin-top: 40px;} .ethics .job_table.black table th {background-color: #333; } .ethics .job_table.black td ul li {background-image: url('../images/sub/s_blet_black.png')} .ethics .job_table .contact { margin-top: 20px; padding-left: 20px;} .ethics .job_table .contact p {color:#000; font-weight: 400; font-size: 13px;} .ethics .job_table .contact p + p {margin-top:15px; } .ethics .job_table .contact p span {display: flex; align-items: center; justify-content: center; width: 50px; height: 20px; background-color: #333; color: #fff; flex-shrink: 0; margin-bottom: 5px; font-weight: 300; font-size: 12px;} /* Recorded Future */ .recorded_future {word-break: keep-all;} .recorded_future img {max-width: 100%;} .recorded_future .fs_28 {font-size: 20px; font-weight: 700; color:#000; } .recorded_future .fs_23 {font-size: 18px; font-weight: 300; color:#333; line-height: 1.6;} /* .recorded_future .list_ul li {font-size: 16px; margin-bottom: 10px;} .recorded_future .list_ul li:last-child {margin: 0; } */ .recorded_future .icon_list > li {display: flex; align-items: center; font-size: 16px; font-weight: 500; color:#000;} .recorded_future .icon_list > li + li {margin-top: 9px; } .recorded_future .icon_list i {flex-shrink: 0; display: flex; align-items: center; justify-content: center; margin-right: 11px; width: 44px; height: 44px; border-radius: 50%; background-color: #40d4e2;} .recorded_future .icon_list > li:nth-child(2) i {background-color: #41a7e1;} .recorded_future .icon_list > li:nth-child(3) i {background-color: #4383dd;} .recorded_future .icon_list > li:nth-child(4) i {background-color: #4367dd;} .recorded_future .icon_list > li:nth-child(5) i {background-color: #b2caf6;} .recorded_future .icon_list > li:nth-child(6) i {background-color: #a693f8;} .recorded_future .icon_list > li:nth-child(7) i {background-color: #8069e0;} .recorded_future .az1_txt_box {background-color: #E5EFF6; border:1px solid #AAC7F8; margin-top: 30px;} .recorded_future .az1_txt_box h1 {margin: 0; line-height: 1.4;} .reco_c1 {background: linear-gradient(to bottom, #fff 0 85%, #f7f7f7 85%);} .reco_c1 .flex { border:1px solid #ddd;margin-top: 40px;} .reco_c1 .flex .txt {padding:30px 20px; } .reco_c1 .flex .txt h3 {margin: 0 0 15px;} .reco_c1 .flex .txt ul {margin-top:15px;} .reco_c1 .flex .txt ul li {position: relative; padding-left: 20px; } .reco_c1 .flex .txt ul li::before {content: ''; display: block; width: 12px; height: 12px; position: absolute; left:0; top:8px; background: url('../images/sub/reco_arrow.png') no-repeat center; background-size: contain;} .reco_c1 .flex .txt ul li + li {margin-top: 10px; } .reco_c1 .flex .txt ul li b {font-weight: 900; color:#2d87fb; } .reco_c1 .process_img {margin-top: 20px; border:1px solid #ddd; padding:20px; background-color: #fff;} .reco_c1 .process_img h3 {margin: 0 0 20px; } /* ave */ #ave br {display: none;} #ave img {max-width: 100%;} #ave .sub_title_box h1 {font-weight: 700; font-family: 'Noto Sans KR', sans-serif;} #ave .fs_26 {font-size: 22px; font-weight: 700; color:#000; letter-spacing: -.36px;word-break: keep-all;} #ave .fs_22 {font-size: 18px; font-weight: 600; color:#000; letter-spacing: -.28px;word-break: keep-all; line-height: 1.4;} #ave .fs_20 {font-size: 16px; font-weight: 700; color:#000; letter-spacing: -.28px;word-break: keep-all; } #ave .fs_17 {font-size: 14px; font-weight: 300; color:#333; letter-spacing: -.43px;word-break: keep-all; } #ave .arrow_list li {position: relative; padding-left: 20px; font-weight: 300; color:#333; word-break: keep-all; margin-bottom: 0;} #ave .arrow_list li::before {content: ''; display: block; width: 14px; height: 14px; position: absolute; left:0; top:4px; background: url('../images/sub/reco_arrow.png') no-repeat center; background-size: contain;} #ave .arrow_list li + li {margin-top: 10px; } #ave .num_flex_box {;} #ave .num_flex_box .img {background: #fff; border:1px solid #ccc; margin-top:40px;} #ave .num_flex_box .num_list{margin-top: 30px;} #ave .num_flex_box .num_list h4 {display: flex; align-items: flex-start; font-weight: 500; color:#000; margin-bottom: 10px; font-size: 16px;} #ave .num_flex_box .num_list h4 .num {flex-shrink: 0; margin-right: 10px; width:22px; height: 22px; background-color: #197cfa; border-radius: 50%; font-weight: 500; color:#fff; font-style: normal; display: flex; align-items: center; justify-content: center; position: relative; top:-2px; font-size: 13px;} #ave .num_flex_box .num_list > li {margin-bottom: 30px;} #ave .num_flex_box .num_list > li:last-child {margin-bottom: 0;} #ave .arrow_list {padding: 20px; background: #fff; border:1px solid #ccc; } /* #ave .arrow_list.flex {display: flex; flex-wrap: wrap; position: relative; } #ave .arrow_list.flex::before {content: ''; display: block; width: 1px; height: 40%; background-color: #ccc; left: 50%; top:30%; position: absolute;} #ave .arrow_list.flex > li {width: 50%; margin-top: 0;} #ave .arrow_list.flex > li:nth-child(n+3) {margin-top: 12px;} #ave .arrow_list.flex > li:nth-child(odd) { padding-right: 50px;} #ave .arrow_list.flex > li:nth-child(even) { transform: translateX(50px);} */ #ave .list_ul li { margin-bottom: 10px; color:#666; word-break: keep-all;} #ave .list_ul li:last-child {margin: 0; } #ave .list_ul li b {font-weight: 500; color:#fa1949; } #ave .sub_title_box .img {margin-top:40px;} #ave .sub_title_box .fs_22 {margin-top: 15px; } #ave .dot_tit {font-size:20px; color:#000; font-weight: 700; letter-spacing: -.39px ; position: relative; padding-left: 15px; margin: 0 0 20px; } #ave .dot_tit::before {content: '•'; position: absolute; left: 0; top:0; } #ave .cont {margin-top: 50px;} .ave_c1 .solutions {margin-top: 50px; } .ave_c1 .list {display: flex; flex-wrap: wrap; justify-content: space-between; text-align: center;} .ave_c1 .list > li {flex-direction: column; display: flex; justify-content: center; align-items: center; border:1px solid #ccc; width: 100%; padding: 30px 20px;} .ave_c1 .list > li:nth-child(n+2) {margin-top: 15px;} .ave_c1 .list .list_logo {display: flex; align-items: center; justify-content: center; margin-bottom: 15px; } .ave_c1 .list .list_logo img {max-height: 40px; } .ave_c1 .list h5 {margin: 12px 0;} .ave_c2 .img {border:1px solid #ccc;} .ave_c4 .img {border:1px solid #ccc;} .ave_c3 .img {border:1px solid #ccc; background-color: #fff; } .ave_c3 b {font-weight: 500; color:#fa1949; } .ave_c5 .sub_title_box .img {border:1px solid #ccc; background-color: #fff; padding: 25px 0;} .ave_bottom a {display: flex; align-items: center; justify-content: center; width:100%; padding: 30px 20px; border-radius:10px; background-color: #eaf0f3; font-size: 16px; font-weight: 500; color:#000; transition: all .3s; text-align: center; flex-direction: column; line-height: 1.71; } .ave_bottom a span {color:#197cfa; font-weight: 900; transition: color .3s; } .ave_bottom a:hover {text-decoration: none; background-color: #197cfa; color:#fff;} .ave_bottom a:hover span {text-decoration: none; color: #ffe561;} .ave_bottom a i {margin-bottom: 15px; display: block; } .ave_bottom a i img {max-height: 50px;} .ave_bottom a + a {margin-top: 20px; }