@charset "utf-8";

.wrap_photo{word-break:break-all;height:100%;display:flex;align-items:center;width:1780px;left:50%;margin-left:-790px;}

/*타이틀*/
.wrap_photo .side_a{width:30%;}
.wrap_photo .side_a h3{font-family: 'Play', sans-serif;line-height:1;font-size:45px;}
.wrap_photo .side_a h3 span{font-weight:700;}
.wrap_photo .side_a p{font-family: 'Play', sans-serif;font-size:18px;word-break:keep-all;}
.wrap_photo .side_a p::before{content:"";display:block;width:25px;height:1px;background:#222;margin:20px 0;}
/*게시판*/
.wrap_photo > ul{width:65%;}
.wrap_photo > ul > li{}
/*타이틀*/
.wrap_photo .title{display:none;}
.wrap_photo .title a{}
/*목록*/
.wrap_photo .list{height:460px;position:relative;}
.wrap_photo .list ul{}
.wrap_photo .list ul li{}
/*noData*/
.wrap_photo .list .nodata{font-size:18px;text-align:center;padding:30px 0;width:100%}
/*링크*/
.wrap_photo a.subject{}
.wrap_photo .con{}
/*썸네일*/
.wrap_photo .thumb{width:720px;height:400px;overflow:hidden;display:flex;justify-content:center;align-items:center;background:#000;position:relative;}
.wrap_photo .thumb img{width:100%;}
.wrap_photo .fig{display:none;}
.wrap_photo .fig strong{}
.wrap_photo .fig span{}
.wrap_photo .deco{display:none;}
/*컨텐츠*/
.wrap_photo .inner{display:none;}
/*제목*/
.wrap_photo .subjectText{position:absolute;left:5%;bottom:20px;font-size:20px;color:#FFF;width:90%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
/*내용*/
.wrap_photo .content{display:none;}
/*날짜*/
.wrap_photo .date{display:none;}
/*더보기*/
.wrap_photo .more{justify-content:center;align-items:center;width:200px;height:60px;border:1px solid #660a5f;position:absolute;left:0;top:calc(50% + 100px);}
.wrap_photo .more span{display:none;}
.wrap_photo .more i{color:#660a5f;font-size:12px;font-family: 'Play', sans-serif;letter-spacing:1px;font-weight:700;}
/*활성화*/
.wrap_photo .list,
.wrap_photo .more{display:none}
.wrap_photo > ul > li.active .list{display:block}
.wrap_photo > ul > li.active .more{display:flex}
.wrap_photo > ul > li.active .title a{}
/*콘트롤*/
.wrap_photo .control{display:flex;justify-content:center;align-items:center;position:absolute;bottom:0;right:50%;margin-right:-110px;}
.wrap_photo .control button{text-indent:-9999px;display:inline-block;width:40px;height:34px;}
.wrap_photo button.play,
.wrap_photo button.stop{display:none;}
.wrap_photo button.on{display:inline-block;}
.wrap_photo button.play{background:url(../images/play_w.png) center no-repeat;}
.wrap_photo button.stop{background:url(../images/pause_w.png) center no-repeat;}
.wrap_photo button.prev{background:url(../images/prev_w.png) center no-repeat;}
.wrap_photo button.next{background:url(../images/next_w.png) center no-repeat;}
/*사이드*/
.wrap_photo .sideCon{position:absolute;top:0;right:-333px;width:720px;height:400px;}
.wrap_photo .sideCon .pic{height:100%;background:#000;overflow:hidden;}
.wrap_photo .sideCon .pic img{width:100%;}
.wrap_photo .sideCon .sideFig{}
.wrap_photo .sideCon .sideFig strong{}
.wrap_photo .sideCon .sideFig span{}

@media only screen and (max-width:1600px){
	.wrap_photo{width:1780px;left:2%;margin-left:0;}
}
@media only screen and (max-width:1280px){
	.wrap_photo{width:96%;justify-content:space-between;}
	.wrap_photo .side_a h3{font-size:35px;}
	.wrap_photo .side_a p{font-size:16px;}
	.wrap_photo .thumb{width:100%;}
	.wrap_photo .more{width:140px;height:40px;}
	.wrap_photo .control{right:0;margin-right:0;}
	.wrap_photo .sideCon{display:none;}
}
@media only screen and (max-width:768px){
	.wrap_photo{flex-wrap:wrap;}
	.wrap_photo .side_a,
	.wrap_photo > ul{width:100%;}
	.wrap_photo .side_a{margin-bottom:15px;}
	.wrap_photo .side_a h3{font-size:25px;}
	.wrap_photo .side_a p{margin-top:5px;}
	.wrap_photo .side_a p::before{display:none;}
	.wrap_photo .list{height:auto;}
	.wrap_photo .thumb{height:auto;}
	.wrap_photo .subjectText{text-align:center;}
	.wrap_photo .more{width:100%;height:40px;border:0;border-bottom:2px solid #660a5f;position:relative;left:auto;top:auto;}
	.wrap_photo .control{bottom:calc(50% - 20px);width:100%;}
	.wrap_photo .control button{position:absolute;bottom:50%;}
	.wrap_photo button.on{display:none;}
	.wrap_photo button.prev{left:10px;}
	.wrap_photo button.next{right:10px;}
}


/*HOVER************************************************************/
@media only screen and (min-width:1281px){
	.wrap_photo a.subject:hover .thumb img{transform:scale(1.1);transition: all 0.5s cubic-bezier(0.2, 0, 0.3, 1);}
	.wrap_photo .more:hover{background:#660a5f;}
	.wrap_photo .more:hover i{color:#FFF;}

}