@charset "utf-8";

/* 
 * content CSS Document
 * KOWEB
 */

#header{border-bottom:1px solid #e4e4e4;}
#container{margin:0 auto; width:100%;}
#container:after{content:''; display:block; clear:both;}
#container.bg01{background:url(../images/content/img_listbg02.gif) repeat-x 50% 500px; background-size:100% 480px;}
#content{min-height:550px; padding-bottom:90px;}
#content:after{content:''; display:block; clear:both;}
#content > .inr{position:relative; padding:50px 0; width:100%; max-width:1300px; margin:0 auto;}
#content h2{position:relative; margin:30px auto; overflow:hidden; display:block; text-align:left; font-size:35px; font-weight:300; color:#2c2c2c;}
#content h2 > span{display:inline-block; text-align:center; border-bottom:1px solid #282828;}
#content h2:after{content:''; display:block; clear:both;}
#content h5{font-size:45px; line-height:1.6em; margin:60px 0 40px 0; color:#85785d;}
.btn_home{display:block; position:absolute; top:18px; right:24px; z-index:10; width:40px; height:40px; text-indent:100%; font-size:0px; background:#fff url(../images/content/img_link.png) no-repeat 50% 50%; background-size:20px 20px; border:2px solid #dcd4c4; border-radius:50%;}
.btn_home:hover{background-color:#f7f4ec;}
.area_about + h2{margin-top:0 !important;}
.area_about + .area_info{margin-top:-50px;}
.area_about.about02 .txt p{height:auto;}

.button03{display:block; clear:both; position:relative; margin:15px 0 35px 0; width:100px; height:38px; line-height:36px; border:2px solid #cab895; color:#776b53 !important; text-align:center; vertical-align:top; font-size:14px; font-weight:400; transition:all 0.2s ease 0.1s;}
.button03:hover,
.button03:focus{background:#333; border-color:#333; color:#fff !important;}

/* 소개 */
.area_info{position:relative; margin:0 auto 40px auto; padding:20px 5%; width:100%; height:auto; line-height:1.8em; font-size:15px; border:1px solid #f0f0f0;}
.area_info:after{content:''; display:block; clear:both;}
.area_info li{padding:8px 0;}
.area_info li:last-child{border:0;}
.area_info li span > br{display:none;}
.area_info li em{display:block; word-break:keep-all; width:100px; float:left; color:#333; font-weight:500; text-align:left;}
.area_info li span{display:block; float:left; color:#666; font-weight:300;}
.area_info li:after{content:''; display:block; clear:both;}
.area_about.about02 .img03{width:55%;}
.area_about.about02 .txt{width:40%;}

/* 년도선택 */
.designSelect{position:relative; margin-bottom:40px;}
.designSelect:after{content:''; display:block; clear:both;}
.designSelect .select{float:left; display:inline-block; position:relative; width:180px; height:46px; margin:10px 15px 0 0; font-size:14px; color:#141414; text-align:center; cursor:pointer;}
.designSelect .select select{display:none;}
.designSelect .selectbox{position:absolute; top:0; right:0; bottom:0; left:0; padding:12px 15px 8px 5px; background-color:transparent; border:2px solid #e3e3e3; color:#333;}
.designSelect .selectbox:after{content:''; position:absolute; top:18px; right:15px; width:12px; height:7px; background:url(../images/board/img_faq.png) no-repeat 50% 50%; background-size:8px auto; transition:all 0.8s ease 0s;}
.designSelect .selectbox:active,
.designSelect .selectbox.active{background-color:#eaddc3; color:#333; border:2px solid #cab895; transition:all 0.8s ease 0s;}
.designSelect .selectbox:active:after,
.designSelect .selectbox.active:after{transform:rotate(180deg); transition:all 0.8s ease 0s;}
.designSelect .selectoption{display:none; position:absolute; top:100%; right:0; left:0; z-index:99; margin:0; padding:0; list-style:none; background-color:rgba(255,255,255,0.9); color:#666;}
.designSelect .selectoption li{padding:10px 10px 10px 0;}
.designSelect .selectoption li:hover{color:#fff; background:#333;}
.designSelect .selectoption li[rel="hide"]{display:none;}

/* 지난전시 */
.area_last .area_about{padding:40px; margin-bottom:30px; border:1px solid #f0f0f0; overflow:hidden;}
.area_last .area_about > .img{padding-top:30%; box-shadow:0px 0px 0px rgba(0,0,0,0);}
.area_last .area_about > .img{width:30%; margin:0;}
.area_last .area_about > .txt{width:60%; margin-left:10%;}
.area_last .area_about > .txt em{color:#85785d;}
.area_last .area_about > .txt h4{color:#444;}
.area_last .area_about > .txt i{margin:30px 0 40px 0;}

/* 이미지 목록 */
.area_imglist{position:relative; width:100%; margin-top:20px;}
.area_imglist:after{content:''; display:block; clear:both;}
.area_imglist li{float:left; display:block; width:calc(100% / 4 - 68.1px); margin:0 90px 90px 0;}
.area_imglist li a{display:block;}
.area_imglist li:nth-child(4n){margin-right:0;}
.area_imglist li a > img{width:100%;}

/* 이미지 목록 이미지 및 텍스트 */
.img02{display:block; position:relative; overflow:hidden; padding-top:100%; width:100%; text-align:center; border:1px solid #f0f0f0;}
.img02 img{position:absolute; top:0px; left:100%; height:66%; margin-left:-100%; margin-right:-100%;}
.img02:hover{opacity:0.7;}
.img02 > em,
.img02 > h4{overflow:hidden; display:block; margin:0 auto; width:80%; text-overflow:ellipsis; white-space:nowrap; font-size:14px; font-weight:400;}
.img02 > em{margin:10px auto; padding:10px; width:60%; border:2px solid #f1eee7; border-bottom-color:#dcd4c3; border-radius:5px;}
.img02 > h4{padding-bottom:25px;}

.img03{float:left; width:45%; margin-right:5%;}

/* 이미지슬라이드 list */
.area_imgslide{position:relative; margin:0 auto 30px auto; width:100%; padding:40px; border:1px solid #f0f0f0;}
.area_imgslide:after{content:''; display:block; clear:both;}
.area_imgslide .imgslide_l{float:left; width:60%; height:auto;}
.area_imgslide .imgslide_r{float:right; width:40%; height:auto; overflow:hidden;}
.area_imgslide .imgslide_l > .area_about{padding:0;}
.bxslider02{display:block; position:relative;}
.bxslider02 > li.img:hover img{transform:scale(1,1)}
.bxslider02 > li.img:hover:after{opacity:0.2;}
.bxslider02 > li .img{padding-top:100% !important;}
.bxslider02 > li img{max-width:100%; width:100%; height:490px;}
.area_imgslide .bx-viewport{height:400px !important;}
.area_imgslide .area_about .txt em{margin:20px 0 25px 0;}
.area_imgslide .area_about .txt i{margin:20px 0 40px 0;}
.area_imgslide .area_about .txt p{margin-bottom:40px;}

/* 이미지슬라이드 view */
.area_imgslide03{position:relative; margin:0 auto; width:100%; overflow:hidden;}
.area_imgslide03:after{content:''; display:block; clear:both;}
.area_imgslide03 .imgslide_top{position:relative; width:100%; height:auto;}
.area_imgslide03 .imgslide_bottom{position:relative; margin:0 auto; width:46%; height:auto;}
.area_imgslide03 .imgslide_bottom:after{content:''; display:block; clear:both;}
.area_imgslide03 .imgslide_bottom .bx-controls-direction{top:32%;}
.area_imgslide03 .imgslide_bottom .bx-controls-direction .bx-prev{margin-left:-30%;}
.area_imgslide03 .imgslide_bottom .bx-controls-direction .bx-next{margin-right:-30% !important;}
.area_imgslide03 .imgslide_top > .area_about{padding:0;}
.area_imgslide03 .area_about .txt{width:100%; margin:0 auto 40px auto;}
.bxslider03{display:block; position:relative;}
.bxslider03 > li .img{padding-top:100% !important;}
.bxslider03 > li .price{position:absolute; top:580px; padding:0 5px 30px 5px; width:100%; height:auto; text-align:center; line-height:1.6em; border-bottom:2px solid #f0f0f0; word-wrap:break-word;}
.bxslider03 > li .price > span{display:block; margin-bottom:20px; font-size:25px; font-weight:400; color:#85785d;}
.bxslider03 > li .price > em{display:block; font-size:16px; color:#666;}
.bxslider03 > li img{max-width:100%; width:100%; height:550px;}
.bxslider03 .img:hover img{transform:scale(1,1);}
.area_imgslide03 .bx-viewport{height:790px !important;}

/* 기존 스타일 변경 */
#content table.table{font-size:14px;}
#content table.table tbody th{background:#f9f7f3; border-right-color:#ccc;}
#content table.table tbody td{background:#fff;}
.bbsList.bbs02{border:1px solid #f0f0f0; border-top:2px solid #85785d;}
.bbsList.bbs02 td{padding:40px 5%; line-height:2em; color:#666; font-size:16px; font-weight:400;}
.bbsList.bbs02 td[data-table="subject"] a{display:block; font-size:23px; color:#444; line-height:1.8em; text-align:left;}
.bbsList.bbs02 td[data-table="subject"] a:after{content:'새창보기'; display:block; margin-top:20px; width:100px; height:40px; line-height:40px; border:2px solid #dcd4c4; padding-left:12px; font-size:16px; color:#9d8f71; background:url(../images/content/img_blank.png) no-repeat 90% 50%; background-size:20px auto;}
.bbsList.bbs02 td[data-table="date"]{text-align:right;}
.bbsList.bbs02 tr.active td{background:#fbf9f4;}
.area_about > .txt em,
.area_about > .txt i{font-size:18px;}
.area_about > .txt h4{font-size:30px;}
.inr > .area_about{overflow:hidden;}

@media all and (max-width:1480px){
	#container.bg01{background-position:50% 450px;}
	#content > .inr{max-width:inherit; width:94%;}
	
	.area_imglist{margin:0 auto;}
	.imgslide_l > .area_about .txt{width:94%;}
	
	.area_about + .area_info{margin-top:0px;}
}

@media all and (max-width:1200px){
	#content{min-height:400px; padding-bottom:40px;}
	#content > .inr{padding:50px 0;}
	#content h2{font-size:30px; margin:40px auto;}
	
	.area_imglist li{float:left; display:block; width:calc(100% / 4 - 24.1px); margin:0 30px 30px 0;}
	
	.img02 img{height:68%;}
}

@media all and (max-width:1199px){
	#container.bg01{background-position:50% 570px;}
	#content h2{font-size:25px;}
		
	.area_imgslide{margin:0 auto 20px auto; padding:10px 0 40px 0;}
	.area_imgslide .imgslide_l{float:inherit; width:80%; height:auto; margin:0 auto 30px auto;}
	.area_imgslide .imgslide_r{float:inherit; margin:0 auto; width:50%;}
	.bxslider02 .bx-viewport{position:absolute !important; top:50%; margin-top:-200px;}
	.bxslider02 > li > img{height:400px;}
	.area_imgslide .bx-viewport{height:400px !important;}
	
	.area_imgslide03 .imgslide_bottom .bx-controls-direction{top:25%;}
	.bxslider03 > li .price{top:440px;}
	.bxslider03 > li .price > span{font-size:20px;}
	.bxslider03 > li .price > em{font-size:14px;}
	.area_imgslide03 .bx-viewport{height:650px !important;}
	.bxslider03 > li img{height:400px;}
	
	.area_imgslide03 .imgslide_bottom{width:60%;}
	.bxslider03 > li .img{width:100%;}
	
	.img02 img{height:60%;}
	
	.area_about > .txt i,
	.area_about > .txt em{font-size:16px;}
	.area_about > .txt h4{font-size:25px;}
}

@media all and (max-width:1083px){
	#content h2{margin:30px auto 10px auto;}
	#content h5{margin:40px 0 20px 0; font-size:35px;}
	#content h5 > br{display:none;}
	
	.area_last .area_about > .img{padding-top:30%; width:100%;}
	.area_last .area_about > .img img{width:100%; height:auto;}
	.area_last.last02 .area_about > .img{margin:0 auto; padding-top:40%; width:100%;}
	.area_last.last02 .area_about > .img img{width:auto; height:100%;}

	.area_info{font-size:14px;}
	.area_info li em{float:inherit; width:inherit; margin:0px 0 10px 0; letter-spacing:0px !important; text-align:left;}
	.area_info li span{float:inherit; margin-left:0;}
	.area_about + .area_info{margin-top:-60px;}

	.area_about .conts td,
	.area_about .conts th{width:auto !important;}

	.area_about.about02 .txt{width:90%;}
	.area_about.about02 .img03{width:90%;}
}

@media all and (max-width:768px){
	#content h5{margin:30px 0 15px 0; font-size:25px;}
	
	.area_imgslide .imgslide_r{float:inherit; margin:0 auto; width:45%;}
	.bxslider02 .bx-viewport{margin-top:-125px;}
	.bxslider02 > li > img{height:250px;}
	.area_about.about02 .bxslider02 > li > img{height:auto;}
	.area_imgslide .bx-viewport{height:250px !important;}
	
	.img02 > em,
	.img02 > h4{font-size:13px;}
		
	.area_imgslide03 .imgslide_bottom .bx-controls-direction{top:18%;}
	.bxslider03 > li .price{top:240px; padding:0 5px 15px 5px;}
	.area_imgslide03 .bx-viewport{height:470px !important;}
	.bxslider03 > li img{height:220px;}
	.area_imgslide03 .imgslide_bottom{width:50%;}
	
	.img02 img{height:52%;}
	
	.area_about > .txt i,
	.area_about > .txt em{font-size:14px;}
	.area_about > .txt h4{font-size:22px;}
	.area_last .area_about{padding:30px 5%;}
	.area_last .area_about > .txt i{margin:20px 0 30px 0;}
	
	.bbsList.bbs02{font-size:14px;}
	.bbsList.bbs02 td{line-height:1.8em;}
	.bbsList.bbs02 td[data-table="subject"] a{font-size:20px;}
}

@media all and (max-width:640px){
	.bbsList.bbs02 td{padding:20px 5%;}
	.bbsList.bbs02 td[data-table="subject"]{border-bottom:0;}
	.bbsList.bbs02 td[data-table="date"]{position:relative; padding-right:8%; width:100%; text-align:right;}
	.bbsList.bbs02 tr:nth-child(2n){background:#fbf9f4;}
	.bbsList.bbs02 td[data-table="subject"] a:after{margin-top:15px; width:75px; height:35px; line-height:35px; padding-left:8px; font-size:14px; background-position:90% 50%; background-size:12px auto;}
}

@media all and (max-width:600px){
	#container.bg01{background-position:50% 550px;}
	#content > .inr{max-width:inherit; width:92%;}
	#content h2{font-size:20px;}
	
	.area_imglist{width:90%;}
	.area_imglist li{float:left; display:block; width:calc(100% / 2 - 10.1px); margin:0 20px 20px 0;}
	.area_imglist li:nth-child(2n){margin-right:0;}

	.img02 img{height:62%;}

	.area_about.about02 .txt p br{display:none;}
}

@media all and (max-width:560px){
	.area_imgslide .imgslide_r{width:50%;}
	
	.area_imgslide03 .imgslide_bottom .bx-controls-direction .bx-prev{margin-left:-35%;}
	.area_imgslide03 .imgslide_bottom .bx-controls-direction .bx-next{margin-right:-35% !important;}
	
	.bbsList.bbs02 td[data-table="subject"] a{font-size:20px;}
}

@media all and (max-width:480px){
	.area_imgslide .imgslide_r{width:75%;}
	.area_imgslide03 .imgslide_bottom{width:60%;}
	.area_imgslide03 .imgslide_bottom .bx-controls-direction .bx-prev{margin-left:-35%;}
	.area_imgslide03 .imgslide_bottom .bx-controls-direction .bx-next{margin-right:-35% !important;}
	
	.img02 img{height:55%;}
	
	.bbsList.bbs02 td[data-table="subject"] a{font-size:18px;}
	
	.area_info li span > br{display:block;}
}