@media only screen and (max-width: 420px){
	td{
		display: block;
		width: 100%;
	}
	.beta{
		width: 55px;
		height: 55px;		
		left: 365px;
		top: -18px;			
	}		

}

@media only screen and (max-width: 700px) {
	#mobile_menu_button{
		background-image: url('/frame/student/img/mmenu.png');
		background-size: 100% 100%;
		background-position: center center;
		background-repeat: no-repeat;
		position: fixed;
		top: 20px;
		right: 20px;
		z-index: 1100;
		height: 48px;
		width: 48px;
		cursor: pointer;
	}
	.mobh{
		display: none;
	}
	
	#frame_wrapper,
	#frame_header,
	#frame_footer
	{
		width: 100%;
		background-size: cover;
	}
	#frame_header{
		height: 48px;
		background-position: top center;
		top: 0;
		left: 0;
	}
	#frame_header_inner{
		padding-bottom: 5px;
	}
	.text_left,
	.text_right
	{
		width: 37.5%;
		vertical-align: middle;
	}
	.text_middle{
		width: 25%;
		vertical-align: middle;
	}
	#frame_left_col {
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		height: 100%;
		background: #F5F9FA;
		z-index: 1005;
		margin-top: 0;
		padding-top: 50px;
		padding-bottom: 50px;
		overflow-y: scroll;
		width: 0;
	}
	div.frame_left_box{
		padding-bottom: 100px;
	}
	div.frame_left_box ul li{
		padding: 15px;
	}
	#content{
		padding-left: 15px;
		padding-right: 15px;
		padding-bottom: 30px;
	}
	#frame_right_col {
		width: 100%;
		float: none;
	}
	
	#dimmer{
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(0,0,0,0.8);
		z-index: 1000;
	}
	#loginbox_controlcontainer td{
		display: block !important;
		width: 100% !important;
	}
	
	#loginbox{
		width: 100%;
	}
	#login_body{
		padding: 20px;
	}
	#loginbox_controlcontainer{
		width: 100%;
	}
	#loginbox_controlcontainer table tr td{
		display: table-cell !important;
		width: 200px !important;
	}
	#loginbox input{
		width: 100% !important;
		font-size: 13pt;
	}
	#loginbox select{
		width: 100%;
		margin-bottom: 10px;
	}
        
        .test_header_2{
            height: 43px !important;
        }
        
        .test_header_2 .question_datas{
            display: block;
            float: none !important;            
        }
        
        .test_header_2 .time_frame{
            display: block;
            float: none !important;
        }
        
        .test_header_2 .time_frame #time_frame{
            width: 60px !important;
        }
        
        .test_body .test_question_answers .essay .answer{
            min-width: 200px !important;
            width: calc(100% - 10px) !important;
        }    
        
	.beta{
		width: 55px;
		height: 55px;		
		left: calc(100% - 37px);		
		top: -18px;			
	}	
}

.fixed{
	position: fixed;
}

@media only screen and (max-width: 1000px) and (min-width: 701px) {

	
	#frame_wrapper,
	#frame_header,
	#frame_footer
	{
		width: 700px;
		background-size: cover;
	}
	.text_left,
	.text_right
	{
		width: 230px;
		vertical-align: middle;
	}
	.text_middle{
		width: 200px;
		vertical-align: middle;
	}
	#frame_left_col {
		width: 200px;
	}
	#frame_right_col {
		width: 480px;
	}
        
        .test_header_2{
            height: 43px !important;
        }
        
        .test_header_2 .question_datas{
            display: block;
            float: none !important;            
        }
        
        .test_header_2 .time_frame{
            display: block;
            float: none !important;
        }
        
        .test_header_2 .time_frame #time_frame{
            width: 60px !important;
        }
        
        .test_body .test_question_answers .essay .answer{
            min-width: 430px !important;
        }            
                
	.beta{
		left: 139px;
		top: -6px;		
	}
}