
.topMemberLogin { color: #000000; }

.nameMember{ color: #333; }

.topMenu { position: fixed; top: 0; left: 0; right:0; height:45px; padding:0px 0px 0px 15px; z-index:56; }
.topMenu .active { color: #000000; background-color:#DDD !important; }

.topLogo_network{ width:160px !important; /*height:65px !important; */ margin-top:2px !important; }

.topLogoOne { float: left; margin-left:10px; height:55px; }
.topLogoTwo { float: left; display: none; }

/*----------------------------------------- Top Menu Story ----------------------------------------------*/

.topIconPostMenu, .topPostDetail, .topSearchDetail { float: left; opacity: 1 !important; }

.topIconPostMenu { margin-top: 13px; margin-left: 40px; }

.topPostDetail, .topSearchDetail { cursor: pointer; position: relative; }

.topSearchDetail { margin-left: 15px; }

.classIconDetail { font-size: 2em; color: #333 !important; }

.activeSearch { color: #EEE !important; }

.classIconDetail:hover { color: #EEE !important; }

.topPostDetail:hover, .topSearchDetail:hover { opacity: 1; }

.contentSearchNow { float: left; width: 100%; position: absolute; top: 48px !important; left: 0; padding-left: 20px; padding-right: 20px; }

.classIconBox { 
	position: absolute; 
	width: 22px; 
	height: 22px; 
	top: 25px !important;  
	left: 0; 
	z-index: 1; 
	background: url(https://www.koom.me/plugin/comment/graphic/talk-002.png) no-repeat; 
	display: none; 
}

/*----------------------------------------- Top Menu Story ----------------------------------------------*/

/*----------------------------------------- Top Menu ----------------------------------------------*/

.topMenuArea{ color:#000; position: absolute; font-family:'kanit-bold'; font-size: 1.4em; margin-top: 55px; width: 100%; /*height: 100%;*/ }
#menuTop1 { display: none; margin-top: -10px; background-color: #EEE; }
#im { height: 20px; width: 20px; margin-top: -5px; font-size: 1em; }
.menu1 { padding:0; margin:0; list-style: none; position: relative; }
.menu1 .listMenuOne { margin: -1px 0; width: auto; border-bottom: 1px dashed #333; }
.menu1 .listMenuTwo { margin: -1px 0; width: auto; border-bottom: 1px dashed #333; }
.menu1 .listMenuThree { margin: -1px 0; width: auto; border-bottom: 1px dashed #333;}
.action1 { height:55px; cursor:pointer; display:block; padding:15px 20px; text-decoration:none; position: relative; }
.action1:hover { background-color: #EEE; transition-duration: 0.3s; color:#000; }
#ul1-1 #ul1-2  { display: none; position: relative; width: 100%; }
#ul1-2 #ul1-3  { display: none; position: relative; width: 100%; }
.menu1 .listMenuOne:hover { transition-duration: 0.3s; background: #EEE; color:#000; }
.menu1 .listMenuTwo:hover { transition-duration: 0.3s; background: #EEE; color:#000; }
.menu1 .listMenuThree:hover { transition-duration: 0.3s; background: #EEE; color:#000; }
.menu1 .listMenuOne .menu1 .listMenuOne:hover { transition-duration: 0.3s; background: #749ed8; color:#000; }
.menu1 .listMenuTwo .menu1 .listMenuTwo:hover { transition-duration: 0.3s; background: #749ed8; color:#000; }
.menu1 .listMenuThree .menu1 .listMenuThree:hover { transition-duration: 0.3s; background: #749ed8; color:#000; }
.menu1 .menu1 .listMenuOne { position: relative; }
.menu1 .menu1 .listMenuTwo { position: relative; background-color:#EEE; }
.menu1 .menu1 .listMenuThree { position: relative; background-color:#EEE; }
.menu1 .menu1 .menu1 .listMenuOne { position: relative; }
.menu1 .menu1 .menu1 .listMenuTwo { position: relative; }
.menu1 .menu1 .menu1 .listMenuThree { position: relative; }
/*.form0 { padding: 10px 30px !important; }*/
.form1 { margin-left: 40px; }
.form2 { margin-left: 80px; }
.arrowMenu1 { margin-left: 10px; top: 4px !important; }
.arrowMenu2 { margin-left: 10px; }
.textName1 { display: inline-block; margin-top: 3px; margin-left: 10px; }
.textName2 { display: inline-block; width: 70%; margin-left: 10px; }
.textName3 { display: inline-block; width: 70%; margin-left: 10px; }
.classIconRight { margin-left: 40px; }
.iconMenu { margin-right: 15px; font-size: 1.3em; top: 13px !important; position: absolute !important; }


/* ความกว้าง ไม่ต่ำกว่า 700px*/
@media screen and (min-width: 700px)
{
	.topMenuArea{ color:#333; }
	.topMenu { height:55px; }
	.topMenu .active { height:55px; }
	.topLogoOne { height:65px; }
}


/*-------------------------------------- ความกว้าง ไม่ต่ำกว่า 800px --------------------------------------*/
@media all and (min-width : 800px) {
	.topMenuArea{ float: left; position: unset; margin-left: 20px; margin-top: 0; width: auto; height: auto; }
	#menuTop1 { display: block; margin-top: 0px; background-color: unset; font-size: 0.8em; }
	.menu1 { float: left; padding:0; margin:0; list-style: none; position: relative; width: auto; }
	.menu1 .listMenuOne { margin: 0px; display:inline-block; float: left; border-bottom: none; }
	.menu1 .listMenuTwo { margin: 0px; display:inline-block; float: left; border-bottom: none; }
	.menu1 .listMenuThree { margin: 0px; display:inline-block; float: left; border-bottom: none; }
	.action1 { padding:14px 15px 0px 15px; }
	#ul1-1 #ul1-2 { display: none; position: absolute; top: 55px; border: none; }
	#ul1-2 #ul1-3 { display: none; position: absolute; top: 56px; border: none; }
	#ul1-1 .listMenuOne:hover > #ul1-2 { display:block; }
	#ul1-1 .listMenuTwo:hover > #ul1-2 { display:block; }
	#ul1-1 .listMenuThree:hover > #ul1-2 { display:block; }
	#ul1-2 .listMenuOne:hover > #ul1-3 { display:block; }
	#ul1-2 .listMenuTwo:hover > #ul1-3 { display:block; }
	#ul1-2 .listMenuThree:hover > #ul1-3 { display:block; }
	.menu1 .menu1 .listMenuOne { width:300px; float:none; display:list-item; position: relative; }
	.menu1 .menu1 .listMenuTwo { width:300px; float:none; display:list-item; position: relative; }
	.menu1 .menu1 .listMenuThree { width:300px; float:none; display:list-item; position: relative; }
	.menu1 .menu1 .menu1 .listMenuOne { position: relative; top:-56px; left:300px; }
	.menu1 .menu1 .menu1 .listMenuTwo { position: relative; top:-56px; left:300px; }
	.menu1 .menu1 .menu1 .listMenuThree { position: relative; top:-56px; left:300px; }
	.form1 { margin-left: 0; }
	.form2 { margin-left: 0; }
	.textName1 {  }
	.textName2 { width: auto; }
	.textName3 { width: 85%; }
}
/*-------------------------------------- ความกว้าง ไม่ต่ำกว่า 768px --------------------------------------*/
@media all and (min-width : 768px) {
	.topLogoOne { margin-left:auto; }
	.topLogoTwo { display: block; }
}
/*--------------------------------------- ความกว้าง ไม่ต่ำกว่า 1500px  -------------------------------------*/
@media all and (min-width : 1500px) {
	#menuTop1 { font-size: 1em; }
	.action1 { padding:14px 30px 0px 30px; }
}
/*---------------------------------------- END Top Menu --------------------------------------------*/


/*----------------------------------------- Top Menu Story ----------------------------------------------*/

@media all and (min-width : 700px) {
	.topSearchDetail { margin-left: 20px; }
}

@media all and (min-width : 1000px) {
	.contentSearchNow { width: 300px; top: 51px !important; left: 10%; padding-left: 0px; padding-right: 0px; }
}
/*----------------------------------------- Top Menu Story ----------------------------------------------*/