@charset "utf-8";
/*** 기본 구조 ***/
.lm-widget {
  position: relative;
}
.lm-content .lm-widget-title h3 {
  display: inline-block;
}
.lm-widget .tab-menu {
  display: inline-block;
}
.title-type--hl.lm-widget .tab-menu {
  padding: 0 30px 8px 0;
  border-bottom: 2px solid;
  /* border-color: @color-grey10; */

  /* &.active{
					border-color: @color-black;
				} */

}
.title-type--hb.lm-widget .tab-menu {
  padding: 7px 15px;
  margin-right: -1px;
  border: 1px solid;
  /* border-color: @color-grey10; */

}
.title-type--vl.lm-widget .tab-menu {
  display: block;
  padding: 0 10px 30px 0;
  width: 15px;
  text-align: center;
  border-right: 2px solid;
  /* border-color: @color-grey10; */

  /* &.active{
					border-color: @color-black;
				} */

}
.title-type--vb.lm-widget .tab-menu {
  display: block;
  padding: 15px 10px;
  margin-bottom: -1px;
  width: 15px;
  text-align: center;
  border: 1px solid;
  /* border-color: @color-grey10; */

}
.lm-widget-list .lemon-style2 {
  display: inline-block;
  padding: 0 8px;
  height: 21px;
  line-height: 23px;
  border-radius: 10px 10px 10px 0;
}
.lm-widget-list .lu-info:empty {
  display: none;
}
.lm-widget-list .le-category {
  /* color: @color-link; */

  /* a{
					color: @color-link;
				} */

}
.lm-widget-list .le-category--board:empty {
  display: none;
}
.lm-widget-list .le-category--board a:nth-of-type(2)::before {
  content: ' /';
  display: inline-block;
  margin: 0 5px 0 3px;
}
.lm-widget-list .le-text {
  /* &-updated{
					color: @color-point2;
				} */

}
.lm-widget-list .le-text-new {
  display: inline-block;
  vertical-align: text-top;
  font-size: 12px;
  /* color: @color-point; */

}
.lm-widget-list .le-icon {
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-bottom: 2px;
  border-radius: 2px;
  box-sizing: border-box;
  text-align: center;
  vertical-align: text-top;
}
.lm-widget-list .le-icon .icon {
  /* .si(9px); */
  margin-top: 2px;
  text-indent: -9999px;
}
.lm-widget-list .le-icon--image {
  border: 1px solid;
  /*border-color: @color-image; */
  /* background-color: #ecf2e5; */

}
.lm-widget-list .le-icon--image .icon {
  /* .si(11px); .si-svg("image",@color-image); */
  margin-top: 1px;
}
.lm-widget-list .le-si {
  /* .si(12px); */
  vertical-align: text-top;
  /* &--thumbs-up{
					.si-svg("thumbs-up",@color-grey50);
				}
				&--image{
					.si-svg("image",@color-grey40);
					.lm-pc &{
						.si(24px);
					}
					.lm-mobile &{
						.si(20px);
					}
				} */

}
.lm-widget-list .le-comment {
  font-family: 'Hepta Slab', sans-serif;
  /* color: @color-point; */

}
.lm-widget-list .le-rank {
  display: inline-block;
  width: 21px;
  height: 21px;
  line-height: 21px;
  border-radius: 3px;
  text-align: center;
  font-family: 'Hepta Slab', serif;
  /* .has-rank--box &{
					background-color: @color-grey5;
					&--1{
						background-color: @color-best1;
					}
					&--2{
						background-color: @color-best2;
					}
					&--3{
						background-color: @color-best3;
					}
				} */

  /* .has-rank--default &{
					position: relative;
					&::after{
						content: ''; position: absolute; left: 3px; top: 3px; width: 15px; height: 15px; border-radius: 10px 5px 10px 5px; z-index: -1;
					}
					&--1::after{
						background-color: @color-best1;
					}
					&--2::after{
						background-color: @color-best2;
					}
					&--3::after{
						background-color: @color-best2;
					}
				} */

}
.lm-content .title-type--hl .lm-widget-title {
  margin-bottom: 15px;
}
.lm-content .title-type--hl .lm-widget-title h3 {
  padding: 0 30px 8px 0;
  border-bottom: 2px solid;
  /* border-color: @color-black; */

}
.lm-content .title-type--hb .lm-widget-title {
  margin-bottom: 15px;
}
.lm-content .title-type--hb .lm-widget-title h3 {
  padding: 7px 15px;
  border: 1px solid;
  /* border-color: @color-grey10; */

}
.lm-content .title-type--vl .lm-widget-title {
  position: absolute;
  left: 0;
  top: 0;
  word-break: break-all;
}
.lm-content .title-type--vl .lm-widget-title h3 {
  padding: 0 10px 30px 0;
  width: 15px;
  border-right: 2px solid;
  /* border-color: @color-black; */

}
.lm-content .title-type--vb .lm-widget-title {
  position: absolute;
  left: 0;
  top: 0;
  word-break: break-all;
}
.lm-content .title-type--vb .lm-widget-title h3 {
  padding: 15px 10px;
  width: 15px;
  text-align: center;
  border: 1px solid;
  /* border-color: @color-grey10; */

}
@media not all and (min-resolution:.001dpcm) {
  @supports @safari-hack2 {
    .lm-widget.title-type--vl .lm-widget-title h3,
    .lm-widget.title-type--vb .lm-widget-title h3 {
      line-height: 130%;
    }
  }
}
/*** 기본 ***/
.wn {
  /* .le-si--thumbs-up{
		.si-svg("thumbs-up",@color-black);
	} */

}
/*** 웹진 ***/
.ww .lu {
  position: relative;
  margin-bottom: 15px;
  padding-bottom: 15px;
  box-sizing: border-box;
  border-bottom: 1px solid;
  /* border-color: @color-grey10; */

}
.has-thumbnail.ww .lu .lu-body {
  display: table;
}
.has-thumbnail.ww .lu .lu-body > div {
  display: table-cell;
}
.ww .lu.has-rank {
  padding-left: 36px;
}
.ww .lu-info > span {
  display: inline-block;
  margin-right: 10px;
}
.ww .lu-info > span:last-of-type {
  margin-right: 0;
}
.ww .le-thumbnail {
  display: inline-block;
  position: absolute;
  top: 0;
  box-sizing: border-box;
  overflow: hidden;
}
.lm-widget.bordered-thumbnail .ww .le-thumbnail {
  border: 2px solid;
  /* border-color: @border-bold-color; */

}
.ww .le-thumbnail.no-thumbnail {
  border: 1px solid;
  /* border-color: @color-grey10; */

}
.ww .le-thumbnail .no-thumbnail-text {
  display: inline-block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  letter-spacing: 0.1em;
  /* color: @color-grey20; */

}
.ww .le-thumbnail .le-rank {
  display: inline-block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.ww .le-thumbnail-icon {
  display: inline-block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.ww .le-rank-wrap {
  position: absolute;
  left: 0;
  top: 0;
}
.ww .le-nickname .profile-image {
  margin-right: 3px;
  width: 20px;
  height: 20px;
  vertical-align: middle;
}
/*** 갤러리 ***/
.wg .lu {
  position: relative;
  overflow: hidden;
}
.wg .lu-body {
  margin-top: 10px;
}
.wg .lu-info {
  margin-top: 5px;
}
.wg .lu-info > span {
  display: inline-block;
  margin-right: 10px;
}
.wg .lu-info > span:last-of-type {
  margin-right: 0;
}
.wg .le-thumbnail {
  display: inline-block;
  width: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  box-sizing: border-box;
}
.bordered-thumbnail .wg .le-thumbnail {
  border: 2px solid;
  /* border-color: @border-bold-color; */

}
.wg .le-thumbnail.no-thumbnail {
  position: relative;
  border: 1px solid;
  box-sizing: border-box;
  overflow: hidden;
  /* border-color: @color-grey10; background-color: @color-white; */

}
.wg .le-thumbnail .no-thumbnail-bg {
  display: inline-block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  /* .si-svg("no-thumbnail",@color-grey15); */
  -webkit-mask-repeat: repeat;
  -webkit-mask-position: left top;
  -webkit-mask-size: 15px 15px;
  mask-repeat: repeat;
  mask-position: left top;
  mask-size: 15px 15px;
}
.wg .le-thumbnail-icon {
  display: inline-block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  padding: 15px 20px;
  border: 1px solid;
  /* border-color: @color-grey10; background-color: @color-white; color: @color-grey20; */
  letter-spacing: 0.1em;
}
.wg .le-category {
  margin-bottom: 5px;
}
.wg .le-category:empty {
  display: none;
}
.wg .le-summary {
  margin-top: 5px;
}
.wg .le-nickname .profile-image {
  margin-right: 3px;
  width: 20px;
  height: 20px;
  vertical-align: middle;
}
.winfo-type--hided {
  /* .profile-image{
			background-color: fade(@color-black,50%);
		}
		.underline--active{
			background-image: linear-gradient(90deg, @color-black, @color-black);
		} */

}
.winfo-type--hided .lu {
  /* &-hided-wrap{
				background-color: fade(@color-black,40%);
			}
			&-info{
				color: @color-grey15;
			} */

}
.winfo-type--hided .lu-body {
  position: absolute;
  left: 0;
  bottom: -200px;
  width: 100%;
  transition-property: bottom;
  transition-duration: 0.3s;
  z-index: 3;
}
.winfo-type--hided .lu:hover .lu-body {
  bottom: 0;
}
.winfo-type--hided .le {
  /* &-title{
				color: @color-white;
			}
			&-category{
				color: @color-grey15;
				a{
					color: @color-grey15;
				}
			}
			&-summary{
				color: @color-grey15;
			}
			&-text-new, &-comment, &-vote{
				color: @color-point
			}
			&-text-updated{
				color: @color-point2;
			} */

}
.winfo-type--hided .le-thumbnail {
  float: left;
}
.winfo-type--overlay .lu-body {
  bottom: 0;
}
/*** 박스 ***/
.wb .lu {
  vertical-align: top;
}
.has-rank--box .wb .lu,
.has-rank--default .wb .lu {
  position: relative;
  padding-left: 26px;
  box-sizing: border-box;
}
.wb .lu > div {
  position: relative;
  border: 1px solid;
  /* border-color: @color-grey10; */

}
.wb .lu-info {
  float: left;
  width: 40px;
}
.wb .lu-body {
  padding: 15px;
}
.wb .lu.has-info .lu-body {
  float: right;
  width: calc(100% - 57px);
  padding-left: 0;
  box-sizing: border-box;
}
.wb .lu.has-info .lu-body::before {
  content: '';
  position: absolute;
  left: 40px;
  top: 0;
  width: 1px;
  height: 100%;
  /* background-color: @color-grey10; */

}
.wb .lu-title {
  min-height: 76px;
}
.wb .le-rank-wrap {
  position: absolute;
  left: 0;
  top: 0;
}
.wb .le-profile {
  display: inline-block;
  height: 40px;
  border-bottom: 1px solid;
  /* border-color: @color-grey10; */

}
.wb .le-profile .profile-image {
  /* background-color: @color-white; */

}
.wb .le-profile .profile-image span {
  /* .si-svg("profile",@color-grey20); */
  -webkit-mask-size: 40% 40%;
  mask-size: 40% 40%;
}
.wb .le-date {
  display: inline-block;
  padding: 10px 0 12px 14px;
  width: 13px;
  min-height: 80px;
  text-align: center;
  word-break: break-all;
}
.wb .le-nickname {
  margin-bottom: 5px;
}
.wb .le-vote {
  position: absolute;
  right: 15px;
  top: 14px;
}
.wb .le-vote i {
  margin-top: -4px;
  vertical-align: middle;
}
.wb .le-si--thumbs-up {
  margin-top: 1px;
}
.wb .le-text-new {
  vertical-align: inherit;
}
.wb .le-board {
  margin-top: 5px;
  text-align: right;
}
.wb .le-board i {
  margin-right: 5px;
}
/*** 한 줄 댓글 ***/
.wl .lu {
  position: relative;
  margin-bottom: 4px;
  z-index: 1;
}
.wl .lu::after {
  content: '';
  position: absolute;
  left: 14px;
  top: 0;
  width: calc(100% - 14px);
  height: 30px;
  /* background-color: @color-grey3; */
  z-index: -1;
}
.wl .lu-title {
  display: inline-block;
  padding-top: 5px;
  width: calc(100% - 40px);
  box-sizing: border-box;
}
.has-date.wl .lu-title {
  width: calc(100% - 85px);
}
.has-vote.wl .lu-title {
  width: calc(100% - 85px);
}
.has-vote.has-date.wl .lu-title {
  width: calc(100% - 125px);
}
.wl .lu-title .title-group {
  display: inline-block;
  max-width: calc(100% - 20px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}
.wl .le {
  /* &-si--thumbs-up{
			.si-svg("thumbs-up",@color-black);
		} */

}
.wl .le-profile {
  display: inline-block;
  margin-right: 10px;
  vertical-align: middle;
}
.wl .le-profile .profile-image {
  width: 30px;
  height: 30px;
}
.wl .le-date {
  position: absolute;
  right: 10px;
  top: 8px;
  text-align: right;
}
.has-vote.wl .le-date {
  right: 53px;
}
.wl .le-vote {
  display: inline-block;
  position: absolute;
  right: 10px;
  top: 8px;
  width: 33px;
  text-align: right;
}
/*** swiper ***/
.swiper-content {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  /* Fix of Webkit flickering */

  z-index: 1;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  -o-transition-property: -o-transform;
  -ms-transition-property: -ms-transform;
  transition-property: transform;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
.swiper-slide {
  -webkit-flex-shrink: 0;
  -ms-flex: 0 0 auto;
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
}
/*** 복합형 슬라이더 ***/
.ws2 {
  position: relative;
  overflow: hidden;
}
.ws2 .lu {
  white-space: normal;
  vertical-align: top;
}
.ww.ws2 .lu {
  padding-bottom: 0;
  margin-bottom: 0;
  border-bottom: none;
}
.ws2 .lu-slide-thumbnail {
  white-space: nowrap;
  overflow: hidden;
  isolation: isolate;
  box-sizing: border-box;
  z-index: 1;
}
.ws2 .lu-slide-thumbnail .no-thumbnail {
  border: none;
  /* background-color: @color-grey5; */

  /* .bordered-thumbnail &{
					background-color: @color-white;
				} */

}
.ws2 .lu-slide-thumbnail ul {
  position: relative;
}
.ws2 .lu-slide-thumbnail li {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  transition-property: opacity;
  transition-duration: 0.5s;
}
.ws2 .lu-slide-thumbnail li.active {
  opacity: 1;
  z-index: 1;
}
.ws2 .lu-slide-thumbnail a {
  display: inline-block;
  width: 100%;
  height: 100%;
}
.has-thumbnail.ws2 .lu-body {
  display: table;
}
.has-thumbnail.ws2 .lu-body > div {
  display: table-cell;
}
.ws2 .lu-info {
  margin-top: 10px;
}
.ws2 .lu-info > span {
  margin-right: 15px;
}
.ws2 .le-summary {
  margin-top: 10px;
}
.header-content .ws2 .le-summary {
  margin-top: 5px;
}
.ws2 .le-text-new {
  display: inline-block;
  margin-top: 4px;
  width: 6px;
  height: 6px;
  border-radius: 3px;
  vertical-align: top;
}
.ws2 .le-category2:empty {
  display: none;
}
.ws2 .le-vote {
  font-size: 0.9em;
}
.ws2 .le-vote i {
  font-size: 0.8em;
}
.header-content .ws2 .le-title {
  font-weight: bold;
}
.ws2 .lm-widget-paging {
  position: relative;
  margin-top: -16px;
  z-index: 2;
}
.header-content .ws2 .lm-widget-paging {
  margin-top: -24px;
}
/*** 이미지 슬라이더 ***/
.ws {
  overflow: visible;
}
.ws .lu {
  box-sizing: border-box;
}
.ws .lu-slide-thumbnail .le-thumbnail-icon {
  display: inline-block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  /* color: @color-grey20; */

}
.ws .lu-slide-content {
  position: absolute;
  left: 0;
  width: 100%;
}
.ws .le {
  /* &-title{
			color: @color-white;
		} */

  /* &-summary{
			color: @color-grey15;
		}
		&-text{
			&-new{
				color: @color-point;
			}
			&-updated{
				color: @color-point2;
			}
		}
		&-comment{
			color: @color-point;
		}
		&-si--thumbs-up{
			.si("thumbs-up",@color-grey15);
		} */

}
.ws .le-category2 {
  margin-bottom: 5px;
  /* color: @color-grey15; */

}
.ws .le-category2 a {
  /* color: @color-grey15; */

}
.ws .le-category2 a:hover {
  text-decoration: underline;
}
.ws:not(.content-position--middle) .le-summary,
.ws:not(.content-position--middle) .lu-info {
  margin-top: 5px;
}
.ws .profile-image {
  margin: -1px 3px 0 0;
  width: 20px;
  height: 20px;
  /* background-color: fade(@color-black,50%); */
  vertical-align: middle;
}
.thumbnail-shape--R.content-opsition--top .lu-content {
  border-radius: 15px 15px 0 0;
}
.thumbnail-shape--R.content-opsition--bottom .lu-content {
  border-radius: 0 0 15px 15px;
}
