@font-face { font-family: 'NanumGothic'; font-style: normal; font-weight: 400; src: url('../fonts/NanumGothic/NanumGothic-Regular.eot'); src: url('../fonts/NanumGothic/NanumGothic-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/NanumGothic/NanumGothic-Regular.woff2') format('woff2'), url('../fonts/NanumGothic/NanumGothic-Regular.woff') format('woff'), url('../fonts/NanumGothic/NanumGothic-Regular.ttf') format('truetype'); } @font-face { font-family: 'NanumGothic'; font-style: normal; font-weight: 700; src: url('../fonts/NanumGothic/NanumGothic-Bold.eot'); src: url('../fonts/NanumGothic/NanumGothic-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/NanumGothic/NanumGothic-Bold.woff2') format('woff2'), url('../fonts/NanumGothic/NanumGothic-Bold.woff') format('woff'), url('../fonts/NanumGothic/NanumGothic-Bold.ttf') format('truetype'); } @font-face { font-family: 'NanumGothic'; font-style: normal; font-weight: 800; src: url('../fonts/NanumGothic/NanumGothic-ExtraBold.eot'); src: url('../fonts/NanumGothic/NanumGothic-ExtraBold.eot?#iefix') format('embedded-opentype'), url('../fonts/NanumGothic/NanumGothic-ExtraBold.woff2') format('woff2'), url('../fonts/NanumGothic/NanumGothic-ExtraBold.woff') format('woff'), url('../fonts/NanumGothic/NanumGothic-ExtraBold.ttf') format('truetype'); } * { font-family:'NanumGothic', '나눔고딕', '맑은 고딕', 'Malgun Gothic', '굴림', 'gulim', '돋음', 'Dotum', sans-serif; } *:focus { outline:none; } html, body { font-size: 14px; font-family: 'NanumGothic', '나눔고딕', '맑은 고딕', 'Malgun Gothic', '굴림', 'gulim', '돋음', 'Dotum', sans-serif; width:100%;height:100%;margin:0px; color:#333333; } table { font-size: 14px; font-family: 'NanumGothic', '나눔고딕', '맑은 고딕', 'Malgun Gothic', '굴림', 'gulim', '돋음', 'Dotum', sans-serif; } a img { border: none; } input[type=checkbox],input[type=radio] { position:relative; top:2px; } input[type=text],textarea { border:1px solid #919191; font-size:15px; line-height:20px; width:100%; padding:10px; } input[type=number] { border:1px solid #919191; font-size:15px; line-height:20px; width:100%; padding:5px; } input[type=email] { border:1px solid #919191; font-size:15px; line-height:20px; width:100%; padding:6px 5px; } input[type=password] { border:1px solid #919191; font-size:15px; line-height:20px; width:100%; padding:6px 5px; } table.test td { border:1px solid red; } /* //input[placeholder],[placeholder],*[placeholder] { font-size:15px; color: red !important; } */ /* Webkit */ /* input::-webkit-input-placeholder { font-size:15px; color: #FF0000; font-weight:bold; position:relative;top:1px; } */ /* IE 10 */ input:-ms-input-placeholder { font-size:15px; color: #B0B0B0; } textarea:-ms-input-placeholder { font-size:16px; color: #AAAAAA; } select { border:1px solid #AAAAAA;padding:5px;padding-bottom:6px; color:#666666;font-size:14px;cursor:pointer; background:url(../images/icon_selectBox_arrow_11x6.png) no-repeat right 10px center; appearance:none;-moz-appearance:none;-webkit-appearance:none; } select::-ms-expand { display:none; } /* IE */ /*#mainWidth {width:950px;margin:auto;} hym 2.0 */ /*#mainWidth { width:1100px;margin:auto; } hym 3.0 */ #mainWidthFill { width:100%; margin:auto; } #mainWidth { width:1150px; margin:auto; } /* inkel : min */ #mainInnerWidth { width:100%; min-height:500px; } /* inkel : min */ #mainWidth_Board { min-width:1150px; margin:0px 0px; } /* inkel Board : full */ #mainInnerWidth_Board { width:100%; } /* inkel Board : full */ #mainWidth_FA { min-width:1150px; margin:0px 20px; } /* inkel FA : full */ #mainInnerWidth_FA { text-align:left; } /* inkel FA : full */ .div_checkBrowser { width:90%;margin-top:1px;padding:8px;background-color:#F5F5F5;border:1px solid #DDDDDD;color:#333333;font-size:13px;line-height:18px;display:none; } /* 기본 버튼 스타일 ex :
TEST
*/ .div_btn { border:1px solid #CCCCCC; padding:10px; cursor:pointer; text-align:center; font-size:14px;line-height:14px; } .div_btn:hover { background-color:#F5F5F5; border:1px solid #AAAAAA; } .div_btn.green { background-color:#6AA850;color:#FFFFFF;border:1px solid #6AA850; } .div_btn.green:hover { background-color:#87C46D; border:1px solid #87C46D; } .div_btn.green.reverse { background-color:#FFFFFF;border:1px solid #6AA850;color:#6AA850; } .div_btn.green.reverse:hover { background-color:#F5F5F5; } .div_btn.gray { background-color:#555555;color:#FFFFFF;border:1px solid #D8D8D8; } .div_btn.lightGray { background-color:#EBEBEB;color:#555555;border:1px solid #EBEBEB; } .div_btn.red { border:1px solid #F73737;color:#F73737; } .div_btn.red:hover { background-color:#F73737;color:#FFFFFF;border:1px solid #F73737; } .div_btn.mainTop { float:right;padding:12px 25px;border:1px solid #444444;color:#444444;border-radius:20px; cursor:pointer; } .div_btn.mainTop:hover { background-color:#444444;color:#FFFFFF; } .div_btn.mainTop.red { border:1px solid #F73737;color:#F73737; } .div_btn.mainTop.red:hover { background-color:#F73737;color:#FFFFFF; } .btn_lang { color:#666666; font-weight:normal; font-size:13px;line-height:13px; display:inline-block; cursor:pointer; margin-right:15px; } .btn_lang:hover { color:#333333; font-weight:bold; } .btn_lang.selected { color:#333333; font-weight:bold; } /* 하단 N개 버튼 스타일
Cancel
*/ .div_btnGroup { margin-top:30px; border-top:1px solid #EEEEEE;padding-top:30px; } .div_btnGroup .div_btn { display:inline-block; width:200px; padding:15px; margin-right:15px; float:right; } .div_btnGroup .div_btn:last-child { margin-right:0px; } .div_btnGroup input[type=submit] { width:230px; } .div_btnGroup .div_btn.list { color:#1E1E1E; border:1px solid #1E1E1E; width:120px; float:left; } .div_btnGroup .div_btn.list:hover { background-color:#1E1E1E; color:#FFFFFF; } /* 라디오버튼 그룹
*/ .div_radio-group { position: relative;} .div_radio-group input[type="radio"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0;} .div_radio-group input[type="radio"] + label { display: inline-block; position: relative; padding-left: 30px; margin-right:20px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; } .div_radio-group input[type="radio"] + label:before { content: ''; position:absolute;left:0;top:-4px; width:21px;height:21px; background:#FAFAFA;border:1px solid #CACECE;border-radius:100%; text-align:center; box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05); } .div_radio-group input[type="radio"] + label:active:before, .div_radio-group input[type="radio"]:checked + label:active:before { box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1); } .div_radio-group input[type="radio"]:checked + label:before { background: #E9ECEE; border-color: #ADB8C0; } .div_radio-group input[type="radio"]:checked + label:after { content: ''; position:absolute;top:1px;left:5px; width:13px;height:13px;background:green; border-radius:100%; box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3); } /* 라디오버튼 그룹 - small size */ .div_radio-group.small input[type="radio"] + label { font-size:12px; padding-left:25px; } .div_radio-group.small input[type="radio"] + label:before { top:-2px; width:17px;height:17px; } .div_radio-group.small input[type="radio"]:checked + label:after { top:3px; width:9px;height:9px; } /* select box */ .select_box { position:relative;border:1px solid #B3B3B3; padding:2px; color:#666666; font-size:14px; background:url(../images/icon_selectBox_arrow.png) no-repeat 98%; cursor:pointer; } .select_box > span { position:absolute;left:5px;top:6px; font-size:14px; cursor:pointer; } .select_box > select { opacity: 0; filter: alpha(opacity=0); cursor:pointer; /* IE 8 */ } /* on/off 버튼 스타일 (Text입력은 after,before 오버라이딩할 것) */ .label_onoff { display:block;position:relative;left:30px; width:90px;height:34px;border-radius:17px;background-color:#E0E0E0;transition-duration:0.2s; cursor:pointer; } .label_onoff span { position:absolute;left:3px;top:3px;z-index:1; width:28px;height:28px; border-radius:50%;background-color:#FFFFFF;transition-duration:0.2s; } .label_onoff:before, .label_onoff:after { position:absolute;top:0;width:50px; font-size:12px;line-height:34px;color:#FFFFFF;text-align:center; } .label_onoff:before { left:8px; content:''; } .label_onoff:after { right:8px; content:'OFF'; color:#666666; } .label_onoff.on { background-color:#6AA850; } .label_onoff.on span { /* left: 29px; */ transform:translateX(56px); } .label_onoff.on:after { content:''; } .label_onoff.on:before { content:'ON'; } /* 상세보기 관련 스타일 */ .div_bottom { border-top:1px solid #E5E5E5;margin-top:20px;padding-top:20px; } .div_bottom > div { display:inline-block; font-size:14px; border:1px solid #1E1E1E; color:#1E1E1E; padding:10px 35px; } .div_bottom > div:hover { background-color:#1E1E1E; border:1px solid #1E1E1E;color:#FFFFFF; cursor:pointer; } .div_bottom .btn_list { float:right;background-color:#4D4D4D;border:1px solid #4D4D4D;color:#FFFFFF; } .btn_del { display:inline-block; border:1px solid #D5D5D5; border-radius:30px; color:#888888; padding:10px 15px; font-size:13px; } .btn_del:hover { background-color:#F4F4F4; border:1px solid #222222;color:#222222; cursor:pointer; } /* 작성하기 관련 스타일 */ .content_title { display:inline-block; width:15%; padding-left:5%; vertical-align:top; } .content_title sup { font-size:15px; } .content_content { display:inline-block; width:70%; } .div_comment { font-size:14px; color:#888888; line-height:22px; } .div_invalid { font-size:14px; color:#F63E2D; padding:5px 0px 0px 5px; display:none; } #fileList .wrap_upload {float:left;position:relative;border:1px solid #919191;height:38px;width:103%;margin-left:-5px;background-color:#EBF5FD; } #fileList .wrap_upload .txt_placeholder { position:absolute;top:5px;left:12px;font-size:15px;z-index:5;color:#1e1e1e; } #fileList .wrap_file .inp_file {position:absolute;top:0;left:0;width:100%;height:38px;border:0 none;opacity:0.01;filter:alpha(opacity=1);cursor:pointer;outline:0 none;font-size:0;line-height:0;z-index:5; } #fileList .wrap_file .ico_file {position:absolute;top:5px;right:14px;width:11px;height:11px;background-position:0 -28px;} #fileList .wrap_bar {width:600px;height:40px;margin-top:13px;border:0 none; background-color:#FFFFFF; border:1px solid #2C91F2; color:#2C91F2; font-size:14px; padding-left:20px;line-height:38px; } #fileList .wrap_bar .file_delete {position:absolute;right:5px;color:#000000;cursor:pointer;width:30px;text-align:center;} /* DatePicker Style by Sunnyfish */ .ui-datepicker { font-size:12px; z-index:100; } .ui-datepicker select.ui-datepicker-year { width:60px; } .ui-datepicker select.ui-datepicker-month { width:55px; margin-left:7px; } .siteTitle { font-size:24px; font-weight:bold; color:#313A3E; line-height:24px; } .login_title{ font-weight:bold; font-size:23px; color :#555555; font-family: '돋음', 'Dotum', '맑은 고딕', 'Malgun Gothic', sans-serif; } .logo_title{ font-weight: bold; color :#21B3FF; font-family: '돋음', 'Dotum', '맑은 고딕', 'Malgun Gothic', sans-serif; } .btn_language{ display:inline-block; height:20px;width:80px;margin:5px 0 0; background:#21B3FF; align:right; } .btn_languageText { color:white;font-size:13px; font-weight:bold; position:relative;top:3px;right:18px; font-family: '굴림', gulim; text-align:center; } .btn_languageTextEng { color:white;font-size:13px; font-weight:bold; position:relative;top:3px;right:13px; font-family: '굴림', gulim; text-align:center; } /* header 상단 회원가입/로그인/로그아웃 버튼 */ .btn_join { display:inline-block; height:16px;width:55px;margin:5px 10px 0;padding-top:2px; background:white; border:1px solid #E3E3E3; } .btn_joinText { color:#979797;font-size:12px;line-height:12px; font-weight:bold; font-family: 'NanumGothic','굴림',gulim; text-align:center; } .btn_login { width:55px;margin:2px;padding:2px; background:white; border:1px solid #E3E3E3; text-align:center; color:#979797; font-size:12px;line-height:12px; font-weight:bold; cursor:pointer; } .btn_logout { width:55px;margin:2px;padding:2px; background:white; border:1px solid #E3E3E3; text-align:center; color:#979797; font-size:12px;line-height:12px; font-weight:bold; cursor:pointer; } .loginWindow { background-color:yellow; position:relative; left:600; right:0;top:100; width:300px; z-index:1000; } /* 메인메뉴 페이지 상단 제목 */ .div_mainTitle { border-bottom:2px solid #555555;margin-top:40px;padding-bottom:25px;font-size:24px;line-height:24px;color:#333333;font-weight:bold;width:100%;text-align:left; } .img_mainTitleBar { margin-right: 5px; } .span_mainTitle { font-size:16px; font-weight:bold; } .span_mainTitle_sub { font-size:14px; font-weight:normal; color:#9A9A9A; margin-left:10px; } /* .div_subTitleBox { border:1px solid #6AA850; font-size:17px;text-align:left; padding:10px; box-shadow:2px 2px #6AA850; } */ .div_subTitleBox { border:1px solid #E2E2E2; background-color:#F8F8F8; font-size:16px;text-align:left; padding:15px 20px; box-shadow:1px 1px #E0E0E0; font-weight:bold; } .div_subTitleBox .btn { display:inline-block; float:right; font-size:14px;font-weight:normal;color:#666666; margin-left:10px; cursor:pointer; border:1px solid #CCCCCC;padding:8px 12px;border-radius:3px;position:relative;top:-12px; } .div_subTitleBox .btn:hover { color:#000000; border:1px solid #333333; } .div_contentBox { text-align:left; margin-bottom:50px; margin-top:30px; } .div_contentBox .left { display:inline-block; border:0px solid red; vertical-align:top; width:18%;padding-left:40px; font-size:18px;line-height:18px; font-weight:bold; } .div_contentBox .right { display:inline-block; border:0px solid red; vertical-align:top; width:78%;padding-bottom:0px;border-bottom:0px dashed #AAAAAA; } .div_contentBox .right .table_list { margin-bottom:15px; } .div_contentBox .right .table_list:last-child { margin-bottom:0px; } .div_contentBox .right .table_list th { width:180px; } .div_contentBox .btnGroup { margin-top:10px; margin-bottom:70px; } .div_contentBox .btnGroup > .div_btn { display:inline-block; float:right;margin-left:5px; padding:5px 10px;font-size:14px; background-color:#EBEBEB; border:0px; } .div_contentBox .btnGroup > .div_btn.bold { background-color:#CFCFCF; } .div_contentBox .btnGroup > .div_btn.bold:before { content:'*'; color:#000000; } .div_contentBox .btnGroup > .div_btn:hover { background-color:#6AA850;color:#FFFFFF; } /* 검색 */ .div_searchBox { border:1px solid #D8D8D8;padding:1px 5px;display:inline-block;float:right; } #input_searchText { width:150px;padding:2px 0px;padding-left:5px;border:0px;margin-top:2px; } #input_searchText:focus { outline:none; } #img_btnSearch { vertical-align:middle;margin-top:-5px;cursor:pointer; } /* 테이블 */ .table_list { border-collapse:collapse; border-spacing:0; border-top:1px solid #999999; } .table_list tr { background-color:#FFFFFF; border-bottom:1px solid #EDEDED; } .table_list th { font-size:14px; padding:15px 7px; text-align:center; background-color:#FAFAFA; } .table_list td { font-size:14px; padding:10px 7px; text-align:center; line-height:18px; } .table_list td a { color:#4A4A4A; text-decoration:none; } .table_list td a :link { color:#4A4A4A; text-decoration:none; } .table_list td a :visited { color:#4A4A4A; text-decoration:none; } .table_list td a :hover { color:#4A4A4A; text-decoration:underline; } .table_list td a :active { color:#4A4A4A; text-decoration:none; } .table_list input[type=text],input[type=number], input[type=email] { padding:5px; } .table_list.test td { border:1px solid red; } .table_list.test th { border:1px solid red; } .table_list span.comment { color:#888888; margin-left:5px; } .table_list th.star:before { content:'*'; color:red; } .table_list .img_dot { width:80px; } .table_list tr.hover { background-color:#FFFFFF; cursor:pointer; } .table_list tr.hover:hover { background-color:#F5F5F5; } /* 필요시 오버라이딩 */ .table_list.bodyScroll { display:block; } /* tbody에 스크롤을 적용하려면 display:block;을 주어야하는데 그렇게하면 thead와 tbody사이의 컬럼 정렬이 깨지므로 각 컬럼 너비 지정해야함 */ .table_list.bodyScroll tbody { display:block; height:100px; overflow:auto; } .page_list { margin-top:20px; } .page_list td { text-align:center; height:30px; } .header_mainMenuTitle a { color:black; text-decoration:none; } .header_mainMenuTitleSelected a { color:#666666; text-decoration:underline; } .header_mainMenuTitleSelectedBlue a { color:#0F9FDD; text-decoration:underline; } .footer_menu a { text-decoration:none; color:#909090; font-size:13px; } .footer_bar { color:#D9D9D9; font-size:12px; } .btn_login a { text-decoration:none; } .btn_logout a { text-decoration:none; } .btn_join a { text-decoration:none; } /* 목록 페이징 버튼 */ .inputBtn_pageNumber_on { height:22px; margin:0px 2px; background-color:#FFFFFF; border:0px solid #6AA850; color:#6AA850; font-size:15px; font-weight:bold; text-decoration:underline; } .inputBtn_pageNumber_off { height:22px; margin:0px 2px; background-color:#FFFFFF; border:0px solid #CCCCCC; color:#666666; font-size:15px; } .a_btn_dataPager { border:1px solid #E0E0E0; cursor:pointer; } /* .a_btn_dataPager:hover { background-color:#6AA850; } */ .a_btn_dataPager:hover { border:1px solid #555555; } .a_btn_dataPager.first { padding:4px 5px 1px 4px; } .a_btn_dataPager.prev { padding:4px 7px 1px 7px; } .a_btn_dataPager.next { padding:4px 7px 1px 7px; } .a_btn_dataPager.last { padding:4px 4px 1px 5px; }