/* Reset Styles
***********************/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q demo
blockquote:before, blockquote:after,q:before, q:after {content: ''; content: none;}
table#history {border-collapse: collapse; border-spacing: 0;}
strong {font-weight: bold;}
em {font-style: italic;}





/* General
***********************/
body {
	background: #fff;
	font-size: 16px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Helvetica, 'Arial', sans-serif,;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	height: auto;
}
a {
	color: #E81800;
}
a:hover {
	color: #FF0000;
}

p {
	font-size: 16px;
	line-height: 180%;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Helvetica, 'Arial', sans-serif,;
	margin-bottom:10px;
}

/* --Clearfix */
.cf:before,
.cf:after {content:""; display:table;}
.cf:after {clear:both;}
.cf {zoom:1;}

.toggle { margin: 2px 0 0 14px; float: left; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; }
.toggle li { float: left; }
.toggle li a {width: 50px; padding: 6px 0; text-align: center; display: block; text-shadow: 1px 1px 0 #fff; font-size: 12px; font-weight: 600; color: #666; -webkit-border-radius: 0 4px 4px 0; -moz-border-radius: 0 4px 4px 0; -o-border-radius: 0 4px 4px 0; border-radius: 0 4px 4px 0; 

background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #ededed 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#ededed)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ffffff 0%,#ededed 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ffffff 0%,#ededed 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #ffffff 0%,#ededed 100%); /* IE10+ */
background: linear-gradient(top, #ffffff 0%,#ededed 100%); /* W3C */

box-shadow: inset 1px 1px 0 #fff, inset -1px -1px 0 #fff;
-moz-box-shadow: inset 1px 1px 0 #fff, inset -1px -1px 0 #fff;
-webkit-box-shadow: inset 1px 1px 0 #fff, inset -1px -1px 0 #fff;

}
.toggle li:first-child a {-webkit-border-radius: 4px 0 0 4px; -moz-border-radius: 4px 0 0 4px; -o-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px;}
.toggle li a:hover { background: #ededed; color: #222; }
.toggle li a.active { background: #c8e0f3; color: #325874; cursor: default; box-shadow: inset 0 0 3px rgba(0,0,0,0.4); -moz-box-shadow: inset 0 0 3px rgba(0,0,0,0.4); -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.4); }

.slider { width:800px; margin: 0 auto 50px auto!important;}

#carousel li {margin-right: 5px;}
#carousel img {display: block; opacity: .5; cursor: pointer;}
#carousel img:hover {opacity: 1;}
#carousel .flex-active-slide img {opacity: 1; cursor: default;}

.button {
  display: inline-block;
  margin: 0;
  padding: .461em 1.563em .41em;
  color: #fff!important;
  text-align: center;
  text-decoration: none;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.7);
  text-transform: uppercase;
  line-height: 1;
  font-size: .9em;
  cursor: pointer;
  font-family: "proxima-nova", sans-serif;
  border: 1px solid #1a4064;
  background: #255a8c;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  -webkit-box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1), inset 0 0 1px 1px rgba(255, 255, 255, 0.15);
  -moz-box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1), inset 0 0 1px 1px rgba(255, 255, 255, 0.15);
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1), inset 0 0 1px 1px rgba(255, 255, 255, 0.15);
}
.button:active  {
  -webkit-box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1), inset 0 0 1px 1px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1), inset 0 0 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.1), inset 0 0 1px 1px rgba(0, 0, 0, 0.1);
}
.button.green  {
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
  border: 1px solid #578824;
  background: #71b02f;
}
.button.green:hover  {
  background: #79bc32;
}

/* Loading
***********************/
.loading #container {opacity: 0;}
.loading:before  { content: 'LOADING'; display: block; margin: 100px 0 0; text-align: center; color: #fff; font-weight: bold; font-size: 60px; opacity: 0.3; }
body {width: 100%; float: left; opacity: 1; -webkit-transition: opacity 1s ease;}

/* Layout
***********************/
#wrap {
	width:100%;
	margin:0 auto;
	padding: 0;
	}
	
#container {
	width:1200px;
	margin:0 auto;
	padding: 0;
	}
#main {
	width:870px;
	margin:0 auto;
	overflow:hidden;
}



/* Header
***********************/
header{
	width:100%;
	height:130px;
}
h1#logo{
	text-align:center;
	margin-top:30px;
}

/* Navigation
***********************/
nav {
	width:1200px;
	margin-bottom:60px;
}
ul#navi{
	width:870px;
	height:100px;
	margin:0 auto;
	position:relative;
}
ul#navi li{
	width:100px;
	height:100px;
	overflow: hidden;
	margin:0 10px 0 0;
	float:left;
}
ul#navi li.mg1{
	margin-right:10px;
}
ul#navi li.mg2{
	margin-right:0;
}
ul#navi li a.nav-instagram-tile {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	width: 100px;
	height: 100px;
	border: 1px solid #cfcfcf;
	background: #fff;
	color: #111;
	text-align: center;
	text-decoration: none;
	font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}
ul#navi li a.nav-instagram-tile:hover {
	color: #111;
	opacity: .78;
}
.nav-instagram-icon {
	position: relative;
	display: block;
	width: 28px;
	height: 28px;
	border: 3px solid #111;
	border-radius: 9px;
	box-sizing: border-box;
}
.nav-instagram-icon:before {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 10px;
	height: 10px;
	border: 3px solid #111;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	box-sizing: border-box;
}
.nav-instagram-icon:after {
	content: "";
	position: absolute;
	right: 4px;
	top: 4px;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #111;
}
.nav-instagram-label {
	display: block;
	font-size: 12px;
	font-weight: bold;
	line-height: 1.15;
	letter-spacing: 0;
}
   /* IE8 */
    html>/**/body a:hover img {
        display /*\**/:inline-block\9;
        zoom /*\**/: 1\9;
    }
  /* 新旧Firefox */
    li.mg1　a:hover img, x:-moz-any-link { background: #背景色カラー;}
    li.mg1　a:hover img, x:-moz-any-link, x:default { background: #背景色カラー;}
	li.mg2　a:hover img, x:-moz-any-link { background: #背景色カラー;}
    li.mg2　a:hover img, x:-moz-any-link, x:default { background: #背景色カラー;}



/* section
***********************/
section {
	margin-bottom:50px;
	display:inline-block;
}
section h2{
	margin-bottom:50px;
	display:block;
}
section h3{
	margin-bottom:20px;
	font: bold 20px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Helvetica, 'Arial', sans-serif;
}



/* Article
***********************/
article#line{
	width:870px;
	margin: 0 auto 50px;
}
.box1{
	width:870px;
	position:relative;
}


/*-----figure------*/

figure.imgLft{
	float:left;
	width:300px;
	margin-right:20px;
	margin-bottom:20px;
}

figure.imgLft img{
	display:block;
	width:100%;
	height:auto;
}

figure.zu1{
	width:810px;
	margin:0 auto 50px auto;
}

figcaption{
	font-size:12px;
	text-align:center;
	margin:5px 0;
}

/*-----會長挨拶のページ------*/
ul.past{
	width:870px;
	display:block;
	position:relative;
	margin-bottom:15px;
	clear:both;
	}
ul.past li.mg1{
	width:150px;
	float:left;
	margin-right:30px;
}
ul.past li.mg2{
	width:150px;
	float:left;
}


/*-----祝唄のページ------*/

	
.threelines{
	width:250px;
	padding:0 0 0 40px;
	float:left;
}


/*-----歴史ページのテーブル------*/
table#history{
	width:100%;
	border:solid 1px #333;
	font-size:14px;
	line-height:150%;
}
table#history tr th{
	border-right:solid 1px #333;
	border-bottom:solid 1px #333;
	background-color:#666;
	padding:10px;
	color:#FFF;
	font-size:16px;
}
table#history tr td.color1{
	border-right:solid 1px #333;
	border-bottom:solid 1px #333;
	background-color:#fff;
	padding:10px;
	text-align:center;
}
table#history tr td.color2{
	border-right:solid 1px #333;
	border-bottom:solid 1px #000;
	background-color:#E1E1E1;
	padding:10px;
	text-align:center;
}
table#history tr td.color3{
	border-right:solid 1px #333;
	border-bottom:solid 1px #333;
	background-color:#fff;
	padding:10px;
	text-align:left;
}
table#history tr td.color4{
	border-right:solid 1px #333;
	border-bottom:solid 1px #333;
	background-color:#E1E1E1;
	padding:10px;
	text-align:left;
}

/*-----組織紹介ページのテーブル------*/
div#member{
	width:870px;
	display:inline-block;
	}
	
	
table#name1{
	width:420px;
	font-size:14px;
	line-height:160%;
	margin-right:30px;
	float:left;
	border-collapse:collapse;
}
table#name1 tr th{
	width:140px;
	border-top:solid 1px #ccc;
	border-right:dashed 1px #ccc;
	border-bottom:solid 1px #ccc;
	text-align:left;
	padding:5px 5px 5px 10px;
}
table#name1 tr td{
	border-top:solid 1px #ccc;
	border-bottom:solid 1px #ccc;
	padding:5px 5px 5px 20px;
	text-align:left;
}
table#name2{
	width:420px;
	font-size:14px;
	line-height:160%;
	float:left;
	border-collapse:collapse;
}

table#name2 tr th{
	border-top:solid 1px #ccc;
	border-right:dashed 1px #ccc;
	border-bottom:solid 1px #ccc;
	text-align:left;
	padding:5px 5px 5px 10px;
}
table#name2 tr td{
	border-top:solid 1px #ccc;
	border-bottom:solid 1px #ccc;
	padding:5px 5px 5px 20px;
	text-align:left;
}

#member_profile{
	width:600px;
	margin:50px auto;
}

#member_profile figure{
	margin-bottom:15px;
	text-align:center;
}
#member_profile figcaption{
	font-size:24px;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-weight:bold;
	text-align:center;
}
#member_profile p{
	text-align:center;
}


/*-----担当部署ページのテーブル------*/

div.box_busho{
	width:870px;
	margin-bottom:10px;
	position:relative;
}

div.box_busho h3 {
	margin: 0 0 15px;
	font: bold 20px "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Helvetica, 'Arial', sans-serif;
	/*text-shadow: 0 1px 0 #2F4C63;*/
}


/* Footer
***********************/






@media screen and (max-device-width: 480px) {
/* Layout
***********************
#container {
	width:100%;
	margin:0 auto;
	padding: 0;}
header {
	width:100%;
	margin:80px auto 0 auto;
	}
#main {
	width:100%;
	margin:0 auto 50px auto;
	overflow: hidden;
	}
div#logo { padding:30px 0 20px;}
div#logo h1 { width:201px;
	position:relative;
	height:37px;
	margin: 0 auto;
	}
	
.slider { width:100%; margin: 0 auto 50px auto!important;}

/* Navigation
***********************
ul.top_menu{
	width:200px!important;
	margin:0 auto;
}
ul.top_menu li{
	width:200px!important;
	overflow: hidden;
	margin:0 auto;
}
ul.top_menu li a {
	position:relative;
	display:block;
	width:200px!important;
	background-repeat:no-repeat;
	background-position:left top;
	text-indent:-9999px;
	cursor: default; 
}
ul.top_menu li a:hover {
	background-position:left -30px;
	width:200px!important;
	z-index:1000;
}

#menu01 a {
	background-image:url(/images/share_iphone/menu01.gif);
}


/* Footer
***********************
#footerArea{
	width:100%;
	background:#DC0067;
	margin:0 auto;
}
	footer{
		width:96%;
		margin:0 auto;
		color:#FFF;
		font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Helvetica, 'Arial', sans-serif;
	}
	footer h2{
		font-weight:bold;
	}


}
