@charset "utf-8";

/* 
border: 1px solid #333;
xx-small,x-small,small,medium,large,x-large,xx-large

----------------------------------------------- */



/* リセット */

* {
padding: 0px;
margin: 0px ; 
}

a { text-decoration : none}
ul, ol { list-style : none}

img{ vertical-align : middle}


h1,h2,h3,h4,h5,h6.p,adress{
font-size: 15px;
line-height: 1.6;
font-weight: normal;
font-style: normal;
}



/*ページ構造 */

html { font-size: 15px; }

body { font-size: 15px; font-size: 1.0rem; 
color: #333;
font-family:'Times New Roman','YuMincho','HiraMinProN-W3','Hiragino Mincho ProN','\6E38\660E\671D','\30D2\30E9\30AE\30CE\660E\671D Pro W3','IPAexMincho','IPAex\660E\671D','MS PMincho','\FF2D\FF33 \FF30\660E\671D','MS Mincho','\FF2D\FF33 \660E\671D',serif;
font-family: "Verdana","Osaka","arial","sans-serif";
font-family: 'Helvetica Neue', Helvetica, Arial, Verdana, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
font-family: 'Hiragino Kaku Gothic ProN', Meiryo, 'MS PGothic', sans-serif;
background: #f9f;
background-color: #e7e7e7;
background-color: #e9e9e9;
background-color: #fff;
}

a{text-decoration: underline ; } 
a:link{color:#2121d3; text-decoration: underline ; border-bottom : none; } 
a:visited {color:#7d21d3;} 
a:hover {color: #0072bc;} 
a:active {color:#f00;} 

img { 
border: none;
padding: 0px 0px 0px 0px;
margin: 2px;
}

img a{ 
color: #fff;
text-decoration: underline ;
border: none;
background: #transparent;
}


.wrap-inner{
max-width: 980px;
text-align: left; 
padding: 0px 15px; 
margin: 0px auto; 
 }



#header {
height:100%;
text-align:left;
background-color: #fff;
padding: 0px 0 ;
margin:0 0 10px 0;
	box-shadow: 0px 0px 6px #999; /*CSS3*/
	-moz-box-shadow: 0px 0px 6px #999; /* Firefox用*/
	-webkit-box-shadow: 0px 0px 6px #777; /* Google Chrome, Safari用*/
}


#header a:active {color:#fff; text-decoration: none ; border : none ; } 

.wrap-header-1{
height:100%;
background-color: #217dd3;

padding: 5px 0 4px 0;
border-bottom:1px solid #b1005b;

background: #0072bc;
border-bottom:1px solid #004F84;
margin:0 ;
}


ul#menu{
list-style-type: none;
display: block;
padding: 0 0 0px 0;
margin: 0px 0px 0px 2px;
}

ul#menu li{ 
font-size: 13px;
line-height: 1.5;
padding: 0px 12px 0px 0px;
margin: 0px;
display: inline;
}


#menu a:{ color:#f9f9f9; text-decoration: none ; border : none ; } 
#menu a:link { color:#f9f9f9; text-decoration: none ; border : none ; } 
#menu a:visited {color:#f9f9f9; text-decoration: none ; border : none ; } 
#menu a:hover {color:#fff; text-decoration: none ; border : none ; 

text-shadow: -1px 0 1px #fff, 1px 0 1px #000; 
} 

ul#menu li.logo{ 
font-size: 17px;
font-family: "times","Verdana";
font-weight:bold;
letter-spacing:1px;
}


.wrap-header-2{
width:auto;
text-align: center; 
background-color: #0072bc;
padding: 0 0 5px 0;
border-top:1px solid #e4328f;

background: #0072bc;
border-top: 1px solid #0084DB;
margin:0 ;
}


h1.header-title{
color: #fff;
font-weight: normal;
font-size:24px;
text-align: left; 
line-height: 1.3;
letter-spacing:1px;
background: transparent;
padding: 0px 0px 0px 0px;
margin: 14px 0px 9px 0px;
display: block;

text-shadow:
1px 1px 1px rgba(0, 0, 0, 0.6),
-1px -1px 1px rgba(255, 255, 255, 0.5);


text-shadow: 4px 4px 6px rgba(0,0,0,0.5),
1px 1px 1px rgba(0, 0, 0, 0.6),
-1px -1px 1px rgba(255, 255, 255, 0.5);


text-shadow: 0 -1px 1px #fff, -1px 0 1px #fff, 1px 0 1px #000; 

text-shadow:
0 1px 0 #222,
0 2px 0 #5e5e5e,
0 3px 0 #111,
0 4px 0 #5e5e5e,
0 5px 0 #000,
0 6px 1px rgba(0,0,0,.1),
0 0 5px rgba(0,0,0,.1),
0 1px 3px rgba(0,0,0,.3),
0 3px 5px rgba(0,0,0,.2),
0 5px 10px rgba(0,0,0,.25),
0 10px 10px rgba(0,0,0,.2),
0 20px 20px rgba(0,0,0,.15);


text-shadow:
2px 2px 0px #3b3b3b,
3px 3px 0px #616161;


text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);

text-shadow:
1px 1px 1px rgba(0, 0, 0, 0.6),
-1px -1px 1px rgba(255, 255, 255, 0.5);


text-shadow: 2px 2px 4px rgba(0,0,0,0.3),
1px 1px 1px rgba(0, 0, 0, 0.3),
-1px -1px 1px rgba(255, 255, 255, 0.3);
}

#description{
color: #fff;
font-size:13px; 
text-align: left; 
line-height: 1.3;
letter-spacing:1px;
background: transparent;
padding: 0px 0  0;
margin: 0px 0px 10px 2px;
display: block;
} 

#description strong{
font-weight: bold;
color: #fff;
margin: 0px;
padding: 0px;
}

ul#breadcrumb { 
margin: 0px 0px 20px 0px;
}

ul#breadcrumb li{
font-size: 13px;
padding: 0px 1em 0px 0px;
margin: 0px 0 ;
display: inline; 
}



#navi {
text-align:left;
padding: 0;
background-color: #fff;
margin:0px 0px 10px 0px;
}


#navi .sns{
text-align: center; 
padding:0px;
margin: 0px auto 15px;
text-decoration: none ;
}

.navi-center{
text-align: center;
padding: 0px auto 0px;
margin: 10px auto 15px;
}


#navi h3, #navi h5{
color: #fff;
font-size: 14px;
display: block;
font-weight:normal; 
text-decoration: none ; 
text-align: left;
line-height: 1.5;
letter-spacing:1px;
background-color: #d6207b;
background-color: #0072bc;
text-align: center;
padding: 6px 8px 4px 7px;
margin: 0 0px;
} 


#navi h4 a{
width: auto;
color: #fff;
font-size: 14px;
display: block;
line-height: 1.6;
font-weight:normal; 
text-decoration: none ; 
text-align: left;

letter-spacing:1px;
background-color: #0072bc;
text-align: center;
margin: 0 0px;
padding: 6px 8px 4px 7px;

} 

#navi h3 a:hover, #navi h4 a:hover{
color: #eee;
background-color: #0072bc;
}


#navi ul {
list-style-type: none;
display: block;
margin: 0 0px; 
padding: 0;
}

#navi li a{ 
display: block;
width: auto;
font-size: 14px;
line-height: 1.6;
font-weight:normal; 
text-decoration: none ; 
text-align: left;
font-weight:normal;
letter-spacing:0px;
background-color:#f0f0f0;
border-top: 1px solid #fff;
border-right: 1px solid #ddd;
border-bottom: 1px solid #cdcdcd;
margin: 0;
padding: 6px 0px 5px 14px;

} 

#navi li a:hover {
color:#d3217d;
background: #fff; 
border-left: 5px solid #d32121;
padding: 6px 0px 5px 9px;
} 

#navi p { 
font-size: 13px;
line-height: 1.6;
margin: 0px 0px 0px 0px; 
padding: 0px;
}



/* ■フッター開始■ */


#foot a{
color:#ccc;
text-decoration: none ; border-bottom : none }

#foot a:link{color:#ccc;} 
#foot a:visited {color:#ccc;}  
#foot a:hover {color: #fff;} 
#foot a:active {color:#fff;} 



.fbox{ 
float: left;
width: 31%;
height: auto;
text-align: left; 
margin: 5px 0 15px 2%;
}

.fbox li{ 
padding: 0 ;
margin: 0px 0 8px 0px;
}


#foot h4{
font-size: 16px;
line-height: 1.6;
font-weight: bold;
color:#efefef;
margin: 0 0 8px 0;
}

.fbox li{ 
font-size: 15px;
padding: 0 ;
margin: 0px 0 10px 0px;
}



/* フッター 480px以上用（タブレット／PC用）の記述 */
@media screen and (min-width: 769px) {

#foot {
clear:both;
font-size: 13px;
line-height: 1.6;
color:#afafaf;
text-align: center; 
background: #111; 
padding: 0px 20px 0px;
border-top: 1px solid #aaa;
margin: 15px auto 0;
}

.wrap-footer{
width: 100%; 
max-width: 980px;
text-align: center; 
padding: 20px 0 ; 
margin: 0px auto; 
}

.fbox{ 
float: left;
width: 31%;
height: auto;
text-align: left; 
margin: 5px 0 15px 2%;
}
}


@media screen and (max-width: 768px) {

#foot {
clear:both;
font-size: 13px;
line-height: 1.6;
color:#afafaf;
text-align: center; 
background: #111; 
padding: 0px 30px 0px;
border-top: 1px solid #aaa;
margin: 15px auto 0;
}

.wrap-footer{
max-width: 768px;
text-align: center; 
padding: 20px 0 ;  
}

.fbox{ 
width: 100%;
height: auto;
text-align: left; 
margin: 5px 0 15px 0px;
}
}







.social_button {
	margin: 0px 0px 10px 0px;
	padding: 0px;
	width:100%;
	height:65px;
}
.social_button .twitter {
	float: left;
	margin: 0px 10px 0px 0px;
	padding: 0px;
	display: inline;
	width: 73px;
}
.social_button .facebook {
	float: left;
	margin: 0px 10px 0px 0px;
	padding: 0px;
	display: inline;
	width: 73px;
}
.social_button .googleplus {
	float: left;
	margin: 0px 10px 0px 0px;
	padding: 0px;
	display: inline;
	width: 73px;
}
.social_button .hatena {
	float: left;
	margin: 0px 10px 0px 0px;
	padding: 0px;
	display: inline;
	width: 85px;
}

.social_button .line {
	float: left;
	margin: 0px 0px 0px -20px;
	padding: 0px;
	display: inline;
	width: 85px;
}






















/*media Queries（タブレット／スマートフォン用）の記述 */
----------------------------------------------------*/
@media only screen and (max-width: 779px) {

#primary{
clear: both;
float: none;
width:auto;
width:100%;
}

#main {

}

#secondary {
clear: both;
float: none;
width: auto;
width:100%;
position: static !important;
}
}


/* 479px以下用（スマホ用）の記述
----------------------------------------------------*/
@media only screen and (max-width: 479px) {
.wrap-inner{
padding: 0px 10px; 
}

#primary{
width:100%;
}

#secondary {
width: 100%;
}
}


/* 780px以上用（PC用）の記述
----------------------------------------------------*/
@media only screen and (min-width: 780px) {

#frame {
text-align: center; 
margin: 0px auto; 
padding: 0px ;
}

.wrap-inner{
padding: 0px 20px; 
}



#primary{ 
float: left;
overflow: hidden;
width: 100%;
margin-right: -300px;
display: block;
}

img{
max-width: 100%;
height: auto;
width /***/:auto;　
}

#main { 
text-align:left;
margin-top: -10px;
margin-right: 330px;
margin-left: 0px;
background-color: #fff;
padding: 0px 0px 20px;
}

#secondary {
float: right;
overflow: hidden;
width: 300px;
padding: 0px;
margin: 0px 0px 5px; 
display: block;
}
}

/*media Queries PCサイズ
----------------------------------------------------*/
@media only screen and (min-width: 1000px) {
.wrap-inner{
max-width: 980px;
text-align: left; 
padding: 0px 25px; 
margin: 0px auto; 
 }

#primary{
width:100%;
margin-right: -340px;
}

#main {
margin-right: 340px;
}
}

/* 
border: 1px solid #333;
----------------------------------------------- */