/* license: MIT License Developer: Penguinsoft Co., Ltd. http://smartHOMEPAGE.co.kr Credits: Many thanks to all, including JQuery, Yahoo, Masonry, and many more Version: 0.9.0 이름은 항상 소문자로, 단어 사이는 ' - ' 하이픈으로 사용하며, 공통항목은 가능한 상단에 위치함. brown #dd4436, green #6ea004, grey #f5f5f5, orange #f63, yellow #fac600, bluish #0796D2 */ /* ######################### RESET & COMMONS */ /* common colors sizes, */ body {line-height:1.4;} h1,h2,h3,h4,h5,h6 {} a{text-decoration:none} a:link{color:#000;} a:visited{color:#333;} a:hover{color:#efefef;} a:active{color:#efefef;} a:focus {} /* clearfix, spacing, screen reader */ *, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; } .clearfix:before, .clearfix:after{content:""; display:table;} .clearfix:after{clear:both;} .clearfix{clear:both; zoom:1;display:block;} * html .clearfix{height:1%;} .spacing-30px {height:30px;} .screen-reader-user, .hidden, #skip, .screen-reader-user a, #skip a {position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden;} .screen-reader-user a:focus, #skip a:focus {position:static; width:auto; height:auto; } iframe {border:none} /* text alignment, default ul and page title */ .text-right {text-align:right} .text-left {text-align:left} .text-center {text-align:center} ul.ul-bullet-square {padding:0 0 0 20px !important; margin:0} ul.ul-bullet-square li {padding:3px 0; margin:0; list-style:square !important} h1#page-title {padding-left:15px} h2.cta-title {width:85% !important} /* center-c ul, ol, p spacing */ #center-c ul, #center-c ol {margin:10px 0 30px 20px;} ul.app-list-masonry, ul.app-detail-masonry {margin:0 !important} #center-c li {padding:5px 0;} #center-c ul.tabs li {padding:0} #center-c p {margin-bottom:20px} #center-c .app-list-text-box p {margin-bottom:0} /* ######################## center-c 의 여러가지 레이아웃에 사용됨 */ /* main content */ .app-list {margin:0; padding:0 0 30px;position:relative; overflow:hidden !important; } .app-list-title, .about-list-title {} .app-list img, .app-list iframe, .app-list embed, .app-list table, .app-list object {max-width:100%; height:auto; width:auto\9; /*IE8 */} .app-detail img, .app-detail iframe, .app-detail embed, .app-detail table, .app-detail object {max-width:100%; height:auto; width:auto\9; /*IE8 */} .app-list-summary{margin-bottom:30px;} .app-detail-summary { margin-top:30px; margin-bottom:20px; padding-left:20px; font-size:1.0em; border-left:5px solid #ccc; } .app-list-content, .app-detail-content {} .app-list-tag i, .app-detail-tag i {margin-right:5px} .app-list form, .app-detail form {max-width:100%} .app-detail {padding:0 0 20px;overflow:hidden !important; margin-bottom:10px; position:relative} .app-detail-title {} .app-detail img {max-width:100%; height:auto;} .app-detail iframe, .app-detail, .app-detail table, .app-detail object {} .app-detail-summary {margin-top:30px; margin-bottom:20px; padding-left:20px; font-size:0.9em; border-left:5px solid #ccc; } .app-detail-content {} .app-detail-tag {border-top:1px solid #ddd; border-bottom:1px solid #eee; width:99%; padding:15px 0 20px 10px; margin-bottom:30px} .app-detail-tag a {margin-right:5px} /* commonly shared properties */ .app-masonry-box {} .app-list-masonry, .app-detail-masonry {margin-bottom:30px; padding:0; overflow:hidden !important} .app-list-masonry-li, .app-detail-masonry-li {margin-bottom:17px; list-style:none; } .app-list-masonry-inner, .app-detail-masonry-inner {border:1px solid #ddd; border-radius:5px; position:relative;} .app-list-image-box, .app-detail-image-box {width:100%; overflow:hidden; float:left; position:relative} .app-list-image-box h2, .app-detail-image-box h2 {} .app-list-magnifier, .app-detail-magnifier {} .app-list-text-box {padding:5px 20px 10px 25px; overflow:hidden !important} .app-list-text-box h2, .app-detail-text-box h2 {margin:0; padding:0} .app-list-text-box p, .app-detail-text-box p {margin:5px 0 0 0; padding:0} .app-list-summary p {margin-bottom:15px; font-size:0.9em } .app-list-up-date, .app-list-file {font-size:0.9em; font-style:italic; margin:0; padding:0} .app-detail-default {margin:0 0 10px 0;} .app-detail-image-box-embed{position:relative;padding-bottom:56.25%; padding-top:25px;height:0;} .app-detail-image-box-embed iframe{position:absolute;top:0;left:0;width:100%;height:100%;} .app-detail-text-box {padding:10px 15px 30px } .app-detail-text-box iframe {overflow:hidden} .app-detail-text-box h2 {margin:15px 0} .app-detail-tab-text-box-file {border:1px solid #eee; border-radius:5px;width:98.7%; background:#fff; margin:10px 0; padding:10px} .app-detail-default-image {max-width:100%; float:none; margin:0 20px 20px 0} .app-detail-default-image img {max-width:100%; height:auto; overflow:hidden;} /* headline */ .app-list-headline {margin-bottom:20px; } .app-list-headline .app-list-image-box {width:100%; margin-bottom:10px; text-align:center} .app-list-headline .app-list-text-box {margin-bottom:10px; overflow:hidden} .app-list-headline img{max-width:100%; height:auto} .app-list-headline iframe {max-width:100%;} /* commons */ .app-list-image-box-embed {position:relative} .play-video {width:36px; height:25px;top:50%; left:50%; margin-left:-18px; margin-top:-12.5px; position:absolute; background:url('http://t.scms.co.kr/assets/icons/icon-youtube.png') no-repeat center center;} /* defaul layout */ .sh-default-sjm li {width:100%; overflow:hidden} .sh-default-sjm li .app-list-masonry-inner, .sh-default-sjm li .app-detail-masonry-inner {width:98.7%; overflow:hidden} .sh-default-sjm li .app-list-image-box, .sh-default-sjm li .app-detail-image-box {width:240px; height:160px; overflow:hidden; float:left; text-align:center} .sh-default-sjm li .app-list-image-box img, .sh-default-sjm li .app-detail-image-box img {height:160px; max-width:240px;} /* height:160px */ .sh-default-sjm li .app-list-image-box iframe, .sh-default-sjm li .app-detail-image-box iframe {height:100% !important} .sh-default-sjm li .app-list-text-box, .sh-default-sjm li .app-detail-text-box {overflow:hidden; } /* 1 column layout */ .sh-col1-sjm {} .sh-col1-sjm li {width:100%} .sh-col1-sjm li .app-list-masonry-li, .sh-col1-sjm li .app-detail-masonry-li {margin-bottom:30px;} .sh-col1-sjm li .app-list-masonry-inner, .sh-col1-sjm li .app-detail-masonry-inner {width:98.7%} .sh-col1-sjm li .app-list-image-box {margin-bottom:20px; overflow:hidden} .sh-col1-sjm li .app-list-image-box img {width:100%; height:auto} .sh-col1-sjm li .app-list-image-box iframe {width:100% !important; height:auto !important} .sh-col1-sjm li .app-list-text-box {padding-bottom:20px} .sh-col1-sjm li .app-detail-image-box {max-width:100%; overflow:hidden;margin-bottom:15px} .sh-col1-sjm li .app-detail-image-box img {float:left; height:auto } .sh-col1-sjm li .app-detail-image-box iframe {width:100%; height:auto !important} .sh-col1-sjm li .app-detail-text-box {} /* 2 column layout */ .sh-col2-sjm li {width:50%} .sh-col2-sjm li .app-list-masonry-inner, .sh-col2-sjm li .app-detail-masonry-inner {width:97%;} .sh-col2-sjm li .app-list-image-box, .sh-col2-sjm li .app-detail-image-box {margin-bottom:10px; } .sh-col2-sjm li .app-list-image-box img, .sh-col2-sjm li .app-detail-image-box img, .sh-col2-sjm li .app-list-image-box iframe, .sh-col2-sjm li .app-detail-image-box iframe {width:100%; overflow:hidden; height:auto; } .sh-col2-sjm li .app-list-text-box, .sh-col2-sjm li .app-detail-text-box {padding-bottom:25px; } /* 3 column layout */ .sh-col3-sjm li {width:33.3%; } .sh-col3-sjm li .app-list-masonry-inner, .sh-col3-sjm li .app-detail-masonry-inner {width:96.5%} .sh-col3-sjm li .app-list-image-box, .sh-col3-sjm li .app-detail-image-box {margin-bottom:10px; } .sh-col3-sjm li .app-list-image-box img, .sh-col3-sjm li .app-detail-image-box img, .sh-col3-sjm li .app-list-image-box iframe, .sh-col3-sjm li .app-detail-image-box iframe {width:100%; height:auto} .sh-col3-sjm li .app-list-text-box, .sh-col3-sjm li .app-detail-text-box {padding:12px; padding-bottom:15px;} /* 4 column layout */ .sh-col4-sjm li {width:25%;} .sh-col4-sjm li .app-list-masonry-inner, .sh-col4-sjm li .app-detail-masonry-inner {width:94%} .sh-col4-sjm li .app-list-image-box, .sh-col4-sjm li .app-detail-image-box {margin-bottom:8px} .sh-col4-sjm li .app-list-image-box img, .sh-col4-sjm li .app-detail-image-box img, .sh-col4-sjm li .app-list-image-box iframe, .sh-col4-sjm li .app-detail-image-box iframe {width:100%; height:auto} .sh-col4-sjm li .app-list-text-box, .sh-col4-sjm li .app-detail-text-box {padding:9px; padding-bottom:12px;} /* 5 column layout */ .sh-col5-sjm li {width:20%; } .sh-col5-sjm li .app-list-masonry-inner, .sh-col5-sjm li .app-detail-masonry-inner {width:93%} .sh-col5-sjm li .app-list-image-box, .sh-col5-sjm li .app-detail-image-box {margin-bottom:8px} .sh-col5-sjm li .app-list-image-box img, .sh-col5-sjm li .app-detail-image-box img, .sh-col5-sjm li .app-list-image-box iframe, .sh-col5-sjm li .app-detail-image-box iframe {width:100%; height:auto} .sh-col5-sjm li .app-list-text-box, .sh-col5-sjm li .app-detail-text-box{padding:7px; padding-bottom:12px;} /* 6 column layout */ .sh-col6-sjm li {width:16%; } .sh-col6-sjm li .app-list-masonry-inner, .sh-col6-sjm li .app-detail-masonry-inner {width:93%} .sh-col6-sjm li .app-list-image-box, .sh-col6-sjm li .app-detail-image-box {margin-bottom:8px} .sh-col6-sjm li .app-list-image-box img, .sh-col6-sjm li .app-detail-image-box img, .sh-col6-sjm li .app-list-image-box iframe, .sh-col6-sjm li .app-detail-image-box iframe {width:100%; height:auto} .sh-col6-sjm li .app-list-text-box, .sh-col6-sjm li .app-detail-text-box{padding:7px; padding-bottom:12px;} /* custom layout */ .sh-custom-sjm li {width:100%; overflow:hidden} .sh-custom-sjm li .app-list-masonry-li, .sh-custom-sjm li .app-detail-masonry-li {margin-bottom:30px} .sh-custom-sjm li .app-list-masonry-inner, .sh-custom-sjm li .app-detail-masonry-inner {width:98.7%} .sh-custom-sjm li .app-list-image-box {margin-bottom:20px} .sh-custom-sjm li .app-list-image-box img {width:100%} .sh-custom-sjm li .app-list-image-box iframe {width:100% !important} .sh-custom-sjm li .app-list-text-box {padding-bottom:20px} .sh-custom-sjm li .app-detail-image-box {max-width:100%; overflow:hidden; margin-bottom:15px} .sh-custom-sjm li .app-detail-image-box img {float:left; height:auto } .sh-custom-sjm li .app-detail-image-box iframe {max-height:350px} .sh-custom-sjm li .app-detail-text-box {} /* tab containers */ .app-detail-tab-image-box {padding:15px; max-width:100% } .app-detail-tab-image-box img {height:auto } .app-detail-tab-text-box {padding:10px 10px 0 15px; font-size:110%} /* detail page more */ .detail-page-more {margin-top:35px} .detail-page-more h2 {margin-bottom:10px} .detail-page-more-ul {margin:0 !important; padding:0 !important; width:100%} .detail-page-more-ul li {float:left; width:25%; list-style:none} .detail-page-more .apps-detail-tags-inner {width:95%; border:1px solid #ddd; margin:0 auto} .detail-page-more .apps-detail-tags-inner h2, .apps-detail-tags-inner p {width:90% !important; margin:0 auto} .detail-page-more .apps-detail-tags-inner h2 {font-size:0.97em !important} /* ######################### 아래는 혹시 세부적인 css 수정에 사용됨. text, photo, file, video, extra의 inline contents 관리용도임 */ /* text inline */ .app-list-masonry-textinline {} .app-list-masonry-textinline-inner {} .app-list-textinline-image{} .app-list-textinline-magnifier{} .app-list-textinline-text {} .app-detail-masonry-textinline {} .app-detail-masonry-textinline-inner {} .app-detail-textinline-image{} .app-detail-textinline-magnifier{} .app-detail-textinline-text {} .app-detail-tab-text-box-file {} /* image inline */ .app-list-masonry-imageinline {} .app-list-masonry-imageinline-inner {} .app-list-imageinline-image {} .app-list-imageinline-magnifier {} .app-list-imageinline-text {} .app-detail-masonry-imageinline {} .app-detail-masonry-imageinline-inner {} .app-detail-imageinline-image {} .app-detail-imageinline-magnifier {} .app-detail-imageinline-text {} /* file inline */ .app-list-masonry-fileinline {} .app-list-masonry-fileinline-inner {} .app-list-fileinline-image img {border-bottom:none} .app-list-imageinline-magnifier {} .app-list-fileinline-text {} .app-detail-masonry-fileinline {} .app-detail-masonry-fileinline-inner {} .app-detail-fileinline-image img {border-bottom:none} .app-detail-imageinline-magnifier {} .app-detail-fileinline-text {} /* video linline */ .app-list-masonry-videoinline {} .app-list-masonry-videoinline-inner {} .app-list-videoinline-image {} .app-list-videoinline-magnifier {} .app-list-videoinline-text {} .app-detail-masonry-videoinline {} .app-detail-masonry-videoinline-inner {} .app-detail-videoinline-image {} .app-detail-videoinline-magnifier {} .app-detail-videoinline-text {} /* extra inline */ .app-list-masonry-extrainline {} .app-list-masonry-extrainline-inner {} .app-list-extrainline-image {} .app-list-extrainline-text {} .app-detail-masonry-extrainline {} .app-detail-masonry-extrainline-inner {} .app-detail-extrainline-image {} .app-detail-extrainline-text {} /* comments */ .app-detail-comment-list .app-detail-comment-form #comment-list {} #comment-form {} .app-detail-comment-list {} .app-detail-comment-form {} /* ######################### Utilities and others */ /* back to list */ .app-detail-back-to-list {width:98.7%; line-height:40px; margin:50px 0; display:block; border-radius:3px; border:1px solid #ddd; text-align:center} .app-detail-back-to-list a {display:block} /* pagination */ div.app-list-pagination {margin:50px auto; position:relative; } ul.pagination {margin:0 auto; list-style:none; display:block; } ul.pagination li { text-align:center; float:left; width:40px; height:35px; margin-right:5px; border:1px solid #ddd } ul.pagination li a {display:block; width:40px; height:25px;} ul.pagination li.active {background:#eee; } /* share sns */ .sns-share-code {margin:10px 0 20px; clear:both !important; } .sns-share-code span {} /* share sns add mbkang from kpoli*/ .ssc-box span {height: 1px;overflow-x: hidden;overflow-y: hidden;position: absolute;top: -200px;width: 1px;} .ssc-box a {margin-right: 10px;} /* tables, add to purecss tables */ .pure-table {width:100%; margin:20px 0} .pure-table td p {margin:0 !important; padding:0 !important} /* buttons extra properties in addition to http://purecss.io/buttons/ */ .button-success,.button-error,.button-warning,.button-secondary{color:white; border-radius:4px; text-shadow:0 1px 1px rgba(0,0,0,0.2); } .button-success{background:rgb(150,215,219);/* this is a green */} .button-error{background:rgb(202,60,60);/* this is a maroon */ } .button-warning{background:rgb(223,117,20);/* this is an orange */} .button-secondary{background:rgb(66,184,221);/* this is a light blue */} .button-xsmall{font-size:70%; } .button-small{font-size:85%; } .button-large{font-size:110%; } .button-xlarge{font-size:125%; } .jina-button-download {margin-top:15px !important; background:#ddd !important; border:1px solid #ccc; padding:5px 15px; color:white; border-radius:4px !important; } .jina-button-download a, .jina-button-download a:visited {color:#000 !important} /* tabs */ /* tabs http://www.qualitytuts.com/simple-jquery-tabs-css-jquery/ */ .app-detail-tabs {margin:10px 0 40px 0; clear:both} ul.tabs, ul.tabs-east{float:left; background:transparent !important; list-style:none; width:98.8%;margin:0 !important;padding:0;} ul.tabs li{float:left; margin:0 8px 0 0;padding: 0; height:35px; line-height:35px;border:1px solid #ccc; background:#eee;text-shadow:none; overflow:hidden;position:relative; -webkit-border-top-left-radius:4px;-webkit-border-top-right-radius:4px;-moz-border-radius-topleft:4px;-moz-border-radius-topright:4px;border-top-left-radius:4px;border-top-right-radius:4px} ul.tabs li a {padding-left: 8px; padding-right:8px; text-decoration:none;height:35px; line-height:35px; color:#000;display:block; outline:none;-webkit-border-top-left-radius:4px;-webkit-border-top-right-radius:4px;-moz-border-radius-topleft:4px;-moz-border-radius-topright:4px;border-top-left-radius:4px;border-top-right-radius:4px} ul.tabs li a:hover {background:#fff;} ul.tabs-east {background:#eee} ul.tabs-east li{float:left; height:35px; line-height:35px; padding:0 12px; overflow:hidden;position:relative;} ul.tabs-east li a {text-decoration:none;height:35px; line-height:35px; color:#000;display:block; outline:none;} ul.tabs-east li a:hover{background:transparent; display:block} html ul.tabs li.active, html ul.tabs-east li.active, html ul.tabs li.active a:hover, html ul.tabs-east li.active a:hover{background:#fff;font-weight:bolder; border-bottom:2px solid #fff;} .tabContainer, .tabContainer-east {font-size:0.85em; min-height:150px; margin-top:-1px; border:1px solid #ccc; overflow:hidden;clear:both;float:left;width:100%;background:#fff;-webkit-border-radius:4px;-webkit-border-top-left-radius:0;-moz-border-radius:4px;-moz-border-radius-topleft:0;border-radius:4px;border-top-left-radius:0;} .tabContent, .tabContent-east {padding:0} .tabContainer-east {margin-bottom:20px; } .tabContent-east {padding:10px; } .tabContent, .tabContent-east li {border-bottom:1px solid #ddd; display:block; clear:both; min-height:58px} .tabContent, .tabContent-east li:last-child {border-bottom:none} .tabs-east li{background:#ccc; border:1px solid #ddd} #tab-video iframe {max-width:100%} .detail-page-tabs {padding:0 0 0 15px} #tab-featured ul {margin:0; padding:0} /* east recommended lists */ .tabContainer {width:98.7%; padding-bottom:20px} .tabContainer ul, .tabContainer ol {margin:10px 0 30px 20px} .tabContainer li {padding:7px 0; border-bottom:1px solid #ededed} /* ######################### DEFAULT LAYOUT & CENTER */ #north-container, #center-container, #south-container, #center-c, #center-e, {position:relative } .search-results {} .search-results h2 {margin:0; padding:0} .search-results em {} .search-results p{margin-bottom:25px; padding:0; margin-top:0} /* north ======================== */ #language-selection, #language-selection ul{list-style-type:none;margin:0;padding:0; background:#fff; position:relative; z-index:100} #language-selection .language-list li{float:left;} #language-selection .language-list > li{float:none;} #language-selection {position:absolute; right:0;top:-20000px;} #language-selection a.main, #language-selection .language-list{top:20000px;} #language-selection .link{width:200px;margin-top:-10075px;float:left;text-align:center;} #language-selection a{position:relative;display:block;height:25px;line-height:25px;text-decoration:none; z-index:6;} #language-selection .language-list {border-radius:5px; position:relative; z-index:5} #language-selection .language-list a{margin:0 -1px 0 0;width:200px;color:#000} #language-selection .language-list li {padding:6px 0; border-bottom:1px solid #eee; width:90%;} #language-selection .language-list{position:relative;float:left;background:#fff;padding-top:25px;margin-top:-25px;text-align:center;} #language-selection a.main{width:200px;height:25px;line-height:25px;margin-top:10075px;margin-right:-199px;float:left;} #language-selection a.main:hover, #language-selection a.main:focus, #language-selection a.main:active{margin-right:0;} #language-selection .language-list a:hover, #language-selection .language-list a:focus, #language-selection .language-list a:active{margin:0 0 0 0;} #language-box {display:inline} #language-box li {float:left;} .language-list li {font-weight:normal !important} .language-list li {margin-right:5px; padding-right:4px; border-right:1px solid #ddd; } .language-list li:last-of-type {margin-right:0; padding-right:0; border-right:0 solid #ddd; } .language-list li a:focus {background:#f63; color:#fff !important } /* center-c ======================== */ #center-c {min-height:350px} #center-c-container {} /* detail page more recommendations */ .detail-page-more-ul h3, .detail-page-more-ul p, .detail-page-more-ul span {margin:0 !imporant; padding:0 !imporant} .detail-page-more-ul h3, .detail-page-more-ul p, .detail-page-more-ul span {width:95%; margin:0 auto; } .detail-page-more-ul .apps-detail-tags-inner span {display:none} p.detail-more-summary {width:100% !important; font-size:1.0em !important} .detail-page-more-ul .apps-detail-tags-inner {border:none} /* center-e layout and common ======================== */ #center-e {} #center-e h2, #center-e h3, #center-e h4, #center-e h5 {margin:0; padding:7px 7px 7px 15px; display:block;} #center-e-container {} #center-e .content-inner {width:98%; margin:0 auto 30px auto; } #center-e .text-box {width:95%; margin:10px auto} #center-e img {max-width:100%; overflow:hidden} #center-e iframe, #center-e table, #center-e object, #center-e embed {width:100%; overflow:hidden} #center-e br {padding:8px 0;} #center-e textarea, #center-e input {max-width:100%} /* category */ p.category-summary {margin-top:30px; margin-bottom:20px; padding-left:20px; font-size:1.0em; border-left:5px solid #ccc; } /* app category summary */ li#all-categories {display:none} /* {display:block} */ p.no-posts-yet {} /* app category if no posts message */ /* contact info */ #contact-info img {border:none} /* tabs */ .app-featured-thumbs {clear:both; position:relative;} .app-featured-thumbs li {padding:0 0 5px 0; margin-bottom:5px; } .app-featured-thumbs .app-list-image-box {width:55px; height:55px; float:left; margin-right:10px} .app-featured-thumbs p, .app-featured-thumbs span, .app-featured-thumbs .app-list-file {width:1px; height:1px; position:absolute; top:-2px; overflow:hidden} .app-featured-thumbs h3 {font-weight:normal; font-size:1.0em} .app-featured-thumbs .play-video {width:20px; height:20px;top:30%; left:50%; margin-left:-10px; margin-top:-10px; position:absolute; background:url('http://t.scms.co.kr/assets/icons/icon-youtube.png') no-repeat center center;} .tabs-east li:last-of-type, #tab-tag {display:none} .tabContainer-east {padding-bottom:30px} .tabContainer-east h3, .tab-featured h3 {font-weight:normal !important; font-size:0.95em !important} /* qr code */ #app-detail-qrcode {clear:both !important; margin-top:30px; margin-bottom:30px; text-align:center; background:#fff; border:1px solid #ddd; border-radius:5px} /* extracode1 */ #extracode1 {} /* extracode2 */ #extracode1 {} /* newsletter */ #newsletter-signup {} #newsletter-signup .content-inner {border:none} /* ######################### SOUTH */ /* commons */ #south-n, #south-c, #south-s,#south-sw, #south-sc, #south-se {position:relative;} .south-sns-share {margin:0 auto; float:right} .south-sns-share span {overflow:hidden; width:1px; height:1px; position:absolute; top:-10px;} .south-sns-share a {margin-right:10px; } #south i {margin-right:7px} .south-commons #south-n span, .south-commons #south-n .south-n3 h3, .south-commons #south-n .south-n3 p, .south-commons .south-n1 p, .south-commons .south-n2 p, .south-commons .south-n3 p {display:none} .south-commons .south-n1 h3, .south-commons .south-n2 h3 {font-weight:normal; font-size:1.0em} .south-commons ul, .south-commons h2, .south-commons h3, .south-commons li, .south-commons p {margin:0; padding:0} .south-commons .home-south-inner {width:95%; margin:0 auto} /* south-n */ .south-commons .south-n1, .south-commons .south-n2, .south-commons .south-n3, .south-commons .south-n4 {width:25%; float:left} .south-commons #south-n li {padding:3px 0} .south-commons #south-n h2 {margin-bottom:15px} .south-commons .south-n3 ul {margin:0 !important; padding:0 !important} .south-commons .south-n3 li, .south-commons .photo-only li {width:60px; height:60px; float:left; list-style:none !important; padding:0; margin:0 10px 10px 0 !important } .south-commons .south-n3 li img, .south-commons .photo-only li img {width:60px; height:60px; border:2px solid #fff; background:#efefef; } .south-commons .photo-only li img:hover {border:2px solid #f63} .south-commons .photo-only li h3, .south-commons .photo-only li p, .south-commons .photo-only li span {width:1px; height:1px; overflow:hidden; position:absolute; top:-10px} .south-commons .photo-only li:hover {border:none} .title-only li{padding:5px 0; border-bottom:1px solid #ddd } .title-only li h3 {font-weight:normal !important; display:block !important; font-size:0.95em; margin:0; } .title-only li img, .title-only li span {position:absolute; width:1px; height:1px; overflow:hidden; top:-10px} /* south-c */ .south-sns-share {width:200px; margin:0 auto; } /* south-s */ #south-sw, #south-sc, #south-se {width:33% !important;} #south-sw { float:left} #south-sc { float:left; width:23%} #south-se {float:right !important; text-align:right} span.terms {width:100%;} span.terms a {padding:0 7px 0 0; font-size:0.9em; } span.terms a:last-of-type {border-right:none} /* ######################### HOMEPAGE, BANNERS and OTHERS */ .homepage-floor {width:100%; margin:0 auto; padding:0} .homepage-container {margin:0; padding:0} .home-box-inner {background:#fff} .homepage_banner, .homepage-banner-box {position:relative} .homepage-banner-box {width:100%; margin:0 auto 40px auto;} .homepage_banner .playSlider {width:100% !important; margin:0 auto; overflow:hidden} /* potato */ /* homepage image sizes */ .homepage-col1 img {width:100%; height:280px !important} .homepage-col2 img {width:100%; height:160px !important} .homepage-col3 img {width:100%; height:120px !important} .homepage-col4 img {width:100%; height:100px !important} .homepage-col5 img {width:100%; height:80px !important} #accessibility {float:right} #accessibility li {float:left;font-weight:normal !important; margin-right:5px; padding-right:4px; border-right:1px solid #ddd; } #accessibility li:last-of-type {margin-right:0; padding-right:0; border-right:0 solid #ddd; } .source-url { padding-left:30px; border:1px solid #ccc; margin:30px 0; background:#eee; line-height:20px} .share-sns {border-top:1px solid #eee; border-bottom:1px solid #eee; padding: 8px 0 3px 0; clear:both; margin:0 0 18px 0} .share-page-sns {margin:5px 0; width:100%; padding:10px 0 13px 0} /* sns icon */ .sns-follow-me {position: relative;} .sns-follow {margin:0 0 7px 0} .sns-follow-me span, .social-rss span {position:absolute; width:1px; height:1px; top:-1000px} .sns-follow-me a {padding-right:2px} .social-rss,.social-google,.social-fb ,.social-youtube,.social-linkedin,.social-pinterest,.social-twitter,.social-vk, .social-blog, .social-download{background:url('http://t.scms.co.kr/assets/icons/sns-icon.png'); width:32px; height:32px; display:block; float:left;} .social-rss {background:url('http://t.scms.co.kr/assets/icons/sns-icon.png') 1px 0px} .social-google {background:url('http://t.scms.co.kr/assets/icons/sns-icon.png') 0 -164px} .social-fb {background:url('http://t.scms.co.kr/assets/icons/sns-icon.png') -168px 0} .social-youtube {background:url('http://t.scms.co.kr/assets/icons/sns-icon.png') -56px -53px} .social-linkedin {background:url('http://t.scms.co.kr/assets/icons/sns-icon.png') 0 -52px} .social-pinterest { background:url('http://t.scms.co.kr/assets/icons/sns-icon.png') -55px -214px} .social-twitter { background:url('http://t.scms.co.kr/assets/icons/sns-icon.png') -55px 0} .social-vk { background:url('http://t.scms.co.kr/assets/icons/sns-icon.png') 0 -260px } .social-blog { background:url('http://t.scms.co.kr/assets/icons/sns-icon.png') -56px -260px } .social-download { background:url('http://t.scms.co.kr/assets/icons/sns-icon.png') -112px -164px } .share-sns-more span {width:1px; height:1px; position:absolute; top:-2px; overflow:hidden} .share-sns-more a {margin-right:10px} p.rss-code {font-size:95%; font-style:italic; border:1px solid #ddd; padding:5px} p.rss-what {margin:11px 0; display:none} /* mbkang add tables ============================================================================ */ table {margin:15px 0 !important;} table,th,td{border:1px solid #D4E0EE;border-collapse:collapse;color:#555;} caption{font-size:120%;font-weight:bold;margin:5px; text-align:left} td,th{padding:4px !important;vertical-align:middle;} thead th{text-align:center;background:#E6EDF5;color:#4F76A3;font-weight:bolder; font-size:100% !important;} tbody th{font-weight:bolder;} tbody tr{background:#FCFDFE; } tbody tr.odd{background:#F7F9FC; } table a:link{color:#718ABE;text-decoration:none;} table a:visited{color:#718ABE;text-decoration:none;} table a:hover{color:#718ABE;text-decoration:underline !important;} tfoot th,tfoot td{font-size:85%;} #center table, #center-c table {width:98% !important} table td p {margin:0 !important; padding:0 !important; } .app-detail-text-box iframe {width:100%; height:60% ; position:absolute; top:0; left: 0;} /* end ============================================================================ */ /* app dates, summary etc display none */ /* .blog-list-masonry-inner p.app-list-up-date, */ .client-list-masonry-inner p.app-list-up-date, .download-list-masonry-inner p.app-list-up-date, .faq-list-masonry-inner p.app-list-up-date, .product-list-masonry-inner p.app-list-up-date, .service-list-masonry-inner p.app-list-up-date, .recruit-list-masonry-inner p.app-list-up-date, .client-detail-up-date, .download-detail-up-date, .faq-detail-up-date, .product-detail-up-date, .service-detail-up-date, .recruit-detail-up-date, .slider-video .bx-caption {display:none} /* contact page */ .contact-page {background:transparent; width:96%; margin:0 auto 50px; padding:0 0 50px} .contact-information {width:50%; float:left} .contact-forms {width:50%; margin: 0 0 50px 0; float:right} .contact-inner {width:90%} .contact-map {margin:0 0 30px 0} .parking-information {margin:30px 0; } .parking-information p {margin:0 0 15px }