@charset "utf-8"; html { overflow-y:scroll; -webkit-text-size-adjust:none } /*floatのクリア*/ .clearfix:after{ content: "."; display: block; height: 0; font-size:0; clear: both; visibility:hidden; } .clearfix{ display: inline-block; } /* Hides from IE Mac */ * html .clearfix{ height: 1%; } .clearfix{ display:block; } /* End Hack */ /* 一括で全ての要素の余白をゼロに指定 */ * { padding: 0; margin: 0; } body { margin:0px; padding:0px; font-family: "メイリオ", "MS ゴシック", Helvetica, Osaka-mono, sans-serif; font-size:14px; background:url(../assets/images/common/con_background.png); } img { border:0px; vertical-align: top; } .clear { clear: both; font-size:1px; margin:0px; padding:0px; line-height:normal; } .m5 { margin:5px; } .m10 { margin:10px; } .m5855 { margin:5px 8px 5px 5px; } .m5858 { margin:5px 8px 5px 8px; } .m5101515 { margin:5px 10px 15px 15px; } .m3500 { margin:3px 5px 0px 0px; } .m_ul { margin:10px 10px 10px 25px; } .mt5 { margin-top:5px; } .mt10 { margin-top:10px; } .mt20 { margin-top:20px; } .mt40 { margin-top:40px; } .mb10 { margin-bottom:10px; } .mlr10 { margin-left:10px; margin-right:10px; } .pt5 { padding-top:5px; } .pt10 { padding-top:10px; } /*基本テキスト装飾*/ .font12 { font-size:12px; line-height:18px; } .font16 { font-size:16px; line-height:24px; } .font18 { font-size:18px; line-height:30px; } .font30 { font-size:30px; line-height:36px; } .txt_center { text-align:center; } .txt_left { text-align:left; } .txt_right { text-align:right; } .txt_bold { font-weight:bold; } /*赤太字*/ .bold_red { font-weight:bold; color:#ff0000; } /*紫太字*/ .bold_purple { font-weight:bold; color:#3300ff; } /*青太字*/ .bold_blue { font-weight:bold; color:#001aff; } /*黄太字*/ .bold_yellow { font-weight:bold; color:#ff9900; } /*foot_未訪問リンク*/ #foot a:link { color:#0066cc; text-decoration:underline; } /*foot_訪問済みリンク*/ #foot a:visited { color:#0066cc; text-decoration:underline; } /*foot_マウスカーソルを乗せたリンク*/ #foot a:hover { color:#ffffff; background:#0066cc; text-decoration:none; } /*sidemenu_未訪問リンク*/ #sidemenu a:link { color:#0066cc; text-decoration:underline; } /*sidemenu_訪問済みリンク*/ #sidemenu a:visited { color:#0066cc; text-decoration:underline; } /*sidemenu_マウスカーソルを乗せたリンク*/ #sidemenu a:hover { display:block; width:98%; color:#ffffff; background:#0066cc; text-decoration:none; } h2.top { height: 35px; width: auto; font-size: 20px; font-weight: bold; color: #FFFFFF; background: url(../assets/images/top/p_titlebase.png) no-repeat; padding-top: 12px; padding-left: 40px; margin-left:15px; } h2.top2 { height: 35px; width: auto; font-size: 20px; font-weight: bold; color: #FFFFFF; background: url(../assets/images/top/p_titlebase2.png) no-repeat; padding-top: 12px; padding-left: 40px; margin-left:5px; } /*画像リンク マウスオーバーで背景透かし*/ a .hover_img{ transition:all 0.5s ease; } a:hover .hover_img{ opacity: 0.7; filter: alpha(opacity=70); } /*CHリンク*/ .ch_link { width:219px; border-right:1px dotted #666666; border-left:1px dotted #666666; border-bottom:1px dotted #666666; } .ch_link_txt { padding:5px; color:#666666; font-size:12px; line-height:18px; } #all { margin: 0px auto; width:1000px; -moz-box-shadow: 0 0 0 0px #ffffff, 1px 1px 4px 3px rgba(10,10,0,.5); -webkit-box-shadow: 0 0 0 0px #ffffff, 1px 1px 4px 3px rgba(10,10,0,.5); box-shadow: 0 0 0 0px #ffffff, 1px 1px 6px 3px rgba(10,10,0,.5); } #wrapper { } #wrapper2 { margin: 0px auto; width:1000px; background:#ffffff; } #wrapper3 { margin: 0px auto; width:1000px; background:#ffffff; padding-top:10px; } #main { width:740px; background:url(../assets/images/common/main_background.png); margin: 0px 12px 20px 0px; float: right; } #foot { padding: 5px 5px 50px; width: 980px; clear: both; margin-top: 15px; margin-right: auto; margin-left: auto; text-align:right; } #foot #copyright { text-align: right; color: rgb(51, 51, 51); font-size: 12px; margin-top: 5px; margin-bottom: 5px; } .stitched { width:685px; padding: 5px 10px; margin-left:15px; background: #f39800; color: #ffffff; text-decoration: none; font-size: 21px; font-weight: bold; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; text-shadow: -1px -1px #000000; /* ↓がポイント */ border: 1px dashed #fff; -moz-box-shadow: 0 0 0 4px #f39800, 1px 1px 4px 3px rgba(10,10,0,.5); -webkit-box-shadow: 0 0 0 4px #f39800, 1px 1px 4px 3px rgba(10,10,0,.5); box-shadow: 0 0 0 4px #f39800, 1px 1px 6px 3px rgba(10,10,0,.5); } .stitched_red { width:685px; padding: 5px 10px; margin-left:15px; background: #f39800; color: #cc0000; text-decoration: none; font-size: 21px; font-weight: bold; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; text-shadow: 1px 1px #ffffff; /* ↓がポイント */ border: 1px dashed #fff; -moz-box-shadow: 0 0 0 4px #f39800, 1px 1px 4px 3px rgba(10,10,0,.5); -webkit-box-shadow: 0 0 0 4px #f39800, 1px 1px 4px 3px rgba(10,10,0,.5); box-shadow: 0 0 0 4px #f39800, 1px 1px 6px 3px rgba(10,10,0,.5); } /*上部ヘッダー・メニュー*/ #headder { width:1000px; height:60px; margin-left:auto; margin-right:auto; background:#f39800; padding-top:10px; } #headder ul { list-style:none; margin:0px; padding:0px; } #headder h1 { font-size:12px; padding:5px; float:left; line-height:14px; color:#ffffff; } .head_logo { float:left; width:300px; padding:0px; margin:0px; } .head_txt { float:left; width:310px; margin:0px; } .head_tel { float:left; width:390px; padding:0px; margin:0px; } /*メインイメージ部分*/ .mainimg_waku { position: relative; } .main-img { width: 1000px; height: 270px; } h2 a.logo { position: absolute; top: -90px; left: 15px; } h3 a.toiawase { position: absolute; top: 15px; left: 730px; } /*ソーシャルリンク*/ #social { width:390px; float:right; margin-bottom:5px; } #social ul { list-style:none; margin:0px; padding:0px; } #social li { float:right; margin:3px 5px 0px 0px; padding:0px; } #logo_tel { float:right; } /*上部メニュー*/ #top_menu { background:url(../assets/images/common/main_background.png); height:50px; position: absolute; width:740px; left:248px; top:220px; } #top_menu .navi li { list-style:none; float:right; } #top_menu .navi li a { font-size:14px; text-align:center; margin: 3px; padding: 8px 8px 15px 8px; color:#005633; background:url(../assets/images/common/menu_sankaku.png) no-repeat bottom center #ffffff; /*background: rgba(255, 255, 255, 0.7); RGBを10進数(0~255)で指定、不透明度を0~1.0で指定 */ text-decoration:none; border-bottom:4px double #eb6100; } #top_menu .navi li a:hover { font-size:14px; text-align:center; margin: 3px; padding: 8px 8px 15px 8px; color:#ffffff; background:url(../assets/images/common/menu_sankaku_ov.png) no-repeat bottom center #cc0000; /*background: rgba(204, 0, 0, 0.7); RGBを10進数(0~255)で指定、不透明度を0~1.0で指定 */ text-decoration:underline; border-bottom:4px double #ffffff; } #topr_menu { position: absolute; top: 15px; left: 750px; } #topr_menu .navi li { list-style-type:none; } #topr_menu .navi li a { margin: 0px; padding: 0px; } /*左サイドメニュー*/ .lnavi_kakaku li { list-style-type:none; margin-top:100px; background:#ffffff; } .lnavi_gaina li { list-style-type:none; margin-top:15px; background:#ffffff; } .lnavi li { position: absolute; list-style-type:none; margin-bottom:10px; top:-50px; background:#ffffff; } /*サイド上部メニュー*/ .w700 { width:750px; float:left; } .w230 { width:230px; float:right; padding:0px; } /*サイドメニュー*/ #side { position: relative; width: 219px; margin-bottom: 20px; margin-left: 15px; float: left; } #sidemenu { border: 1px solid #98c71d; margin-bottom: 20px; } .smenu_title { background:#98c71d; color:#ffffff; font-weight:bold; padding:5px 5px 5px 10px; } #sidemenu ul { margin: 0px; padding: 0px; } #sidemenu ul li { margin: 0px; padding: 7px 5px 7px 7px; border-bottom:1px solid rgb(165, 196, 99); list-style-type: none; background-repeat: no-repeat; } .smenu_bunner { margin:30px auto 0px auto; text-align:center; } .smenu_kamei_title { background:#98c71d; color:#ffffff; font-weight:bold; padding:5px 5px 5px 10px; margin-top:15px; text-align:center; } .smenu_kamei { margin:10px auto 0px auto; text-align:center; } .smenu_kamei_img { margin-top:10px; } /*色変更版*/ #sidemenu2 { border: 1px solid #0068c1; margin-top: 10px; margin-bottom: 20px; } .smenu_title2 { background:#0068c1; color:#ffffff; font-weight:bold; padding:5px 5px 5px 10px; } #sidemenu2 ul li { margin: 0px; padding: 7px 5px 7px 7px; border-bottom:1px solid #0068c1; list-style-type: none; background-repeat: no-repeat; } /*sidemenu2_未訪問リンク*/ #sidemenu2 a:link { color:#0066cc; text-decoration:underline; } /*sidemenu2_訪問済みリンク*/ #sidemenu2 a:visited { color:#0066cc; text-decoration:underline; } /*sidemenu2_マウスカーソルを乗せたリンク*/ #sidemenu2 a:hover { display:block; width:98%; color:#ffffff; background:#0066cc; text-decoration:none; } /*main内*/ .main_title_top { margin:0px auto 0px auto; } .main_title { margin:15px auto 5px auto; } .main_img { margin:0px auto 5px auto; } .w640waku { width:690px; background:#ffffff; margin-left:auto; margin-right:auto; } .w650waku { width:685px; padding: 5px 10px; background:#ffffff; margin-top:20px; margin-left:15px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 1px dashed #8d4c00; -moz-box-shadow: 0 0 0 4px #ffffff, 1px 1px 4px 3px rgba(10,10,0,.5); -webkit-box-shadow: 0 0 0 4px #ffffff, 1px 1px 4px 3px rgba(10,10,0,.5); box-shadow: 0 0 0 4px #ffffff, 1px 1px 6px 3px rgba(10,10,0,.5); } .ex_img_l { position: relative; top: -5px; left: -5px; } /*ぱんくず*/ .panc { margin:0px 5px 10px 20px; font-size:12px; } /*こだわり Stitle*/ .prej_stitle li { position: relative; list-style:none; width: 690px; height:49px; margin-top:15px 0px 5px 0px; } .stitle_txt { position: absolute; text-align:left; font-size:14px; line-height:16px; color:#000000; font-weight:bold; padding:7px; text-shadow:1px 1px 3px #ffffff,-1px 1px 3px #ffffff,1px -1px 3px #ffffff,-1px -1px 3px #ffffff; left: 67px; top: 7px; } /*各ページh2タイトル*/ .knowledge { background:url(../assets/images/knowledge/knowledge_title.png) no-repeat left top; width:718px; height:60px; text-align:left; } .h2_txt { padding:20px 0px 0px 65px; color:#143f12; font-size:30px; display:block; line-height:34px; } .scroll_top { position:fixed; bottom:0px; right:0px; opacity:0; cursor:pointer; } /*左メインメニュー*/ .left_main { margin-top:15px; list-style-type: none; } .left_main li { padding:5px 5px 5px 20px; border-bottom:1px dashed #f39800; } .left_main li:first-child { background:#f39800; color:#ffffff; padding:5px 5px 5px 10px; } .left_main a { color:#000000; text-decoration:none; display:block; } .left_main a:hover { color:#000000; text-decoration:underline; } .first a { color:#ffffff; text-decoration:none; } .first a:hover { color:#ffffff; text-decoration:underline; } /*右上問合せメニュー*/ #right_contact { list-style-type: none; position: absolute; top: 10px; left: 760px; } #right_contact li { width:200px; padding: 5px 10px; margin-top:20px; background: #8d4c00; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; /* ↓がポイント */ border: 1px dashed #fff; -moz-box-shadow: 0 0 0 4px #8d4c00, 1px 1px 4px 3px rgba(10,10,0,.5); -webkit-box-shadow: 0 0 0 4px #8d4c00, 1px 1px 4px 3px rgba(10,10,0,.5); box-shadow: 0 0 0 4px #8d4c00, 1px 1px 6px 3px rgba(10,10,0,.5); } #right_contact a { color:#ffffff; text-shadow: 1px 1px #000000; text-decoration: none; font-size: 18px; font-weight: bold; display:block; } #right_contact a:hover { color:#ffff00; text-decoration:underline; } /*失敗しない業者選び Stitle*/ .intro_stitle li { position: relative; list-style:none; width: 690px; height:49px; margin:15px 0px 5px 0px; } .intro_txt { position: absolute; text-align:left; font-size:14px; line-height:16px; color:#000000; font-weight:bold; padding:7px; text-shadow:1px 1px 3px #ffffff,-1px 1px 3px #ffffff,1px -1px 3px #ffffff,-1px -1px 3px #ffffff; left: 73px; top: 25px; } .intro_txt02 { position: absolute; text-align:right; font-size:18px; line-height:18px; color:#cc0000; font-weight:bold; padding:4px; text-shadow:1px 1px 3px #ffffff,-1px 1px 3px #ffffff,1px -1px 3px #ffffff,-1px -1px 3px #ffffff; left: 138px; top: 17px; width: 411px; } /*トップページ メインメニューバナー部*/ #w665point { position:relative; width:715px; background:url(../assets/images/top/background000.png); margin-left:auto; margin-right:auto; padding-bottom:5px; -moz-box-shadow: 0 0 0 0px #ffffff, 1px 1px 4px 3px rgba(10,10,0,.5); -webkit-box-shadow: 0 0 0 0px #ffffff, 1px 1px 4px 3px rgba(10,10,0,.5); box-shadow: 0 0 0 0px #ffffff, 1px 1px 6px 3px rgba(10,10,0,.5); } #w665point li { list-style:none; float: left; margin:5px 0px 0px 5px; } /*塗料の機能と価格 Stitle*/ .price_stitle li { position: relative; list-style:none; width: 670px; height:73px; margin:15px auto 0px auto; } .price_txt01 { position: absolute; text-align:left; font-size:24px; line-height:16px; color:#000000; font-weight:bold; padding:7px; text-shadow:1px 1px 3px #ffffff,-1px 1px 3px #ffffff,1px -1px 3px #ffffff,-1px -1px 3px #ffffff; left: 67px; top: 29px; } .price_txt02 { position: absolute; text-align:right; font-size:12px; line-height:16px; padding:4px; text-shadow:1px 1px 3px #ffffff,-1px 1px 3px #ffffff,1px -1px 3px #ffffff,-1px -1px 3px #ffffff; left: 189px; top: 19px; width: 411px; }