body { 
}
#articles{
	padding-top:150px;
	background: url(../img/article_bg.jpg) no-repeat center / cover;
	min-height:100%
}
#articles .top{
	text-align:center
}
#articles .top h2{
	font-size:80px;
	line-height:80px;
	font-weight:bold;
	position:relative;
	display:inline-block;
	text-align:left;
	margin-left:-250px
}
#articles .top h2 span{
	font-style:italic
}
#articles .top h2 img{
	position:absolute;
	top:50%;
	left:100%;
	transform:translateY(-50%);
	width:250px
}
#articles .items{
	margin-top:50px
}
#articles .items a{
	display:block;
	position:relative;
	text-decoration:none;
	color:#fff
}
#articles .items a .container {
	padding-left:115px;
	position:relative
}
#articles .items a .container .txt{
	padding:15px 0;
	border-bottom:solid 1px #fff;
	position:relative
}
#articles .items a .img{
	position:absolute;
	bottom:0;
	left:0;
	width:100px;
	height:150px;
	display:none;
}
#articles .items a .img img{
	width:100%;
	height:100%;
	object-fit:contain;
	object-position:bottom center
}
#articles .items a span{
	position:absolute;
	top:15px;
	right:0;
	background:#e54880;
	color:#fff;
	border-radius:15px;
	padding:5px 15px;
	font-weight:bold;
	font-size:12px
}
#articles .items a h6{
	font-weight:bold;
	margin:0
}
#articles .items a p{
	margin:0
}
#articles .items a:hover{
	border-bottom:solid 1px #fff;
	background:#f77289
}
#articles .items a:hover .container .txt{
	border-bottom:none
}
#articles .items a:hover .img{
	display:block
}

#article_view{
	background: url(../img/article_bg.jpg) no-repeat center / cover;
	padding-top:150px
}
#article_view .ctn{
	padding-top:50px
}
#article_view .img{
	position:relative;
	overflow:hidden
}
#article_view .img img{
	width:100%
}
#article_view h2{
	font-size:80px;
	line-height:80px;
	font-weight:bold;
}
#article_view h2 span{
	font-style:italic
}
#article_view h5{
	font-weight:bold;
	color:#ca2766;
	 margin-top:30px
}
#article_view .right{
}
#article_view .txtscroll{
	 overflow:auto;
	 overflow-x:hidden;
	 padding-right:30px
}
#article_view .txtscroll::-webkit-scrollbar {
    width:3px;
}
 
#article_view .txtscroll::-webkit-scrollbar-track {
    background:#F87497; 
	width:5px
}
#article_view .txtscroll::-webkit-scrollbar-thumb {
    background:#ca2766; 
}
#article_view .txt{
	 column-count: 2;
	 column-gap:15px;
	 margin-top:15px;
}
#article_view .btn{
	background:none;
	outline:none;
	border:none;
	box-shadow:none;
	border-radius:30px;
	background:#e6527d;
	color:#fff;
	font-weight:bold;
	padding:10px 15px
	
}
@media only screen and (min-width: 1920px) and (orientation: landscape) {
}
@media only screen and (orientation: portrait) {
	#articles{
		padding-top:100px
	}
	#articles .top h2{
		font-size:36px;
		line-height:36px;
		margin-left:-90px
	}
	#articles .top h2 div{
		position:relative;
		z-index:5
	}
	#articles .top h2 img{
		width:120px;
		margin-left:-30px;
		z-index:1
	}
	#articles .items a .container .txt{
		padding-right:115px
	}
	#articles .items a .container{
		padding-left:15px
	}
	
	#article_view{
		padding-top:90px
	}
	#article_view .ctn{
		padding-top:0
	}
	#article_view h2{
		font-size:50px;
		line-height:50px;
	}
	#article_view h5{
		text-align:center;
		font-size:16px;
		margin-top:15px
	}
	#article_view .txt{
		column-count:1;
		font-size:12px;
		margin-top:0
	}
	#article_view .btn{
		font-size:12px
	}
}