html{ /* スクロールバーを常に表示して左右のずれをなくす */ overflow-y: scroll; } body{ width: 900px; margin-top: 0; margin-left: auto; margin-right: auto; text-align: left; /* 中身を左側表示に戻す */ line-height: 1.8em; font-size: 10.5pt; font-family: Verdana, sans-serif; } #footer{ clear: both; margin-bottom: 30px; } #content_left{ float: left; width: 600px; margin-bottom: 30px; text-align: left; /* 中身を左寄せ */ } #content_right{ float: right; width: 280px; text-align: left; /* 中身を左寄せ */ } table{ font-size:10.5pt; line-height:1.8em; } a{ color: #0066CC; text-decoration:none; } a:hover { color: #CC3333; } a[name]{ /*Firefox対応(name属性も色が変わってしまうため)*/ color:#CC6666; } /* a:hover { color: red; background-color: #FFCC99; text-decoration: underline; } */ hr{ background-color: #7386C5; } .font9{ font-size:9pt; line-height: 1.3em; } .font10{ font-size:10pt; } .font11{ font-size:11pt; } .font12{ font-size:12pt; } .font13{ font-size:13pt; } .font14{ font-size:14pt; } .font16{ font-size:16pt; } .font18{ font-size:18pt; } .font20{ font-size:20pt; } .font30{ font-size:30pt; } .font_bold{ font-weight: bold; } .font_red{ color: red; } /* カテゴリ検索用 */ .linkbtnCategory a{ display: block; /*Firefox用*/ width: 270px; background: url(images/linkbg1.jpg) repeat-x; } .linkbtnCategory a:hover{ background: url(images/linkover.jpg) repeat-x; } /* 特徴検索用 */ .linkbtnFeature a{ display: block; width: 140px; background: url(images/linkbg1.jpg) repeat-x; } .linkbtnFeature a:hover{ background: url(images/linkover.jpg) repeat-x; } /* Category Search */ .linkbtnCategory_e a{ display: block; width: 500px; font-size: 14px; background: url(images/linkbg1.jpg) repeat-x; } .linkbtnCategory_e a:hover{ background: url(images/linkover.jpg) repeat-x; } /* Category Search 2 */ .linkbtnCategory_e2 a{ display: block; /*margin-bottom: 7px;*/ width: 300px; font-size: 10.5pt; background: url(images/linkbg1.jpg) repeat-x; } .linkbtnCategory_e2 a:hover{ background: url(images/linkover.jpg) repeat-x; } /* Category Search 2行分 */ .linkbtnCategory2row_e a{ display: block; width: 300px; line-height: 1.3; font-size: 10.5pt; background: url(images/linkbg1.jpg) ; background-size: 100% 200%; } .linkbtnCategory2row_e a:hover{ background-size: cover; background: url(images/linkover.jpg); background-size: 100% 200%; } /* Feature Search */ .linkbtnFeature_e a{ display: block; /*margin-bottom: 7px;*/ width: 273px; font-size: 10.5pt; background: url(images/linkbg1.jpg) repeat-x; } .linkbtnFeature_e a:hover{ background: url(images/linkover.jpg) repeat-x; } /* .linkbtn5,.linkbtn6は求人情報 */ .linkbtn5 a{ background-image:url(images/linkbg1.jpg); width:140px; } .linkbtn5 a:hover{ background-image:url(images/linkover2.jpg); width:140px; } .linkbtn6 a{ background-image:url(images/linkbg2.jpg); width:140px; } .linkbtn6 a:hover{ background-image:url(images/linkover3.jpg); width:140px; } .linkbtn_active a{ background-image:url(images/linkover2.jpg); width:140px; } .margin5px{ margin: 5px; } .margin10px{ margin: 10px; } .margin15{ margin: 15px; } .margin30{ margin: 30px; } .marginLeft5{ margin-left: 5px; } .marginLeft10{ margin-left: 10px; } .marginLeft20{ margin-left: 20px; } .marginLeft30{ margin-left: 30px; } .marginLeft35{ margin-left: 35px; } .marginLeft100{ margin-left: 100px; } .marginRight25{ margin-right: 25px; } /* 上マージン */ .marginTop5{ margin-top: 5px; } /* 上マージン */ .marginTop10{ margin-top: 10px; } /* 上マージン */ .marginTop20{ margin-top: 20px; } /* 上マージン */ .marginTop30{ margin-top: 30px; } /* 上マージン */ .marginTop50{ margin-top: 50px; } /* 上マージン */ .marginTop100{ margin-top: 100px; } /* 下マージン */ .marginBottom5{ margin-bottom: 5px; } /* 下マージン */ .marginBottom10{ margin-bottom: 10px; } /* 下マージン */ .marginBottom25{ margin-bottom: 25px; } .title{ color: #666666; font-size: 20; font-weight: bold; margin-left: 20px; vertical-align: middle; letter-spacing: 3px; } .title_back{ background-repeat: no-repeat; height: 40px; } .title2{ border-left:solid #FF3333 3px; border-bottom:solid #FF3333 1px; padding:4px; } /* マウスオーバー時、画像をずらす手法 */ .jstshop_ro a{ display: block; width: 205px; height: 51px; border: 0; /*background-repeat: no-repeat;*/ /*background-position: 0px 0px;*/ background: url(shop/images/jstshop_ro.gif) no-repeat 0 0; } .jstshop_ro a:hover{ background-position: 0px -51px; } .product_detail a, .product_detail_e a, .shoplink a, .shoplink_e a{ display: block; width: 133px; height: 30px; background: no-repeat 0 0; } .product_detail a:hover, .product_detail_e a:hover, .shoplink a:hover, .shoplink_e a:hover{ background: no-repeat 0 -30px; } .product_detail a, .product_detail a:hover{ background-image: url(product/images/detail.png); } .product_detail_e a, .product_detail_e a:hover{ background-image: url(product/images/detail_e.png); } .shoplink a, .shoplink a:hover{ background-image: url(shop/images/shoplink.png); } .shoplink_e a, .shoplink_e a:hover{ background-image: url(shop/images/shoplink_e.png); } /* タイトルバー(日・英) */ .title_bar, .title_bar_e{ background: url("images/menu_bar.jpg") no-repeat; height: 40px; color: #333333; font-weight: bold; padding-top: 8px; padding-left: 20px; } /* タイトルバー(日) */ .title_bar{ letter-spacing: 1px; font-size: 18pt; } /* タイトルバー(英) */ .title_bar_e{ font-size: 14pt; } /* タイトルバー(中) */ .title_bar_c{ background: url("images/menu_bar.jpg") no-repeat; height: 40px; font-size: 18pt; color: #333333; font-weight: bold; padding: 5px 15px; } /* タイトルバーショート */ .title_bar_short{ height: 40px; background-image: url("images/menu_bar_short.jpg"); background-repeat: no-repeat; letter-spacing: 2px; font-size: 18pt; color: #333333; font-weight: bold; padding: 5px 15px; } /* 項目(拠点一覧など) */ .item{ background-image: url("images/item.jpg"); background-repeat: no-repeat; height: 40px; color: #393939; font-weight: bold; letter-spacing: 2px; font-size: 18px; } /* 項目バー */ .item_bar{ height: 40px; background-image: url("images/item3.jpg"); background-repeat: no-repeat; font-size: 16pt; color: #333333; font-weight: bold; padding: 5px 25px; } /* 大阪府知事賞 */ .award a{ display: block; width: 460px; height: 70px; /*余分な空白ができるため画像サイズの半分よりも小さくしている*/ /*float: left;*/ border: 0; padding: 0; margin-bottom: 5px; text-indent: -210px; background-repeat: no-repeat; background-position: 0px 0px; } .award a:hover{ background-repeat: no-repeat; background-position: 0px -73px; /*画像サイズの半分*/ } .award a, .award a:hover{ background-image: url(images/top_award.jpg); } .alignLeft{ text-align: left; } .alignCenter{ text-align: center; } .alignCenterTable{ margin-left: auto; margin-right: auto } .itemLarge{ font-size: 16pt; color: white; font-weight: bold; height: 40px; padding-top: 7px; padding-left: 30px; letter-spacing: 5px; text-shadow: 2px 2px 0 #3d3d3d, -2px 2px 0 #3d3d3d, -2px -2px 0 #3d3d3d, 2px -2px 0 #3d3d3d, 2px 0 0 #3d3d3d, 0 2px 0 #3d3d3d, -2px 0 0 #3d3d3d, 0 -2px 0 #3d3d3d; } .itemLargeGreen{ background: url(images/item_green.jpg) no-repeat; } .itemLargeGray{ background: url(images/item_gray.jpg) no-repeat; } .itemLargeRed{ background: url(images/item_red_long.jpg) no-repeat; } .itemLargeYellow{ background: url(images/item_yellow.jpg) no-repeat; } .itemLargeBlue{ background: url(images/item_blue_long.jpg) no-repeat; } .itemBottomLine{ font-size: 14pt; font-weight: bold; width: 580px; height: 30px; background-color: #eef9d9; background-color: #ebf9f9; padding-left: 5px; padding-top: 5px; border-bottom: #84ca91 3px solid; border-bottom: #87a7ca 3px solid; margin-bottom: 10px; } .itemBottomLineLong{ font-size: 14pt; font-weight: bold; width: 880px; height: 30px; background-color: #ebf9f9; padding-left: 5px; padding-top: 5px; border-bottom: #87a7ca 3px solid; margin-bottom: 10px; } .explain{ font-size: 10pt; margin-left: 20px; margin-bottom: 5px; line-height: 1.5; } .pickup_init{ border: white 1px solid; } .pickup{ border: red 1px solid; } /*Y方向のスクロール*/ .divScroll{ overflow-y: scroll; } /* ボタン大 */ .buttonBig{ padding: 10px 30px; } .buttonBig2{ padding: 10px 70px; } .buttonSearch{ margin-left: 10px; width: 100px; } .buttonSearch2{ width: 100px; } /* 承認ボタン */ .btn_approval{ display: inline-block; position: relative; text-decoration: none; color: #ffffff; border-radius: 5px; font-size: 12pt; font-weight: bold; padding: 3px 10px; text-align: center; vertical-align: middle; overflow: hidden; background-image: -webkit-linear-gradient(#79a7f5 0%, #2c548e 100%); background-image: linear-gradient(#79a7f5 0%, #2c548e 100%); text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.66); box-shadow: 0 1px 1px rgba(239, 239, 239, 0.28); } /* 否認ボタン */ .btn_deny{ display: inline-block; position: relative; text-decoration: none; color: #ffffff; border-radius: 5px; font-size: 12pt; font-weight: bold; padding: 3px 10px; text-align: center; vertical-align: middle; overflow: hidden; background-image: -webkit-linear-gradient(#f599ad 0%, #a65762 100%); background-image: linear-gradient(#f599ad 0%, #a65762 100%); text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.66); box-shadow: 0 1px 1px rgba(239, 239, 239, 0.28); } /* ヘッダー、フッターの背景色 */ .header_footer_background_color{ background-image: url("images/footer.jpg"); } .alignCenter{ text-align: center; margin-left: auto; margin-right: auto; } .alignLeft{ text-align: left; } .alignRight{ text-align: right; } .verticalAlignTop{ vertical-align: top; } .font_white{ color: white; } .paddingRight10{ padding-right: 10px; } .paddingBottom5{ padding-bottom: 5px; } .padding5{ padding: 5px; } .padding15{ padding: 15px; } /* bxSliderのセンタリング配置用div */ div.bxslider_parent{ /*width: 1200px;*/ /*margin-left: auto;*/ /*margin-right: auto;*/ /*border:1px solid red;*/ } /* bxSlider */ div.bxslider { /*position: relative; !*1ページに複数設置する場合は必須*!*/ /*margin: 40px 20px auto auto; !* 上下左右 *!*/ /*border:1px solid red;*/ } div.bx-wrapper { /*margin: 0 !important;*/ -moz-box-shadow: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; border: none !important; background: none !important; margin-bottom: 10px; /*下余白*/ } .bxslider_link_series{ /*width: 266px;*/ /*height: 350px;*/ display: inline-block; } .bxslider_image{ height: 200px; } /* ロールーバー対応バナー */ .banner{ /*角丸ボックス*/ background: #34963d; border-radius: 10px; box-shadow: 2px 2px 5px 0 rgba(255,255,255,0.75) inset,-2px -2px 5px 0 rgba(0,0,0,0.75) inset; /*ベベル*/ width: 210px; height: 40px; display: flex; justify-content: center; align-items: center; margin-bottom: 10px; /*フォント*/ color: white; font-size: 14pt; font-weight: bold; text-shadow: 2px 2px 3px #464646; line-height:1.2em; } .banner:hover{ color: white; background: #27702e; text-shadow: 3px 3px 3px #000000; } /* 角丸ボタン */ .buttonRounded{ /*ボックス*/ background: #409442; border-radius: 10px; box-shadow: 2px 2px 5px 0 rgba(255,255,255,0.75) inset,-2px -2px 5px 0 rgba(0,0,0,0.75) inset; /*ベベル*/ width: 140px; height: 30px; display: flex; justify-content: center; align-items: center; /*フォント*/ color: white; font-size: 11pt; font-weight: bold; text-shadow: 2px 2px 3px #464646; line-height:1.2em; } .buttonRounded:hover{ color: white; background: #8b163c; text-shadow: 3px 3px 3px #000000; } /* 項目バー */ .itemBar{ height: 27px; width: 220px; font-size: 15pt; color: #ffffff; font-weight: bold; padding: 5px 25px; background: #24807d; border-radius: 8px; box-shadow: 2px 2px 5px 0 rgba(255,255,255,0.75) inset,-2px -2px 5px 0 rgba(49, 49, 49, 0.75) inset; /*ベベル*/ } /* シリーズ詳細ボタン(buttonRoundedと併用) */ .detailSeries{ background: #365a84; } /* ショッピングサイトボタン(buttonRoundedと併用) */ .shopLink2{ background: #45a547; font-size: 9pt; /*margin-top: 20px;*/ } /* 項目行 */ .itemRow{ background-color: #ffe8ca;" } /* ダウンロードバー（buttonDetailと併用） */ .download2{ background: #fff5dd; color: #bf442f; width: 100px; font-size: 10.5pt; text-shadow: none; margin-top: 0; border-radius: 5px; box-shadow: 1px 1px 3px 0 rgba(255,255,255,0.75) inset,-1px -1px 3px 0 rgba(81, 81, 81, 0.75) inset; /*ベベル*/ } .download2:hover{ background: #ff3d36; color: #ffeded; text-shadow: none; } /* div固定 */ .fixedDiv{ position: fixed; top: 0; padding-bottom: 10px; width: 100%; background-color: #ffffff; } /* 全画面前面メッセージ */ #overflow{ top: 0; left: 0; width: 100vw; /* 横幅を画面いっぱいにする */ height: 100vh; /* 高さを画面いっぱいにする */ background-color: rgba(0,0,0,0.2); /* 背景を半透明の黒い背景にする */ position: fixed; z-index: 10; display: none; /* 初期は非表示 */ } #overflow .wait{ background: #FFF; /* 背景を白色に指定 */ padding: 20px; /* 余白を20pxに指定 */ position: absolute; top: 50%; /* 上から50%の位置に配置 */ left: 50%; /* 左から50%の位置に配置 */ transform: translate(-100%,-50%); /* コンテンツの半分だけ位置を戻して上下左右中央に配置 */ } /* ピクトグラムロールオーバーズーム */ .zoom_pictogram { display: block; text-decoration:none; } .zoom_pictogram:hover { transition-duration: 0.1s; transform: scale(1.1); /*filter: invert(68%) sepia(44%) saturate(675%) hue-rotate(125deg) brightness(96%) contrast(91%);*/ filter: hue-rotate(320deg); }