/*----------------------------------------------*/
/*   全体の設定                                 */
/*----------------------------------------------*/
body {
	margin: 0px;
	padding: 0px;
	color: #333;	                                                /*全体の文字色*/
	font-family: "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro",
                     "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",
                     "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック",
                     "MS PGothic", sans-serif;	                        /*フォント種類*/
	font-size: 18px;                          	                /*文字サイズ*/
	line-height: 2;		                                        /*行間*/
	background: #fff;	                                        /*背景色*/
	-webkit-text-size-adjust: none;
      }

h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure,form {margin: 0px;padding: 0px;font-size: 100%;font-weight: normal;}
ul {list-style-type: none;}
ol {padding-left: 40px;padding-bottom: 15px;}
img {border: none;max-width: 100%;height: auto;vertical-align: middle;}
table {border-collapse:collapse;font-size: 100%;border-spacing: 0;}
iframe {width: 100%;}

/*----------------------------------------------*/
/*  リンク（全般）設定                          */
/*----------------------------------------------*/
a {
	color: #333;	                                         	/*リンクテキストの色*/
	transition: 0.2s;	                                        /*マウスオン時の移り変わるまでの時間設定。0.2秒*/
   }

a:hover {
	color: #33a5d5;			                                /*マウスオン時の文字色*/
	text-decoration: none;                                   	/*マウスオン時に下線を消す設定。残したいならこの１行削除*/
        }

/*----------------------------------------------*/
/*  コンテナー（ホームページを囲むブロック）    */
/*----------------------------------------------*/
#container {
	max-width: 1500px;               	                        /*slide.cssの「#mainimg, #subimg」と設定と合わせる*/
	margin: 0 auto;
	border-top: 4px solid #33a5d5;	                                /*一番上に入っているアクセントライン。幅、線種、色*/
           }



/*----------------------------------------------*/
/*  ヘッダー                                    */
/*----------------------------------------------*/

/* ヘッダーブロック */
header {
	position: relative;z-index: 1;
	height: 100px;	                                                /*ヘッダーの高さ*/
	background: #affeee;	                                        /*背景色*/
        }

/* ロゴ画像 */
header #logo img {
	width: 300px;                                            	/*画像幅*/
	position: absolute;
	left: 15%;		                                        /*ヘッダーに対して左からxx%の場所に配置*/
	top: 20px;	                                                /*ヘッダーに対して上からxxpxの場所に配置*/
                  }

/*----------------------------------------------*/
/*メインメニュー                                */
/*----------------------------------------------*/

/*メニューブロック*/
#menubar {
	clear: both;position: relative;z-index: 1;
	margin-left: 5%;	                                       /*左に空けるスペース*/
	margin-top: 8%;		                                       /*上に空けるスペース。この部分にイメージ画像が表示されます*/
         }    
     
/*トップページのメニューブロック*/
body.home #menubar {
	margin-top: 33%;                                               /*上に空けるスペース。この部分にスライドショーが表示されます*/
                    }

/*メニュー１個あたりの設定*/
#menubar li {
	float: left;	                                               /*左に回り込み*/
	width: 15%;		                                       /*メニュー幅*/
	margin: 0.4% 0.2%;	                                       /*メニュー同士の上下・左右間の余白*/
	border: 1px solid #666;　                                      /*枠線の幅、線種、色*/
            }

#menubar li a {
	display:  block;text-decoration: none;position: relative;
	text-align: center;	                                       /*内容をセンタリング*/
	padding: 15px 0;	                                       /*上下、左右へのボックス内の余白*/
	background: #fff;	                                       /*背景色（古いブラウザ用）*/
	background: rgba(255,255,255,0.85);	                       /*背景色。255,255,255は白の事で0.85は85%色がついた状態の事。*/
              }

/*飾り文字*/
#menubar li span {
	display: block;
	font-size: 60%;		                                       /*文字サイズ*/
	color: #33a5d5;		                                       /*文字色*/
	letter-spacing: 0.2em;	                                       /*文字間隔を少し広くとる設定*/
                 }

/*飾り文字のマウスオン時、現在表示中(current)時*/
#menubar li a:hover span,
#menubar li.current a span {
	color: #fff;		                                       /*文字色*/
                           }

/*メニュー下の「▼」マーク。吹き出し風に。*/
#menubar li.current a span::after {
	content: "▼";	                                               /*このテキストを表示します。*/
	color: #33a5d5;	                                               /*色*/
	font-size: 20px;	                                       /*サイズ*/
	position: absolute;
	bottom: -22px;	                                               /*下側に22px下げる*/
	left: 45%;		                                       /*左から45%の場所に配置*/
                                   }

/*マウスオン時と、現在表示中(current)メニューの設定*/
#menubar li a:hover {
	background: #ffa500;	                                       /*背景色*/
	color: #fff;	  	                                       /*文字色*/
	padding: 15px 0;	                                       /*上下、左右へのボックス内の余白*/
                      }

#menubar li.current a {
	background: #33a5d5;	                                       /*背景色*/
	color: #fff;	  	                                       /*文字色*/
	padding: 15px 0;	                                       /*上下、左右へのボックス内の余白*/
                      }

/*スマホ用メニューを表示させない*/
#menubar-s {display: none;}

/*３本バーアイコンを表示させない*/
#menubar_hdr {display: none;}


/*----------------------------------------------------*/
/*コンテンツ。メニューの下にある白い背景色のブロック。*/
/*----------------------------------------------------*/
#contents {
	clear: both;overflow: hidden;position: relative;
	background: #ffebcd;	                                       /*背景色*/
	padding: 5% 3%;		                                       /*上下、左右へのボックス内の余白*/
	margin: 0 3% 50px;	                                       /*上、左右、下へのボックスの外側への余白*/
          }

/*h2タグ*/
#contents h2 {
	clear: both;
	margin-bottom: 40px;	                                       /*下に空けるボックスの外側への余白*/
	font-size: 250%;		                               /*文字サイズ*/
	text-align: center;		                               /*文字を中央に*/
	line-height: 1.5;		                               /*行間を基準より少し狭くする*/
             }
/*h2タグ内のspanタグ（英語の飾り文字）*/
#contents h2 span {
	display: block;
	font-size: 40%;	                                                /*文字サイズ*/
	color: #33a5d5;	                                                /*文字色*/
	letter-spacing: 0.2em;	                                        /*文字間隔を少し広くとる設定*/
                  }

/*h3タグ*/
#contents h3 {
	clear: both;
	margin-bottom: 30px; 	                                       /*下に空けるボックスの外側への余白*/
	text-align: center;		                               /*文字を中央に*/
	font-size: 130%;		                               /*文字サイズ*/
	border-radius: 50px;	                                       /*角丸のサイズ*/
	border: 1px solid #666;	                                       /*枠線の幅、線種、色*/
	padding: 0 50px;	                                       /*上下、左右へのボックス内の余白*/
              }

/*----------------------------------------------*/
/*フッターメニュー                              */
/*----------------------------------------------*/
/*ボックス全体*/
#footermenu {
	overflow: hidden;
	padding: 20px 3%;	/*上下、左右へのボックス内の余白*/
	background: url(../images/icon_logo.png) no-repeat right center / auto 80%;	/*フッター右側のロゴマークの設定。*/
            }

/*１行分の設定*/
#footermenu ul {
	float: left;	                                               /*左に回り込み*/
	width: 18%;		                                       /*幅*/
	padding-right: 1%;	                                       /*左に空ける余白*/
	padding-left: 1%;	                                       /*右に空ける余白*/
	text-align: left;
	line-height: 1.7;	                                       /*行間を狭くする*/
               }

/*class="title"とつけた場合の設定*/
#footermenu ul li.title a {
	font-weight: bold;	                                       /*太字にする*/
	opacity: 1;	                                               /*色が100%出た状態にする*/
                          }

/*リンクテキストの設定*/
#footermenu a {
	text-decoration: none;
	opacity: 0.7;	                                               /*透明度。70%の色がついた状態。*/
              }

/*リンクのマウスオン時*/
#footermenu a:hover {
	opacity: 1;		                                       /*透明度。100%の色がついた状態。*/
                     }


/*----------------------------------------------*/
/*フッター設定                                  */
/*----------------------------------------------*/
footer {
	clear: both;
	text-align: center;		                               /*文字を中央に*/
	font-size: 70%;			                               /*文字サイズ*/
	background: #33a5d5;	                                       /*背景色*/
       }

/*リンクテキスト*/
footer a {color: #fff;}
footer a:hover {color: #fff;}

/*著作部分*/
footer .pr {display: block;}


/*----------------------------------------------*/
/*コピーライト                                  */
/*----------------------------------------------*/
#copyright {
	clear: both;
	text-align: center;
	background: #333;	                                       /*背景色*/
	color: #fff;		                                       /*文字色*/
            }
#copyright a {text-decoration: none;}


/*----------------------------------------------*/
/*その他                                        */
/*----------------------------------------------*/
body.s-n #sub,body.s-n #footermenu,.m-n {display: none;}
.big1 {font-size: 20px;}
.w50 {overflow: hidden;width: auto;}
.fl {float: none;}
.fr {float: none;}
.sh {display:block;}
.pc {display:none;}

