/* ********************************* FileName: style.css UpdatedBy: - *********************************** */ /* ********************************* *********************************** */ /* ********************************* 001 : Base Layout 002 : General purpose ID & CLASS 003 : Exclusive use ID & CLASS *********************************** */ /* ********************************* 001 : Base Layout *********************************** */ /* --------------------------------- base ----------------------------------- */ body { margin:0;padding:0; text-align:center; color:#333333;font-size:80%;line-height:160%; } /* wrap */ .wrap {width:950px;margin:0 auto;text-align:left;} /* --------------------------------- header ----------------------------------- */ #header {background:url(../images/common/header_bg.jpg) 0 0 repeat-x;height:92px;} #header_inner {width:950px;margin:0 auto;text-align:left;} #header p#c_txt {padding:5px 0 0 5px;} #header h1 a{display:block;width:300px;height:60px;background:url(../images/common/h1_0118.gif) 0 0 no-repeat;} #header h1 a span {display:none;} #header #inquiry {float:right;background-color:#EBECE7;width:340px;} #header #inquiry p {} #header #inquiry p.tel { width:288px;height:59px;text-indent:-9999em;margin:15px 26px 10px; background:url(../images/common/header_img_inqTel.gif) 0 0 no-repeat; } #header #inquiry p.btn_form a { display:block;width:286px;height:24px;margin:0 27px 20px; background:url(../images/common/header_btn_inq.jpg) 0 0 no-repeat; } #header #inquiry p.btn_form a:hover {background:url(../images/common/header_btn_inq.jpg) 0 -24px no-repeat;} #header #inquiry p.btn_form a span {display:none;} /* --------------------------------- gnavi ----------------------------------- */ #gnavi {background:url(../images/common/gnavi_bg.jpg) 0 top repeat-x;height:40px;} #gnavi ul {color:#FFFFFF;width:950px;} #gnavi li {float:left;} #gnavi li a{display:block;height:40px;width:190px;} #gnavi li a span {display:none;} #gnavi li#li_01 a {background:url(../images/common/gnavi.jpg) 0px 0px no-repeat;} #gnavi li#li_02 a {background:url(../images/common/gnavi.jpg) -190px 0px no-repeat;} #gnavi li#li_03 a {background:url(../images/common/gnavi.jpg) -380px 0px no-repeat;} #gnavi li#li_04 a {background:url(../images/common/gnavi.jpg) -570px 0px no-repeat;} #gnavi li#li_05 a {background:url(../images/common/gnavi.jpg) -760px 0px no-repeat;} #gnavi li#li_01 a:hover, body#index #gnavi li#li_01 a {background:url(../images/common/gnavi.jpg) 0px -40px no-repeat;} #gnavi li#li_02 a:hover, body#service #gnavi li#li_02 a, body#service_web #gnavi li#li_02 a, body#service_shop #gnavi li#li_02 a, body#service_system #gnavi li#li_02 a, body#service_trans #gnavi li#li_02 a {background:url(../images/common/gnavi.jpg) -190px -40px no-repeat;} #gnavi li#li_03 a:hover, body#works #gnavi li#li_03 a {background:url(../images/common/gnavi.jpg) -380px -40px no-repeat;} #gnavi li#li_04 a:hover, body#company #gnavi li#li_04 a {background:url(../images/common/gnavi.jpg) -570px -40px no-repeat;} #gnavi li#li_05 a:hover, body#inquiry #gnavi li#li_05 a {background:url(../images/common/gnavi.jpg) -760px -40px no-repeat;} /* --------------------------------- contents ----------------------------------- */ #contents {width:950px;text-align:left;margin:10px auto;} #contents .anp { margin-top:30px;} /* sidenavi */ #sidenavi {width:244px;float:left;} #sidenavi #bg_btm {background-color:#E6E6DE; padding-top:0px;padding-bottom:3px;margin-bottom:10px; border-top-width: 7px;border-right-width: 1px;border-bottom-width: 1px;border-left-width: 1px; border-top-style: solid;border-right-style: solid;border-bottom-style: solid;border-left-style: solid; border-top-color: #000000;border-right-color: #000000;border-bottom-color: #000000;border-left-color: #000000; } #sidenavi #bg_btm2 {background-color:#E6E6E6;padding-bottom:5px;margin-bottom:0px;} #sidenavi #bg_btm3 {} #sidenavi ul {margin:10px 9px 0;} #sidenavi li {margin-bottom:5px;} #sidenavi li a {display:block;width:224px;height:70px;} #sidenavi li a span {display:none;} #sidenavi li#web a {background:url(../images/common/side_btn01.jpg) 0 0 no-repeat;} #sidenavi li#sys a {background:url(../images/common/side_btn03.jpg) 0 0 no-repeat;} #sidenavi li#tra a {background:url(../images/common/side_btn04.jpg) 0 0 no-repeat;} #sidenavi li#web a:hover, body#service_web #sidenavi li#web a {background:url(../images/common/side_btn01.jpg) 0 -70px no-repeat;} #sidenavi li#sys a:hover {background:url(../images/common/side_btn03.jpg) 0 -70px no-repeat;} body#service_system #sidenavi li#sys a {background:url(../images/common/side_btn03.jpg) 0 -70px no-repeat;} #sidenavi li#tra a:hover {background:url(../images/common/side_btn04.jpg) 0 -70px no-repeat;} body#service_trans #sidenavi li#tra a {background:url(../images/common/side_btn04.jpg) 0 -70px no-repeat;} #sidenavi ul#other {padding:10px 0 0 1px;margin-top:5px;_padding-top:5px} #sidenavi li#srv a {width:226px;height:71px;background:url(../images/common/side_btn_0118_01b.jpg) 0 0 no-repeat;} #sidenavi li#stf a {width:226px;height:71px;background:url(../images/common/side_btn_0118_02b.jpg) 0 0 no-repeat;} #sidenavi li#wrk a {width:226px;height:71px;background:url(../images/common/side_btn_0118_03b.jpg) 0 0 no-repeat;} #sidenavi li#rct a {width:226px;height:71px;background:url(../images/common/side_btn_0118_04b.jpg) 0 0 no-repeat;} #sidenavi li#prt a {width:226px;height:71px;background:url(../images/common/side_btn_0118_05b.jpg) 0 0 no-repeat;} #sidenavi li#inq a {width:226px;height:71px;background:url(../images/common/side_btn_0118_06b.jpg) 0 0 no-repeat;} #sidenavi li#srv a:hover {background:url(../images/common/side_btn_0118_01b.jpg) 0 -71px no-repeat;} #sidenavi li#stf a:hover {background:url(../images/common/side_btn_0118_02b.jpg) 0 -71px no-repeat;} #sidenavi li#wrk a:hover {background:url(../images/common/side_btn_0118_03b.jpg) 0 -71px no-repeat;} #sidenavi li#rct a:hover {background:url(../images/common/side_btn_0118_04b.jpg) 0 -71px no-repeat;} #sidenavi li#prt a:hover {background:url(../images/common/side_btn_0118_05b.jpg) 0 -71px no-repeat;} #sidenavi li#inq a:hover {background:url(../images/common/side_btn_0118_06b.jpg) 0 -71px no-repeat;} #sidenavi li#twi a {width:226px;height:63px;background:url(../images/common/side_btn08.gif) 0 0 no-repeat;} #sidenavi li#twi a:hover {background:url(../images/common/side_btn08.gif) 0 -63px no-repeat;} #mainvisual {padding-left:260px;} #mainvisual {_padding-left:20px;} /* IE6only */ *+html #mainvisual {padding-left:20px;} /* IE7only */ #mainvisual #topicpath {margin-bottom:15px;} #mainvisual #topicpath a {text-decoration:underline;} /* mainvisual */ #mainvisual h2 { background:url(../images/common/mv_bg_h2.jpg) 0 0 no-repeat;height:20px; font-weight:bold;font-size:130%;padding:13px 0 14px 35px;margin-bottom:20px; } #mainvisual .section {margin:0 10px 30px 20px;} #mainvisual .section h3 { border-left:3px solid #666666;background-color:#F3F3F3; padding:3px 10px;margin-bottom:10px;font-weight:bold; } #mainvisual .section p {margin-bottom:5px;} /* mainvisual2 */ #contents2 {width:720px;text-align:left;margin:10px auto;} #mainvisual2 {padding-left:10px;} #mainvisual2 {_padding-left:10px;} /* IE6only */ *+html #mainvisual2 {padding-left:10px;} /* IE7only */ #mainvisual2 .section { padding-bottom: 60px;} #mainvisual2 h2 { margin:0 0 30px; padding:0;} #mainvisual2 .section {margin:0 10px 5px 0; font-size:110%;} #mainvisual2 .section h3 { border-left:5px solid #666666;background-color:#F3F3F3; padding:8px 10px 5px;margin:40px 0 20px;font-weight:bold; } #mainvisual2 .section p {} #mainvisual2 .section p.indent {text-indent: -1em; padding-left: 1em; padding-top: 15px;} #mainvisual2 .section p.indent + .indent { padding-top: 0;} #mainvisual2 .section h4 { font-weight: bold; padding-bottom: 10px; margin-top: 20px; } /* --------------------------------- footer & footer_navi ----------------------------------- */ #footer_navi {clear:both;padding-top:15px;} #footer_navi ul {width:950px;margin:0 auto;} #footer_navi li {float:left;margin-right:10px; background:url(../images/common/icon_arrow01.gif) 0 5px no-repeat;padding-left:15px;} #footer {clear:both;background:#000000 url(../images/common/footer_bg.jpg) 0 top repeat-x;height:100px;color:#FFFFFF;} #footer #logo {background:url(../images/common/footer_logo.jpg) 0 13px no-repeat;} #footer p {text-align:right;line-height:150%;padding-top:10px;} #footer p span {padding-left:10px;} #footer p.copyright {padding-top:30px;} /* ********************************* 002 : General purpose ID & CLASS *********************************** */ /* --------------------------------- position ----------------------------------- */ .center {text-align:center;} /* --------------------------------- text ----------------------------------- */ .red {color:#FF0000;} /* --------------------------------- headline ----------------------------------- */ /* --------------------------------- link text ----------------------------------- */ a {color:#000099;text-decoration:none;} a:hover {color:#3399FF;text-decoration:underline;} /* --------------------------------- clearfix ----------------------------------- */ .clearfix:after { content: "."; /* 新しい要素を作る */ display: block; /* ブロックレベル要素に */ clear: both; height: 0; visibility: hidden; } .clearfix { min-height: 1px; } * html .clearfix { height: 1px; /*¥*//*/ height: auto; overflow: hidden; /**/ } /* ********************************* 003 : Exclusive use ID & CLASS *********************************** */ /* --------------------------------- INDEX Page Only ----------------------------------- */ #main_img {background:url(../images/index/bg_mainImg.jpg) 0 0 repeat-x;height:320px;} #main_img ul {background:url(../images/index/bg_mainImg2.jpg) 0 0 no-repeat;height:320px;} #main_img li {margin-left:687px;} #main_img li a {display:block;width:263px;height:80px;} #main_img li a span {display:none;} #main_img li#li_web a {background:url(../images/index/index_navi.jpg) 0px 0px no-repeat;} #main_img li#li_shp a {background:url(../images/index/index_navi.jpg) 0px -80px no-repeat;} #main_img li#li_sys a {background:url(../images/index/index_navi.jpg) 0px -160px no-repeat;} #main_img li#li_tra a {background:url(../images/index/index_navi.jpg) 0px -240px no-repeat;} #main_img li#li_web a:hover {background:url(../images/index/index_navi.jpg) 0px -320px no-repeat;} #main_img li#li_shp a:hover {background:url(../images/index/index_navi.jpg) 0px -400px no-repeat;} #main_img li#li_sys a:hover {background:url(../images/index/index_navi.jpg) 0px -480px no-repeat;} #main_img li#li_tra a:hover {background:url(../images/index/index_navi.jpg) 0px -560px no-repeat;} .ttl {background:url(../images/index/bg_h2.gif) 0 0 no-repeat;height:28px;_height:33px;padding:7px 10px 0 30px;} .ttl h2 {float:left;text-indent:-9999em;width:300px;height:17px;} .ttl p {float:right;} .ttl p a {display:block;width:95px;height:19px;background:url(../images/index/btn_list.gif) 0 0 no-repeat;} .ttl p a span {display:none;} .ttl p a:hover {;background:url(../images/index/btn_list.gif) 0 -19px no-repeat;} #index_works {margin-bottom:20px;background-color:#F6F6F6;} #index_works .ttl h2 {background:url(../images/index/h2_works.gif) 0 0 no-repeat;} #index_works #works_detail {margin:15px 5px; } #works_detail ul {} #works_detail li {float:left;margin:0 8px;_margin:0 6px;width:170px;} #works_detail li img {border:1px solid #999999;} #works_detail li span {display:block;margin:2px 0;} #index_news {} #index_news #news_list {float:left;width:612px;} #news_list dl {margin:10px 10px 0;} #news_list dt { float:left;width:95px;padding-left:15px;padding-bottom:10px;margin-bottom:10px; background:url(../images/index/ico_arrow01.gif) 0 5px no-repeat; } #news_list dd { padding-left:110px;margin-bottom:10px;padding-bottom:10px; background:url(../images/index/line_dot.gif) 0 bottom repeat-x; } #index_news .ttl {background:url(../images/index/bg_h2_02.gif) 0 0 no-repeat;height:28px;_height:33px;padding:7px 10px 0 30px;} #index_news .ttl h2 {background:url(../images/index/h2_news.gif) 0 0 no-repeat;} #index_news #other_list {float:right;width:300px;background:#E6E6E6;padding-bottom:5px;} #index_news #other_list ul {margin:12px 0 0 16px;} #index_news #other_list li {margin-bottom:6px;_margin-bottom:3px;} #index_news #other_list li a {display:block;width:270px;height:85px;} #index_news #other_list li a span {display:none;} #index_news #other_list li#li_srv a {background:url(../images/index/index_srv.jpg) 0 0 no-repeat;} #index_news #other_list li#li_stf a {background:url(../images/index/index_stf.jpg) 0 0 no-repeat;} #index_news #other_list li#li_wrk a {background:url(../images/index/index_wrk.jpg) 0 0 no-repeat;} #index_news #other_list li#li_rct a {background:url(../images/index/index_rct.jpg) 0 0 no-repeat;} #index_news #other_list li#li_prt a {background:url(../images/index/index_prt.jpg) 0 0 no-repeat;} #index_news #other_list li#li_cnt a {background:url(../images/index/index_cnt.jpg) 0 0 no-repeat;} #index_news #other_list li#li_twi a {width:260px;height:73px;background:url(../images/index/btn_twi.gif) 0 0 no-repeat; margin-left:4px;margin-top:15px;} #index_news #other_list li#li_srv a:hover {background:url(../images/index/index_srv.jpg) 0 -85px no-repeat;} #index_news #other_list li#li_stf a:hover {background:url(../images/index/index_stf.jpg) 0 -85px no-repeat;} #index_news #other_list li#li_wrk a:hover {background:url(../images/index/index_wrk.jpg) 0 -85px no-repeat;} #index_news #other_list li#li_rct a:hover {background:url(../images/index/index_rct.jpg) 0 -85px no-repeat;} #index_news #other_list li#li_prt a:hover {background:url(../images/index/index_prt.jpg) 0 -85px no-repeat;} #index_news #other_list li#li_cnt a:hover {background:url(../images/index/index_cnt.jpg) 0 -85px no-repeat;} #index_news #other_list li#li_twi a:hover {background:url(../images/index/btn_twi.gif) 0 -73px no-repeat;} #index_news .ttl_twi {background:url(../images/index/bg_h2_02.gif) 0 0 no-repeat;height:28px;_height:33px;padding:7px 10px 0 30px;} #index_news .ttl_twi h2 {background:url(../images/index/h2_twitter.gif) 0 0 no-repeat;} #index_news .ttl_twi h2 {float:left;text-indent:-9999em;width:300px;height:17px;} #index_service {margin-bottom:20px;} #index_service .ttl h2 {background:url(../images/index/h2_service.gif) 0 0 no-repeat;} #index_service #service_detail {margin:15px 5px;} #service_detail div {} #service_detail div p {} #service_detail div .img_box {margin-left:14px;margin-bottom:10px;width:658px;height:160px;} #service_detail div.div_01 .img_box {background:url(../images/service/img_01.jpg) 0 0 no-repeat;} #service_detail div.div_02 .img_box {background:url(../images/service/img_02.jpg) 0 0 no-repeat;} #service_detail div.div_04 .img_box {background:url(../images/service/img_04.jpg) 0 0 no-repeat;} #service_detail h3, #service_detail p.txt, #service_detail p a span {display:none;} #service_detail p#btn01 a {width:658px;height:160px;background:url(../images/service/img_01.jpg) 0 0 no-repeat;display:block} #service_detail p#btn02 a {width:658px;height:160px;background:url(../images/service/img_02.jpg) 0 0 no-repeat;display:block} #service_detail p#btn03 a {width:658px;height:160px;background:url(../images/service/img_04.jpg) 0 0 no-repeat;display:block} #service_detail p#btn01 a:hover {background:url(../images/service/img_01.jpg) 0 -160px no-repeat;} #service_detail p#btn02 a:hover {background:url(../images/service/img_02.jpg) 0 -160px no-repeat;} #service_detail p#btn03 a:hover {background:url(../images/service/img_04.jpg) 0 -160px no-repeat;} .section #works_threeColumn {margin-left:20px;} .section #works_threeColumn div {float:left;margin-bottom:20px;} .section #works_threeColumn img {margin-bottom:10px;border: 1px solid #CCCCCC;} .mgR {margin-right:40px;} #index_inquiry {background:url(../images/index/img_information.gif) 0 0 no-repeat;margin:20px 54px 0;position:relative;} #index_inquiry p.txt {width:330px;padding:125px 0 30px 35px;} #index_inquiry p.btn_form a {position:absolute;top:145px;left:410px; display:block;width:286px;height:24px;padding:0; background:url(../images/common/header_btn_inq.jpg) 0 0 no-repeat; } #index_inquiry p.btn_form a:hover {background:url(../images/common/header_btn_inq.jpg) 0 -24px no-repeat;} #index_inquiry p.btn_form a span {display:none;} /* --------------------------------- TRANC Page Only ----------------------------------- */ .tbl_trn {width:315px;border-top:1px solid #CCCCCC;border-left:1px solid #CCCCCC;_font-size:90%;_line-height:175%;} .tbl_trn th { width:67%;padding:5px 10px;text-align:center;vertical-align:top;background-color:#CCFFFF; border-right:1px solid #CCCCCC;border-bottom:1px solid #CCCCCC; } .tbl_trn td {padding:5px 10px;border-right:1px solid #CCCCCC;border-bottom:1px solid #CCCCCC;} .tbl_trn td p {padding-bottom:10px;} .tbl_trn2 {width:315px;border-top:1px solid #CCCCCC;border-left:1px solid #CCCCCC;_font-size:90%;_line-height:175%;} .tbl_trn2 th { width:67%;padding:5px 10px;text-align:center;vertical-align:top;background-color:#CCFFCC; border-right:1px solid #CCCCCC;border-bottom:1px solid #CCCCCC; } .tbl_trn2 td {padding:5px 10px;border-right:1px solid #CCCCCC;border-bottom:1px solid #CCCCCC;} .tbl_trn2 td p {padding-bottom:10px;} .price_table {float:left;} .mgR_table {margin-right:10px;} /* --------------------------------- COMPANY Page Only ----------------------------------- */ .tbl_com {width:100%;border:1px solid #CCCCCC;_font-size:90%;_line-height:175%;} .tbl_com th { width:25%;padding:5px 10px;text-align:center;vertical-align:top;background-color:#EEEEEE; border-right:1px solid #CCCCCC;border-bottom:1px solid #CCCCCC; } .tbl_com td {padding:5px 10px;border-right:1px solid #CCCCCC;border-bottom:1px solid #CCCCCC;} .tbl_com td p {padding-bottom:10px;} .tbl_com2 {width:100%;border:1px solid #CCCCCC;_font-size:90%;_line-height:175%;} .tbl_com2 td { padding:5px 10px;border-right:1px solid #CCCCCC;border-bottom:1px solid #CCCCCC;} .tbl_com2 td.pic {width: 30%; height: 150px; padding: 10px; text-align: center;} .tbl_com2 td p {padding-bottom:10px;} .bluetextL {color:#0099CC;font-weight:bold;font-size:140%;margin-right:15px;} .floatLEFT {float:left;} .mgTB20 {margin:20px 0 20px 0;} .pdB20 {padding-bottom:20px;} /* ----------------------------------- SERVICE Page Only ------------------------------------- */ #service_works {margin-bottom:20px;background-color:#F6F6F6;} #service_works .ttl h2 {background:url(../images/index/h2_works.gif) 0 0 no-repeat;} #service_works #service_bn {} #service_bn ul {margin-top:10px;} #service_bn li {float:left;} #service_bn li a {width:308px;height:160px;display:block;} #service_bn li#hp a {background:url(../images/index/img_01_0119.jpg) 0 0 no-repeat;margin-right:12px;} #service_bn li#sy a {background:url(../images/index/img_02_0119.jpg) 0 0 no-repeat;margin-right:12px;} #service_bn li#tr a {background:url(../images/index/img_04_0119.jpg) 0 0 no-repeat;} #service_bn li#hp a:hover {background:url(../images/index/img_01_0119.jpg) 0 -160px no-repeat;} #service_bn li#sy a:hover {background:url(../images/index/img_02_0119.jpg) 0 -160px no-repeat;} #service_bn li#tr a:hover {background:url(../images/index/img_04_0119.jpg) 0 -160px no-repeat;} #service_bn li a span {display:none;} .mgT20 {margin-top:20px;} .mg_illust {margin-top:20px;margin-left:20px;} .listmark {list-style-type:disc;margin-left:20px;} .transDT {margin:10px 0 10px 0;} .transDD {margin:0 0 30px 0;} .blue {color:#0099CC;font-weight:bold;}