@charset "utf-8";
/* CSS Document */

body {
  font-size: 0.85em;
  text-align: center;
  font-family: "century";
  padding: 0 auto;
  margin: 10px auto;
  background-color: #ffffff; /* 両サイドの色 */
}

#wrapper {
  width: 1000px;
  margin: 0 auto;
  padding: 0 40px;
  text-align: left;
  background-color: #ffffff;/* 記事の背景色 */
  /*
  -webkit-box-shadow: 0px 0px 40px #000000;
  -0-box-shadow: 0px 0px 40px #000000;
  -moz-box-shadow: 0px 0px 40px #000000;
  box-shadow: 0px 0px 40px #000000;
  */
}

header {
  width: 1000px;
  margin: 0 auto;
}

header h1 {
  width: 260px;
  margin: 0 auto;
  float: left;
  clear: both;
}

header h2 {
  width: 260px;
  margin: 10px auto -10px;
  float: left;
  clear: both;
}

header h3 {
  width: 1260px;  /* widthの指定によってclearfixが作動する。 */
  margin: 5px 40px 10px 0px;
  float: left;
  clear: both;
} 

header h4 {
  width: 70px;
  margin: 25px -20px 0px 20px;
  float: right;
}


a:link {
  color: #ffffff;
  text-decoration: none;
}

a:visited {
  color: #ffffff;
  text-decoration: none;
}

a:hover {
  color: #ffffff;
  text-decoration: none;
}

/* --- ナビゲーションバー --- */
nav {
width: 540px; /* ナビゲーションの幅 */
margin: -35px 0 0 480px;
padding: 0px 0 0 0;
/* ナビゲーションの背景 */
font-size: 20px;
/*clear: both;*/ /* これがないとヘッダーに背景が被る */
float: left;
clear: both;
}

/* --- メニューエリア --- */
nav ul.nl {
width: 500px; /* メニューの幅 */
margin: 0px auto 0px;
padding: 0px 30px 0px 110px; /* メニューのパディング（上下、左右） */
list-style-type: none;
text-align: center;
font-weight: bold;
border-radius: 12px; /* ナビゲーションの角丸 */
}


/* --- メニュー項目 --- */
nav ul.nl li {
float: left;
}

/* --- 項目の幅（emで指定） --- */
nav ul.nl li.item1 {
width: 3.2em;
}
nav ul.nl li.item2 {
width: 4.2em;
}
nav ul.nl li.item3 {
width: 4.3em;
}
nav ul.nl li.item4 {
width: 3.5em;
}
nav ul.nl li.item5 {
width: 5.3em;
}
nav ul.nl li.item6 {
width:3.5em;
}

/* --- リンク ---カーソルを重ねたときのやつ */
nav ul.nl li a {
display: block;
position: relative; /* IE6用 */
padding: 1px 1px; /* リンクエリアのパディング（上下、左右） */
border-right: 1px solid #f5f5f5; /* リンクエリアの右境界線 */
border-left: 1px solid #f5f5f5;
text-decoration: none; /* テキストの下線（なし） */
}
/* --- リンクテキストの色 --- */
nav ul.nl li a:link,
nav ul.nl li a:visited,
nav ul.nl li a:hover,
nav ul.nl li a:active
{
color: #555555;
}
/* --- ポイント時の設定 --- */

/* --- clearfix --- */
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix {
min-height: 1px;
}

/*
nav ul.nl li a:hover {
background: rgb(204,102,0); 
text-decoration: underline;
}
*/

article {
 margin: 20px auto 0;
 width: 1000px;
 height: 1080px; /* 記事の長さね！！！！ */
 background-color: #ffffff; /* 記事（ヘッダーの下以降）の背景色(今、白色) */
}

.slider {
  position: relative;
  width: 100%;
  height: 480px;
  overflow: hidden;
}

.slides {
  height: 100%;
  /* Clear fix */
  overflow: hidden;
  *zoom: 1;
  /**	
   * Prevent blinking issue
   * Not tested. Experimental.
   */
  -webkit-backface-visibility: hidden;
  -webkit-transform-style: preserve-3d;
  /**
   * Here is CSS transitions 
   * responsible for slider animation in modern broswers
   */
  -webkit-transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
  -moz-transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
  -o-transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1);
}

.slide {
  height: 100%;
  float: left;
  clear: none;
}

.slider-arrow {
  position: absolute;
  display: block;
  margin-bottom: -20px;
  padding: 20px;
}

.slider-arrow--right {
  bottom: 50%;
  right: 30px;
}

.slider-arrow--left {
  bottom: 50%;
  left: 30px;
}

.slider-nav {
  position: absolute;
  bottom: 30px;
}

.slider-nav__item {
  width: 12px;
  height: 12px;
  float: left;
  clear: none;
  display: block;
  margin: 0 5px;
  background: #fff;
}

.slider-nav__item:hover {
  background: #ccc;
}

.slider-nav__item--current {
  background: #ccc;
}

		
/* お知らせ */

#contact {
 width: 100%;
 margin: -25px auto 0;
 font-size: 18px;
 color: #444444; /* 日付の字色 */
 float: left;
 background-color: #ffffff;
}

#contact h2{
 font-size: 28px;
 padding: 10px 0px 10px 5px;
 width: 100%;
 margin: 8px auto 0px;
 color: #444444; /* 日付の字色 */
 float: left;
 background-color: #ffffff;
 border-top: solid 2.5px;
 border-bottom: solid 1px;
}

#sns{
 width: 700px;
 margin: 20px 0 0 20px;
 font-size: 25px;
}

#sns ul li{
 list-style-type: none;
}

#sns ul li a {
display: block;
position: relative; /* IE6用 */
padding: 7px 7px; /* リンクエリアのパディング（上下、左右） */
text-decoration: none; /* テキストの下線（なし） */
}

#sns ul li a:link,
#sns ul li a:visited,
#sns ul li a:hover,
#sns ul li a:active
{
color: #555555;
}

#form1 {
 margin: 70px auto 10px;
}

form {
    /* フォームの位置 */
    margin: 50px 0 20px 20px;
    width: 850px;
    /* フォームの範囲がわかるようにする */
    padding: 1em;
    border: 1px solid #CCC;
    border-radius: 1em;
}

form div + div {
    margin-top: 1em;
}

label {
    /* すべてのラベルを同じサイズにして、きちんと揃える */
    display: inline-block;
    width: 90px;
    text-align: left;
}

input, textarea {
    /* すべてのテキストフィールドのフォント設定を一致させる
       デフォルトで、textarea は等幅フォントが設定されている */
    font: 1em sans-serif;

    /* すべてのテキストフィールドを同じサイズにする */
    width: 750px; /* 入力欄の幅の長さ！！！ */
    -moz-box-sizing: border-box;
    box-sizing: border-box;

    /* テキストフィールドのボーダーの外見を同一にする */
    border: 1px solid #999;
}

input:focus, textarea:focus {
    /* アクティブな要素を少し強調する */
    border-color: #000;
}

textarea {
    /* 複数行のテキストフィールドをラベルにきちんと揃える */
    vertical-align: top;

    /* テキスト入力に十分な領域を与える */
    height: 400px;

    /* ユーザが textarea を垂直方向にリサイズできるようにする
       これが動作しないブラウザもある */
    resize: vertical;
}

.button {
    /* ボタンを他のテキストフィールドと同じ場所に置く */
    padding-left: 90px; /* label 要素と同じサイズ */
}

button {
    /* このマージンは、ラベルとテキストフィールドの間のスペースと
       おおよそ同じスペースを表す */
	font-size: 18px;
	width: 100px;
    margin-left: 10px; /* ボタンの位置的な！！ */
	border-radius: 7px;
}

footer{
 color: #333333;
 margin: 0 auto;
}

#footer-inner{
 margin: 0px 20px;	
}

/* --- ナビゲーションバー --- */
#footer-nav {
width: 1000px; /* ナビゲーションの幅 */
margin: 0 auto;

/* ナビゲーションの背景 */
font-size: 20px;
font-weight: bold;
/*
border-bottom: 1px solid #333333;
*/
padding-bottom: 10px;
}

/* --- メニューエリア --- */
#footer-nav ul.nl {
width: 1000px; /* メニューの幅 */
margin: 0 auto;
padding: 1px 30px 1px 160px; /* メニューのパディング（上下、左右） */
list-style-type: none;
text-align: center;
}

/* --- メニュー項目 --- */
#footer-nav ul.nl li {
float: left;
}

/* --- 項目の幅（emで指定） --- */
#footer-nav ul.nl li.item1 {
width: 5.2em;
}
#footer-nav ul.nl li.item2 {
width: 8.5em;
}
#footer-nav ul.nl li.item3 {
width: 7.3em;
}
#footer-nav ul.nl li.item4 {
width: 6.5em;
}
#footer-nav ul.nl li.item5 {
width: 7.3em;
}
#footer-nav ul.nl li.item6 {
width:6.5em;
}

/* --- リンク ---カーソルを重ねたときのやつ */
#footer-nav ul.nl li a {
display: block;
position: relative; /* IE6用 */
padding: 7px 7px; /* リンクエリアのパディング（上下、左右） */
text-decoration: none; /* テキストの下線（なし） */
}
/* --- リンクテキストの色 --- */
#footer-nav ul.nl li a:link,
#footer-nav ul.nl li a:visited,
#footer-nav ul.nl li a:hover,

#footer-nav ul.nl li a:active
{
color: #555555;
}
/* --- ポイント時の設定 --- */

/*
nav ul.nl li a:hover {
background: rgb(204,102,0); 
text-decoration: underline;
}
*/

small{
 font-size:1em;
 text-align: center;
}