/* css */ @import url(./fonts/nanumgothic.css); @import url(./fonts/nanumsquare.css); /*****************************************************************/ /*메인페이지 레이아웃*/ /*****************************************************************/ .in_wide {max-width:100%; margin-top:0; font-family:'nanumsquare'; background:url(../images/in_bg.gif) repeat-x top;} @media only screen and (max-width:496px){ .in_wide {padding:0 10px; margin-top:0px; background:none;} } /*메인이미지*/ .in_img {width:100%; /*background:linear-gradient(#F6FBFF 0%, #F6FBFF 30%, #FFFFFF 100%);*/ border-bottom:#e5e5e5 0px solid; position:relative; overflow:hidden; z-index:0;} .in_img>div {overflow:hidden;} @media only screen and (max-width:496px){ .in_img {padding:0 0px;} .in_img div.img-wrap {padding-bottom:50% !important;} } /*팝업존/배너*/ .in_img2 {max-width:1300px; margin:60px auto 70px auto; position:relative; overflow:hidden;} .in_img2>div {overflow:hidden;} .in_img2>div:nth-child(1) {width:42%; float:left;} .in_img2>div:nth-child(1)>h3 {width:115px; float:left; margin:0 0 5px 0; padding:5px; background:#3d3d3d; border-radius:5px; font-size:19px; font-weight:bold; color:#FFF; text-align:center;} .in_img2>div:nth-child(2) {width:55%; float:right;} .in_img2>div:nth-child(2)>ul {list-style:none; margin:0; padding:0; border:#c7c7c7 1px solid; overflow:hidden;} .in_img2>div:nth-child(2)>ul>li {float:left; width:50%; padding:40px 0; text-align:center;} .in_img2>div:nth-child(2)>ul>li:first-child {border-right:#c7c7c7 1px solid;} .in_img2>div:nth-child(2)>ul>li:last-child {width:100%; padding:30px 20px; border-top:#c7c7c7 1px solid;} .in_img2>div:nth-child(2)>ul>li:last-child>div {float:left; width:50%; min-height:248px; overflow:hidden;} .in_img2>div:nth-child(2)>ul>li:last-child>div:nth-child(1) {background:#F5F5F5; padding-top:10px;} .in_img2 img {max-width:100%;} @media only screen and (max-width:496px){ .in_img2 {margin:25px auto 30px auto;;} .in_img2>div {width:100% !important; float:none !important;} .in_img2>div:nth-child(2)>ul>li {float:left; width:50%; padding:20px 0; text-align:center;} } #carouselButtons {width:75px; text-align:right; overflow:hidden;} @media only screen and (max-width:496px){ #carouselButtons {position:relative; top:5px; margin-bottom:20px;} } /*메인배너*/ .in_banner {max-width:1300px; margin:-155px auto 80px auto; position:relative; overflow:hidden; /*overflow:hidden; box-shadow:0px 0px 50px 5px rgba(0,0,0,0.2); -webkit-box-shadow:0px 0px 50px 5px rgba(0,0,0,0.2); -moz-box-shadow:0px 0px 50px 5px rgba(0,0,0,0.2);*/} .in_banner>ul {list-style:none; margin:0; padding:0; overflow:hidden;} .in_banner>ul>li {float:left; width:20%; border-right:#d1d1d1 1px solid; background:#fff; text-align:center;} .in_banner>ul>li:first-child {background:#FED14A;} .in_banner>ul>li:last-child {border-right:none;} .in_banner>ul>li>a {display:block;} .in_banner img {max-width:100%;} @media only screen and (max-width:496px){ .in_banner {margin:20px auto 40px auto;} .in_banner>ul>li {float:left; width:50%; border:none;} .in_banner>ul>li:nth-child(4) {background:#FED14A;} .in_banner>ul>li:nth-child(5) {background:#FED14A;} } /*공지사항*/ .in_notice {max-width:1300px; margin:0 auto 80px auto; position:relative; overflow:hidden;} .in_notice>div {float:left; width:30%; margin-right:5%; overflow:hidden;} .in_notice>div:last-child {margin-right:0;} .in_notice>div>a {display:block; overflow:hidden;} .in_notice>div>a>b {font-size:30px; font-weight:normal; letter-spacing:-1px; line-height:150%; float:left; display:inline-block;} .in_notice>div>a>i {float:right; padding-top:10px;} .in_notice>div>div {margin:20px 0 0 0; text-align:left; overflow:hidden;} .in_notice img {max-width:100%;} @media only screen and (max-width:496px){ .in_notice {margin-bottom:30px;} .in_notice>div {float:none; width:100%; margin-right:0; margin-bottom:20px;} } /*공지사항 웹접근성 멀티탭*/ .tab.list {height:350px !important; overflow:hidden;} .tab.list ul {list-style:none; width:100%; margin:0; padding:0; position:relative;} /*.tab.list ul:after {content:""; display:block; clear:both;}*/ .tab.list>ul>li {float:left; margin-bottom:0px; padding-top:0px;} .tab.list>ul>li>a {width:100%; display:inline-block; padding:0 25px; border-right:#d0d0d0 1px solid; color:#333 !important; line-height:24px;} .tab.list>ul>li:first-child>a {padding-left:0;} .tab.list>ul>li:last-child>a {border-right:none;} .tab.list>ul>li>a>span {position:relative; display:inline-block; letter-spacing:-0.5px; cursor:pointer; font-size:24px; z-index:5;} .tab.list>ul>li>a>i {font-style:normal; float:right; font-size:18px;} .tab.list>ul>li.active>a {display:block; font-weight:bold !important; color:#333 !important;} .tab.list>ul>li>ul>p.more {position:absolute; right:0px; top:-46px; text-align:center; z-index:11;} .tab.list>ul>li>ul>p.more>a {position:relative; display:inline-block; padding:0px 0;} .tab.list>ul>li>ul {width:100%; height:295px; position:absolute; border-top:#b2b2b3 1px solid; border-bottom:#b2b2b3 0px solid; top:45px; left:0; list-style:none; margin:0; padding:25px 0 0 0; z-index:0;} .tab.list>ul>li>ul:after {content:""; display:block; clear:both;} .tab.list>ul>li>ul>li {position:relative; margin:0;} .tab.list>ul>li>ul>li>a {padding:0; margin:0; border:0 !important; color:#666 !important; font-weight:normal; background:transparent; letter-spacing:normal} .tab.list>ul>li>ul>li>a:hover, .tab.list>ul>li>ul>li>a:active, .tab.list>ul>li>ul>li>a:focus {color:#000 !important; text-decoration:underline} .tab.list>ul>li>ul>li time, .tab.list>ul>li>ul>li .time {position:absolute; top:0; right:0; color:#767676} .tab.list.jx {height:auto} .tab.list.jx ul {border:0} .tab.list.jx li {float:none; position:relative} .tab.list.jx li a {float:none; display:block; font-weight:bold; color:#333; border:0px solid #eee !important; border-bottom-color:#ccc !important;} .tab.list.jx li ul {position:static; display:block; left:0; top:0; padding:0px 0} .tab.list.jx li li a {display:inline; border:0 !important; background:none !important; font-weight:normal} @media only screen and (max-width:496px){ .tab.list {height:370px !important;} .tab.list>ul>li>a {padding:0 15px;line-height:20px;} .tab.list>ul>li>a>span {font-size:20px;} .tab.list>ul>li>ul>p.more {display:none;} } /*갤러리*/ .in_gallery {width:100%; margin-bottom:30px; background:url(../images/in_gallery_bg.png) repeat-x top #FCFDCC; position:relative; overflow:hidden;} .in_gallery>div {max-width:1300px; margin:80px auto 30px auto; text-align:center; overflow:hidden;} .in_gallery>div>h3 {text-align:center; font-size:48px; font-weight:normal; letter-spacing:-1px; margin:0 0 10px 0;} .in_gallery>div>h4 {text-align:center; font-size:17.5px; font-weight:normal; color:#888; letter-spacing:-0.5px; margin:0 0 5px 0;} .in_gallery>div>h5 {float:right; margin-top:-25px; font-style:normal; font-size:18px;} .in_gallery>div>h5>a {color:#333 !important;} .in_gallery>div>div {width:100%; margin-top:30px; overflow:hidden;} .in_gallery img {max-width:100%;} @media only screen and (max-width:496px){ .in_gallery {margin-bottom:30px; padding:25px 20px;} .in_gallery>div {margin:0 auto;} .in_gallery>div>h3 {font-size:36px;} .in_gallery>div>h4 {font-size:15px;} .in_gallery>div>h5 {display:none;} .in_gallery>div>div {margin-top:20px;} } /*홍보영상*/ .in_mov {width:100%; text-align:center; position:relative; overflow:hidden;} .in_mov>h2 {font-size:24px; font-weight:normal; color:#31a6fa; letter-spacing:-1px; margin:0 0 20px 0;} .in_mov>h3 {font-size:52px; font-weight:bolder; color:#f53d7e; letter-spacing:-1px; margin:0 0 20px 0;} .in_mov>h4 {font-size:24px; font-weight:normal; color:#444444; letter-spacing:-1px; margin:0 0 45px 0;} .in_mov>div {width:100%; background:linear-gradient(to bottom, #FFF 50%, #FFD3DB 50%); position:relative; overflow:hidden;} .in_mov>div>div {max-width:900px; margin:0 auto; overflow:hidden;} .in_mov>div>div>div.video-container {height:auto; padding-top:56.2%; position:relative;} .in_mov>div>div>div.video-container>iframe {top:0; left:0; position:absolute; width:100%; height:100%;} .in_mov img {max-width:100%;} @media only screen and (max-width:496px){ .in_mov>h2 {font-size:18px; margin:0 0 10px 0;} .in_mov>h3 {font-size:30px; margin:0 0 10px 0;} .in_mov>h4 {font-size:16px; margin:0 0 25px 0;} } /*문의상담전화*/ .in_tell {width:100%; background:#f5f5f5; position:relative; overflow:hidden;} .in_tell>ul {list-style:none; max-width:1300px; margin:40px auto 90px auto; padding:0; overflow:hidden;} .in_tell>ul>li {float:left; width:50%;} .in_tell>ul>li:nth-child(1)>h3 {font-size:36px; margin:4px 0 20px 0;} .in_tell>ul>li:nth-child(1)>div {border-bottom:#DAD8D1 1px solid;} .in_tell>ul>li:nth-child(2) {padding-top:50px; text-align:center;} .in_tell img {max-width:100%;} @media only screen and (max-width:496px){ .in_tell>ul {margin:40px auto;} .in_tell>ul>li {float:none; width:100%; margin-bottom:15px; padding:0 10px !important;} } /*연락하기*/ .in_info {max-width:1300px; margin:0px auto 100px auto; background:url(../images/in_tell_bg.png) right bottom no-repeat; position:relative; overflow:hidden;} .in_info>h3 {font-size:30px; margin:0; padding:0 0 15px 0; border-bottom:#c7c7c7 1px solid; overflow:hidden;} .in_info>h3>i {font-size:18px; font-weight:bold; color:#7d7d7d; font-style:normal; padding-top:12px; float:right;} .in_info>div {margin-top:45px; overflow:hidden;} .in_info>div>div {float:left; overflow:hidden;} .in_info>div>div:first-child {width:60%; padding-right:65px;} .in_info>div>div:last-child {width:40%;} .in_info>div>div>h4 {width:190px; font-size:19px; padding:10px; margin:0 0 10px 0; background:#efefef; border-radius:5px; text-align:center;} .in_info>div>div>ul {list-style:none; margin:0; padding:20px 8px; overflow:hidden;} .in_info>div>div>ul>li {margin-bottom:15px; font-size:19px;} .in_info>div>div>ul>li>i {width:25px; text-align:center;} .in_info>div>div>ul>li>b {font-size:16px; font-weight:normal; background:#efefef; border-radius:5px; padding:3px 10px; margin-right:10px;} @media only screen and (max-width:496px){ .in_info {margin:0px auto 30px auto; background:none;} .in_info>h3 {font-size:24px; margin:0; padding:0 0 10px 0;} .in_info>h3>i {font-size:14px; padding-top:10px;} .in_info>div {margin-top:25px;} .in_info>div>div {float:none;} .in_info>div>div:first-child {width:100%; padding-right:0; margin-bottom:20px;} .in_info>div>div:last-child {width:100%;} .in_info>div>div>h4 {width:100%;} .in_info>div>div>ul {list-style:none; margin:0; padding:10px 8px; overflow:hidden;} .in_info>div>div>ul>li {margin-bottom:15px; font-size:15px; letter-spacing:-1px;} .in_info>div>div>ul>li>b {font-size:14px;} } /*SNS*/ .in_sns {max-width:1300px; margin:0px auto 60px auto; position:relative; overflow:hidden;} .in_sns>ul {list-style:none; margin:0; padding:0; overflow:hidden;} .in_sns>ul>li {float:left; width:33.33%;} .in_sns>ul>li>a {display:inline-block; border-radius:20px;} .in_sns>ul>li:nth-child(1) {text-align:left;} .in_sns>ul>li:nth-child(2) {text-align:center;} .in_sns>ul>li:nth-child(3) {text-align:right;} .in_sns>ul>li:nth-child(1)>a {background:#FFEBF3; border:#FDCBE0 1px solid;} .in_sns>ul>li:nth-child(2)>a {background:#F5E7FE; border:#E8CBFA 1px solid;} .in_sns>ul>li:nth-child(3)>a {background:#FEFC54; border:#FEDD19 1px solid;} .in_sns img {max-width:100%;} @media only screen and (max-width:496px){ .in_sns {margin:0px auto 30px auto;} .in_sns>ul>li {float:none; width:100%; margin-bottom:15px;} .in_sns>ul>li>a {width:100%;} } /*후원자*/ .in_sponsor {max-width:1300px; margin:0 auto 55px auto; text-align:center; position:relative; overflow:hidden;} .in_sponsor>h3 {font-size:28px; margin:25px 0;} .in_sponsor>h5 {float:right; font-size:18px; margin:-40px 0 0 0;} .in_sponsor>div {margin:0 0 30px 0; padding:30px; border:#eaeaea 5px solid; border-radius:20px; overflow:hidden;} .in_sponsor>span {display:inline-block; background:#FDFED4; border-radius:100px; padding:15px 60px; font-size:22px; letter-spacing:-0.5px;} .in_sponsor img {max-width:100%;} @media only screen and (max-width:496px){ .in_sponsor {margin:0px auto 30px auto;} .in_sponsor>h5 {display:none;} .in_sponsor>div {margin:0 0 30px 0; padding:15px;} .in_sponsor>span {padding:15px 20px; font-size:16px;} } /*사이트배너*/ .in_site {max-width:1300px; position:relative; margin:0px auto 30px auto; overflow:hidden;} .in_site>div {border:#ddd 1px solid; padding:0px 0px; overflow:hidden;} /*.in_site>ul>li:last-child { text-align:right; margin-right:0px;} .in_site>ul>li:last-child>select {width:200px; height:57px; border:#d5d5d5 1px solid; padding-left:10px; background: url(../images/icon_select.jpg) no-repeat 95% 50%; -webkit-appearance:none; -moz-appearance:none; -ms-appearance:none; appearance:none;} .in_site>ul>li:last-child>select::-ms-expand {display:none;}*/ @media only screen and (max-width:1199px){ .in_site {width:100%;} .in_site>ul>li {float:left; margin-right:0px;} .in_site>ul>li:last-child {margin-right:0px;} } @media only screen and (max-width:496px){ .in_site {max-width:100%;} .in_site>ul>li {float:left; width:50%; margin:5px 0px; padding:0;} .in_site>ul>li>a {width:95%;} .in_site>ul>li img {max-width:100%;} } /*퀵메뉴*/ .in_quick {list-style:none; margin:0; padding:0; border:#c7c7c7 1px solid; border-radius:20px; overflow:hidden;} /* 하단 카피라이트 */ #in_copy {max-width:1300px; position:relative; margin:0px auto; padding:10px 0 40px 0; overflow:hidden;} #in_copy>div {float:left; font-family:'nanumgothic'; font-size:15px; color:#FFF; overflow:hidden;} #in_copy>div:nth-child(1) {width:30%; text-align:right; padding-right:20px; padding-top:15px;}/* width:35%;->width:30%; */ #in_copy>div:nth-child(2) {width:70%; text-align:left; padding-top:25px;} /* width:65%;->width:70%; */ #in_copy>div:nth-child(2)>p {margin-bottom:2px; letter-spacing:-0.5px;} #in_copy>div:nth-child(2)>span {font-size:15px; letter-spacing:-0.5px;} #in_copy>div:nth-child(3) {width:10%;} #in_copy>div>p {margin-bottom:2px; letter-spacing:-0.5px;} #in_copy>div a {color:#FFF;} #in_copy>div img {max-width:100%;} #in_copy>div br {display:none;} @media all and (max-width:991px) { #in_copy>div:nth-child(1) {display:none;} #in_copy>div {float:none !important; width:100% !important; padding:0 10px; font-size:14px; text-align:center !important;} #in_copy>div br {display:block;} } /* 패밀리사이트 */ .fsite { width: 250px; height: 30px; padding-left: 10px; font-size: 15px; color: #ffffff; background:#000000; border: 1px solid #3f3f3f; border-radius: 0px; } #in_copy_link>div select { appearance:none; -webkit-appearance:none; -moz-appearance:none; background:url('../images/select-arrow.png') no-repeat right 9px center #000000; } #in_copy_link>div select::-ms-expand { display:none; } /* PC/모바일 */ .five_mobile {display:none;} @media only screen and (max-width:496px){ .five_pc {display:none;} .five_mobile {display:block;} } #skip_to_container a {z-index:100000; position:absolute; top:0px; left:0px; width:0px; height:0px; font-size:0px; 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;} .in_line {border-bottom:#d3d3d3 1px solid; overflow:hidden;} a:hover {transition:all 0.2s ease-in-out;} /*********************************************************************************************************************************************/ /*****************************************************************/ /* 서브페이지 레이아웃 */ /*****************************************************************/ #sub_layout {max-width:1300px; margin:0 auto; padding:0px; position:relative; overflow:hidden;} /*#sub_layout>#sub_left {width:19.28%; float:left; overflow:hidden;}*/ #sub_layout>#sub_center {width:100%; /*min-height:400px; float:left; padding-left:48px; border-left:#E6E6E6 1px solid;*/ margin:0; overflow:hidden;} #sub_layout>#sub_center>#sub_content {width:100%; margin:40px 0 50px 0; padding-left:0; font-size:16px; color:#555; letter-spacing:-0.6px; overflow:hidden;} #sub_layout>#sub_center>#sub_content input[type=radio] {margin:0 5px 0;} @media only screen and (max-width:992px){ #sub_layout>#sub_left {display:none;} #sub_layout>#sub_center {width:100%; float:none; padding:0; border-left:none;} } @media only screen and (max-width:496px){ #sub_layout {padding:0px 10px;} #sub_layout>#sub_center>#sub_content {margin:0 0 50px 0; padding-left:0;} } /*서브페이지 이미지*/ #sub_img {max-width:100%; text-align:center; background:url(../images/sub_img_bg.png); border-top:#d3e7e7 0px solid; border-bottom:#008E90 1px solid; overflow:hidden; clear:both;} #sub_img_mobile {display:none;} @media only screen and (max-width:496px){ #sub_img {max-width:100%;} /*#sub_img {display:none;}*/ #sub_img_mobile {display:block; max-width:100%; text-align:center; overflow:hidden; clear:both;} } #sub_img img {max-width:100%;} /*서브페이지 타이틀*/ .sub_title { margin:0px auto; padding:40px 0px 20px 0px; background:url(../images/sub_img_bg.png) right bottom no-repeat; text-align:left; line-height:35px; border-bottom:#DFDFDF 1px solid; overflow:hidden; } .sub_title>.header-breadcrumb { font-size:14px; padding-top:20px; } .sub_title>div>span { display:inline-block; padding-bottom:0px; font-size:44px; font-weight:600; font-family:'nanumsquare'; color:#333; letter-spacing:-1px; line-height:120%;} @media all and (max-width:992px){ .sub_title { padding:25px 20px; background:none; } } @media all and (max-width:496px) { .responsive .sub_title .header-breadcrumb { display:none; } .sub_title { line-height:35px; margin:20px auto; padding:15px 0px; } .sub_title>div>span { font-size:24px; } } #sub_tt {width:100%; text-align:left; font-size:29px; font-weight:bold; font-family:'nanumsquare'; color:#FFF; padding:33px 10px 33px 40px; background:#1261AE; overflow:hidden;} /* 서브메뉴 */ #sub_menu {width:100%; position:relative; margin-top:-63px; background:none; padding:0;} @media all and (max-width:496px) { #sub_menu {margin-top:0px; display:none;} } /* 서브베너 */ #sub_banner {margin-top:40px; margin-bottom:20px; overflow:hidden; clear:both;} /*****************************************************************/ /* 3차 탭메뉴 */ /*****************************************************************/ .sub_tap { max-width:650px; margin-bottom:60px; overflow:hidden; } .sub_tap ul { width:100%; list-style:none; margin:0; padding:0; border-top:#BBBBBB 1px solid; border-left:#BBBBBB 1px solid; border-right:#BBBBBB 1px solid; display:table; table-layout:fixed; overflow:hidden; } .sub_tap li { display:table-cell; vertical-align:middle; height:45px; padding:5px; font-size:17px; color:#555; font-family:'NanumSquare'; letter-spacing:0px; text-align:center; cursor:pointer; border-right:#BBBBBB 1px solid; border-bottom:#BBBBBB 1px solid; background:#F8F8F8; } .sub_tap li:last-child { border-right:none; } .sub_tap li.select { font-size:20px; font-weight:bold; color:#FFFFFF; background:#7C6FBF; border:#7C6FBF 1px solid; } .sub_tap_con1 { display:block; } .sub_tap_con2, .sub_tap_con3, .sub_tap_con4, .sub_tap_con5, .sub_tap_con6 { display:none; } @media only screen and (max-width:496px){ .sub_tap { margin-bottom:40px; } .sub_tap li:last-child { border-right:none; } .sub_tap li.select { font-size:17px; font-weight:normal; } } .tabStyle {border-bottom:2px solid #F30165; margin-bottom:0px;} .tabStyle > ul {list-style:none; margin:0px; padding:0px; overflow:hidden;} .tabStyle > ul > li {float:left; background-color:#fbfbfb; border-top: 4px solid #fff;} .tabStyle > ul > li > a {text-align:center; padding:10px 18px; border-top:1px solid #bcc1c6; border-right:1px solid #bcc1c6; display:block;} .tabStyle > ul > li:first-child > a {border-left:1px solid #bcc1c6;} .tabStyle > ul > li > a span {display:block; line-height:20px; font-size:16px;} .tabStyle > ul > li.active{background-color:#F30165; border-top: 4px solid #F30165;} .tabStyle > ul > li.active a {color:#fff; padding:8px 18px 12px 18px; border-top:1px solid #F30165; border-right: 1px solid #F30165; border-left:1px solid #F30165; background:url(../images/icon_arrow1.png) right center no-repeat;} .tabStyle > ul > li.active a span {font-weight:600;} .tabStyle > ul > li:hover.active a span {color:#fff;} .tabStyle > ul > li:hover a span {color:#333333; text-decoration:underline;} .tabStyle > ul > li.active:hover a span {text-decoration:none;} @media only screen and (max-width:496px){ .tabStyle > ul > li.active a {background:none;} } .tab_01 {width:100%; margin:0 auto 60px auto; overflow:hidden;} .tab_01>ul {list-style:none; margin:0px; padding:0px;} .tab_01>ul>li {float:left; background:#F2F2F2; border:#FFF 1px solid; text-align:center; margin-bottom:0px;} .tab_01>ul>li:hover {background:#EEEEEE;} .tab_01>ul>li>a {font-size:16px; color:#666; letter-spacing:-0.5px; padding:10px; display:block;} .tab_01>ul>li>a:hover {color:#222;} .tab_01>ul>li>a.active {background:#00999C; color:#FFF; font-weight:bold;} .tab_01>ul>li>a.active:hover {color:#FFF;} @media screen and (max-width: 496px) { .tab_01>ul>li {width:100%; margin-bottom:5px; border:#DDD 1px solid;} .tab_01>ul>li>a {padding:5px;} } .tab_02 {width:100%; margin:0 auto 60px auto; overflow:hidden;} .tab_02>ul {list-style:none; margin:0; padding:0px;} .tab_02>ul>li {float:left; background:#F5F5F5; border:#FFF 1px solid; border-radius:60px; text-align:center; margin-bottom:0px;} .tab_02>ul>li:hover {background:#00999C;} .tab_02>ul>li>a {font-size:16px; color:#666; letter-spacing:-0.5px; padding:10px; display:block;} .tab_02>ul>li>a:hover {color:#FFF;} .tab_02>ul>li>a.active {background:#00999C; border-radius:60px; color:#FFF; font-weight:bold;} .tab_02>ul>li>a.active:hover {color:#FFF;} @media screen and (max-width: 496px) { .tab_02>ul>li {width:50%; margin-bottom:5px; border:#DDD 1px solid;} .tab_02>ul>li>a {padding:5px;} } .tab_his {width:100%; margin:0 auto 50px auto; overflow:hidden;} .tab_his>ul {list-style:none; margin:0px; padding:0px;} .tab_his>ul>li {float:left; width:25%; background:#F5F5F5; border-top:#DDD 1px solid; border-bottom:#DDD 1px solid; border-right:#DDD 1px solid; text-align:center; margin-bottom:10px;} .tab_his>ul>li:first-child {border-left:#DDD 1px solid;} .tab_his>ul>li:hover {background:#FAFAFA;} .tab_his>ul>li>a {font-size:17px; color:#666; padding:15px; display:block;} .tab_his>ul>li>a:hover {color:#222;} .tab_his>ul>li>a.active {background:#2D85C4; color:#FFF; font-weight:bold;} .tab_his>ul>li>a.active:hover {color:#FFF;} @media screen and (max-width: 496px) { .tab_his>ul>li {width:100%; margin-bottom:5px; border:#DDD 1px solid;} .tab_his>ul>li>a {padding:5px;} } .tab_menu {width:100%; margin-bottom:30px; clear:both; overflow:hidden; font-size:18px;} .tab_menu_line {height:5px; border-top:#666666 0px solid; margin-bottom:30px; clear:both;} /* 탭 스타일1 */ .tab_menu_box1 {list-style:none; margin:0px; padding:0px;} .tab_menu_box1 li {float:left; margin-right:5px; margin-bottom:5px; display:table;} .tab_menu_box1 li .tab_menu_in {background:#007519; width:237px; border-top:#007519 2px solid; padding:13px 10px 15px 10px; line-height:14px; text-align:center; color:#FFFFFF; font-size:15px; font-weight:bold; display:table-cell; vertical-align:middle; cursor:pointer;} .tab_menu_box1 li .tab_menu_in a:link {color:#FFFFFF; text-decoration:none;} .tab_menu_box1 li .tab_menu_in a:visited {color:#FFFFFF; text-decoration:none;} .tab_menu_box1 li .tab_menu_in a:active {color:#FFFFFF; text-decoration:none;} .tab_menu_box1 li .tab_menu_in a:hover {color:#555555; text-decoration:none;} .tab_menu_box1 li .tab_menu_in_roll {background:#f3f3f3; width:237px; border-top:#007519 2px solid; padding:13px 10px 15px 10px; line-height:14px; text-align:center; color:#555555; font-size:15px; font-weight:bold; display:table-cell; vertical-align:middle; cursor:pointer;} .tab_menu_box1 li .tab_menu_in:hover {background:#f3f3f3; color:#555555; font-size:15px; font-weight:bold; cursor:pointer} .tab_menu_box1 li .tab_menu_in:hover a:link {color:#555555; text-decoration:none;} .tab_menu_box1 li .tab_menu_in:hover a:visited {color:#555555; text-decoration:none;} .tab_menu_box1 li .tab_menu_in:hover a:active {color:#555555; text-decoration:none;} .tab_menu_box1 li .tab_menu_in:hover a:hover {color:#555555; text-decoration:none;} /* 2차메뉴 탭 */ .ss_tab {max-width:1300px; margin:0 auto; overflow:hidden;} .ss_tab>ul {width:100%; list-style:none; margin:0px; padding:0px; border:#06198E 1px solid; border-radius:10px; background:#06198E; display:table; table-layout:fixed; overflow:hidden;} .ss_tab>ul>li {display:table-cell; vertical-align:middle; background:#06198E; text-align:center; font-size:18px; font-weight:bold; font-family:'NanumSquare'; letter-spacing:-0.5px;} .ss_tab>ul>li>a {padding:15px 0px 17px 0px; color:#fff; display:block; border-right:0px solid #d7d7d7; border-top:0px solid #d7d7d7; border-bottom:0px solid #d7d7d7;} .ss_tab>ul>li>a:hover {color:#000; background:#fff;} .ss_tab>ul>li>a.active {background:#fff; border-top:0px solid #00A7FE; border-bottom:0px solid #00A7FE; font-weight:bold; color:#222;} @media screen and (max-width: 496px) { .ss_tab {margin:20px auto;} .ss_tab>ul {display:block; table-layout:auto;} .ss_tab>ul>li {display:block;} .ss_tab>ul>li>a {font-size:16.5px; padding:5px;} } /* 3차메뉴 탭 */ .bo_tab {max-width:1300px; margin:40px auto 0 auto; overflow:hidden;} .bo_tab>ul {width:100%; list-style:none; margin:0px; padding:0px; display:table; table-layout:fixed; overflow:hidden;} .bo_tab>ul>li {display:table-cell; vertical-align:middle; background:#E1F0DE; border-radius:10px; border:#FFF 1px solid; text-align:center; margin-bottom:0px;} .bo_tab>ul>li:hover {background:#fb886f; border-radius:10px;} .bo_tab>ul>li>a {font-size:16.5px; font-family:'NanumSquare'; letter-spacing:-0.5px; color:#333; padding:11px 5px 11px 5px; display:block;} .bo_tab>ul>li>a:hover {color:#fff; background:#fb886f; border-radius:10px;} .bo_tab>ul>li>a.active {background:#88C47C; border-radius:10px; color:#FFF; font-weight:bold;} .bo_tab>ul>li>a.active:hover {color:#FFF;} @media screen and (max-width: 496px) { .bo_tab {margin:20px auto;} .bo_tab>ul {display:block; table-layout:auto;} .bo_tab>ul>li {display:block;} .bo_tab>ul>li>a {font-size:16.5px; padding:5px;} } /* 서브메뉴 탭 갯수 */ /* !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! 아래 수치는 수정하지 말 것 !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */ .col1{} .col1>li {width:100%;} .col1>div>div>div>div {max-width:100%;} .col2{} .col2>li {width:50%;} .col2>div>div>div>div {max-width:50%;} .col3{} .col3>li {width:33.33%;} .col3>div>div>div>div {max-width:33.33%;} .col4{} .col4>li {width:25%;} .col4>div>div>div>div {max-width:25%;} .col5{} .col5>li {width:20%;} .col5>div>div>div>div {max-width:20%;} .col6{} .col6>li {width:16.66%;} .col6>div>div>div>div {max-width:16.66%;} .col7{} .col7>li {width:14.28%;} .col7>div>div>div>div {max-width:14.28%;} .col8{} .col8>li {width:12.5%;} .col8>div>div>div>div {max-width:12.5%;} .col9{} .col9>li {width:11.11%;} .col9>div>div>div>div {max-width:11.11%;} .col10{} .col10>li {width:10%;} .col10>div>div>div>div {max-width:10%;} .col11{} .col11>li {width:9.09%;} .col11>div>div>div>div {max-width:9.09%;} /* !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! 위 수치는 수정하지 말 것 !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */ /*****************************************************************/ /* 내용 타이틀 */ /*****************************************************************/ .title_tea {background:url(../images/icon_37.gif) no-repeat 0 4px; padding-left:35px; margin-bottom:10px; font-weight:600; font-size:24px; color:#333333; text-align:left; overflow:hidden;} .title_tea2 {background:url(../images/icon_40.gif) no-repeat 0 5px; padding-left:15px; margin-bottom:0px; font-weight:600; font-size:19px; color:#333333; text-align:left; overflow:hidden;} .title_com {font-size:19px; color:#F16F1C; text-align:left; margin-bottom:10px; overflow:hidden;} .title_txt {margin-bottom:10px; font-weight:600; font-size:24px; color:#333333; text-align:left; overflow:hidden;} .title_t1 {background:url(../images/sub_t1_1.png) no-repeat center top; padding-top:40px; margin-bottom:30px; font-size:30px; font-weight:700; font-family:'nanumsquare'; color:#333333; text-align:center; overflow:hidden;} .title_t2 {background:url(../images/sub_t1_2.png) no-repeat center top; padding-top:40px; margin-bottom:30px; font-size:30px; font-weight:700; font-family:'nanumsquare'; color:#333333; text-align:center; overflow:hidden;} /* 내용 단락 */ .content_01 {margin:20px 0px 80px 0px; font-size:18px; line-height:160%; clear:both; overflow:hidden;} .content_01 a:link {color:#0066CC; text-decoration:none;} .content_01 a:visited {color:#0066CC; text-decoration:none;} .content_01 a:active {color:#0066CC; text-decoration:none;} .content_01 a:hover {color:#FF0000; text-decoration:none;} @media only screen and (max-width:496px){ .content_02 {margin:10px 0px 40px 0px;} } .content_02 {margin:20px 0px 80px 20px; font-size:18px; line-height:160%; clear:both; overflow:hidden;} .content_02 a:link {color:#0066CC; text-decoration:none;} .content_02 a:visited {color:#0066CC; text-decoration:none;} .content_02 a:active {color:#0066CC; text-decoration:none;} .content_02 a:hover {color:#FF0000; text-decoration:none;} @media only screen and (max-width:496px){ .content_02 {margin:10px 0px 40px 0px;} } .content_03 {margin:10px 0px 50px 0px; font-size:18px; line-height:160%; clear:both; overflow:hidden;} .content_03 a:link {color:#0066CC; text-decoration:none;} .content_03 a:visited {color:#0066CC; text-decoration:none;} .content_03 a:active {color:#0066CC; text-decoration:none;} .content_03 a:hover {color:#FF0000; text-decoration:none;} @media only screen and (max-width:496px){ .content_03 {margin:10px 0px 30px 0px;} } .content_04 {margin:20px 0px 30px 20px; font-size:18px; line-height:160%; clear:both; overflow:hidden;} .content_04 a:link {color:#0066CC; text-decoration:none;} .content_04 a:visited {color:#0066CC; text-decoration:none;} .content_04 a:active {color:#0066CC; text-decoration:none;} .content_04 a:hover {color:#FF0000; text-decoration:none;} @media only screen and (max-width:496px){ .content_04 {margin:10px 0px 20px 0px;} } .content_box00 {border:#D9D9D9 1px solid; padding:50px 40px; margin:20px 0px 80px 0px; font-size:18px; line-height:170%; overflow:hidden;} .content_box01 {border:#DDD 1px solid; background:#FCFCFC; padding:30px 40px; margin:20px 0px 60px 0px; text-align:center; font-size:22px; line-height:35px; overflow:hidden;} .content_box02 {background:#F6F6F6; padding:25px 30px; margin:20px 0px 80px 0px; font-size:18px; line-height:170%; overflow:hidden;} .content_box02_end {background:#F6F6F6; padding:25px 30px; margin:20px 0px 0px 0px; font-size:18px; line-height:170%; overflow:hidden;} .content_box03 {background:#F3F8FC; padding:30px 20px; margin:0px 0px 60px 0px; font-size:22px; line-height:150%; text-align:center; overflow:hidden;} .content_box04 {border:#DDD 1px solid; border-radius:8px; background:#FAFAFA; padding:20px 25px; margin:20px 0px 80px 0px; font-size:18px; line-height:170%; overflow:hidden;} .content_box05 {border:#DDD 1px solid; background:#FAFAFA; padding:10px 25px; margin:10px 0px 25px 20px; font-size:18px; line-height:170%; overflow:hidden;} .content_box06 {background:#F0F3F8; border:#D7D8DC 2px dashed; padding:15px 30px; margin:20px 0px 80px 0px; font-size:20px; font-family:'nanumsquare'; line-height:170%; overflow:hidden;} @media only screen and (max-width:496px){ .content_box00 {border:none; padding:0px; margin:20px 0px 50px 0px; } .content_box01 {padding:20px 20px; margin-bottom:40px; text-align:center; font-size:18px; line-height:30px; overflow:hidden;} .content_box02 {padding:20px 15px; margin:10px 0px 50px 0px;} .content_box03 {padding:20px 15px; margin:0px 0px 40px 0px; font-size:18px; text-align:justify;} .content_box03>br {display:none;} .content_box04 {padding:20px 15px; margin:10px 0px 40px 0px;} .content_box06 {padding:20px 15px; margin:10px 0px 40px 0px; font-size:18px;} } /* 종목소개 */ .title_dance1 {background:url(../images/sub_t1_1.png) no-repeat center top; padding-top:40px; margin-bottom:30px; font-family:'nanumsquare'; text-align:center; overflow:hidden;} .title_dance1>h3 {font-size:36px; font-weight:bold; color:#EE2978; margin-top:5px;} .title_dance1>h4 {font-size:28px; color:#8A8A8A; margin-top:0;} .title_dance2 {background:url(../images/sub_t1_2.png) no-repeat center top; padding-top:40px; margin-bottom:30px; font-family:'nanumsquare'; text-align:center; overflow:hidden;} .title_dance2>h3 {font-size:36px; font-weight:bold; color:#1C68C8; margin-top:5px;} .title_dance2>h4 {font-size:28px; color:#8A8A8A; margin-top:0;} .title_dance3 {background:url(../images/sub_t1_3.png) no-repeat center top; padding-top:40px; margin-bottom:30px; font-family:'nanumsquare'; text-align:center; overflow:hidden;} .title_dance3>h3 {font-size:36px; font-weight:bold; color:#8C1AC7; margin-top:5px;} .title_dance3>h4 {font-size:28px; color:#8A8A8A; margin-top:0;} .title_dance_so {font-weight:600; font-size:24px; text-align:left; overflow:hidden;} .title_dance_so>span.c1 {color:#EE2978;} .title_dance_so>span.c2 {color:#1C68C8;} .title_dance_so>span.c3 {color:#8C1AC7;} .content_dance01 {border:#D9D9D9 1px solid; padding:25px 30px; margin:5px 0px 40px 0px; font-size:20px; line-height:170%; text-align:justify; overflow:hidden;} .content_dance02 {margin:5px 0px 40px 0px; font-size:20px; line-height:170%; text-align:justify; overflow:hidden;} .content_dance02>dl {color:#FFFFFF; margin-top:25px; padding:5px 30px; overflow:hidden;} .content_dance02>dl.bg1 {background:#EE2978;} .content_dance02>dl.bg2 {background:#1C68C8;} .content_dance02>dl.bg3 {background:#8C1AC7;} .content_dance02>dl>dt {float:left; width:18%; padding-right:20px; font-weight:bold; border-right:#FFFFFF 1px solid;} .content_dance02>dl>dd {float:left; width:82%; padding-left:20px;} .content_dance02>div.bora {background:#8C1AC7; color:#FFFFFF; text-align:center; margin-top:20px; padding:30px 20px; overflow:hidden;} .content_dance02>div.bora>h3 {font-size:28px; font-weight:bold; margin:0 0 10px 0;} .content_dance02>div.bora>p {font-size:19px;} .content_dance02>div.bora>ul {list-style:none; margin:30px 0 0 0; padding:0; overflow:hidden;} .content_dance02>div.bora>ul>li {float:left; width:50%; padding:0 50px;} .content_dance02>div.bora>ul>li:nth-child(1) {text-align:right;} .content_dance02>div.bora>ul>li:nth-child(2) {text-align:left;} .content_dance02>div.bora>ul>li>span {background:#600D8B; border-radius:50px; padding:5px 30px; margin-right:15px; display:inline-block; font-weight:bold;} @media only screen and (max-width:496px){ .content_dance01 {padding:15px; font-size:18px; line-height:160%;} .content_dance02 {font-size:18px; line-height:160%;} .content_dance02>dl {padding:10px 15px;} .content_dance02>dl>dt {float:none; width:100%; padding-right:0; border-right:none; margin-bottom:10px;} .content_dance02>dl>dd {float:nne; width:100%; padding-left:0;} .content_dance02>div.bora>ul>li {float:none; width:100%; padding:0; margin-bottom:25px; text-align:center !important} .content_dance02>div.bora>ul>li>span {display:block; margin:0 0 10px 0;} } /*****************************************************************/ /* 내용 꾸미기 */ /*****************************************************************/ .list_dot {list-style:disc; margin:0; padding-left:25px;} .list_dot>li {margin-bottom:2px;} .list_dot>li>ul {list-style:none; padding:0px; margin:0 0 10px 5px;} .list_dot>li>ul>li {background:url(../images/icon_21.gif) no-repeat 0 12px; padding-left:13px; margin-bottom:0px; font-size:17px; color:#333; line-height:150%;} .list_dot>li>ol {list-style:decimal; padding:0px; margin:0 0 10px 25px;} .list_dot>li>ol>li {padding-left:2px; margin-bottom:0px; font-size:17px; color:#333; line-height:150%;} @media only screen and (max-width:496px){ .list_dot {font-size:16px; line-height:140%; padding-left:15px;} } .list_dot2 {margin:0; padding-left:30px;} .list_dot2>li {margin-bottom:15px;} .list_dot2>li>ul {list-style:none; padding:0px; margin:0 0 10px 5px;} .list_dot2>li>ul>li {background:url(../images/icon_21.gif) no-repeat 0 12px; padding-left:13px; margin-bottom:0px; font-size:16px; color:#333;} .list_dot5 {list-style:none; padding:0px; margin:5px 0 0 5px;} .list_dot5>li {background:url(../images/icon_20.gif) no-repeat 0 15px; padding-left:10px; margin-bottom:5px;} .list_dot5>li>ul {list-style:none; padding:0px; margin:0 0 10px 5px;} .list_dot5>li>ul>li {background:url(../images/icon_21.gif) no-repeat 0 12px; padding-left:13px; margin-bottom:0px; font-size:16px; color:#333;} .list_pink {list-style:none; width:100%; margin:0 auto; padding:0; overflow:hidden;} .list_pink>li {float:none; width:100%; margin-bottom:10px; font-size:28px; font-family:'nanumsquare'; line-height:150%;} .list_pink>li>span {color:#EE2978;} @media only screen and (max-width:496px){ .list_pink {width:100%;} .list_pink>li {font-size:20px;} } .list_ro {list-style:none; padding:0px; margin:5px 0 0 5px; overflow:hidden;} .list_ro>li {margin-bottom:5px; clear:both; position:relative;} .list_ro>li>b {background:#006699; border-radius:100px; padding:5px 20px; margin-right:20px; font-size:19px; font-weight:bold; color:#FFFFFF;} .list_ro>li>span {display:inline-block;} .list_dl {} .list_dl>dt {margin-bottom:10px; font-size:22px; font-weight:bold; color:#336699;} .list_dl>dd {margin-bottom:20px;} .step_service>ol {list-style:none; padding:0px; margin:0px; overflow:hidden;} .step_service>ol>li {background:url(../images/step_p.png) right 5px no-repeat; margin-bottom:10px; margin-right:10px; width:30%; float:left; display:inline-block;} .step_service>ol>li:last-child {background:none;margin-right:0px;} .step_service>ol>li>p {text-align:center; padding:10px; border:1px solid #d9c0c0; background:#faf8f8; width:92%; display:inline-block;} @media only screen and (max-width:496px){ .step_service>ol>li {background:url(../images/step_p1.png) center bottom no-repeat; padding-bottom:30px; margin-bottom:10px; margin-right:0; width:100%; float:none;} .step_service>ol>li>p {width:100%;} } .list_num {list-style:decimal; margin:0; padding-left:25px;} .list_num>li {padding-bottom:5px; text-align:justify;} .list_num2 {list-style:decimal; margin:0; padding-left:25px;} .list_num2>li {margin-bottom:15px; text-align:justify;} .list_num_bold {list-style:decimal; margin:0; padding-left:25px;} .list_num_bold>li {margin-bottom:5px; text-align:justify; font-size:18px; font-weight:bold;} .list_num_bold>div {margin-bottom:15px;} .list_no {list-style:none; padding:0px; margin:0;} .list_no>li {background:none; padding-left:10px; padding-bottom:0px;} .list_no2 {list-style:none; padding:0px; margin:0 0 0 0px;} .list_no2>li {background:none; padding-bottom:0px;} .list_check {list-style:none; padding:0px; margin:0 0 0 5px;} .list_check>li {background:url(../images/icon_check1.png) no-repeat 0 5px; padding-left:30px; padding-bottom:10px;} .list_red {list-style:none; padding:0px; margin:0 0 0 3px;} .list_red>li {background:url(../images/icon_06.gif) no-repeat 0 9px; padding-left:10px; margin-bottom:15px;} .list_red>li>b { font-weight:normal; color:#001E7F;} .list_red>li>ul {list-style:none; padding:0px; margin:0 0 0 5px;} .list_red>li>ul>li {background:url(../images/icon_20.gif) no-repeat 0 12px; padding-left:10px; margin-bottom:0px;} .list_red2 {list-style:none; padding:0px; margin:5px 0 0 5px;} .list_red2>li {background:url(../images/icon_25.gif) no-repeat 0 5px; padding-left:24px; margin-bottom:20px;} .list_left {list-style:none; padding:0px; margin:0px; clear:both;} .list_left>li {float:left;} .list_top {list-style:none; padding:0px; margin:0px; clear:both;} .list_top>li img {display:block;} .li_mb20>li {margin-bottom:20px;} .hidden {display:none;} .ddam_start {background:url(../images/icon_ddam_start.png) no-repeat left top; opacity:0.5; padding-left:25px;} .ddam_end {background:url(../images/icon_ddam_end.png) no-repeat right top; opacity:0.5; padding-left:25px;} .sm_ddaum {text-align:center; font-size:33px; line-height:160%;} .sm_ddaum>span:first-child {background:url(../images/icon_ddam_start.png) no-repeat left top; opacity:0.5; padding-left:25px;} .sm_ddaum>span:last-child {background:url(../images/icon_ddam_end.png) no-repeat right top; opacity:0.5; padding-left:25px;} .sm_ddaum b {font-weight:bold; color:#F06;} @media only screen and (max-width:496px){ .sm_ddaum {font-size:18px; line-height:180%;} .sm_ddaum br {display:none;} .sm_ddaum>span {display:none;} } .icon_more {font-size:20px; color:#FF6699;} .sm_box1 { border:#CCCCCC 1px solid; font-size:16px; overflow:hidden; display:inline-block;} .sm_box1 > dl > dt {float:left; background:#333333; color:#FFFFFF; text-align:center; padding:10px; } .sm_box1 > dl > dd {float:left; text-align:center; padding:10px 20px;} .fc_red {color:#FF0000;} .fc_blue {color:#0033CC;} .fc_01 {color:#000;} .fc_02 {color:#E87D08;} .fc_03 {color:#255E65;} .fc_04 {color:#692E99;} .fc_05 {color:#C75252;} .fc_06 {color:#D95731;} .fs_sm {font-size:14px;} .mt_5 {margin-top:5px;} .mt_10 {margin-top:10px;} .mt_15 {margin-top:15px;} .mb_5 {margin-bottom:5px;} .mb_10 {margin-bottom:10px;} .mb_15 {margin-bottom:15px;} .center {text-align:center;} pre {background:none; border:none; margin:0; padding:0; font-size:16px; font-family:inherit;} .sm_img {} .sm_img>.sm_img_mobile {display:none;} @media screen and (max-width: 496px) { .sm_img>img {display:none;} .sm_img>.sm_img_mobile {display:block;} } /* 라인 */ .sm_line {border-bottom:#DDD 2px dashed; margin:60px 0;} /* 헤드라인 */ .sm_headline {background:url(../images/icon_40.gif) no-repeat left #F8F8F8; padding:10px 20px; display:block;} /* 절차탭 */ .sm_step {list-style:none; padding:0; margin:0 0 20px 0; overflow:hidden;} .sm_step>li {float:left; width:32.5%; height:130px; padding:0 30px 0 0; margin:0 0 10px 8px; background:url(../images/sm_step5.gif) right no-repeat; display:table;} .sm_step>li:last-child {background:none;} .sm_step>li>div {border:#ccc 1px solid; border-radius:20px; text-align:center; font-size:15px; line-height:20px; padding:10px 10px; display:table-cell; vertical-align:middle;} .sm_step>li>div>p {font-size:22px; line-height:150%; display:block;} @media only screen and (max-width:496px){ .sm_step>li {float:none; width:100%; height:auto; padding:0 0 30px 0; margin:0 0 10px 0; background:url(../images/sm_step6.gif) bottom no-repeat;} } /* 절차탭2 */ .sm_step2 {list-style:none; width:100%; margin:0 0 10px 0 !important; padding:0; border-left:#d6d6d6 1px solid; border-top:#d6d6d6 1px solid; display:table; table-layout:fixed; overflow:hidden;} .sm_step2>li {border-right:#d6d6d6 1px solid; border-bottom:#d6d6d6 1px solid; background:#FFF; display:table-cell; vertical-align:top;} .sm_step2>li>div {text-align:center; padding:20px 10px;} .sm_step2>li>div>b {font-size:19px; line-height:140%; color:#707070; margin-bottom:15px; display:block;} .sm_step2>li>div>img {margin-bottom:15px; display:inline-block;} .sm_step2>li>div>p {font-size:19px; line-height:130%; letter-spacing:-0.5px; display:block;} @media only screen and (max-width:496px){ .sm_step2>li {width:100%; display:inline-block;} .sm_step2>li>div {padding:10px 10px;} .sm_step2>li>div>b {margin-bottom:5px;} /*.sm_step2>li>div>img {display:none;}*/ .sm_step2>li>div>p {font-size:17px;} .sm_step2>li br {display:none;} } /* 절차탭3 */ .sm_step3 {list-style:none; padding:0; margin:10px auto 20px auto; overflow:hidden;} .sm_step3>li {float:left; width:225px; height:130px; padding:0 30px 0 0; margin:0 0 10px 8px; background:url(../images/sm_step5.gif) right no-repeat; display:table;} .sm_step3>li:first-child {margin:0 0 10px 0px;} .sm_step3>li:last-child {background:none;} .sm_step3>li>div {border-radius:10px; background:#019EBF; text-align:center; font-size:22px; font-weight:bold; line-height:130%; color:#FFFFFF; padding:10px 10px; display:table-cell; vertical-align:middle;} @media only screen and (max-width:496px){ .sm_step3>li {float:none; width:100%; height:auto; padding:0 0 30px 0; margin:0 0 10px 0; background:url(../images/sm_step6.gif) bottom no-repeat;} .sm_step3>li>div {border-radius:10px; font-size:18px;} .sm_step3>li>div>br {display:none;} } /* 절차탭6 */ .sm_step6 {list-style:none; padding:0; margin:10px auto 20px auto; overflow:hidden;} .sm_step6>li {float:left; width:195px; height:130px; padding:0 30px 0 0; margin:0 0 10px 8px; background:url(../images/sm_step5.gif) right no-repeat; display:table;} .sm_step6>li:first-child {margin:0 0 10px 0px;} .sm_step6>li:last-child {background:none;} .sm_step6>li>div {border-radius:10px; background:#019EBF; text-align:center; font-size:22px; font-weight:bold; line-height:130%; color:#FFFFFF; padding:10px 10px; display:table-cell; vertical-align:middle;} @media only screen and (max-width:496px){ .sm_step6>li {float:none; width:100%; height:auto; padding:0 0 30px 0; margin:0 0 10px 0; background:url(../images/sm_step6.gif) bottom no-repeat;} .sm_step6>li>div {border-radius:10px; font-size:18px;} .sm_step6>li>div>br {display:none;} } /* 절차탭10 */ .sm_step10 {list-style:none; padding:0; margin:10px auto 20px auto; overflow:hidden;} .sm_step10>li {float:left; width:230px; height:130px; padding:0 0 0 30px; margin:0 8px 15px 0; background:url(../images/sm_step5.gif) left no-repeat; display:table;} .sm_step10>li:first-child {width:200px; padding:0; background:none;} .sm_step10>li:last-child {margin:0 0 15px 0;} .sm_step10>li>div {border-radius:10px; background:#019EBF; text-align:center; font-size:22px; font-weight:bold; line-height:130%; color:#FFFFFF; padding:10px 10px; display:table-cell; vertical-align:middle;} @media only screen and (max-width:496px){ .sm_step10>li {float:none; width:100% !important; height:auto; padding:0 0 30px 0; margin:0 0 10px 0; background:url(../images/sm_step6.gif) bottom no-repeat;} .sm_step10>li:first-child {background:url(../images/sm_step6.gif) bottom no-repeat; padding:0 0 30px 0; margin:0 0 10px 0;} .sm_step10>li:last-child {background:none;} .sm_step10>li>div {border-radius:10px; font-size:18px;} .sm_step10>li>div>br {display:none;} } /* 절차탭-사업모형 */ .sm_step_mo {list-style:none; padding:0; margin:30px auto 20px auto; overflow:hidden;} .sm_step_mo>li {float:left; width:25%; height:130px; padding:0 15px; margin:0 0 10px 0px; display:table;} .sm_step_mo>li>div {border-radius:10px; background:#1D9EE1; text-align:center; font-size:22px; font-weight:bold; line-height:130%; color:#FFFFFF; padding:10px 10px; display:table-cell; vertical-align:middle;} .sm_step_mo>li:first-child>div {background:#1676A9;} @media only screen and (max-width:496px){ .sm_step_mo>li {float:none; width:100%; height:auto; padding:0 0 30px 0; margin:0 0 10px 0;} .sm_step_mo>li>div {border-radius:10px; font-size:18px;} .sm_step_mo>li>div>br {display:none;} } /* 절차탭-이용절차 */ .sm_step_iyong {list-style:none; padding:0; margin:30px auto 20px auto; overflow:hidden;} .sm_step_iyong>li {float:left; width:230px; height:140px; padding:0 0 0 25px; margin:0 15px 10px 0px; display:table; background:url(../images/sm_step1.png) left no-repeat;} .sm_step_iyong>li:first-child {width:205px; padding:0; background:none;} .sm_step_iyong>li>div {border-radius:10px; background:#F3F3F3; text-align:center; font-size:22px; font-weight:bold; line-height:130%; padding:10px 10px; display:table-cell; vertical-align:middle;} @media only screen and (max-width:496px){ .sm_step_iyong>li {float:none; width:100% !important; height:auto; padding:0 0 20px 0; margin:0 0 7px 0; background:url(../images/sm_step2.png) bottom no-repeat;} .sm_step_iyong>li:first-child {background:url(../images/sm_step2.png) bottom no-repeat; padding:0 0 20px 0; margin:0 0 7px 0;} .sm_step_iyong>li:last-child {background:none;} .sm_step_iyong>li>div {border-radius:10px; font-size:18px;} .sm_step_iyong>li>div>br {display:none;} } /* 절차탭-기관방문 */ .sm_step_bang {list-style:none; padding:0; margin:30px auto 20px auto; overflow:hidden;} .sm_step_bang>li {float:left; width:290px; height:140px; padding:0 0 0 25px; margin:0 15px 10px 0px; display:table; background:url(../images/sm_step1.png) left no-repeat;} .sm_step_bang>li:first-child {width:265px; padding:0; background:none;} .sm_step_bang>li>div {border-radius:10px; background:#F3F3F3; text-align:center; font-size:22px; font-weight:bold; line-height:130%; padding:10px 10px; display:table-cell; vertical-align:middle;} @media only screen and (max-width:496px){ .sm_step_bang>li {float:none; width:100% !important; height:auto; padding:0 0 20px 0; margin:0 0 7px 0; background:url(../images/sm_step2.png) bottom no-repeat;} .sm_step_bang>li:first-child {background:url(../images/sm_step2.png) bottom no-repeat; padding:0 0 20px 0; margin:0 0 7px 0;} .sm_step_bang>li:last-child {background:none;} .sm_step_bang>li>div {border-radius:10px; font-size:18px;} .sm_step_bang>li>div>br {display:none;} } /* 절차탭-참여 */ .sm_step_cham {list-style:none; padding:0; margin:30px auto 20px auto; overflow:hidden;} .sm_step_cham>li {float:left; width:33.33%; height:140px; padding:0 15px; margin:0 0 20px 0px; display:table;} .sm_step_cham>li>div {border-radius:8px; background:#2A9679; text-align:center; font-size:20px; font-weight:bold; line-height:140%; color:#FFFFFF; padding:10px 10px; display:table-cell; vertical-align:middle;} .sm_step_cham>li>div>b {display:block; font-size:36px; margin-bottom:15px;} @media only screen and (max-width:496px){ .sm_step_cham>li {float:none; width:100%; height:auto; margin:0 0 10px 0;} .sm_step_cham>li>div {border-radius:10px; font-size:18px;} } /* 절차탭-통장지원내용 */ .sm_step_tong {list-style:none; padding:0; margin:30px auto 20px auto; overflow:hidden;} .sm_step_tong>li {float:left; height:140px; padding:0; margin:0 0 20px 0px; display:table;} .sm_step_tong>li:nth-child(odd) {width:30%;} .sm_step_tong>li:nth-child(even) {width:5%;} .sm_step_tong>li:nth-child(even)>div {background:#FFF; color:#555;} .sm_step_tong>li>div {border-radius:8px; background:#2A9679; text-align:center; font-size:20px; font-weight:bold; line-height:140%; color:#FFFFFF; padding:10px 10px; display:table-cell; vertical-align:middle;} @media only screen and (max-width:496px){ .sm_step_tong>li {float:none; width:100% !important; height:auto; margin:0;} .sm_step_tong>li>div {border-radius:10px; font-size:18px;} } /* 절차탭-통장지원내용5 */ .sm_step_tong5 {list-style:none; padding:0; margin:30px auto 20px auto; overflow:hidden;} .sm_step_tong5>li {float:left; height:150px; padding:0; margin:0 0 20px 0px; display:table;} .sm_step_tong5>li:nth-child(odd) {width:17%;} .sm_step_tong5>li:nth-child(even) {width:2.5%;} .sm_step_tong5>li:nth-child(even)>div {background:#FFF; color:#555;} .sm_step_tong5>li>div {border-radius:8px; background:#2A9679; text-align:center; font-size:20px; font-weight:bold; line-height:140%; color:#FFFFFF; padding:10px 10px; display:table-cell; vertical-align:middle;} @media only screen and (max-width:496px){ .sm_step_tong5>li {float:none; width:100% !important; height:auto; margin:0;} .sm_step_tong5>li>div {border-radius:10px; font-size:18px;} } /* 인포그래픽01 */ .sm_graphic_01 {width:100%; display:table; table-layout:fixed; list-style:none; margin:10px 0 0; padding:0; font-family:'nanumsquare'; overflow:hidden;} .sm_graphic_01>li {display:table-cell; text-align:center; padding:0 20px;} .sm_graphic_01>li>div {min-height:2px; background:#F8F8F8; border-radius:15px; overflow:hidden;} .sm_graphic_01>li>div>h3 {color:#FFFFFF; font-size:23px; font-weight:bold; margin:0; padding:10px;} .sm_graphic_01>li:nth-child(1)>div>h3 {background:#fabf01;} .sm_graphic_01>li:nth-child(2)>div>h3 {background:#41aec5;} .sm_graphic_01>li:nth-child(3)>div>h3 {background:#238af1;} .sm_graphic_01>li:nth-child(4)>div>h3 {background:#015cd1;} .sm_graphic_01>li:nth-child(5)>div>h3 {background:#003c94;} .sm_graphic_01>li>div>p {padding:10px;} @media only screen and (max-width:496px){ .sm_graphic_01>li {display:block; margin-bottom:15px;} .sm_graphic_01>li>div {min-height:inherit;} .sm_graphic_01>li>div>h3 {padding:10px;} } /* 인포그래픽02 */ .sm_graphic_02 {width:100%; display:table; table-layout:fixed; list-style:none; margin:10px 0 0; padding:0; font-family:'nanumsquare'; overflow:hidden;} .sm_graphic_02>li {display:table-cell; text-align:center; padding:0 20px;} .sm_graphic_02>li>div {min-width:170px; height:170px; padding:10px; display:table-cell; vertical-align:middle; border-radius:100% 100%; overflow:hidden;} .sm_graphic_02>li:nth-child(1)>div {border:#F480A9 10px solid;} .sm_graphic_02>li:nth-child(2)>div {border:#FAC271 10px solid;} .sm_graphic_02>li:nth-child(3)>div {border:#80DAB4 10px solid;} .sm_graphic_02>li:nth-child(4)>div {border:#66B7F5 10px solid;} .sm_graphic_02>li:nth-child(5)>div {border:#B89CE2 10px solid;} .sm_graphic_02>li>div>p {padding:10px;} @media only screen and (max-width:496px){ .sm_graphic_02>li {display:block; margin-bottom:15px;} .sm_graphic_02>li>div {margin:0 auto; display:inline-block;} .sm_graphic_02>li>div>p {padding-top:25%;} } /* 인포그래픽03 */ .sm_graphic_03 {width:100%; display:table; table-layout:fixed; list-style:none; margin:10px 0 0; padding:0; font-family:'nanumsquare'; overflow:hidden;} .sm_graphic_03>li {display:table-cell; text-align:center; padding:0 10px;} .sm_graphic_03>li>div {min-width:200px; height:200px; padding:10px; display:table-cell; vertical-align:middle; border-radius:100% 50%; overflow:hidden;} .sm_graphic_03>li:nth-child(1)>div {border-top:#69C89C 15px solid;} .sm_graphic_03>li:nth-child(2)>div {border-top:#5BD0DA 15px solid;} .sm_graphic_03>li:nth-child(3)>div {border-top:#42A8D9 15px solid;} .sm_graphic_03>li:nth-child(4)>div {border-top:#2F89D7 15px solid;} .sm_graphic_03>li:nth-child(5)>div {border-top:#4A73A1 15px solid;} .sm_graphic_03>li>div>p {padding:10px;} @media only screen and (max-width:496px){ .sm_graphic_03>li {display:block; margin-bottom:15px;} .sm_graphic_03>li>div {height:auto; min-height:200px; margin:0 auto; display:inline-block;} .sm_graphic_03>li>div>p {padding-top:25%;} } /* 내용 반반 */ .sm_half {width:100%; overflow:hidden;} .sm_half>div {float:left; width:50%; overflow:hidden;} @media only screen and (max-width:496px){ .sm_half>div {float:none; width:100%;} } /* 모바일에서 안보이게 */ @media only screen and (max-width:496px){ .sm_mobile_hidden {float:none; display:none;} } /* 모바일에서만 보이게 */ @media screen and (min-width: 497px) { .sm_mobile {display:none;} } a.un-download { display: inline-block; padding: 20px 22px 20px 80px; margin: 10px; background-color: #f8f8f8; color: #333; border: 1px #ddd solid; font-size: 16px; line-height: 26px; font-weight: 700; text-align: center; background-position:20px 50%; background-repeat:no-repeat; background-image: url(../images/icon_dn1.png); } a.un-download span { display: inline-block; min-width: 196px; border-left: 1px #ddd solid; padding-left: 0px; line-height: 20px; } /*********************************************************************************************************************************************/ /*********************************************************************************************************************************************/ /*********************************************************************************************************************************************/ /*********************************************************************************************************************************************/ /*********************************************************************************************************************************************/ /*****************************************************************/ /* 내용 디자인 */ /*****************************************************************/ /* 인사말 */ .sm_ceo {width:100%; font-family:'nanumsquare'; background:url(../images/sm_ceo_bg.png) no-repeat top left; position:relative; overflow:hidden;} .sm_ceo>div {float:left; overflow:hidden;} .sm_ceo>div:nth-child(1) {width:25.92%; padding-bottom:15%; background:#F7F4F0; text-align:center;} .sm_ceo>div:nth-child(2) {width:74.08%; padding-left:30px;} .sm_ceo>div>h3 {font-size:40px; font-weight:bold; line-height:140%; letter-spacing:-1.5px; color:#B4895E; margin-top:0; margin-bottom:30px;} .sm_ceo>div>h3>b {font-size:38px;} .sm_ceo>div>p {font-size:23px; text-align:justify; letter-spacing:-1px; line-height:170%; margin-bottom:30px;} .sm_ceo>div>div {font-size:24px; font-weight:bold; text-align:right; line-height:220%; margin-top:50px;} @media only screen and (max-width:496px){ .sm_ceo {background:none;} .sm_ceo>div {float:none; width:100% !important;} .sm_ceo>div:nth-child(1) {padding-bottom:40px; background:none;} .sm_ceo>div:nth-child(2) {padding-left:0;} .sm_ceo>div>h3 {font-size:24px;} .sm_ceo>div>p {font-size:17px;} .sm_ceo>div>p>br {display:none;} .sm_ceo>div>div {font-size:20px; line-height:180%;} .sm_ceo>div img {max-width:100%;} } /* 법인소개 */ .sm_bubin {margin-top:20px; font-family:'nanumsquare'; overflow:hidden;} .sm_bubin>div {width:100%; height:190px; margin-bottom:100px; text-align:center; background:url(../images/busi_title_bg.png) no-repeat center; display:table; overflow:hidden;} .sm_bubin>div>div {font-size:22px; line-height:170%; display:table-cell; vertical-align:middle;} .sm_bubin>div>div>h3 {font-size:34px; margin-top:-30px; margin-bottom:15px;} .sm_bubin>div>div font {font-size:28px;} .sm_bubin>div>div font.c1 {color:#FDBF00;} .sm_bubin>div>div font.c2 {color:#A28CF8;} .sm_bubin>div>div font.c3 {color:#3CB1C7;} .sm_bubin>div>div font.c4 {color:#2FA2F3;} .sm_bubin>ul {list-style:none; width:100%; margin:0 auto; padding:0; overflow:hidden;} .sm_bubin>ul>li {margin-bottom:25px; overflow:hidden;} .sm_bubin>ul>li:last-child {margin-bottom:0px;} .sm_bubin>ul>li>div {float:left; overflow:hidden;} .sm_bubin>ul>li>div:nth-child(1) {width:10%; text-align:right; padding-right:15px;} .sm_bubin>ul>li>div:nth-child(2) {width:90%; font-size:18px; line-height:170%; text-align:justify;} .sm_bubin>ul>li>div:nth-child(2)>b {font-size:28px; line-height:120%; margin-bottom:10px; display:block;} @media only screen and (max-width:496px){ .sm_bubin>ul {width:100%;} .sm_bubin>ul>li {margin-bottom:20px;} .sm_bubin>ul>li>div:nth-child(1) {width:20%; padding-right:10px;} .sm_bubin>ul>li>div:nth-child(2) {width:80%; font-size:16px; line-height:150%;} .sm_bubin>ul>li>div:nth-child(2)>b {font-size:24px;} } /* 법인소개2 */ .sm_bubin2 {font-size:18px; font-family:'nanumsquare'; line-height:160%; text-align:justify; overflow:hidden;} .sm_bubin2>div {float:left; margin-bottom:30px; overflow:hidden;} .sm_bubin2>div:nth-child(1) {width:44%; text-align:center;} .sm_bubin2>div:nth-child(2) {width:56%;} @media only screen and (max-width:496px){ .sm_bubin2>div {float:none; width:100% !important;} } /* 미션비전 */ .sm_mission {width:90%; margin:0 auto; overflow:hidden;} .sm_mission>div {width:90%; padding:25px; margin-bottom:20px; overflow:hidden;} .sm_mission>div>dl {margin:0; padding:0;} .sm_mission>div>dl>dt {font-size:40px; font-weight:bold; letter-spacing:-1px; display:inline-block;} .sm_mission>div>dl>dd {margin-left:100px; display:inline-block; font-size:18px;} .sm_mission>.mission {background:#F8F8F8; border-left:#E4A237 4px solid;} .sm_mission>.vision {background:#F0F0F0; border-left:#0099CC 4px solid; float:right;} .sm_mission>.slogan {background:#F8F8F8; border-left:#E76A4E 4px solid;} @media only screen and (max-width:496px){ .sm_mission>div {width:100%;} .sm_mission>div>dl>dd {margin-left:0px;} .sm_mission>.vision {float:none;} } /* 법인CI */ .sm_ci {width:100%; margin-bottom:30px; position:relative; overflow:hidden;} .sm_ci>div {width:100%; text-align:center; margin-bottom:25px; padding:20px; background:url(../images/sm_ci_bg.png); overflow:hidden;} @media only screen and (max-width:496px){ .sm_ci>div {margin-bottom:15px;} .sm_ci>br {display:none;} } /* 정관, 규정 */ .sm_jeonggwan {width:100%; overflow:hidden;} .sm_jeonggwan>h3 {font-size:36px; font-weight:bold; text-align:center; margin-bottom:50px;} .sm_jeonggwan>h4 {font-size:24px; text-align:center; background:#f4f4f4; padding:10px;} .sm_jeonggwan>p {font-size:18px; padding:30px 0;} @media only screen and (max-width:496px){ } /* 공공기관 리스트 */ .sm_brand {width:100%; overflow:hidden;} .sm_brand>img { border:#efefef 1px solid; margin-bottom:15px; margin-right:10px;} @media only screen and (max-width:496px){ } /* 사업기관 */ .sm_saki {width:100%; overflow:hidden;} .sm_saki>div {width:100%; background:#F9F9F9; border-left:#009966 2px solid; margin-bottom:20px; padding:20px 40px; display:table; overflow:hidden;} .sm_saki>div:nth-child(even) {background:#F5F5F5; border-left:#17a3c6 2px solid;} .sm_saki>div:hover {background:#F1F1F1;} .sm_saki>div>div {display:table-cell; vertical-align:middle; overflow:hidden;} .sm_saki>div>div:nth-child(1) {width:80%;} .sm_saki>div>div:nth-child(2) {width:20%; text-align:right; font-size:36px;} .sm_saki>div>div>h3 {font-size:28px; font-weight:bold; margin:3px 0 15px 0;} .sm_saki>div>div>p {font-size:18px; line-height:150%;} .sm_saki>div>div>span {padding-right:10px;} .sm_saki>div>div>a {padding:0 10px; color:#FF6633;} .sm_saki>div>div>a:last-child {border-left:#ddd 1px solid; padding-left:17px;} .sm_saki>div>div>a:hover {color:#666666;} @media only screen and (max-width:496px){ .sm_saki>div {padding:20px 20px;} .sm_saki>div>div {display:block;} .sm_saki>div>div:nth-child(1) {width:100%; margin-bottom:15px;} .sm_saki>div>div:nth-child(2) {width:100%; text-align:center; font-size:36px;} .sm_saki>div>div>h3 {font-size:24px;} .sm_saki>div>div>p {font-size:16px;} .sm_saki>div>div>span {display:block;} } /* 회사소개 */ .sm_info {max-width:1300px; margin:0 auto 60px auto; position:relative; overflow:hidden;} .sm_info>div {float:left; width:50%; overflow:hidden;} .sm_info>div.img { text-align:right;} @media only screen and (max-width:496px){ .sm_info>div {float:none; width:100%;} .sm_info>div.img {display:none;} } /* 시설보기 */ .sm_sisul {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_sisul>li {float:left; width:33%; margin-bottom:20px; padding:0 10px; text-align:center;} .sm_sisul>li>div {display:inline-block; min-height:230px; background:#f5f5f5; padding:20px; overflow:hidden;} .sm_sisul img {max-width:100%; margin-bottom:10px;} @media only screen and (max-width:496px){ .sm_sisul>li {float:none; width:100%; margin-bottom:15px;} .sm_sisul>li>div {min-height:inherit;} } /* 시설현황 */ .sm_sisul_info {margin-bottom:80px; overflow:hidden;} .sm_sisul_info>div {float:left; overflow:hidden;} .sm_sisul_info>div:nth-child(1) {width:30%;} .sm_sisul_info>div:nth-child(2) {width:70%; line-height:150%;} .sm_sisul_info>div span {width:120px; display:inline-block; color:#999;} @media only screen and (max-width:496px){ .sm_sisul_info>div {float:none;} .sm_sisul_info>div:nth-child(1) {width:100%; text-align:center; margin-bottom:20px;} .sm_sisul_info>div:nth-child(2) {width:100%;} .sm_sisul_info>div span {width:auto; display:block; color:#222; font-weight:bold;} } /* 시설사진 */ .sm_sisul_photo {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_sisul_photo>li {float:left; width:33.3%; margin-bottom:20px;} .sm_sisul_photo>li>div { overflow: hidden; position: relative; max-width:380px; border-radius:10px; } .sm_sisul_photo>li>div:hover .text { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .sm_sisul_photo>li>div>div { z-index: 3; position: absolute; width: 100%; height: 100%; display: block; top: 0px; right: 0px; bottom: 0px; left: 0px; background: rgba(0, 0, 0, 0.5); text-align: center; -webkit-transform: scale(0); -moz-transform: scale(0); -o-transform: scale(0); transform: scale(0); -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } .sm_sisul_photo>li>div>div>div { z-index: 3; position: absolute; top: 50%; left: 0px; margin-top: -20px; width: 100%; color: #FFFFFF; } @media only screen and (max-width:496px){ .sm_sisul_photo>li {float:none; width:100%; margin-bottom:20px;} } /* 역대회장 */ .sm_hoejang {overflow:hidden;} .sm_hoejang>div {width:20%; float:left; margin-bottom:30px; padding:0 10px; overflow:hidden;} .sm_hoejang>div>ul {list-style:none; margin:0; padding:25px 10px; border:#ddd 1px solid; border-radius:20px; background:#FAFAFA; overflow:hidden;} .sm_hoejang>div>ul>li {margin-bottom:3px; text-align:center; } .sm_hoejang>div>ul>li>img {border-radius:20px; margin-bottom:10px;} .sm_hoejang>div>ul>li:nth-child(2) {font-size:14px;} .sm_hoejang>div>ul>li:nth-child(3) {font-size:17px; color:#693;} .sm_hoejang>div>ul>li:nth-child(4) {font-size:21px;} @media only screen and (max-width:496px){ .sm_hoejang>div {width:50%; margin-bottom:10px;} .sm_hoejang>div>ul {padding:15px 10px; border-radius:0px;} .sm_hoejang>div>ul>li {margin-bottom:3px; text-align:center;} .sm_hoejang>div>ul>li>img {border-radius:0px;} .sm_hoejang>div>ul>li:nth-child(4) {font-size:18px;} } /* 기관소개 - 비전 */ .sm_vision {text-align:center; overflow:hidden;} .sm_vision>ul {list-style:none; margin:0; padding:0;} .sm_vision>ul>li {float:left; width:calc(100%/4); position:relative;} .sm_vision>ul>li>p {position:absolute; top:0px; left:0px; right:0px; bottom:0px; margin:auto; width:100%; height:100px; color:#fff; font-size:24px; line-height:160%;} @media only screen a .sm_vision>ul>li>p>b {display:block; font-size:26px; margin-bottom:25px;} @media only screen and (max-width:496px){ .sm_vision>ul>li {float:none; width:calc(100%/1);} } /* 핵심가치 */ .sm_vision2 {text-align:center; overflow:hidden;} .sm_vision2>ul {list-style:none; margin:0; padding:0;} .sm_vision2>ul>li {float:left; width:calc(100%/3); position:relative;} .sm_vision2>ul>li>p {position:absolute; top:30px; left:0px; right:0px; bottom:0px; margin:auto; width:100%; height:100px; color:#fff; font-size:18px; line-height:140%;} .sm_vision2>ul>li>p>b {display:block; font-size:36px; line-height:130%;} @media only screen and (max-width:496px){ .sm_vision2>ul>li {float:none; width:calc(100%/1);} } /* 시설소개 - 비전 */ .sm_vision_happy {overflow:hidden;} .sm_vision_happy>h3 {font-size:50px; font-weight:bold; font-family:'NanumSquare'; line-height:150%; color:#f25153; text-align:center; margin:0 0 30px 0;} .sm_vision_happy>ul {list-style:none; margin:30px 0 0 0; padding:0; overflow:hidden;} .sm_vision_happy>ul>li {float:left; width:33.33%; text-align:center; font-size:18px; line-height:150%; border-right:#CCC 1px solid;} .sm_vision_happy>ul>li:last-child {border-right:none;} .sm_vision_happy>ul>li>h4 {font-size:30px; font-weight:bold; color:#2db922; margin:20px 0 0 0;} @media only screen and (max-width:496px){ .sm_vision_happy>h3 {font-size:44px; margin:0 0 20px 0;} .sm_vision_happy>ul {margin:20px 0 0 0;} .sm_vision_happy>ul>li {float:none; width:100%; font-size:18px; border:#CCC 1px solid; margin-bottom:15px; padding:0 20px 10px 20px;} .sm_vision_happy>ul>li>h4 {font-size:24px; margin:15px 0 0 0;} .sm_vision_happy>ul>li>br {display:none;} } /* 미션ㆍ비전 */ .sm_mivi {overflow:hidden;} .sm_mivi>div {width:100%; margin-bottom:25px; border-radius:5px; overflow:hidden;} .sm_mivi>div:nth-child(1) {border:#3BAFFB 1px solid;} .sm_mivi>div:nth-child(1) li:nth-child(1) {background:#3BAFFB;} .sm_mivi>div:nth-child(2) {border:#FF5F90 1px solid;} .sm_mivi>div:nth-child(2) li:nth-child(1) {background:#FF5F90;} .sm_mivi>div>ul {width:100%; list-style:none; margin:0; padding:0; display:table; table-layout:fixed; overflow:hidden;} .sm_mivi>div>ul>li {padding:10px 20px; display:table-cell;} .sm_mivi>div>ul>li:nth-child(1) {width:20%; vertical-align:middle; color:#fff;} .sm_mivi>div>ul>li:nth-child(2) {width:80%; vertical-align:middle;} .sm_mivi>div>ul>li h3 {margin:0; font-size:40px; font-weight:bold;} .sm_mivi>div>ul>li h4 {margin:0; font-size:24px; letter-spacing:5px;} @media only screen and (max-width:496px){ .sm_mivi>div>ul {display:block; table-layout:inherit;} .sm_mivi>div>ul>li {padding:10px 20px; display:block;} .sm_mivi>div>ul>li:nth-child(1) {width:100%;} .sm_mivi>div>ul>li:nth-child(2) {width:100%;} .sm_mivi>div>ul>li h3 {font-size:30px;} .sm_mivi>div>ul>li h4 {font-size:18px;} } /* 미션ㆍ비전 */ .sm_misvis {width:100%; margin-bottom:20px; text-align:center; overflow:hidden;} .sm_misvis>h3 {font-size:36px; font-weight:bold; color:#111; margin:0 0 15px 0;} .sm_misvis>div {width:100%; margin-bottom:50px; padding:35px 10px; background:#F7F7F7; border:#E7E7E7 1px solid; border-radius:10px; font-size:24px; font-family:'NanumSquare'; line-height:160%; overflow:hidden;} @media only screen and (max-width:496px){ .sm_misvis>h3 {font-size:24px;} .sm_misvis>div {margin-bottom:25px; padding:20px 10px; font-size:18px;} } /* 사업목표 */ .sm_samok {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_samok>li {float:left; width:33.33%; padding:0 10px;} .sm_samok>li>div {padding:25px; font-size:16px; letter-spacing:-0.5px; border-radius:30px; overflow:hidden;} .sm_samok>li:nth-child(1)>div {border:#62BDF6 8px solid;} .sm_samok>li:nth-child(2)>div {border:#43D4A9 8px solid;} .sm_samok>li:nth-child(3)>div {border:#FCB7D4 8px solid;} .sm_samok>li>div>h2 {margin:0 0 20px 0; font-size:18px; text-align:center;} .sm_samok>li>div>h3 {margin:0 0 40px 0; font-size:20px; font-weight:bold; text-align:center;} .sm_samok>li>div>h4 {margin:0 0 10px 0; font-size:18px; background:#eee; border-radius:30px; padding:5px; text-align:center;} @media only screen and (max-width:496px){ .sm_samok>li {float:none; width:100%; padding:0 0px; margin-bottom:15px;} .sm_samok>li>div {padding:15px;border-radius:10px;} } /* 윤리강령 */ .sm_ethics {overflow:hidden;} .sm_ethics>dt {font-size:24px; font-weight:bold; color:#F40B63; line-height:180%;} .sm_ethics>dd {margin-bottom:20px;} /* 상징 */ .sm_rainbow {margin-bottom:100px; text-align:center; overflow:hidden;} .sm_rainbow>h3 {line-height:150%;} .sm_rainbow>p {margin-top:20px; font-size:20px; line-height:150%;} @media only screen and (max-width:767px){ .sm_rainbow br {display:none;} .sm_rainbow p {text-align:left;} } /* 조직구성 */ .sm_zozic {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_zozic>li {float:left; width:16.66%; margin-bottom:20px; text-align:center;} .sm_zozic>li>div {width:95%; min-height:140px; margin:0 auto; background:#FAFAFA; padding:15px 15px 10px 15px; border:#ddd 1px solid; border-radius:5px; overflow:hidden;} .sm_zozic>li>div>h5 {margin:10px 0 0 0; font-size:14px;} .sm_zozic>li>div>span {font-size:16px; font-weight:bold;} @media only screen and (max-width:496px){ .sm_zozic>li {float:none; width:100%;} .sm_zozic>li>div {width:90%; min-height:inherit;} } /* 연혁 */ .sm_his {background:url(../images/line.png) center repeat-y; overflow:hidden;} .sm_his>div>div {float:left; width:50%;} .sm_his>div>div:first-child {text-align:right; margin-bottom:25px; padding-right:60px; padding-top:20px;} .sm_his>div>div:first-child>h3 {font-size:20px; font-weight:bold; color:#4F271A; line-height:130%;} .sm_his>div>div:first-child>h4 {font-size:14px; color:#3A3A3A; line-height:140%;} .sm_his>div>div:last-child {text-align:left;} .sm_his>div>div:last-child dt {background:url(../images/line_2.png) left 50% no-repeat; padding-left:60px; margin:20px 0 5px 0; font-size:24px; color:#0066CC;} .sm_his>div>div:last-child dd {padding-left:60px; margin-bottom:10px; color:#888;} .sm_his>div>div:last-child dd>b {color:#222; margin-right:5px;} @media only screen and (max-width:496px){ .sm_his {background:none; overflow:hidden;} .sm_his>div {margin-bottom:40px;} .sm_his>div>div {float:none; width:100%;} .sm_his>div>div:first-child {text-align:left; padding:0;} .sm_his>div>div:first-child br {display:none;} .sm_his>div>div:last-child dt {background:none; padding-left:0; margin:15px 0 5px 0;} .sm_his>div>div:last-child dd {padding-left:0; margin-bottom:5px;} } /* 이용안내 */ .sm_iyoung {overflow:hidden;} .sm_iyoung>div {overflow:hidden;} .sm_iyoung>div:nth-child(1) {text-align:center;} .sm_iyoung>div:nth-child(1)>img {margin-bottom:25px; border-radius:15px;} /* 상담 및 이용문의 */ .sm_sangdam {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_sangdam>li {float:left; width:33.3%; height:330px; text-align:center; margin-bottom:30px; border-right:#dedede 1px solid;} .sm_sangdam>li:nth-child(3), .sm_sangdam>li:nth-child(6) {border-right:none;} .sm_sangdam>li>div>h3 {color:#425B83;} @media only screen and (max-width:496px){ .sm_sangdam>li {float:none; width:100%; height:auto; border-right:none;} } /* 사업소개 */ .sm_saup_head {background:#F6F6F6; border-left:#E30026 3px solid; margin-bottom:60px; padding:15px 20px; font-size:20px; font-family:'nanumsquare'; line-height:170%; overflow:hidden;} @media only screen and (max-width:496px){ .sm_saup_head {margin-bottom:40px;} } /* 사업소개 */ .sm_saup_head01 {background:#F6F6F6; margin-bottom:1px; padding:15px 20px; font-size:20px; font-family:'nanumsquare'; line-height:170%; overflow:hidden;} /* 사업소개 - 가운데정렬 */ .sm_saup_ddam {font-size:38px; font-family:'NanumSquare'; line-height:140%; text-align:center; margin:30px 0 100px 0; overflow:hidden;} .sm_saup_ddam>b {color:#EB722C; font-weight:normal;} @media only screen and (max-width:496px){ .sm_saup_ddam {font-size:26px; margin:20px 0 60px 0;} .sm_saup_ddam>br {display:none;} } /* 복지관 사업안내 */ .sm_saup_info {overflow:hidden;} .sm_saup_info>ul {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_saup_info>ul>li {float:left; width:33.33%; margin-bottom:30px; padding:0 20px;} .sm_saup_info>ul>li>div {overflow:hidden;} .sm_saup_info>ul>li>div>h3 {margin:0; padding:10px 20px 8px 20px; background:#EE2978; border-radius:10px 10px 0 0; font-size:22px; font-weight:bold; color:#FFFFFF; display:inline-block;} .sm_saup_info>ul>li>div>div {min-height:330px; background:#F8F8F8; border:#EE2978 1px solid; border-radius:0 10px 10px 10px; padding:20px; text-align:center; overflow:hidden;} .sm_saup_info>ul>li:nth-child(1)>div>div {min-height:460px;} .sm_saup_info>ul>li:nth-child(2)>div>div {min-height:460px;} .sm_saup_info>ul>li:nth-child(3)>div>div {min-height:460px;} .sm_saup_info>ul>li>div>div>h4 {margin:20px 0 10px 0; line-height:140%; color:#D08B00;} .sm_saup_info>ul>li>div>div>h5 {margin:0 0 20px 0;} .sm_saup_info>ul>li>div>div>ul {list-style:none; margin:0; padding:10px; background:#FFFFFF; border:#EEEEEE 1px solid; border-radius:10px; overflow:hidden;} .sm_saup_info>ul>li>div>div>ul>li {text-align:left; font-size:15px; margin-bottom:5px;} .sm_saup_info>ul>li>div>div>a {display:block; text-decoration:underline; margin-bottom:10px;} @media only screen and (max-width:496px){ .sm_saup_info>ul>li {float:none; width:100%; padding:0px;} .sm_saup_info>ul>li>div>div {min-height:inherit !important;} } /* 사업소개 사진 */ .sm_saup_photo {text-align:center; margin-top:15px; overflow:hidden;} .sm_saup_photo>img {width:300px; border-radius:10px; margin:0 5px 15px 5px;} .sm_saup_photo>span {width:10px; display:inline-block;} @media only screen and (max-width:496px){ .sm_saup_photo>img {width:inherit; border-radius:0px; margin:0 0 10px 0;} .sm_saup_photo>span {display:none;} } /* 프로그램 사진 */ .sm_program {background:#F8F8F8; margin-bottom:3px; padding:15px 15px 10px 15px; overflow:hidden; clear:both;} .sm_program>ul{float:left;} .sm_program>div.photo {float:right; padding:7px 0 10px; 0; overflow:hidden;} .sm_program img {max-width:100%;} @media only screen and (max-width:496px){ .sm_program>ul{float:none;} .sm_program>div.photo {float:none; text-align:center;} } /* 사업문의 */ .sm_saup_moon {font-size:27px; line-height:150%;} .sm_saup_moon>b {color:#EE2978;} @media only screen and (max-width:496px){ .sm_love_hoo_moon {font-size:22px;} } /* 사업 픽토그램 */ .sm_saup_pic {width:100%; margin-bottom:60px; overflow:hidden;} .sm_saup_pic>ul {list-style:none; width:100%; margin:0 0 25px 0; padding:0; display:table; table-layout:fixed; overflow:hidden;} .sm_saup_pic>ul>li {display:table-cell; margin-bottom:25px; padding:0 20px;} .sm_saup_pic>ul>li>div {text-align:center; overflow:hidden;} .sm_saup_pic>ul>li>div>p {text-align:justify;} @media only screen and (max-width:496px){ .sm_saup_pic {margin-bottom:30px;} .sm_saup_pic>ul {display:block; margin:0; table-layout:inherit;} .sm_saup_pic>ul>li {display:block; padding:0 20px;} } /* 인증서 */ .sm_certi {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_certi>li {float:left; width:25%; margin-bottom:20px; padding:0; text-align:center;} .sm_certi>li>div {width:95%; margin:0 auto; padding:20px 10px; border:#DDD 1px solid; border-radius:10px; box-shadow:1px 5px 5px -1px #e6e6e6; overflow:hidden;} .sm_certi>li>div>img {max-width:100%;} @media only screen and (max-width:496px){ .sm_certi>li {float:none; width:100%;} } /* 협약기관 */ .sm_partner {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_partner>li {float:left; width:20%; margin-bottom:20px; padding:0; text-align:center;} .sm_partner>li img {max-width:100%; border:#ddd 1px solid;} @media only screen and (max-width:496px){ .sm_partner>li {float:none; width:100%;} } /* 주요사업-사업현황 */ .sm_jooyo {overflow:hidden;} .sm_jooyo>div {width:33%; float:left; margin-bottom:30px; padding:0 10px; overflow:hidden;} .sm_jooyo>div>ul {list-style:none; min-height:450px; margin:0; padding:25px 20px; border:#ddd 1px solid; border-radius:10px; background:#FAFAFA; overflow:hidden;} .sm_jooyo>div>ul>li {margin-bottom:3px; text-align:center;} .sm_jooyo>div>ul>li:nth-child(1) {font-size:23px; font-weight:bold; letter-spacing:-1px;} .sm_jooyo>div>ul>li>img {border-radius:10px; margin:10px 0;} .sm_jooyo>div>ul>li>ul {list-style:disc; margin:0; padding-left:30px;} .sm_jooyo>div>ul>li>ul>li {margin-bottom:5px; text-align:left;} @media only screen and (max-width:496px){ .sm_jooyo>div {width:100%; margin-bottom:20px;} .sm_jooyo>div>ul {min-height:inherit; padding:15px 10px; border-radius:0px;} .sm_jooyo>div>ul>li>img {border-radius:0px;} } /* 사업-생애주기별사업 */ .sm_saup_pro {list-style:none; margin:0; padding:0; font-family:'nanumsquare'; overflow:hidden;} .sm_saup_pro>li {float:left; width:33.33%; font-size:14px; letter-spacing:-0.5px;} .sm_saup_pro>li>div {height:430px; border:#ddd 1px solid; margin:2%; padding:20px; border-radius:10px; background:#f8f8f8; overflow:hidden;} .sm_saup_pro>li>div>div {text-align:center;} .sm_saup_pro>li>div>div>img {border-radius:5px;} .sm_saup_pro>li>div>h3 {font-size:18px; text-align:center; padding-bottom:20px; border-bottom:#ddd 1px dashed;} .sm_saup_pro>li>div>dl {list-style:none; height:155px; padding:0 5px; text-align:left; overflow:auto;} .sm_saup_pro>li>div>dl>dt {float:left; width:25%; margin-bottom:5px;} .sm_saup_pro>li>div>dl>dd {float:left; width:75%; margin-bottom:5px; letter-spacing:-1px;} @media only screen and (max-width:496px){ .sm_saup_pro>li {float:none; width:100%;} } /* 자원봉사 활동내용 */ .sm_jawon_icon {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_jawon_icon>li {float:left; width:25%; padding:15px 5px;} .sm_jawon_icon>li>div {min-height:270px; background:#F6F6F6; text-align:center; padding:30px 20px 20px 20px; overflow:hidden;} .sm_jawon_icon>li>div>img {margin-bottom:15px;} .sm_jawon_icon>li>div>b {display:block; font-weight:bold; font-size:30px; line-height:150%;} .sm_jawon_icon>li>div>p {display:block; font-size:16px; line-height:150%;} @media only screen and (max-width:496px){ .sm_jawon_icon>li {float:none; width:100%;} .sm_jawon_icon>li>div {height:auto; padding:0 10px;} } /* 자원봉사 참여방법 */ .sm_jawon_step {list-style:none; margin:0px; padding:0px; overflow:hidden;} .sm_jawon_step>li {float:left; width:24%; padding:0 30px 0 0; margin:0 0 10px 8px; background:url(../images/sm_step5.gif) right no-repeat; display:table;} .sm_jawon_step>li:last-child {background:none;} .sm_jawon_step>li>div {padding:20px 10px; text-align:center;} .sm_jawon_step>li>div>b {display:block; margin-top:10px; font-size:20px; line-height:140%;} .sm_jawon_step>li>div>p {display:block; font-size:16px; line-height:150%;} @media only screen and (max-width:496px){ .sm_jawon_step>li {float:none; width:100%; padding:0 0 30px 0; margin:0 0 10px 0; background:url(../images/sm_step6.gif) bottom no-repeat;} .sm_jawon_step>li>div {border:#dedede 1px solid;} } /* 자원봉사 신청방법 */ .sm_jawon_step2 {width:100%; list-style:none; margin:0px; padding:0px; display:table; table-layout:fixed; overflow:hidden;} .sm_jawon_step2>li {display:table-cell; text-align:center;} .sm_jawon_step2>li>div {padding:10px 20px;} .sm_jawon_step2>li>div>h3 {display:block; border-radius:15px 15px 0 0; margin:0; padding:7px 5px; font-size:24px; font-weight:bold; color:#FFF; line-height:140%;} .sm_jawon_step2>li:nth-child(1)>div>h3 {background:#FABF01;} .sm_jawon_step2>li:nth-child(2)>div>h3 {background:#41AEC5;} .sm_jawon_step2>li:nth-child(3)>div>h3 {background:#238AF1;} .sm_jawon_step2>li:nth-child(4)>div>h3 {background:#0258CA;} .sm_jawon_step2>li>div>p {display:block; min-height:130px; background:#FAFAFA; border-radius:0 0 15px 15px; padding:15px; font-size:18px; line-height:150%;} @media only screen and (max-width:496px){ .sm_jawon_step2>li {display:block; width:100%;} } /* 자원봉사 활동혜택 */ .sm_jawon_hyetaeg {list-style:none; width:100%; margin:0 auto; padding:0; overflow:hidden;} .sm_jawon_hyetaeg>li {float:none; width:100%; background:#F3F3F3; margin-bottom:15px; padding:20px; font-size:30px; font-family:'nanumsquare'; line-height:150%; text-align:center;} .sm_jawon_hyetaeg>li>span {color:#EE2978;} @media only screen and (max-width:496px){ .sm_jawon_hyetaeg {width:100%;} .sm_jawon_hyetaeg>li {padding:20px 5px; font-size:20px;} } /* 자원봉사 안내 */ .sm_jawon {overflow:hidden;} .sm_jawon>ul {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_jawon>ul>li {float:left; width:33%; margin-bottom:10px; text-align:center;} .sm_jawon>ul>li>h3 {margin:10px 0;} .sm_jawon>ol {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_jawon>ol>li {float:left; width:20%; margin:0 0 10px 0; padding:0; text-align:center;} .sm_jawon>ol>li>p {margin:10px 0; line-height:130%; height:50px;} @media only screen and (max-width:496px){ .sm_jawon>ul>li {float:none; width:100%; margin-bottom:25px;} .sm_jawon>ol>li {float:left; width:50%;} } /* 자원봉사 할 때 마음가짐 */ .sm_jawon_maum {padding:25px 30px; background:#FBFEF3; overflow:hidden;} .sm_jawon_maum>ol {list-style:none; margin:0; padding:0; background:#FBFFF2;} .sm_jawon_maum>ol>li {margin-bottom:15px; text-align:justify;} .sm_jawon_maum>ol>li>span {font-size:40px; font-weight:bold; padding-right:10px;} .sm_jawon_maum>ol>li:nth-child(1)>span {color:#FABF03;} .sm_jawon_maum>ol>li:nth-child(2)>span {color:#E85357;} .sm_jawon_maum>ol>li:nth-child(3)>span {color:#B26DBE;} .sm_jawon_maum>ol>li:nth-child(4)>span {color:#41B0C4;} .sm_jawon_maum>ol>li:nth-child(5)>span {color:#319EF0;} .sm_jawon_maum>ol>li:nth-child(6)>span {color:#197AE1;} .sm_jawon_maum>ol>li:nth-child(7)>span {color:#1948e1;} .sm_jawon_maum>ol>li:nth-child(8)>span {color:#6230e2;} /* 자원봉사 특징 */ .sm_jawon_point {list-style:none; width:100%; margin:0 auto; padding:0; overflow:hidden;} .sm_jawon_point>li {margin-bottom:25px; border:#e0e0e0 1px solid; padding:20px 15px 0 10px; overflow:hidden;} .sm_jawon_point>li>div {float:left; overflow:hidden;} .sm_jawon_point>li>div:nth-child(1) {width:10%; text-align:center;} .sm_jawon_point>li>div:nth-child(1)>img {width:60px;} .sm_jawon_point>li>div:nth-child(2) {width:90%; font-size:18px; line-height:170%; text-align:justify; margin-bottom:15px;} .sm_jawon_point>li>div:nth-child(2)>b {font-size:28px; line-height:120%; margin-bottom:10px; display:block;} @media only screen and (max-width:496px){ .sm_jawon_point {width:100%;} .sm_jawon_point>li {margin-bottom:15px;} .sm_jawon_point>li>div:nth-child(1) {width:20%; padding-right:10px;} .sm_jawon_point>li>div:nth-child(2) {width:80%; font-size:16px; line-height:150%;} .sm_jawon_point>li>div:nth-child(2)>b {font-size:24px;} } /* 후원 안내 */ .sm_hoowon {overflow:hidden;} .sm_hoowon>ul {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_hoowon>ul>li {float:left; width:25%; margin:0 0 10px 0; padding:0 20px; border-right:#CCCCCC 1px solid; text-align:center;} .sm_hoowon>ul>li:last-child {border-right:none;} .sm_hoowon>ul>li>p {font-size:17px; line-height:30px; margin-top:10px;} .sm_hoowon>ul>li>p>b {font-size:20px;} @media only screen and (max-width:496px){ .sm_hoowon>ul>li {float:left; width:50%; border:none;} } /* 후원방법 */ .sm_love_sup {width:100%; overflow:hidden;} .sm_love_sup>ul {list-style:none; margin:0px; padding:0px;} .sm_love_sup>ul>li {float:left; width:33.3%; margin:0px; padding:10px;} .sm_love_sup>ul>li>div {padding:30px 10px; border:#CCC 1px solid; border-radius:10px; text-align:center;} .sm_love_sup>ul>li>div>b {display:inline-block; margin-top:15px;} .sm_love_sup>ul>li>div>span {display:inline-block; margin-top:13px; padding:8px 30px; border-radius:50px; text-align:center; color:#FFF; background:#0066CC; cursor:pointer;} @media only screen and (max-width:496px){ .sm_love_sup>ul>li {float:none; width:100%; margin:0px; padding:10px;} } /* 후원종류 */ .sm_hoo {width:90%; margin:0 auto; overflow:hidden;} .sm_hoo>div {margin-bottom:30px; padding-bottom:30px; border-bottom:#CCCCCC 1px solid; overflow:hidden;} .sm_hoo>div>div:first-child {float:left; width:30%; padding:0 10px; text-align:center;} .sm_hoo>div>div:first-child>div {width:250px; height:250px; border:#0066CC 20px solid; border-radius:250px; text-align:center; font-size:36px; font-weight:bold; line-height:100%; display:table-cell; vertical-align:middle;} .sm_hoo>div>div:last-child {float:left; width:70%;} .sm_hoo>div>div:last-child>h4 {font-weight:bold; color:#0066CC; font-size:24px; margin-bottom:0; padding-bottom:0;} .sm_hoo>div>div:last-child>p {margin-bottom:20px; font-size:18px;} .sm_hoo>div>div:last-child>a {padding:5px 20px; background:#336699; border-radius:20px; color:#FFFFFF;} .sm_hoo>div:last-child>div:first-child>div {border:#339966 20px solid;} .sm_hoo>div:last-child>div:last-child>a {background:#009966;} @media only screen and (max-width:496px){ .sm_hoo {width:100%;} .sm_hoo>div>div:first-child {float:none; width:100%; padding:0; margin-bottom:20px;} .sm_hoo>div>div:last-child {float:none; width:100%;} .sm_hoo>div>div:first-child>div {width:auto; height:auto; padding:15px 10px; border-radius:0; text-align:center; font-size:36px; font-weight:bold; line-height:100%; display:block;} } /* 후원내용 */ .sm_hoowon_icon {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_hoowon_icon>li {float:left; width:25%; padding:15px 5px;} .sm_hoowon_icon>li>div {min-height:270px; text-align:center; padding:30px 20px 20px 20px; overflow:hidden;} .sm_hoowon_icon>li>div>img {margin-bottom:15px;} .sm_hoowon_icon>li>div>b {display:block; font-weight:bold; font-size:30px; line-height:130%; margin-bottom:10px;} .sm_hoowon_icon>li>div>p {display:block; font-size:16px; line-height:150%;} @media only screen and (max-width:496px){ .sm_hoowon_icon>li {width:50%;} .sm_hoowon_icon>li>div {height:auto; padding:0 10px;} .sm_hoowon_icon>li>div>p>br {display:none;} } /* 후원종류 */ .sm_hoowon_jong {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_hoowon_jong>li {float:left; width:50%; min-height:170px; overflow:hidden;} .sm_hoowon_jong>li:nth-child(odd) {padding-right:25px;} .sm_hoowon_jong>li:nth-child(even) {padding-left:25px;} .sm_hoowon_jong>li>div {float:left; overflow:hidden;} .sm_hoowon_jong>li>div:nth-child(1) {width:30%;} .sm_hoowon_jong>li>div:nth-child(1)>img {width:80%; border-radius:10px;} .sm_hoowon_jong>li>div:nth-child(2) {width:70%; line-height:150%;} .sm_hoowon_jong>li>div:nth-child(2)>h3 {margin:10px 0 10px 0;} @media only screen and (max-width:496px){ .sm_hoowon_jong>li {float:none; width:100%; padding:0 !important; min-height:inherit; margin-bottom:30px;} .sm_hoowon_jong>li>div {float:left; overflow:hidden;} .sm_hoowon_jong>li>div:nth-child(1) {width:30%;} .sm_hoowon_jong>li>div:nth-child(1)>img {width:80%; border-radius:10px;} .sm_hoowon_jong>li>div:nth-child(2) {width:70%; font-size:17px;} .sm_hoowon_jong>li>div:nth-child(2)>h3 {margin:0 0 10px 0; font-size:20px;} } /* 후원방법 */ .sm_hoowon_bang {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_hoowon_bang>li {float:left; width:50%; min-height:170px; overflow:hidden;} .sm_hoowon_bang>li:nth-child(odd) {padding-right:25px;} .sm_hoowon_bang>li:nth-child(even) {padding-left:25px;} .sm_hoowon_bang>li>div {float:left; overflow:hidden;} .sm_hoowon_bang>li>div:nth-child(1) {width:30%;} .sm_hoowon_bang>li>div:nth-child(1)>img {width:80%; border-radius:10px;} .sm_hoowon_bang>li>div:nth-child(2) {width:70%; line-height:150%;} .sm_hoowon_bang>li>div:nth-child(2)>h3 {margin:10px 0 10px 0;} @media only screen and (max-width:496px){ .sm_hoowon_bang>li {float:none; width:100%; padding:0 !important; min-height:inherit; margin-bottom:30px;} .sm_hoowon_bang>li>div {float:left; overflow:hidden;} .sm_hoowon_bang>li>div:nth-child(1) {width:30%;} .sm_hoowon_bang>li>div:nth-child(1)>img {width:80%; border-radius:10px;} .sm_hoowon_bang>li>div:nth-child(2) {width:70%; font-size:17px;} .sm_hoowon_bang>li>div:nth-child(2)>h3 {margin:0 0 10px 0; font-size:20px;} } /* 후원계좌 */ .sm_love_bank {list-style:none; margin:0px; padding:0px; overflow:hidden;} .sm_love_bank>li {float:left; width:100%; margin-bottom:20px; padding:0 10px; border-right:#D9D9D9 1px solid;} .sm_love_bank>li:last-child {border-right:none;} .sm_love_bank>li>div {padding:0px 20px; text-align:center; overflow:hidden;} .sm_love_bank>li>div>img {margin-bottom:10px;} .sm_love_bank>li>div>b {font-size:30px; font-family:'nanumsquare'; display:block;} .sm_love_bank>li>div>span {font-size:30px; font-family:'nanumsquare'; font-weight:bold; color:#FF0066; margin-top:30px; display:block;} @media only screen and (max-width:496px){ .sm_love_bank>li {float:none; width:100%; margin-bottom:20px; padding:0 10px; border-right:none;} .sm_love_bank>li>div {padding:50px 10px; border:#D9D9D9 1px solid;} } /* 후원문의 */ .sm_love_hoo_moon {font-size:32px; line-height:150%;} @media only screen and (max-width:496px){ .sm_love_hoo_moon {font-size:22px;} } /* 신청버튼 */ .sm_love_btn {overflow:hidden; text-align:center;} .sm_love_btn a {background:#EE2978; border-radius:100px; display:inline-block; padding:10px 80px 12px 80px; font-size:22px; font-weight:bold; color:#fff;} .sm_love_btn a:link {color:#fff;} .sm_love_btn a:visited {color:#fff;} .sm_love_btn a:active {color:#fff;} .sm_love_btn a:hover {background:#990000;} /* 신청, 조회 버튼 */ .sm_love_link {width:100%; margin-bottom:60px; text-align:center; overflow:hidden;} .sm_love_link>a {width:350px; display:inline-block; border-radius:20px 0; margin:0 20px 20px 20px; padding:30px 15px; font-size:24px; font-family:'nanumsquare'; color:#FFF;} .sm_love_link>a:nth-child(1) {background:#EE2978;} .sm_love_link>a:nth-child(1):hover {background:#B21F5A} .sm_love_link>a:nth-child(2) {background:#838383;} .sm_love_link>a:nth-child(2):hover {background:#626262} .sm_love_link>a>b {display:block; font-size:36px;} @media only screen and (max-width:496px){ .sm_love_link>a {width:100%; margin:0 0 20px 0;} } /* 협력기관 */ .sm_family {width:100%; overflow:hidden;} .sm_family>ul {list-style:none; margin:0px; padding:0px;} .sm_family>ul>li {float:left; width:25%; padding:10px; display:table;} .sm_family>ul>li>div {height:100px; padding:0px 10px; border:#CCCCCC 1px solid; border-left:#2757A9 2px solid; text-align:center; letter-spacing:-0.5px; display:table-cell; vertical-align:middle;} @media only screen and (max-width:496px){ .sm_family>ul>li {float:left; width:50%;} .sm_family>ul>li>div {height:80px; font-size:14px; line-height:20px;} } /* 권익옹호 절차 */ .sm_ongho_step {list-style:none; padding:0; margin:10px auto 20px auto; overflow:hidden;} .sm_ongho_step>li {float:left; width:190px; min-height:200px; padding:0; margin:0 10px 10px 0; display:table;} .sm_ongho_step>li:last-child {margin:0 0 10px 0;} .sm_ongho_step>li>div {border-radius:10px; background: #F5F5F5; text-align:center; font-size:22px; font-weight:bold; line-height:130%; padding:10px 10px; overflow:hidden;} .sm_ongho_step>li>div>h3 {font-size:20px; font-weight:bold; font-style:italic; margin:10px 0;} .sm_ongho_step>li>div>h4 {font-size:24px; font-weight:bold; margin:15px 0;} .sm_ongho_step>li>p {display:block; margin-top:10px; font-size:15.5px; letter-spacing:-1px; text-align:center; overflow:hidden;} @media only screen and (max-width:496px){ .sm_ongho_step>li {float:none; width:100%; height:auto; margin:0 0 10px 0;} .sm_ongho_step>li>div {font-size:18px;} } /* 이용방법 */ .sm_iyong_step {list-style:none; padding:0; margin:10px auto 20px auto; overflow:hidden;} .sm_iyong_step>li {float:left; width:190px; height:130px; padding:0; margin:0 10px 10px 0; display:table;} .sm_iyong_step>li:last-child {margin:0 0 10px 0;} .sm_iyong_step>li>div {border-radius:10px; background: #F5F5F5; text-align:center; font-size:22px; font-weight:bold; line-height:130%; padding:10px 10px; display:table-cell; vertical-align:middle;} .sm_iyong_step>li>div>b {display:block; margin-top:10px;} @media only screen and (max-width:496px){ .sm_iyong_step>li {float:none; width:100%; height:auto; margin:0 0 10px 0;} .sm_iyong_step>li>div {font-size:18px;} } /* 이용방법2 */ .sm_iyong_step2 {border:#CCCCCC 1px solid; padding:20px; margin:10px auto 20px auto; overflow:hidden;} .sm_iyong_step2>li {margin-left:30px; font-size:18px; letter-spacing:-1px;} @media only screen and (max-width:496px){ .sm_iyong_step2>li {margin-left:15px; margin-bottom:10px; text-align:justify; font-size:16px; line-height:160%;} } /* 이용방법3 */ .sm_iyong_step3 {list-style:none; padding:0; margin:0; overflow:hidden;} .sm_iyong_step3>li {margin-bottom:10px; letter-spacing:-1px;} @media only screen and (max-width:496px){ .sm_iyong_step3>li {text-align:justify; font-size:18px; line-height:160%;} } /*********************************************************************************************************************************************/ /*****************************************************************/ /* 테이블 */ /*****************************************************************/ /* 일반 테이블-----------------------------------------------------------*/ .sm_table-normal { margin-top: 0px; margin-bottom: 10px; } .sm_table-normal>table { table-layout:fixed; } /* 반은형 테이블-----------------------------------------------------------*/ .sm_table-responsive { min-height: .01%; overflow-x: auto; margin-top: 0px; margin-bottom: 10px; } /* 테이블-----------------------------------------------------------*/ .sm_table { width: 100%; max-width: 100%; font-size:17px; color: #333333; border-top: 2px solid #999999; border-bottom: 2px solid #cccccc; } .sm_tleft > tbody > tr > td:last-child { text-align:left; } .sm_table > thead > tr > th, .sm_table > tbody > tr > th, .sm_table > tfoot > tr > th, .sm_table > thead > tr > td, .sm_table > tbody > tr > td, .sm_table > tfoot > tr > td { padding: 15px 12px; vertical-align: middle; word-wrap: break-word; } .sm_table > thead > tr > th { white-space:nowrap; background-color: #F9F9F9; border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #AAA; text-align:center; line-height:22px; } .sm_table > thead > tr > td { white-space:nowrap; background-color: #F9F9F9; border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #AAA; text-align:center; line-height:22px; } .sm_table > tbody > tr > th { line-height:22px; background-color: #FBFBFB; border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; padding-left:20px; padding-right:20px; white-space: normal; text-align:center; } .sm_table > tbody > tr > td { border-bottom: 1px solid #ddd; border-left: 1px solid #ddd; border-right: 1px solid #ddd; background-color: #FFFFFF; line-height:150%; } .sm_table > tbody + tbody { border-top: 2px solid #ddd; } .sm_table .sm_table { background-color: #fff; } .sm_table_cmt { font-size:16px; line-height:140%; text-align:right; margin-bottom:5px; } .sm_table ul {list-style:disc; margin:0; padding-left:20px;} .sm_table ul>li {margin-bottom:2px; text-align:left;} .sm_table ul>li>ul {list-style:none; margin:0; padding-left:0px;} .sm_table ul>li>ul>li {background:url(../images/icon_21.gif) no-repeat 0 10px; padding-left:13px; margin-bottom:2px; text-align:left;} .sm_table img {max-width:100%;} @media screen and (max-width: 767px) { .sm_table-normal { width: 100%; margin-bottom: 15px; } .sm_table-normal > .sm_table { margin-bottom: 0; border:0px; } .sm_table-normal > .sm_table > thead > tr > th, .sm_table-normal > .sm_table > tbody > tr > th, .sm_table-normal > .sm_table > tfoot > tr > th, .sm_table-normal > .sm_table > thead > tr > td, .sm_table-normal > .sm_table > tbody > tr > td, .sm_table-normal > .sm_table > tfoot > tr > td { border: 1px solid #ddd; } .sm_table-normal > .sm_table { border: 0; } } @media screen and (max-width: 767px) { .sm_table-responsive { width: 100%; margin-bottom: 15px; overflow-y: hidden; -ms-overflow-style: -ms-autohiding-scrollbar; } .sm_table-responsive > .sm_table { margin-bottom: 0; border:0px; } .sm_table-responsive > .sm_table > thead > tr > th, .sm_table-responsive > .sm_table > tbody > tr > th, .sm_table-responsive > .sm_table > tfoot > tr > th, .sm_table-responsive > .sm_table > thead > tr > td, .sm_table-responsive > .sm_table > tbody > tr > td, .sm_table-responsive > .sm_table > tfoot > tr > td { white-space: nowrap; border: 1px solid #ddd; } .sm_table-responsive > .sm_table { border: 0; } } @media screen and (max-width: 496px) { .sm_table { font-size:16px; } .sm_table > thead > tr > th, .sm_table > tbody > tr > th, .sm_table > tfoot > tr > th, .sm_table > thead > tr > td, .sm_table > tbody > tr > td, .sm_table > tfoot > tr > td { padding: 8px 5px; } } table caption { font: 0px/0 Arial; height: 0; margin: 0; overflow: hidden; padding: 0; width: 0; } /* 테이블 조직팀-----------------------------------------------------------*/ .sm_table_zozic { width: 100%; max-width: 100%; font-size:15px; color:#333333; border-top: 2px solid #38a2ea; border-left:#FFFFFF 2px solid; border-right:#FFFFFF 2px solid; } .sm_table_zozic > thead > tr > th, .sm_table_zozic > tbody > tr > th, .sm_table_zozic > tfoot > tr > th, .sm_table_zozic > thead > tr > td, .sm_table_zozic > tbody > tr > td, .sm_table_zozic > tfoot > tr > td { padding: 3px 10px; vertical-align: middle; word-wrap: break-word; text-align:center; } .sm_table_zozic > thead > tr > th { white-space:nowrap; background-color: #F9F9F9; border-left: 1px solid #eee; border-bottom: 1px solid #AAA; font-size:16px; text-align:center; } .sm_table_zozic > tbody > tr > th { line-height:22px; border-left: 1px solid #eee; border-bottom: 1px solid #ddd; padding-left:20px; padding-right:20px; white-space: normal; text-align:center; font-weight:normal; } .sm_table_zozic > tbody > tr > td { border-bottom: 1px solid #ddd; border-left: 1px solid #eee; border-right: 1px solid #eee; } .sm_table_zozic > tbody + tbody { border-top: 2px solid #ddd; } .sm_table_zozic ul { padding-left:20px; } @media screen and (max-width: 767px) { .sm_table_zozic-normal { width: 100%; margin-bottom: 15px; } .sm_table_zozic-normal > .sm_table_zozic { margin-bottom: 0; border:0px; } .sm_table_zozic-normal > .sm_table_zozic > thead > tr > th, .sm_table_zozic-normal > .sm_table_zozic > tbody > tr > th, .sm_table_zozic-normal > .sm_table_zozic > tfoot > tr > th, .sm_table_zozic-normal > .sm_table_zozic > thead > tr > td, .sm_table_zozic-normal > .sm_table_zozic > tbody > tr > td, .sm_table_zozic-normal > .sm_table_zozic > tfoot > tr > td { border: 1px solid #ddd; } .sm_table_zozic-normal > .sm_table_zozic { border: 0; } } /* 테이블 연혁-----------------------------------------------------------*/ .sm_history {margin-top:20px; overflow:hidden;} .sm_history>div:first-child {float:left; width:25%; text-align:center;} .sm_history>div:last-child {float:left; width:75%;} @media screen and (max-width: 767px) { .sm_history>div:first-child {float:none; width:100%; text-align:center; margin:20px 0;} .sm_history>div:last-child {float:none; width:100%;} } .sm_table_history { width: 100%; max-width: 100%; font-size:16px; border-top:1px solid #968A82; border-left:#FFFFFF 2px solid; border-right:#FFFFFF 2px solid; } .sm_table_history > thead > tr > th { white-space:nowrap; } .sm_table_history > thead > tr > th, .sm_table_history > tbody > tr > th, .sm_table_history > tfoot > tr > th, .sm_table_history > thead > tr > td, .sm_table_history > tbody > tr > td, .sm_table_history > tfoot > tr > td { padding: 10px 5px; vertical-align: middle; word-wrap: break-word; text-align: left; } .sm_table_history > thead > tr > th { white-space:nowrap; background-color:#fff; border-bottom: 1px solid #AAA; font-size:16px; text-align:center; } .sm_table_history > tbody > tr > th { font-size:24px; font-weight:bold; letter-spacing:-1px; text-align:center; vertical-align:middle; border-bottom:1px dashed #ddd; } .sm_table_history > tbody > tr > td { border-bottom: 1px dashed #ddd; color:#007FCE; text-align:left; vertical-align:middle; padding-left:10px; } .sm_table_history > tbody > tr > td:last-child { color:#333333; text-align:left; } .sm_table_history > tbody > tr:nth-child(odd) > td:last-child { background:#FAFAFA; } .sm_table_history > tbody > tr > td > ul { list-style:none; margin:0; padding:0; } .sm_table_history > tbody > tr > td i { font-style:normal; font-weight:bold; color:#FFF; background:#3E9680; border-radius:5px; padding:2px 5px 3px 5px; margin-right:10px; } .sm_table_history > tbody > tr:nth-child(even) > td i { background:#E9781E; } .sm_table_history > tbody > tr > td > i.his_01 {background:#6827FF;} .sm_table_history > tbody > tr > td > i.his_02 {background:#0094F2;} .sm_table_history > tbody > tr > td > i.his_03 {background:#0EA54A;} @media screen and (max-width: 767px) { .sm_table_history-normal { width: 100%; margin-bottom: 15px; } .sm_table_history-normal > .sm_table_history { margin-bottom: 0; border:0px; } .sm_table_history-normal > .sm_table_history > thead > tr > th, .sm_table_history-normal > .sm_table_history > tbody > tr > th, .sm_table_history-normal > .sm_table_history > tfoot > tr > th, .sm_table_history-normal > .sm_table_history > thead > tr > td, .sm_table_history-normal > .sm_table_history > tbody > tr > td, .sm_table_history-normal > .sm_table_history > tfoot > tr > td { border: 1px solid #ddd; } .sm_table_history-normal > .sm_table_history { border: 0; } } @media screen and (max-width: 496px) { .sm_table_history { font-size:14px; } .sm_table_history > tbody > tr > th { font-size:15px; } } @media screen and (max-width: 767px) { .sm_table_history-responsive { width: 100%; margin-bottom: 15px; overflow-y: hidden; -ms-overflow-style: -ms-autohiding-scrollbar; } .sm_table_history-responsive > .sm_table_history { margin-bottom: 0; border:0px; } .sm_table_history-responsive > .sm_table_history > thead > tr > th, .sm_table_history-responsive > .sm_table_history > tbody > tr > th, .sm_table_history-responsive > .sm_table_history > tfoot > tr > th, .sm_table_history-responsive > .sm_table_history > thead > tr > td, .sm_table_history-responsive > .sm_table_history > tbody > tr > td, .sm_table_history-responsive > .sm_table_history > tfoot > tr > td { white-space: nowrap; border: 1px solid #ddd; } .sm_table_history-responsive > .sm_table_history { border: 0; } }