.home-page-container {
	width:100%
}
.home-page-container .top-area {
	height:325px;
	display:flex;
	flex-direction:row;
	justify-content:space-between
}
.home-page-container .top-area .img-detail {
	background-position:50%;
	background-repeat:no-repeat;
	background-size:cover;
	height:100%;
--tw-translate-x:0;
--tw-translate-y:0;
--tw-rotate:0;
--tw-skew-x:0;
--tw-skew-y:0;
--tw-scale-x:1;
--tw-scale-y:1;
	transform:translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.home-page-container .top-area .img-detail:hover {
--tw-scale-x:1.1;
--tw-scale-y:1.1
}
.home-page-container .top-area .img-detail {
	transition-property:background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;
transition-duration:.15s;
	transition-timing-function:cubic-bezier(.4, 0, .2, 1);
transition-duration:.5s
}
.home-page-container .top-area>.left-div {
	width:570px;
	height:325px;
	border-radius:6px;
	cursor:pointer;
	overflow:hidden;
	position:relative
}
.home-page-container .top-area>.left-div .titlex1 {
	width:100%;
	height:107px;
	background:linear-gradient(180deg, transparent, #000);
	border-radius:0 0 6px 6px;
	padding-top:10px;
	padding-right:30px;
	padding-left:30px;
	position:absolute;
	bottom:0
}
.home-page-container .top-area>.left-div .titlex1>div {
	width:322px;
	font-size:20px;
	line-height:28px;
	position:absolute;
	bottom:30px;
--tw-text-opacity:1;
	color:rgba(255, 255, 255, var(--tw-text-opacity))
}
.home-page-container .top-area>.right-div {
	display:flex;
	flex-direction:column;
	justify-content:space-between
}
.home-page-container .top-area>.right-div .right-top-div {
	width:500px;
	display:flex;
	flex-direction:row;
	justify-content:space-between
}
.home-page-container .top-area>.right-div .right-top-div>.right-top-item {
	width:244px;
	height:176px;
	border-radius:6px;
	cursor:pointer;
	display:block;
	overflow:hidden;
	position:relative
}
.home-page-container .top-area>.right-div .right-top-div>.right-top-item .titlex1 {
	width:100%;
	height:79px;
	background:linear-gradient(180deg, transparent, #000);
	border-radius:0 0 6px 6px;
	padding-top:10px;
	padding-right:20px;
	padding-left:20px;
	position:absolute;
	bottom:0
}
.home-page-container .top-area>.right-div .right-top-div>.right-top-item .titlex1>div {
	width:200px;
	font-size:16px;
	line-height:24px;
	position:absolute;
	bottom:10px;
--tw-text-opacity:1;
	color:rgba(255, 255, 255, var(--tw-text-opacity))
}
.home-page-container .top-area>.right-div .right-bottom-div {
	width:500px;
	height:139px;
--tw-bg-opacity:1;
	background-color:rgba(255, 255, 255, var(--tw-bg-opacity));
	border-radius:6px;
	cursor:pointer;
	padding:1.25rem
}
.home-page-container .top-area>.right-div .right-bottom-div .user-info1 {
	display:flex;
	flex-direction:row;
	align-items:center;
--tw-text-opacity:1;
	color:rgba(120, 120, 120, var(--tw-text-opacity))
}
.home-page-container .top-area>.right-div .right-bottom-div .user-info1 img {
	width:26px;
	height:26px;
	margin-right:10px;
	border-radius:50%
}
.home-page-container .top-area>.right-div .right-bottom-div .titlex1 {
	width:100%;
	margin-top:10px;
	font-weight:700;
	overflow:hidden;
--tw-text-opacity:1;
	color:rgba(82, 82, 82, var(--tw-text-opacity));
	text-overflow:ellipsis;
	white-space:nowrap
}
.home-page-container .top-area>.right-div .right-bottom-div .desc {
	font-size:14px;
	line-height:20px;
--tw-text-opacity:1;
	color:rgba(185, 185, 185, var(--tw-text-opacity));
	word-break:break-all
}
.home-page-container>.home-main-area {
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	margin-top:30px
}
.home-page-container>.home-main-area .feed-list-area {
	width:778px
}
.home-page-container>.home-main-area .side-bar-area {
	width:282px
}
.home-page-container .sticky-top-area {
	top:76px;
	position:fixed;
	width:282px
}
.side-bar-item-component.popular-container[data-v-0dfe1800] {
--tw-bg-opacity:1;
	background-color:rgba(255, 255, 255, var(--tw-bg-opacity));
	border-radius:6px;
	font-size:14px;
	line-height:20px;
	line-height:1;
	padding:20px;
	position:relative;
--tw-text-opacity:1;
	color:rgba(82, 82, 82, var(--tw-text-opacity));
	min-height:200px
}
.side-bar-item-component.popular-container .popular-title[data-v-0dfe1800] {
	display:flex;
	align-items:flex-end;
	justify-content:space-between;
	font-size:16px;
	line-height:24px;
--tw-text-opacity:1;
	color:rgba(50, 50, 50, var(--tw-text-opacity))
}
.side-bar-item-component.popular-container .popular-title>h3[data-v-0dfe1800] {
	font-weight:700;
	height:1rem;
	line-height:1
}
.side-bar-item-component.popular-container .popular-title>a[data-v-0dfe1800] {
height:.875rem;
	font-size:14px;
	line-height:20px;
	line-height:1;
--tw-text-opacity:1;
	color:rgba(19, 128, 240, var(--tw-text-opacity))
}
.side-bar-item-component.popular-container .popular-title .arrow[data-v-0dfe1800] {
	transform:rotate(90deg)
}
.side-bar-item-component.popular-container .popular-list[data-v-0dfe1800] {
	padding-top:20px;
	position:relative
}
.side-bar-item-component.popular-container .popular-list .list-item[data-v-0dfe1800] {
--tw-border-opacity:1;
	border-color:rgba(242, 242, 242, var(--tw-border-opacity));
	border-bottom:1px rgba(242, 242, 242, var(--tw-border-opacity));
	border-style:dashed;
	display:flex;
	align-items:flex-start;
	font-size:14px;
	line-height:20px;
	margin-top:10px;
	padding-bottom:10px;
--tw-text-opacity:1;
	color:rgba(82, 82, 82, var(--tw-text-opacity))
}
.side-bar-item-component.popular-container .popular-list .list-item .num[data-v-0dfe1800] {
	line-height:1.5rem;
	font-style:normal;
	flex:0 0 22px
}
.side-bar-item-component.popular-container .popular-list .list-item .num._0[data-v-0dfe1800] {
--tw-text-opacity:1;
	color:rgba(220, 38, 38, var(--tw-text-opacity))
}
.side-bar-item-component.popular-container .popular-list .list-item .num._1[data-v-0dfe1800] {
--tw-text-opacity:1;
	color:rgba(245, 158, 11, var(--tw-text-opacity))
}
.side-bar-item-component.popular-container .popular-list .list-item .num._2[data-v-0dfe1800] {
--tw-text-opacity:1;
	color:rgba(251, 191, 36, var(--tw-text-opacity))
}
.side-bar-item-component.popular-container .popular-list .list-item .feed-title[data-v-0dfe1800] {
	flex:1 1 0%;
	line-height:1.5rem;
	letter-spacing:.05em
}
.side-bar-item-component.popular-container .popular-list .list-item[data-v-0dfe1800]:last-of-type {
	border-width:0
}
