@charset "utf-8";

/* ===================================================================
CSS information
 file name  :  top.css
 style info :  TOPページ専用（TOPページ専用CSS　#header #nav）
=================================================================== */

body {
}

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

#header {
	width:100%;
	background-color: #f5f5f5;
	text-align:center;
	padding-top:113px;
}
h1 {
	height:117px;
	margin-left:auto;
	margin-right:auto;
	width: 525px;
	background-color: #f5f5f5;
}

h1 img {
	width: 302px;
	height: 93px;
}

#nav {
	z-index: 999;
	width: 100%;
	background-color: #f5f5f5;
	padding:9px 0px 0px 0px;
	height:61px;
}

#nav ul {
	margin-top:1px;
	margin-left:auto;
	margin-right:auto;
	width: 525px;
	background-color: #f5f5f5;
}

#nav li {
	float: left;
	padding-right:36px;
	font-family: 'Oswald',Franklin Gothic Medium, sans-serif, sans-serif;
	font-size:18px;
	color:#000000;
}

#nav li.end {
	float: left;
	padding-right:0px;
}

#nav li a {
	text-decoration: none;
	color:#000000;
	padding:0px 12px;
	padding-top:9px;
}
#nav li a:hover {
	color: #777777;
}

.fixed {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
}


#nav p {
	clear:both;
	text-align:center;
	margin-left:auto;
	margin-right:auto;
	padding-top:25px;
	color:#141414;
	font-size:14px;
	font-family: "ヒラギノ明朝 Pro W3","HiraMinPro-W3","Hiragino Mincho ProN","HGS明朝E","ＭＳ Ｐ明朝","MS PMincho",serif;
}






/*------------------------------------------------------------------------

top contents 専用
------------------------------------------------------------------------*/


#top_cnt_wrapper {
	clear: both;
	position:relative;
	max-width: 2000px;
	vertical-align:top;
	background-color:#f5f5f5;
	margin:0 auto;
	padding-top:69px;
}

#top_cnt_wrapper img{
	width: 100%;
}




/*------------------------------------------------------------------------

/* Responsive [ Mobile Devices ]
------------------------------------------------------------------------*/


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

#menu,
p.menu_sp_button {
	display:none;
}

h1 {
	height:117px;
	margin-left:auto;
	margin-right:auto;
	width: 500px;
	background-color: #f5f5f5;
}

h1 img {
	width: 242px;
	height:75px;
}

#nav li {
	font-size:16px;
}


/* End PC and Tablet Media Query */
}


/* Responsive [ Mobile Devices ]
   ========================================================================== */
@media screen and (max-width: 768px) {
#menu,
p.menu_sp_button {
	display:none;
}

#top_cnt_wrapper section div.pc_none{
	display:block;
}

#top_cnt_wrapper {
	padding-left:10px;
	padding-right:10px;
	padding-bottom:10px;
}



/* End PC and Tablet Media Query */
}

/* Responsive [ Mobile Devices ]
   ========================================================================== */
@media screen and (max-width: 480px) {

	/* 各カラムの横並びを解除し、縦１列に並べる */
	
#nav {
	display:none;
}

#header {
	width:100%;
	height:100%;
	background-color: #f5f5f5;
	padding-top: 0px;
}
h1 {
	height:50px;
	width:100%;
	background-color: #f5f5f5;
	text-align:left;
}

h1 img {
	padding:13px 0px 0px 16px;
	width: 124px;
	height:26px;
}

p.menu_sp_button {
	float:right;
	display:inline;
	background:url(../img/menu_sp_icon.gif) no-repeat;
	width:50px;
	height:50px;
	font-size: 1px;
	text-indent: -9999px;
}


p.menu_sp_button.active{
	float:right;
	display:inline;
	background:url(../img/menu_sp_icon_on.gif) no-repeat;
	width:50px;
	height:50px;
}


#menu {
	background-color: #ffffff;
	display: none;
	width: 100%;
	color:#222222;
	font-family: 'Oswald', sans-serif;
	font-size:14px;
}
#menu.open_menu {
	display:block;
}
#menu ul {
	width:100%;
	overflow:hidden;
}
#menu ul li {
	width:50%;
	height:40px;
	float:left;
	border-bottom: 1px solid #f5f5f5;
}
#menu ul li a {
	line-height:40px;
	color:#222222;
	float:left;
	width:100%;
}
#menu ul li.nav01 a,
#menu ul li.nav03 a,
#menu ul li.nav05 a
 {
	border-right: 1px solid #f5f5f5;
}


#menu ul li a span {
	padding-left:18px;
}


/*------------------------------------------------------------------------

top contents 専用
------------------------------------------------------------------------*/


#top_cnt_wrapper {
	padding:3%;
	background-color:#222222;
}


}