/** * 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} .logo{padding:14px 14px} .mobile_btn {float:right;position:relative;width:34px;height:34px;background-color:#000;border:0px solid #2f2f2f;margin:7px 15px 0 0} .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:2% 0;background:#000;} .call{color:#fff;font-size:13px;} .call_txt1{color:#2f2f2d;border-bottom:1px solid #2f2f2d;padding-bottom:1px;font-family: "NotoSans-Medium", sans-serif} .call img{max-width:5%} .call a{display:block;border-radius:6px;background:#383838;;padding:4px 0;width:98%;margin:2% auto 0;color:#fff;font-size:10pt;font-weight:bold;text-decoration:none} .open_info{border-top:1px solid #484848;border-bottom:1px solid #484848;padding:5px 0;color:#c0c0c0;font-size:12px;line-height:20px} .open_info a{color:#898d8e;font-size:20px;} .footer_copy {font-size:11px;color:#ccc;line-height:18px;} .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_device{;} .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} .btn-primary { color: #fff; background-color: #76aa39; border-color: #000; margin-bottom: 10px; } .btn-primary:hover { color: #fff; background-color: #33aa00; border-color: #000; } .modal-content {padding: 50px 2%; background: #f8f8f8; color: #666;} .modal_title h1 {font-size: 30px; color: #333; text-align: center; font-family: "NotoSans-Medium", sans-serif;} .modal_title p {font-size: 16px; color: #666; text-align: center; line-height: 30px;} .modal_line {width: 150px; height: 2px; background:#33aa00; margin: 20px auto;} .modal_article {width:95%; padding: 30px 20px; background: #fff; border: 1px solid #ddd; margin: 30px auto; text-align: left;} .modal_article h2 {font-size: 18px; color: #333; font-family: "NotoSans-Regular", sans-serif;} .modal_t {margin-left: 20px; font-size: 16px;} .modal_t ul li { background: url('../images/common/s_blet.jpg') no-repeat 0 0; padding-left: 20px; margin-bottom: 10px; line-height: 25px;} .modal_t p { margin-bottom: 10px; line-height: 25px;} .modal_article hr { margin: 30px 0;} .modal_table {width: 100%;} .modal_table th, .modal_table td {padding: 15px 20px; border: 1px solid #666; font-size: 16px; color: #666; text-align: center; } .modal_table th {background: #76aa39; color: #fff;} .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: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: 0px; top: 50%; z-index: 99; background: url('../images/bxslider_btn_prev.png') no-repeat 0 50%; border: 0; width: 46px; height: 64px; text-indent: -9999px; margin-top: -30px; opacity:0.6; } .bxslider_btn_next { position: absolute; right: 0px; top: 50%; z-index: 99; background: url('../images/bxslider_btn_next.png') no-repeat 0 50%; border: 0; width: 46px; height: 64px; text-indent: -9999px; margin-top: -30px; opacity:0.6; } .main_col1_wrap{position: relative;width:100%;background:#fff;margin-top:2%;} .main_col2_wrap{position: relative;width:100%;background:#fff;margin-top:2%;} .main_col3_wrap{width:100%;background:url('../images/common/col03_bg.jpg') no-repeat;margin-top:2%;color:#fff;line-height: 18px;font-size: 13px;font-family: 'NotoSans-Light' ,sans-serif;padding:5% 0;} .main_col3_wrap ul{padding:0 5%;} .main_col3_wrap li{float:left;width:31%;margin-right:3%;} .main_col3_wrap p{font-size: 20px;border-bottom:3px solid #33aa00;display: inline-block;line-height: 25px;} .col3_t1{font-size: 15px;font-family: 'NotoSans-Light' ,sans-serif;} .col3_t2{font-size: 20px;font-family: 'NotoSans-Bold' ,sans-serif;} /* ------------------------------------------------------------------- | 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:20px 0} .sub_top_area_t{font-size:17px;font-family: "NotoSans-Bold", sans-serif;} .sub_top_area_t2{font-size:13px;font-family: "NotoSans-Light", sans-serif;} .sub_top_line{border-top:1px solid #fff;width:40px;margin:0 auto;} .sub_top_list li{display: none; padding: 0 20px; word-break: keep-all;} .sub_article{position:relative;width:1300px;margin:0 auto;padding-bottom:50px;border-bottom:1px solid #151314} .title{text-align:center;padding:20px;border-bottom: 1px solid #ccc;} .sub_title{color:#222;font-size:22px;border-bottom:3px solid #33aa00;padding-bottom:17px;} .contents{min-height:350px;padding:0 15px 30px;} .sub_info{position:relative;width:1200px;font-size:15px;color:#666;line-height:35px;text-align:left} .sub_txt1{font-size:25px;color:#333;font-family: "NotoSans-Bold", sans-serif} .sub_txt2{font-size:25px;color:#0152a2;font-family: "NotoSans-Bold", sans-serif} .sub_txt3{font-size:20px;color:#333;font-family: "NotoSans-Medium", sans-serif} .sub_left{float:left;width:600px;padding-left:100px} .sub_left img{float:right;margin-right:20px} .sub_right{float:right;width:466px;margin-right:100px} .sub_menu ul{width:100%;border-top:0px solid #1d5bc0; border-bottom:1px solid #eee; display:table;} /* .sub_menu li{height:60px; padding:20px 0; text-align:center;border-right:1px solid #ccc; display:table-cell;} */ .sub_menu li{height:60px; text-align:center;border-right:1px solid #ccc; display:table-cell; width:25%; vertical-align: middle;} .sub_menu li:last-child{border-right:0px} .sub_menu li a{font-size:20px;color:#333;text-decoration: none;} .sub_menu li a:hover{font-size:20px;color:#0c367b;background:#fff} .sub_menu li a.active{color:#0c367b;} .greetings_wrap{position: relative;width:100%;margin:0 auto} .greetings_area{position: relative;width:100%;margin:0 auto;display: inline-block;color:#666;font-size: 13px;line-height: 25px} .greetings_tit{font-size: 20px;color:#333;line-height: 35px;} .greetings_tit_pt{color:#33aa00} .greetings_img{float:right;width:250px} .greetings_sign{text-align: center;margin-top:15px} .history_tt{font-size: 20px;color:#333;line-height:35px;} .history_tt2{color:#33aa00} .history_con{line-height: 30px;color:#666;font-size: 15px;} .history_txt{font-size: 20px;color:#33aa00;margin-top: 10px;} .history_table{font-size:13px;color:#666;line-height: 25px;margin-top:10px;} .history_table caption{font-size:0px;color:#fff;padding:0;line-height:0} .history_table_topline{border-top:2px solid #33aa00} .history_table th{border-bottom:1px solid #ccc;color:#333;font-size:15px;padding:10px 30px;} .history_table td{border-bottom:1px solid #ccc;padding:10px 30px} .organization_tt_wrap{width:100%;display: inline-block;position:relative} .organization_tt{font-size: 20px;color:#33aa00;text-align: center;} .organization_img2{margin-top:20px;text-align: center;} .map{width:100%;margin:0 auto;position: relative} .location_box{width:100%;} .location_table{font-size:13px;color:#666;line-height: 25px;margin-top:20px;} .location_table caption{font-size:0px;color:#fff;padding:0;line-height:0} .location_table th{border-bottom:1px solid #ccc;color:#333;font-size:15px;padding:10px 0px;border-top:2px solid #33aa00} .location_table td{border-bottom:1px solid #ccc;padding:10px 0px} .location_tt{font-size: 17px;color:#333;background: url('../images/sub/tt_blet.jpg') no-repeat top right;padding-right:20px;font-family: "NotoSans-Medium", sans-serif} .purchase{;} .purchase_tt{color:#333;line-height: 25px;font-size: 13px;font-family: "NotoSans-Light", sans-serif;} .purchase_txt1{font-size: 17px;font-family: "NotoSans-Medium", sans-serif;color:#33aa00;} .purchase_txt2{font-size: 15px;font-family: "NotoSans-Regular", sans-serif;} .purchase_txt3{font-size: 13px;font-family: "NotoSans-Regular", sans-serif;} .purchase_txt4{font-family: "NotoSans-Medium", sans-serif;border-bottom: 1px solid #fff;} .purchase_table{font-size:13px;color:#666;line-height: 25px;margin-top:40px;text-align: center;} .purchase_table caption{font-size:0px;color:#fff;padding:0;line-height:0} .purchase_table th{border-bottom:1px solid #ccc;color:#333;font-size:15px;padding:13px 30px;border-top:2px solid #33aa00;text-align: center;} .purchase_table td{border-bottom:1px solid #ccc;padding:13px 30px} .extract{width:100%;margin:0 auto;border:1px solid #ccc;font-size:13px;color:#666;text-align: center;padding-bottom:5%;display: inline-block;} .extract_txt{font-size: 17px;font-family: "NotoSans-Medium", sans-serif;color:#333;background: url('../images/sub/tt_blet.jpg') no-repeat right top;padding-right:20px;} .drying li{float:left;width:100%;border:1px solid #ccc;font-size:13px;color:#666;text-align: center;padding-bottom:5%;display: inline-block;margin-bottom:3%;} .drying_txt{font-size: 17px;font-family: "NotoSans-Medium", sans-serif;color:#333;background: url('../images/sub/tt_blet.jpg') no-repeat right top;padding-right:20px;} .freezing li{float:left;width:100%;border:1px solid #ccc;font-size:13px;color:#666;text-align: center;line-height: 25px;padding-bottom:5%;display: inline-block;margin-bottom:3%;} .freezing_txt{font-size: 17px;font-family: "NotoSans-Medium", sans-serif;color:#333;background: url('../images/sub/tt_blet.jpg') no-repeat right top;padding-right:20px;} .freezing_txt2{font-size: 13px} .drying2_tt_wrap{width:100%;border:1px solid #ccc;text-align: center;color:#666;font-size: 13px;padding-top:20px;display: inline-block;padding-bottom:5%;} .drying2_tt{font-size: 17px;font-family: "NotoSans-Medium", sans-serif;color:#333;background: url('../images/sub/tt_blet.jpg') no-repeat right top;padding-right:20px;} .drying2 li{margin-bottom:10px;} .qm1 li{margin-bottom:10px;} .production li{width:100%;display: inline-block;border:1px solid #ccc;font-size:13px;color:#666;text-align: center;padding-bottom:20px;margin-bottom:10px;} .production_txt{font-size: 17px;font-family: "NotoSans-Medium", sans-serif;color:#333;background: url('../images/sub/tt_blet.jpg') no-repeat right top;padding-right:20px;} .production_txt2{font-size: 13px} .cleanroom{;} .cleanroom li{width:100%;display: inline-block;padding-bottom:20px;margin-bottom:10px;border:1px solid #ccc;font-size:13px;color:#666;text-align: center} .cleanroom_txt{font-size: 17px;font-family: "NotoSans-Medium", sans-serif;color:#333;background: url('../images/sub/tt_blet.jpg') no-repeat right top;padding-right:20px;} #odm .fs_17{font-size: 14px; font-weight: 400; letter-spacing: -.34px; line-height: 25px; color: #666;} #odm .fs_16{font-size: 13px; font-weight: 400; letter-spacing: -.32px; line-height: 22px; color: #666;} #odm .tit{text-align: center;} #odm .tit h2{font-size: 20px; font-weight: 400; letter-spacing: -.7px; color: #333; background: url('../images/sub/tt_blet.jpg') no-repeat calc(50% + 35px) 0%; margin: 0;} #odm .tit p{margin-top: 15px;} #odm .step_list{display: flex; flex-wrap: wrap; text-align: center; position: relative; margin-top: 30px;} #odm .step_list li{width: 100%; display: flex; align-items: center; justify-content: center; margin-bottom: 10px; border: solid 1px #33aa00; border-radius: 5px; position: relative; z-index: 1; background-color: #fff; padding: 10px;} #odm .step_list li:last-child{margin-bottom: 0;} #odm .step_list::before{content: ''; display: block; width: 30px; height: calc(100% + 35px); background-image: linear-gradient(to bottom, #90d673, #3a0, #1e8f01); position: absolute; top: 0%; left: 50%; transform: translateX(-50%); } #odm .step_list::after{content: ''; display: block; width: 32px; height: 64px; background: url('../images/sub/odm_tri.png') 50% / cover no-repeat ; position: absolute; left: 50%; bottom: -75px; transform: translateX(-50%) rotate(90deg);} #odm .num_list{display: flex; flex-wrap: wrap; border-top: solid 2px #3a0; margin-top: 80px;} #odm .num_list li{width: 100%; text-align: center; padding: 20px 25px; border:solid 1px #ddd; border-top: 0; background-color: #fff;} #odm .num_list i{margin: 5px 0; display: inline-block; transition: .5s;} #odm .num_list i img{transform: scale(.7);} #odm .num_list h4{font-size: 25px; letter-spacing: -.7px; color: #333; line-height: 1; margin: 0;} #odm .num_list h3{font-size: 18px; letter-spacing: -.4px; color: #333; line-height: 1; margin-top: 10px;} #odm .num_list li p{line-height: 28px;} #odm .num_list li:hover i{transform: rotateY(180deg);} #odm .sec2{padding: 30px 0; margin-top: 30px; background-color: #f7f7f7;} .sub2 .contents{padding: 0;} .sub2 .inner{padding: 0 15px;} .sub2 .inner1{padding: 0 15px 30px;}