@charset "utf-8";

/*PC・タブレット・スマホ共通設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*全体の設定
---------------------------------------------------------------------------*/
body { margin:0px; padding:0px; color:#666; font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size:15px; line-height:2; -webkit-text-size-adjust:none; background:#fff;}

h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure,form {margin:0px;padding:0px;font-size:100%;}
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:#666; -webkit-transition:0.5s; transition:0.5s;}
a:hover { color:#65c5f2; text-decoration:none;}

/*コンテナー（ホームページ全体を囲むブロック）
---------------------------------------------------------------------------*/
#container { overflow-x:hidden;}

/*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
header { max-width:1200px; position:relative; z-index:1; margin:0 auto; height:110px; text-align:center; top:1px;}

/*ロゴ画像*/
#logo img {width:600px; padding-top:10px; padding-bottom:5px;}

/*---メインスライド---*/
.sl{width:600px; height:280px;}

/*メインメニュー
---------------------------------------------------------------------------*/
/*メニューブロックの設定*/
#menubar { max-width:900px; position:relative; z-index:2; margin:0 auto; background:#fff; background:rgba(255,255,255,0.9); height:45px; padding:5px 0;}

/*トップページのメニューブロックの設定*/
#top #menubar { border-radius:10px;  -webkit-box-shadow:2px 5px 8px rgba(0,0,0,0.2);  box-shadow:2px 5px 8px rgba(0,0,0,0.2);}

#menubar li { float:left; width:13.5%;}
#menubar li a { text-decoration:none; display:block; text-align:center; line-height:45px; border-right:1px dashed #ccc;}

/*１メニューの設定*/
#menubar li:first-child { margin-left:2.8%;}
#menubar li:first-child a { border-left:1px dashed #ccc;}

#menubar li a:hover,
#menubar li.current a {color:#333631/*#3399FF*/; background:#ffdbed/*#c7dc68*/;}

/*小さい端末用(画面幅800px以下)メニューを表示させない*/
#menubar-s { display:none;}

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

/*コンテンツ
---------------------------------------------------------------------------*/
.contents {clear:both; max-width:1200px; overflow:hidden; padding:20px 0; margin-left:auto; margin-right:auto; margin-top:200px;}

/*メインコンテンツ
---------------------------------------------------------------------------*/
/*メインコンテンツブロック*/
.main { width:98%; margin-left:auto; margin-right:auto;}

#table,
#table2 { width:100%; margin-left:auto; margin-right:auto; list-style-type:none;}

#table td,
#table2 td{ vertical-align:top; text-align:center;}

.ri{ margin-top:15px; padding-left:8px;}

/*pagetop設定
---------------------------------------------------------------------------*/
#pagetop { clear:both; max-width:1200px; margin:0 auto;}

#pagetop a { text-decoration:none; text-align:center; display:block; float:right; color:#333631; font-size:20px; padding:0px 30px; background:#ffdbed; border-radius:4px 4px 0px 0px;}

/*マウスオン時*/
#pagetop a:hover { background:#999; color:#fff;}

/*フッター設定
---------------------------------------------------------------------------*/
footer { clear:both; background:#ffe6fb/*#c7dc68*/; color:#333631/*#3366FF*/; text-align:center;}
footer a { color:#fff; text-decoration:none;}
footer a:hover { color:#fff;}

footer .pr { display:block; font-size:80%;}

/*画面幅1300px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:1200px){

/*全体の幅を一括設定
---------------------------------------------------------------------------*/
header,#menubar,.contents,#pagetop { margin:0 3%;}

.contents { margin-left:auto; margin-right:auto; margin-top:100px;}

}


/*画面幅800px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:800px){

/*メインメニュー
---------------------------------------------------------------------------*/
/*メニューブロックの設定*/
#menubar-s { display:block; position:relative; z-index:3; padding-top:15px;}
#top #menubar-s { margin-top:90px;}

/*---メインスライド---*/
.sl{ width:90%;}

/*メニュー１個あたりの設定*/
#menubar-s li { float:left; width:48%; margin:0 1% 10px 1%;}

#menubar-s li a { text-decoration:none; display:block; text-align:center; line-height:50px; border:1px solid #666; border-radius:10px;}

/*大きな端末用(画面幅801px以上)メニューを非表示にする*/
#menubar { display:none;}

/*３本バーアイコン設定
---------------------------------------------------------------------------*/
/*３本バーブロック*/
#menubar_hdr { display:block; z-index:4; position:absolute; top:25px; right:3%; width:30px; border:1px solid #000; padding:12px 10px 5px;}

#top #menubar_hdr { border:1px solid #000;}

/*３本のバー（1本あたり）*/
#menubar_hdr span { display:block; border-top:3px solid #000; margin-bottom:7px;}

#top #menubar_hdr span { border-top:3px solid #000;}

#table,
#table2 { width:90%; margin-left:auto; margin-right:auto; list-style-type:none;}

#table tbody,
#table2 tbody{ display:block;}

#table tbody tr,
#table2 tbody tr{ display:block; margin-bottom:1.5em;}

#table tbody td,
#table2 tbody td{ display:list-item; border:none; margin-left:5px; padding-left:3px; text-align:left;}
}

/*画面幅600px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:600px){
#top #menubar-s { margin-top:35px;}

/*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
header { text-align:left;}

#logo img { width:300px; padding-top:38px;}

#table tbody,
#table2 tbody{ display:block;}

#table tbody tr,
#table2 tbody tr{ display:block; margin-bottom:1.5em;}

#table tbody td,
#table2 tbody td{ display:list-item; border:none; margin-left:5px; padding-left:3px; text-align:left;}

}

/*画面幅480px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:480px){

/*全体の設定
---------------------------------------------------------------------------*/
body { font-size:12px; line-height:1.6;}

#subimg { width:200%; position:relative; left:-50%;}

#top #menubar-s { margin-top:35px;}

/*---メインスライド---*/
.sl{ width:90%;}

/*コンテンツ
---------------------------------------------------------------------------*/
.contents { padding:10px 0;}

#table tbody,
#table2 tbody{ display:block;}

#table tbody tr,
#table2 tbody tr{ display:block; margin-bottom:1.5em;}

#table tbody td,
#table2 tbody td{ display:list-item; border:none; margin-left:5px; padding-left:3px; text-align:left;}

}