/* css */ @import url(./fonts/nanumgothic.css); @import url(./fonts/nanumsquare.css); /*****************************************************************/ /*메인페이지 레이아웃*/ /*****************************************************************/ .in_wide {max-width:100%; top:15px; position:relative; z-index:0; font-family:'nanumsquare';} @media only screen and (max-width:496px){ .in_wide {padding:0 10px; top:0;} } /*메인이미지*/ .in_img {width:100%; margin-top:0px; background:url(../images/in_img_bg.jpg) top center no-repeat; border-bottom:#e5e5e5 0px solid; position:relative; overflow:hidden;} .in_img>div {overflow:hidden;} .in_img>div:nth-child(2) {float:right; width:24.1%;} .in_img>div:nth-child(2)>ul {list-style:none; margin:0; padding:0; overflow:hidden;} .in_img>div:nth-child(2)>ul>li {float:left; width:50%;} .in_img img {max-width:100%;} @media only screen and (max-width:496px){ .in_img {padding:0 10px;} .in_img div.img-wrap {padding-bottom:40% !important;} .in_img>div:nth-child(2) {float:none; width:100%;} .in_img>div:nth-child(2) img {width:100%;} } #carouselButtons {width:75px; position:absolute; left:0; bottom:10px; overflow:hidden;} @media only screen and (max-width:496px){ #carouselButtons {position:relative; top:5px; margin-bottom:20px;} } /*메인배너*/ .in_banner {max-width:1260px; margin:0 auto; top:15px; z-index:2; position:relative; overflow:hidden;} .in_banner>div {max-width:1260px; margin:0 auto; position:relative; text-align:center; overflow:hidden;} .in_banner>div>h3 {font-size:46px; margin:35px 0 10px 0;} .in_banner>div>h4 {font-size:24px; margin:0px 0 15px 0;} .in_banner>ul {list-style:none; margin:0; padding:0; overflow:hidden;} .in_banner>ul>li {float:left; width:33.33%; padding:0; text-align:center;} .in_banner>ul>li>p {font-size:19px; font-weight:bold; line-height:120%; letter-spacing:-0.7px; margin-top:15px;} .in_banner img {max-width:100%;} @media only screen and (max-width:496px){ .in_banner {margin-top:20px; top:0; padding:0 10px;} .in_banner>div>h3 {font-size:36px; margin:20px 0 10px 0;} .in_banner>div>h4 {font-size:16px; margin:0px 0 10px 0;} .in_banner>ul>li {float:none; width:100%; margin-bottom:10px;} } /*공지사항*/ .in_notice {width:100%; border-top:#e2e2e2 1px solid; margin-bottom:80px; padding-top:65px; position:relative; overflow:hidden;} .in_notice>ul {list-style:none; max-width:1260px; margin:0 auto; padding:0; overflow:hidden;} .in_notice>ul>li {float:left; width:46%;} .in_notice>ul>li:last-child {float:right;} .in_notice ul>li.in_schedule {padding:0px 30px 10px 30px; background:url(../images/in_schedule_bg.jpg);} .in_notice ul>li.in_schedule h2 {float:left; margin:0 0 10px 0; font-size:24px; font-weight:700; letter-spacing:-1px;} .in_notice ul>li.in_schedule h2 a {background:url(../images/in_day_icon.png) no-repeat 0 0px; padding-left:50px; padding-top:10px; height:41px; display:block;} .in_notice>ul>li>a {display:block; margin-bottom:15px; overflow:hidden;} .in_notice>ul>li>a>b {font-size:23px; font-weight:normal; letter-spacing:-1px; line-height:150%; float:left;} .in_notice>ul>li>a>i {float:right;} .in_notice>ul>li>div {min-height:250px; padding:10px 0 0 0; border-top:#222 2px solid; border-bottom:#222 2px solid; overflow:hidden;} .in_notice>ul>li img {max-width:100%;} @media only screen and (max-width:496px){ .in_notice {border-top:none; margin-bottom:20px; padding-top:0;} .in_notice>ul>li {float:none; width:100%; min-height:inherit; margin-bottom:40px;} } /*공지사항 웹접근성 멀티탭*/ .tab.list {height:300px !important; overflow:hidden;} .tab.list ul {position:relative; margin:0; padding:0; list-style:none;} .tab.list ul:after {content:""; display:block; clear:both;} .tab.list>ul>li {float:left; width:50%; margin-bottom:0px; text-align:left; overflow:hidden;} .tab.list>ul>li:last-child {padding-left:5px;} .tab.list>ul>li>a {position:relative; float:left; width:100%; padding:9px 13px 8px 13px; background:#fff; color:#666; border:#d8d8d8 1px solid;} .tab.list>ul>li>a>span {position:relative; display:inline-block; letter-spacing:-0.5px; cursor:pointer; font-size:17px; font-weight:700; 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; background:#f55355; border:#fb666d 1px solid; color:#FFFFFF;} .tab.list>ul>li>ul>p.more {position:absolute; right:0px; top:-62px; text-align:center; z-index:11; } .tab.list>ul>li>ul>p.more>a {position:relative; display:inline-block; padding:12.5px 0;} .tab.list>ul>li>ul {width:100%; height:240px; position:absolute; background:#fff; border:#d6d6d6 0px solid; top:65px; left:0; list-style:none; margin:0; padding:10px 10px; 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:300px !important;} .tab.list>ul>li>a>i {display:none;} .tab.list>ul>li>ul {width:100%; position:absolute; top:65px; padding:15px;} } /*갤러리*/ .in_gallery {max-width:1260px; margin:35px auto; position:relative; overflow:hidden;} .in_gallery>h3 {margin:0 0 10px 0; font-size:34px; font-weight:bolder; line-height:130%; letter-spacing:-1px; text-align:center;} .in_gallery>h4 {margin:0; font-size:20px; font-weight:normal; line-height:130%; text-align:center; color:#777;} .in_gallery>h4>i {position:absolute; right:0; font-style:normal; font-size:15px;} .in_gallery>div {padding:20px 0 0 0; overflow:hidden;} .in_gallery img {max-width:100%;} @media only screen and (max-width:496px){ .in_gallery {margin:0px auto 20px auto; padding:0; border:none;} .in_gallery>div>h3 {width:200px;} .in_gallery>ul {margin:30px auto 0 auto;} .in_gallery>ul>li {float:none; width:100% !important; min-height:inherit; margin-bottom:25px;} .in_gallery>ul>li>div {padding:0 !important;} .in_gallery>h3 {font-size:24px; padding:0 5%;} .in_gallery>h3 i {position:relative; display:block; text-align:center; right:inherit;} .in_gallery>span {margin-bottom:20px;} .in_gallery>p {font-size:24px;} .in_gallery>p>a>em {display:none;} } /*주요사엽*/ .in_saup {width:100%; margin:40px auto; position:relative; overflow:hidden;} .in_saup>h3 {margin:0 0 10px 0; font-size:34px; font-weight:bolder; line-height:130%; letter-spacing:-1px; text-align:center;} .in_saup>h4 {margin:0; font-size:20px; font-weight:normal; line-height:130%; text-align:center; color:#777;} .in_saup>ul {list-style:none; max-width:1260px; margin:35px auto 0 auto; padding:0; overflow:hidden;} .in_saup>ul>li {float:left; width:33.33%; margin-bottom:40px;} .in_saup>ul>li:nth-child(1) {text-align:left;} .in_saup>ul>li:nth-child(2) {text-align:center;} .in_saup>ul>li:nth-child(3) {text-align:right;} .in_saup>ul>li:nth-child(4) {text-align:left;} .in_saup>ul>li:nth-child(5) {text-align:center;} .in_saup>ul>li:nth-child(6) {text-align:right;} .in_saup>ul>li>a>img {border:#333333 1px solid; border-radius:10px;} .in_saup img {max-width:100%;} @media only screen and (max-width:496px){ .in_saup>h4 {font-size:17px;} .in_saup>ul>li {float:left; width:50%; margin-bottom:20px;} .in_saup>ul>li:nth-child(odd) {text-align:left; padding-right:5px;} .in_saup>ul>li:nth-child(even) {text-align:right; padding-left:5px;} .in_saup>ul>li>a>img {border-radius:5px;} } /*패밀리사이트*/ .in_family {max-width:1260px; margin:0 auto 80px auto; position:relative; overflow:hidden;} .in_family>ul {list-style:none; margin:0; padding:0; overflow:hidden;} .in_family>ul>li {float:left; width:50%; min-height:390px;} .in_family>ul>li:first-child {border:#efefef 9px solid; border-right:none; padding:20px 30px;} .in_family>ul>li>span {background:#243c53; border-radius:4px; padding:8px 35px; margin-bottom:5px; font-size:18px; color:#FFF; display:inline-block;} .in_family>ul>li>ul {list-style:none; margin:0; padding:0; overflow:hidden;} .in_family>ul>li>ul>li {float:left;} .in_family img {max-width:100%;} @media only screen and (max-width:496px){ .in_family {margin:0 auto 40px auto;} .in_family>ul>li {float:none; width:100%; min-height:inherit;} .in_family>ul>li:first-child {border:#efefef 9px solid !important; padding:10px 10px;} .in_family>ul>li>span {text-align:center; display:block;} .in_family>ul>li>ul {list-style:none; margin:0; padding:0; overflow:hidden;} .in_family>ul>li>ul>li {float:none; width:100%; text-align:center;} } /*메인홍보영상*/ .in_mov {margin-bottom:50px; background:#b9e7ff; position:relative; overflow:hidden;} .in_mov>ul {max-width:1260px;list-style:none; margin:0 auto; padding:33px 0; overflow:hidden;} .in_mov>ul>li {float:left; min-height:405px;} .in_mov>ul>li:first-child {width:500px; background:url(../images/in_map_icon.png) right bottom no-repeat; border:#FFF 2px solid; padding:25px 20px 10px 30px;} .in_mov>ul>li:first-child>h3 {font-size:40px; font-weight:bold; color:#208ac2; letter-spacing:-1px;} .in_mov>ul>li:first-child>p {font-size:24px; letter-spacing:-0.5px; margin:15px 0 30px 0;} .in_mov>ul>li:first-child>a {background:#208ac2; padding:10px 20px; font-size:22px; font-weight:bold; color:#FFF; } .in_mov>ul>li:first-child>a:hover {background:#0083cc; color:#FFFFFF;} .in_mov>ul>li:last-child {float:right; width:100%; max-width:720px;} .in_mov>ul>li:last-child>div.video-container {position:relative; width:100%; height:auto; padding-top:56.25%;} .in_mov>ul>li:last-child>div.video-container>iframe {z-index:1; top:0; left:0; position:absolute; width:100%; height:100%;} @media only screen and (max-width:496px){ .in_mov>ul>li {float:none; height:auto;} .in_mov>ul>li:first-child {width:100%; background:none; padding:15px; margin-bottom:20px;} .in_mov>ul>li:first-child>h3 {font-size:30px; display:inline;} .in_mov>ul>li:first-child>h4 {font-size:24px; display:inline;} .in_mov>ul>li:first-child>p {font-size:17px; text-align:justify; margin:15px 0 40px 0;} .in_mov>ul>li:first-child>p>br {display:none;} .in_mov>ul>li:last-child {width:100%; text-align:center;} } /*SNS*/ .in_sns {max-width:1260px; margin:0px auto 60px auto; padding:22px; border:#d1d1d1 1px solid; 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%; border-right:#d1d1d1 1px solid; text-align:center;} .in_sns>ul>li:last-child {border-right:none;} @media only screen and (max-width:496px){ .in_sns {margin:0px auto 30px auto; padding:0px; border:none;} .in_sns>ul>li {float:none; width:100%; margin-bottom:10px; padding:20px 10px; border:#d1d1d1 1px solid !important;} } /*사이트배너*/ .in_site {max-width:1260px; position:relative; margin:0px auto 30px auto; overflow:hidden;} .in_site>div {border:#d6d6d6 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_copy {max-width:1260px; position:relative; margin:0px auto; padding:20px 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:35%; text-align:right; padding-right:25px; padding-top:17px;} #in_copy>div:nth-child(2) {width:65%; text-align:left; padding-top:20px;} #in_copy>div:nth-child(2)>p {margin-bottom:2px;} #in_copy>div:nth-child(3) {width:10%;} #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; text-align:center !important; padding:0 10px; font-size:14px;} #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;} /*********************************************************************************************************************************************/ /*****************************************************************/ /* 서브페이지 레이아웃 */ /*****************************************************************/ #sub_layout {max-width:1260px; margin:0 auto; padding:0px; position:relative; overflow:hidden;} /*#sub_layout #sub_left {width:20%; max-width:222px; float:left; margin-right:0px; overflow:hidden;}*/ #sub_layout>#sub_center {width:100%; margin:0; overflow:hidden;} #sub_layout>#sub_center>#sub_content {width:100%; margin:40px 0 50px 0; font-size:16px; color:#555555; 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 {float:none;} } @media only screen and (max-width:496px){ #sub_layout {padding:0px 10px;} #sub_layout>#sub_center>#sub_content {margin:0 0 50px 0;} } /*서브페이지 이미지*/ #sub_img {max-width:100%; text-align:center; background:url(../images/sub_img_bg.jpg) repeat-x top; border-top:#FFF 0px solid; border-bottom:#ECECEC 0px 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 { line-height:35px; margin:70px auto 0px auto; padding:0 0 5px 0; text-align:left; border-bottom:1px solid #cccccc; overflow:hidden; } .sub_title>.header-breadcrumb { margin-top:8px; font-size:13px; } .sub_title>div>span { display:inline-block; padding-bottom:0px; font-size:24px; font-weight:700; letter-spacing:-0.5px;} @media all and (max-width:496px) { .responsive .sub_title .header-breadcrumb { display:none; } .sub_title { line-height:35px; margin:30px auto; } .sub_title>div>span { font-size:24px; } } #sub_tt {width:100%; text-align:center; font-size:38px; font-weight:normal; color:#222222; padding:45px 0 40px 0; overflow:hidden;} /* 서브메뉴 */ #sub_menu {width:100%; background:#FFF; padding:0; border-top:#ECECEC 0px solid; border-bottom:#0267B7 0px solid;} /* 서브베너 */ #sub_banner {margin-top:40px; margin-bottom:20px; overflow:hidden; clear:both;} /*****************************************************************/ /* 3차 탭메뉴 */ /*****************************************************************/ .sub_tap { width:100%; margin-bottom:60px; overflow:hidden; } .sub_tap ul { width:100%; list-style:none; margin:0; padding:0; border-top:#DDDDDD 1px solid; border-left:#DDDDDD 1px solid; border-right:#DDDDDD 1px solid; display:table; table-layout:fixed; overflow:hidden; } .sub_tap li { display:table-cell; vertical-align:middle; height:50px; padding:5px; font-size:17px; color:#999; font-family:'NanumSquare'; letter-spacing:0px; text-align:center; cursor:pointer; border-right:#DDDDDD 1px solid; border-bottom:#DDDDDD 1px solid; background:#F5F5F5; } .sub_tap li:last-child { border-right:none; } .sub_tap li.select { font-size:20px; font-weight:bold; color:#F75700; border-bottom:#FFF 1px solid; background:#FFF; } .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;} /* 후원, 자원봉사 게시판 3차메뉴 탭 */ .bo_tab {max-width:1260px; 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:#F2F2F2; border:#FFF 1px solid; text-align:center; margin-bottom:0px;} .bo_tab>ul>li:hover {background:#EEEEEE;} .bo_tab>ul>li>a {font-size:16.5px; font-family:'NanumSquare'; letter-spacing:-0.5px; color:#777; padding:11px 5px 11px 5px; display:block;} .bo_tab>ul>li>a:hover {color:#FFF; background:#41C87E;} .bo_tab>ul>li>a.active {background:#01B552; 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%;} .row1{} .row1>li {width:100%;} .row1>div>div>div>div {max-width:100%;} .row2{} .row2>li {width:50%;} .row2>div>div>div>div {max-width:50%;} .row3{} .row3>li {width:33.33%;} .row3>div>div>div>div {max-width:33.33%;} .row4{} .row4>li {width:25%;} .row4>div>div>div>div {max-width:25%;} .row5{} .row5>li {width:20%;} .row5>div>div>div>div {max-width:20%;} .row6{} .row6>li {width:16.66%;} .row6>div>div>div>div {max-width:16.66%;} .row7{} .row7>li {width:14.28%;} .row7>div>div>div>div {max-width:14.28%;} .row8{} .row8>li {width:12.5%;} .row8>div>div>div>div {max-width:12.5%;} .row9{} .row9>li {width:11.11%;} .row9>div>div>div>div {max-width:11.11%;} .row10{} .row10>li {width:10%;} .row10>div>div>div>div {max-width:10%;} .row11{} .row11>li {width:9.09%;} .row11>div>div>div>div {max-width:9.09%;} /* !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! 위 수치는 수정하지 말 것 !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! */ /*****************************************************************/ /* 내용 타이틀 */ /*****************************************************************/ .title_tea {background:url(../images/icon_36.gif) no-repeat 0 4px; padding-left:20px; margin-bottom:10px; font-weight:600; font-size:24px; color:#333333; text-align:left; clear:both;} .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; clear:both;} .title_t1 {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;} .title_t2 {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;} /* 내용 단락 */ .content_01 {margin:20px 0px 80px 0px; font-size:17px; 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 50px 0px;} } .content_02 {margin:20px 0px 40px 20px; font-size:17px; 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 50px 0px;} } .content_03 {margin:5px 0px 30px 20px; font-size:17px; 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:5px 0px 50px 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 40px 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;} @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_box03 {padding:20px 20px; margin:0px 0px 40px 0px; font-size:18px; text-align:justify;} .content_box03>br {display:none;} } /*****************************************************************/ /* 내용 꾸미기 */ /*****************************************************************/ .list_dot {list-style:disc; margin:0; padding-left:30px;} .list_dot>li {margin-bottom:5px;} .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%;} @media only screen and (max-width:496px){ .list_dot {font-size:16px; line-height:140%; padding-left:25px;} } .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:5px; font-size:28px; font-family:'nanumsquare'; line-height:150%; text-align:center;} .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_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;} .ddam2_start {background:url(../images/icon_ddam2_start.png) no-repeat left top; opacity:1; padding-right:35px;} .ddam2_end {background:url(../images/icon_ddam2_end.png) no-repeat right top; opacity:1; padding-left:30px;} .sm_ddaum {text-align:center; font-size:25px; 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 br {display:none;} .sm_ddaum>b {font-weight:normal; font-size:33px;} @media only screen and (max-width:496px){ .sm_ddaum {font-size:18px; line-height:180%;} .sm_ddaum br {display:block;} .sm_ddaum>b { font-size:18px;} .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;} .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; padding:0; margin:10px auto 20px auto; overflow:hidden;} .sm_step2>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_step2>li:first-child {margin:0 0 10px 0px;} .sm_step2>li:last-child {background:none;} .sm_step2>li>div {border-radius:10px; text-align:center; font-size:22px; font-weight:bold; line-height:130%; color:#FFFFFF; padding:10px 10px; display:table-cell; vertical-align:middle;} .sm_step2>li:nth-child(1)>div {background:#1A479A;} .sm_step2>li:nth-child(2)>div {background:#019EBF;} .sm_step2>li:nth-child(3)>div {background:#00A300;} .sm_step2>li:nth-child(4)>div {background:#C17014;} .sm_step2>li:nth-child(5)>div {background:#FF5500;} @media only screen and (max-width:496px){ .sm_step2>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_step2>li>div {border-radius:10px; font-size:18px;} .sm_step2>li>div>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%; background:url(../images/sm_ceo_bg.jpg) top center no-repeat; position:relative; overflow:hidden;} .sm_ceo>div:nth-child(1) {float:left; width:35%; padding-top:200px; text-align:center; overflow:hidden;} .sm_ceo>div:nth-child(2) {float:left; width:65%; padding-top:140px; font-size:20px; line-height:160%; overflow:hidden;} .sm_ceo>div>h3 {font-size:36px; font-weight:normal; line-height:130%; color:#3a52b9; margin-top:0; margin-bottom:30px;} .sm_ceo>div>h4 {font-size:27px; font-weight:bold; line-height:150%; color:#fa5f3b; margin-bottom:30px;} .sm_ceo>div>p {margin-bottom:30px; padding-left:35px; letter-spacing:0px;} .sm_ceo>div>div {text-align:right;} .sm_ceo>div>div>img {margin-left:10px;} @media only screen and (max-width:496px){ .sm_ceo {background:none;} .sm_ceo>div:nth-child(1) {float:none; width:100%; padding-top:0px;} .sm_ceo>div:nth-child(2) {float:none; width:100%; padding-top:20px; font-size:18px;} .sm_ceo>div>h3 {font-size:26px;line-height:130%; margin-bottom:30px;} .sm_ceo>div>h3>span {display:none !important;} .sm_ceo>div>p {padding-left:0; text-align:justify;} .sm_ceo>div>p>br {display:none;} } /* 법인소개 */ .sm_bubin {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; font-family:'nanumsquare'; line-height:170%; text-align:center; display:table-cell; vertical-align:middle;} .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:90%; margin:0 auto; padding:0; overflow:hidden;} .sm_bubin>ul>li {margin-bottom:40px; overflow:hidden;} .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:40px;} .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;} } /* 법인CI */ .sm_ci {width:100%; margin-bottom:30px; position:relative; overflow:hidden;} .sm_ci>div {width:100%; text-align:center; padding:20px 40px; background:url(../images/sm_ci_bg.png);} .sm_ci>div>p {margin-bottom:25px;} .sm_ci>dt {float:left; width:25%; text-align:center;} .sm_ci>dd {float:left; width:75%; border-left:#CCCCCC 1px solid; padding:10px 0px 10px 20px;} .sm_ci>dd>p {font-size:24px; font-weight:600; color:#009966;} @media only screen and (max-width:496px){ .sm_ci>div {padding:20px 25px;} .sm_ci>div>p>br {display:none;} .sm_ci>dt {float:none; width:100%; text-align:center;} .sm_ci>dd {float:none; width:100%; border-left:none; padding:10px 0px;} .sm_ci>dd>p {font-size:20px;} } /* 투명경영 */ .sm_clean {width:100%; overflow:hidden;} .sm_clean>div {float:left; width:50%; padding:0 10px; overflow:hidden;} @media only screen and (max-width:496px){ .sm_clean>div {float:none; width:100%;} } /* 사업기관 */ .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:1260px; 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_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_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:18px;} .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_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_team {background:#F7F7F7; padding:10px 20px; margin-bottom:25px; overflow:hidden;} .sm_zozic {float:left; width:400px; min-height:200px; margin:0 5px 25px 5px; padding:10px; border-top:#ddd 1px solid; border-bottom:#eee 1px solid; overflow:hidden;} .sm_zozic>div {float:left; width:30%; overflow:hidden;} .sm_zozic>div:last-child {width:70%; padding-left:10px;} .sm_zozic>div>h4 {padding:5px 0 0 0; margin-top:0; margin-bottom:10px;} .sm_zozic>div>h4>b {font-weight:normal; color:#CC6666;} .sm_zozic>div>ul {list-style:none; margin:0; padding:0; text-align:left; overflow:hidden;} .sm_zozic>div>ul>li {background:url(../images/icon_20.gif) no-repeat 0 8px; padding-left:10px; font-size:14px; line-height:140%;} .sm_zozic>div>ul>li>b {width:38px; display:inline-block;} @media only screen and (max-width:496px){ .sm_zozic {float:none; width:100%;} } /* 연혁 */ .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; line-height:40px; padding-right:100px; padding-top:20px;} .sm_his>div>div:first-child>b {font-size:24px;} .sm_his>div>div:first-child>span {display:block;} .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:80px; margin:20px 0 5px 0; font-size:24px; color:#0066CC;} .sm_his>div>div:last-child dd {padding-left:80px; margin-bottom:10px; color:#999;} .sm_his>div>div:last-child dd>b {color:#222;} @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: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;} } /* 지도 */ @media only screen and (max-width:496px){ .sm_map {display:none;} } @media only screen and (min-width:497px){ .sm_map_m {display:none;} } .sm_map2 {width:100%; margin-bottom:60px; overflow:hidden;} .sm_map2>ul {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_map2>ul>li {float:left; width:50%; text-align:center;} .sm_map2>ul>li:last-child {border:#CCCCCC 1px solid; border-left:none;} @media only screen and (max-width:496px){ .sm_map2>ul>li {float:none; width:100%;} .sm_map2>ul>li:last-child {border-left:#CCCCCC 1px solid;} } /* 이용안내 */ .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;} /* 사업소개 - 가운데정렬 */ .sm_saup_ddam {font-size:30px; font-family:'NanumSquare'; line-height:150%; text-align:center; margin:30px 0 70px 0; overflow:hidden;} .sm_saup_ddam>b {color:#ED2978; font-weight:normal;} @media only screen and (max-width:496px){ .sm_saup_ddam {font-size:26px;} .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 {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 {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_certi {list-style:none; margin:0; padding:0; overflow:hidden;} .sm_certi>li {float:left; width:300px; margin-bottom:20px; padding:0; text-align:center;} .sm_certi>li>div {width:95%; margin:0 auto; 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_jindan_head {background:#F6F6F6; border-left:#E30026 3px solid; margin-bottom:20px; padding:15px 20px; font-size:18px; font-family:'nanumsquare'; line-height:170%; overflow:hidden;} @media only screen and (max-width:496px){ .sm_jindan_head {padding:15px 15px; font-size:18px; line-height:150%;} .sm_jindan_head>br {display:none;} } /* 자원봉사 활동내용 */ .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_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_bang {width:100%; display:table; table-layout:fixed; list-style:none; margin:10px 0 0; padding:0; font-family:'nanumsquare'; overflow:hidden;} .sm_hoowon_bang>li {display:table-cell; text-align:center; padding:0 20px;} .sm_hoowon_bang>li>div {min-height:200px; padding:20px; color:#FFFFFF; font-weight:bold; padding-top:27%; border-radius:20px; overflow:hidden;} .sm_hoowon_bang>li:nth-child(1)>div {background:#F0568C;} .sm_hoowon_bang>li:nth-child(2)>div {background:#F69301;} .sm_hoowon_bang>li:nth-child(3)>div {background:#55CE9B;} .sm_hoowon_bang>li:nth-child(4)>div {background:#329FF1;} .sm_hoowon_bang>li:nth-child(5)>div {background:#6F38C5;} .sm_hoowon_bang>li>div>h3 {font-size:26px; font-weight:bold; margin:0 0 10px 0;} .sm_hoowon_bang>li>div>p {font-size:17px; line-height:130%;} @media only screen and (max-width:496px){ .sm_hoowon_bang>li {display:block; margin-bottom:15px;} .sm_hoowon_bang>li>div {min-height:inherit; padding:15px 10px;} } /* 후원계좌 */ .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: 10px; margin-bottom: 15px; } .sm_table-normal>table { table-layout:fixed; } /* 반은형 테이블-----------------------------------------------------------*/ .sm_table-responsive { min-height: .01%; overflow-x: auto; margin-top: 10px; margin-bottom: 15px; } /* 테이블-----------------------------------------------------------*/ .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: 10px 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 > 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:5px; 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; } } 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: 4px; vertical-align: top; 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:#968A82; 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(even) > 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; } } /* 테이블 연혁01-----------------------------------------------------------*/ .sm_history01 {margin-top:20px; overflow:hidden;} .sm_history01>div:first-child {float:left; width:25%; text-align:center;} .sm_history01>div:last-child {float:left; width:75%;} @media screen and (max-width: 767px) { .sm_history01>div:first-child {float:none; width:100%; text-align:center; margin:20px 0;} .sm_history01>div:last-child {float:none; width:100%;} } .sm_table_history01 { width: 100%; max-width: 100%; font-size:16px; border-top:1px solid #FFFFFF; border-left:#FFFFFF 2px solid; border-right:#FFFFFF 2px solid; } .sm_table_history01 > thead > tr > th { white-space:nowrap; } .sm_table_history01 > thead > tr > th, .sm_table_history01 > tbody > tr > th, .sm_table_history01 > tfoot > tr > th, .sm_table_history01 > thead > tr > td, .sm_table_history01 > tbody > tr > td, .sm_table_history01 > tfoot > tr > td { padding: 4px; vertical-align: top; word-wrap: break-word; text-align: left; } .sm_table_history01 > thead > tr > th { white-space:nowrap; background-color:#fff; border-bottom: 1px solid #AAA; font-size:16px; text-align:center; } .sm_table_history01 > 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_history01 > tbody > tr > td { border-bottom: 1px dashed #ddd; color:#968A82; text-align:left; vertical-align:middle; padding-left:10px; } .sm_table_history01 > tbody > tr > td:last-child { color:#333333; text-align:left; } .sm_table_history01 > tbody > tr:nth-child(even) > td:last-child { background:#FAFAFA; } .sm_table_history01 > tbody > tr > td > ul { list-style:none; margin:0; padding:0; } .sm_table_history01 > 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_history01 > tbody > tr:nth-child(even) > td i { background:#E9781E; } .sm_table_history01 > tbody > tr > td > i.his_01 {background:#6827FF;} .sm_table_history01 > tbody > tr > td > i.his_02 {background:#0094F2;} .sm_table_history01 > 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; } }