/* wrap */ #wrap {width:100%;height:auto;overflow:hidden} /* ///// header ///// */ header {width:100%;border-bottom:1px solid #e7eaed;overflow:hidden;background:#fff;box-sizing:border-box} header h1 {display:block;text-align:center;margin:32px auto 28px;width:326px;position:relative;z-index:2} header h1 a {display:block} header h1 a img {display:block;width:100%} header #m_menu {display:none} /* topNavi */ header .topNavi {width:100%;max-width:1200px;margin-left:-600px;position:absolute;top:45px;left:50%;box-sizing:border-box;text-align:right;z-index:1} header .topNavi li {display:inline-block;position:relative;margin-left:5px} /*header .topNavi li:after {display:block;content:"";width:5px;height:5px;position:absolute;top:14px;left:-5px;background:url(../images/inc/topNavi_dot.png) center no-repeat} header .topNavi li:first-child:after {display:none} header .topNavi li:last-child {padding-right:0}*/ header .topNavi li a {font-size:12px;display:block;background:#2f3943;color:#fff;padding:4px 10px 6px;line-height:16px} /* gnb */ #m_menu {display:none} header .pc_gnb{overflow:hidden;position:absolute;border-top:1px solid #e7eaed;border-bottom:1px solid #e7eaed;width:100%;z-index:1000;background:#fff;} header .pc_gnb .menu{font-size:18px} header .pc_gnb:before {content:"";display:block;width:100%;height:1px;background:#bcc0c4;position:absolute;top:60px;left:0} header .pc_gnb ul {margin:0 auto; width:100%;max-width:1200px;position:relative;top:0px} header .pc_gnb > ul > li{position:relative; float:left;height:60px;line-height:59px} header .pc_gnb > ul > li.hv > a{color:#0b4f98} header .pc_gnb > ul > li.has-sub {text-align:center;width:16%} header .pc_gnb > ul > li.last-sub {text-align:center;width:20%;background:url(/renew/images/main/border_active.jpg) top center repeat-y;background-size:100%;} header .pc_gnb > ul > li.last-sub > a {color:#fff;} header .pc_gnb > ul > li > a{display:block;font-size:18px} header .pc_gnb > ul > li > a.active {color:#0b4f98} header .pc_gnb ul li ul {position:absolute; top:60px;width:100%;text-align:center;padding-top:15px;box-sizing:border-box;height:370px;z-index:1000} header .pc_gnb ul li:hover ul {background:#f4f4f4} header .pc_gnb ul li:hover ul:before {content:"";display:block;position:absolute;top:0;left:0;height:2px;width:100%;background:#0b4f98} header .pc_gnb ul li ul:hover {background:#f4f4f4} header .pc_gnb ul li ul:hover:before {content:"";display:block;position:absolute;top:0;left:0;height:2px;width:100%;background:#0b4f98} header .pc_gnb ul li ul li{float:none;font-size:13px;text-align:center;line-height:40px} header .pc_gnb > ul > li > ul > li > a{display:block;font-size:16px} header .pc_gnb ul li ul li a:hover{color:#0b4f98} header .pc_gnb ul li ul li a:focus{color:#0b4f98} header .stuck{position: fixed;top:0} /* ///// contents ///// */ /* visualBox */ #visualBox .jd-slider {background:url(../images/main/visual_bg.jpg) center top no-repeat #e7eaed;padding:40px 0;box-sizing:border-box;position:relative} #visualBox .jd-slider .slide-inner::before {content: '';position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index: 0} #visualBox .jd-slider .slide-area > li {border-left: 0;box-sizing: border-box;text-align: center} #visualBox .jd-slider .slide-area > li:first-child {} #visualBox .jd-slider .slide-area > li > a {display: block;outline: 0} #visualBox .jd-slider .slide-inner {overflow: hidden;position: relative;width:100%;max-width:1200px;margin:0 auto;box-sizing:border-box;} #visualBox .jd-slider .slide-area {width:100%;margin:0;} #visualBox .jd-slider .slide-area:after {display: block;content: '';clear: both} #visualBox .jd-slider .slide-area li {display: none;float: left;width: 100%} #visualBox .jd-slider .slide-area li:first-child {display: block} #visualBox .jd-slider .slide-area li img {display: block;width: 100%;max-height:500px} #visualBox .jd-slider .prev, .jd-slider .next {position: absolute;top:0;} #visualBox .jd-slider .hidden.prev, .jd-slider .hidden.next {display: none} #visualBox .jd-slider .btn_arrow {width:100%;max-width:1200px;margin:0 auto;position:absolute;top:50%;left:50%;margin-top:-54px;margin-left:-600px;} #visualBox .jd-slider .prev {left:-35px;width:70px;height:109px;background:url(../images/main/visual_arrow_left.png) center no-repeat} #visualBox .jd-slider .next {right:-35px;width:70px;height:109px;background:url(../images/main/visual_arrow_right.png) center no-repeat} #visualBox .jd-slider .controller {width: 100%;text-align: center;line-height:5px;font-size:0;margin-top:20px} #visualBox .jd-slider .controller .auto {display:none;vertical-align: middle} #visualBox .jd-slider .controller .indicate-area {display: inline-block;line-height:5px} #visualBox .jd-slider .controller .indicate-area a { display: inline-block; position: relative; width:60px; height:5px; margin: 0 5px; background:#bcc0c4; font-size: 0; color: transparent; vertical-align: middle; } #visualBox .jd-slider .controller .indicate-area a:after {content: '';position: absolute;top: 0;left: 0;width: inherit;height: inherit;width:60px;height:5px; -webkit-box-sizing: border-box; box-sizing: border-box; } #visualBox .jd-slider .controller .indicate-area a.on:after {background-color: #2f3943;} #visualBox .jd-slider.fade .slide-area li {display: block;position: absolute;top: 0;left: 0;opacity: 0; -webkit-transform: translateZ(0); transform: translateZ(0); } #visualBox .jd-slider.fade .slide-area li:first-child {position: static;opacity: 1} #visualBox .jd-slider.slider--none .prev, .jd-slider.slider--none .next, .jd-slider.slider--none .controller {display: none} /* banner */ #banner {padding:31px 0; background: -moz-linear-gradient(45deg, #005199 0%, #06335a 100%); background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, #005199), color-stop(100%, #06335a)); background: -webkit-linear-gradient(45deg, #005199 0%, #06335a 100%); background: -o-linear-gradient(45deg, #005199 0%, #06335a 100%); background: -ms-linear-gradient(45deg, #005199 0%, #06335a 100%); background: linear-gradient(45deg, #005199 0%, #06335a 100%); } #banner dl {width:100%;max-width:965px;margin:0 auto;overflow:hidden;} #banner dl dt {display:block;float:left;} #banner dl dd {margin-top:19px} #banner dl dd a {display:block;float:left;border:5px solid #fff;text-align:center;color:#fff;width:380px;box-sizing:border-box;height:65px;line-height:53px;font-size:18px;margin-left:65px} /* noticeBox */ #noticeBox {width:100%;max-width:1200px;margin:85px auto;overflow:hidden;} #noticeBox .board {width:570px;float:left;position:relative} #noticeBox .board:first-child {margin-right:30px} #noticeBox .board .btn_more {width:24px;height:24px;text-indent:-9999px;background:url(../images/main/btn_more.png) center center no-repeat;display:block;position:absolute;top:0;right:0} #noticeBox .board .menu {font-size:0;margin-left:1px} #noticeBox .board .menu a {display:inline-block;font-size:20px;border:1px solid #e7eaed;margin-left:-1px;width:169px;height:55px;box-sizing:border-box;border-bottom:0;text-align:center;line-height:55px} #noticeBox .board .menu a.active {color:#00529b;position:relative} #noticeBox .board .menu a.active:before {content:"";display:block;position:absolute;bottom:0;left:-1px;width:169px;height:3px;background:#06335c} #noticeBox .board ul {border-top:1px solid #2f3943} #noticeBox .board ul li {position:relative;border-bottom:1px solid #e7eaed;padding:15px 0} #noticeBox .board ul li span {position:absolute;top:16px;right:0;color:#bcc0c4;font-size:15px} #noticeBox .board ul li a:hover {color:#00529b} /* 2020-08-03 수정 */ #noticeBox .border_list {width:570px;float:left;position:relative;padding-bottom:15px} #noticeBox .border_list:first-child {margin-right:60px} #noticeBox .border_list .tab.list ul{position:relative;margin:0;padding:0;list-style:none;margin-left:1px} #noticeBox .border_list .tab.list ul:after{content:"";display:block;clear:both} #noticeBox .border_list .tab.list li{float:left;} #noticeBox .border_list .tab.list li > a{position:relative;float:left;display:block;width:170px;box-sizing:border-box;height:54px;line-height:52px;border:1px solid #e7eaed;margin-left:-1px;text-align:center;font-size:20px} #noticeBox .border_list .tab.list li ul{width:100%;position:absolute;top:53px;left:0;list-style:none;border:0;margin:0;padding:0;border-top:1px solid #2f3943;border-bottom:1px solid #e7eaed;z-index:1} #noticeBox .border_list .tab.list li ul:after{content:"";display:block;clear:both} #noticeBox .border_list .tab.list li li{float:none;position:relative;border-top:1px solid #e7eaed;height:56px;line-height:55px} #noticeBox .border_list .tab.list li li:first-child {border-top:0} #noticeBox .border_list .tab.list li li a{float:none;padding:0;margin:0;border:0 !important;font-weight:normal;text-align:left;line-height:56px;font-size:1rem;display: block;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;width: 75%;overflow: hidden;} #noticeBox .border_list .tab.list li li time, #noticeBox .border_list .tab.list li li .time{position:absolute;top:0;right:15px;color:#bcc0c4;font-size:14px} #noticeBox .border_list .tab.list li li.more{position:absolute;top:-57px;right:0;border:0 !important;background:transparent} #noticeBox .border_list .tab.list li li.more a {width:100%;position:relative;top:8px} #noticeBox .border_list .tab.list li.active > a{color:#00529b} #noticeBox .border_list .tab.list li.active > a span {display:block;position:relative} #noticeBox .border_list .tab.list li.active > a span:before {content:"";display:block;position:absolute;bottom:0;left:0;width:100%;height:3px;background:url(/renew/images/main/border_active.jpg) top center repeat-y;background-size:100%} #noticeBox .border_list .tab.list.jx{height:auto} #noticeBox .border_list .tab.list.jx ul{border:0} #noticeBox .border_list .tab.list.jx li{float:none;position:relative} #noticeBox .border_list .tab.list.jx li a{float:none;display:block;font-weight:bold;color:#333;border:1px solid #eee !important;border-bottom-color:#ccc !important;background:#fafafa !important} #noticeBox .border_list .tab.list.jx li ul{position:static;display:block;left:0;top:0;padding:5px 0} #noticeBox .border_list .tab.list.jx li li a{display:inline;border:0 !important;background:none !important;font-weight:normal} #noticeBox .border_list .tab.list.jx li li.more{top:7px;right:15px} /* galleryBox */ #galleryBox {background:url(../images/main/gallery_bg.jpg) repeat;padding:100px 0;overflow:hidden} #galleryBox > p {text-align:center;width:100%;max-width:1200px;margin:0 auto;position:relative;font-size:30px;line-height:30px;margin-bottom:40px;font-weight:bold} #galleryBox > p a.btn_more {width:24px;height:24px;text-indent:-9999px;background:url(../images/main/btn_more.png) center center no-repeat;display:block;position:absolute;top:0;right:0} #galleryBox .productSlider {width:100%;max-width:1200px;padding:0px 52px;margin:0 auto;font-size:0;position:relative;box-sizing:border-box} #galleryBox .productSlider .slide-inner {width:100%;max-width:1200px;margin:0 auto;font-size:0;position:relative;overflow:hidden;box-sizing:border-box;} #galleryBox .productSlider ul li {float:left;width:25%;overflow:hidden;padding:0px 12.5px;box-sizing:border-box} #galleryBox .productSlider ul li:first-child {margin-left:0} #galleryBox .productSlider ul li a {font-size:18px;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;width:100%;overflow:hidden;} #galleryBox .productSlider ul li a div {width:100%;max-width:247px;margin:0 auto 10px;overflow:hidden;border:1px solid #bcc0c4;box-sizing:border-box} #galleryBox .productSlider ul li a div img {display:block;font-size:0; width:100%;height:173px; transform:scale(1) rotate(.001deg); -webkit-transform:scale(1) rotate(.001deg); -ms-transform:scale(1) rotate(.001deg); transition:all .7s; -webkit-transition:all .7s; -ms-transition:all .7s; z-index: 1 } #galleryBox .productSlider ul li a div:hover img { transform:scale(1.1) rotate(.001deg); -webkit-transform:scale(1.1) rotate(.001deg); -ms-transform:scale(1.1) rotate(.001deg); transition:all .7s; -webkit-transition:all .7s; -ms-transition:all .7s; } #galleryBox .productSlider ul li a p {text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;width:100%;overflow:hidden;} #galleryBox .productSlider ul li a span {color:#777;font-size:15px;} #galleryBox .productSlider .prev {width:25px;height:45px;background:url(../images/main/slider_left_arrow.png) top center no-repeat;background-size:25px;display:block;position:absolute;top:94px;left:0} #galleryBox .productSlider .next {width:25px;height:45px;background:url(../images/main/slider_right_arrow.png) top center no-repeat;background-size:25px;display:block;position:absolute;top:94px;right:0px} #galleryBox .productSlider .controller {display:none} /* lionsInfo */ #lionsInfo {width:100%;max-width:1200px;margin:85px auto 130px;overflow:hidden} #lionsInfo .calendar {width:100%;max-width:440px;float:left;margin-right:30px} #lionsInfo .calendar p {font-weight:bold;font-size:30px;margin-bottom:35px} #lionsInfo .calendar ul {text-align:center;margin-bottom:25px} #lionsInfo .calendar ul li {display:inline-block;line-height:19px;font-size:27px} #lionsInfo .calendar ul li.btn_left {float:left} #lionsInfo .calendar ul li.btn_right {float:right} #lionsInfo .calendar ul li.btn_left a {display:block;width:10px;height:19px;background:url(../images/main/calendar_arrow_left.jpg) center no-repeat} #lionsInfo .calendar ul li.btn_right a {display:block;width:10px;height:19px;background:url(../images/main/calendar_arrow_right.jpg) center no-repeat} #lionsInfo .calendar table {width:100%;border-top:1px solid #d7dada} #lionsInfo .calendar table thead tr th {text-align:center;width:14.285%;font-size:15px;padding:15px 0;box-sizing:border-box;height:58px} #lionsInfo .calendar table tbody tr td {text-align:left;width:14.285%;font-size:12px;padding:0px 5px;box-sizing:border-box;height:58px;vertical-align:top} #lionsInfo .calendar table thead tr th {border-bottom:2px solid #00529b} #lionsInfo .calendar table tbody tr td {border-bottom:1px solid #d7dada;border-left:1px solid #d7dada;position:relative} #lionsInfo .calendar table tbody tr td a {background:#49a5f5;display:block;height:100%;width:100%;min-height:58px;position:absolute;top:0;left:0;padding:0px 8px;box-sizing:border-box;} #lionsInfo .calendar table tbody tr td div.eventBox {position:absolute;bottom:0;left:0;width:100%;z-index:2} #lionsInfo .calendar table tbody tr td div.eventBox span {display:block;width:90%;margin:2px auto;font-size:10px;text-align:Center;line-height:11px;padding:3px 0} #lionsInfo .calendar table tbody tr td div.eventBox span.event1 {background:#ffcf06} #lionsInfo .calendar table tbody tr td div.eventBox span.event2 {background:#72d2ff} #lionsInfo .calendar table tbody tr td.sat a {background:#49a5f5;display:block;height:100%;width:100%;position:absolute;top:0;left:0;color:#104ac2;box-sizing:border-box;} #lionsInfo .calendar table tbody tr td.sun a {background:#49a5f5;display:block;height:100%;width:100%;position:absolute;top:0;left:0;color:#ff0028;box-sizing:border-box;} #lionsInfo .calendar table .sat {color:#104ac2} #lionsInfo .calendar table .sun {border-left:0;color:#ff0028} #lionsInfo .calendar table .today {font-weight:bold;color:#25cde6;position:Relative} #lionsInfo .calendar table .today a {color:#fff;z-index:1} #lionsInfo .calendar table .today a:after {content:"";background:#00529b;color:#fff;width:20px;height:20px;border-radius:50%;display:block;position:absolute;top:5px;left:5px;z-index:-1} #lionsInfo .LION {display:block;float:left;margin-right:30px;width:350px} #lionsInfo .infoBox {background:#e7eaed;width:350px;height:464px;float:left;text-align:center;box-sizing:border-box;padding:0 33px;} #lionsInfo .infoBox p {font-weight:bold;font-size:30px;padding-top:51px} #lionsInfo .infoBox dl {margin:34px 0} #lionsInfo .infoBox dl.first {border-bottom:1px solid #ccc;padding-bottom:34px} #lionsInfo .infoBox dl dt {color:#fff;background:#00529b;width:210px;margin:0 auto 20px;line-height:40px;font-size:18px} #lionsInfo .infoBox dl dd b {display:block;font-size:24px;margin-bottom:10px} #lionsInfo .infoBox dl dd span {font-weight:bold;margin-right:15px} /* top btn */ #topBtn {position: fixed;right:2%;bottom:2%;display:none;z-index:999;width:60px;height:60px} #topBtn a {display:block;width:60px;height:60px;text-indent:-9999px;background:url(../images/inc/btn_top.jpg) top center no-repeat} /* footer */ footer {background:#0c0d0d;color:#bcc0c4;font-size:14px} footer a {color:#bcc0c4;} footer .ftTop {width:100%;max-width:1200px;margin:0 auto;overflow:hidden} footer .ftTop nav {float:left;position:relative;top:12px} footer .ftTop nav a {margin-right:15px;color:#fff} footer .ftTop dl {float:right;font-size:16px;color:#fff} footer .ftTop dl dt {float:left;background:#06325a;padding:13px 24px} footer .ftTop dl dd {float:right;padding-left:15px;position:relative;top:12px} footer .ftBot {border-top:1px solid #444} footer .ftBot div {width:100%;max-width:1200px;position:Relative;margin:0 auto;padding:30px 0;background:url(../images/inc/ft_logo.jpg) left center no-repeat;box-sizing:border-box;padding-left:135px} footer .ftBot div mark {margin-right:15px;background:none;color:#bcc0c4} footer .ftBot div ul li {display:inline-block;margin-right:30px} /*footer .ftBot div ul li:first-child {width:100%}*/ footer .ftBot div ul li:last-child span {width:55px} footer .ftBot div span {font-weight:bold;width:35px;display:inline-block} footer .ftBot div p {color:#bcc0c4;font-size:14px} footer .ftBot div select {position:absolute;right:0;top:53px;width:265px;height:42px;box-sizing:border-box;border:1px solid #383939;font-family:"Nanum Gothic";font-size:14px;padding-left:10px; background: url(../images/inc/ft_select_arrow.jpg) no-repeat 100% 50% #fff; background-size:42px; -webkit-appearance: none; -moz-appearance: none; appearance: none; } footer .ftBot div select::-ms-expand {display: none} /* mobile menu */ #m_menu {text-align:center} .side_menu {background:#fff;height:100vh;right: -100%;position:fixed;top:0;margin-top:68px;width:100%;box-sizing:border-box;z-index:1000;border-top:1px solid #e2e2e2} .side_menu .container {position:relative;top:0;left:0;height:100%;overflow-y:auto;} .side_menu .container .list_load {position:relative;top:0;left:0;width:100%;height:100%;text-align:center} .side_menu .top_navi {overflow:hidden;font-size:0;width:100%;margin:25px auto} .side_menu .top_navi a {display:inline-block;font-size:13px;color:#fff;background:#2f3943;width:32%;margin-left:2%;text-align:center;padding:6px 0px 4px} .side_menu .top_navi a:first-child {margin-left:0} .burger_box {display: block;position:fixed;top:24px;right:3%} .burger_box .menu-icon {display: inline-block;float: none;height: 35px;opacity: .5;width:30px;z-index: 100} .burger_box .menu-icon.opened {} .burger_box .menu-icon_box {background:#fff;display: inline-block;height: 35px;position: relative;text-align: left;width:30px;top:0px;right:0px;cursor:pointer} .burger_box .menu-icon_line {background:#000;display: inline-block;height:1px;position: absolute;width: 100%} .burger_box .menu-icon_line--1 {top: 2px} .burger_box .menu-icon_line--2 {top: 12px} .burger_box .menu-icon_line--3 {top: 22px} .burger_box .menu-icon_line--1 { transition: top 200ms 250ms, transform 200ms; -webkit-transition: top 200ms 250ms, -webkit-transform 200ms; } .burger_box .menu-icon_line--2 { transition: opacity 0ms 300ms; -webkit-transition: opacity 0ms 300ms; } .burger_box .menu-icon_line--3 { transition: top 100ms 300ms, transform 200ms; -webkit-transition: top 100ms 300ms, -webkit-transform 200ms; } .burger_box .menu-icon.opened .menu-icon_box { transform: scale3d(0.9, 0.9, 0.9); -webkit-transform: scale3d(0.9, 0.9, 0.9); } .burger_box .menu-icon.opened .menu-icon_line {top: 10px} .burger_box .menu-icon.opened .menu-icon_line--1 { transform: rotate3d(0, 0, 1, 45deg); -webkit-transform: rotate3d(0, 0, 1, 45deg); transition: top 100ms, transform 200ms 250ms; -webkit-transition: top 100ms, -webkit-transform 200ms 250ms; } .burger_box .menu-icon.opened .menu-icon_line--2 { opacity: 0; transition: opacity 200ms; -webkit-transition: opacity 200ms; } .burger_box .menu-icon.opened .menu-icon_line--3 { transform: rotate3d(0, 0, 1, -45deg); -webkit-transform: rotate3d(0, 0, 1, -45deg); transition: top 200ms, transform 200ms 250ms; -webkit-transition: top 200ms, -webkit-transform 200ms 250ms; } .list_load {border-top:1px solid #2f3943} .list_item {opacity:0; -webkit-transition: all 800ms ease-in-out; transition: all 800ms ease-in-out;line-height:32px} .list_item ul {display:none} .list_item > a {font-size:18px;font-weight:400;background:url(../images/inc/m_menu_close.gif) 96% center no-repeat;background-size:20px;border-bottom:1px solid #2f3943} .list_item a {color: #000;display: block;padding:16px 0;text-decoration: none;text-align:center;font-size:16px;line-height:16px} .list_item ul {border-top:5px solid #00529b;border-bottom:1px solid #2f3943} .list_item ul li {border-top:1px solid #e0e0e0} .list_item ul li:first-child {border-top:0} .list_item > a.active {background:url(../images/inc/m_menu_open.gif) 96% center no-repeat; background-size:20px;color:#00529b} /* ///// mediaQuery ///// */ @media screen and (min-width: 280px) and (max-width: 1200px) { /* header */ header {width:100%;height:Auto;position:fixed;top:0;left:0;z-index:1000} header .topNavi {display:none} header h1 {margin:23px 0 17px 3%;text-align:left} header h1 a img {width:195px} header #gnb {display:none} #visualBox .jd-slider {margin-top:69px;padding:3% 0} #visualBox .jd-slider .slide-inner {width:90%} #visualBox .jd-slider .btn_arrow {display:none} #visualBox .jd-slider .controller {margin-top:10px} #visualBox .jd-slider .controller .indicate-area a, #visualBox .jd-slider .controller .indicate-area a:after {width:30px;height:3px} #m_menu {display:block} /* /// (주)삼오사 씨지구 장학회 /// */ /* 재단소개 */ #foundationMenu > a {color:#fff;background:url(/renew/images/main/border_active.jpg) top center repeat-y;background-size:100%;position:relative} #foundationMenu > a:before {content:"";display:block;width:20px;height:19px;background:url(/renew/images/inc/m_menu_close.png) right center no-repeat;background-size:20px;position:absolute; top:15px;right:4%} #foundationMenu ul {border-top:0} #foundationMenu ul.menu3_list {border:0;background:red;padding:10px 0;border-top:1px solid #e0e0e0} #foundationMenu ul.menu3_list li {border:0;} #foundationMenu ul.menu3_list li a {font-size:30px;padding:5px} #foundationMenu ul li a.menu3 {background:url(/renew/images/inc/icon_plus.png) 95% center no-repeat;background-size:13px} #foundationMenu ul li a.open {background:url(/renew/images/inc/icon_minus.png) 95% center no-repeat;background-size:13px} #foundationMenu > a.active:before {background:url(/renew/images/inc/m_menu_open.png) right center no-repeat;background-size:20px;} #con_founder dl.chairman_title dt {margin-bottom:25px} #con_founder img {margin:0 auto 30px} .foundation_history li {width:100%;height:auto;padding:26px 0} .foundation_people li {width:100%;} .foundation_people li:nth-child(2n), .chairman_list li:nth-child(2n) {margin-left:0} .foundation_people li dl dt {margin-bottom:10px} .chairman_list li {width:100%} .foundation_business dl dt {font-size:18px;margin-bottom:5px} .foundation_business .infoBox li {width:100%;margin-bottom:1%} .foundation_business .infoBox li:first-child {margin-right:0;} /* banner */ #banner {padding:15px 0 20px} #banner dl {width:100%} #banner dl dt {float:none} #banner dl dt img {width:60%;max-width:520px;display:block;margin:0 auto} #banner dl dd {margin-top:10px} #banner dl dd a {float:none;margin:0 auto;width:60%;max-width:380px;font-size:15px;height:50px;line-height:43px;border-width:3px} /* noticeBox */ #noticeBox {box-sizing:border-box;padding:0 3%;margin:45px auto} #noticeBox .board {width:100%} #noticeBox .board:first-child {margin-bottom:45px} #noticeBox .board .menu a {font-size:16px;line-height:48px;width:145px;height:50px} #noticeBox .board .menu a.active:before {width:145px} #noticeBox .board ul li {padding:12px 0} #noticeBox .board ul li a {width:70%;text-overflow: ellipsis; white-space: nowrap; overflow: hidden;display:block} #noticeBox .board ul li span {top:12px} #noticeBox .board .btn_more {width:18px;height:18px;background-size:18px;top:15px;} /* 2020-08-03 수정 */ #noticeBox .border_list {width:100%} #noticeBox .border_list:first-child {margin-bottom:45px} #noticeBox .border_list .tab.list li > a {font-size:16px;line-height:48px;width:145px;height:50px} #noticeBox .border_list .tab.list li ul {top:49px} #noticeBox .border_list .tab.list li li a {width:70%;text-overflow: ellipsis; white-space: nowrap; overflow: hidden;display:block;font-size:15px} #noticeBox .border_list .tab.list li li.more a {width: 18px;height: 18px;background-size: 18px;top:12px;} #noticeBox .border_list .tab.list li li.more a img {display:block;width:100%} /* galleryBox */ #galleryBox {padding:30px 3% 20px} #galleryBox > p {font-size:21px;line-height:21px;margin-bottom:30px} #galleryBox div a div {height:auto} #galleryBox div a dl dt {font-size:16px} #galleryBox div img {width:100%} #galleryBox p a.btn_more {width:18px;height:18px;background-size:18px;top:2px} #galleryBox .productSlider {padding:0} #galleryBox .productSlider .prev,#galleryBox .productSlider .next {display:none} /* lionsInfo */ #lionsInfo .calendar p {font-size:21px;line-height:21px} #lionsInfo .calendar table tbody tr td a {min-height:54px} #lionsInfo .calendar table .today a:after {top:3px} /* footer */ footer .ftTop nav {margin-bottom:20px;box-sizing:border-box;padding:0 3%} footer .ftTop nav a {margin-right:5px} footer .ftTop dl {float:none;background:#06325a;text-align:center;width:100%;clear:both} footer .ftTop dl dt {float:none;display:inline-block;padding:13px 0} footer .ftTop dl dd {float:none;display:inline-block;top:0;padding-left:0;margin-left:5px} footer .ftBot {border-top:0} footer .ftBot div {background:none;padding:15px 3%} footer .ftBot div select {position:relative;top:0;border-radius:0;width:100%;margin-top:20px} #topBtn a {display:none} } @media screen and (min-width: 780px) and (max-width: 1200px) { /* lionsInfo */ #lionsInfo {margin:45px auto;padding:0px 3%;box-sizing:border-box;position:relative} #lionsInfo .calendar {width:100%;padding-right:380px;max-width:100%;margin-right:0;box-sizing:border-box;margin-bottom:35px} #lionsInfo .calendar p {font-size:21px;line-height:21px} #lionsInfo .LION {margin-right:0;position:absolute;top:0;right:3%} #lionsInfo .infoBox {float:none;overflow:hidden;width:100%;overflow:hidden;height:auto} #lionsInfo .infoBox p {padding-top:30px;font-size:20px} #lionsInfo .infoBox dl {width:50%;float:left;box-sizing:border-box} #lionsInfo .infoBox dl dt {font-size:16px;margin-bottom:10px} #lionsInfo .infoBox dl dd b {font-size:21px;margin-bottom:5px} #lionsInfo .infoBox dl.first {border:0;padding-bottom:0;border-right:1px solid #ccc} } @media screen and (min-width: 280px) and (max-width:779px) { /* lionsInfo */ #lionsInfo {margin:45px auto;padding:0px 3%;box-sizing:border-box;position:relative} #lionsInfo .calendar {width:100%;max-width:100%;margin-right:0;box-sizing:border-box;margin-bottom:35px;float:none} #lionsInfo .calendar p {font-size:21px;line-height:21px} #lionsInfo .LION {margin-right:0;width:100%;margin-bottom:35px} #lionsInfo .LION a img {display:block;width:100%} #lionsInfo .infoBox {overflow:hidden;width:100%;overflow:hidden;height:auto;padding:0 15px} #lionsInfo .infoBox p {padding-top:15px;font-size:16px} #lionsInfo .infoBox dl.first {margin:16px 0 28px} #lionsInfo .infoBox dl dt {margin-bottom:10px} #lionsInfo .infoBox dl dd b {font-size:18px;margin-bottom:5px} #galleryBox .productSlider ul li a div { min-height:100px; background-color:#bcc0c4; } #galleryBox .productSlider ul li a div img { height:auto; display:block; vertical-align:middle; } }