body { margin:0; padding:0; background-color:#036; } h1,h2,h3,h4,h5 { margin:0; padding:0; } h2 { padding:5px 20px; color:#eee; font-size:2.4em; background-color:#333; } /* h3 { margin:1em 0 0.3em; padding:5px 15px; color:#fff; font-size:1.6em; background-color:#369; border-bottom:6px solid #036; } */ h3 { height:41px; margin:1em 0 0.3em; padding:9px 0 0 50px; color:#fff; font-size:1.1em; text-align:left; letter-spacing:0.2em; border:none; background:transparent url(./images/h_700x50.jpg) no-repeat left top; } h4 { margin:1em 0 0.3em; padding:5px; color:#333; font-size:1.2em; border-bottom:1px dashed #ccc; } h5 { color:#333; font-size:1.2em; } a, a:link { color:#36c; text-decoration:none; } a:visited { color:#36c; text-decoration:none; } a:active { color:#93c; text-decoration:none; } a:hover { color:#93c; text-decoration:underline; } p { text-indent:1em; } /* 960px (10px + 940px + 10px) 940px = 700px + 20px + 220px 700px = 340px + 20px + 340px 960px = 120px ( 100px + 20px) * 8columns -- 960px = 60px ( 40px + 20px) * 16columns */ .grid1 { float:left; width: 40px; padding:0 20px 20px 0; } .grid2 { float:left; width:100px; padding:0 20px 20px 0; } .grid3 { float:left; width:160px; padding:0 20px 20px 0; } .grid4 { float:left; width:220px; padding:0 20px 20px 0; } .grid5 { float:left; width:280px; padding:0 20px 20px 0; } .grid6 { float:left; width:340px; padding:0 20px 20px 0; } .grid7 { float:left; width:400px; padding:0 20px 20px 0; } .grid8 { float:left; width:460px; padding:0 20px 20px 0; } .grid9 { float:left; width:520px; padding:0 20px 20px 0; } .grid10 { float:left; width:580px; padding:0 20px 20px 0; } .grid11 { float:left; width:640px; padding:0 20px 20px 0; } .grid12 { float:left; width:700px; padding:0 20px 20px 0; } .grid13 { float:left; width:760px; padding:0 20px 20px 0; } .grid14 { float:left; width:820px; padding:0 20px 20px 0; } .grid15 { float:left; width:880px; padding:0 20px 20px 0; } .grid16 { float:left; width:940px; padding:0 20px 20px 0; } .clr { padding-right:0; } .cbox { height:100px; margin-bottom:20px; padding:9px; border:1px solid #ccc; } .cbox span { font-size:0.8em; } .b { font-weight:bold; } .bb { color:#000; font-size:1.2em; font-weight:bold; } .bltitle { color:#039; font-size:2.4em; font-weight:bold; } .bmtitle { color:#039; font-size:1.2em; font-weight:bold; } .bstitle { color:#039; font-size:1.0em; font-weight:bold; } .topimage { clear:both; text-align:center; } .top_msg { margin:0; padding:10px 20px; background:#ffe url(images/bg_main.gif) no-repeat center bottom; } .top_msg h2 { padding:0; color:#600; background-color:transparent; } .information{ clear:both; height:200px; margin:20px 0; border:1px solid #ccc; background-color:#f8f8f8; } .banner { clear:both; height:140px; margin:0; text-align:center; border:1px solid #ccc; background-color:#f8f8f8; } .gbox { margin:0; padding:8px; text-align:center; border:1px solid #ccc; background-color:#f8f8f8; } .link { padding: 4px 0px 4px 30px; background: url(images/btn_arrow_r.gif) no-repeat 0% 50%; } .caution { color:#c00; font-size:0.8em; } .clear { clear:both; } /*--------*/ table.solid { margin:1em 0; font-family:Arial; border-collapse:collapse; border:1px solid #abc; } table.solid tr { font-size:1.0em; line-height:1.3; } table.solid th { padding:0.5em 0.8em; vertical-align:top; color:#333; border:1px solid #abc; background-color:#eee; } table.solid td { padding:0.5em 0.8em; text-align:left; vertical-align:top; border-right:1px solid #abc; border-bottom:1px solid #abc; } table.solid .ng { color:#666; text-decoration:line-through; background-color:#f8f8f8; } table.solid .ec { white-space:nowrap; text-align:center; background-color:#f0f0f0; } table.solid .dc { white-space:nowrap; text-align:center; background-color:#ddd; } table.solid .e { white-space:nowrap; background-color:#cde; color:#000; } table.solid .d { white-space:nowrap; background-color:#eee; } table.solid .l { text-align:left; } table.solid .r { text-align:right; } /*-- インフォメーション --*/ .info { margin:0; padding:10px 0; border-bottom:1px dotted #ccc; } .info ul { margin:0; padding:0; list-style-type:none; } .info li { margin-bottom:8px; padding-bottom:8px; padding-left:18px; text-align:left; border-bottom:1px dotted #ccc; background:transparent url(./images/arrow.gif) no-repeat left 2px; } .info span { padding:0 1em; color:#999; font-size:13px; font-weight:normal; font-family:Arial; } .info .date { padding:0 1em; color:#090; font-size:13px; font-weight:normal; font-family:Arial; } .info .ctg { padding:0.3em 0; color:#ccc; font-size:13px; font-weight:normal; font-family:Arial; text-align:right; } .info .ttl { margin:0; padding-left:24px; color:#03c; font-size:1.0em; font-weight:bold; background:transparent url(./images/arrow.gif) no-repeat 0% 50%; } .info .cmt { margin-left:24px; } .info .cmt img { margin:1em 0; border-width:0; } .arrow { padding-left:20px; background:transparent url(./images/arrow.gif) no-repeat 0% 50%; } .pdf { padding-left:20px; padding-bottom:3px; background:transparent url(./images/pdf.gif) no-repeat left 0; } .pdfb { padding-right:20px; padding-bottom:3px; background:transparent url(./images/pdf.gif) no-repeat right 0; } .gmap { padding:3px 24px; background:url(./images/gmap20.gif) no-repeat 0% 50%; } .date { color:#090; font-family:arial; } .url { color:#090; font-family:arial; } .rbox { padding:3px; color:#fff; background-color:#c00; } /*----画像サムネイル表示----*/ .phbox_r, .phbox_nr, .phbox_l, .phbox_nl, .phbox_c, .phbox_nc { padding:4px; text-align:center; color:#666; font-size:0.8em; line-height:1.6; } .phbox_r, .phbox_nr { float:right; margin:6px; } .phbox_l, .phbox_nl { float:left; margin:6px; } .phbox_c, .phbox_nc { margin:20px 0; } .phbox_r, .phbox_l, .phbox_c { background-color:#fff; border:3px solid #ddd; } .phbox_r img, .phbox_l img, .phbox_c img { border:0px solid #ccc; } .phbox_nr img, .phbox_nl img, .phbox_nc img { border:0px solid #ccc; } /* メディア掲載履歴 */ ul.mediabox { margin:0; padding:0; list-style-type:none; } .mediabox li { float:left; margin:0; padding:0; color:#666; font-size:13px; } .mediabox a { display:block; width:200px; margin:13px; text-align:center; text-decoration:none; border:3px solid #ddd; } .mediabox img { margin:0; padding:5px; border:none; } /* CSSでPDFやExcelなどのリンクに自動でアイコンを付ける方法 http://www.css-lecture.com/ */ /* pdf要素 ---- */ a[href$=".pdf"] { padding: 4px 20px 4px 0; background: url(images/icon/pdf.gif) no-repeat 100% 50%; } * html a.pdf { padding: 4px 20px 4px 0; background: url(images/icon/pdf.gif) no-repeat 100% 50%; } /* doc要素 ---- */ a[href$=".doc"] { padding: 4px 20px 4px 0; background: url(images/icon/doc.gif) no-repeat 100% 50%; } * html a.doc { padding: 4px 20px 4px 0; background: url(images/icon/doc.gif) no-repeat 100% 50%; } /* xls要素 ---- */ a[href$=".xls"] { padding: 4px 20px 4px 0; background: url(images/icon/xls.gif) no-repeat 100% 50%; } * html a.xls { padding: 4px 20px 4px 0; background: url(images/icon/xls.gif) no-repeat 100% 50%; } /* zip要素 ---- */ a[href$=".zip"] { padding: 4px 20px 4px 0; background: url(images/icon/zip.gif) no-repeat 100% 50%; } * html a.zip { padding: 4px 20px 4px 0; background: url(images/icon/zip.gif) no-repeat 100% 50%; } /* mailto要素 ---- */ a[href ^="mailto:"] { padding: 4px 20px 4px 0; background: url(images/icon/mailto.gif) no-repeat 100% 50%; } * html a.mailto { padding: 4px 20px 4px 0; background: url(images/icon/mailto.gif) no-repeat 100% 50%; } /* 外部リンク要素 */ a[href^="http"] { padding: 4px 20px 4px 0; background: url(images/icon/external.gif) no-repeat 100% 50%; } * html a.external { padding: 4px 20px 4px 0; background: url(images/icon/external.gif) no-repeat 100% 50%; } /* IE-6要素 ----------------------------------------------------------- */ * html a { behavior: expression( this.className += this.getAttribute("href").match(/^http.*/) ? " external" : "", this.className += this.getAttribute("href").match(/\.pdf$/) ? " pdf" : "", this.className += this.getAttribute("href").match(/\.doc$/) ? " doc" : "", this.className += this.getAttribute("href").match(/\.xls$/) ? " xls" : "", this.className += this.getAttribute("href").match(/\.zip$/) ? " zip" : "", this.className += this.getAttribute("href").match(/^mailto.*/) ? " mailto" : "", this.style.behavior = "none" ); } /* use this class to make sure that images won't get iconized */ .imageLink { padding-right: 0px !important; background: none !important; } /*----------*/ #search { float:left; margin-bottom:15px; padding:5px; border:1px solid #abc; } #search form { margin:0; padding:0; } .searchField { margin:0; padding:0; width:280px; height:30px; font-size:18px; border:none; } .searchButton { margin:0; padding:0; vertical-align:bottom; } /*----------*/ #wrapper { width:980px; margin:0 auto; padding:0; background-color:#fff; } #header { height:206px; margin:0 auto; padding:0 20px; background:#fff url(images/bg_header.jpg) no-repeat center top; } #header h1 { float:left; width:380px; height:69px; text-indent:-9999px; background:#fff url(images/logo.jpg) no-repeat left top; } #menu { width:940px; height:50px; margin:0 auto; padding:0; margin-top:1px; background:transparent url(./images/menu115x50.jpg) no-repeat 0px 0px; } #menu ul { margin:0; padding:0; list-style-type:none; } #menu li { float:left; margin:0; padding:0; color:#666; text-align:left; text-decoration:none; } #menu a { display:block; width:115px; height:50px; margin-left:2px; text-indent:-9999px; background:transparent url(./images/menu115x50.jpg) no-repeat 0px 0px; } #menu .nav01 a { background-position: 0px -50px; } #menu .nav02 a { background-position: -115px -50px; } #menu .nav03 a { background-position: -230px -50px; } #menu .nav04 a { background-position: -345px -50px; } #menu .nav05 a { background-position: -460px -50px; } #menu .nav06 a { background-position: -575px -50px; } #menu .nav07 a { background-position: -690px -50px; } #menu .nav08 a { background-position: -805px -50px; } #menu .nav01 a:hover { background-position: 0px -100px; } #menu .nav02 a:hover { background-position: -115px -100px; } #menu .nav03 a:hover { background-position: -230px -100px; } #menu .nav04 a:hover { background-position: -345px -100px; } #menu .nav05 a:hover { background-position: -460px -100px; } #menu .nav06 a:hover { background-position: -575px -100px; } #menu .nav07 a:hover { background-position: -690px -100px; } #menu .nav08 a:hover { background-position: -805px -100px; } #container { width:940px; margin:0 auto; padding:0; } #pankz { margin:20px 0; padding:10px; font-size:13px; line-height:1.0; border:1px solid #ccc; background-color:#f8f8f8; } #main { float:left; width:700px; margin:0; padding:0 0 20px; font-size:1.0em; line-height:1.5; border:0px solid #ccc; } #sidebar { float:right; width:220px; margin:0; padding:0 0 20px; border:0px solid #ccc; } #sidebar .ttl { margin:0; padding:5px; color:#fff; font-size:13px; text-align:center; background-color:#69c; } #sidebar .weather { margin:0; margin-bottom:16px; border:1px solid #ccc; background-color:#f8f8f8; } #sidebar .banner { height:50px; margin:0; margin-bottom:16px; border:1px solid #ccc; background-color:#f8f8f8; } #sidebar a { padding:0px !important; background: none; } #footer { clear:both; width:940px; height:55px; margin:0 auto;; color:#fff; font-size:13px; line-height:39px; text-align:center; background:transparent url(images/bg_footer.jpg) no-repeat 0 0; } #footer span, #footer address { font-size:0.8em; }