@charset "utf-8"; /* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html -------------------------------------------------------------- */ 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, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {border: 0;font-family: inherit;font-size: 100%;font-style: inherit;font-weight: inherit;margin: 0;outline: 0;padding: 0;vertical-align: baseline;} :focus {outline: 0;} ol, ul {list-style: none;} table {border-collapse: separate;border-spacing: 0;} caption, th, td {font-weight: normal;text-align: left;} blockquote:before, blockquote:after,q:before, q:after {content: "";} blockquote, q {quotes: "" "";} a img {border: 0;} article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;} body{ font:80%/1.5 "Lucida Sans Unicode", "Lucida Grande", Arial, "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","MS Pゴシック",sans-serif; color:#252525; -webkit-text-size-adjust: none; background:#fff; } /* リンク設定 ------------------------------------------------------------*/ a{ margin:0; padding:0; text-decoration:none; outline:0; vertical-align:baseline; background:transparent; font-size:100%; color:#777; } a:hover, a:active{ -webkit-transition:opacity 1s;-moz-transition:opacity 1s;-o-transition:opacity 1s; outline: none; color:#999; } /**** Clearfix ****/ nav .panel:after, nav#mainNav:after, .newsTitle:after, .bg:after,.post:after{content:""; display: table;clear: both;} nav .panel,nav#mainNav,.newsTitle,.bg, .post{zoom: 1;} /* フォーム ------------------------------------------------------------*/ input[type="text"], textarea{ vertical-align:middle; max-width:90%; line-height:30px; height:30px; padding:1px 5px; border:1px solid #d4d4d7; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; font-size:100%; color:#555; background:#fcfcfc; } textarea{ height:auto; line-height:1.5; } input[type="submit"],input[type="reset"],input[type="button"]{ padding:3px 10px; background: #d7dbde; border:0; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; line-height:1.5; font-size:100%; color:#fff; } input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover{ background: #e6eaed; } *:first-child+html input[type="submit"]{padding:3px;} /* レイアウト ------------------------------------------------------------*/ #wrapper, .inner{ margin:0 auto; width:960px; } #header{ overflow:hidden; background:#fff; } #content{ float:left; width:710px; padding:30px 0; } #sidebar{ float:right; width:225px; padding:30px 0; } #footer{ clear:both; padding-top:20px; background:#ededed; } /* ヘッダー *****************************************************/ #header .bg{background:#d7dbde;} /* サイト説明文 + 住所 ----------------------------------*/ #header h1,#header p{ float:left; padding:3px 0; color: #fff; font-size:80%; font-weight:normal; } #header p{ float:right; } /* ロゴ (サイトタイトル) ----------------------------------*/ #header h2{ clear:both; float:left; padding:30px 0; color: #515151; font-size:160%; font-weight:bold; } /* サブナビゲーション ----------------------------------*/ #header ul{ padding-top:40px; float:right; } #header ul li{ display:inline; margin-left:10px; font-size:90%; } #header ul li a{ padding-left:10px; color:#000; background:url(images/arrowSub.png) no-repeat 0 50%; } #header ul li a:hover{background-position:3px 50%;} /* トップページ メイン画像 ----------------------------------*/ #mainImg{ clear:both; margin-top:25px; line-height:0; text-align:center; z-index:0; position:relative; } .post{ margin:0 0 20px 0; padding:10px; border:1px solid #dadada; background: #fff; } /* タイポグラフィ *****************************************************/ h2.title{ clear:both; margin:30px 0 0; padding:7px 10px; font-size:110%; border:1px solid #dadada; border-bottom:0; background:#fff url(images/border.png) repeat-x 0 100%; } h2.first{margin-top:0;} .dateLabel{ margin:0 0 10px; text-align:right; font:italic 1em "Palatino Linotype", "Book Antiqua", Palatino, serif; } .post p{padding-bottom:15px;} .post ul{margin: 0 0 10px 10px;} .post ul li{ margin-bottom:5px; padding-left:15px; background:url(images/bullet.png) no-repeat 0 8px; } .post ol{margin: 0 0 10px 30px;} .post ol li{list-style:decimal;} .post h1{ margin:20px 0; padding:5px 0; font-size:150%; color: #000; border-bottom:3px solid #000; } .post h2{ margin:10px 0; padding-bottom:2px; font-size:130%; font-weight:normal; color: #333; border-bottom:2px solid #515151; } .post h3{ margin:10px 0; font-size:120%; font-weight:normal; color:#214a78; border-bottom:1px solid #515151; } .post blockquote { clear:both; padding:10px 0 10px 15px; margin:10px 0 25px 30px; border-left:5px solid #ccc; } .post blockquote p{padding:5px 0;} .post table{ border: 1px #214a78 solid; border-collapse: collapse; border-spacing: 0; margin:10px 0 20px; } .post table th{ padding:7px 10px 7px 5px; border: #214a78 solid; border-width: 0 0 1px 1px; font-weight:bold; color:#fff; background:#214a78; } .post table td{ padding:7px 5px; border: 1px #214a78 solid; border-width: 0 0 1px 1px; background:#fff; } .post dt{font-weight:bold;} .post dd{padding-bottom:10px;} .post img{max-width:100%;height:auto;} img.aligncenter { display: block; margin:5px auto; } img.alignright, img.alignleft{ padding:4px; margin:0 0 2px 7px; display:inline; } img.alignleft{margin: 0 7px 2px 0;} .alignright{float:right;} .alignleft{float: left;} /* サイドバー ウィジェット *****************************************************/ section.widget, .widgetInfo{ margin: 0 0 20px; padding: 10px 7px; border:1px solid #dadada; background: #fff; } #banners img{ max-width:225px; height:auto; padding-bottom:10px; } section.widget h3{ clear:both; margin:0 0 10px; padding:5px 0; font-size:100%; font-weight:normal; color: #333; border-bottom:1px solid #ccc; } section.widget a{ display:block; padding:3px 0 3px 13px; text-decoration:underline; background:url(images/arrow.png) no-repeat 0 50%; } section.widget a:hover{ text-decoration:none; background-position: 3px 50%; } #searchform input[type="text"]{ line-height:1.7; height:24px; width:100px; vertical-align:bottom; } /* お知らせ  -------------*/ .newsTitle{ clear:both; margin:0 0 20px; padding:5px 0; font-size:100%; color: #333; border-bottom:1px solid #ccc; } .newsTitle h3{ float:left; font-weight:normal; } .newsTitle p{ float:right; padding:0 0 0 10px; font-size:.8em; background:url(images/arrow.png) no-repeat 0 50%; } .news p{ clear:both; padding-bottom:2px; border-bottom: 1px solid #ccc; } .news p:last-child{border:0;} .news p a{ display:block; padding:5px 0; color:#333; font-style:italic; font:italic 110% "Palatino Linotype", "Book Antiqua", Palatino, serif; } .news a span{ color:#515151; font:normal 90% Arial, 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','MS Pゴシック',sans-serif; } .news span{padding-left:10px;} .news a:hover span{color:#777;} /* フッター *****************************************************/ #footer ul{ font-size:12px; padding:10px 0 30px 0; } #footer ul li{ display:inline-block; vertical-align:text-top; text-align:left; padding:5px 0; margin-right:30px; background:url(images/arrow.png) no-repeat 0 12px; } #footer ul li a{ display:block; padding:0 0 0 12px; overflow:hidden; } #footer ul li a:hover{text-decoration:underline;} #footer ul li li{ display:block; padding:0; margin:0 0 0 10px; background-position:0 5px; } *:first-child+html #footer ul li{display:inline;} *:first-child+html #footer ul ul,*:first-child+html #footer ul li li a,*:first-child+html #footer ul li li{display:none;} #copyright{ clear:both; padding:10px; text-align:center; font-size:75%; zoom:1; color:#a0a0a0; background:#ebebeb; } /* page navigation ------------------------------------------------------------*/ .pagenav{ clear:both; width: 100%; height: 30px; margin: 5px 0 20px; } .prev{float:left} .next{float:right;} #pageLinks{ clear:both; color:#2a588b; text-align:center; } /* トップページ 最新記事3件 ------------------------------------------------------------*/ .thumbWrap{ width:735px; margin:20px -25px 20px 0; } .thumbWrap li{ float:left; width: 220px; margin:0 25px 0 0; padding:2px 0 40px; background:none; } /* 最新記事リンク */ ul.thumb h3{ margin-top:10px; padding:1px; font-weight:normal; font-size:100%; text-align:center; background:#25252; border:1px solid #dadada; } ul.thumb h3 span{ display:block; padding:2px 3px; background:#f8f8f8; } ul.thumb h3 a{color:#252525;} ul.thumb h3:hover span{background:#fff;} /* メインメニュー PC用 ------------------------------------------------------------*/ @media only screen and (min-width: 1025px){ nav div.panel{ display:block !important; float:left; } a#menu{display:none;} nav#mainNav{ clear:both; position:relative; z-index:200; } nav#mainNav ul li{ float: left; position: relative; border-right:1px dotted #ccc; } nav#mainNav ul li:first-child{border-left:1px dotted #ccc;} nav#mainNav ul li a{ display: block; text-align: center; _float:left; color:#333; height:34px; line-height:34px; padding:12px 40px 5px; } nav#mainNav ul li a span,nav#mainNav ul li a strong{ display:block; font-size:90%; line-height:1.4; } nav#mainNav ul li a span{ font-size:70%; color:#d7dbde; } nav#mainNav ul li.current-menu-item a, nav#mainNav ul li a:hover, nav#mainNav ul li a:active, nav#mainNav ul li.current-menu-parent a{ background:#f8f8f8; } nav#mainNav ul ul{width:160px;} nav#mainNav ul li ul{display: none;} nav#mainNav ul li:hover ul{ display: block; position: absolute; top:50px; left:-2px; z-index:500; } nav#mainNav ul li li{ padding:0 0 0 10px; margin:0; float: none; height:40px; line-height:40px; width:160px; background:#f8f8f8; border:0; border-bottom:1px dotted #ccc; } nav#mainNav ul li li:first-child{border-left:0;} nav#mainNav ul li li a{ width:100%; height:40px; padding:0; line-height:40px; font-size:95%; text-align:left; } nav#mainNav ul li li a span{padding:0 10px;} nav#mainNav ul li li a:hover,nav#mainNav ul li li.current-menu-item a{color:#d7dbde;} nav#mainNav ul li:hover ul li:last-child{border:0;} } /* メインメニュー iPadサイズ以下から ------------------------------------------------------------*/ @media only screen and (max-width:1024px){ nav#mainNav{ clear:both; width:100%; margin:10px auto; background:#d7dbde; border-top:1px dotted #ccc; border-bottom:1px dotted #ccc; } nav#mainNav a.menu{ width:100%; display:block; height:37px; line-height:37px; font-weight: bold; text-align:left; color:#fff; background: url(images/menuOpen.png) no-repeat 5px 8px; } nav#mainNav a#menu span{padding-left:35px;} nav#mainNav a.menuOpen{ background: url(images/menuOpen.png) no-repeat 5px -34px; } nav#mainNav a#menu:hover{cursor:pointer;} nav .panel{ display: none; width:100%; position: relative; right: 0; top:0; z-index: 1; } nav#mainNav ul{margin:0;padding:0;} nav#mainNav ul li{ float: none; clear:both; width:100%; height:auto; line-height:1.2; } nav#mainNav ul li:first-child{border-top:1px solid #d5d5d5;} nav#mainNav ul li li:first-child{border-top:0;} nav#mainNav ul li a,nav#mainNav ul li.current-menu-item li a{ display: block; padding:15px 10px; text-align:left; border-bottom:1px dashed #ccc; background:#fff; } nav#mainNav ul li:last-child a{border:0;} nav#mainNav ul li li:last-child a{border:0;} nav#mainNav ul li li:last-child a{border-bottom:1px dashed #ccc;} nav#mainNav ul li a span{display:none;} nav#mainNav ul li.current-menu-item a,nav#mainNav ul li a:hover,nav#mainNav ul li.current-menu-item a,nav#mainNav ul li a:active, nav#mainNav ul li li.current-menu-item a, nav#mainNav ul li.current-menu-item li a:hover, nav#mainNav ul li.current-menu-item li a:active{ background:#fbfbfc; } nav#mainNav ul li li{ float:left; border:0; } nav#mainNav ul li li a, nav#mainNav ul li.current-menu-item li a, nav#mainNav ul li li.current-menu-item a{ padding-left:40px; background:#fff url(images/sub1.png) no-repeat 20px 18px;} nav#mainNav ul li li.current-menu-item a,nav#mainNav ul li li a:hover, nav#mainNav ul li.current-menu-item li a:hover{ background:#fbfbfc url(images/sub1.png) no-repeat 20px -62px;} nav#mainNav ul li li:last-child a{background:#fff url(images/subLast.png) no-repeat 20px 20px;} nav#mainNav ul li li:last-child.current-menu-item a,nav#mainNav ul li li:last-child a:hover,nav#mainNav ul li.current-menu-item li:last-child a:hover{background:#fbfbfc url(images/subLast.png) no-repeat 20px -65px;} nav div.panel{float:none;} #mainImg{margin-bottom:20px;} } /* 959px以下から 1カラム表示 ------------------------------------------------------------*/ @media only screen and (max-width: 959px){ #wrapper, #header, .inner{width:100%;} #header h1, #header p{padding:5px 10px;} #header h2{padding:20px 10px 0;} #header ul{padding:20px 10px 10px;} nav#mainNav ul, .thumbWrap{margin:0 auto;} nav#mainNav ul ul{padding:0;} nav div.panel{float:none;} #mainImg img{width:98%;height:auto;} #content, #sidebar{ clear:both; width:95%; float:none; margin:0 auto; padding:10px 0; } #banners{width:100%;margin:0 auto;text-align:center;} #banners p{display:inline;margin:0 10px;} #banners p img{width:100%;height:auto;} section.widget_search{text-align:center;} #footer{margin:0;border:0;text-align:center;} #footer ul{ text-align:center; } #footer ul li{margin-right:20px;} .thumbWrap{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; width:100%; margin:0 auto; padding-top:20px; overflow:auto; border:1px solid #dadada; } .thumbWrap ul.thumb li{width:30%; float:left;margin:0 1% 0 2%;} .thumbWrap img{width:100%;height:auto;} } /* 幅644px以下から ヘッダー等微調節 ------------------------------------------------------------*/ @media only screen and (max-width: 644px){ #header{text-align:center;} #header h2,#header ul{float:none;} #headerInfo{width:250px;margin:0 auto;} img.alignright, img.alignleft{display: block; margin:5px auto;} .alignright,.alignleft{float:none;} #footer ul{text-align:left;padding:15px;} #footer ul ul{padding:0;} }