/* tabMenu */
#tabMenuArea { border-bottom: 4px solid #000000; }
#tabMenuArea .tabMenu{ color: #777; border-left:#BBB dashed 1px; border-top:#BBB dashed 1px; border-right:#BBB dashed 1px; }
#tabMenuArea .menuActive { background-color: #000000; color: #FFFFFF; border-left:none; border-top:none; border-right:none; border-bottom: 1px solid #000000; }

#memberSectionApp .listAppSection:hover { opacity: 0.9; }
#memberSectionApp .listAppSection .titleSection { color: #000000; }
#memberSectionApp .listAppOther { border: 1px dashed #000000; }   
#memberSectionApp .loadContentNew { color: #000000; }
#memberSectionApp .iconSection { color: #000000; }
#memberSectionApp .iconSection:hover { background: rgba(255, 255, 255, 0.46); color: #000000; }

.memberSectionAppBottom .memberSectionCart { color: #FFFFFF; }
.memberSectionAppBottom .notificationCart { background-color:green; color: #FFFFFF; }
.memberSectionAppBottom .memberSectionListOrder { color: #FFFFFF; }
.memberSectionAppBottom .memberSectionPrice { color: #FFFFFF; }

#modalSettingMenu .menuModalLeft { color:#000000; border-bottom:1px #000000 solid; }
#modalSettingMenu .menuModalLeft:hover { background: rgba(255, 255, 255, 0.46); }

#modalMenu .menuModalLeft { color:#000000; }
#modalMenu .menuModalLeft:hover { background: rgba(255, 255, 255, 0.46); }


/* userMenu*/
.userMenu { width:100%; left:0%; position:fixed; z-index:67; display:none; padding:10px; overflow:hidden; overflow-x: hidden; }
.userMenuClose { position:absolute; right:6px; top:6px; width:25px; height:25px; overflow:hidden; background:url(https://www.koom.me/graphic/icon/delete-3-2.png) no-repeat center center; cursor:pointer; opacity:0.5; }
.userMenuClose:hover { background:url(https://www.koom.me/graphic/icon/delete-3-1.png) no-repeat center center; opacity:1; }

/* tabMenu */
#tabMenuArea { margin-bottom: 10px; overflow: hidden; }
#tabMenuArea .tabMenu{ clear: none; float: left; overflow: hidden; font-size: 1.5em; line-height: 1; padding: 10px 15px 6px 15px; margin-right: 10px; width: calc( 25% - 7.5px ); text-align:center; font-family: 'tsn-bold'; cursor:pointer; }
#listAreaMenu { height:100%; overflow-y:hidden; overflow-x:hidden; margin-bottom: 10px; }
.memberSectionAppBottom { float: left; bottom: 0; position: absolute; right: 0; left: 0; height: 50px; }
.memberSectionAppBottom .memberSectionCart { margin-top:12px; margin-left:20px; font-size:1.8em; float:left; cursor:pointer; }
.memberSectionAppBottom .notificationCart { position:absolute; z-index:2; font-size:0.7em; padding:1px 7px 1px 7px; border-radius: 50%; left:30px; top:0; font-family: 'kanit'; font-weight: bold; }
.memberSectionAppBottom .memberSectionListOrder { margin-top:17px; margin-left:10px; font-size:1.7em; float:left; font-family: 'tsn-bold'; cursor: pointer; }

#memberSectionApp { margin-top:0px; font-family: 'tsn-normal'; }
#memberSectionApp .detailLeft { width:100%; clear:both; }
#memberSectionApp .detailRight { width:100%; clear:both;  }
#memberSectionApp .listAppSection { line-height:1.2; margin-bottom:10px; position: relative; cursor:pointer; width:30%; margin-right:10px;  float:left; right:0;}   
#memberSectionApp .listAppSection .contentSection { overflow:hidden; }
#memberSectionApp .listAppSection .iconSection { width:100%;  float:left; overflow:hidden; margin-right:15px; }
#memberSectionApp .listAppSection .titleSection { font-size:1em; }
#memberSectionApp .listAppSection .exSection { font-size:1.2em; }
#memberSectionApp .listAppOther { line-height:1.2; margin-bottom:10px; position: relative; cursor:pointer; width:30%; margin-right:10px; float:left; right:0; }   
#memberSectionApp .listAppOther .iconSection { width:100%; float:left; overflow:hidden; bottom:0; height:88px; position: relative; }
#memberSectionApp .listAppOther .iconText{ position: absolute; top: 5px; left: 8px; font-size:1.5em; font-weight: bold; }
#memberSectionApp .listAppOther .iconArrow{ position: absolute; top: 35px; left: 0; width: 100%; text-align: center; }
#memberSectionApp .listAppOther .iconArrow img{ width: 45px; }
#memberSectionApp .loadContentNew { cursor:pointer; }

#modalSettingMenu .menuModalLeft { font-size:1.4em; line-height:1; padding:12px; cursor:pointer; width:100%; }
#modalSettingMenu .menuMemberList { font-family: 'tsn-bold'; font-size:1.4em; line-height: 1; }

#modalMenu .menuModalLeft { line-height:1; padding:8px; cursor:pointer; width:31%; float: left; margin: 3px; text-align: center; height: 90px; }
#modalMenu .menuMemberList { font-size:1.2em; font-family: 'tsn-bold'; }
#modalMenu .menuMemberIcon { width: 100%; font-size: 2.7em; margin-bottom: 8px; }
.iconService { background-image: url(https://www.koom.me/graphic/icon/icon-service.png); width: 100%; height: 35px; float: left; clear: both; background-repeat: no-repeat; background-position: center; background-size: 35px; }


/* ความกว้าง ไม่ต่ำกว่า  500px */
@media screen and (min-width: 360px)
{
	#memberSectionApp .listAppOther .iconSection { height:100px; }
}

/* ความกว้าง ไม่ต่ำกว่า  500px */
@media screen and (min-width: 500px)
{
	.userMenu { left:initial; right:0%; width:400px; }
	#memberSectionApp .detailLeft { width:400px; }
	/*#memberSectionApp .listAppOther .iconSection { height:120px; }*/
}

/* ความกว้าง ไม่ต่ำกว่า 700px */
@media screen and (min-width: 600px)
{
	
	.userMenu { left:initial; right:0%; width:400px; }
	.userMenuClose { right:8px; top:8px; }
	#tabMenuArea .tabMenu { font-size: 1.7em; }
	.memberSectionAppBottom .memberSectionListOrder { margin-top:15px; font-size:2em; }
	#memberSectionApp .listAppOther .iconArrow img{ width: 70px; margin-top: 5px; }
	#memberSectionApp .listAppSection .titleSection { font-size:1.8em; width:auto; }
	#memberSectionApp .listAppSection .exSection { font-size:1.3em; }
	#memberSectionApp .listAppOther .iconSection {  height:119px; }
	#memberSectionApp .listAppOther .iconText{ font-size:28px; }
	.menuModalLeft .menuMemberList { font-size:1.3em; }
	.menuMemberIcon { font-size: 2.8em; }
}

/* ความกว้าง ไม่ต่ำกว่า 700px */
@media screen and (min-width: 1200px)
{
	
	.userMenu { left:initial; right:0%; width:400px; }
	.userMenuClose { right:8px; top:8px; }
	#memberSectionApp .detailLeft { overflow:hidden; clear:none; float:left; margin-bottom:0px; }
}

/* ความกว้าง ไม่ต่ำกว่า  1600px */
@media screen and (min-width: 1600px)
{
	
	.userMenu { left:initial; right:0%; width:400px; }
	.userMenuClose { right:10px; top:10px; }
}




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