@charset "UTF-8";

/* index */

#index{
	width:100%;
}

#index h2{
	font-size:41px;
	color:#005ead;
	font-weight:400;
	margin:0;
	padding:0;
	text-align: center;
	line-height:1.2;
}
#index h3{
	margin:0 0 0 0;
	padding:0;
	text-align: center;
}
#index h4{
	font-size:41px;
	font-weight:400;
	margin:0;
	padding:0 0 20px 0;
	text-align: center;
	line-height:1.2;
}

#index #whatsnew #whats h5{
	color:#333;
	font-size:14px;
	border-bottom:1px solid #333;
	text-align:left;
}

#index h6{
	color:#333;
	font-size:14px;
	margin: 0 0 15px 0;
	padding:0;
	line-height:1.25;
	position: relative;
	text-align: center;
	font-weight:400;
}
#index h6:before {
	border-top: 1px solid #333;
	content: "";
	position: absolute;
	top: 42%;
	left: 0;
	width: 100%;
}
#index h6 span {
	background-color: #f5f5f5;
	display: inline-block;
	padding:0 10px;
	position: relative;
}


/* slider */
#index #slide{
	margin-bottom:20px;
}

/* main */
#index #main{
	width: 960px;
	margin: 0 auto 10px auto;
	text-align: left;
	clear:both;
}
#index #main p.main_caption{
	font-size:15px;
	text-align: center;
	margin:0;
	padding:0;
}


/* kodawari4 */
#index #kodawari4{
	width: 960px;
	margin: 0 auto 30px auto;
	clear:both;
}
#index #kodawari4 .width480{
	width:480px;
	height:250px;
	line-height:1;
	margin:0;
	padding:0;
	float:left;
	display:inline;
}
#index #kodawari4 .width48per{
	width:48%;
	margin:0 1%;
	float:left;
}

#index #kodawari4 .width48per img{
	width: 100%;
	height: auto;
}


/* can */
#index #can{
	width: 100%;
	min-height:880px;
	margin: 0 auto 30px auto;
	clear:both;
	background:url(../img/index/can.png) repeat center top;
	padding:40px 0;
	text-align: center;
	color:#fff;
}
#index #can #cancontents{
	width: 960px;
	margin: 0 auto 0 auto;
	text-align: left;
}

#index #can #cancontents p{
	text-align: center;
	padding-bottom:20px;
	font-size:13px;
}

#index #can #cancontents #canMenu{
	width:626px;
	float:left;
	margin:0 0 30px 167px;	
	display:inline-block;
}

#index #can #cancontents #canMenu li{
	width:206px;
	height:206px;
	margin:0 4px 4px 0;
	padding:0;
	display:inline;
	float:left;
}
#index #can #cancontents #canMenu li:nth-child(3n){
	margin:0 0 4px 0;
}



/* Recruit */
#index #recruit{
	width: 730px;
	margin: 0 auto 20px auto;
	padding:50px 0;
	clear:both;
}



/* whatsnew */
#index #whatsnew{
	width: 730px;
	margin: 0 auto 30px auto;
	padding:50px 0;
	clear:both;
}

#index #whatsnew #whats{
	width:400px;
	margin:0px 0 0 0px;
	float:left;
}

#index #whatsnew #whats #news{
	width:400px;
	height:200px;
	margin: 0;
	padding:10px 0 0 0;
	position:relative;
	overflow: auto;
	font-size:9px;
	text-align: left;
}

#index #whatsnew #whats #news dt{
	width: 60px;
	margin: 0px 0px 5px 0px;
	padding:0 0 0 0;
	float: left;
	clear:both;
	position:relative;
	color:#000;
	font-weight:700;
}

#index #whatsnew #whats #news dd {
	margin: 0px 0px 5px 60px;
	position:relative; 
	overflow:hidden;
	text-align: left;
}

#index #whatsnew #bnn_area {
	width:280px;
	margin:25px 0px 0 0;
	padding:0px;
	float:right;
}

#index #whatsnew #bnn_area ul{
padding: 0;
}
#index #whatsnew #bnn_area li{
	line-height: 1.2;
	margin-bottom:3px;
	display:block;
	text-align:left;
}
#index #whatsnew #bnn_area li img{
	margin-bottom:2px;
}


/* project */
#index #project{
	width: 730px;
	margin: 0 auto 30px auto;
	padding:50px 0;
	clear:both;
}
#index #project #projects{}
#index #project #projects li{
	display:inline;
	margin:0 5px;
}

@media screen and (max-width: 640px) {

/* index
--------------------------------------------------------------------------------------*/
#index {
	margin:0;
	padding:0;
}

#index h2{
	font-size:1.5rem;
	text-align:center;
	margin:0 0 2% 0;
}
#index h3{
	width:70%;
	margin:0 15% 0 15%;
	padding:0;
}
#index h4{
	font-size:1.5rem;
	margin:0 0 1% 0;
}

#index #whatsnew #whats h5{
	font-size:1.5rem;
	margin:0 0 2% 0;
}

#index #project,
#index #main,
#index #kodawari4{
	width:90%;
	margin:0 5% 10% 5%;
	padding:0;
}

#index #main p.main_caption{
	text-align: left;
}


/* kodawari4 */
#index #kodawari4 .width480,
#index #kodawari4 .width48per{
	width:100%;
	height:auto;
	margin: 0;
	padding:0;
	display:block;
	float:none;
}
	#index #kodawari4 .width48per img{
		margin-top: 1%;
		margin-bottom: 1%;
	}

/* can */
#index #can{
	width:100%;
	min-height:auto;
	margin:0 !important;
	padding:0 !important;
	clear:both;
	background-size:cover;
	text-align: center;
}
#index #can #cancontents{
	width:90% !important;
	margin: 10% 5% !important;
}
#index #can #cancontents p{
}

#index #can #cancontents #canMenu{
	width:96% !important;
	margin:2% !important;
	padding:0;
	display:inline;
	float:left;
}

#index #can #cancontents #canMenu li,
#index #can #cancontents #canMenu li:nth-child(3n){
	width:48% !important;
	height:auto;
	margin:0 1% 1% 1% !important;
	padding:0;
	display:inline;
	float:left;
}





/* Recruit */
#index #recruit{
	margin: 5%;
}


/* whatsnew */
#index #whatsnew{
	width:90%;
	margin: 0 5% 10% 5%;
	padding:0;
}
#index #whatsnew #whats{
	width:100%;
	margin:0;
	float:none;
}

#index #whatsnew #whats #news{
	width:100%;
	margin: 0px 0 5% 0;
}

#index #whatsnew #whats #news dt{
	width: auto;
	float: none;
}

#index #whatsnew #whats #news dd {
	margin: 0px 0px 3% 0;
}


#index #whatsnew #bnn_area {
	width:100%;
	margin:0 0 0 0;
	padding:0px;
	float:none;
}

#index #whatsnew #bnn_area ul{
}
#index #whatsnew #bnn_area li{
}

}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {}