@charset "utf-8";
body {
	font: 100% "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
	margin: 0; /* 複数の異なるブラウザの初期設定値に対応するため、body エレメントのマージンと余白を 0 にすることをお勧めします */
	padding: 0;
	color: #000000;
}




/*--------------------------------------------------
メニュー
--------------------------------------------------*/
#header02{
	background-color:#DB0000;
	background-image:url("./img/menu_haikei.gif");
	width:100%;
	height: 165px;
	margin: 0px;
	padding: 0px;
}


#logoarea {
max-width:980px;
padding: 0px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}

.main-contents, .left, .right {
height: 85px;
}


.main-contents {
float: left;
width: 51.5%;
text-align:right;
}
.right {
float: left;
width: 23.5%;
}
.left{
width: 25%;
float: left;
}




#logo{
	margin-top: 20px;
	float: left;
}



#l_bn{
margin-top:12px;
float:right;
width:100%;
}

#searcharea {
	width:216px;
	float:right;
	background-image: url(./img/search_haikei.png);
	height: 27px;
	margin-top:48px;
	text-align: center;
	padding-top: 10px;
}
#search{
float:left;
font-size:0.8em;
width:190px;
text-align:center;
margin-left: 17px;
}
#search form{
display:block;
border:solid 1px #D6D6D6;
background-color:white;
vertical-align:top;

}

#search .button {
margin-top:1.5px;
margin-right:2px;
}


#cse-search-box {
    float: left;

				height:25px;
}

#cse-search-box input[type="text"] {
	border:none;
    height: 25px;
    padding: 0 !important;
    width: 153px;
    float: left;
    margin-left: 5px;
}



#menu{
width: 100%;
max-width: 990px;
margin: 0 auto;
padding: 0;
}

#menu li{
display: block;
float:left;
width: 11.11%;
margin: 0;
padding: 0;
}

#menu li a{
padding: 12px 0 10px;
text-align: center;
text-decoration: none;
}


#toggle{ 
display: none;
}

#bn_sp{
display:none;
}

#bn_pc{
	display:block;
}




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

#header02{
	background-color:#DB0000;
	background-image:url(./img/menu_haikei.gif);
	width:100%;
	height: 154px;
	margin: 0px;
	padding: 0px;
}

.left{
width: 30%;
float: left;
}

.main-contents {
float: left;
width: 45%;
text-align:right;
}

.right {
float: left;
width: 25%;
}





#menu li{
width: 11%;
}

#menuline{
background-color:#DB0000;
width:100%;
}

img{
max-width: 100%;
height: auto;
width /***/:auto;　
}



#searcharea {
	width:180px;
	float:right;
	height: 32px;
	margin-top:48px;
	text-align: center;
	padding-top: 5px;
}
#search{
float:left;
font-size:0.8em;
width:170px;
text-align:center;
margin-left: 17px;
}


#search .button {
margin-top:1.5px;
}


#cse-search-box {
    float: left;
    margin-top: 7px;
    margin-right: 11px;
				height:25px;
}

#cse-search-box input[type="text"] {
    border-radius: 5px 0 0 5px;
    height: 15px;
    padding: 0 !important;
    width: 100px;
    float: left;
    margin-left: 18px;
}

}

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

#header02 {
width: 100%;
text-align: center;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
	background-image:url(./img/menu_haikei.gif);
height:130px;
}

#logoarea {
max-width:980px;
padding: 0px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}



.main-contents {
float: right;
width: 55%;
margin-right:10px;
}
.right {
display:none;
}
.left{
width: 40%;
float: left;
margin-right:10px;
}


#logo{
	margin-top: 20px;
	float: left;
	width:100%;
}


#menu li{
width: 11%;
}

#menuline{
background-color:#DB0000;
width:100%;
}

img{
max-width: 100%;
height: auto;
width /***/:auto;　
}




}




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

#header02 {
width: 100%;
text-align: center;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background:#FFF;

}

#logoarea {
max-width:980px;
padding: 0px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}

.main-contents, .left, .right {
	width: 100%;
height: 50px;
}



.main-contents {
float: center;
text-align:right;
}
.right {
display: none;
}
.left{
	float:none;
width: 40%;
text-align:center;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}





#logo{
margin-top: 15px;
}


#l_bn{
margin-top:2px;
float: center;
width:100%;
height:50px;
}



#menu{
display: none;
}


#menu li{
width: 100%;
background-color:#c73333;
border-bottom: 1px solid #f39090;
}
#toggle{
float:left;
display: block;
position: relative;
width: 100%;
background-color:#bc0000;
}

#toggle a{
display: block;
position: relative;
padding: 12px 0 10px;
border-bottom: 1px solid #444;
color: #fff;
text-align: center;
text-decoration: none;
}
#toggle:before{
display: block;
content: "";
position: absolute;
top: 50%;
left: 10px;
width: 20px;
height: 20px;
margin-top: -10px;
background: #fff;
}
#toggle a:before, #toggle a:after{
display: block;
content: "";
position: absolute;
top: 50%;
left: 10px;
width: 20px;
height: 4px;
background: #bc0000;
}
#toggle a:before{
margin-top: -6px;
}
#toggle a:after{
margin-top: 2px;
}


#bn_pc{
display:none;
}

#bn_sp{
font-size:13px;
color:#FFF;
display:block;
margin:10px;
}

img{
max-width: 100%;
height: auto;
width /***/:auto;　
}


}