@charset "utf-8";

/* clearfix */
.cf{
	zoom: 1;
}
.cf:before, .cf:after{
	content: "";
	display: table;
}
.cf:after{
	clear: both;
}

/* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_
全デバイス共通のスタイルとスマートフォンおよび小型タブレット向けレイアウトの指定
/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

/*==================================================
body
====================================================*/

body{
	width: 100%;
	background-color: #fff;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #000;
	font-size: 16px;
}

a{
	color: #000;
	text-decoration: underline;
}

a:hover{
	color: #000;
	text-decoration: underline;
}

.marker{
	color: #052f79;
}

.kaig{
	display: none;
}

.em{
	color: #ff0000;
	font-weight: bold;
}


/*==================================================
header
====================================================*/

header{
	border-top: solid 5px #000000;
	margin-bottom: 30px;
}

header #header-in h1, header #header-in .logo{
	text-align: center;
}

header #header-in h1 img, header #header-in .logo img{
	width: 90%;
	max-width: 300px;
	margin-top: 15px;
}

header #header-in p.tel{
	display: none;
}

/*==================================================
nav
====================================================*/
nav#nav ul#menu{
	display: none;
}

nav#nav ul#menu li{
	width: 100%;
	background-color: #dbe6f9;
	text-align: center;
	border-bottom: solid 1px #ffffff;
	line-height: 2;
}

nav#nav ul#menu li a{
	display: block;
	width: 100%;
	padding: 7px 0 3px 0;
	color: #052f79;
	text-decoration: none;
}

nav#nav div#toggle{
	display: block;
	position: relative;
	width: 100%;
}

nav#nav div#toggle a{
	display: block;
	position: relative;
	padding: 10px 0 10px 35px;
	text-align: left;
	text-decoration: none;
	background: url(../img/menu_icon.png) center left no-repeat;
}

/*==================================================
topimg
====================================================*/

#topimg {
	height: 500px !important;
}

#topimg p img{
	display: block;
	position: absolute;
	left: 20px;
	bottom: 20px;
	width: 80%;
}

/*==================================================
topnews
====================================================*/

#topnews{
	background: #6fbbf7 url(../img/news_bg_mb.jpg) left top no-repeat;
	background-size: 100% auto;
	padding-top: 50%;
}

#topnews #topnewsin{
	width: 90%;
	margin: 0 auto;
}

#topnews #topnewsin article{
	margin: 15px;
	line-height: 1.5;
	color: #052f79;
}

#topnews #topnewsin article h3{
	border-bottom: dotted 1px #052f79;
	margin-bottom: 5px;
}

#topnews #topnewsin article div a{
	color: #052f79;
}

#topnews #topnewsin #tophistory{
	padding: 10px;
	text-align: right;
	border-top: solid 1px #0f44a2;
}

#topnews #topnewsin #tophistory a{
	color: #052f79;
}


/*==================================================
topcopy
====================================================*/
#topcopy{
	padding: 15px;
}

#topcopy img{
	width: 100%;
	max-width: 770px;
}


/*==================================================
footer
====================================================*/

footer{
	background-color: #666666;
	border-top: solid 3px #ffffff;
	color: #ffffff;
	line-height: 1.5;
}

footer .logo{
	text-align: center;
	padding: 15px;
}

footer .address{
	padding: 0 15px 15px 15px;
}

footer .address a{
	color: #ffffff;
}

footer .logo img{
	width: 100%;
	max-width: 300px;
}

footer #cor{
	background-color: #000000;
	padding: 5px;
}

/****************************************
page-top
*****************************************/
#page-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	font-size: 20px;
}
#page-top a {
	background: #052f79;
	text-decoration: none;
	color: #ffffff;
	width:40px;
	height:40px;
    line-height: 40px;
	text-align: center;
	display: block;
	border: solid 1px #ffffff;
    border-radius: 50%;
	filter:alpha(opacity=4);
	-moz-opacity:0.4;
	-khtml-opacity: 0.4;
	opacity:0.4;
}
#page-top a:hover {
	text-decoration: none;
	background: #052f79;
}



/* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_
メディアクエリによる切り替え
/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

/* PC向けおよび大型タブレット向けのレイアウトの指定：769px～1240px */
@media only screen and (min-width: 769px){
	
	.kaig{
		display: block;
	}

	/* header */
	
	header{
		margin-bottom: 15px;
	}
	
	header #header-in{
		margin-top: 15px;
	}
	
	header #header-in h1, header #header-in .logo{
		width: 50%;
		float: left;
		text-align: left;
		margin-left: 15px;
	}
	
	header #header-in h1 img, header #header-in .logo img{
		margin-top: 5px;
	}
	
	header #header-in p.tel{
		display: block;
		width: 40%;
		float: right;
		text-align: right;
		margin-right: 15px;
		margin-top: 8px;
	}
	
	/* nav */
	nav#nav div#toggle{
		display: none;
	}
	
	nav#nav ul#menu{
		display: block;
		background: url(../img/menu/menu_bg.png) left top repeat-x;
		margin-top: 5px;
	}
	
	nav#nav ul#menu li{
		background: none;
		float: left;
		width: 16.5%;
		height: 60px;
		text-indent: -9999px;
		border-right: solid 1px #24457c;
		border-bottom: none;
	}
	
	nav#nav ul#menu li.last{
		border-right: none;
	}
	
	nav#nav ul#menu li#contact{
		border: none;
	}
	
	nav#nav ul#menu li a{
		display: block;
		color: #666666;
		width: 100%;
		height: 100%;
		margin: 0;
		padding: 0;
	}
	
	nav#nav ul#menu li#m_top a:link{
		background: url(../img/menu/menu01.png) top center no-repeat;
	}
	
	nav#nav ul#menu li#m_top a:hover{
		background: url(../img/menu/menu01.png) bottom center no-repeat;
	}
	
	nav#nav ul#menu li#m_company a:link{
		background: url(../img/menu/menu02.png) top center no-repeat;
	}
	
	nav#nav ul#menu li#m_company a:hover{
		background: url(../img/menu/menu02.png) bottom center no-repeat;
	}
	
	nav#nav ul#menu li#m_career a:link{
		background: url(../img/menu/menu03.png) top center no-repeat;
	}
	
	nav#nav ul#menu li#m_career a:hover{
		background: url(../img/menu/menu03.png) bottom center no-repeat;
	}
	
	nav#nav ul#menu li#m_recruit a:link{
		background: url(../img/menu/menu04.png) top center no-repeat;
	}
	
	nav#nav ul#menu li#m_recruit a:hover{
		background: url(../img/menu/menu04.png) bottom center no-repeat;
	}
	
	nav#nav ul#menu li#m_contact a:link{
		background: url(../img/menu/menu05.png) top center no-repeat;
	}
	
	nav#nav ul#menu li#m_contact a:hover{
		background: url(../img/menu/menu05.png) bottom center no-repeat;
	}
	
	nav#nav ul#menu li#m_news a:link{
		background: url(../img/menu/menu06.png) top center no-repeat;
	}
	
	nav#nav ul#menu li#m_news a:hover{
		background: url(../img/menu/menu06.png) bottom center no-repeat;
	}
	
	/* topimg */
	#topimg p img{
		width: 60%;
	}
	
	/* topnews */
	
	#topnews{
		background: #6fbbf7 url(../img/news_bg_mb2.jpg) left top no-repeat;
		background-size: 100% auto;
		padding: 4% 0;
	}
	
	#topnews #topnewsin{
		width: 60%;
		background: none;
		margin: 0 0 0 60px;
	}
	
	#topnews #topnewsin h2{
		display: none;
	}
	
	#topnews #topnewsin article{
		color: #052f79;
	}
	
	#topnews #topnewsin #tophistory{
		background: none;
		text-align: right;
		border-bottom: none;
	}
	
	#topnews #topnewsin #tophistory a{
		color: #052f79;
	}
	
	/* topcopy */
	#topcopy{
		text-align: center;
	}
	
	#topcopy img{
		width: 50%;
	}
	
	/* footer */
	
	footer .address{
		text-align: right;
	}

}

/*仕上がり1200px
/* PC向けレイアウトの指定：1241px以上では固定レイアウト */
@media only screen and (min-width: 1241px){
	
	body{
		font-size: 14px;
	}
	
	/* topimg */
	
	#topimg p img{
		width: 40%;
	}
	
	/* topnews */
	
	#topnews{
		background: #6fbbf7 url(../img/news_bg.jpg) left top no-repeat;
		background-size: 100% auto;
	}
	
	/* topcopy */
	
	#topcopy img{
		width: 40%;
	}
	
	/* footer */
	
	footer .logo{
		width: 300px;
		float: left;
		padding-top: 20px; 
	}
	
	footer .address{
		width: 600px;
		float: right;
		padding-top: 15px;
	}
	
	footer #cor{
		text-align: center;
	}
	

	

	

	
	
}