@charset "utf-8";


/*-------------------------------------------------------------------
　layout
-------------------------------------------------------------------*/
#wrapper{
	width:100%;
	margin:0 0 0 0;
	overflow:hidden;
	clear:both;
}

.inner{
	margin:0 auto;
	padding:0;
	width:1000px;
}

.br_pc{display:block;}
.br_sp{display:none;}

.view_pc{display:block;}
.view_sp{display:none;}


/*-------------------------------------------------------------------
　header 
-------------------------------------------------------------------*/
#header{
	width:100%;
	/*-----------------
	position:fixed;
	z-index:1000;
	-----------------*/
	padding:0;
	margin:0;
	border-bottom:0px solid #EEE;
	text-align:center;
	background-color:#FFF;
}

#headerIn{
	margin:0 auto;
	padding:0;
	width:1000px;
}

#headerWrap{
	height: auto;
}

#header h1{
	padding:0;
	margin:0;
	font-size:80%;
	font-weight:bold;
	text-align:left;
	display:none;
}

/* ===== logo ============== */
#header h2{
	position:relative;
	clear:both;
	margin:30px 0 30px 0;
	padding:0;
	text-align:center;
}

#header h2 img{
	width:530px;
	height:auto;
}


/* ===== iPad以下 1024px ======= */
@media only screen and (max-width:1024px){

#header{
	width:100%;
	position:fixed;
	z-index:1000;
	padding:0 0 15px 0;
}

#headerIn{
	width:100%;
	padding:0;
	margin:0;
}

#headerWrap{
	position:relative;
	width:100%;
	height:70px;
	border-bottom:0px solid #cccccc;
}

#header h2{
	margin:0;
	padding:20px 0 0 0;
}
	
#header h2 img{
	max-height:50px;
	width:auto !important;
	margin:0 0 0 0;
}

}

/* ===== 767px以下 ============= */
@media only screen and (max-width:767px){

#headerWrap{
	height:45px;
	margin:0;
	padding:0;
}

#header h2{
	padding:15px 0 0 0;
}

#header h2 img{
	max-height:30px;
	margin:0 0 0 0;
}
}


/*------------------------------------------------------------------------------------
  幅480px以下から ヘッダー等微調節
------------------------------------------------------------------------------------*/
@media only screen and (max-width: 480px){

#header{
	padding:0 0 0 0;
}

#header h2{
	padding:10px 0 0 0;
}

#header h2 img{
	max-height:24px;
	margin:0 0 0 7px;
	float:left;
}
}

/*-------------------------------------------------------------------
　navi
-------------------------------------------------------------------*/

/* ===== pc ======================================== */
@media only screen and (min-width:1025px){

nav#mainnav{
position:relative;
margin:0;
padding:0;
}

nav#mainnav ul{
display:flex;
justify-content:center;
align-items:center;
}

nav#mainnav ul li{
float:left;
}

nav#mainnav ul li a{
display:block;
text-align:center;
_float:left;
height:50px;
padding:0 25px 0;
line-height:50px;
font-size:18px;
font-weight:bold;
color:#000000;
}

nav#mainnav ul li a span,nav#mainnav ul li a strong{
display:block;
font-size:90%;
line-height:1.7;
}

nav#mainnav ul li a span{
font-size:70%;
}

nav#mainnav ul li a:hover span, nav#mainnav ul li a:hover{
color:#999999;
}

nav#mainnav ul ul{
width:160px;
border-top:0;
}

nav#mainnav ul li ul{
display: none;
}

nav#mainnav ul li:hover ul{
display: block;
position: absolute;
top:60px;
text-align:center;
z-index:500;
}

nav#mainnav ul li li{
background:#ffffff;
border-bottom:1px dotted #cdcdcd;
float: none;
width:160px;
height:40px;
line-height:40px;
margin:0;
}

nav#mainnav ul li li:last-child{
border:0;
}

nav#mainnav ul li li a{
width:100%;
height:40px;
padding:0;
line-height:40px;
font-size:95%;
text-lign:center;
}

nav#mainnav ul li li a:hover{
color:#999999;
}

nav div.panel{
display:block !important;
}

a#menu{
display:none;
}

}


/* ===== iPad以下からaccordion menu ================ */
@media only screen and (max-width:1024px){

#mainnav{
	position:absolute;
	top:0%;
	width:100%;
	text-align:right;
}

#mainnav ul{
background:#FFF;
text-align:left;
border-style:solid;
border-width:1px 0 0 0;
border-color:#dddddd;
margin:5px 0 0 0;
padding:0;
}

#mainnav li a{
	position:relative;
display:block;
padding:12px 25px;
border-bottom:1px solid #dddddd;
color: #000000;
font-weight:bold;
}

#mainnav ul li a span{
display:none;
}

#mainnav ul li li{
border:0;
}

#mainnav ul li li a{
padding-left:40px;
}

nav#mainNav ul{
margin:0 auto;
padding:0;
}

nav#mainNav ul ul{
padding:0;
}

nav div.panel{
float:none;
border-top:0px solid #dddddd;
}

a#menu{
display:inline-block;
position:relative;
width:40px;
height:70px;
margin-right:10px;
}

#menuBtn{
display:block;
position:absolute;
top:60%;
left:50%;
width:18px;
height:2px;
margin:-1px 0 0 -7px;
background:#000000;
transition:.2s;
}

#menuBtn:before, #menuBtn:after{
display:block;
content:"";
position:absolute;
top:50%;
left:0;
width:18px;
height:2px;
background:#000000;
transition:.3s;
}

#menuBtn:before{
margin-top:-7px;
}

#menuBtn:after{
margin-top:5px;
}

a#menu .close{
background:transparent;
}

a#menu .close:before, a#menu .close:after{
margin-top:0;
}

a#menu .close:before{
transform:rotate(-45deg);
-webkit-transform:rotate(-45deg);
}

a#menu .close:after{
transform:rotate(-135deg);
-webkit-transform:rotate(-135deg);
}

.panel{
width:100%;
display:none;
overflow:hidden;
position:relative;
left:0;
top:0;
z-index:100;
}

}

/* ===== 767px以下 ================================== */
@media only screen and (max-width:767px){

#mainnav ul{
margin:0;
}

a#menu{
	margin:0;
	padding:0;
	height:50px;
}

}

/* ===== 480px以下 ================================== */
@media only screen and (max-width:480px){

a#menu{
	height:35px;
}

}


/*-------------------------------------------------------------------
　footer 
-------------------------------------------------------------------*/
#footer{
	clear:both;
	padding:0;
	background-color:#F4F4F4;
	text-align:center;
} 

.footerIn{
	width:1000px;
	margin:0 auto;
	padding:25px 0;
}

.footerTx{
	font-size:18px;
	font-weight:bold;
}

#copyright{
	clear:both;
	padding:10px 0;
	text-align:center;
	font-size:12px;
	background-color:#004898;
	color:#FFF;
}

#pagetop{
    position:fixed;
    right:30px;
    bottom:50px;
}


/* ===== iPad以下 ================ */
@media only screen and (max-width:1024px){

.footerIn{
	width:90%;
}

#pagetop,
#pagetop a{
	display:none;
}

}

/* ===== 767px以下 ================================== */
@media only screen and (max-width:767px){

.footerTx{
	font-size:14px;
}

}

/* ===== 480px以下 ================================== */
@media only screen and (max-width:480px){

.footerTx,
.footerIn p{
	font-size:12px;
}

#copyright{
	font-size:9px;
}

}



/*-------------------------------------------------------------------
　iPad以下（1024px）1カラム表示に切り替え
-------------------------------------------------------------------*/
@media only screen and (max-width:1024px){

#wrapper{
width:100%;
}

.inner{
	width:90%;
	margin:0 auto;
}

}


/*-------------------------------------------------------------------
　幅770px以下
-------------------------------------------------------------------*/
@media only screen and (max-width:770px){

.view_pc{display:none;}
.view_sp{display:block;}

.br_pc{display:none;}
.br_sp{display:block;}

}