@charset "utf-8";

/* 
border: 1px solid #333;
xx-small,x-small,small,medium,large,x-large,xx-large
----------------------------------------------- */


/* リセット */

* {
padding: 0px;
margin: 0px ; 
}

a{color:#2121d3; text-decoration: underline; border-bottom : none; } 
a:visited {color:#7d21d3;} 
a:hover {color: #d32121; text-decoration: underline;} 


img{ 
vertical-align : middle
border: none;
padding: 0px 0px 0px 0px;
margin: 2px;
}

img a{ 
color: #fff;
text-decoration: none ;
border: none;
background: #transparent;
}

ul, ol { list-style : none}


/*ページ構造 */

html { }

body { 
font-size: 16px; font-size: 1.0rem; 
color: #232323;
font-family: 'ヒラギノ角ゴ ProN W3', Meiryo, 'MS PGothic', sans-serif;
background-color: #e9e9e9;
}


#frame {
width: 100%;
max-width:980px;
text-align: center;
padding: 0px;
}



#header {
text-align:left;
background-color: #fff;
padding: 10px 0px 26px;
margin:2px 4px 4px 2px;
	box-shadow: 2px 2px 3px #aaa; /*CSS3*/
	-moz-box-shadow: 2px 2px 3px #aaa; /* Firefox用*/
	-webkit-box-shadow: 2px 2px 3px #aaa; /* Google Chrome, Safari用*/
display: block;
}

/*
@media screen and (max-width: 478px) {
#header {
padding: 10px 0px 50px;
}
}
_________________________________________*/

.hin{
color :#fff;
text-align:left;
background-color: #058DC7;
background-color: #d6207b;
margin: 0 11px;
padding: 14px 20px 12px;
display: block;
}

#header a:{ color:#fff; text-decoration: none ; border : none ; } 
#header a:link { color:#fff; text-decoration: none ; border : none ; } 
#header a:visited {color:#fff; text-decoration: none ; border : none ; } 
#header a:hover {color:#efefef; text-decoration: none ; border : none ; } 
#header a:active {color:#fff; text-decoration: none ; border : none ; } 




h1#logo, div#logo{
font-family: "times","Verdana";
color: #fff;
font-size: 28px;
font-weight: 800 ;
text-align: left; 
line-height: 1;
letter-spacing:1px;
background: transparent;
padding: 0px 0px 0px 0px;
margin: 0px 0px 11px 0px;
display: block;
}

#description{
color: #fff;
font-size:15px; 
text-align: left; 
line-height: 1;
letter-spacing:1px;
background: transparent;
padding: 0px;
margin: 0px 0px 0px 0px;
display: block;
} 

#description strong{
font-weight: bold;
color: #fff;
margin: 0px;
padding: 0px;
}



#headerlist{
float:right;
width: 150px;
margin: -30px 20px 0px 0px;
}

#header-list{
width: 150px;
text-align:right;
color: #fff;
}

#header-list li{
display:inline;
font-size: 13px;
color: #fff;
}

ul#breadcrumb, ul#menu {
list-style-type: none;
text-align:left;
padding: 0 0;
margin: 3px 10px 0px 12px;
}

ul#breadcrumb li, ul#menu li{ 
float: left;
width: 90px;
width: auto;
font-size: 13px;
color:#333;
text-align:left;
display: inline;  
vertical-align: bottom;
display: block;
}

ul#menu a{text-decoration: none; 
text-align:left;
line-height: 1.8;
padding: 0px 5px 2px 5px;
margin: 0px 10px 15px 0px;
} 


ul#menu a:link{color:#2121d3; } 
ul#menu a:visited {color:#7d21d3;} 
ul#menu a:hover {color: #d32121;  border-bottom : 2px solid #d32121;  } 
ul#menu a:active {color:#f00;} 


ul#breadcrumb li.home, ul#menu li.home{
background:  url(../image/icon/icon_home.gif) no-repeat 0px 5px;
padding-left: 10px;
}


#primary{

}


#secondary{

}


nav{
margin-top:25px;
}

#navi {
text-align:left;
padding: 15px 11px ;
background-color: #fff;
margin:2px 4px 6px 2px;
	box-shadow: 2px 2px 3px #aaa; /*CSS3*/
	-moz-box-shadow: 2px 2px 3px #aaa; /* Firefox用*/
	-webkit-box-shadow: 2px 2px 3px #aaa; /* Google Chrome, Safari用*/
}


#navi .bookmark{
text-align: center; 
padding:0px;
margin: 0px auto 0px ;
text-decoration: none ;
}


.date{
color :#333;
font-size: 15px;
text-align: center; 
padding:0px;
border:0px; 
margin: 25px auto 15px ;
}

/* 

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


#navi h3, #navi h5{
color: #fff;
font-size: 16px;
display: block;
font-weight:normal; 
text-decoration: none ; 
text-align: left;
line-height: 1.5;
letter-spacing:1px;
background: #058DC7;
background-color: #d6207b;
text-align: center;
padding: 8px 8px 6px 7px;
margin: 0 0px;
} 

#navi h4 a{
color: #fff;
font-size: 16px;
display: block;
font-weight:normal; 
text-decoration: none ; 
text-align: left;
line-height: 1.5;
letter-spacing:1px;
background: #058DC7;
background-color: #d6207b;
text-align: center;
padding: 8px 8px 6px 7px;
margin: 0 0px;
} 

#navi h3 a:hover, #navi h4 a:hover{
color: #fff;
background-color: #d32121;
}


#navi ul {
list-style-type: none;
margin: 0 0px; 
padding: 0;
}

#navi li a{ 
display: block;
width: auto;
font-size: 16px;
font-weight:normal; 
text-decoration: none ; 
text-align: left;
line-height: 1.5;
font-weight:normal;
letter-spacing:0px;
background: #efefef;
border-top: 1px solid #fff;
border-right: 1px solid #ddd;
border-bottom: 1px solid #ccc;
border-left: none;
margin: 0;
padding: 8px 5px 6px 12px;
display: block;
} 

#navi li a:hover {
color:#d32121;
background: #fff; 
border-left: 5px solid #d32121;
padding: 8px 5px 6px 7px;
} 

#navi p { 
font-size: 0.8em;
margin: 0px 0px 0px 0px; 
padding: 0px;
}



#navi ul.postit{
list-style: none;
margin: 0px;
padding: 0px;
}

#navi ul.postit li{
float: none; 
list-style: none;
width: 100%;
padding:0;
margin:0 0 0 0px;
}

#navi ul.postit li a{
  display: block; 
  width: 100%; 
padding: 7px 12px 6px; 
border-left: 6px solid; 
  position: relative; 
  z-index: 2;
  text-decoration: none;
  color: #333;
border-top 1px solid #fff;
border-bottom: 1px solid #ddd;
  box-sizing: border-box;  
  -moz-box-sizing: border-box;  
  -webkit-box-sizing: border-box; 
}
	
#navi ul.postit li a:hover{ border-top 1px solid #fff;
border-bottom: 1px solid #ddd; color: #fff;}
#navi ul.postit li:first-child a{ border-left: 6px solid #3498DB; }
#navi ul.postit li:nth-child(2) a{ border-left: 6px solid #F1C40F; }
#navi ul.postit li:nth-child(3) a{ border-left: 6px solid #2ECC71; }
#navi ul.postit li:nth-child(4) a{ border-left: 6px solid #E74C3C; }
#navi ul.postit li:nth-child(5) a{ border-left: 6px solid #3498DB; }
#navi ul.postit li:last-child a{ border-left: 6px solid #34495E; }

#navi ul.postit li a:after { 
  content: "";
  height: 100%; 
  left: 0; 
  top: 0; 
  width: 0px;  
  position: absolute; 
  transition: all 0.3s ease 0s; 
  -webkit-transition: all 0.3s ease 0s; 
  z-index: -1;
}

#navi ul.postit li a:hover:after{ width: 100%; 
border-top 1px solid #fff;
border-bottom: 1px solid #ddd;
}
#navi ul.postit li:first-child a:after{ background: #3498DB; }
#navi ul.postit li:nth-child(2) a:after{ background: #F1C40F; }
#navi ul.postit li:nth-child(3) a:after{ background: #2ECC71; }
#navi ul.postit li:nth-child(4) a:after{ background: #E74C3C; }
#navi ul.postit li:nth-child(5) a:after{ background: #3498DB; }
#navi ul.postit li:last-child a:after{ background: #34495E; }

.navi-center{
text-align: center;
padding: 0px auto 0px;
margin: 10px auto 15px;
}





/* ■フッター開始■ */
#foot {
clear:both;
font-size: 16px;
color: #777;
text-align: center;
background: #111; 
padding: 0px auto 0px;
margin: 0px auto 0;
}

.wrap-footer{
padding: 15px 20px; 
margin: 0px auto 0; 
border: 1px solid #333;
}


#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%;
}

#foot h4{
font-size: 16px;
line-height: 1.6;
font-weight: bold;
color:#efefef;
margin: 0 0 12px 0;
}

.fbox li{ 
font-size: 16px;
padding: 0 ;
margin: 0px 0 15px 0px;
}



/* フッター 768px以下用（スマートフォン用）の記述 */
@media screen and (max-width: 768px) {
.fbox{ 
float: none;
width: 100%;
height: auto;
text-align: left; 
margin: 5px 0 15px 0px;
}
}




/* 766px以下用（タブレット／スマートフォン用）の記述 */
@media only screen and (max-width: 766px) {

#frame {
width: auto;
text-align: center; 
margin: 0px auto; 
padding: 0px;
}

#primary{
width:100%;
clear: both;
float: none;
}

#main { 
text-align: left;
padding: 15px 15px 25px 15px;
background-color: #fff;
margin:2px 4px 4px 2px;
	box-shadow: 2px 2px 3px #aaa; /*CSS3*/
	-moz-box-shadow: 2px 2px 3px #aaa; /* Firefox用*/
	-webkit-box-shadow: 2px 2px 3px #aaa; /* Google Chrome, Safari用*/
}

#secondary {
clear: both;
float: none;
width: auto;
position: static !important;
}
}



/* 479px以下用（スマートフォン用）の記述 */
@media screen and (max-width: 479px) {

#primary{
width:100%;
}

#main { 
text-align: left;
padding: 15px 10px;
}

#secondary {
width: 100%;
}
}



/* 767px以上用（PC＆タブレット用）の記述 */
@media only screen and (min-width: 769px) {

#frame {
width: 100%;
max-width:995px;
text-align: center; 
margin: 0px auto; 
padding: 0px;
}

#primary{ 
float: left;
overflow: hidden;
width: 100%;
margin-right: -327px;
display: block;
}

#main { 
text-align: left;
padding: 15px 20px;
background-color: #fff;
margin:2px 331px 4px 2px;
	box-shadow: 2px 2px 3px #aaa; /*CSS3*/
	-moz-box-shadow: 2px 2px 3px #aaa; /* Firefox用*/
	-webkit-box-shadow: 2px 2px 3px #aaa; /* Google Chrome, Safari用*/
}


#secondary {
float: right;
overflow: hidden;
width: 327px;
padding: 0px;
margin: 0px 0px 5px; 
display: block;
}


nav {
margintop: 10px; 
}

#top{ 
text-align: center !important;
font-size: 15px !important;
margin: 30px auto 30px !important;
}

#go-top{ 
text-align: center ;
font-size: 15px ;
margin: 30px auto 30px ;
}

}





.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;
}






.square_btn{
    display: inline-block;
    position: relative;
font-size:18px; 
line-height: 1.7;
    padding: 0.6em 1em 0.5em ;
margin: 0.8em 0px;
    text-decoration: none;
    background: #207bd6;/*ボタン色*/
    color: #FFF;
    border-bottom: solid 5px #106ac5;/*ボタン色より暗めに*/
    border-right: solid 5px #0059b4;/*ボタン色より暗めに*/
}

.square_btn:before{    
    content: " ";
    position: absolute;
    bottom: -5px;
    left: -1px;
    width: 0;
    height: 0;
    border-width: 0 6px 6px 0px;
    border-style: solid;
    border-color: transparent;
    border-bottom-color: #FFF;
}

.square_btn:after{   
    content: " ";
    position: absolute;
    top: -1px;
    right: -5px;
    width: 0;
    height: 0;
    border-width: 0px 6px 6px 0px;
    border-style: solid;
    border-color: #FFF;
    border-bottom-color: transparent;
}

.square_btn:active{ /*ボタンを押したとき*/
    border:none;
    -ms-transform: translate(6px,6px);
    -webkit-transform: translate(6px,6px);
    transform: translate(6px,6px);
}

.square_btn:active:after,.square_btn:active:before {
    content: none;/*ボタンを押すと線が消える*/u
}

.square_btn a {color:#fff;text-decoration: none; border-bottom: 1px #fff solid; !important;} 
.square_btn a :visited {color:#fff; !important;} 
.square_btn a :hover {color: #aaa; !important;} 





/* 

@media (min-width:960px){.uk-visible-small{display:none!important}.uk-visible-medium{display:none!important}.uk-hidden-large{display:none!important}}

@media (min-width:768px) and (max-width:959px){.uk-visible-small{display:none!important}.uk-visible-large{display:none!important}.uk-hidden-medium{display:none!important}}

@media (max-width:767px){.uk-visible-medium{display:none!important}.uk-visible-large{display:none!important}.uk-hidden-small{display:none!important}}.uk-hidden{display:none!important;visibility:hidden!important}.uk-invisible{visibility:hidden!important}.uk-visible-hover:hover .uk-hidden,.uk-visible-hover:hover .uk-invisible{display:block!important;visibility:visible!important}.uk-visible-hover-inline:hover .uk-hidden,.uk-visible-hover-inline:hover .uk-invisible{display:inline-block!important;visibility:visible!important}

@media print{*{background:transparent!important;color:#000!important;box-shadow:none!important;text-shadow:none!important}a,a:visited{text-decoration:underline}pre,blockquote{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}tr,img{page-break-inside:avoid}img{max-width:100%!important}

@page{margin:.5cm}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}}


border: 1px solid #333;
----------------------------------------------- */