File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
/* PC */
section.main {
position:relative;
width:100%;
}
.main_title_wr {text-align:center; height:50px; font-size:22px; letter-spacing:-1px; color:#2d2d2d; background:url('/img/index/main_title_bar.jpg') no-repeat bottom center }
@media (max-width: 700px){
.main_title_wr {height:auto; background:none;}
}
/* 190201 수정 s */
/* 메인비쥬얼 */
.visual_txt {position:absolute; padding-top:5.5%; left:50%; margin-left:-9%; width:18%; z-index:99;} /* 190131 수정*/
.visual_txt img {width:100%;}
.visual {position:relative; width:100%; height:auto;}
/*메인슬라이드 s*/
#slides {position:relative;}
#slides, #slides .slidesjs-control, #slides .slidesjs-container, #slides .slidesjs-slide {width:100%;height:auto;z-index:0;}
#slides .slidesjs-navigation {
margin-top:0px;
}
#slides a.slidesjs-next,
#slides a.slidesjs-previous{
display:block;
width:5%;
height:17%;
text-indent: -9999px;
z-index:100;
}
#slides a.slidesjs-next {
background-image: url('/img/index/btns-next.png');
background-repeat: no-repeat;
background-size:cover;
position:absolute;
top:40%;
right:4%;
}
#slides a:hover.slidesjs-next {
}
#slides a.slidesjs-previous {
background-image: url('/img/index/btns-prev.png');
background-repeat: no-repeat;
background-size:cover;
position:absolute;
top:40%;
left:4%;
}
#slides a:hover.slidesjs-previous {}
#slides a.slidesjs-play {
position:absolute;
bottom:9.3%;
left:49%;
margin-left:3.5%;
width:20px;
height:0;
padding-top: 15px;
background-image: url(/img/index/pagination.png);
background-repeat:no-repeat;
background-position: 0 -56px;
z-index:1000000;
text-indent:-9999px;
overflow: hidden;
}
#slides a:hover.slidesjs-play {
width:20px;
height:0;
padding-top: 15px;
background-position: 0 -56px;
}
#slides a.slidesjs-stop {
position:absolute;
bottom:9.3%;
left:49%;
margin-left:3.5%;
width:20px;
height:0;
padding-top: 15px;
background-image: url(/img/index/pagination.png);
background-repeat:no-repeat;
background-position: 0 -40px;
z-index:1000000;
text-indent:-9999px;
overflow: hidden;
}
#slides a:hover.slidesjs-stop {
width:20px;
height:0;
padding-top: 15px;
background-position: 0 -40px;
}
#slides .slidesjs-pagination {
position:absolute;
bottom:9.5%;
left:51%;
margin-left:-3%;
float: right;
list-style: none;
border:0px solid red;
z-index:10000;
}
#slides .slidesjs-pagination li {
float: left;
margin: 0 2px;
}
#slides .slidesjs-pagination li a {
display: block;
width: 13px;
height: 0px;
padding-top: 13px;
margin:0 1px;
background-color:#fff;
/* background-image: url('/img/index/pagination.png');
background-position: 0 10px; */
float: left;
overflow: hidden;
z-index:100;
border-radius:100px;
}
#slides .slidesjs-pagination li a.active,
#slides .slidesjs-pagination li a:hover.active {
background-position: 0 0
border-radius:100px;
background-color:#9aa60f;
}
#slides .slidesjs-pagination li a:hover {
background-position: 0 0
}
#slides .navbar {overflow: hidden}
@media (max-width: 1300px){
#slides .slidesjs-pagination {left:50%;}
}
@media (max-width: 950px){
#slides .slidesjs-pagination {left:48%;}
}
@media (max-width: 600px){
#slides .slidesjs-pagination {left:45%; bottom:10%}
#slides .slidesjs-pagination li a {
display: block;
width: 7px;
height: 0px;
padding-top: 7px;
margin:0 1px;
background-color:#fff;
/* background-image: url('/img/index/pagination.png');
background-position: 0 10px; */
float: left;
overflow: hidden;
z-index:100;
border-radius:100px;
}
}
/*메인슬라이드 e*/
/* 190201 수정 e */
/* 메인 공지글 */
.main_board_pc {position:relative; width:100%; background:#f9f9f9; padding:15px 0;}
.main_board {position:relative; width:1300px; margin:0px auto;}
.main_board_box {position:relative; transition:0.3s; display:inline-block; background:#fff; border:1px solid #ddd; width:23.9%; margin:0 0.4%; padding:25px 20px;}
.main_board_box .board_title {display:inline-block; font-weight:500; font-size:18px; color:#000; margin-bottom:20px; padding-bottom:5px; border-bottom:2px solid #000}
.main_board_box .board_more {position:absolute; top:30px; right:15px;}
.main_board_box .board_more a {border:1px solid #ddd; border-radius:100px; padding:5px 10px; font-size:13px; color:#888888; font-weight:500}
.main_board_box .board_more a:hover {border:1px solid #979797; border-radius:100px; padding:5px 10px; font-size:13px; color:#404040; font-weight:500}
.main_board_box .board_list {font-size:14px;}
.main_board_box .board_list ul li {position:relative; padding:2px;}
.main_board_box .board_list ul li .lt_list {display:inline-block; width:76%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.main_board_box .board_list ul li .lt_date {position:absolute; text-align:right; top:3px; right:0px; font-size:13px; color:#8d8d8d; }
.main_board_mobile{display:none;}
@media (max-width: 1300px){
.main_board {position:relative; width:100%; margin:0px auto;}
.main_board_box .board_list ul li .lt_list {width:69%;}
}
@media (max-width: 960px){
.main_board_pc {padding:10px 0 10px 1%;}
.main_board {position:relative; width:100%; margin:0px auto;}
.main_board_box {width:48%; margin:0.5%;}
}
@media (max-width: 480px){
.main_board_pc {display:none;}
.main_board_mobile{display:block; border:1px solid #ddd; padding:10px; margin:10px; }
.main_board_box {width:100%; border:0; margin:0px; padding:0px}
.main_board_box .board_more {position:absolute; top:-45px; right:0px;}
.main_board_box .board_list ul li {position:relative; padding:0px;}
/*메인 탭*/
.tab_main {list-style:none; overflow: hidden; }
.tab_main li {display:inline-block; font-weight:500; margin-right:10px; font-size:18px; color:#949494; padding-bottom:5px; border-bottom:2px solid #949494; cursor:pointer; transition:0.3s; }
.tab_main li:first-child {background:none;}
.tab_main li.current span.count {color:#000; color:#000; margin-bottom:20px; padding-bottom:5px; border-bottom:2px solid #000;}
.tab_main li span.count {color:#000; margin-bottom:20px; padding-bottom:5px; border-bottom:2px solid #000;}
.tab_maincontent {display: none;}
.tab_maincontent.current {display: block;}
ul.tab_main li.current {color:#000; margin-bottom:20px; padding-bottom:5px; border-bottom:2px solid #000;}
ul.tab_main li:hover {color:#000; border-bottom:2px solid #000;}
}
/* 메인 소식 */
.main_notice {position:relative; width:100%; background:#e0e0e0; padding:40px 0;}
.main_notice_img {width:75%; margin:30px auto;}
.main_gal_wr {position:relative; width:100%; background:#f9f9f9; padding:40px 0; }
.main_top_wr {position:relative; width:1300px; height:750px; margin:0 auto; transition:0.3s; }
@media (max-width: 1300px){
.main_top_wr {position:relative; width:100%; height:0; padding-bottom:58%; margin:0 auto; }
}
@media (max-width: 960px){
.main_top_wr {position:relative; width:100%; height:0; padding-bottom:120%; margin:0 auto; }
}
@media (max-width: 700px){
.main_gal_wr {position:relative; width:100%; background:#f9f9f9; padding:10px 0; }
.main_top_wr {position:relative; width:100%; height:auto; padding-bottom:0; margin:0 auto; }/*190419 수정*/
.main_notice {position:relative; width:100%; background:#e0e0e0; padding:20px 0;}
.main_notice .main_title_wr {font-size:18px; }
.main_notice_img {width:75%; margin:10px auto; margin-bottom:40px}
}
/* KCDF 갤러리 안내 */
.main_gal_left {position:absolute; left:0; top:0px; width:718px;}
.main_gal_menu {position:relative; margin:20px 0 0px; width:718px; height:350px; border:1px solid #e1e1e1; background:url('/img/index/main_gallery_bg_pc.jpg') no-repeat;}
.main_gal_menu ul {position:absolute; bottom:0; left:0; width:428px;}
.main_gal_menu ul li {float:left; width:214px; height:145px; border:1px solid rgba(255,255,255,0.5)}
@media (max-width: 1300px){
.main_gal_left {position:absolute; left:0; top:0px; width:60%; padding:0 10px }
.main_gal_menu {position:relative; margin:20px 0 10px; width:100%; height:0; padding-bottom:48%; border:1px solid #e1e1e1; background:url('/img/index/main_gallery_bg_pc.jpg') no-repeat; background-size:100%}
.main_gal_menu ul {position:absolute; bottom:0px; left:0; width:54%}
.main_gal_menu ul li {float:left; margin:-1px; width:49%; height:0; padding-bottom:33.4%; border:1px solid rgba(255,255,255,0.5)}
.main_gal_menu ul li img {width:100%;}
}
@media (max-width: 960px){
.main_gal_left {position:absolute; left:0; top:0px; width:100%; padding:0 10px }
.main_gal_menu {position:relative; margin:20px 0 10px; width:100%; height:0; padding-bottom:38%; border:1px solid #e1e1e1; background:url('/img/index/main_gallery_bg_tab.jpg') no-repeat; background-size:100%}
.main_gal_menu ul {position:absolute; bottom:0px; left:0; width:50%}
.main_gal_menu ul li {float:left; margin:-1px; width:50%; height:0; padding-bottom:33.4%; border:1px solid rgba(255,255,255,0.5)}
.main_gal_menu ul li img {width:100%;}
}
@media (max-width: 700px){
.main_gal_left {position:relative; left:auto; top:auto; width:100%; padding:10px }
.main_gal_menu {position:relative; margin:20px 0 10px; width:100%; height:0; padding-bottom:57%; border:1px solid #e1e1e1; background:url('/img/index/main_gallery_bg_mobile.jpg') no-repeat; background-size:100%}
.main_gal_menu ul {position:absolute; bottom:0px; left:0; width:77%}
.main_gal_menu ul li {float:left; margin:-1px; width:50%; height:0; padding-bottom:33.4%; border:1px solid rgba(255,255,255,0.5)}
.main_gal_menu ul li img {width:100%;}
.main_gal_left .main_title_wr {font-size:18px; }
}
/* KCDF 갤러리 전시 */
.main_gal_right {position:absolute; right:0; top:0px; width:582px;}
.main_gal_img {width:53%; margin:20px auto}
@media (max-width: 1300px){
.main_gal_right {position:absolute; right:0; top:0px; width:40%; padding:0 10px }
}
@media (max-width: 960px){
.main_gal_right {position:absolute; right:0; top:39%; width:47.5%; padding:0 10px }
.main_gal_right .main_title_wr {font-size:18px; margin-top:20px; }
}
@media (max-width: 700px){
.main_gal_right {position:relative; right:auto; top:auto; width:100%; padding:0 10px; margin-bottom:50px }
.main_gal_right .main_title_wr {font-size:18px; margin:0px; }
}
/*190419 수정s*/
.mobile_bottom_700 {display:none}
/* 모바일 하단메뉴 */
@media (max-width: 700px){
.mobile_bottom {position:relative; display:none; }
.mobile_bottom_700 {display:block; clear:both; height:330px; margin:20px 0; padding:10px;}
.main_right700 {float:right; width:49%;}
}
/* KCDF 블로그 */
.main_blog {position:absolute; left:0; top:434px; width:32.5%; height:325px; padding:20px 15px 15px; border:1px solid #e1e1e1; background:#fff}
.main_blog_list {padding-top:20px;}
.main_blog_list li {position:relative; float:left; width:48%; margin:1%; height:0; padding-top:51%;}
.blog_thum_bg {position:absolute; bottom:0; background:rgba(0,0,0,0.4); padding:10px; color:#fff; font-size:13px; line-height:15px}
@media (max-width: 1300px){
.main_blog {position:absolute; left:0; top:62%; width:32.5%; height:0; padding-bottom:20.5%; margin:0 10px }
.main_blog_list {padding-top:10px;}
.main_blog .main_title_wr {font-size:18px}
.main_blog_list li {padding-top:44%;}
}
@media (max-width: 960px){
.main_blog {position:absolute; left:0; top:40%; width:47.5%; height:0; padding-bottom:36%; margin:0 10px }
.main_blog .main_title_wr {font-size:18px}
.main_blog_list li {padding-top:60%;}
}
@media (max-width: 700px){
.main_blog {position:relative; float:left; left:auto; top:auto; width:49%; height:310px; padding:0; margin:0; border:0;}
.main_blog .main_title_wr {display:none}
.main_blog_list {width:100%; padding-top:0px;}
.main_blog_list li {position:relative; float:left; width:100%; margin:0; height:310px; padding-top:0;}
/*.main_blog_list li:last-child {display:none}*/
}
/* 우수문화상품지정제 */
.main_kribbon {position:absolute; left:33.7%; top:434px; width:32.5%; height:325px; padding:15px; border:1px solid #e1e1e1; background:#fff}
.kribbon_thumnail {border:0px solid red; position:absolute; width:31%; height:0; padding-bottom:46%; left:3.5%; bottom:25%;}
.kribbon_left {float:left}
.kribbon_left .btn {position:absolute; left:15px; bottom:30px; width:130px; height:40px; }
.kribbon_left .btn a {display:block;width:130px;height:40px; line-height:40px; padding:0 10px; color:#fff; background:url('/img/index/k_ribbon_icon.png') no-repeat #09afba center right 20px; }
.kribbon_left .btn a:hover {background:url('/img/index/k_ribbon_icon.png') no-repeat #048e97 center right 20px; }
.kribbon_right {float:right; width:60%; border-radius:20px; background:#f3f3f3; padding:20px; word-break:keep-all}
.kribbon_right .title {height:35px; margin-bottom:10px; font-weight:700; font-size:17px; color:#282828; background:url('/img/index/k_ribbon_bar.jpg') no-repeat left bottom;}
.kribbon_right .text {font-weight:400; font-size:13px; color:#727272; line-height:18px}
@media (max-width: 1300px){
.main_kribbon {position:absolute; left:33.7%; top:62%; width:31%; height:0; padding-bottom:21%; margin:0 10px; }
.kribbon_thumnail {position:absolute; width:31%; height:0; padding-bottom:45%; left:50%; margin-left:-15%; bottom:31%;}
.kribbon_left .btn {position:absolute; left:50%; bottom:30px; margin-left:-65px; width:130px; height:40px; }
.kribbon_right {display:none}
}
@media (max-width: 960px){
.main_kribbon {position:absolute; left:0; top:74.5%; width:47.5%; height:0; padding-bottom:30%; margin:0 10px;}
.kribbon_thumnail {position:absolute; width:31%; height:0; padding-bottom:44%; left:50%; margin-left:-15%; bottom:28%;}
}
@media (max-width: 700px){
.main_kribbon {position:relative; left:auto; right:auto; top:auto; width:100%; height:150px; padding-bottom:0; margin:0px 0px 10px; background:url('/img/index/k_ribbon_img_m3.jpg') no-repeat #fff right 20px center; background-size:50%}
.kribbon_thumnail {position:absolute; width:33%; height:130px; padding-bottom:0; left:4%; bottom:10px; margin-left:0; }
.kribbon_left .btn {display:none}
.kribbon_left .btn a {display:block;width:100px;height:25px; line-height:25px; background:url('/img/index/k_ribbon_icon.png') no-repeat #09afba center right 5px; }
.kribbon_left .btn a:hover {background:url('/img/index/k_ribbon_icon.png') no-repeat #048e97 center right 5px; }
}
@media (max-width: 400px){
.main_kribbon {background: url('/img/index/k_ribbon_img_m3.jpg') no-repeat center bottom 10px #fff;background-size: 70%;}
.kribbon_thumnail {position:relative;width: 60px;height: 130px;padding-bottom:0;left: 0;bottom: 30px;margin:0 auto;text-align:center;}
}
/* 정기구독 */
.main_magazine {cursor:pointer; position:absolute; right:0; top:434px; width:32.5%; height:325px; background:url('/img/index/main_magazine_bg2.jpg') no-repeat; background-size:cover}
.magazine_thumnail {border:0px solid red; position:absolute; width:44%; height:0; padding-bottom:57.5%; right:26.5px; bottom:58px;}
.main_magazine .btn {padding:30px}
.main_magazine .text01 {font-size:14px; font-weight:500; color:#414141; margin:1.5% 0 0 3%;}
.main_magazine .text02 {font-size:14px; font-weight:500; color:#fff; margin:8% 0 0 4.5%; }
@media (max-width: 1300px){
.main_magazine {position:absolute; right:0; top:62%; width:32.5%; height:0; padding-bottom:22.5%; margin:0 10px; background:url('/img/index/main_magazine_bg_tab.jpg') no-repeat #666666; background-size:100%}
.magazine_thumnail {position:absolute; width:38.5%; height:0; padding-bottom:50%; right:8.5%; bottom:20%;}
.main_magazine .btn {width:37%; padding:5%}
.main_magazine .btn img {width:100%}
.main_magazine .text01 {display:none}
.main_magazine .text02 {display:none}
}
@media (max-width: 960px){
.main_magazine {position:absolute; right:0; top:74.5%; width:47.5%; height:0; padding-bottom:32%; margin:0 10px; background:url('/img/index/main_magazine_bg_tab.jpg') no-repeat #666666; background-size:100%}
.magazine_thumnail {position:absolute; width:38%; height:0; padding-bottom:49.5%; right:8.5%; bottom:18%;}
}
@media (max-width: 700px){
.main_magazine {position:relative; right:auto; top:auto; width:100%; height:150px; padding-bottom:0; margin:0; background:url('/img/index/main_magazine_bg_m2.jpg') no-repeat #666666; background-size:100%}
.magazine_thumnail {position:absolute; width:100px; height:130px; padding-bottom:0; right:6%; bottom: auto; top: 10px;}
.main_magazine .btn {display:none}
}
@media (max-width: 400px){
.magazine_thumnail {width:80px}
}
/*190419 수정e*/
/*하단배너 190207 수정*/
#link_wrap {position:relative; width:100%; height:80px; border-top:1px solid #e5e5e5; overflow:hidden}
#link_wrap .link_wrap_1300 {position:relative; width:1280px; margin:0 auto;}
.banner_img {margin:23px auto}
@media (max-width: 1300px) {
#link_wrap .link_wrap_1300 {position:relative; width:90%; margin:0 auto;}
}
@media (max-width: 700px){
#link_wrap {position:relative; width:100%; height:70px; border-top:1px solid #e5e5e5; overflow:hidden}
}