/* spheader */
#spheader,
.sp-banner,
.footer-banner,
div.sidecate-index-sp,
#modal {
	display:none;
}
#modal {
	overflow:auto;
}
#modal ul.submenu {
	list-style: none outside none;
	text-align:left;
}
#modal ul.submenu li {
	height:35px;
	width:235px;
	background-image:url(/images/global/sp_menu_linklist.gif);
	background-position:left top;
	background-repeat:no-repeat;
	margin:2px 0 0 0;
}
#modal ul.submenu li a {
	display:block;
	margin:0 0 0 30px;
	height:35px;
	width:205px;
	color: #000;
	text-decoration:none;
}

#pageslide {
    /* These styles MUST be included. Do not change. */
    display: block;
    position: fixed !important;
   	position: absolute;
    top: 0;
    z-index: 999999;
    padding:5px;
    
    /* Specify the width of your pageslide here */
    width: 235px;
    height:100%;
    overflow:auto;
    
    /* These styles are optional, and describe how the pageslide will look */
    background-color: #efefef;

}

p.close {
	text-align:right;
}

p.close img {
	width:36px;
	height:36px;
}
	
/************************************************************************************
under 640
*************************************************************************************/
@media screen and (max-width: 640px) {

	/* body */
	body {
		min-width:320px;
		margin:0;
		-webkit-text-size-adjust: none;
	}
	
	/* img */
	img {
		width:100%;
	}
	
	/* header */
	#header {
		display:none;
	}
	
	/* spheader */
	#spheader {
		display:block;
		width:100%;
		height:68px;
		text-align:left;
		position: fixed !important;
    	position: absolute;
    	top: 0;
	    left: 0;
	    z-index:10;
	    background-color: #fff; 
	}
	
	/* logo */
	#spheader div#logo {
	  float: left;
	  height:30px;
	  padding-bottom:5px;
	}
	
	/* logo img */
	#spheader div#logo img {
	  width:auto;
	  height: 30px;
	}
	
	/* menu */
	#spheader div#menu {
	  float: right;
	  height:30px;
	  width:50px;
	}
	
	/* spmenu */
	#spheader .spmenu li {
		float:left;
		list-style: none outside none;
		width:100px;
		padding-bottom:5px;
	}
	#spheader .spmenu li.request {
		margin:0 5px 0 0;
	}
	
	#top-main-rap,
	#catevisual {
		margin-top:68px;
	}
	
	/* footer-innerbox */
	#footer-innerbox {
  		width: 100%;
  		margin:0;
	}
	/* footerlink */
	.footerlink {
		display:none;
	}
	/* footerdl */
	div.footerdl {
  		width: 100%;
	}
	#footer-innerbox2 {
 		background-color: #641818;
  		height: auto;
  		margin: 0;
	}
	div.footerdl img {
  		display:none;
	}
	div.footerdl p {
		float:none;
 		display:block;
 		width:96%;
 		padding:2%;
 		height:37px;
	}

	/* top-main-rap */
	#top-main-rap {
		/*display:none;*/
		width:100%;
		height:auto;
	}
	.top-main-guide img {
		width:auto;
	}
	/* #facultyarea */
	#facultyarea {
		width:100%;
	}
	#facultyarea li {
  		height: auto;
  		margin: 0 1% 0 0;
  		width: 24%;
	}
	#facultyarea li.faculty4 {
  		margin: 0;
	}

	/* container */
	#container {
  		padding: 0;
  		width: 100%;
	}
	/* top-body */
	#top-body {
  		float: none;
  		width: 100%;
	}
	/* top-news */
	.top-news {
  		width: 100%;
	}
	/* top-news dl dt */
	.top-news dl dt {
  		float: none;
  		margin: 0;
	}
	ul.top-ul-more li{
		padding-right:0;
	}
	/* ul.top-ul-more */
	ul.top-ul-more {
  		/*right: 0;
  		left:auto;
  		top: 5px;*/
  		margin-top:-7%;
		padding-bottom:2%;
	}
	ul.top-ul-more li img{
		width:90px;
	}
	/* aboutbox */
	.aboutbox {
		display:none;
	}
	
	/* side */
	#side {
  		float: none;
  		width: 100%;
  		margin-top:20px;
	}
	
	div.sidecate-index {
  		display:none;
  		/*width:235px;
  		margin:0 auto;*/
	}
	
	div.sidecate-index-sp {
  		width:100%;
  		text-align:center;
  		padding:10px 0;
  		color:#ffffff;
  		background-color:#FF5B02;
  		display:block;
	}
	
	div.sidecate-index-sp img {
		width:11px;
		height:11px;
		margin: -3px 10px 0 0;
		padding:0;
		vertical-align:middle;
		display:inline;
	}
	
	ul.sidemenu {
		display:none;
		/*width:235px;*/
		width:100%;
  		margin:0 auto 20px;
  		border:none;
	}
	
	.side-banner,
	.side-banner1 {
		display:none;
	}
	
	/* sp-banner */
	ul.sp-banner {
		display:block;
		list-style: none outside none;
		margin: 0 0 10px 0;
	}
	ul.sp-banner li {
		float:left;
		margin: 0 2% 0 0;
		width: 49%;
	}
	ul.sp-banner li.last {
		margin:0;
	}
	
	.footer-banner {
	    /*background-color: #FFE984;*/
	    margin: 5px auto 20px;
	    padding: 5px 10px;
	    display:block;
	    width:225px;
	    position:relative;
	}
	.footer-banner div.carousel {
	    float: left;
	    margin: 1px 0 0;
	    width:225px;
	}
	.footer-banner ul {
	    float: left;
	    list-style: none outside none;
	}
	.footer-banner ul.left-btn {
	    margin: 0 11px 0 0;
	}
	.footer-banner ul.right-btn {
	    margin: 0 0 0 4px;
	}
	.footer-banner ul.roop {
	    list-style: none outside none;
	}
	.footer-banner ul.roop li {
	    float: left;
	    /*margin: 0 7px 0 0;*/
	    margin:0;
	    width:225px;
	    height:134px;
	}
	.footer-banner img {
	    display: block;
	    margin: 0;
	    padding: 0;
	}
	
	.footer-banner img.normal {
	    margin: 32px 0;
	}
	
	.footer-banner img.request {
	    margin: 17px 0;
	}
	
	.footer-banner img.message {
	    margin: 27px 0;
	}

	/* #catevisual */
	#catevisual {
  		/*display:none;*/
  		width:100%;
  		margin:68px auto 0;
	}
	/* body */
	#body {
  		float: none;
  		width: 98%;
  		padding:0;
  		margin:0 auto;
	}
	/* ul.cate-index-left ul.cate-index-right */
	ul.cate-index-left,
	ul.cate-index-right {
  		float: none;
  		width: 100%;
	}
	ul.cate-index-left li,
	ul.cate-index-right li {
	  margin: 0 10px;
	  padding: 0 0 5px 12px;
	}
	
	/*-------left-right-------*/
	#body .left200{
		width:28%;
	}
	#body .left400{
		width:56%;
	}
	#body .right495{
		width:69%;
	}

	#body .left495{
		width:69%;
	}
	#body .right200{
		width:28%;
	}
	#body .right300{
		width:42%;
	}
	#body .left_half,
	#body .right_half,
	#body .left151,
	#body .right163
	{
		float:none;
		width:100%;
	}
	
	#body .left151 {
		text-align:center;
	}
	
	#body .left151 img {
		width: 151px;
	}
	
	#map_canvas {
	  height: 200px;
	  width: 100%;
	}
	
	img.telemail {
		width:156px;
	}
		
	/*** clear fix ****/
	.spmenu:after,
	ul.sp-banner:after {
		content: " ";
		display: block;
		height: 0;
		visibility: hidden;
		clear: both;
	}
	.spmenu,
	ul.sp-banner {
		display: inline-block;
	}
	.spmenu,
	ul.sp-banner {
		display: block;
	}
	/*** clear fix ****/
}

/************************************************************************************
under 480
*************************************************************************************/
@media screen and (max-width: 480px) {
	/* #facultyarea */
	#facultyarea {
		width:100%;
	}
	#facultyarea li {
  		height: auto;
  		margin: 0 2% 0 0;
  		width: 48%;
	}
	#facultyarea li.faculty2,
	#facultyarea li.faculty4 {
  		margin: 0;
	}
}