/* このcssは、"メイン4分割メニュー"と"megamenu"と"route表記"が無い別ウィンドで開くページの設定css >>main-css22との違いは 1. contents #sub liのmarginの設定 -0.5em -0.1em を -0.5em -2em 0に変更 2. contents #sub a のpaddingの設定 0.5em 0em を 3pxに変更 3. 1024px以上で #contentsのmarginの設定を -2em 0 0 2 から 1em に変更 4. 1024px以上では設定していなかった #contents #mainの margin設定を 2em 0 0 0em に設定 5. 1024px以上での #contents #sub topの設定を 14em から 1em に変更（1emの位置で固定） */ @charset "utf-8"; /* @group Reset */ *{ margin: 0;padding: 0 } a { text-decoration : none} ul, ol { list-style : none} img { vertical-align : middle; border: none; } /* group Resetここまで */ /* @group Fluid-img */ img { max-width : 100%} /* group Fluid-imgここまで */ /* @group HTML */ html { font-family : verdana, sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; font-size : 75%; /*レスポンシブタイプセッティングの指定*/ line-height : 1.5 /* background : url(../_img_pht/960_grid_12_col.png) repeat-y top center */ } /* group HTML ここまで */ a:link {color: #0645AD; text-decolation: none; } a:hover {color: #c94e97 !important } a:visited {color: #00233d } /* @group Heading */ h1 { font-size : 3.5em; /* 48px */ line-height : 1; /* 48px */ margin-bottom : 0.5em } h2 { font-size : 2.75em; /* 36px */ line-height : 1.3333; /* 48px */ margin-bottom : 0.6667em } h3 { font-size : 2em; /* 24px */ line-height : 1; /* 24px */ margin-bottom : 1em } hgroup h4,h5,h6 { font-size : 1.5em; /* 16px */ line-height : 1.5; /* 24px */ margin-bottom : 1.5em } /*group Heading ここまで */ /* オリジナル追加の段落設定 */ p.h1_ttl { color: #666; font-weight: bold; font-size: 3.5em/*48px*/; line-height: 1; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; text-align: left; line-break: strict; font-feature-settings:"palt" } p.h2_lrg-midsi { font-size: 2.75em/*36px*/; line-height: 1.3333; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-break: strict; font-feature-settings:"palt" } p.h3_midsi { font-size: 2em/*24px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; text-align: left ; line-break: strict; font-feature-settings:"palt"; } p.h3_midsi_i1em { font-size: 2em/*24px*/; line-height: 1.5; padding-left:1em; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; text-align: left ; line-break: strict; font-feature-settings:"palt"; } p.h2_for-anker { margin:0em; font-size: 2.75em/*36px*/; line-height: 2.5; font-feature-settings:"palt";} p.h45_midsi { margin: 0em 0em 0em 0.7em; text-indent: 0.7em; font-size: 1.7em/*24px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.h45_midsi_i1em { margin: 0em 0em 0em 0.7em; text-indent: 0.7em; font-size: 1.7em/*24px*/; line-height: 1.5; padding-left:1em; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.h45_bkclr-midsi { margin: 0em 0em 0em 0.7em; text-indent: 0em; font-size: 1.7em/*24px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; background-color: #e6e6e6; padding: 0.75em/*12px*/; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.h45_bkclr-midsi_oldprdct { margin: 0em 0em 0em 0.7em; text-indent: 0em; font-size: 1.7em/*24px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; background-color: #ccccff; padding: 0.75em/*12px*/; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.h4_smll-midsi { text-indent: 0.7em; font-size: 2em/*24px*/; line-height: 1.2; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; padding-top: 0.75em/*12px*/; padding-bottom: 0.75em/*12px*/; text-align: left ; line-break: strict; font-feature-settings:"palt"; } p.h4_smll-midsi_i1em { text-indent: 0.7em; font-size: 2em/*24px*/; line-height: 1.2; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; padding-top: 0.75em/*12px*/; padding-bottom: 0.75em/*12px*/; padding-left:1em; text-align: left ; line-break: strict; font-feature-settings:"palt"; } p.h4_smll-midsi_i2em { text-indent: 0.7em; font-size: 2em/*24px*/; line-height: 1.2; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; padding-top: 0.75em/*12px*/; padding-bottom: 0.75em/*12px*/; padding-left:2em; text-align: left ; line-break: strict; font-feature-settings:"palt"; } p.h4_smll-midsi_i3em { text-indent: 0.7em; font-size: 2em/*24px*/; line-height: 1.2; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; padding-top: 0.75em/*12px*/; padding-bottom: 0.75em/*12px*/; padding-left:3em; text-align: left ; line-break: strict; font-feature-settings:"palt"; } p.h5_bkclr-sml-midsi { text-indent: 0.7em; font-size: 1.5em/*16px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; background-color: #e6e6e6; margin-top:0.5em; margin-bottom:0.5em; text-align:left; line-break: strict; font-feature-settings:"palt"; } p.h5_bkclr-sml-midsi_indnt15em { text-indent: 1.5em; font-size: 1.5em/*16px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; background-color: #e6e6e6; margin-top:0.5em; margin-bottom:0.5em; text-align:left; line-break: strict; font-feature-settings:"palt"; } p.h5_midsi-sml-l1 { font-size: 1.5em/*16px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; margin-top:0.5em; margin-bottom:0.5em; text-align:left; line-break: strict; font-feature-settings:"palt"; } /*1024px以上でも100％表示にする設定*/ p.hbn-l1_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; text-align: left; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i1em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:1em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i2em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:2em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i3em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:3em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i4em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:4em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i5em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:5em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i1em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:1.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i2em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:2.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i3em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:3.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i4em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:4.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i5em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:5.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } /*ここまでw1024px以上でw100％表示にする設定*/ p.hbn-l1 { margin-left: 0.7em; font-size: 1.5em/*16px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; margin-top:0.5em; margin-bottom:0.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i1em { margin-left: 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; margin-top:0.5em; margin-bottom:0.5em; padding-left:1em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i2em { margin-left: 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; margin-top:0.5em; margin-bottom:0.5em; padding-left:2em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i3em { margin-left: 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; margin-top:0.5em; margin-bottom:0.5em; padding-left:3em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i4em { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:4em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i5em { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:5em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i1em { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:1.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i2em { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:2.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i3em { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:3.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i4em { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:4.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i5em { margin: 0em 0em 0em 0.7em; font-size: 1.5em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:5.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i2em_bkclr { text-indent: 0.7em; font-size: 1.5em/*16px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; background-color: #e6e6e6; margin:0.5em 1em; padding:0.5em 1em 0.5em 1.5em; text-align:left; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i2em_bkclr2 { text-indent: 0.7em; font-size: 1.5em/*16px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; background-color: #dddccf; margin:0.5em 1em; padding:0.5em 1em 0.5em 1.5em; text-align:left; line-break: strict; font-feature-settings:"palt" } p.img-caption-l1 { margin: 0em 0em 0em 0.7em; font-size: 1em; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; text-align: left; line-break: strict; font-feature-settings:"palt" } p.img-caption-l1_i1em { margin: 0em 0em 0em 0.7em; font-size: 1em; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:0.8em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.img-caption-l1_i2em { margin: 0em 0em 0em 0.7em; font-size: 1em; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:1.6em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.img-caption-l1_i3em { margin: 0em 0em 0em 0.7em; font-size: 1em; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:2.4em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-r1 { font-size: 1.5em/*16px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; margin-top:0.5em; margin-bottom:0.5em; text-align: right ; line-break: strict; font-feature-settings:"palt" } p.hbn-r3 { font-size: 1.5em/*16px*/; line-height: 1.2; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; margin-top:0.3em; margin-bottom:0.3em; text-align: right ; line-break: strict; font-feature-settings:"palt" } p.hbn-cntr { font-size: 1.5em/*16px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; margin-top:0.5em; margin-bottom:0.5em; text-align: center ; line-break: strict; font-feature-settings:"palt" } p.hbn-cntr2 { font-size: 1.5em/*16px*/; line-height: 1.1; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; margin-top:0.3em; margin-bottom:0.3em; text-align: center ; line-break: strict; font-feature-settings:"palt" } p.hbn-cntr3 { font-size: 1.5em/*16px*/; line-height: 1.2; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; margin-top:0.3em; margin-bottom:0.3em; text-align: center ; line-break: strict; font-feature-settings:"palt" } /* ここから「テーブル用」テキスト設定*/ p.tbl-hbn-l1_i1em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:1em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.tbl-hbn-l1_i2em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:2em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.tbl-hbn-cntr3 { margin: 0.3em 0em; font-size: 1em/*16px*/; line-height: 1.2; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; margin-top:0.3em; margin-bottom:0.3em; text-align: center ; line-break: strict; font-feature-settings:"palt" } /* ここまで「テーブル用」テキスト設定*/ p.nakamidsi { margin-left: 0.7em; font-size: 1.5em/*16px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; margin-top:0.5em; margin-bottom:0.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.route { font-size: 1em/*16px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; margin-top:0.5em; margin-bottom:0.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } /* オリジナル追加の段落設定 ここまで*/ /* css_ver22 group Header*/ a, a:hover { text-decoration: none } header { float: left; width: 100%; padding: 0.5em/*10px*/; font-family : verdana, sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; text-align : center; /*border-bottom: 1px solid #e6e6e6;*/ box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box } header img { float: left } header nav { float: left; width: 100%/*70%*/; text-align: center/*left*/; /*margin-left: 20px;*/ margin-bottom : 0.1em/*1.5em*/;/*navの下の白場*/ background-color: #0068b7; background: -moz-linear-gradient(top, rgba(5,144,253,1) 0%, rgba(0,82,147,1) 88%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(5,144,253,1)), color-stop(88%,rgba(0,82,147,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(5,144,253,1) 0%,rgba(0,82,147,1) 88%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(5,144,253,1) 0%,rgba(0,82,147,1) 88%); /* Opera 11.10+ */ background: linear-gradient(to bottom, rgba(5,144,253,1) 0%,rgba(0,82,147,1) 88%) /* W3C */ } header nav ul { padding: 0.7em/*2em/30px*/ 0; margin: 0; list-style-type: none } header nav ul li { width : 18%; float : left; margin-left: 3em/*10px*/; display: inline } /* ページトップのブルーバック；メインタブの“「製品情報」「エンジニアリング」「サポート」「会社情報」”の文字色設定構文 */ header nav ul li a { font-size : 90%; color : #ffffff !important; /* 20220511　!important;を付与して　alink設定より優先度を上げた。　オリジナルは #d8c2a4 */ padding : -1em 1em } header nav ul li a:hover { color : #efefef; background-color : #0590fd /* 7d4934 */; padding : 0.7em 1em } header nav ul ul { display: none } /* @media screen and (max-width: 37.5em) { /* 600px */ /* h1 { font-size: 44px; } }*/ /* css_ver22 group Headerここまで */ /* css_ver21 group Header =ブルーバックのページトップナビゲーション 部の名称＝header header { text-align : center; padding-top : 1.5em; background : #ffffff } header h1 { margin-bottom : 0.5em} header h2,h3 { color : #0068b7} /* css_ver21 group Headerここまで */ /* @group Nav ブルーバックのページトップナビゲーション */ nav { margin-top : 1.5em; margin-bottom : 1.5em; background-color: #0068b7; background: -moz-linear-gradient(top, rgba(5,144,253,1) 0%, rgba(0,82,147,1) 88%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(5,144,253,1)), color-stop(88%,rgba(0,82,147,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(5,144,253,1) 0%,rgba(0,82,147,1) 88%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(5,144,253,1) 0%,rgba(0,82,147,1) 88%); /* Opera 11.10+ */ background: linear-gradient(to bottom, rgba(5,144,253,1) 0%,rgba(0,82,147,1) 88%) /* W3C */ } nav ul { overflow : hidden} nav ul li { width : 25%; float : left} nav ul li a { display : block; color : #ffffff;/* #d8c2a4 */ padding : 0.75em 0 } nav ul li a:hover { color : white; background-color : #0590fd /* #7d4934 */ } /* @group Nav ここまで */ /* gnav2追加*/ #gnav2 { margin: 0 0 0.3em/*-0.3em*/ 3%; } #gnav2 ul { z-index: 1; overflow:hidden; } #gnav2 li { z-index: 1; list-style: none; float: left } /* gnav2追加 ここまで */ #contents #sub { width: 99%; /* float:right */ margin : 2em 0} /* 2em 0 0 2em */ #contents #sub ul { text-align: left } #contents #sub li { display: inline-block; vertical-align: top; margin: -0.5em -0.1em} #contents #sub a { display: block; width: 24em/* 20201029まで18em、20150213まで10em */; background-color:#ffffff; text-align: left/*center*/; padding: 0.5em 0.5em 0.5em 1em; margin-bottom: 0; border-color: #afc7e0 #afc7e0 #98b7d9; border-style: solid; border-width: 1px 2px 2px 1px } #contents #sub li a:hover { background-color: #999999; } #contents #sub p { margin-bottom : 1.5em /*(20170407追記：subだけ下マージンを1.5emにするため)*/} /* 1024px以下：右サイドに移動していない状態の「"div-sub"」　ここまで */ p.content { font-size: 0.9em; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; font-feature-settings:"palt"} /* route_uppr */ #route_uppr { width : 93.75%; margin: 0em auto 1.5em; border-bottom: 2px solid #999999; font-feature-settings:"palt" } #route_uppr_prdct { width : 93.75%; margin: 0em auto 1.5em; border-bottom: 2px solid #c00; font-feature-settings:"palt" } #route_uppr_enrng { width : 93.75%; margin: 0em auto 1.5em; border-bottom: 2px solid #009963; font-feature-settings:"palt" } #route_uppr_sprt { width : 93.75%; margin: 0em auto 1.5em; border-bottom: 2px solid #f90; font-feature-settings:"palt" } #route_uppr_oldprdcts { width : 93.75%; margin: 0em auto 1.5em; border-bottom: 2px solid #ccccff; font-feature-settings:"palt" } #route_uppr_abutus { width : 93.75%; margin: 0em auto 1.5em; border-bottom: 2px solid #0080ff; font-feature-settings:"palt" } /* route_upprここまで */ /* 1024px以下での@group Contents */ #contents { width : 90%; margin : 0 auto /* margin : 20160208設定不要？無効のため設定を削除-1em 0.8em 0 0.8em ----初期css22にて変更 css21まででの数値は右記の通り　-1em 0 0 2em　*/ /* text-align : center */ } /* css22から追加したheader-logo */ #header-logo { margin : 2 0 -2em ;　/*1024px以下での左上ロゴの上マージン設定。英文ロゴでの設定に合わせる*/ padding-top : 1em ; width : 90%; height: 63px; color : #ffffff } /* -----header-logo ここまで*/ .colm03_sub { width:96%; /* float:left; */ margin-top: 1em; line-break: strict } #colm03 { width:96%; /* float:left; */ margin-top: 1em; line-break: strict } #colm03-oldprdcts { width:96%; /* float:left; */ margin-top: 1em; line-break: strict; background-color: #d9e480/*e6ffe6*/ } #contents p { margin-bottom : 0.25em /*1.5em;(20170407：0.25emに変更) text-align : left */} #contents img { margin-bottom : 0em /*1.5em;*/ /*製品情報のレスポ化終了後、イメージ下の行間少なくする為に1.5emを0に変更*/ /* box-shadow : 0 0 5px #001a43 2f1f1f =画像の影を無しにした */} /* @group Contents ここまで */ /* copyright */ #copyright { text-align: center; clear: both; padding : 1.5em; color : #4a5767; text-align : center; background-color: #ffffff } /* copyright ここまで */ /* @group Footer footer { padding : 1.5em 0; color : white; text-align : center; background : url(../images/footer_bg.png)} --- group Footerここまで */ /*#contents #sub { margin : 2em 0 }*/ /* --- ページトップへ戻る の記述------------------ */ .pageTop { display:none; position:relative; width:100%; max-width:900px; height:0; margin:0 auto } .pageTop a { position: fixed; bottom: 0px; left:-68px; display: block; width: 66px; hegiht:66px; margin-left:100%; /* ↓カスタマイズ：ボトム位置から少し離す設定___iPhone Safari 最下のツールバーと離すため↓ */ margin-bottom:2%; /* ↓以下はリンク装飾↓ */ padding:1em 0 1em 2px; background:#0068b7;/* ボックス部の背景色をコーポレートカラー#0068b7に変更 元の色＝#3498db*/ /* ↓透明度の設定_ここから */ filter:alpha(opacity=80);/* IE6,7 向けの指定 */ -ms-filter: "alpha(opacity=70)";/* IE8 向けの指定 */ -moz-opacity: 0.8;/* Firefox（Mozzila）向けの指定 */ opacity: 0.8;/* SafariやOpera向けの指定 */ /* 透明度の設定_ここまで */ text-align:center; outline:none; text-decoration: none; z-index:9999; border-radius:3px 3px 0 0/* border-radius>>ボックスの４つのコーナーの角丸設定　 左上・右上・右下・左下、/ で区切っていないので水平・垂直とも同値 */ } .pageTop a:before, .pageTop a:after { position:absolute; left:50%;/*矢印の横位置を決めている*/ content:""; width:0px; height:0px; margin-left:-10px;/*矢印の横位置を決めている*/ border:10px solid/*solid=1本線*/ transparent/*transparent=透明*/ } .pageTop a:before { top:50%; margin-top:-13px; border-bottom:10px solid #0068b7/* 矢印下ボーダーラインの塗色をコーポレートカラーに変更、矢印下ボーダーラインの下側をコーポレートカラーの太い10px線で塗りつぶしている 元の色=#3498db*/ } .pageTop a:after { top:50%; margin-top:-15px; z-index:-1; border-bottom:10px solid #fff } /* 矢印の色:白　#fff=#ffffff */ /* --- ページトップへ戻る--ここまで---------------- */ /* Youtube動画の埋め込みをレスポンシブ対応するCSS*/ .youtube { position: relative; width: 100%/*100% */; padding-top: 56.25% } .youtube iframe { position: absolute; top: 0; right: 0; width: 100%/*100% */ !important; height: 100%/*100% */ !important; } /* Youtube動画埋め込み・・・・@end */ #anchr01 span, #anchr02 span, #anchr03 span, #anchr04 span, #anchr05 span, #anchr06 span, #anchr07 span, #anchr08 span, #anchr09 span, { margin: -500px 0 0 0 ; /* 固定ナビの高さ分のネガティブマージン */ padding: 500px 0 0 0 /* 打ち消し用のパディング */ } /* ------------------------------------------------------------------ */ /*768px*/ @media screen and (min-width : 768px){ /* ここからbrawserのwindws-widthが768〜1023pxまでのcssを記述*/ html{ font-size : 87.5%} /*レスポンシブタイプセッティングの指定*/ #contents { text-align : left} /* ------------------------------------------------------------------ */ /*1024px*/ @media screen and (min-width : 1024px) { /* ここからbrawserのwindws-widthが1024px以上のcssを記述*/ html{ font-size : 100%} /*レスポンシブタイプセッティングの指定*/ /*w1024px以上でもw100％表示にする設定*/ p.h45_midsi { margin: 0em 0em 0em 0.7em; text-indent: 0.7em; font-size: 1.5em/*24px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.h45_midsi_i1em { margin: 0em 0em 0em 0.7em; text-indent: 0.7em; font-size: 1.5em/*24px*/; line-height: 1.5; padding-left:1em; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.h45_bkclr-midsi { margin: 0em; text-indent: 0em; font-size: 1.5em/*24px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; background-color: #e6e6e6; padding: 0.75em/*12px*/; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.h45_bkclr-midsi_oldprdct { margin: 0em; text-indent: 0em; font-size: 1.5em/*24px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; background-color: #ccccff; padding: 0.75em/*12px*/; text-align: left ; line-break: strict; font-feature-settings:"palt" } /* ここから「テーブル用」テキスト設定*/ p.tbl-hbn-l1_i1em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:1em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.tbl-hbn-l1_i2em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:2em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.tbl-hbn-cntr3 { margin: 0.3em 0em; font-size: 1.2em/*16px*/; line-height: 1.2; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; margin-top:0.3em; margin-bottom:0.3em; text-align: center ; line-break: strict; font-feature-settings:"palt" } /* ここまで「テーブル用」テキスト設定*/ p.hbn-l1_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; text-align: left; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i1em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:1em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i2em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:2em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i3em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:3em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i4em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:4em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i5em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:5em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i1em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:1.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i2em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:2.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i3em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:3.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i4em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:4.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i5em_w100 { margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:5.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } /*ここまでw1024px以上でw100％表示にする設定*/ /* w1024px以上でw50％表示にする本文系統設定 */ p.hbn-l1 { width: 50%; margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; text-align: left; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i1em { width: 50%; margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:1em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i2em { width: 50%; margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:2em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i3em { width: 50%; margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:3em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i4em { width: 50%; margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:4em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i5em { width: 50%; margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:5em; text-align:left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i1em { width: 50%; margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:1.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i2em { width: 50%; margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:2.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i3em { width: 50%; margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:3.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i4em { width: 50%; margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:4.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_kjy-i5em { width: 50%; margin: 0em 0em 0em 0.7em; font-size: 1.2em/*16px*/; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; line-height: 1.5; padding-left:5.2em; text-indent:-1.5em; text-align: left ; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i2em_bkclr { width: 50%; text-indent: 0.7em; font-size: 1.5em/*16px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; background-color: #e6e6e6; margin:0.5em 1em; padding:0.5em 1em 0.5em 1.5em; text-align:left; line-break: strict; font-feature-settings:"palt" } p.hbn-l1_i2em_bkclr2 {width: 50%; text-indent: 0.7em; font-size: 1.5em/*16px*/; line-height: 1.5; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; background-color: #dddccf; margin:0.5em 1em; padding:0.5em 1em 0.5em 1.5em; text-align:left; line-break: strict; font-feature-settings:"palt" } /*ここまで w1024px以上でw50％表示にする本文系統設定 */ /* @group Nav */ nav ul { width : 93.75%;/* 960/1024 */ margin : 0 auto} /* group Nav ここまで */ #header-logo { margin : -1.5em 0 ; /*1024px以上での左上ロゴの上マージン設定。英文ロゴでの設定に合わせる*/ padding-top : 1em ; width : 90%; height: 63px; color : #ffffff } /* @group Contents */ #contents { overflow : hidden; width : 93.75% ; margin : -2em 0 0 2em /* text-align : center */ } #contents #main, #contents #sub { margin : 0 1.0416667% } /* #contents #main { float : left; width : 64.5833333%; /* margin : 2em 0em */ } /* ---右サイドに移動した状態の「"div-sub"」------------------ */ /* #contents #sub { position : fixed; top: 1em ;right : 0% ;/* 別開き小ウィインドは1024px以上では一定の高さ(1em)で固定 float : right; width : 31.25% /* >>margin追加 margin : 2em 0em }*/ /* #contents #sub { width: 29.296875% ; float:right; margin : 2em 0 0 2em;} */ /* #contents #sub ul { text-align: left;} #contents #sub li { display: inline-block; margin: -0.6em -0.1em;} #contents #sub a { display: block; width: 18em　20150213まで8em 300px　; background-color: #efefef; text-align: left; padding: 3px; margin-bottom: 0px; border-color: #e6e6e6 #d6d3d3 #a4a4a4; border-style: solid; border-width: 2px 2px 4px 2px; } #contents #sub li a:hover { background-color: #999999 } /* ---右サイドに移動した状態の「"div-sub"」ここまで------------------ */ p.content { font-size: 0.9em; font-family: sans-serif, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3"; font-feature-settings:"palt" } /* group Contents ここまで */ /* @group copyright */ #copyright{ width : 91.796875%; /*940/1024*/ margin : 0 auto; padding : 1em } /* group copyrightここまで */ /* --- ページトップへ戻る 1024px以上用------------------ */ .pageTop { width:90% } .pageTop a { left:auto; margin-left:920px; /* ↓透明度の設定_ここから */ filter:alpha(opacity=80);/* IE6,7 向けの指定 */ -ms-filter: "alpha(opacity=70)";/* IE8 向けの指定 */ -moz-opacity: 0.8;/* Firefox（Mozzila）向けの指定 */ opacity: 0.8/* SafariやOpera向けの指定 */ /* 透明度の設定_ここまで */ } /* --- ページトップへ戻る 1024px以上用--ここまで---------------- */ /* Youtube動画の埋め込みをレスポンシブ対応するCSS 1024px以上*/ .youtube { position: relative; width: 100%; padding-top: 56.25%　 } .youtube iframe { position: absolute; top: 0; left: 0;/*right:0*/ width: 64%/*100% */ !important; height: 64%/*100% */ !important } /* Youtube動画埋め込み・・・・1024px以上 end */ /* ここまで1024px以上のcssを記述*/ } /*<<この｝は消さない！*/ /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ /* このcssファイルのバージョンは css23_sub-wndw-ver0.02.5 date20230119 仕様変更記録（リリースノート） LINE261〜266　　#contents #sub a 　　background-color: #eaeff9を#ffffff　（白）に変更 　　border-width: 2px 2px 4px 2px >>1px 2px 2px 1pxに変更（細く） 　　border-color: #e6e6e6 #d6d3d3 #a4a4a4 >> #afc7e0 #afc7e0 #98b7d9　(青系統色)に変更 /* このcssファイルのバージョンは css23_sub-wndw-ver0.02.4 仕様変更記録（リリースノート） LINE35-37に　 a:link {color: #0645AD; text-decolation: none; } a:hover {color: #c94e97 !important } a:visited {color: #00233d } を追加 LINE190　header nav ul li a {　color : #ffffff !important; /* !important;を付与して　LINE13に追加した　a:link設定より優先度を上げた。　 LINE264 ：#contents #sub a { background-color: #e7eaedを#efefefに変更 　 /* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝copy /* このcssファイルのバージョンは css23_ver1.01.8　　20220510 仕様変更記録（リリースノート） LINE作成中 ：#contents #sub a { background-color: #eaeff9を#ffffffに変更 LINE309 #copyright { background-color: #dce5ee を*ffffff*に変更 /* このcssファイルのバージョンは css23_sub-wndw-ver0.02.3 仕様変更記録（リリースノート） ・css23_ver0.02.3 での変更点　20220422 LINE262 ：#contents #sub a { background-color: eaeff9を#e7eaedに変更 ・css23_ver0.02.2 での変更点　20191219 　＝本文系統のp. を1024px以上で50％表示にする設定と1024px以上でも100％表示にする設定に分ける 　　1024px以上で50％表示にする設定（画像、megamenu、仕様表内；左揃え設定）＝例：hbn-l1_w100 　　1024px以上でも100％表示にする設定（これまで通り）＝例：hbn-l1 ・css23_ver0.02.1 での変更点　20191218 　＝本文系統のp. を画像設定用と文章設定用に分ける　 　　画像設定用は、hbn-l1_image、hbn-l1_w100　など　を追加 　文章設定用は　1024px以下はこれまで通り、　1024px以上の設定では　witdth；50％設定 ・css23_ver0.01.1 での変更点 20190806 　＝LINE230　#contents #sub a のbackground-color: #efefef　を　#eaeff9　に変更 　＝LINE227 #contents #sub width90%　を　96%　に変更 　＝LINE263 .colm03_sub width:90%　を　96%　に変更 　＝LINE265 #colm03 width:90%　を　96%　に変更 　＝LINE266 #colm03-oldprdcts width:100%　を　96%　に変更 　＝LINE423〜438　までの#contents #main　と　#contents #main　の効力を無くしてディスプレイが1024px以上の画面でもsubが右へ移動しないように設定した */