@charset "utf-8";

/* 새글 스킨 (latest) */
.pic_lt {position:relative;margin-bottom:20px;background:#fff}
.pic_lt .lat_title {display:block;line-height:45px;font-size:1.2em;color:#253dbe}
.pic_lt .lat_title a {color:#000;display:inline-block;position:relative}

.pic_lt .lt_more {position:absolute;top:11px;right:10px;display:block;width:25px;line-height:25px;color:#aaa;border-radius:3px;text-align:center;}
.pic_lt .lt_more:hover {color:#777}
.pic_lt ul:after {display:block;visibility:hidden;clear:both;content:""}
.pic_lt ul {margin: 0 -10px}
.pic_lt li {float:left;width:25%;padding:0 10px}
.pic_lt li.galley_li:nth-child(4n+1) {clear: both!important}
.pic_lt li .lt_img {margin:5px 0;display:block}
.pic_lt li .lt_img img, .pic_lt li .lt_img video{width:100%;height:auto}
.pic_lt li a:hover {color:#a22121}
.pic_lt li .fa-heart {color:#ff0000}
.pic_lt li .fa-lock {display:inline-block;line-height:14px;width:16px;font-size:0.833em;color:#4f818c;background:#cbe3e8;text-align:center;border-radius:2px;font-size:12px;border:1px solid #cbe3e8;vertical-align:middle}
.pic_lt li .new_icon {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#23db79;background:#b9ffda;text-align:center;border-radius:2px;margin-left:2px;font-weight:bold;vertical-align:middle}
.pic_lt li .hot_icon {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#ff0000;background:#ffb9b9;text-align:center;border-radius:2px;vertical-align:middle}
.pic_lt li .fa-caret-right {color:#bbb}
.pic_lt li .fa-download {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#daae37;background:#ffefb9;text-align:center;border-radius:2px;vertical-align:middle}
.pic_lt li .fa-link {display:inline-block;width:16px;line-height:16px;font-size:0.833em;color:#b451fd;background:#edd3fd;text-align:center;border-radius:2px;vertical-align:middle}

.pic_lt .profile_img img{border-radius:50%}

.lt_info {padding:10px 0}
.lt_info .lt_nick {}
.lt_info .lt_date {color:#888}

.pic_lt .empty_li {line-height:145px ;color:#666;text-align:center;padding:0}
.pic_lt .empty_li:before {background:none;padding:0}

.pic_lt .lt_cmt {background:#e9eff5;color:#3a8afd;font-size:11px;height:16px;line-height:16px;padding:0 5px;border-radius:3px;vertical-align:middle}
.pic_lt .lt_more {position:absolute;top:11px;right:0;display:block;width:40px;line-height:25px;color:#3a8afd;border-radius:3px;text-align:center}
.pic_lt .lt_more:hover {color:#777}

.phantom_slide_list { flex-direction: column !important; }
.phantom_gallery_slide { margin-top:50px; }

.phantom_slide_hover_title { position:absolute; bottom:0px; left:0; width:100%; background:rgba(0,0,0, 0.4); color:#fff; display:flex; opacity:1; padding:5px 10px; align-items: flex-start; flex-direction: column; justify-content: center; transition: 0.3s linear all;}
.phantom_slide_hover_title:hover {  opacity:1; transition: 0.3s linear all;}
.phantom_slide_hover_title b { font-size:11px; font-weight:400; margin:2px 0;} 


.phantom_slide_title { display:inline-block; width:100%; text-align:left; font-size:18px; color:#000 !important; font-weight:500 !important; letter-spacing:-1px; margin:10px 0;}
.phantom_slide_content { width:100%; text-align:left; font-size:14px; line-height:1.4em; color:#999; font-weight:350; letter-spacing:-1px; word-break:keep-all;}


.lt_img { position:relative; }
.phantom_slide_gallery { margin-top:10px; }
.phantom_slide_gallery .swiper-slide:nth-child(3n) { margin-right:0; }

.por_wrap { height:100%; display:flex; flex-wrap: wrap; align-items: flex-start; align-content: space-between; }
.por_wrap img { max-width:100%; height:auto !important; }
.portfolio_item { height:700px; margin-bottom:10px; border:1px solid rgba(0,0,0, 0.12); margin-left:10px; width:calc(25% - 10px); padding:20px; transition:0.3s ease all;}
.portfolio_item:nth-of-type(1+4n) { margin-left:0; }
.portfolio_item:hover { box-shadow: 0 0 28px 0 rgb(0 0 0 / 8%);transition:0.3s ease all; }
.phantom_slide_cate { background:#192260; display:inline-block; color:#fff; padding:5px 10px; border-radius:3px; font-weight:400; margin-top:10px;}

.detail_wrap { width:100%; display:flex; margin-top:15px; text-align:center; }
.detail { position:relative; border:1px solid #000; transition:0.3s ease all; font-size:14px; background:#fff; width:50%; border-right:0; display:inline-block; padding:10px; }
.detail::after { opacity:0; content:'→'; font-size:0;}
.detail:hover::after { opacity:1; transition:0.3s ease all; font-size:14px; margin-left:5px; content:'→'; }
.detail_buy { position:relative; font-size:14px; color:#fff; background:#192260; width:50%; border-right:0; display:inline-block; padding:10px; }
.detail_buy::after { opacity:0; content:'→'; font-size:0;}
.detail_buy:hover::after { opacity:1; transition:0.3s ease all; font-size:14px; margin-left:5px; content:'→'; }


.po_wrap { display:flex; margin-top:10px; flex-wrap:wrap;}

.po_wrap .phantom_option { color:#fff; display:inline-block; padding:4px 8px; border-radius:3px; }
.po_wrap .po_blue { background:#3a8afd; }
.po_wrap .po_green { background:#07af52; margin-right:5px; }
.po_wrap .po_red { background:#fd3a5e;  margin-right:5px; }

.phantom_content_detail { color:#b11fbb; line-height:1.4em; margin-bottom:10px; letter-spacing:-0.5px; font-size:13px; font-weight:400; display:inline-block; }

.phantom_price { display:flex; margin-bottom:10px; align-items: center; } 
.phantom_price i { margin:0 5px; }
.phantom_price_ori { font-size:20px; text-decoration:line-through; color:#000; letter-spacing:-1px; }
.phantom_price_cut { font-size:24px; color:red; font-weight:700; letter-spacing:-1px; }

.portfolio_item_wrap .active { position:relative; background:#fff; border:5px solid #000; }

.gradient-border {
  --borderWidth: 4px;
  background: #fff;
  position: relative;

}
.gradient-border:after {
  content: '';
  position: absolute;
  top: calc(-1 * var(--borderWidth));
  left: calc(-1 * var(--borderWidth));
  height: calc(100% + var(--borderWidth) * 2);
  width: calc(100% + var(--borderWidth) * 2);
  background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82);
  z-index: -1;
  animation: animatedgradient 3s ease alternate infinite;
  background-size: 300% 300%;
}


@keyframes animatedgradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}


@keyframes fade {
	0% {
		opacity:0;
		height:0;
		width:0;
	}
	100% {
		opacity:1;
		height:calc(100% + 10px);
		width:calc(100% + 10px);
	}
}

@media (max-width:1400px) {

.portfolio_item {width:calc(100% / 3 - 12px); height:auto; }
.por_wrap img { width:100%; }
}

@media (max-width:1024px) {
.portfolio_item {width:calc(50% - 20px); margin:10px; height:auto; }
.por_wrap img { width:100%; }

}

@media (max-width:600px) {
.portfolio_item { width:calc(100% - 20px); margin:10px; height:auto; }
.por_wrap img { width:100%; }

}
