/*
|----------------------------------------------------------------------
|       Media Queries
|----------------------------------------------------------------------
*/

@media screen and (min-width: 992px) and (max-width: 1200px) {
	/*_____ All Site _____*/
	.owl-carousel.owl-theme .owl-nav .owl-prev {
		left: -15px;
	}
	.owl-carousel.owl-theme .owl-nav .owl-next {
		right: -15px;
	}
	/*_____ Home _____*/
	#genres .flexRow > .col {
		width: 50%;
	}
	footer .flexRow {
		flex-flow: wrap;
	}
	footer .flexRow > .col:nth-last-child(1) {
		flex: none;
		width: 100%;
		min-width: initial;
	}
	/*_____ Common _____*/
	#help .flexRow > .col {
		width: 33.3334%;
	}
	#fyp .flexRow > .col {
		width: 25%;
	}
	#manga .flexRow > .col {
		width: 50%;
	}
	#friends .flexRow > .col {
		width: 33.3334%;
	}
	#list .flexRow > .col1 {
		width: 66%;
	}
	#list .flexRow > .col2 {
		width: 34%;
	}
	#profile .flexRow > .col1 {
		width: 64%;
	}
	#profile .flexRow > .col2 {
		width: 36%;
	}
	#profile .proBlk .icoBlk {
		flex-flow: column;
		align-items: center;
		text-align: center;
	}
	#profile .proBlk .title {
		margin: 10px 0;
	}
	#profile .proBlk .icoBlk .rating,
	#profile .proBlk .icoBlk .bTn {
		justify-content: center;
	}
	#profile .proBlk .ico {
		margin-left: auto;
		margin-right: auto;
	}
	#profile .itmRow > .col {
		width: 50%;
	}
	#community .frndLst > li {
		width: 25%;
	}
}

@media screen and (max-width: 1200px) {
	/*_____ Navigation _____*/
	.toggle {
		display: flex;
	}
	nav {
		justify-content: flex-end;
		margin-left: 0;
		margin-right: 75px;
	}
	[nav] {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		display: flex;
		flex-flow: column;
		width: auto;
		margin: 0;
		padding: 40px 50px 20px;
		opacity: 0;
		visibility: hidden;
		overflow: auto;
		z-index: 3;
	}
	[nav].active {
		opacity: 1;
		visibility: visible;
	}
	[nav] > ul {
		width: 100%;
		flex-flow: wrap;
		margin: 0;
	}
	[nav] > ul > li {
		width: 100%;
		padding: 0;
		text-align: center;
	}
	[nav] > ul > li .webBtn {
		margin-top: 5px;
	}
	[nav] > #cta {
		margin: auto 0 0;
	}
	nav > #iconBtn > li#srchBtn {
		display: inline-block;
	}
	header .query {
		display: none;
		position: fixed;
		top: 80px;
		left: 0;
		right: 0;
		padding: 10px 15px;
		box-shadow: 0 5px 5px rgb(0 0 0 / 7%);
	}
	header .query.active {
		display: block;
	}
	header .query > button {
		margin-left: 15px;
	}
	.modeBtn {
		position: absolute;
		right: 15px;
	}
	/*_____ Common _____*/
	[detail] {
		padding-right: 60px;
	}
	[detail] .head .iconLst {
		position: fixed;
		top: 60px;
		right: 0;
		bottom: 0;
		width: 60px;
		height: auto;
		flex-flow: column;
		align-items: center;
		justify-content: center;
		margin: 0;
		box-shadow: 0 15px 15px rgb(0 0 0 / 7%);
	}
	[detail] .head .dropCnt {
		position: fixed;
		top: 60px;
		left: 0;
		right: 60px;
		bottom: 0;
		max-width: none;
		max-height: none;
		border-radius: 0;
		box-shadow: none;
	}
	#detail .social {
		left: auto;
		display: flex;
		flex-flow: column;
		justify-content: center;
		margin-right: 0;
	}
	#detail #comment {
		left: 100%;
		right: -100%;
		width: auto;
		padding: 15px;
	}
	#detail #comment.active {
		left: 0;
		right: 60px;
	}
	#detail #comment .crosBtn {
		top: 0;
		right: 0;
	}
}

@media screen and (max-width: 991px) {
	/*_____ All Site _____*/
	.owl-carousel.owl-theme .owl-nav .owl-prev {
		left: -15px;
	}
	.owl-carousel.owl-theme .owl-nav .owl-next {
		right: -15px;
	}
	.contain-fluid,
	footer .contain-fluid,
	#profile .contain-fluid,
	#community .contain-fluid {
		padding: 0 15px;
	}
	/*_____ Home _____*/
	#owl-slider .content {
		display: none;
	}
	#genres .flexRow > .col {
		width: 50%;
	}
	footer {
		padding-top: 60px;
	}
	footer h5 {
		margin-bottom: 20px;
	}
	footer .flexRow {
		flex-flow: wrap;
	}
	footer .flexRow > .col {
		flex: none;
		width: 100%;
		min-width: initial;
	}
	.copyright {
		margin-top: 30px;
	}
	.copyright .inner {
		align-items: center;
		flex-flow: column;
		text-align: center;
	}
	.copyright p {
		margin: 0 0 10px;
	}
	footer .smLst {
		justify-content: center;
	}
	/*_____ Common _____*/
	#overview .flexRow {
		flex-flow: wrap;
	}
	#overview .flexRow > .col {
		width: 100%;
	}
	#overview .ico {
		width: auto;
		height: auto;
		border-radius: 10px;
	}
	#blocks .flexRow > .col {
		width: 100%;
	}
	#future .flexRow > .col {
		width: 100%;
	}
	#affiliate .flexRow > .col {
		width: 50%;
	}
	#videos .flexRow > .col {
		width: 50%;
	}
	[logon] .logo {
		width: 120px;
		filter: none;
	}
	#logon {
		flex-flow: column-reverse;
		justify-content: center;
		padding: 20px 15px;
	}
	#logon > .sideBlk {
		padding: 0;
		background: transparent !important;
	}
	#logon > .sideBlk:before {
		display: none;
	}
	#logon > .logBlk {
		width: 100%;
		min-width: initial;
		max-width: 480px;
		padding: 0;
	}
	#business .flexRow {
		flex-flow: wrap;
	}
	#business .flexRow > .col {
		width: 100%;
	}
	#works .flexRow > .col {
		width: 50%;
	}
	#help .flexRow > .col {
		width: 50%;
	}
	#fyp .flexRow > .col {
		width: 33.3334%;
	}
	#community .flexRow > .col {
		width: 100%;
	}
	#manga .flexRow > .col {
		width: 50%;
	}
	/*_____ Dashboard _____*/
	#dash {
		padding-top: 20px;
	}
	#dash .topBlk {
		flex-flow: wrap;
	}
	#dash .topBlk .blk {
		width: 100%;
	}
	#dash .topBlk .icoBlk {
		margin: 0 0 20px;
	}
	#dash .flexRow > .col {
		width: 50%;
	}
	#friends .flexRow > .col {
		width: 50%;
	}
	#list .flexRow > .col {
		width: 100%;
	}
	#profile .flexRow > .col {
		width: 100%;
	}
	#profile .frndLst > li,
	#community .frndLst > li {
		width: 10%;
	}
}

@media screen and (max-width: 767px) {
	/*_____ All Site _____*/
	h1 {
		font-size: 36px;
	}
	h2 {
		font-size: 28px;
	}
	h3 {
		font-size: 20px;
	}
	/*_____ Home _____*/
	#owl-slider,
	#owl-slider .inner {
		height: 400px;
		background-position: center bottom;
	}
	.forumBlk {
		display: table;
		width: 100%;
	}
	.forumBlk > .icoBlk {
		display: table-cell;
		width: 70px;
		max-width: 70px;
		border-right: 20px solid transparent;
		vertical-align: top;
	}
	.forumBlk > .txt {
		margin-right: 0 !important;
		margin-bottom: 5px;
	}
	.forumBlk > .txt ~ div {
		width: auto;
		min-width: initial;
	}
	.forumBlk > .txt ~ .reply,
	.forumBlk > .txt ~ .views,
	.forumBlk > .txt ~ .posts,
	.forumBlk > .txt ~ .type {
		display: inline-flex;
	}
	.forumBlk > .txt ~ .reply,
	.forumBlk > .txt ~ .views,
	.forumBlk > .txt ~ .posts {
		flex-flow: row-reverse;
		align-items: center;
	}
	.forumBlk > .txt ~ .reply > small,
	.forumBlk > .txt ~ .views > small,
	.forumBlk > .txt ~ .posts > small {
		width: 18px;
		min-width: 18px;
		height: 18px;
		background-position: center;
		background-size: contain;
		background-repeat: no-repeat;
		margin-right: 5px;
		filter: brightness(0) invert(0.6);
		text-indent: 100px;
		overflow: hidden;
	}
	.forumBlk > .txt ~ .reply > small {
		background-image: url("../images/icon-reply.svg");
	}
	.forumBlk > .txt ~ .views > small {
		background-image: url("../images/icon-eye.svg");
	}
	.forumBlk > .txt ~ .posts > small {
		background-image: url("../images/icon-pencil-edit.svg");
	}
	.forumBlk > .txt ~ .thread {
		display: none;
	}
	.forumBlk > .txt ~ .bTn {
		margin-top: 10px;
	}
	/* .forumBlk > .txt + div {
		margin-left: 70px;
	} */
	#fyp .flexRow > .col {
		width: 50%;
	}
	#create .outer {
		flex-flow: column;
	}
	#create .outer > .icoBlk {
		width: 100%;
		min-width: initial;
		max-width: 260px;
		margin: 0 auto 20px;
	}
	#create .upLoadBlk .imgLst > li {
		width: 50%;
	}
	[inbox] .barBlk {
		width: 100%;
		min-width: initial;
	}
	[inbox] .chatBlk {
		display: none;
		position: fixed;
		top: 80px;
		left: 0;
		right: 0;
		bottom: 0;
		height: auto;
		z-index: 32;
	}
	[inbox] .chatBlk.active {
		display: flex;
	}
	[inbox] .chatPerson .backBtn {
		display: block;
	}
	#profile .frndLst > li,
	#community .frndLst > li {
		width: 12.5%;
	}
	#profile .proBlk .icoBlk {
		flex-flow: column;
		align-items: center;
		text-align: center;
	}
	#profile .proBlk .title {
		margin: 10px 0;
	}
	#profile .proBlk .icoBlk .rating,
	#profile .proBlk .icoBlk .bTn {
		justify-content: center;
	}
	#profile .proBlk .ico {
		margin-left: auto;
		margin-right: auto;
	}
	#profile .itmRow > .col {
		width: 50%;
	}
}

@media screen and (max-width: 580px) {
	/*_____ col-xx-? _____*/
	.col-xx-12 {
		width: 100%;
	}
	.col-xx-11 {
		width: 91.6667%;
	}
	.col-xx-10 {
		width: 83.3334%;
	}
	.col-xx-9 {
		width: 75%;
	}
	.col-xx-8 {
		width: 66.6667%;
	}
	.col-xx-7 {
		width: 58.3334%;
	}
	.col-xx-6 {
		width: 50%;
	}
	.col-xx-5 {
		width: 41.6667%;
	}
	.col-xx-4 {
		width: 33.3334%;
	}
	.col-xx-3 {
		width: 25%;
	}
	.col-xx-2 {
		width: 16.6667%;
	}
	.col-xx-1 {
		width: 8.3334%;
	}
	/*_____ Home _____*/
	#genres .flexRow > .col {
		width: 100%;
	}
	#affiliate .flexRow > .col {
		width: 100%;
	}
	/*_____ Common _____*/
	#videos .flexRow > .col {
		width: 100%;
	}
	#works .flexRow > .col {
		width: 100%;
	}
	#help .flexRow {
		margin: -10px;
	}
	#help .flexRow > .col {
		width: 100%;
		padding: 10px;
	}
	#manga .flexRow > .col {
		width: 100%;
	}
	/*_____ Dashboard _____*/
	#dash .flexRow > .col {
		width: 100%;
	}
	#dash .topBlk .icoBlk {
		flex-flow: column;
		align-items: center;
		text-align: center;
	}
	#dash .topBlk .icoBlk .ico {
		margin: 0 auto 20px;
	}
	#dash .topBlk .icoBlk .bTn {
		justify-content: center;
	}
	[data-popup="members"] .frndLst > li {
		width: 25%;
	}
	[detail] .head .title {
		position: static;
		float: right;
		max-width: 200px;
		text-align: right;
		margin-left: 20px;
	}
	[detail] .head .title .rateYo {
		margin-right: 0;
	}
}

@media screen and (max-width: 480px) {
	/*_____ col-xx-? _____*/
	.col-xx-12,
	.col-xx-11,
	.col-xx-10,
	.col-xx-9,
	.col-xx-8,
	.col-xx-7,
	.col-xx-6,
	.col-xx-5,
	.col-xx-4,
	.col-xx-3,
	.col-xx-2,
	.col-xx-1 {
		width: 100% !important;
	}
	/*_____ All Site _____*/
	.topHead {
		flex-flow: column;
	}
	.topHead > .heading + * {
		align-self: flex-start;
		margin-top: 10px;
	}
	.topHead > .miniBtn {
		width: 100%;
		margin-left: 0;
	}
	.topHead > .miniBtn select {
		margin-left: auto;
	}
	.topHead .bTn,
	.topHead .bTn > .webBtn {
		width: 100%;
	}
	/*_____ Common _____*/
	#dash .blkLst > li strong {
		font-size: 40px;
	}
	#friends .flexRow > .col {
		width: 100%;
	}
	#list .chapterLst > li {
		width: 100%;
	}
	#list .topBlk > .image {
		padding-bottom: 60%;
	}
	.info > strong > em {
		display: none;
	}
	.notiBlk > .inner .txt {
		flex-flow: wrap;
	}
	.notiBlk > .inner .time {
		width: 100%;
	}
	[inbox] .buble {
		width: 100%;
	}
	#profile .frndLst > li,
	#community .frndLst > li {
		width: 20%;
	}
	#profile .itmRow > .col {
		width: 100%;
	}
}

@media screen and (max-width: 380px) {
	/*_____ All Site _____*/
	h1 {
		font-size: 32px;
	}
	h2 {
		font-size: 26px;
	}
	/*_____ Home _____*/
	nav > #iconBtn > li#chatBtn {
		display: none;
	}
	#future .blk {
		flex-flow: column;
	}
	#future .blk .icon {
		margin: 0 0 10px;
	}
	/*_____ Common _____*/
	[typical] #sBanner .txtGrp > .webBtn {
		display: none;
	}
	#fyp .inner > .txt h5 {
		margin-bottom: 0;
	}
	#fyp .inner > .txt p {
		display: none;
	}
	#profile .frndLst > li,
	#community .frndLst > li {
		width: 25%;
	}
	[data-popup="members"] .frndLst > li {
		width: 33.3334%;
	}
}

@media screen and (max-width: 320px) {
	/*_____ Home _____*/
	nav > #iconBtn > li#srchBtn {
		display: none;
	}
	#dash .blkLst {
		flex-flow: wrap;
	}
	#dash .blkLst > li {
		flex: none;
		width: 100%;
	}
	#profile .frndLst > li,
	#community .frndLst > li {
		width: 33.3334%;
	}
	#fyp .flexRow > .col {
		width: 100%;
	}
}

/*
|----------------------------------------------------------------------
|       Media Queries Height
|----------------------------------------------------------------------
*/

@media screen and (max-height: 420px) {
}

@media screen and (min-height: 768px) {
}

@media screen and (min-height: 1040px) {
}