@charset "utf-8";
/*
Theme Name:bop-coding
Thme URI:http://bop-coding.com/
Description:Theme for bop coding.
Author:bop coding
*/

/*
search items

=01_base
=02_header
=03_navi
=04_footer
=05_footer_link_color
=06_top
=07_sitemap
=08_layout
=09_general_purpose
=10_service
=11_specifications
=12_flow
=13_price
=14_inq
=15_results
=16_outline
=17_serch

*/

/*---=01_base---*/
* {
	margin:0px;
	padding:0px;
}

body {
	font:normal normal normal 75%/1.6 Verdana, "ＭＳ Ｐゴシック", sans-serif;
	text-align: center;
	color:#685D44;
	background:#FFF url(/img/bg_body.jpg) repeat-x left top;
}

h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight: normal;
}

img {
	border:0;
	vertical-align:bottom;
}

ul {
	list-style:none;
}

table {
	border:none;
	border-collapse:collapse;
	font-size:100%;
}

table caption {
	display:none;
}

td,th {
	text-align:left;
	line-height: 1.4;
}

hr {
	display:none;
}

#wrapper {
	position:relative;
	margin:0px auto;
	width:750px;
	text-align:left;
	overflow:hidden;
}


#main_box {
	width:750px;
	float:left;
	margin: 10px 0px 0px;
	background: url(/img/bg_left_navi.jpg) repeat-y;
}

#main {
	width:530px;
	float:right;
	margin: 0px 0px 0px 10px;
}

a {
	font-weight: bold;
}


a:link,a:visited {
	color:#333333;
	text-decoration:none;
}

a:active,a:hover {
	color:#666666;
	text-decoration:none;
}

/*---=02_header---*/

div#header {
	position:relative;
	width:750px;
	height:150px;
	margin:0px;
	text-align:left;
	background:url(/img/bg_header.jpg) 352px 29px no-repeat;
}

div#header h1 {
	position:absolute;
	left:0px;
	top:29px;
	width:325px;
	height:75px;
	background:url(/img/h1.jpg) no-repeat;
	text-indent:-99999px;
}

div#header h1 a {
	display:block;
	width:325px;
	height:75px;
	overflow:hidden;
}

div#header p#head_img {
	position:absolute;
	left:350px;
	top:79px;
	width:330px;
	height:18px;
	line-height:18px;
	text-indent:-99999px;
	background: url(/img/header_txt.jpg) no-repeat;
}

div#header div {
	position:absolute;
	left:570px;
	top:44px;
	width:180px;
	height:30px;
	text-align:right;
}

/*---=03_navi---*/

/*navi_head_right*/

#navi_head_right {
	position:absolute;
	top:10px;
	left:387px;
	float:left;
	width:363px;
	margin: 0px 0px 0px 0px;
	z-index:5;

}

#navi_head_right ul {
	width:363px;
	float:left;
	list-style:none;
	margin: 0px;
}

#navi_head_right ul li {
	width:121px;
	height:18px;
	float:left;
	margin: 0px;
}

#navi_head_right ul li a {
	display:block;
	width:121px;
	height:18px;
	background:url(/img/bg_navi01.jpg) top left no-repeat;
	text-align:center;
	color:#FFFFFF;
	overflow:hidden;
	font-weight: normal;
}

#navi_head_right ul li a:active,#navi_head_right ul li a:hover {
	background-position: 0px -18px;
}

/*#navi_head_left*/

#navi_head_left {
	position:absolute;
	top:105px;
	left:0px;
	float:left;
	width:750px;
	margin: 0px 0px 0px 0px;
	z-index:5;
}

#navi_head_left ul {
	width:750px;
	float:left;
	list-style:none;
	margin: 0px 0px 0px 0px;
}

#navi_head_left ul li {
	float:left;
	width:125px;
	height:30px;
	margin:0px;
}

#navi_head_left ul li a {
	display:block;
	width:125px;
	height:30px;
	background:url(/img/bg_navi02.jpg) top left no-repeat;
	overflow:hidden;
	text-align:center;
	font-weight: normal;
}

#navi_head_left ul li a:active,#navi_head_left ul li a:hover {
	background-position:bottom;
}

/*left_navi*/

#navi {
	float:left;
	width:190px;
	margin: 0px 0px 0px 0px;
}

#navi h3 {
	float:left;
	width:190px;
	height:53px;
	background:url(/img/left_navi_title.jpg);
	text-indent:-99999px;
	margin: 0px 0px 5px;
}

#navi ul {
	width:190px;
	height:200px;
	float:left;
	clear:both;
	list-style:none;
	margin: 0px 0px 0px 0px;
}

#navi ul li {
	line-height:20px;
	margin:0px 0px 5px;
}

#navi ul li a {
	padding: 0px 0px 0px 15px;
	display:block;
	background: url(/img/icon01.jpg) 0px 7px no-repeat;
	font-weight: normal;
}

#navi ul li a:active,#navi ul li a:hover {
	background: url(/img/icon01_ov.jpg) 0px 7px no-repeat;
}

#navi ul#banner {
	width:190px;
	float:left;
	margin: 0px 0px 40px;
}

#navi ul#banner li {
	width:190px;
	margin:0px 0px 10px;
	text-indent:-99999px;
}

#navi ul#banner li a {
	display:block;
	width:190px;
	overflow:hidden;
	background-position: left top;
	background-repeat:no-repeat;
}

#navi ul#banner li.banner01 {
	height:40px;
}
#navi ul#banner li.banner01 a {
	background-image:url(/img/banner01.jpg);
	height:40px;
}

#navi ul#banner li.banner02 {
	height:70px;
}
#navi ul#banner li.banner02 a {
	background-image:url(/img/banner02.jpg);
	height:70px;
}

#navi ul#banner li.banner03 {
	height:31px;
}
#navi ul#banner li.banner03 a {
	background-image:url(/img/banner03.jpg);
	height:31px;
}


#navi_fix {
	width:190px;
	clear:both;
	margin: 0px 0px 0px 0px;
}

#navi_fix p {
	margin-bottom:10px;
}

p.valid{
	width:88px;
	height:31px;
	text-indent:-99999px;
	float:left;
}

p.valid a{
	display:block;
	width:88px;
	height:31px;
	background-repeat:no-repeat;
}

p.valid a.valid_xhtml{
	background-image:url(/img/valid-xhtml10.jpg);
}

p.valid a.valid_css{
	background-image: url(/img/valid-css.jpg);
}

p.wordpress {
	width:190px;
	height:30px;
	text-indent:-99999px;
	float:left;
}

p.wordpress a{
	display:block;
	width:190px;
	height:30px;
	background: url(/img/word_press.jpg) no-repeat;
}

p.rss {
	width:190px;
	height:16px;
	text-indent:-99999px;
	float:left;
}

p.rss a{
	display:block;
	width:190px;
	height:16px;
	background: url(/img/rss.jpg) no-repeat;
}



/*---=04_footer---*/

#footer {
	clear:both;
	height:45px;
	font-size:80%;
	background: url(/img/bg_footer.jpg) repeat-x;
	margin: 10px 0px 0px;
	overflow:hidden;
	color:#FFFFFF;
}

address {
	display:block;
	width:750px;
	margin: 0px auto;
	text-align:right;
	font-style: normal;
	clear:both;
	line-height: 60px;
}

/*---=05_footer_link_color---*/

address a:link,address a:visited {
	color:#FFFFFF;
}
address a:active,address a:hover {
	color:#999999;
}

/*---=06_top---*/

#top_sub01 {
	background-image: url(/img/top_sub01.jpg);
}

ul.top_ca {
	width:530px;
	float:left;
	margin: 0px 0px 20px 0px;
}

ul.top_ca li {
	width:260px;
	height:105px;
	margin: 0px 0px 0px 0px;
}

ul.top_ca li a {
	display:block;
	width:260px;
	height:105px;
	text-indent:-99999px;
}

ul.top_ca li.to_flow {
	float:left;
}

ul.top_ca li.to_price {
	float:right;
}

ul.top_ca li.to_flow a {
	background-image:url(/img/to_flow.jpg);
}

ul.top_ca li.to_price a {
	background-image:url(/img/to_price.jpg);
}

ul.top_ca li a:active,ul.top_ca li a:hover {
	background-position:bottom;
}

/*---=07_sitemap---*/

#sitemap_sub01 {
	background-image: url(/img/sitemap_sub01.jpg);
}

dl#sitemap dt {
	border-bottom:#685D44 solid 1px;
	border-left:#685D44 solid 5px;
	font-size:120%;
	font-weight:bold;
	margin-bottom:10px;
	text-indent:8px;
}

dl#sitemap dd {
	text-indent: 20px;
	margin-bottom:15px;
	border-bottom:#685D44 dotted 1px;
}

dl#sitemap dt a:link,dl#sitemap dt a:visited {
	color: #685D44;
	text-decoration:none;
}
dl#sitemap dt a:active,dl#sitemap dt a:hover {
	color: #553e2d;
	text-decoration: none;
}

/*---=08_layout---*/

.seg01 {
	width:520px;
	margin: 0px 0px 0px 10px;
	float:right;
}

.seg01_01 {
	width:520px;
	float:left;
	padding: 0px 0px 10px;
}

.seg01_02 {
	width:520px;
	float:left;
	padding: 0px 0px 20px;
}

.seg01_01_left01 {
	width:300px;
	float:left;
	margin: 0px 20px 0px 0px;
}

.seg01_01_right01 {
	width:200px;
	float:right;
	margin: 0px 0px 0px 0px;
}

.seg01_01_left02 {
	width:160px;
	float:left;
	margin: 0px 20px 0px 0px;
}

.seg01_01_right02 {
	width:160px;
	float:right;
	margin: 0px 0px 0px 0px;
}

.seg01_01_left02 img,.seg01_01_right02 img {
	margin: 0px 0px 20px 0px;
}

/*---=09_general_purpose---*/

#main h2 {
	clear:both;
	width:530px;
	height:40px;
	margin: 0px 0px 10px;
	background-repeat:no-repeat;
	text-indent:-99999px;
}

#main h3 {
	clear:both;
	width:530px;
	height:20px;
	margin: 0px 0px 10px;
	background: url(/img/bg_sub02.jpg) no-repeat;
	text-indent:40px;
	font-weight: bold;
	color:#FFFFFF;
}

#main h3 a{
	color:#FFFFFF;
}

ul.icon02 {
	width:100%;
	float:left;
}

ul.icon02 li{
	background-image:url(/img/icon02.jpg);
	background-position:0px 3px;
	background-repeat: no-repeat;
	padding-left:18px;
	margin: 0px 0px 5px;
	font-weight: bold;
}

.to_top {
	clear:both;
	text-indent:-99999px;
	overflow:hidden;
}

.to_top a{
	display:block;
	float:right;
	width:130px;
	height:22px;
	background: url(/img/to_top.jpg) left top no-repeat;
	margin: 0px 0px 15px;
}

.to_top a:active,.to_top a:hover{
	background-position: left bottom;
}

.to_detail {
	clear:both;
	text-indent:-99999px;
	overflow:hidden;
}

.to_detail a{
	display:block;
	float:right;
	width:132px;
	height:23px;
	background: url(/img/to_detail.jpg) left top no-repeat;
	margin: 0px 0px 15px;
}

.to_detail a:active,.to_detail a:hover{
	background-position: left bottom;
}

.to_inq {
	clear:both;
	text-indent:-99999px;
	overflow:hidden;
}

.to_inq a{
	display:block;
	float:right;
	width:132px;
	height:23px;
	background: url(/img/to_inq.jpg) left top no-repeat;
	margin: 0px 0px 15px;
}

.to_inq a:active,.to_inq a:hover{
	background-position: left bottom;
}

table.chart01 {
	width:100%;
}

table.chart01 th,table.chart01 td{
	border:#68612F solid 1px;
	padding: 10px 10px;
	vertical-align: top;
}

table.chart01 th {
	font-weight: bold;
}

table.chart01 th.bg01 {
	background-color: #BDBC95;
}

table.chart01 td {
	width:25%;
}

table.chart01 td.chart01_01 {
	width: auto;
}

.mb10 {
	margin-bottom:10px;
}
.mb15 {
	margin-bottom:15px;
}
.mb20 {
	margin-bottom:20px;
}

.ali_cen {
	text-align:center;
}
.ali_right {
	text-align: right;
}
.ali_left {
	text-align: left;
}

.fl {
	float:left;
}
.fr {
	float:right;
}

.clb {
	clear:both;
}
.cll {
	clear:left;
}
.clr {
	clear:right;
}

/*---=10_service---*/

#service_sub01 {
	background-image: url(/img/service_sub01.jpg);
}

/*---=11_specifications---*/

#specifications_sub01 {
	background-image: url(/img/specifications_sub01.jpg);
}

/*---=12_flow---*/

#flow_sub01 {
	background-image: url(/img/flow_sub01.jpg);
}

#flow_li {
	float:left;
}

#flow_li li {
	float:left;
	width:120px;
	height:70px;
	margin: 0px 10px 10px 0px;
}

#flow_li li a {
	display:block;
	overflow:hidden;
	width:120px;
	height:70px;
	text-indent:-99999px;
	background-repeat:no-repeat;
}

#flow_li li#flow_li01 a {
	background-image:url(/img/flow_li01.jpg);
}
#flow_li li#flow_li02 a {
	background-image:url(/img/flow_li02.jpg);
}
#flow_li li#flow_li03 a {
	background-image:url(/img/flow_li03.jpg);
}
#flow_li li#flow_li04 a {
	background-image:url(/img/flow_li04.jpg);
}
#flow_li li#flow_li05 a {
	background-image:url(/img/flow_li05.jpg);
}
#flow_li li#flow_li06 a {
	background-image:url(/img/flow_li06.jpg);
}
#flow_li li#flow_li07 a {
	background-image:url(/img/flow_li07.jpg);
}

dl#flow_step {
	float:left;
}

dl#flow_step dt {
	width:520px;
	height:18px;
	margin: 0px 0px 10px;
}
dl#flow_step dd {
	margin: 0px 0px 30px;
}
dl#flow_step dt a {
	display:block;
	width:520px;
	height:18px;
	text-indent:-99999px;
	overflow:hidden;
	background-repeat:no-repeat;
}

dl#flow_step dt#flow_dt01 a {
	background-image:url(/img/flow_dt01.jpg);
}

dl#flow_step dt#flow_dt02 a {
	background-image:url(/img/flow_dt02.jpg);
}

dl#flow_step dt#flow_dt03 a {
	background-image:url(/img/flow_dt03.jpg);
}

dl#flow_step dt#flow_dt04 a {
	background-image:url(/img/flow_dt04.jpg);
}

dl#flow_step dt#flow_dt05 a {
	background-image:url(/img/flow_dt05.jpg);
}

dl#flow_step dt#flow_dt06 a {
	background-image:url(/img/flow_dt06.jpg);
}

dl#flow_step dt#flow_dt07 a {
	background-image:url(/img/flow_dt07.jpg);
}

/*---=13_price---*/


#price_sub01 {
	background-image: url(/img/price_sub01.jpg);
}

/*---=14_inq---*/

#inq_sub01 {
	background-image: url(/img/inq_sub01.jpg);
}

dl#req01 {
	width:520px;
	clear:both;
}

dl#req01 dt{
	float:left;
	width:140px;
	margin: 0px 20px 10px 0px;
	font-weight:bold;
}

dl#req01 dd{
	float:left;
	width:360px;
	margin: 0px 0px 10px 0px;
}


/*---=15_results---*/

#results_sub01 {
	background-image: url(/img/results_sub01.jpg);
}

/*---=16_outline---*/

#outline_sub01 {
	background-image: url(/img/outline_sub01.jpg);
}

dl.outline01,dl.outline02 {
	float:left;
}

dl.outline01 dt,dl.outline01 dd,dl.outline02 dt,dl.outline02 dd {
	float:left;
	line-height:1.4;
}

dl.outline01 dt {
	width:40px;
	margin: 0px 10px 5px 0px;
}

dl.outline01 dd {
	width:150px;
	margin: 0px 20px 5px 0px;
}

dl.outline02 dt {
	width:90px;
	margin: 0px 10px 5px 0px;
}

dl.outline02 dd {
	width:150px;
	margin: 0px 20px 5px 0px;
}

/*---=17_serch---*/

#serch_sub01 {
	background-image: url(/img/serch_sub01.jpg);
}