@import url(./basic.css); /* --------------------------------------------------------------------------------------------------------------------------------------------------------------- 메인페이지 --------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #slideArea{ display: none;} #videoArea{ display: block;} @media (max-width: 1200px) { #slideArea{ display: block;} #videoArea{ display: none;} } #videoArea{position:relative;width:100%;background-color:#f3f3f3;} #videoArea video{width:100%;height:auto;margin:0 auto;z-index:-1;} #videoArea .swiper-content{position:absolute;top:50%;left:0;transform:translateY(-50%);width:100%;z-index:10;text-align:center;} #videoArea .swiper-content h2{font-size:78px;line-height:1.3;color:#fff;} #videoArea .swiper-content p{font-weight:300;font-size:50px;line-height:1.2;transition-delay:.25s;color:#fff;} @media (min-width: 2000px) { #videoArea video{display:block;width:2000px;height:auto;margin:0 auto;} } #slideArea .slideSwiper {width: 100%;height: 500px;} #slideArea .slideSwiper .swiper-slide {text-align: center;font-size: 18px;background: #fff;display: flex;width: 100%;justify-content: center;align-items: center;position:relative;} #slideArea .slideSwiper .swiper-content{position:absolute;top:50%;left:0;transform:translateY(-50%);width:100%;z-index:10;} #slideArea .slideSwiper .swiper-content h2{font-size:78px;line-height:1.3;color:#fff;} #slideArea .slideSwiper .swiper-content p{font-weight:300;font-size:50px;line-height:1.2;transition-delay:.25s;color:#fff;} #slideArea .slideSwiper .swiper-slide-active .swiper-slide-bg{-webkit-transform: scale(1.3);-ms-transform: scale(1.3);transform: scale(1.3);-webkit-transition-duration: 20s;-o-transition-duration: 20s;transition-duration: 20s;} #slideArea .slideSwiper .swiper-slide-bg {display:block;background-position: 50%;background-repeat: no-repeat;min-width: 100%;min-height: 100%;} #slideArea .slideSwiper .swiper-slide-bg.img01 {background-image: url(/image/Still001.jpg);background-size: cover;-webkit-background-size: cover;background-size: cover;} #slideArea .slideSwiper .swiper-slide-bg.img02 {background-image: url(/image/Still002.jpg);background-size: cover;-webkit-background-size: cover;background-size: cover;} #slideArea .slideSwiper .swiper-slide-bg.img03 {background-image: url(/image/Still003.jpg);background-size: cover;-webkit-background-size: cover;background-size: cover;} #slideArea .slideSwiper .swiper-slide-bg.img04 {background-image: url(/image/Still004.jpg);background-size: cover;-webkit-background-size: cover;background-size: cover;} #slideArea .slideSwiper .swiper-slide-bg {-webkit-transition-property: -webkit-transform;transition-property: -webkit-transform;-o-transition-property: transform;transition-property: transform;transition-property: transform,-webkit-transform;-webkit-transition-duration: 10s;-o-transition-duration: 10s;transition-duration: 10s;-webkit-transition-timing-function: linear;-o-transition-timing-function: linear;transition-timing-function: linear;} @media (max-width: 1200px) { #slideArea .slideSwiper .swiper-content h2{font-size:2.5rem;} #slideArea .slideSwiper .swiper-content p{font-size:1.8rem;} .swiper-button-prev{left:30px;padding: 10px 14px 10px 12px;} .swiper-button-next{right:30px;} } .mainBox{margin-top:80px;} .mainBox .inner{padding:30px;height:190px;position:relative;overflow:hidden;} .mainBox h2{color:#fff;font-size:1.5rem;margin-bottom:10px;font-weight: 500;} .mainBox p{color:#fff;font-size:1.2rem;font-weight:400;} .mainBox .more{color:#fff;padding:8px 10px 8px 0;z-index:10;} .mainBox .more a{color:#fff;} .mainBox.green .inner{background:#A4C563 url(/image/mainicon_04.png) no-repeat 95% 95%;background-size:120px;} .mainBox.purple .inner{background:#3378C2 url(/image/mainicon_02.png) no-repeat 95% 95%;background-size:120px;} .mainBox.gray .inner{background:#27A0D8 url(/image/mainicon_03.png) no-repeat 95% 95%;background-size:120px;} @media (max-width: 1240px) { .mainBox.green .inner:after{width:180px;height:132px;background-size:100%;} .mainBox.purple .inner:after{width:200px;height:138px;background-size:100%;} } @media (max-width: 991px) { .mainBox{margin-top:30px;} .mainBox .inner{padding:30px;height:220px;position:relative;overflow:hidden;} .mainBox p{font-size:.9rem;} .mainBox h2{font-size:1.2rem;} } @media (max-width: 760px) { .mainBox.green .inner:after{width:224px;height:164px;background-size:auto;} .mainBox.purple .inner:after{width:270px;height:186px;background-size:10auto0%;} .mainBox p{font-size:1.3rem;} .mainBox h2{font-size:2.1rem;} } /* 공지사항 */ .main-notice{background-color:#E9F0F7;padding:50px 0 80px;margin:80px 0 60px;} .main-notice h2{text-align:center;font-size:2rem;font-weight:700;padding-bottom:30px;color:#000;} .main-notice .noticeSwiper .swiper {width: 100%;height: 100%;} .main-notice .noticeSwiper .swiper-slide {text-align: left;font-size: 18px;height:350px;background: #fff;padding: 50px;} .main-notice .noticeSwiper .swiper-slide .entry-title {width:100%;height:75px;font-size: 24px;font-weight: 600;line-height: 36px;letter-spacing: -0.4px;overflow:hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical; word-wrap:break-word;} .main-notice .noticeSwiper .swiper-slide .entry-excerpt {width:100%;color: #666666;height:120px;font-size: 1.1rem;font-weight: 400;line-height: 1.3;margin-top: 13px;} .main-notice .noticeSwiper .swiper-slide .post-meta {width:100%;color: #999999;font-size: 16px;font-weight: 400;line-height: 24px;padding-top: 20.5px;border-top: 1px solid #DEDEDE;} /* 하단 게시물 */ .main-article{} .column02{} .column02 h3{color:#293848;font-size:1.3rem;font-weight:bold;line-height:22px;overflow:hidden;text-overflow: ellipsis; width:100%;white-space:nowrap;margin-bottom:10px;} .column02 figure{display:inline-block;width:220px;height:330px;vertical-align:top;margin:10px 10px 0 0;padding:15px 0 0 0;border:1px solid #ddd;text-align:center;} .column02 figure img{width:95%;height:auto;} .column02 .article{display:inline-block;width:calc(100% - 280px);margin:10px 0 0 20px;line-height:1.5;text-align:justify;vertical-align:top;} .column02 .article p{font-size:1rem;overflow:hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 5;-webkit-box-orient: vertical; word-wrap:break-word;} .noticeBox{padding:20px;} .noticeBox h2{position:relative;font-size:1.5rem;font-weight:500;padding-bottom:10px;color:#3378C2;} .noticeBox h2 .more{color:#fff;position:absolute;top:0;right:0;padding:3px 5px;z-index:10;font-size:1.2rem;} .noticeBox .bList{clear:both;margin-top:20px;} .noticeBox .bList li{position:relative;padding-left: 90px;font-size:1.1rem;border-bottom: 1px dashed #ddd;padding-bottom: 8px;margin-bottom: 9px;overflow: hidden;text-overflow: ellipsis;width: 100%;white-space: nowrap;font-weight:300;} .noticeBox .bList.nodate li{padding-left: 0;border-bottom: 1px solid #ddd;} .noticeBox .bList li .date{position:absolute;top:0;left:0;} .noticeBox .bList li.new:before{background-color: #e85353;content:'new';font-size:11px;} .main-treatise{background-color:#f9f9f9;padding:80px 0;margin:80px 0 0;} .main-treatise h2{position:relative;font-size:1.5rem;font-weight:500;padding-bottom:10px;color:#3378C2;} .main-treatise h2 small{color:#000;margin-top:10px;} .main-treatise h2 .more{position:absolute;top:0;right:0;font-size:1rem;padding: 4px 5px;} .main-treatise h2 .more i{font-size:.9rem;} .column01{display:flex;flex-flow: row wrap;justify-content: space-between;align-content: center;} .column01 li{width:45%;padding:15px 0;} .column01 li h3{margin-top:30px;color:#293848;font-size:17px;font-weight:bold;line-height:22px;margin-bottom:10px;overflow:hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical; word-wrap:break-word;} .column01 li p{line-height: 1.5;overflow:hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical; word-wrap:break-word;} .column01 li figure{display:block;width:100%;height:auto;margin:0;vertical-align:top;text-align:center;} .column01 li figure img{width:100%;height:auto;border:1px solid #ddd;max-width:100%;} .reportBox {padding:0 20px;} .reportBox.gap {margin-left:50px;} .reportBox .bList li{position:relative;padding-left: 30px;padding-bottom: 8px;margin-bottom: 9px;overflow: hidden;text-overflow: ellipsis;width: 100%;white-space: nowrap;font-weight:300;} .reportBox .bList li:after{position:absolute;top:5px;left:0;display:block;content:'';width:10px;height:10px;border-radius:100%;background-color:#000;} .reportBox .bList li .date{position:absolute;top:0;left:0;} .reportBox .bList li.new:before{background-color: #e85353;content:'new';font-size:11px;} @media (max-width: 1199px) { .main-treatise h2 .more{right:0;} } @media (max-width: 991px) { .reportBox.gap {margin-left:0;margin-top:50px;} .main-treatise h2, .noticeBox h2 {font-size: 1.8rem;} } @media (max-width: 760px) { .column02 figure{display:block;width:220px;margin:0 auto 30px;} .column02 .article{display:block;width:100%;margin:10px 0 0 0;} .column02 h3{font-size:1.4rem;} .column01 li p, .column02 .article p{font-size:1.1rem;} .noticeBox.mgtmo{margin-top:40px;} .noticeBox, .reportBox {padding:0;margin-bottom:30px;} .reportBox .bList{margin-top:20px;} .reportBox .bList li{font-size:1.2rem;padding-left: 20px;} .reportBox .bList li:after{position:absolute;top:2px;left:0;width:8px;height:8px;} .noticeBox .bList li{padding-left: 60px;font-size:1.2rem;} .noticeBox .bList li .date{font-size:1.1rem;} } /* --------------------------------------------------------------------------------------------------------------------------------------------------------------- sub 기본구조 745 + 35 + 220 =1000 --------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /*visual*/ #visualBox{width:100%; position:relative;overflow:hidden;height: 240px;} #visualBox .visualImg{ width:100%; height:100%;position:absolute; left:0; top:0; z-index:-1; animation-duration: 3s;animation-fill-mode: both;animation-iteration-count: 1;animation-timing-function: ease;-webkit-animation-duration: 3s;-webkit-animation-fill-mode: both;-webkit-animation-iteration-count: 1;-webkit-animation-timing-function: ease;animation-delay: 0.4s; -webkit-animation-delay: 0.4s;animation-name:visual-zoom; -webkit-animation-name:visual-zoom;} @keyframes visual-zoom { 0% {transform:scale(1.2);} 100% {transform:scale(1);} } @-webkit-keyframes visual-zoom { 0% {transform:scale(1.2);} 100% {transform:scale(1);} } @keyframes visual-tit { 0% {opacity:0; -webkit-opacity:0; transform:translateY(20px);} 100% {opacity:1; -webkit-opacity:1; transform:translateY(0px);} } @-webkit-keyframes visual-tit { 0% {opacity:0; -webkit-opacity:0; transform:translateY(20px);} 100% {opacity:1; -webkit-opacity:1; transform:translateY(0px);} } @media (max-width: 575px) { .Breadcrumbs { margin: -110px auto 0;padding:20px 15px;} #visualBox{height:170px;} } @media (max-width: 1199px) { .sub-visual{display:none;} } #visualBox {z-index:9;width:100%;height:auto;} #visualBox {.top:-30px;}/*ie7 핵*/ #visualBox img{box-shadow: 2px 0 2px 0 rgba(0, 0, 0, 0.2);} #visualBox .titleArea {margin:0 auto 25px; padding: 200px 0 50px;text-align: center;} #visualBox .titleArea h2 {color: #fff;line-height: 1.5;font-size: 40px;font-weight:600;} #visualBox .titleArea h2 span {color: #fff;line-height: 24px;font-size: 40px;font-weight:300;} #visualBox .subMenuArea {width:100%;border-bottom:1px solid #e1e1e1;height:60px;background-color:#fff;padding:0;} #visualBox .subMenuArea ul {margin:0 auto; padding:0 0;} #visualBox .subMenuArea ul li {color: #333333;font-size:15px;font-weight:bold;line-height:60px;display:inline-block;padding:0 20px;background: url(/image/main/bg_gnb_line.gif) 0 center no-repeat;} #visualBox .subMenuArea ul li.menuOn {border-bottom:2px solid #0168b7;line-height:59px;} #visualBox .subMenuArea ul li.menuOn a{color:#0168b7;} #visualBox .subMenuArea ul li:first-child {background:none;} #visualBox .subMenuArea ul li:last-child {border-right:none;} .subContentBox {padding:50px 1rem;} .subContentBox .titleArea {} .subContentBox .titleArea h3 {font-size: 2.5rem;font-weight: bold;margin-bottom: 50px;text-align: center;} .subContentBox .subcontentArea {} @media (max-width: 1199px) { #visualBox .titleArea {margin:0 auto 25px; padding: 80px 0 50px;text-align: center;} #visualBox .titleArea h2 span {display:block;} } /* 제목 */ .subTitle { position: relative; font-size: 1.7rem; font-weight: 600; color: #000; margin: 1.9rem 0 30px; line-height: 1.2; padding:0;} .subTitle_sub { position: relative; font-size: 1.3rem; font-weight: 500; color: #0168b7; margin: 1.9rem 0 10px; line-height: 1.2; padding:0;} /* 레이아웃 */ .contents-wrap .subsubCont{max-width: 1100px;margin:0 auto;} .contents-wrap .subsubCont ol {margin-left:30px;margin-bottom:30px;} .contents-wrap .subsubCont ol > li{list-style-type:decimal;font-size: 1rem;padding-bottom:10px;} .contents-wrap .subsubCont ol li .st, .contents-wrap .subsubCont ul li .st{padding-bottom:5px;display:block} .contents-wrap .subsubCont ul {margin-bottom:30px;} .contents-wrap .subsubCont ul li{font-size: 1rem;} .contents-wrap .subsubCont ul.dotted{margin-bottom:30px;} .contents-wrap .subsubCont ul.dotted li{position: relative;padding-left: .7rem;text-align: left;margin-bottom: 0.5rem;font-size: 1rem;} .contents-wrap .subsubCont ul.dotted li::before {content: '';width: .25rem;height: .25rem;border-radius: 50%;background: #dadada;position: absolute;top: .45rem;left: 0;} .contents-wrap .subsubCont p{ text-align:justify;margin-bottom:30px;font-size: 1rem;line-height: 1.8;} .contents-wrap .subsubCont p.pb10{margin-bottom:10px;} .contents-wrap .subsubCont .innerBox{margin-left:20px;margin-bottom:30px;} em{color:#000;font-size:1.4rem;} hr.guidline {display: block;margin: 60px 0;padding: 0;width: 100%;height: 1px;background: #ddd;border: none;} .grayBox{text-align: justify;padding: 20px;background-color: #f4f4f4;border: 1px solid #d8d8d8;margin-bottom:30px;} ol.towLine{margin-left:20px;} ol.towLine li{width:calc(50% - 10px);float:left;font-size:1rem;padding-bottom:10px;list-style-type:decimal;} ol.towLine li a{color:#000;} ol.towLine li a.on{color:#df7625} ol.towLine::after{clear:both;display:block;content:'';width:0;height:0;} @media (max-width: 767px) { ol.towLine li{width:calc(100% - 10px);} } /*테이블*/ table.tableStyle_01{width:100%; border-collapse:collapse; border-spacing:0; border-left:1px solid #d8d8d8;border-top:1px solid #444;margin-top:20px;} table.tableStyle_01 th{font-size:1.1rem;line-height:2rem;padding:8px 10px; text-align:center;border-bottom:1px solid #d8d8d8; font-weight:400; border-right:1px solid #d8d8d8;background-color:#f4f4f4;} table.tableStyle_01 td{font-size:1rem;padding:8px 10px;border-bottom:1px solid #d8d8d8; border-right:1px solid #d8d8d8} table.tableStyle_01 td.center{text-align:center;} .tableStyle_02 { width: 100%; text-align: center; } .tableStyle_02 table { position: relative; width: 100%; word-break: break-all; } .tableStyle_02 table::before { content: ''; width: 100%; height: 2px; background: #0c385a; position: absolute; top: 0; left: 0; } .tableStyle_02 table th { text-align: center; color: #000; font-size: 1rem; font-weight: 500; background: #fcfcfc; } .tableStyle_02 table thead th { font-weight: 600; color: #000; border-bottom-color: #aaa; background: #f9f9f9; } .tableStyle_02 table td { font-size: 1rem; color: #000; } .tableStyle_02 table td.text-left {text-align:left} .tableStyle_02 table th, .tableStyle_02 table td { border: 1px solid #ddd; word-break: keep-all; padding: .8rem 1rem; } .tableStyle_02 table tr:first-child th, .tableStyle_02 table tr:first-child td { border-top: 0; } .tableStyle_02::-webkit-scrollbar { height: 3px; } .tableStyle_02::-webkit-scrollbar-thumb { background-color: #333; border: 3px solid #333; border-radius: 5px; } .tableStyle_02::-webkit-scrollbar-track { background-color: #e5e5e5; } @media screen and (max-width: 767px) { .tableStyle_02 { width: 100%; overflow-x: scroll; } .tableStyle_02 table { min-width: 45rem; } } .tableStyle_03 { width: 100%; text-align: center; } .tableStyle_03 table { position: relative; width: 100%; word-break: break-all; } .tableStyle_03 table::before { content: ''; width: 100%; height: 2px; background: #0c385a; position: absolute; top: 0; left: 0; } .tableStyle_03 table th { text-align: center; color: #000; font-weight: 400; background: #fcfcfc; } .tableStyle_03 table thead th { font-weight: 600; color: #000; border-bottom-color: #aaa; background: #f9f9f9; } .tableStyle_03 table td { color: #000; } .tableStyle_03 table td.text-left { text-align:left; } .tableStyle_03 table th, .tableStyle_03 table td { border: 1px solid #ddd; word-break: keep-all; padding: .8rem 5px; } .tableStyle_03 table tr:first-child th, .tableStyle_03 table tr:first-child td { border-top: 0; } .tableStyle_03::-webkit-scrollbar { height: 3px; } .tableStyle_03::-webkit-scrollbar-thumb { background-color: #333; border: 3px solid #333; border-radius: 5px; } .tableStyle_03::-webkit-scrollbar-track { background-color: #e5e5e5; } @media screen and (max-width: 767px) { .tableStyle_03 { width: 100%; overflow-x: scroll; } .tableStyle_03 table { min-width: 45rem; } } /* --------------------------------------------------------------------------------------------------------------------------------------------------------------- sub 컨텐츠 --------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /*--인사말---*/ .subContentBox h3.professor_Title {color: #28b185;line-height: 24px;font-weight:500;font-size: 1.3rem;margin-bottom:20px;} .subContentBox .welcomBox {max-width:1100px;margin:0 auto;} .subContentBox .welcomBox p{text-align:justify;font-size: 15px;line-height:21px;color:#293848;} .subContentBox .welcomBox img {float:left;width:300px;padding-right:20px;} @media (max-width: 991px) { .subContentBox .welcomBox img {float:none;width:300px;padding-right:0;margin:0 auto 30px;display:block;} } /*--미학과소개---*/ .subContentBox p.introBox{text-align:justify;line-height:1.5;margin-bottom:30px;} .subContentBox h3.intro {position:relative;font-weight:bold; padding:12px 0;margin-bottom:15px;border-top:1px dotted #ddd;border-bottom:1px dotted #ddd;color:#45760d;} .introLeft{float:left;width:350px;margin:20px 30px 15px 0;color:#797979;line-height:20px;} .introRight{float:left;width:calc(100% - 400px);height:200px;margin:20px 0 15px 0;color:#797979;line-height:20px;} @media (max-width: 767px) { .introLeft{float:none;width:100%;} .introRight{float:none;width:100%;height:auto;} .introLeft img, .introRight img{display:block;margin:0 auto;} } /*텝*/ #nbm{width:100%;padding-bottom:17px;} #nbm .bs1{width:100%;height:auto} #nbm .bs2{width:100%;height:auto} #nbm .tb{height:33px;} #nbm .tb .off,#nbm .tb .on{border:1px solid #d7dce2;text-align:center;padding:12px 0;margin-right:5px;text-decoration:none;font-size: 1rem;font-weight:400;display:block;float:left;cursor:pointer;} #nbm .tb .off{color:#999999;width:200px;background-color: #fbfbfb;} #nbm .tb .on{color:#e34f55;width:200px;background-color: #fff;} #nbm .stc{clear:both;padding-top:15px;} #nbm .stc h4 {font-weight:bold;font-size:1.2rem;margin:10px 0 5px;} #nbm .stc ul {margin-bottom:20px;} #nbm .stc ul li{line-height:20px;} /*교수진*/ .tbl_basic {width:100%; border-top:1px solid #dbdbdb; margin-top:5px;} .tbl_basic th, .tbl_basic td{font-weight:normal; text-align:center; padding:8px 0 7px; border-right:1px solid #dbdbdb; border-bottom:1px solid #dbdbdb;} .tbl_basic thead th {background-color:#f9f9f9;text-align:center; } .tbl_basic th {background-color:#f9f9f9;} .tbl_basic th.font11 {background-color:#f9f9f9; font-size:12px;} .tbl_basic td {color:#767676;padding:10px 10px;} .tbl_basic td span{color:#bbbbbb; font-size:12px;} .tbl_basic th.last, .tbl_basic td.last {border-right:0;} .tbl_basic td.left {text-align:left;} /*--member---*/ .peopleSearch {position: absolute;top:60px;right:0;} .peopleSearch .peopleBtn {margin-top:-1px;} .peopleSearch .select{padding: 3px;} .peopleSearch label{display:inline-block;margin-top:-3px;} .tab{height:30px;width:100%;border-bottom:1px solid #c6c6c6;margin-bottom:30px;} @media screen and (-webkit-min-device-pixel-ratio:0) { .tab{height:35px;} } .tab span.off, .tab span.on{display:block;float:left;width:100px;text-align:center;padding:7px 10px;margin-right:3px;background-color: #fbfbfb;border: 1px solid #dfdfdf;border-bottom:1px solid #c6c6c6;color:#999999;font-weight:bold;} .tab span.on{font-weight:bold;background-color: #fff;border:1px solid #c6c6c6;border-bottom:1px solid #fff;color: #e34f55;font-weight:bold;} .memberList_Box{ display: flex;flex-flow: row wrap;justify-content: space-between;align-content: center;} .memberList_Box .profileBox{width:33%;border-bottom:1px dotted #ddd;margin-bottom:15px;padding-bottom:15px;} .memberList_Box .profileBox .photo{width:110px;height:143px;float:left;margin-right:20px;border:1px solid #ddd;padding:5px;} .memberList_Box .profileBox .photo img{width:110px;height:133px;} .memberList_Box .profileBox .profile{width:calc(100% - 140px);float:left;padding:0 0 5px;} .memberList_Box .profileBox .profile h3{color: #444;font-weight: bold;font-size: 16px;} .memberList_Box .profileBox .profile h3 .name_01{font-size: 14px;color: #639ba3;} .memberList_Box .profileBox .profile h3 .name_02{font-size: 13px;color: #8b8b8b;} .memberList_Box .profileBox .profile ul {margin-top:15px;} .memberList_Box .profileBox .profile ul li{line-height:22px;} .memberList_Box .profileBox details {color:#bf0202;cursor:pointer;} .memberList_Box .profileBox details p {line-height:20px;color:#293848;} @media (max-width: 1199px) { .memberList_Box .profileBox{width:50%;} } @media (max-width: 768px) { .memberList_Box .profileBox{width:100%;} .memberList_Box .profileBox .photo{float:none;margin:0 auto 20px;border:1px solid #ddd;padding:5px;} .memberList_Box .profileBox .profile{width:100%;float:none;padding:0 0 5px;} } /*교수님 member*/ .professor_detail {} .professor_detail h4{color: #444;font-weight: bold;font-size: 16px;margin:20px 0 5px;} /*--member _더보기할경우---*/ .thesis {border-top:1px dotted #ddd;margin-top:15px;} .thesis h4{font-size:14px;font-weight:bold;margin-bottom:10px;} .thesis_on {display:block;} .thesis_off {display:none;} /*--member _팝업으로 띄울경우---*/ .profilePopup{} .profilePopup h1{text-align:center;font-weight: bold;font-size: 20px;margin-bottom:30px;} .profilePopup h2{color: #04A4CC;font-weight: bold;font-size: 14px;margin-bottom:20px;} .profilePopup p{line-height:22px;font-size:13px;} /* --------------------------------------------------------------------------------------------------------------------------------------------------------------- 로그인, 마이페이지 --------------------------------------------------------------------------------------------------------------------------------------------------------------- */ .Btn_center {margin: 30px auto; width:250px;text-align:center;} /* Login */ #loginStyle {padding:30px 50px 30px 50px;max-width:480px;margin:0 auto 100px;position:relative;background-color: #fafbfb;border:1px solid #e0e4e8;} #loginStyle .loginID {margin-top:8px;} #loginStyle .loginPW {margin-top:8px;} #loginStyle legend, .search h2 {position:absolute;overflow:hidden;width:1px;height:1px;font-size:0;line-height:0;} #loginStyle .login_input {border:1px solid; background-color:#ffffff; border-color:#cccccc; width:100%;padding:10px; } #loginStyle .loginBtn button{background-color: #003861;color:#fff;width:100%;padding:10px 0;text-align:center;border-radius:10px;margin-top:20px;} .idCookie {position:absolute;bottom:-30px;left:0;} .idSearch {position:absolute;bottom:-30px;right:0;} .idSearch a{color:#6c6c6c;} /* Join */ .link_ad {margin-bottom:3px;} .joinChk {margin:20px auto;background-color:#efefef;padding:10px;} .chkID{text-align:center;border:1px solid #ddd;background-color: #f7f7f7;padding:20px;}/*아이디 중복체크*/ .chkID p{margin-bottom:10px;} .JoinPhoto{float:left;width:230px; border:1px solid #ddd;padding:15px;} .JoinPhoto img{width:230px;height:223px;} .JoinPhoto div{width:130px;margin-top:5px;} .JoinPhoto input{width:230px; border:none;cursor:pointer;} .JoinTable {float:left;width:calc(100% - 300px);margin-left:33px;border-top:1px solid #ddd;} .JoinTable tr th{text-align:center;font-weight:bold;width:100px;padding:7px ;border-bottom:1px dotted #ddd;background-color:#f7f7f7;} .JoinTable tr td{padding: 7px 5px;border-bottom:1px dotted #ddd;} .JoinTable tr td span{font-size:12px; color:#999999;line-height:20px;} .JoinH3{font-size: 14px; font-weight: bold; padding: 8px 0; margin-top: 10px; border-top: 1px dotted #ddd; border-bottom: 1px dotted #ddd; color: #45760d;} h1.ruleH1 {font-size: 14px; font-weight: bold;padding-bottom: 15px; }/*약관제목*/ .loginNotice{line-height:22px;} .alertBox{border:1px solid #e5404b; margin-top:15px;padding:10px; text-align:center; line-height:32px;} /* Search */ .searchTable {max-width:700px;width:100%;margin:10px auto 35px;} .searchTable tr th{text-align:right;padding:5px 8px;font-weight:bold;} .searchTable tr td{padding:5px 8px;} .idSearch_OK{background-color: #efefef;padding:20px;color: #bf0202;} @media (max-width: 991px) { .JoinPhoto{float:none;width:230px; margin:0 auto;border:1px solid #ddd;padding:15px;margin-bottom:30px;} .JoinTable {float:none;width:100%;margin-left:0;border-top:1px solid #ddd;} } /* --------------------------------------------------------------------------------------------------------------------------------------------------------------- 스케쥴 --------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /*월별 보기*/ #schedulesArea{position:relative;} #schedulesArea .configBox{position:absolute;top:-50px; right:0;} #schedulesArea h3{font-size:20px;font-weight:bold;color:#444;text-align:center;padding-bottom:20px;} #schedulesArea .prevNext{text-align:center;color:#ddd;} #schedulesArea .schedulesTable{margin-top:40px;} #schedulesArea .schedulesTable tr th{background-color: #f1f1f2;padding:10px 0;font-weight:bold;} #schedulesArea .schedulesTable tr th.sun{color:#d42820} #schedulesArea .schedulesTable tr th.sat{color:#205bd4} #schedulesArea .schedulesTable tr td{height:100px;padding:10px 5px;border-bottom:1px solid #ddd;vertical-align: top;font-size:12px;font-weight:normal;} #schedulesArea .schedulesTable tr td.today_sun, #schedulesArea .schedulesTable tr td.today_sun a{font-size:12px;font-weight:normal;color:#d42820;} #schedulesArea .schedulesTable tr td.today_sat, #schedulesArea .schedulesTable tr td.today_sat a{font-size:12px;font-weight:normal;color:#205bd4;} #schedulesArea .schedulesTable tr td a{font-size:12px;font-weight:normal;color:#444;line-height:20px;} /*스케줄보기 팝업*/ #schedulesView h1{font-size:20px;font-weight:bold;color:#444;text-align:center;padding:20px 0;} #schedulesView table {width:850px;margin:10px auto;border-bottom:1px solid #e9e9e9;border-top:1px solid #e9e9e9;} #schedulesView table th {border-bottom:1px solid #e9e9e9;text-align:left;font-weight:bold;color:#6c6c6c;padding-left:10px;background-color: #fbfbfb;} #schedulesView table td {border-bottom:1px solid #e9e9e9;padding:8px 15px;text-align:left;height:18px;} #schedulesView .BtnArea{width:170px;margin:10px auto;} /*일정등록 시작일 종료일 팝업*/ #schedulesDay h1{font-size:20px;font-weight:bold;color:#444;text-align:center;} #schedulesDay table {float:left;width:265px;border-bottom:1px solid #e9e9e9;margin:20px 10px 0 0;} #schedulesDay table th {border-bottom:1px solid #e9e9e9;text-align:left;font-weight:bold;color:#6c6c6c;padding-left:10px;background-color: #fbfbfb;} #schedulesDay table td {border-bottom:1px solid #e9e9e9;padding:5px;text-align:center;height:18px;} #schedulesDay table td.selected {background-color: #ddd;} #schedulesDay table td.title:hover {background-color: #fff;} #schedulesDay table td:hover {background-color: #ddd;} #schedulesDay table td.red, #schedulesDay table td.red a {color: red;} #schedulesDay table td.blue, #schedulesDay table td.blue a {color: blue;} #schedulesDay .BtnArea{clear:both;width:140px;margin:10px auto 0;} /* --------------------------------------------------------------------------------------------------------------------------------------------------------------- 각 게시판 리스트 페이지 --------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /*이미지게시판 검색부분*/ .photo_head{background-color: #fbfbfb;border-bottom:1px solid #e9e9e9;border-top: 1px solid #d6d6d6;margin-bottom: 15px;padding: 8px 5px; } .photo_head .left{float:left;} .photo_head .right{float:right;} /*박스 스타일*/ .styleBox_blue {border-top:1px solid #e0e0e0;border-bottom:1px dotted #e0e0e0;padding:20px 10px;margin-bottom:20px;} /* 카테고리 tab */ .boardTab {height:30px;width:100%;margin: 30px 0 10px;} .boardTab ul li{float:left;width:24.5%;text-align:center;padding:15px 10px;margin-right:0;margin-bottom:5px;background-color: #fbfbfb;border: 1px solid #dfdfdf;border-bottom:1px solid #c6c6c6;color:#999999;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;-o-box-sizing:border-box;} .boardTab ul li.bold{font-weight:500;background-color: #fff;border:1px solid #c6c6c6;border-bottom:none;} .boardTab ul li.bold a{color: #e34f55;} .boardTab ul li.all a{color:#000;} @media (max-width: 960px) { .boardTab ul li{width:33%;} } @media (max-width: 480px) { } /*게시판 검색*/ .SearchBoard {position:relative;padding:20px 0; width: 100%;} .SearchBoard .input_box{width:170px;padding: 3px 10px; height: 30px;border: 1px solid #ccc;background-color: #ffffff;font-size: 1rem;vertical-align: top;} .SearchBoard select{padding: 3px 10px; height: 30px;border: 1px solid #ccc;background-color: #ffffff;font-size: 1rem;vertical-align: top;} .SearchBoard .input_btn{font-size:1rem;width: 70px;height: 30px;background: #4E5B70;color: #fff;border:none;border-radius: 0;vertical-align: top;} @media only screen and (min-width: 320px) and (max-width: 480px) { .SearchBoard {margin-bottom:20px;} .SearchBoard .input_box{width:120px;} } #adminLeft {vertical-align: top;display: inline-block;width: 160px;margin-right: 35px;} #adminLeft .box_170_bg { } #adminLeft .box_170_bg .borderTit { color: #CC0000; font-size: 15px;font-weight:bold;padding: 10px 0px 8px 20px; } #adminLeft .box_170_bg .borderBox { border: 1px solid #ccc;padding: 5px 5px; } #adminLeft .box_170_bg .borderBox ul { font-size: 13px;padding: 0px 0px 0px 0;line-height: 24px; } #adminLeft .box_170_bg .borderBox li a:hover { color: #000;background-color: #d8e7ec; } #adminRight {min-width: 800px; vertical-align: top;display: inline-block;} #adminRight h2 {font-size: 15px;} #adminRight h2 span {font-size: 12px;} #boardPop {max-width: 965px; min-height: 400px; vertical-align:top;margin:0 auto;} #boardBox {width: 100%;margin-bottom:40px; vertical-align:top;} .pageBox {border:0px solid #fff;} .pageBox { margin: 40px auto; text-align: center;height: 50px;} .pageBox .paging02 a{display:inline-blcok;padding: 0 10px;line-height: 24px;text-decoration: none;border: 1px solid #ddd;border-left-width: 0;background-color:#fff;} .pageBox .paging02 a:hover { background-color:#efefef; } .pageBox .paging02 a:first-child { border-left-width: 1px; -webkit-border-radius: 3px 0 0 3px; -moz-border-radius: 3px 0 0 3px; border-radius: 3px 0 0 3px; } .pageBox .paging02 a:last-child { -webkit-border-radius: 0 3px 3px 0; -moz-border-radius: 0 3px 3px 0; border-radius: 0 3px 3px 0; } #leftArea_sub {width: 100%;} /* 커뮤니티 */ #sm_top{display:none;} /*양식 input스타일*/ #boardBox .select, #boardBox .input_box {padding: 3px 10px; height: 35px;border: 1px solid #ccc;background-color: #ffffff;} #boardBox .textarea{border: 1px solid #b8bce2;padding:10px;background-color: #ffffff;} /*게시판 버튼*/ .boardBtn {margin-top:20px;height:40px;} .boardBtn .col_left {float:left;display:inline-block;} .boardBtn .col_right {float:right;display:inline-block;} button.whiteInputBtn {border:1px solid #ddd; width:60px;height:40px;margin-top:3px;font-weight:bold;vertical-align:top; background: #3498db; background-image: -webkit-linear-gradient(top, #fff, #efefef); background-image: -moz-linear-gradient(top, #fff, #efefef); background-image: -ms-linear-gradient(top, #fff, #efefef); background-image: -o-linear-gradient(top, #fff, #efefef); background-image: linear-gradient(to bottom, #fff, #efefef);color: #e60c29; } button.whiteBtn {border:1px solid #ddd; width:60px;height:40px;margin-top:3px;font-weight:bold;vertical-align:top; background: #3498db; background-image: -webkit-linear-gradient(top, #fff, #efefef); background-image: -moz-linear-gradient(top, #fff, #efefef); background-image: -ms-linear-gradient(top, #fff, #efefef); background-image: -o-linear-gradient(top, #fff, #efefef); background-image: linear-gradient(to bottom, #fff, #efefef);} /*기본게시판 리스트*/ #boardBox table.board_list {width:100%;margin-top:20px;border-top: 1px solid #000;background-color:#fff;} #boardBox table.board_list tr th{border-bottom: 1px solid #aaa;padding: 10px 5px; border-top: 2px solid #0c385a; background: #f9f9f9;font-size:14px;text-align:center;font-weight:bold;} #boardBox table.board_list tr th:last-child{background:none;background-color:#f7f8fa;} #boardBox table.board_list tr td {border-bottom:1px solid #ccc;padding:8px 5px;text-align:center;} #boardBox table.board_list tr td.left {text-align:left;} #boardBox table.board_list tr td.gray {color:#a5a5a5 !important;background-color:#fff;border:none;border-bottom:1px solid #ccc;} #boardBox table.board_list tr td.gray a {color:#a5a5a5;background-color:#fff;border:none;} @media (max-width: 767px) { #boardBox table.board_list colgroup col.mo{display:none;} #boardBox table.board_list tr th.mo{display:none;} #boardBox table.board_list tr td.mo{display:none;} } /*기본게시판 본문*/ #boardBox table.board_view {width:100%;margin-top:20px;background-color:#fff;} #boardBox table.board_view img{max-width:100%;} #boardBox table.board_view thead th.title{padding:14px;border-bottom: 1px solid #aaa;border-top: 2px solid #0c385a;color:#000;font-size:18px;background-color:#f9f9f9;} #boardBox table.board_view thead th{border-bottom:1px solid #e9e9e9;text-align:center;font-weight:bold;} #boardBox table.board_view thead td {border-bottom:1px solid #e9e9e9;padding:8px 15px;text-align:left;height:18px;vertical-align: middle;} #boardBox table.board_view tbody td{padding:5px 10px 30px;line-height:180%;text-align:justify;} #boardBox table.board_view tbody td .file {border:1px solid #dadada;padding:10px;} #boardBox table.board_view tbody td .file strong{color:#556fbb;padding-right:10px;} #boardBox table.board_view tbody td .info {margin-bottom:50px;width:100%;} #boardBox table.board_view tbody td .info .writer{float:left;width:150px;} #boardBox table.board_view tbody td .info .writer strong{color:#444;font-weight:500;padding-right:10px;} #boardBox table.board_view tbody td .info .writeDate{float:right;width:auto;} #boardBox table.board_view tbody td .info .writeDate strong{color:#444;font-weight:500;padding-right:10px;} #boardBox table.board_view thead tr td .linkWidth{overflow:hidden;text-overflow: ellipsis;width:300px;display:block;white-space:nowrap;} @media only screen and (max-width: 640px) { #boardBox table.board_view tbody td .info .writer{font-size:.8rem;} #boardBox table.board_view tbody td .info .writeDate{font-size:.8rem;} } /*게시판 글쓰기*/ #boardBox h3 {font-size: 14px; font-weight: bold; padding: 8px 0; margin-bottom: 15px; color: #45760d;} #boardBox table.board_form {width:100%;border:1px solid #c7d1da;border-bottom: 1px solid #c7d1da;background-color:#fff;} #boardBox table.board_form tbody th {border-bottom:1px solid #ddd;text-align:left;font-weight:normal;font-size:.9rem;color:#5a6231;padding-left:10px;background-color: #f8f8f8;} #boardBox table.board_form tbody td {border-bottom:1px solid #ddd;padding:8px 15px;text-align:left;height:18px;} #boardBox table.board_form tbody td .input_box{width:100%;max-width:500px;} #boardBox table.board_form tbody td .input_box.small{width:100%;max-width:200px;} @media (max-width: 767px) { #boardBox table.board_form{display:block;width:100%;} #boardBox table.board_form colgroup{display:none;} #boardBox table.board_form tbody tr {display:block;width:100%;height:auto;} #boardBox table.board_form tbody th {display:block;width:100%;height:auto;padding:10px;} #boardBox table.board_form tbody td {display:block;width:100%;height:auto;} #boardBox table.board_form tbody td .input_box{width:100%;max-width:100%;} #boardBox table.board_form tbody td .input_box.small{width:100%;max-width:100%;} } /*사진 게시판 리스트*/ #photoBox{border-bottom:1px solid #e0e0e0;} #photoBox .photoListBox::after{clear:both;content:'';display:block;width:0;height:0;} #photoBox .photoListBox ul.photo_list li{float:left;width:25%;height:600px;text-align:center;margin:0;border-top:1px dashed #ddd;padding-top:20px;} #photoBox .photoListBox ul.photo_list li > div.isimg {display:block;width:100%;height:auto;max-height:430px;overflow:hidden;} #photoBox .photoListBox ul.photo_list li > div.isimg a {display:inline-block;width:100%;text-align:center;} #photoBox .photoListBox ul.photo_list li > div.isimg a img{width:80%;height:auto;}/*이미지박스*/ #photoBox .photoListBox ul.photo_list li > div.noimg {width:90%;margin:0 auto;padding-top:25px;height:200px;text-align:center;background-color:#efefef;} #photoBox .photoListBox ul.photo_list li > div.noimg img{width:150px;} #photoBox .photoListBox ul.photo_list li p.title{width:90%;font-size:1.1rem;text-align:left;font-weight:400;margin: 15px auto 5px;overflow:hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical; word-wrap:break-word;}/*이미지제목*/ #photoBox .photoListBox ul.photo_list li p.photo_date{width:90%;text-align:left;margin: 8px auto;font-size:1rem;color:#a5a5a5;padding-top:3px;}/*이미지제목*/ #photoBox .photoListBox ul.photo_list.book li{width:20%;height:auto;padding:0 0 40px;} #photoBox .photoListBox ul.photo_list.book li > div.isimg{position:relative;padding-top:40px;overflow:visible;} #photoBox .photoListBox ul.photo_list.book li > div.isimg:after{margin:0 10px;position:absolute;left:0;bottom:-10px;width:calc(100% - 20px);height:10px;border:1px solid #CDCDCD;background-color:#fff;content:'';display:block;} #photoBox .photoListBox ul.photo_list.book li > div.isimg a img{width:200px;height:300px;box-shadow: 5px -5px 30px rgb(0 0 0 / 16%);}/*이미지박스*/ #photoBox .photoListBox ul.photo_list.book li p.title{height:40px;margin-top:30px;}/*이미지제목*/ @media (max-width: 1199px) { #photoBox .photoListBox ul.photo_list li{width:25%;height:500px;} #photoBox .photoListBox ul.photo_list.book li{width:25%;} #photoBox .photoListBox ul.photo_list.book li > div.isimg a img{box-shadow: 5px -5px 15px rgb(0 0 0 / 16%);}/*이미지박스*/ } @media (max-width: 991px) { #photoBox .photoListBox ul.photo_list li{width:33.3%;height:450px;} #photoBox .photoListBox ul.photo_list li > div.isimg {max-height:270px;} #photoBox .photoListBox ul.photo_list.book li{width:33.3%;padding:0 0 30px;} #photoBox .photoListBox ul.photo_list.book li > div.isimg{padding-top:30px;max-height:330px;} } @media (max-width: 767px) { #photoBox .photoListBox ul.photo_list li{width:50%;height:400px;} #photoBox .photoListBox ul.photo_list li > div.isimg {max-height:250px;} #photoBox .photoListBox ul.photo_list.book li{width:50%;} #photoBox .photoListBox ul.photo_list.book li > div.isimg a img{width:160px;height:230px;} #photoBox .photoListBox ul.photo_list.book li > div.isimg {max-height:auto;} } @media (max-width: 575px) { } /*게시판 이전글 다음글*/ .prev_next {width:100%;background-color:#fff;border-top:1px solid #ccc;} .prev_next .prev {padding:10px;border-bottom:1px solid #ccc;} .prev_next .next {padding:10px;} .prev_next .prev span, .prev_next .next span{font-weight:600;width:60px;display:inline-block;color:#2a3c86;} .prev_next .prev a, .prev_next .next a{display:inline-block;vertical-align:top;overflow:hidden;text-overflow: ellipsis; width:calc(100% - 70px);white-space:nowrap;} #boardBox table.prev_next {width:100%;} #boardBox table.prev_next tbody th{font-weight:bold;padding:8px;border-bottom:1px solid #e9e9e9;width: 150px;} #boardBox table.prev_next tbody td{padding:8px;border-bottom:1px solid #e9e9e9;} @media (max-width: 767px) { #boardBox table.prev_next tbody th{width: 80px;} } /*사진 게시판 lightbox*/ .new_imageBox {margin-top:20px;} .new_imageBox ul li {display:inline-block;*display:inline;*zoom:1;margin:0 5px 5px 0;line-height:19px;vertical-align:top;border:1px solid #9e9e9e;} .new_imageBox ul li a img {width:120px;} .new_imageBox ul li:hover {color:#1b8868;border:1px solid #443731;} .new_imageBox ul li h3{line-height:20px;width:165px;font-size:12px;letter-spacing: -1px;background-color: #fff;height:38px;padding:5px;} /* 댓글영역 */ .repleListBox {margin-top:20px;border-bottom:1px solid #ccc;} .repleListBox .list {padding:10px 0 0 20px;border-top:1px solid #ccc;} .repleListBox .list strong{color:#0350c2;} .repleListBox .list p{width:100%;margin-top:5px;padding-bottom:15px;} .repleBox {background-color: #fbfbfb;border:1px solid #c7d1da;border-top:1px solid #ddd;width:100%;padding:20px 0 30px;box-sizing:border-box;-o-box-sizing:border-box;-webkit-box-sizing:border-box;} .repleBox form{padding:0 20px} .repleBox textarea {padding:5px;width:80%} .repleBox input, .repleBox textarea {border:1px solid #d4d4d4;} .repleBox button.whiteBtn {width:80px;height:65px;margin-top:3px;font-weight:bold;vertical-align:top;} @media (max-width: 767px) { .repleBox textarea {width:100%} .repleBox span.infoT {display:block;margin-top:10px;} .repleBox button.whiteBtn {width:100%;height:40px;} } /*이미지 리스트*/ .video_lightbox {margin-bottom:30px;} .video_lightbox > a {display: block;color: #000;position: relative;bottom: 0;width:100%;height: 150px;overflow: hidden;-webkit-transition: 0.5s;-o-transition: 0.5s;transition: 0.5s;border-radius:7px;0webkit-border-radius:7px;-moz-border-radius:7px;} .video_lightbox > a img {position: absolute; top: 50%; transform: translateY(-50%);-webkit-transition: 0.5s;-o-transition: 0.5s;transition: 0.5s;border-radius:7px;0webkit-border-radius:7px;-moz-border-radius:7px;} .img-responsive {display: block;width: 100%;height: auto;} .video_lightbox > a:hover .img-responsive{transform: translateY(-50%) scale(1.1);-webkit-transform: translateY(-50%) scale(1.1);-ms-transform: translateY(-50%) scale(1.1)} .video_lightbox h3, .video_lightbox span {} .video_lightbox h3{overflow:hidden;text-overflow: ellipsis; width:90%;white-space:nowrap;margin:10px 0 5px;} .video_lightbox span {font-size: 1rem;color:#afafaf;font-weight:400;} @media (max-width: 767px) { .video_lightbox a{ height: 200px;} .video_lightbox { padding-left: 0;} .video_lightbox:nth-child(2n) { padding-right: 0;} } @media (max-width: 575px) { .video_lightbox a { height: 130px;} } /* ------ 버튼/ 페이징 영역 ------ */ .paging02 {margin:20px 0 0 5px;text-align:center;line-height:1.5;font-size: 13px;font-family:Arial,Verdana, AppleGothic, sans-serif;} .paging02 .num a {padding:1px 5px;margin:0 4px;text-decoration:none;color:#336666;} .paging02 .num a.on {color: #fff;border:1px solid #3780a1;background-color:#4798c5;} .paging02 .num a.off {color: #486bd1;border:1px solid #fff;} .paging02 .num a:link.off {color: #486bd1;border:1px solid #fff;} .paging02 .num a:hover.off {color: #fff;border:1px solid #3780a1;background-color:#4798c5;} .paging02 a.btnPage_one {width:58px;height:24px;} .paging02 a.btnPage_two {width:58px;height:24px;} #pagination {margin: 30px auto;text-align:center;} #pagination ul {display: inline-block;margin-left: 0;margin-bottom: 0;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;-webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.05);-moz-box-shadow: 0 1px 2px rgba(0,0,0,0.05);box-shadow: 0 1px 2px rgba(0,0,0,0.05);} #pagination li {display: inline; } #pagination li.active a {color: blue; background-color:#efefef;} #pagination li:first-child a {border-left-width: 1px;-webkit-border-radius: 3px 0 0 3px;-moz-border-radius: 3px 0 0 3px;border-radius: 3px 0 0 3px;} #pagination li:last-child a {-webkit-border-radius: 0 3px 3px 0;-moz-border-radius: 0 3px 3px 0;border-radius: 0 3px 3px 0;} #pagination a {float: left;font-size:1rem;font-weight:300;padding:10px 20px;text-decoration: none;border:1px solid #ddd;border-left-width: 0;background-color:#fff;height: 40px;} #pagination a:hover { background-color:#efefef; }