/*-------------------------mtabgallery/TMPL07/style.css------------------------------------*/ /* S:PHOTO GALLERY */ .mgallery-sec .mtit {color:#fff;font-size:36px;padding:70px 0 60px 0;line-height:1;text-transform:uppercase;text-align:center} .mgallery-wr .owl-item {padding:82px 0} .mgallery-wr .owl-item.center {transform:scale(1.62);-ms-transform:scale(1.62);z-index:500;position:relative} .mgallery-wr .owl-item .item {position:relative;height:260px;overflow:hidden} .mgallery-wr .owl-item .item:after {display:block;content:"";width:92%;height:20%;background:#000;box-shadow:0 7px 15px 0 #000;opacity:0.5;position:absolute;bottom:0;left:50%;margin-left:-46%;z-index:-1} .mgallery-wr .owl-item .item:before {content:"";display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);z-index:10} .mgallery-wr .owl-item.center .item:before {opacity:0} .mgallery-wr .owl-item .item a {display:block;height:100%} .mgallery-wr .owl-item.center .item:hover .txt, .mgallery-wr .owl-item.center .item a:focus .txt {opacity:1} .mgallery-wr .owl-item .item .txt {position:absolute;bottom:0;opacity:0;width:100%;height:100%;box-sizing:border-box;padding:15% 70px;transition:all .3s ease;z-index:10} .mgallery-wr .owl-item .item .txt:before {position:absolute;top:0;left:0;content:"";display:block;width:100%;height:100%;background:rgba(0,0,0,0.7);z-index:10} .mgallery-wr .owl-item .item .txt:after {position:absolute;bottom:0;left:0;content:"";display:block;width:100%;height:50%;background:linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.5));z-index:20} .mgallery-wr .owl-item .item .txt .subject {color:#fff;font-size:25px;position:relative;z-index:30;line-height:1.1;display:block;max-height:106px;padding-top:20%;overflow:hidden} .mgallery-wr .owl-item .item .txt .date {position:relative;display:block;color:#fff;font-size:13px;z-index:30;margin-top:15px} .mgallery-wr .item img {position:relative;width:100%;height:100%;z-index:1} .mgallery-wr .owl-nav {position:absolute;right:0;top:-54px} .mgallery-wr .owl-nav:after {content:'';position:absolute;left:43px;top:2px;width:1px;height:22px;background:#fff} .mgallery-wr .owl-nav button {position:relative;width:23px;height:23px;text-indent:-9999px;margin:0 10px} .mgallery-wr .owl-nav button:before, .mgallery-wr .owl-nav button:after {content:'';position:absolute;left:50%;top:50%;width:12px;height:2px;margin:0 0 0 -6px;background:#ccc} .mgallery-wr .owl-nav .owl-prev:before {transform:rotate(135deg);margin-top:-4px} .mgallery-wr .owl-nav .owl-prev:after {transform:rotate(-135deg);margin-top:4px} .mgallery-wr .owl-nav .owl-next:before {transform:rotate(45deg);margin-top:-4px} .mgallery-wr .owl-nav .owl-next:after {transform:rotate(-45deg);margin-top:4px} .mgallery-wr .owl-nav button:hover:before, .mgallery-wr .owl-nav button:hover:after {background:#fff} @media all and (max-width:999px) { .mgallery-sec .mtit {font-size:30px;padding:40px 0} } @media all and (max-width:768px) { .mgallery-sec .mtit {font-size:26px} } @media all and (max-width:599px) { .mgallery-sec .mtit {font-size:22px} .mgallery-wr .owl-item.center {transform:none} .mgallery-wr .owl-item {padding:0} .mgallery-wr .owl-nav {top:-62px} } /* E:PHOTO GALLERY */ /*-------------------------micban/TMPL07/style.css------------------------------------*/ /* QUICK MENU ------------------------------------------------------ */ .mQuick-wr {max-width:1600px;margin:0 auto;padding:0 0 90px} .mQuick-wr .hasNoData {display:block;box-sizing:border-box;border:1px solid #ddd;border-radius:5px} .mQuick-wr .hasNoData .no-data {height:90px;text-align:center;padding-top:164px;font-size:14px;color:#555;background:url(/resources/_Img/Board/default/ico_nodata.png) no-repeat center 70px;} #mQuick {display:block;box-sizing:border-box;position:relative;background:#e6eaf8;padding:0 0 0 218px} #mQuick .mQuickTit {display:block;position:absolute;width:191px;height:100%;left:0;bottom:0;box-sizing:border-box;padding:28px 0 0} #mQuick .mQuickTit:after {content:"";display:block;position:absolute;width:34px;height:2px;background:#fff;left:31px;top:97px} #mQuick .mQuickTit .in {display:block;width:100%;height:100%;box-sizing:border-box;position:relative;background:#3f56a6;color:#fff;font-family:ropa-sans-pro, sans-serif;font-size:20px;letter-spacing:-.005em;padding:27px 0 45px 29px} #mQuick .mQuickTit .in span {font-size:30px} #mQuick .mQuickTit .in:after {content:"";display:block;position:absolute;width:26px;height:26px;right:0;top:0;background:url(/resources/_Templet/Main/main_dep2/img/main_spr.png) no-repeat -67px 0px} #mQuick .datalist {display:block;font-size:0;text-align:center} #mQuick .datalist .item {display:block;box-sizing:border-box;padding:20px 15px 20px 0} #mQuick .datalist .item a {display:block;box-sizing:border-box;position:relative;padding:20px 40px 20px 73px} #mQuick .datalist .item a:before, #mQuick .datalist .item a:after {content:"";display:block;position:absolute;transition:all .3s ease} #mQuick .datalist .item a:before {width:28px;height:7px;background:url(/resources/_Templet/Main/main_dep2/img/main_spr.png) no-repeat -103px 0px;top:42px;right:10px;z-index:1} #mQuick .datalist .item a:after {width:28px;height:28px;border-radius:50%;background:#fff;box-shadow:0 0 0 rgba(0, 0, 0, 0);right:0;top:31px;z-index:0} #mQuick .datalist .item a:focus:after, #mQuick .datalist .item a:hover:after {background:#77c231;box-shadow:0 8px 10px rgba(0, 0, 0, .2)} #mQuick .datalist .item a .icon {display:block;position:absolute;width:75px;height:75px;left:0;top:50%;transform:translateY(-50%);background:url(/resources/_Templet/Main/main_dep2/img/main_spr.png) no-repeat} #mQuick .datalist .item a .icon.icon-icon1 {background-position:0px -49px} #mQuick .datalist .item a .icon.icon-icon2 {background-position:-85px -49px} #mQuick .datalist .item a .icon.icon-icon3 {background-position:-170px -49px} #mQuick .datalist .item a .icon.icon-icon4 {background-position:-255px -49px} #mQuick .datalist .item a .icon.icon-icon5 {background-position:-340px -49px} #mQuick .datalist .item a .icon.icon-icon6 {background-position:0 -131px} #mQuick .datalist .item a .icon.icon-icon7 {background-position:-85px -131px} #mQuick .datalist .item a .icon.icon-icon8 {background-position:-170px -131px} #mQuick .datalist .item a .icon.icon-icon9 {background-position:-255px -131px} #mQuick .datalist .item a .icon.icon-icon10 {background-position:-340px -131px} #mQuick .datalist .item a .txt {display:block;text-align:left;font-size:0} #mQuick .datalist .item a .txt:before {content:"";display:inline-block;width:0;height:50px;vertical-align:middle} #mQuick .datalist .item a .txt span {display:inline-block;vertical-align:middle;font-size:18px;line-height:20px;letter-spacing:-.05em;max-width:100%;word-wrap:break-word;word-break:keep-all;white-space:normal;color:#000} @media all and (max-width:1600px) { .mQuick-wr {margin:0 20px} #mQuick {padding:0 0 0 200px} } @media all and (max-width:1400px) { #mQuick {padding:0 0 0 150px} #mQuick .mQuickTit {width:150px} #mQuick .mQuickTit .in {padding:20px 0 40px 15px} #mQuick .mQuickTit:after {left:20px;top:90px} } @media all and (max-width:1200px) { .mQuick-wr {padding:0 0 20px} } @media all and (max-width:899px) { #mQuick {padding:10px 0;text-align:center} #mQuick .mQuickTit {display:inline-block;position:relative;width:auto;height:auto;left:auto;bottom:auto;padding:0 0 10px} #mQuick .mQuickTit .in {padding:15px 40px 20px} #mQuick .mQuickTit .in span {font-size:20px} #mQuick .mQuickTit .in:after {width:18px;height:18px;background-size:350px auto;background-position:-47px 0px;right:-1px} #mQuick .mQuickTit:after {top:42px;left:40px} #mQuick .datalist .item {padding:0 10px} #mQuick .datalist .item a {padding:0 40px 0 50px} #mQuick .datalist .item a .txt span {font-size:16px} #mQuick .datalist .item a:before {top:50%;transform:translateY(-50%);right:5px} #mQuick .datalist .item a:after {width:20px;height:20px;top:50%;transform:translateY(-50%)} #mQuick .datalist .item a .icon {width:52px;height:52px;background-size:350px auto} #mQuick .datalist .item a .icon.icon-icon1 {background-position:0px -34px} #mQuick .datalist .item a .icon.icon-icon2 {background-position:-59px -34px} #mQuick .datalist .item a .icon.icon-icon3 {background-position:-119px -34px} #mQuick .datalist .item a .icon.icon-icon4 {background-position:-178px -34px} #mQuick .datalist .item a .icon.icon-icon5 {background-position:-238px -34px} #mQuick .datalist .item a .icon.icon-icon6 {background-position:0 -92px} #mQuick .datalist .item a .icon.icon-icon7 {background-position:-59px -92px} #mQuick .datalist .item a .icon.icon-icon8 {background-position:-119px -92px} #mQuick .datalist .item a .icon.icon-icon9 {background-position:-178px -92px} #mQuick .datalist .item a .icon.icon-icon10 {background-position:-238px -92px} } @media all and (max-width:599px) { #mQuick .mQuickTit:after {display:none} #mQuick .mQuickTit .in {padding:10px 30px} #mQuick .datalist .item {padding:0 10px} #mQuick .datalist .item a {padding:0 35px 0 35px} #mQuick .datalist .item a .txt span {font-size:15px;letter-spacing:-.05em} #mQuick .datalist .item a .icon {width:36px;height:36px;background-size:245px auto} #mQuick .datalist .item a .icon.icon-icon1 {background-position:0px -24px} #mQuick .datalist .item a .icon.icon-icon2 {background-position:-41px -24px} #mQuick .datalist .item a .icon.icon-icon3 {background-position:-83px -24px} #mQuick .datalist .item a .icon.icon-icon4 {background-position:-125px -24px} #mQuick .datalist .item a .icon.icon-icon5 {background-position:-167px -24px} #mQuick .datalist .item a .icon.icon-icon6 {background-position:0 -65px} #mQuick .datalist .item a .icon.icon-icon7 {background-position:-41px -65px} #mQuick .datalist .item a .icon.icon-icon8 {background-position:-83px -65px} #mQuick .datalist .item a .icon.icon-icon9 {background-position:-125px -65px} #mQuick .datalist .item a .icon.icon-icon10 {background-position:-167px -65px} } @media all and (max-width:399px) { #mQuick .datalist .item a {padding:0 0 0 35px} #mQuick .datalist .item a:before, #mQuick .datalist .item a:after {display:none} } /* -------------------------------------QUICK MENU------------------------------------ */ /*-------------------------mtabboard/TMPL07/style.css------------------------------------*/ /* 알림마당 ------------------------------------------------------ */ .mBbs-wr {background:url(/resources/_Templet/Main/main_dep2/img/mBbs_bg1.jpg) no-repeat center top;padding:66px 0 91px;background-size:cover} .mBbs-wr .inwr {width:auto;max-width:1600px;margin:0 auto} .mBbs-wr .mBbsTit {display:block;text-align:center;line-height:1;color:#fff;font-size:42px;letter-spacing:-.05em;font-weight:500} .mBbs-wr .hasNoData {display:block} .mBbs-wr .hasNoData .no-data {height:90px;text-align:center;padding-top:164px;font-size:14px;color:#fff;background:url(/resources/_Img/Board/default/ico_nodata.png) no-repeat center 70px;} #mboardTab {display:block;box-sizing:border-box;position:relative;padding:63px 0 0;margin:37px 0 0} #mboardTab dl {display:block;box-sizing:border-box;position:static} #mboardTab dl dt {display:block;position:absolute;top:0} #mboardTab dl dt a {display:block;position:relative;color:#fff;opacity:.85;font-size:20px;padding:0 27px;transition:all .3s ease} #mboardTab dl dt a:focus, #mboardTab dl dt a:hover {opacity:1} #mboardTab dl dd {display:none;text-align:center} #mboardTab dl dd ul {display:block;text-align:left;overflow:hidden} #mboardTab dl dd ul li {display:block;float:left;width:24.375%;margin:0 .833% 0 0} #mboardTab dl dd ul li:last-child {margin:0} #mboardTab dl dd ul li a {display:block;box-sizing:border-box;position:relative;background:#fff;padding:34px 32px 32px} #mboardTab dl dd ul li a:before {content:"";display:block;position:absolute;width:100%;height:100%;box-sizing:border-box;border:0 solid #63ab21;left:0;top:0;transition:all .3s ease} #mboardTab dl dd ul li a .pTit {position:relative;font-size:20px;font-weight:500;color:#333;line-height:20px;letter-spacing:-.025em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;white-space:normal;height:40px;word-wrap:break-word;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding:0 40px 0 0} #mboardTab dl dd ul li a .pTit .mark {display:block;position:absolute;width:30px;height:30px;right:0;top:2px;background:#63ab21;border-radius:50%} #mboardTab dl dd ul li a .pTit .mark:before, #mboardTab dl dd ul li a .pTit .mark:after {content:"";display:block;position:absolute;width:12px;height:2px;background:#fff;top:0;right:0;bottom:0;left:0;margin:auto;transition:all .3s ease} #mboardTab dl dd ul li a .pTit .mark:before {} #mboardTab dl dd ul li a .pTit .mark:after {transform:rotate(90deg)} #mboardTab dl dd ul li a .pTxt {font-size:16px;line-height:24px;letter-spacing:-.05em;color:#666;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;white-space:normal;height:48px;word-wrap:break-word;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;padding:23px 0 0;margin:26px 0 0;border-top:1px solid #ccc} #mboardTab dl dd ul li a .pDate {display:block;position:relative;font-family:ropa-sans-pro, sans-serif;font-size:18px;color:#666;margin:34px 0 0;box-sizing:border-box;padding:0 0 0 30px} #mboardTab dl dd ul li a .pDate:before {content:"";display:block;position:absolute;width:20px;height:20px;background:url(/resources/_Templet/Main/main_dep2/img/main_spr.png) no-repeat -181px 0px;left:1px;top:0px} #mboardTab dl dd ul li a:focus:before, #mboardTab dl dd ul li a:hover:before {border-width:4px} #mboardTab dl dd ul li a:focus .pTit .mark:before, #mboardTab dl dd ul li a:hover .pTit .mark:before {transform:rotate(90deg)} #mboardTab dl dd ul li a:focus .pTit .mark:after, #mboardTab dl dd ul li a:hover .pTit .mark:after {transform:rotate(180deg)} #mboardTab dl dd ul li.no-data {width:100%;color:#fff} #mboardTab dl dd .btn-more {display:inline-block;box-sizing:border-box;position:relative;border-radius:999px;color:#fff;font-size:19px;font-weight:500;letter-spacing:-.025em;line-height:1;border:1px solid #fff;padding:13px 25px 14px 58px;margin:37px 0 0;transition:all .3s ease} #mboardTab dl dd .btn-more:before {content:"";display:block;position:absolute;width:17px;height:14px;background:url(/resources/_Templet/Main/main_dep2/img/main_spr.png) no-repeat -231px 0px;left:27px;top:16px} #mboardTab dl dd .btn-more:focus, #mboardTab dl dd .btn-more:hover {background:#fff;color:#000} #mboardTab dl dd .btn-more:focus:before, #mboardTab dl dd .btn-more:hover:before {background-position:-258px 0px} #mboardTab dl.isOn dt a {color:#86df34;opacity:1} #mboardTab dl.isOn dd {display:block} #mboardTab dl.vnum1 {} #mboardTab dl.vnum1 dt {right:50%} #mboardTab dl.vnum1 dt a:after {content:"";display:block;position:absolute;width:10px;height:12px;background:url(/resources/_Templet/Main/main_dep2/img/main_spr.png) no-repeat -211px 0px;right:-4px;top:5px} #mboardTab dl.vnum2 {} #mboardTab dl.vnum2 dt {left:50%} @media all and (max-width:1600px) { .mBbs-wr .inwr {margin:0 20px} } @media all and (max-width:1200px) { .mBbs-wr {padding:40px 0 40px} #mboardTab {padding:50px 0 0;margin:30px 0 0} } @media all and (max-width:1100px) { #mboardTab dl dd ul li a {padding:20px} #mboardTab dl dd ul li a .pTit {font-size:18px;line-height:1.3;letter-spacing:-.05em;height:46px;padding:0 30px 0 0} #mboardTab dl dd ul li a .pTit .mark {width:21px;height:21px} #mboardTab dl dd ul li a .pTit .mark:before, #mboardTab dl dd ul li a .pTit .mark:after {width:7px} } @media all and (max-width:999px) { .mBbs-wr .mBbsTit {font-size:30px} #mboardTab dl dd ul li a .pTxt {font-size:15px;line-height:1.4;height:41px;padding:15px 0 0;margin:15px 0 0} } @media all and (max-width:799px) { #mboardTab dl dd ul li {width:49%;margin:0 2% 10px 0} #mboardTab dl dd ul li:nth-child(2n) {margin:0} } @media all and (max-width:599px) { .mBbs-wr {padding:30px 0 30px} .mBbs-wr .mBbsTit {font-size:26px} #mboardTab {padding:40px 0 0;margin:20px 0 0} #mboardTab dl dd ul li a {padding:15px} #mboardTab dl dd .btn-more {margin:20px 0 0;font-size:17px} } @media all and (max-width:399px) { #mboardTab dl dt a {padding:0 15px} #mboardTab dl dd ul li {width:100%;margin:0 0 10px 0} #mboardTab dl dd ul li:nth-child(2n) {margin:0 0 10px} #mboardTab dl dd ul li a .pTxt {padding:10px 0 0;margin:10px 0 0} #mboardTab dl dd ul li a .pDate {margin:15px 0 0;} } /* ---------------------------------------알림마당--------------------------------------- */