1360 lines
48 KiB
CSS
1360 lines
48 KiB
CSS
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900&subset=korean');
|
|
|
|
* {
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
html {overflow-y:scroll;}
|
|
body {position:relative; margin:0; padding:0; font-size:15px;}
|
|
body, h1, h2, h3, h4, h5, h6, input, button, textarea, select {
|
|
margin:0;padding:0;font-family: 'Noto Sans KR Light', sans-serif;}
|
|
p {margin:0;}
|
|
ol, ul, li, dd {margin:0;padding:0;list-style:none;}
|
|
a:link, a:visited, a:hover, a:focus, a:active {color:#000; text-decoration:none;}
|
|
a:hover, a:focus, a:active {color:#000;text-decoration:none;}
|
|
label {font-size:0}
|
|
caption {font-size:0}
|
|
table {border-spacing:0; border-collapse:collapse}
|
|
button {cursor:pointer}
|
|
|
|
|
|
/* right SNS */
|
|
.right_btn {display:none; position:fixed; top:23%; right:0; z-index:99}
|
|
.right_btn li {width:50px; height:50px}
|
|
.right_btn li img {width:100%;}
|
|
|
|
@media (max-width: 900px){
|
|
.right_btn {display:none}
|
|
}
|
|
|
|
@media (max-width: 900px){
|
|
.right_btn {display:none}
|
|
}
|
|
|
|
header {position:relative; top:0; width:100%; height:80px;z-index:100;}
|
|
|
|
.hd_top {position:relative;width:100%;height:80px; margin-top: -6px; margin-bottom: 6px;}
|
|
|
|
|
|
.hd_top h1 {position:absolute; left:85px; top:17px; width:317px; height:39px; z-index:99999;}
|
|
|
|
@media screen and (max-width: 1300px) {
|
|
.hd_top {width:100%;}
|
|
}
|
|
@media screen and (max-width: 770px) {
|
|
.hd_top {height:80px;}
|
|
}
|
|
|
|
@media screen and (max-width: 480px) {
|
|
header {position:relative; top:0; width:100%; height:60px;z-index:100;}
|
|
.hd_top {height:60px;}
|
|
.hd_top h1 {position:absolute; left:10px; top:10px; width:75%; height:39px; z-index:99999;}
|
|
.hd_top h1 img {width:100%;}
|
|
}
|
|
|
|
#skip_to_container a {
|
|
z-index:100000;
|
|
position:absolute;
|
|
top:0;
|
|
left:0;
|
|
width:1px;
|
|
height:1px;
|
|
font-size:0;
|
|
line-height:0;
|
|
overflow:hidden;
|
|
}
|
|
|
|
#skip_to_container a:focus, #skip_to_container a:active {
|
|
width:100%;
|
|
height:75px;
|
|
background:#21272e;
|
|
color:#fff;
|
|
font-size:2em;
|
|
font-weight:bold;
|
|
text-align:center;
|
|
text-decoration:none;
|
|
line-height:3.3em;
|
|
}
|
|
|
|
/*190220 english 추가 s*/
|
|
.eng_top {position:absolute; top:30px; right:270px; font-size:13px; font-weight:900}
|
|
.eng_top a {padding:3px 10px !important; }
|
|
@media screen and (max-width: 770px) {
|
|
.eng_top {position:absolute; top:30px; right:110px; font-size:13px; font-weight:900}
|
|
}
|
|
@media screen and (max-width: 560px) {
|
|
.eng_top {display:none}
|
|
}
|
|
/*190220 english 추가 e*/
|
|
|
|
.utill_new {font-size: 11px; margin-left: 140px; font-weight: bold;}
|
|
|
|
.utill {float:right; position:relative; width:250px; height:80px;z-index:999999999; padding-top: 11px; margin-right: 62px; padding-top: 11px;}
|
|
.utill ul {display:block;}
|
|
.utill li {float:left;width:80px;text-align:center;}
|
|
.utill li#utill_ct {width:80px; padding-top:10px; background:none;}
|
|
.utill li a {display:block;width:100%;height:100%;}
|
|
|
|
.utill li.utill_search {float:left; width:170px; padding:11px 5px 5px; border-bottom:2px solid #006297; }
|
|
.utill li.utill_search input {float:left; width:140px; font-size:13px; color:#fff; border:0; }
|
|
.utill li.utill_search button {float:left; width:20px; border:0; background:none;cursor:pointer}
|
|
.utill li.utill_search button i {color:#006297; font-size:18px; }
|
|
|
|
@media screen and (max-width: 770px) {
|
|
.utill {display:none;}
|
|
}
|
|
|
|
|
|
/* 사이트맵 카테고리 */
|
|
#utill_sitemap{
|
|
display:none;
|
|
position:fixed;
|
|
top:0px;
|
|
left:0;
|
|
width:100%;
|
|
height:100%;
|
|
background:rgba(0, 0, 0,0.8);
|
|
z-index:99999;
|
|
-moz-box-sizing:border-box;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
-webkit-backface-visibility: hidden;
|
|
}
|
|
|
|
@media (max-width:960px) {
|
|
#utill_sitemap{
|
|
top:80px;
|
|
}
|
|
}
|
|
|
|
@media (max-width:480px) {
|
|
|
|
#utill_sitemap{
|
|
display:none;
|
|
}
|
|
}
|
|
|
|
#utill_sitemap .us_wr{
|
|
width:100%;
|
|
height:730px;
|
|
overflow-y:auto;
|
|
background:#fff;
|
|
z-index:99999;
|
|
}
|
|
|
|
#utill_sitemap .us_tbx {
|
|
position:relative;
|
|
width:1300px;
|
|
height:730px;
|
|
margin:0 auto;
|
|
padding-top:50px;
|
|
padding-left:100px;
|
|
}
|
|
|
|
@media (max-width:1300px) {
|
|
#utill_sitemap .us_tbx {
|
|
width:100%;
|
|
height:800px;
|
|
padding-left:20px;
|
|
}
|
|
}
|
|
|
|
.us_tbx_ul01 {
|
|
display:block;
|
|
width:100%;
|
|
height:100%;
|
|
}
|
|
|
|
.us_tbx_ul01 li {
|
|
float:left;
|
|
width:18%;
|
|
padding-right:0;
|
|
color:#000;
|
|
text-align:left;
|
|
background:none;
|
|
word-break:keep-all;
|
|
}
|
|
|
|
@media (max-width:960px) {
|
|
|
|
.us_tbx_ul01 li {
|
|
width:16%;
|
|
margin-right:2%;
|
|
font-size:13px;
|
|
}
|
|
}
|
|
|
|
.us_tbx_ul01 > li:nth-child(4) {
|
|
width:20%;
|
|
background:none;
|
|
}
|
|
|
|
@media (max-width:960px) {
|
|
|
|
.us_tbx_ul01 > li:nth-child(4) {
|
|
|
|
}
|
|
}
|
|
|
|
|
|
.us_tbx_ul01 li p {
|
|
display:inline-block;
|
|
width:150px;
|
|
font-size:24px;
|
|
padding-bottom:20px;
|
|
border-bottom:1px solid #dedede;
|
|
color:#9aa60f;
|
|
}
|
|
|
|
@media (max-width:960px) {
|
|
|
|
.us_tbx_ul01 li p {
|
|
display:block;
|
|
width:100%;
|
|
padding-bottom:8px;
|
|
font-size:17px;
|
|
font-weight:bold;
|
|
}
|
|
}
|
|
.us_tbx_ul02 {
|
|
margin-top:10px;
|
|
}
|
|
.us_tbx_ul02, .us_tbx_ul02 li {
|
|
display:block;
|
|
width:100%;
|
|
margin-bottom:10px;
|
|
}
|
|
.us_tbx_ul02 li {
|
|
font-size:16px;
|
|
color:#000;
|
|
text-transform:uppercase;
|
|
}
|
|
.us_tbx_ul02 li ul {margin:5px 0 5px 0px;}
|
|
.us_tbx_ul02 li ul li{margin:0px 0 2px 10px;}
|
|
.us_tbx_ul02 li ul li:before {position:absolute; margin:7px 0 0 -8px; width: 4px; height: 4px; background: #aaa; content: ''; border-radius: 50%;}
|
|
.us_tbx_ul02 li ul li a{font-size:13px; color:#666;}
|
|
.us_tbx_ul02 li ul li ul {margin:0px 0 10px 0px !important;}
|
|
.us_tbx_ul02 li ul li ul li {font-size:12px !important; margin:0px 0 0px 5px; color:#666}
|
|
.us_tbx_ul02 li ul li ul li:before {position:absolute; margin:9px 0 0 -8px; width:2px; height:2px; background: #aaa; content: ''; border-radius: 50%;}
|
|
|
|
@media (max-width:960px) {
|
|
.us_tbx_ul02 li {
|
|
font-size:13px;
|
|
}
|
|
}
|
|
|
|
.us_tbx_ul02 li a {
|
|
color:#000;
|
|
}
|
|
|
|
.us_tbx_ul02 li a:hover {
|
|
text-decoration:underline !important;
|
|
}
|
|
|
|
.us_tbx_ul03 {
|
|
margin:10px 0;
|
|
}
|
|
|
|
.us_tbx_ul03 li {
|
|
font-size:13px;
|
|
text-indent:-0.1em;
|
|
}
|
|
|
|
#utill_sitemap .pop_close {
|
|
position:absolute;
|
|
top:30px;
|
|
right:30px;
|
|
width:33px;
|
|
height:31px;
|
|
font-size:0;
|
|
text-indent:-9999px;
|
|
background:url(/img/us_close.png) no-repeat center;
|
|
border:0;
|
|
cursor:pointer;
|
|
}
|
|
|
|
#hd_ct {display:none;}
|
|
|
|
@media screen and (max-width: 770px) {
|
|
#hd_ct {
|
|
display:block;
|
|
float:right;
|
|
width:90px;
|
|
height:80px;
|
|
text-indent:-9999px;
|
|
background:url(/img/toggle.jpg) no-repeat center;
|
|
background-size:cover;
|
|
border:0;
|
|
cursor:pointer;
|
|
z-index:9999999999;
|
|
}
|
|
}
|
|
|
|
@media screen and (max-width: 480px) {
|
|
#hd_ct {
|
|
display:block;
|
|
float:right;
|
|
width:60px;
|
|
height:60px;
|
|
text-indent:-9999px;
|
|
background:url(/img/toggle.jpg) no-repeat center;
|
|
background-size:cover;
|
|
border:0;
|
|
cursor:pointer;
|
|
z-index:9999999999;
|
|
}
|
|
}
|
|
|
|
/* 모바일 카테고리 */
|
|
#category{
|
|
display:none;
|
|
position:fixed;
|
|
top:0px;
|
|
left:0;
|
|
width:100%;
|
|
height:100%;
|
|
background:#fff;
|
|
z-index:99999;
|
|
-moz-box-sizing:border-box;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
-webkit-backface-visibility: hidden;
|
|
}
|
|
|
|
@media (max-width:480px) {
|
|
body {overflow:hidden;}
|
|
#category{
|
|
top:0px;
|
|
height: calc(100% - 60px);
|
|
}
|
|
}
|
|
|
|
#category .ct_wr{
|
|
width:100%;
|
|
height:100%;
|
|
overflow-y:auto;
|
|
background:#fff;
|
|
border-top:3px solid #99a60e;
|
|
z-index:99999;
|
|
}
|
|
|
|
#category ul.cate_tab{
|
|
width:100%
|
|
}
|
|
|
|
#category ul.cate_tab:after{
|
|
display:block;
|
|
visibility:hidden;
|
|
clear:both;
|
|
content:"";
|
|
}
|
|
|
|
#category ul.cate_tab li{
|
|
float:left;
|
|
width:50%;
|
|
}
|
|
|
|
#category ul.cate_tab li button{
|
|
display:block;
|
|
width:100%;
|
|
height:60px;
|
|
line-height:60px;
|
|
color:#a8a8a8;
|
|
border-top:2px solid #f6f0e7;
|
|
background:#f6f0e7;
|
|
border:none;
|
|
color:#998972;
|
|
}
|
|
|
|
#category ul.cate_tab li button.ct_tab_sl{
|
|
font-weight:bold;
|
|
background:#fff;
|
|
color:#545454;
|
|
border-top:2px solid #be9153;
|
|
height:60px;
|
|
}
|
|
|
|
#category ul.cate{
|
|
background:#fff;
|
|
width:100%;
|
|
text-align:left;
|
|
text-indent:10px;
|
|
}
|
|
|
|
#category ul.cate > li{
|
|
line-height:60px;
|
|
border-bottom:1px solid #e9e9e9;
|
|
font-size:1.167em;
|
|
}
|
|
|
|
#category ul.cate li{
|
|
position:relative;
|
|
font-weight:bold;
|
|
}
|
|
|
|
#category ul.cate li a {
|
|
display:block;
|
|
color:#545454;
|
|
padding-right:40px;
|
|
font-weight:500;
|
|
font-size:18px;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
#category ul.cate li .ct_op{
|
|
display:inline-block;
|
|
position:absolute;
|
|
top:0;
|
|
right:0;
|
|
height:60px;
|
|
width:40px;
|
|
text-indent:-9999px;
|
|
background:url(/img/btn_op.png) no-repeat center;
|
|
border:none;
|
|
}
|
|
|
|
#category ul.cate li a:hover,#category ul.cate li a:focus{
|
|
text-decoration:underline
|
|
}
|
|
|
|
#category ul.cate li .ct_cl{
|
|
display:inline-block;
|
|
position:absolute;
|
|
top:0;
|
|
right:0;
|
|
height:60px;
|
|
width:40px;
|
|
text-indent:-999px;
|
|
background:url(/img/btn_cl.png) no-repeat center;
|
|
}
|
|
|
|
#category ul.sub_cate{
|
|
display:none;
|
|
}
|
|
|
|
#category ul.sub_cate1 li{
|
|
text-indent:20px;
|
|
background:#eee;
|
|
border-top:1px solid #d2d2d2;
|
|
font-weight:normal;
|
|
}
|
|
|
|
#category ul.sub_cate1 li a {
|
|
height:50px;
|
|
line-height:50px;
|
|
}
|
|
|
|
#category .category_logo {position:relative; height:80px; background:#fff;
|
|
}
|
|
|
|
@media (max-width:480px) {
|
|
#category .category_logo {position:relative; height:60px; background:#fff;}
|
|
}
|
|
#category .pop_close{
|
|
position:absolute;
|
|
top:0px;
|
|
right:0;
|
|
width:90px;
|
|
height:80px;
|
|
background:url(/img/toggle_close.jpg) no-repeat center;
|
|
border:0;
|
|
text-indent:-99999px;
|
|
z-index:1000;
|
|
cursor:pointer
|
|
}
|
|
|
|
@media (max-width:480px) {
|
|
#category .pop_close{
|
|
position:absolute;
|
|
top:0px;
|
|
right:0;
|
|
width:60px;
|
|
height:60px;
|
|
background:url(/img/toggle_close.jpg) no-repeat center;
|
|
background-size:cover;
|
|
border:0;
|
|
text-indent:-99999px;
|
|
z-index:1000;
|
|
cursor:pointer
|
|
}
|
|
}
|
|
.tab_btn {position:fixed;width:35%;height:100%;box-sizing:border-box;background:#f5f5f5;border-right:1px solid #d9d9d9;}
|
|
.tab_btn ul {display:block;width:100%;}
|
|
.tab_btn li {width:100%;height:auto;line-height:70px;text-align:center;font-size:18px;color:#666;letter-spacing:-0.1em;border-bottom:1px solid #d9d9d9;}
|
|
.tab_btn li a {display:block;width:100%;color:inherit;font-weight:600;background-repeat:no-repeat}
|
|
#tabs {content:"";clear:both;display:block;}
|
|
#tabs .ui-tabs-anchor {width:100%;height:100%;padding:0;}
|
|
#tabs #tabs-1, #tabs #tabs-2, #tabs #tabs-3, #tabs #tabs-4 {width:100%;}
|
|
#tabs .ui-state-active a, #tabs .ui-state-active a:link, #tabs .ui-state-active a:visited {font-weight:600;background-color:#fff;}
|
|
|
|
.tab_list {position:relative;margin-left:35%;padding:20px;font-size:13px;color:#606060;box-sizing:border-box;}
|
|
.tab_list a {color:#606060;}
|
|
.tab_list span {color:#606060;font-size:14px;}
|
|
.tab_list li {position:relative;float:left;width:284px;}
|
|
.ct_wr_ts {height:20px;font-size:15px; border-bottom:1px solid #000}
|
|
.ct_wr_lists {display:block}
|
|
.ct_wr_lists li {width:100%; line-height:40px; font-size:15px;color:#000; border-bottom:1px solid #e6e8e8; word-break:keep-all}
|
|
.ct_wr_lists li a {font-weight:bold; display:block;width:100%;height:100%;color:inherit;background:url(/img/s_navi_arrow.gif) no-repeat 99% center;}
|
|
.ct_wr_lists li a:hover {color:#000;font-weight:bold;}
|
|
.ct_wr_lists li ul li { line-height:16px; font-size:14px;color:#5b5b5b; margin: 0 0 5px 10px; border-bottom:0px solid #e6e8e8}
|
|
.ct_wr_lists li ul li:last-child { padding-bottom:10px; }
|
|
.ct_wr_lists li ul li a { font-weight:500;}
|
|
.ct_wr_lists li ul li ul li {line-height:13px; font-size:13px;color:#888; margin: 5px 0 0px 10px; border-bottom:0px solid #e6e8e8}
|
|
.ct_wr_lists li ul li ul li:last-child { padding-bottom:5px; }
|
|
|
|
|
|
/* 상단메뉴 s */
|
|
#nav {position:absolute; top:0; width:100%; line-height:90px; height:80px; font-size:25px; z-index:500;}
|
|
|
|
@media (max-width:1100px) {
|
|
#nav {display:none}
|
|
}
|
|
#nav ul.select {display:block; position:relative; width:100%; height:80px; padding-left:2%; text-align:center; white-space:nowrap;}
|
|
#nav li {display:inline-block;}
|
|
#nav .select a {display:block; height:80px; text-decoration:none; white-space:nowrap; color:#222; box-sizing:border-box;}
|
|
#nav .select a b {font-weight:600;}
|
|
#nav .select > li:first-child {margin-left:80px;}
|
|
|
|
#nav .select > li {padding:0 10px; width:12%; font-size:19px; line-height:80px; color: #006297; font-family: noto sans-serif;}
|
|
|
|
#nav .select li:hover a {color:#007eb0;}
|
|
#nav .select li:hover a b {display:block; width:100%;height:100%;cursor:pointer;font-weight:bold;}
|
|
|
|
@media (max-width: 1300px){
|
|
#nav .select > li {padding:0 15px;font-size:16px; /*수정190115*/
|
|
transition:font-size 200ms ease-out 0s;
|
|
-webkit-transition: font-size 200ms ease-out 0s;
|
|
-o-transition: font-size 200ms ease-out 0s;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 1050px){
|
|
#nav .select > li {padding:0 15px; font-size:15px;} /*수정190115*/
|
|
}
|
|
|
|
#nav .sub {
|
|
display:none;
|
|
position:absolute;
|
|
left:0; top:0px;
|
|
width:100%; height:320px;
|
|
text-align:center;
|
|
background:url('/img/head_bg.jpg') top center no-repeat #fff;
|
|
}
|
|
|
|
#nav .sub_bx {position:relative; width:1300px; height:320px; margin:0 auto; overflow:hidden;}
|
|
|
|
@media (max-width: 1300px){
|
|
#nav .sub_bx {width:100%;}
|
|
}
|
|
|
|
#nav .sub li {background:transparent;}
|
|
|
|
#nav .select li:hover .sub {
|
|
display:block;
|
|
position:absolute;
|
|
top:80px;
|
|
left:0;
|
|
width:100%;height:320px;
|
|
line-height:60px;
|
|
text-align:left;
|
|
box-shadow:0 3px 0px rgba(0,0,0,0.05);
|
|
border-top:1px solid #dbdcdc;
|
|
border-bottom:1px solid #dbdcdc;
|
|
}
|
|
|
|
|
|
|
|
#nav .select li:hover b {color:#27a6ea;}
|
|
|
|
|
|
#nav .sub_bx .sub_left {position:absolute; left:0; top:0; width:27%; height:320px; padding-top:80px; padding-left:10px;}
|
|
|
|
#nav .sub_bx .haed_left_icon1 {background:url('/img/haed_left_icon1.png') no-repeat 10px 190px;}
|
|
#nav .sub_bx .haed_left_icon2 {background:url('/img/haed_left_icon2.png') no-repeat 10px 190px;}
|
|
#nav .sub_bx .haed_left_icon3 {background:url('/img/haed_left_icon3.png') no-repeat 10px 190px;}
|
|
#nav .sub_bx .haed_left_icon4 {background:url('/img/haed_left_icon4.png') no-repeat 10px 190px;}
|
|
#nav .sub_bx .haed_left_icon5 {background:url('/img/haed_left_icon5.png') no-repeat 10px 190px;}
|
|
|
|
#nav .sub_bx .sub_left .hight_tit {font-size:35px; color:#363636; line-height:1em; letter-spacing:-1px;font-weight:400;}
|
|
#nav .sub_bx .sub_left .hight_tit span {color:#b5b5b5; font-size:14px; font-weight:600; letter-spacing:0px;}
|
|
#nav .sub_bx .sub_left .hight_txt {font-size:15px; color:#8b8b8b; line-height:1.4em; letter-spacing:-1px;}
|
|
|
|
#nav .sub_bx .sub_right{
|
|
position:absolute; right:0; top:0;
|
|
width:73%; height:319px;
|
|
vertical-align:top;
|
|
padding:25px 0 0 3%;
|
|
border-bottom:1px solid #dbdcdc;
|
|
border-right:1px solid #dbdcdc;
|
|
border-left:1px solid #dbdcdc;
|
|
background:#fff;
|
|
}
|
|
#nav .sub_bx .sub_right > ul {overflow:hidden; width:100%; }
|
|
#nav .sub_bx .sub_right > ul > li {float:left; width:33%; padding-bottom:30px;}
|
|
|
|
#nav .sub_bx .sub_right ul li h3 {padding-bottom:10px;}
|
|
#nav .sub_bx .sub_right ul li h3 a {font-size:19px !important; font-weight:400 !important;}
|
|
#nav .sub_bx .sub_right ul li h3 a:hover {font-weight:500 !important;}
|
|
|
|
#nav .sub_bx .sub_right > ul > li > ul > li {margin-bottom:5px; background:url('/img/sub/list02.png') no-repeat 0 9px; padding-left:8px}
|
|
#nav .sub_bx .sub_right > ul > li > ul > li a {color:#5c5c5c !important;}
|
|
#nav .sub_bx .sub_right > ul > li > ul > li a:hover {color:#007eb0 !important;}
|
|
|
|
#nav .sub_bx .sub_right > ul > li > ul > li > ul {margin:5px 0 10px 5px;}
|
|
#nav .sub_bx .sub_right > ul > li > ul > li > ul > li {}
|
|
#nav .sub_bx .sub_right > ul > li > ul > li > ul > li a {font-size:14px !important; color:#a2a2a2 !important;}
|
|
#nav .sub_bx .sub_right > ul > li > ul > li > ul > li a:hover {color:#5c5c5c !important;}
|
|
|
|
|
|
#nav .select li:hover .sub li {display:block;line-height:1em;}
|
|
#nav .select li:hover .sub li a {
|
|
display:block;
|
|
margin:0;
|
|
color:#000;
|
|
font-size:16px;
|
|
white-space:nowrap;
|
|
border:0;
|
|
padding:0;
|
|
height:auto;
|
|
}
|
|
#nav .select li:hover .sub li a:hover {font-weight:500; color:#007eb0}
|
|
|
|
/* 상단메뉴 e */
|
|
|
|
|
|
/* 내용 PC */
|
|
#wrapper {position:relative; margin:20px auto; width:1300px; height:auto; word-break:keep-all; overflow:hidden}
|
|
|
|
#left_menu {float:left; width:240px;}
|
|
#left_menu .lmenu_tt {width:100%; height:0; padding-bottom:50%; background:url(/img/lmenu_tt_bg.jpg) no-repeat center; }
|
|
#left_menu .lmenu_tt h2 {padding-top:17%; text-align:center; color:#fff; font-size:23px; font-weight:500;}
|
|
|
|
#container {float:right; width:1014px; }
|
|
#container h3 {margin-top:38px; font-weight:400; font-size:28px; color:#303030;
|
|
transition:font-size 450ms ease-out 0s;
|
|
-webkit-transition: font-size 450ms ease-out 0s;
|
|
-o-transition: font-size 450ms ease-out 0s;
|
|
}
|
|
#container h3 span {padding-bottom:10px; border-bottom:0px solid #ececec; }
|
|
#container .con_page {margin-top:40px; margin-bottom:10px; width:100%; min-height:500px;}
|
|
|
|
@media screen and (max-width: 1320px) {
|
|
#wrapper {width:100%; padding:0 10px; overflow:hidden}
|
|
#left_menu {float:left; width:17%;}
|
|
#container {float:right; width:80%;}
|
|
}
|
|
|
|
@media screen and (max-width: 1000px) {
|
|
#left_menu {display:none}
|
|
#container {float:none; width:100%;}
|
|
}
|
|
|
|
@media screen and (max-width: 600px) {
|
|
#container h3 {margin-top:0px; font-weight:400; font-size:22px; color:#303030; }
|
|
#container h3 span {padding-bottom:10px; border-bottom:4px solid #ececec; }
|
|
#container .con_page {margin-top:30px; width:100%; min-height:200px;}
|
|
}
|
|
|
|
/* footer PC */
|
|
footer {
|
|
transition:padding 450ms ease-out 0s;
|
|
-webkit-transition: padding 450ms ease-out 0s;
|
|
-o-transition: padding 450ms ease-out 0s;
|
|
}
|
|
footer.sft {width:100%; background:#006297; clear:both;}
|
|
footer.sft:after {content:""; clear:both; display:block; }
|
|
footer.sft > div { position:absolute; left:50%; width:1300px; margin-left:-640px; z-index:10;}
|
|
footer.sft > div {position:relative;}
|
|
|
|
.ft_menu {text-align:center; height:70px; padding:10px 0 0 10px; border-bottom:0px solid #616161; margin-bottom:20px;}
|
|
.ft_menu h1.ft_logo {float:left; height:39px; margin-top:5px; }
|
|
.ft_menu ul {float:right; padding-top:18px}
|
|
.ft_menu ul li {float:left; line-height:0.75em; border-right:0px solid #727272; padding:0 10px}
|
|
.ft_menu ul li:last-child {border-right:0px solid #727272; padding:0 10px}
|
|
.ft_menu ul li a {color:#d9eaf3; font-size:13px; font-weight:500}
|
|
.ft_menu ul li a:hover {color:#fff; font-weight:bold}
|
|
|
|
address {
|
|
float:left;
|
|
width:750px;
|
|
height:80px;
|
|
padding:0px 0 0 0px;
|
|
font-style:normal;
|
|
font-size:13px;
|
|
color:#d9eaf3;
|
|
font-weight:400;
|
|
line-height:1.4em;
|
|
letter-spacing:-0.05em;
|
|
}
|
|
address span {display:inline-block;padding:0 10px;line-height:1em; border-right:0px solid #474647;}
|
|
address span:nth-child(4) {border-right:0;}
|
|
address span:nth-child(7) {border-right:0;}
|
|
address .copy {padding-left:10px}
|
|
|
|
.ft_right {float:right; width:80px; margin:-10px 10px 0 0}
|
|
.gototop {display:inline-block; width:80px; height:80px;
|
|
transition:width 200ms ease-out 0s;
|
|
-webkit-transition: width 200ms ease-out 0s;
|
|
-o-transition: width 200ms ease-out 0s;}
|
|
.privacy {display:none;}
|
|
|
|
/* footer 1300px */
|
|
@media (max-width: 1300px) {
|
|
footer {}
|
|
footer.sft {width:100%; background:#323232; clear:both;}
|
|
footer.sft:after {content:""; clear:both; display:block; }
|
|
footer.sft > div { position:absolute; left:50%; width:100%; margin-left:-50%; z-index:10;}
|
|
footer.sft > div {position:relative;}
|
|
}
|
|
|
|
/* footer 950px */
|
|
@media (max-width: 950px) {
|
|
footer.sft {width:100%; background:#323232; clear:both; padding-bottom:25px}
|
|
.ft_menu ul {display:none}
|
|
.ft_menu h1.ft_logo img {height:80%;}
|
|
.privacy {display:block;}
|
|
.privacy select {
|
|
float:right; width:200px; height:35px; line-height:35px; margin:7px 10px 0 0; padding:0 10px; border:1px solid #5e5e5e; color:#fff;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
appearance: none;
|
|
background: url('/img/select-arrow.png') no-repeat 95% 50% #3a3a3a; /* 화살표 아이콘 추가 */
|
|
}
|
|
.privacy select::-ms-expand {display: none;}
|
|
address {width:auto;}
|
|
address span {display:block;padding:0 10px;line-height:20px; border-right:0px solid #474647;}
|
|
}
|
|
|
|
/* footer 540px */
|
|
@media (max-width:540px) {
|
|
.ft_right {float:none; width:20%;}
|
|
.gototop {position:absolute; width:50px; height:50px; top:-86px; right:5px}
|
|
.gototop img {width:100%}
|
|
h1.ft_logo {display:none}
|
|
address {
|
|
float:none;
|
|
width:100%;
|
|
height:auto;
|
|
padding:0px 10px 0px 10px;
|
|
font-style:normal;
|
|
font-size:12px;
|
|
color:#a8a8a8;
|
|
font-weight:500;
|
|
line-height:1.5em;
|
|
letter-spacing:-0.05em;
|
|
}
|
|
address span {display:block;padding:0 0 5px 0;line-height:1em; border-right:0px solid #474647;}
|
|
address .copy {padding-left:0px; line-height:1.3em;}
|
|
.privacy select {float:left; }
|
|
}
|
|
|
|
/* sub */
|
|
.s_visual{position:relative; width:100%; height:165px;
|
|
transition:height 200ms ease-out 0s;
|
|
-webkit-transition: font-size 200ms ease-out 0s;
|
|
-o-transition: font-size 200ms ease-out 0s;}
|
|
.s_visual_img01 {background:url(/img/s_visual01.jpg) no-repeat bottom; background-size:cover;}
|
|
.s_visual_img02 {background:url(/img/s_visual02.jpg) no-repeat bottom; background-size:cover;}
|
|
.s_visual_img03 {background:url(/img/s_visual03.jpg) no-repeat bottom; background-size:cover;}
|
|
.s_visual_img04 {background:url(/img/s_visual04.jpg) no-repeat bottom; background-size:cover;}
|
|
.s_visual_img05 {background:url(/img/s_visual05.jpg) no-repeat bottom; background-size:cover;}
|
|
.s_visual_img06 {background:url(/img/s_visual06.jpg) no-repeat bottom; background-size:cover;}
|
|
|
|
.textbar {position:relative; top:0px; width:100%; height:210px; text-align:center; color:#fff; z-index:10;}
|
|
.textbar .s_tit {padding-top:72px; width:100%; font-size:33px; font-weight:400; line-height:1em; text-shadow:0px 5px 5px rgba(0,0,0,0.39); letter-spacing:-1px;}
|
|
.textbar .s_text {height:40px; font-size:14px; line-height:40px; text-shadow:0px 5px 5px rgba(0,0,0,0.39); letter-spacing:-1px;}
|
|
|
|
|
|
.sub_navi_wrap {display:none; position:absolute; top:165px; line-height:55px; left:50%; margin-left:-650px;border-bottom:1px solid #e0e0e0; background:#fff;z-index:99;
|
|
transition:top 200ms ease-out 0s;
|
|
-webkit-transition: font-size 200ms ease-out 0s;
|
|
-o-transition: font-size 200ms ease-out 0s;}
|
|
|
|
|
|
.sub_navi_wrap .sub_menu {float:left}
|
|
.sub_navi_wrap .sub_menu img {float:left}
|
|
|
|
.sub_navi_wrap .sub_navi {float:right; font-size:13px; }
|
|
.sub_navi_wrap .sub_navi ul {padding-right:20px}
|
|
.sub_navi_wrap .sub_navi ul li {display:inline-block; color:#a9a9a9}
|
|
.sub_navi_wrap .sub_navi ul li span {color:#838383}
|
|
.sub_navi_wrap .sub_navi .home {padding-left:23px; background:url(/img/s_navi_home.png) no-repeat 0 18px}
|
|
|
|
@media screen and (max-width: 1300px) {
|
|
.s_visual{position:relative; width:100%; height:210px;}
|
|
.sub_navi_wrap {position:absolute; top:155px; width:100%; height:55px; line-height:55px; left:0; margin-left:0px; border-bottom:1px solid #e0e0e0; background:#fff;z-index:99;}
|
|
}
|
|
|
|
@media screen and (max-width: 960px) {
|
|
.s_visual{position:relative; width:100%; height:150px;}
|
|
.sub_navi_wrap {position:absolute; top:105px; width:100%; height:45px; line-height:45px; left:0%; margin-left:0px;border-bottom:1px solid #e0e0e0; background:#fff;z-index:99;}
|
|
.sub_navi_wrap .sub_menu {display:none}
|
|
.sub_navi_wrap .sub_navi {float:none; margin-left:10px; font-size:13px}
|
|
.sub_navi_wrap .sub_navi ul {padding-right:0px}
|
|
.sub_navi_wrap .sub_navi ul li {display:inline-block; color:#a9a9a9; }
|
|
.sub_navi_wrap .sub_navi ul li span {color:#838383}
|
|
.sub_navi_wrap .sub_navi .home {padding-left:23px; background:url(/img/s_navi_home.png) no-repeat 0 13px}
|
|
}
|
|
|
|
@media screen and (max-width: 480px) {
|
|
.sub_navi_wrap .sub_navi {float:none; margin-left:5px; font-size:11px}
|
|
}
|
|
|
|
|
|
/* 서브네비s */
|
|
.menu_navi_wrap{
|
|
float:left;
|
|
position:relative;
|
|
color:#000000;
|
|
height:55px;
|
|
}
|
|
.menu_navi_wrap a:hover{
|
|
background-color:#f6f6f6; color:#007eb0;
|
|
}
|
|
.menu_navi_wrap a {
|
|
position:relative;
|
|
text-decoration: none;
|
|
display:block;
|
|
color:#616161;
|
|
outline:none;
|
|
padding:0 20px;
|
|
font-size:15px;
|
|
font-family: noto sans-serif;
|
|
font-weight:bold;
|
|
text-align:center;
|
|
}
|
|
.menu_navi_wrap > ul{
|
|
list-style: none;
|
|
margin:0;
|
|
padding:0 0 0 0px;
|
|
height:55px;
|
|
line-height:53px;
|
|
}
|
|
.menu_navi_wrap > ul > li{
|
|
padding:0;
|
|
float:left;
|
|
border-right:1px solid #ddd;
|
|
width:220px;
|
|
}
|
|
|
|
.menu_navi_wrap ul li ul{
|
|
position: absolute;
|
|
border: 1px solid #d0d0d0;
|
|
box-shadow: 0 0px 5px rgba(0,0,0,0.2);
|
|
margin-top: -1px;
|
|
display:none;
|
|
padding: 0px 0px 0px 0;
|
|
}
|
|
.menu_navi_wrap ul li > ul > li{
|
|
padding:0;
|
|
float:none;
|
|
margin: 0 0 0 0px;
|
|
width:100%;
|
|
height:35px;
|
|
line-height:35px;
|
|
width:218px;
|
|
border-top: 1px solid #ddd;
|
|
background:#f6f6f6;
|
|
}
|
|
.menu_navi_wrap .active ul{
|
|
display:block !important;
|
|
background-color: white;
|
|
}
|
|
.menu_navi_wrap .active > a{
|
|
background-color: white;
|
|
/*border: 1px solid #dedede;*/
|
|
box-shadow: 0 -1px 5px rgba(0,0,0,0.2);
|
|
border-bottom: 0;
|
|
display: block;
|
|
height: 55px;
|
|
padding: 0 20px;
|
|
position:relative;
|
|
z-index: 1;
|
|
text-decoration: none;
|
|
display:block;
|
|
}
|
|
.menu_navi_wrap .active a:hover{
|
|
background-color:white;
|
|
}
|
|
.menu_navi_wrap .active ul a:hover{
|
|
background-color:#0f9dde;
|
|
color:#fff; font-weight:600;
|
|
}
|
|
|
|
.menu_navi_wrap .active ul a{
|
|
border: 0 !important;
|
|
border:0;
|
|
font-size:14px;
|
|
}
|
|
.menu_navi_wrap .arrow {
|
|
position:absolute;
|
|
right:15px; top:27px; width:7px; height:7px;
|
|
border-color: #007eb0 transparent transparent;
|
|
border-style: solid dashed dashed;
|
|
}
|
|
|
|
@media (max-width: 1100px) {
|
|
.menu_navi_wrap > ul > li {width:180px;}
|
|
.menu_navi_wrap a, .menu_navi_wrap .active > a {font-size:13px; padding:0 10px}
|
|
.menu_navi_wrap ul li > ul > li {width:178px}
|
|
}
|
|
|
|
/* 서브네비e */
|
|
|
|
|
|
/*통합검색*/
|
|
.search_all_list {width:100%; padding:20px; text-align:center; color:#333; font-size:16px; font-weight:600; margin-bottom:40px; word-break:keep-all}
|
|
span.search_text {color:#9aa60f; }
|
|
.search_all_wrap {margin-bottom:40px; word-break:keep-all}
|
|
.search_all_tt_box {position:relative; width:100%; border-bottom:1px solid #9aa60f}
|
|
.search_all_title {margin:0 0 10px 10px; color:#9aa60f; font-size:18px; font-weight:700;}
|
|
.search_all_more {position:absolute; bottom:7px; right:0; border-radius:100px;}
|
|
.search_all_more a {display:block; color:#fff; font-size:13px; padding:3px 15px 5px !important; font-weight:400}
|
|
|
|
.search_thumnail_wr {width:100%; overflow:hidden}
|
|
.search_thumnail_img {float:left; width:22%; border:1px solid #ddd; margin-top:20px;
|
|
transition:width 200ms ease-out 0s;
|
|
-webkit-transition: width 200ms ease-out 0s;
|
|
-o-transition: width 200ms ease-out 0s;}
|
|
.search_thumnail_img img{width:100%; height:124px;}
|
|
.search_thumnail_right {float:left; width:78%;}
|
|
.search_all_board {position:relative; width:100%; padding:20px; }
|
|
.search_all_board .tt {background:url('/img/list01.png') no-repeat 0 10px; padding-left:10px; color:#333; font-size:16px; font-weight:600;}
|
|
.search_all_board .content {color:#676767; margin:5px 0 5px 10px}
|
|
.search_all_board .navi {color:#999;margin-left:10px; font-size:14px}
|
|
.search_all_board .date {color:#666; margin:5px 0 0 10px; font-size:14px}
|
|
.search_all_board .no {color:#a1a1a1; font-size:16px}
|
|
|
|
.all_search {width:100%; margin:20px 0; padding:20px 10px; text-align:center; overflow:hidden;}
|
|
.all_search input {vertical-align:0px; height: 37px; padding:7px; color:#8c8c8c; border-bottom:1px solid #525252; border-right:0; border-left:0; border-top:0;}
|
|
.all_search button {width: 20px; border: 0; background: none;cursor: pointer; font-size:18px; color:#000}
|
|
.all_search .check {padding-left:-30%; font-size:14px; color:#8c8c8c}
|
|
.all_search .check input {vertical-align:-14px; }
|
|
.all_search .search_box {margin-bottom:5px; width:40%;
|
|
}
|
|
|
|
@media (max-width: 480px) {
|
|
.all_search .search_box {margin-bottom:5px; width:70%; }
|
|
.search_thumnail_img {float:none; width:100%; border:1px solid #ddd; margin-top:20px}
|
|
.search_thumnail_img img{width:100%; height:124px;}
|
|
.search_thumnail_right {float:none; width:100%;}
|
|
}
|
|
|
|
|
|
/* lightbox */
|
|
.lightbox { display: none; }
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* login */
|
|
|
|
|
|
.login_area { width: 598px; margin: 125px auto; margin-top: 227px;}
|
|
/* .login_form { margin-top: 0px; padding: 8px 70px 35px 70px; } */
|
|
|
|
.login_form { margin-top: 15px; padding: 90px 70px 60px 70px; border: 1px solid #d7d7d7; background-color: #fbfcfd; }
|
|
|
|
.login_id, .login_pw { width: 458px; height: 48px; border: 1px solid #dadada; font-size: 15px; text-indent: 25px; color: #999999; }
|
|
.login_pw { margin-top: 10px; }
|
|
.btn_login { display: block; width:100%; height: 51px; margin-top: 28px; font-size: 20px; font-weight: bold; color: #ffffff !important; text-align: center; text-decoration: none; line-height: 50px; background-color: #0c6fb7; }
|
|
|
|
.login_txt {margin-top: 15px; text-align: center; font-size: 0.89em; color: #4d4d4d;}
|
|
|
|
|
|
|
|
|
|
|
|
.dong {height: 174px;
|
|
width: 1030px;
|
|
padding: 21px 18px 0 25px;
|
|
overflow: auto;}
|
|
|
|
|
|
|
|
|
|
|
|
/*--------------------------------------------- member --------------------------------------- */
|
|
|
|
.member_title {margin-top: 232px; font-size:22px; padding-bottom:22px; font-weight:bold; text-align:center;}
|
|
.member_title2 {margin-top: 0px; font-size:22px; padding-bottom:0px; font-weight:bold; text-align:center;}
|
|
|
|
.title_area {width:1200px; text-align: center; overflow: hidden; margin-bottom: 30px; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif;}
|
|
|
|
|
|
.mem_title {font-size:27px; padding-bottom:22px; font-weight:bold; text-align:center; margin-top:224px;}
|
|
|
|
fieldset {border-top:0px solid #ddd; border-right:0px solid #ddd; border-left:0px solid #ddd; border-bottom:0px solid #ddd; margin-bottom: 18px}
|
|
|
|
|
|
/* table list */
|
|
table.list {width: 100%; border-top: 2px solid #5db4dc; border-bottom: 1px solid #b6b6b6; font-family: '돋움', Dotum, Helvetica, 'Apple SD Gothic Neo', Sans-serif;}
|
|
table.list.fixed {table-layout: fixed;}
|
|
table.list thead th {padding: 10px 0px; border-left: 1px solid #dddddd; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕'; font-size: 13px; font-weight: bold; color: #4d4d4d; text-align: center; vertical-align: middle; background: url("../images/common/bg_table_thline.png") repeat-x 0 bottom #f9f9f9;}
|
|
table.list thead th:first-child {border-left: 0;}
|
|
table.list thead th.borderl {border-left: 1px solid #dddddd;}
|
|
table.list thead th.alignl {padding-left: 10px; text-align: left;}
|
|
table.list thead th.alignr {text-align: right;}
|
|
table.list tbody th {border-top: 1px solid #dddddd; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕'; font-size: 13px; font-weight: bold; color: #4d4d4d; text-align: center; background-color: #fcfcfc;}
|
|
table.list tbody th.borderl {border-left: 1px solid #dddddd;}
|
|
table.list tbody td {padding: 8px 5px; border-top: 1px solid #dddddd; border-bottom: 0; border-left: 1px solid #dddddd; border-right: 0; font-size: 12px; color: #626262; text-align: center; line-height: 1.4em; vertical-align: middle;}
|
|
table.list tbody td:first-child {border-left: 0;}
|
|
table.list tbody td.bg {background-color: #f5fbfc;}
|
|
table.list tbody th.alignl,
|
|
table.list tbody td.alignl {padding-left: 10px; text-align: left;}
|
|
table.list tbody th.alignr,
|
|
table.list tbody td.alignr {text-align: right;}
|
|
table.list tbody td.subject {table-layout: fixed; overflow: hidden; color: #333333; text-align: left; text-overflow: ellipsis; white-space: nowrap;}
|
|
table.list tbody td a {color: #626262; text-decoration: none;}
|
|
table.list tbody td a:hover {text-decoration: underline;}
|
|
table.list tbody tr td.bg_gray {background-color: #f7f7f7;}
|
|
table.list tbody tr.inactive td {text-decoration: line-through; color: #858585; background-color: #ececec;}
|
|
table.list tbody tr td.nopadding {padding: 0px;}
|
|
table.list tbody tr.bg td {background-color: #f7f7f7;}
|
|
table.list tbody tr td.borderl {border-left: 1px solid #dddddd;}
|
|
table.list tbody tr td.nobordert {border-top: 0;}
|
|
table.list tbody tr td.noborderb {border-bottom: 0;}
|
|
table.list tbody tr td img {display: inline; display: inline-block; vertical-align: middle;}
|
|
table.list tbody tr td.secret img {margin-right: 5px;}
|
|
table.list tfoot th {padding: 8px 0px; border-top: 1px solid #b2b2b2; font-size: 1.05em; color: #333333; font-size: 13px; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕';}
|
|
table.list tfoot td {padding: 8px 5px; border-top: 1px solid #b2b2b2; border-left: 1px solid #dddddd; font-size: 13px; font-weight: bold; color: #333333; text-align: center; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕';}
|
|
|
|
table.list thead th.bg_group {background-color: #effaff;}
|
|
table.list tbody tr td.bg_group {background-color: #effaff;}
|
|
table.list tbody td.reply {padding-left: 44px; background: url("../images/icon/icon_reply.png") no-repeat 12px 10px;}
|
|
table.list tbody tr.disabled td {background-color: #cdcdcd;}
|
|
|
|
|
|
|
|
td.icon_img_align img {margin: 0 0 0 -2px; padding: 0;}
|
|
|
|
|
|
|
|
/* table write */
|
|
table.write {margin-top: 45px; width: 100%; border-top: 2px solid #5db4dc; border-bottom: 1px solid #dddddd; border-left: 0; border-right: 0; font-family: '돋움', Dotum, Helvetica, 'Apple SD Gothic Neo', Sans-serif;}
|
|
|
|
table.write tbody th {font-size:15px !important; font-weight:500 !important;}
|
|
|
|
table.write tbody th,
|
|
table.write tbody td {padding: 8px 10px; border-bottom: 1px solid #dddddd; text-align: left; vertical-align: top;}
|
|
table.write tbody th {padding-right: 12px; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕'; font-size: 13px; font-weight: bold; color: #4d4d4d; text-align: right; line-height: 1.8em; background-color: #f9f9f9;}
|
|
table.write tbody th.alignc,
|
|
table.write tbody td.alignc {text-align: center;}
|
|
table.write tbody td {font-size: 12px; color: #626262; line-height: 2.6em;}
|
|
table.write tbody td input {display: inline-block; height: 26px;}
|
|
table.write tbody td select {display: inline-block; height: 22px;}
|
|
table.write tbody td.borderl {border-left: 1px solid #dddddd;}
|
|
table.write tbody a {color: #626262; text-decoration: none;}
|
|
table.write tbody td img {display: inline-block; margin-left: 1px; margin-right: 1px; vertical-align: middle;}
|
|
table.write tbody td.editor {padding: 4px 0;}
|
|
table.write tbody td .point_txt {display: inline-block; margin-top: 5px; color: #ff0000;}
|
|
table.write tbody tr th.middle {vertical-align: middle;}
|
|
table.write tbody tr td.bg {vertical-align: middle; background-color: #fafafa;}
|
|
table.write tbody tr td ul.tbl_list_type li:first-child {margin-top: 0;}
|
|
table.write tbody tr td ul.tbl_list_type li {margin-top: 5px; vertical-align: middle; list-style: none;}
|
|
|
|
table.modify {width: 100%; border: 0; border-top: 2px solid #5db4dc; border-bottom: 1px solid #dddddd; table-layout: fixed; font-family: '돋움', Dotum, Helvetica, 'Apple SD Gothic Neo', Sans-serif;}
|
|
table.modify tbody th {min-height: 24px; padding: 10px 10px 10px 26px; border: 0; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕'; font-size: 13px; font-weight: bold; color: #4d4d4d; text-align: left; line-height: 1.5em; color: #444444; vertical-align: top; background: url('../images/common/bullet_title_04.png') no-repeat 15px 18px;}
|
|
table.modify tbody td {min-height: 24px; padding: 10px 10px; border: 0; font-size: 12px; color: #626262; line-height: 1.5em; text-align: left; vertical-align: middle;}
|
|
table.modify tbody th span.title {padding-left: 10px; vertical-align: middle; background: url('../images/common/bullet_03.png') no-repeat 0px 4px;}
|
|
table.modify tbody th.alignl {text-align: left;}
|
|
table.modify tbody td.alignc {text-align: center;}
|
|
table.modify tbody td.alignr {text-align: right;}
|
|
table.modify tbody a:hover {text-decoration: underline;}
|
|
table.modify tbody a.btn:hover {text-decoration: none;}
|
|
table.modify tbody td input {display: inline-block; height: 22px;}
|
|
table.modify tbody td select {display: inline-block; height: 24px;}
|
|
table.modify tbody td img {display: inline-block; margin-left: 1px; margin-right: 1px; vertical-align: middle;}
|
|
table.modify tbody td label {display: inline-block; display: inline; vertical-align: middle;}
|
|
table.modify tbody td.editor {padding: 10px 0 4px;}
|
|
|
|
|
|
|
|
/* table view */
|
|
table.view {width: 100%; border-top: 2px solid #5db4dc; border-bottom: 1px solid #dddddd; border-left: 0; border-right: 0; font-family: '돋움', Dotum, Helvetica, 'Apple SD Gothic Neo', Sans-serif;}
|
|
table.view tbody th,
|
|
table.view tbody td {padding: 8px 10px; border-bottom: 1px solid #dddddd; text-align: left; vertical-align: top;}
|
|
table.view tbody th {padding-right: 12px; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕'; font-size: 13px; font-weight: bold; color: #4d4d4d; text-align: center; line-height: 1.5em; background-color: #f9f9f9;}
|
|
table.view tbody td.alignc {text-align: center;}
|
|
table.view tbody td {font-size: 12px; color: #626262; line-height: 1.5em;}
|
|
table.view tbody td.borderl {border-left: 1px solid #dddddd;}
|
|
table.view tbody td input {display: inline-block; height: 20px;}
|
|
table.view tbody a {color: #626262; text-decoration: none;}
|
|
table.view tbody td img {display: inline-block; margin-left: 1px; margin-right: 1px; vertical-align: middle;}
|
|
table.view tbody td.editor {padding: 15px 15px 50px;}
|
|
|
|
|
|
|
|
|
|
/* paging */
|
|
.paging_area {overflow: hidden; width: 100%; height: 25px; margin: 15px 0; padding: 0; font-size: 0.88em; font-weight: bold; text-align: center;}
|
|
.paging_area strong {display: inline-block; height: 21px; padding: 0 8px 1px; border: 1px solid #dadada; font-weight: bold; color: #333333; line-height: 24px; background-color: #ffffff;}
|
|
.paging_area a {display: inline-block; height: 24px; padding: 0 8px 0; line-height: 24px; color: #333333;}
|
|
.paging_area a:hover {text-decoration: underline;}
|
|
.paging_area a.stimg {display: inline-block; padding: 0; border: 0; text-decoration: none;}
|
|
.paging_area a.stimg + a.stimg {margin-left: -4px;}
|
|
.paging_area a.stimg img {height: 24px; margin-top: -3px; border: 0; text-decoration: none;}
|
|
.paging_area a.stimg:hover {display: inline-block; height: 24px; margin-top: -3px; padding: 0; border: 0; text-decoration: none;}
|
|
|
|
|
|
|
|
/* table search_box */
|
|
.search_area {width: 1050px; margin: 0 auto; overflow: hidden; margin-bottom: 40px; padding: 15px 22px; border: 1px solid #dfdede; background-color: #f7f7f7;}
|
|
table.search_box {width: 100%; border: 0; table-layout: fixed; color: #4d4d4d;}
|
|
table.search_box tbody th {padding: 10px 0 0 10px; border: 0; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-size: 13px; font-weight: bold; text-align: left; vertical-align: top; background: url('../images/common/bullet_search.png') no-repeat 0 16px;}
|
|
table.search_box tbody td {height: 24px; padding: 6px 10px; text-align: left; border: 0; font-family: '돋움', Dotum, Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-size: 12px;}
|
|
table.search_box tbody td a:hover img {text-decoration: none;}
|
|
table.search_box tbody td input {display: inline-block; display: inline; vertical-align: middle;}
|
|
table.search_box tbody td input[type=text] {height: 22px; border: 1px solid #8a8a8a; background-color: #ffffff;}
|
|
table.search_box tbody td input {border: expression((this.type=='text')?'0px':''); height: 22px; font-size: 100%; text-indent: 1px; line-height: 21px; text-align: left;}
|
|
table.search_box tbody td select {height: 24px; border: 1px solid #8a8a8a;}
|
|
table.search_box tbody td.btn_align {padding: 0 0 5px 0; vertical-align: bottom;}
|
|
table.search_box tbody th.alignc,
|
|
table.search_box tbody td.alignc {text-align: center;}
|
|
table.search_box tbody th.alignr,
|
|
table.search_box tbody td.alignr {text-align: right;}
|
|
|
|
|
|
|
|
/* etc */
|
|
.table_toplineb {border-top: 1px solid #0262ac;}
|
|
table td input.bg_gray {background-color: #f7f7f7;}
|
|
|
|
ul.file_list {overflow: hidden; padding: 10px 15px; border: 1px solid #cacaca;}
|
|
ul.file_list li {padding-left: 10px; margin-top: 8px; line-height: 1.5em; list-style: none; background: url('../images/common/bullet_file_list.png') no-repeat 0 7px;}
|
|
ul.file_list li:first-child {margin-top: 0;}
|
|
ul.file_list li a:hover {text-decoration: underline;}
|
|
ul.file_list li a img {margin-top: -2px;}
|
|
|
|
ul.list {overflow: hidden; padding: 10px 15px;}
|
|
ul.list li {padding-left: 10px; margin-top: 8px; line-height: 1.5em; list-style: none; background: url('../images/common/bullet_file_list.png') no-repeat 0 9px;}
|
|
ul.list li:first-child {margin-top: 0;}
|
|
ul.list li a:hover {text-decoration: underline;}
|
|
ul.list li label span.title {display: inline; display: inline-block; width: 100px;}
|
|
|
|
ul.inner_tbl {overflow: hidden; margin-top: 5px; border: 1px solid #e1e1e1;}
|
|
ul.inner_tbl li {list-style: none;}
|
|
ul.inner_tbl li + li {border-top: 1px solid #e1e1e1;}
|
|
ul.inner_tbl li strong {float: left; display: block; width: 120px; height: 35px; border-right: 1px solid #e1e1e1; text-align: center; line-height: 35px; background-color: #fafafa;}
|
|
ul.inner_tbl li input {margin: 7px 0 7px 10px;}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.in_wp20 {width: 20px; border: 1px solid #969696;}
|
|
|
|
|
|
|
|
|
|
|
|
/* button area */
|
|
.btn {display: inline-block; vertical-align: bottom;}
|
|
.btn img {border: 0; vertical-align: middle;}
|
|
.btn:hover {text-decoration: none;}
|
|
|
|
|
|
.btn.homepage,
|
|
.btn.logout {font-family: '돋움', Dotum, Helvetica, 'Apple SD Gothic Neo', Sans-serif;}
|
|
|
|
.btn.homepage {height: 22px; padding: 0 7px; border: 1px solid #686868; font-size: 11px; color: #ffffff; line-height: 24px; background-color: #565656;}
|
|
.btn.logout {height: 22px; padding: 0 7px; border: 1px solid #686868; font-size: 11px; color: #ffffff; line-height: 24px; background-color: #3a3a3a;}
|
|
|
|
.btn.done {
|
|
height: 20px; padding: 2px 6px 0; border: 1px solid #b4b4b4; font-size: 12px; line-height: 20px; color: #333333; text-align: center; letter-spacing: -0.06em;
|
|
border-radius: 3px;
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
background-color: #f2f2f2;
|
|
}
|
|
|
|
|
|
/*
|
|
* 조건부 검색 시 쓰는 버튼
|
|
* 상위메뉴 등 기본적인 버튼 : basic
|
|
* 미리보기 : basic look
|
|
*/
|
|
button.btn.basic {height: 36px;}
|
|
a.btn.basic {height: 34px;}
|
|
.btn.basic {padding: 0 22px; border: 1px solid #bfbfbf; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-weight: bold; font-size: 13px; line-height: 35px; color: #515151; text-align: center; letter-spacing: -0.04em; background-color: #fafafa;}
|
|
.btn.basic span {display: block; text-align: left;}
|
|
.btn.basic span.look {padding-right: 22px; background: url('../images/icon/icon_link.png') no-repeat right 11px;}
|
|
|
|
|
|
/*
|
|
* 조건부 검색 시 쓰는 버튼
|
|
* 검색 : sch
|
|
* 전체보기 : clear
|
|
*/
|
|
.search_area .btn.sch,
|
|
.search_area .btn.clear {width: 71px; height: 27px; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-size: 13px; font-weight: bold; text-align: center; line-height: 27px; color: #ffffff;}
|
|
.search_area .btn.sch {background-color: #0060af;}
|
|
.search_area .btn.clear {background-color: #686868;}
|
|
|
|
|
|
/*
|
|
* 문자발송, 메일발송 버튼 : sns
|
|
*
|
|
*/
|
|
.btn.sns {width: 134px; height: 34px; border: 1px solid #bfbfbf; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-size: 13px; font-weight: bold; color: #515151; text-align: center; line-height: 35px; background-color: #e8e8e8;}
|
|
.btn.sns span {display: block; text-align: left;}
|
|
.btn.sns span.icon_sms {padding-left: 53px; background: url('../images/icon/icon_sms.png') no-repeat 31px 11px;}
|
|
.btn.sns span.icon_mail {padding-left: 56px; background: url('../images/icon/icon_mail.png') no-repeat 29px 12px;}
|
|
button.btn.upper {height: 27px;}
|
|
a.btn.upper {height: 25px;}
|
|
.btn.upper {
|
|
padding: 0 15px; border: 1px solid #bababa; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-size: 13px; color: #606060;
|
|
background: #f5f5f5;
|
|
background: -moz-linear-gradient(top, #ffffff 0%, #f5f5f5 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, #ffffff 0%, #f5f5f5 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, #ffffff 0%, #f5f5f5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f5f5f5', GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
|
|
/*
|
|
* table 검색 버튼 : schtable
|
|
* active한 버튼 : acti
|
|
* 노멀한 버튼 : none
|
|
*/
|
|
button.btn.schtable,
|
|
button.btn.acti,
|
|
button.btn.none {height: 25px;}
|
|
a.btn.schtable,
|
|
a.btn.acti,
|
|
a.btn.none {height: 23px;}
|
|
.btn.schtable {
|
|
padding: 0 17px; border: 1px solid #3793c8; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-size: 13px; font-weight: bold; text-align: center; color: #4d4d4d; line-height: 24px;
|
|
border-radius: 3px;
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
}
|
|
.btn.acti {
|
|
padding: 0 14px; border: 1px solid #0074b5; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-size: 12px; font-weight: bold; text-align: center; color: #ffffff; line-height: 24px;
|
|
border-radius: 3px;
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
background-color: #0074b5;
|
|
}
|
|
.btn.none {
|
|
padding: 0 14px; border: 1px solid #939292; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-size: 12px; font-weight: bold; text-align: center; color: #4d4d4d; line-height: 24px;
|
|
border-radius: 3px;
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
background-color: #fefefe;
|
|
}
|
|
|
|
|
|
/*
|
|
* table안에 있는 버튼
|
|
* 보기 : look
|
|
* active한 버튼 : active
|
|
* 노멀한 버튼 : nomal
|
|
* 순서 변경 버튼 : list_up / list_down
|
|
*/
|
|
button.btn.look,
|
|
button.btn.active,
|
|
button.btn.nomal {height: 22px;}
|
|
a.btn.look,
|
|
a.btn.active,
|
|
a.btn.nomal {height: 20px;}
|
|
a.btn.look:hover,
|
|
a.btn.active:hover,
|
|
a.btn.nomal:hover {text-decoration: none;}
|
|
.btn.look {
|
|
padding: 0 10px; border: 1px solid #bababa; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-size: 12px; color: #515151; line-height: 20px;
|
|
border-radius: 2px;
|
|
-webkit-border-radius: 2px;
|
|
-moz-border-radius: 2px;
|
|
background: #f5f5f5;
|
|
background: -moz-linear-gradient(top, #ffffff 0%, #f5f5f5 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, #ffffff 0%, #f5f5f5 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, #ffffff 0%, #f5f5f5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f5f5f5', GradientType=0 ); /* IE6-9 */
|
|
}
|
|
.btn.active {
|
|
padding: 0 10px; border: 1px solid #3793c8; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-size: 12px; color: #515151; line-height: 20px;
|
|
border-radius: 2px;
|
|
-webkit-border-radius: 2px;
|
|
-moz-border-radius: 2px;
|
|
}
|
|
.btn.active.searchs {padding-left: 24px; background: url('../images/icon/icon_searchs.png') no-repeat 10px 5px;}
|
|
.btn.nomal {
|
|
padding: 0 10px; border: 1px solid #b1b1b1; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-size: 12px; color: #515151; line-height: 20px;
|
|
border-radius: 2px;
|
|
-webkit-border-radius: 2px;
|
|
-moz-border-radius: 2px;
|
|
}
|
|
.btn.list_up,
|
|
.btn.list_down { padding: 5px 8px; border: 1px solid #d2d2d2;
|
|
border-radius: 2px;
|
|
-webkit-border-radius: 2px;
|
|
-moz-border-radius: 2px;
|
|
}
|
|
|
|
|
|
/*
|
|
* 목록 : list
|
|
* 저장, 수정, 등록, 추가 : save
|
|
* 취소, 삭제 : cancel
|
|
*/
|
|
button.btn.list,
|
|
button.btn.save,
|
|
button.btn.cancel {width: 104px; height: 36px; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-size: 13px; font-weight: bold;}
|
|
a.btn.list,
|
|
a.btn.save,
|
|
a.btn.cancel {width: 104px; height: 34px; font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-size: 13px; font-weight: bold; line-height: 16px;}
|
|
.btn.list {border: 1px solid #7a7979; color: #515151; text-align: center; background-color: #fafafa;}
|
|
.btn.save {border: 1px solid #006daa; color: #ffffff; text-align: center; background-color: #0074b5;}
|
|
.btn.cancel {border: 1px solid #7a7979; color: #ffffff; text-align: center; background-color: #939292;}
|
|
|
|
|
|
|
|
|
|
|
|
/* area */
|
|
.division {overflow: hidden;}
|
|
.division20 {overflow: hidden; margin-bottom: 20px;}
|
|
.division40 {overflow: hidden; margin-bottom: 40px;}
|
|
.division50 {overflow: hidden; margin-bottom: 50px;}
|
|
.table_area {overflow: hidden; margin-bottom: 20px; width:1050px; margin:0 auto;}
|
|
.button_area {overflow: hidden; margin-bottom: 34px; margin: 0 auto; text-align: center; padding-bottom: 76px; padding-top: 34px;}
|
|
select.handling_select {height: 36px;}
|
|
.float_left {float: left;}
|
|
.float_right {float: right;}
|
|
.file_area + .file_area {margin-top: 8px;}
|
|
.editor_area {overflow: hidden;}
|
|
.half_area {overflow: hidden; float: left; width: 50%;}
|
|
.area20 {float: left; width: 20%;}
|
|
.area30 {float: left; width: 30%;}
|
|
.area35 {float: left; width: 35%;}
|
|
.area40 {float: left; width: 40%;}
|
|
.area45 {float: left; width: 45%;}
|
|
.area50 {float: left; width: 50%;}
|
|
.area55 {float: left; width: 55%;}
|
|
.area60 {float: left; width: 60%;}
|
|
.area65 {float: left; width: 65%;}
|
|
.area70 {float: left; width: 70%;}
|
|
.area80 {float: left; width: 80%;}
|
|
.area_xscroll {overflow-x: auto; width: 100%; padding: 0 0 40px;} /* 가로 스크롤 레이아웃 */
|
|
|
|
.select_area {overflow: hidden; padding: 8px 10px; border: 1px solid #dedede;} /* border area */
|
|
.select_area strong.title {font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-weight: bold; font-size: 13px;}
|
|
.select_area span.txt {font-family: 'Nanum Gothic', 'NanumGothic', '나눔고딕', Helvetica, 'Apple SD Gothic Neo', Sans-serif; font-size: 13px;}
|
|
|
|
|
|
|