@charset "utf-8";

/*基本*/

body {
 background-color:#ffffff;
 color: #000000;
 font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","CI",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
 font-size: 14px;
 line-height: 1.7;
}


a:link {
	color: #0000FF;
	text-decoration: none;
}

a:visited {
	color: #000099;
	text-decoration: none;
}

a:hover {
	color: #006699;
	text-decoration: underline;
	opacity: 0.9;
}

a:active {
	color: #000000;
	text-decoration: none;
}

img {
	border: 0;
}

hr {
	display: none;
}

li {
 list-style-type: none;
}

strong {
 font-weight: bold;
}

em {
 font-weight: bold;
}

h1 {
 font-size: 2.3em;
 font-weight: bolder;
 margin-top: -0.3em;
}

h2 {
 font-size: 1.3em;
 margin-top: -0.3em;
}

.topspace {
 display: block;
 padding-top: 1em;
}

.bottompad {
	padding-bottom: 2em;
}



 /*for font */

.red-font {
 color: #FF0066;
}

.blue-font {
 color: #003399;
}

.yellow-font {
 color: #ffd119;
}

.green-font {
 color: #b1e80c;
}


.purple-font {
 color: #bc3dc1;
}

.big-font {
 font-size: 1.2em;
}

.small-font {
 font-size: 0.9em;
}

.smaller-font {
 font-size: 0.75em;
}

.nomal-weight-font {
 font-weight: normal;
}

.serif {
 font-family: "ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","細明朝体","HGPB","ＭＳ Ｐ明朝","MS PMincho",serif;
 }

a:hover .opaimg {
	filter: alpha(opacity=70);
  -moz-opacity:0.7;
	opacity: 0.7;
}

/* layout部分 */

#wrap {
 width: 930px;
 margin: 0 auto;
 background-color: #ffffff;
 position: relative;
}

#header {
 position: absolute;
 top: 0px;
 left: 0px;
 width: 630px;
 height: 100px;
 padding: 25px 150px;
 background-image: url(../images/common/sitettl.gif);
 background-position: center;
 background-repeat: no-repeat;
}

#wrap-inner {
 padding:120px 20px 20px 20px;
}

#main {
 float: left;
 width: 760px;
}

#sub {
 float: right;
 width: 110px;
}

#content {
 width: 630px;
 float: right;
 padding-bottom: 40px;
}

#pan {
 width: 110px;
 float: left;
 line-height: 1.3;
 font-size: 0.9em;
}

#footer {
 background-color: #f3f3f3;
 clear: both;
}

#footer-inner {
 width: 930px;
 margin: 0 auto;
 background-image:url(../images/common/footerbg.gif);
 background-repeat: repeat-y;
}

 /* box群 */
 
 .box-2-3 {
 width: 370px;
 padding: 20px 0 20px 260px;
 background-repeat: no-repeat;
 }

 .box-3-2 {
 width: 240px;
 padding: 20px 0 20px 390px;
 background-repeat: no-repeat;
 }
 
 .box-1-4 {
 width: 500px;
 padding: 20px 0 20px 130px;
 background-repeat: no-repeat;
 }

 .box-0-5 {
 width: 630px;
 padding: 20px 0;
 background-repeat: no-repeat;
 }


/* header */

#header h1 a,
#header p a {
 display: block;
 width: 630px;
 height: 100px;
 text-indent: -9999px;
}

#snow {
	position: absolute;
	top: 30px;
	left: 100px;
}

#snow2 {
	position: absolute;
	top: 70px;
	left: 140px;
}


/* content */

div#content div {
 background-position: 0 40px;
 padding-top: 40px;
}

#content h2 {
 font-weight: bold;
}

#content div p,
#content div ul,
#content div ol,
#content div dl {
 padding: 0.5em 0;
}


#content div .indent-box {
 padding: 0 0 1em 1em;
}

#content div ol li {
 list-style-type: decimal;
 list-style-position: outside;
 margin-left: 2em;
}

#content div ul li {
 list-style-type: square;
 list-style-position: outside;
 margin-left: 2em;
}



/* sub */

#sub h3 {
 height: 20px;
 background-image: url(../images/common/menuttl.gif);
 background-repeat: no-repeat;
 text-indent: -9999px;
}



#sub ul {
 padding: 8px 0;
 line-height: 2;
}

#sub ul li a {
 display: block;
 padding-left: 4px;
 border: none;
 color: #000000;
}

#sub ul li a:hover {
 border-left: 2px solid #FF0000;
 padding-left: 2px;
 text-decoration: none;
 text-shadow: #ccc 1px 1px 1px;
}


/* panくず部分 */

#pan li {
 padding-top: 0.5em;
}

#pan li a {
 display: block;
 padding-bottom: 1em;
 min-height: 25px;
 background-image: url(../images/common/pan-arrow.gif);
 background-position: 0.5em bottom;
 background-repeat: no-repeat;
}
  



/* footer */

 /* ask */
 
div#ask {
 width: 270px;
 float: left;
 padding-bottom: 10px;
}

div#ask h4 {
 font-size: 1.5em;
 font-weight: ;
 color: #555555;
 padding: 15px 0 10px 30px;
	text-shadow:  0px 1px 0 #fff, 0px -1px 0 #333;
}

div#ask ul {
 padding-left: 30px;
 line-height: 2;
}

div#ask ul li {
 padding: 0 0 0 35px;
 background-repeat: no-repeat;
 background-position: left 50%;
 color: #333333;
}

div#ask ul li a {
 color: #333333;
}

li#ask-mail {
 background-image: url(../images/common/minimail.gif);
}

li#ask-twitter {
 background-image: url(../images/common/minitwitter.gif);
}

li#ask-tel {
 background-image: url(../images/common/minitel.gif);
}

li#ask-fax {
 background-image: url(../images/common/minifax.gif);
}

 /* footer-menu */
 
h4#footer-menuttl {
 display: none;
}

ul#footer-menu {
 width: 650px;
 float: right;
 padding-right: 10px;
}

ul#footer-menu li {
 float: left;
 width: 120px;
 padding: 10px 5px;
}

ul#footer-menu li a {
 color: #000000;
}

ul#footer-menu li ul {
 float: none;
 padding-top: 5px;
}

ul#footer-menu li ul#footer-bear {
 min-height: 200px;
 background-image: url(../images/common/footerbear.gif);
 background-position: right bottom;
 background-repeat: no-repeat;
}

ul#footer-menu li ul li {
 float: none;
 font-size: 0.9em;
 padding: 5px;
}

ul#footer-menu li ul li span {
 display: block;
 padding-top: 5px;
}


/* top部分 */

.top #header {
 position: relative;
}

.top #wrap-inner {
 padding: 0 20px;
}

#topmessage {
 width: 240px;
 height: 420px;
 float: left;
}

#topmessage p {
 line-height: 1.5;
 padding-top: 10px;
}

#voicepr {
 width: 500px;
 float: right;
}

#prbox {
 clear: both;
 width: 760px;
 padding: 20px 0;
 min-height: 180px;
}

#prbox li {
 float: left;
 width: 240px;
 padding-left: 20px;
 line-height: 1.3;
}

#prbox li img {
 display: block;
 padding-bottom: 0.5em;
}

li#prboxtop {
 padding-left: 0;
}

.top #sub h2,
.page404 #sub h2 {
 height: 20px;
 background-image: url(../images/common/menuttl.gif);
 background-repeat: no-repeat;
 text-indent: -9999px;
}

.top #sub h3 {
 height: 40px;
 background-image: none;
 text-indent: 0px;
 font-size: 0.9em;
 font-weight: bold;
 line-height: 1.2;
 padding: 40px 0 5px 0;
 color: #555555;
}

.top #sub p {
 font-size: 0.8em;
 line-height: 1.3;
 color: #777777;
}

#bigpr {
 width: 500px;
 float: right;
}

#bigpr h2 {
	font-size: 14px;
	font-weight: normal;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #666;
}

#bigprunder {
	width: 240px;
	padding: 1em 0 0 260px;
	background-image: url(../images/top/blogcus-img.gif);
	background-repeat: no-repeat;
	height: 170px;
	overflow: hidden;
}

/* voicepr動き */

		ul.hover_block li{
		 background-repeat: no-repeat;
		 width:500px;
		 position: relative;
		 padding-bottom: 20px;
    }
		
		ul.hover_block li#voicepr01 {
		 background-image: url(../images/top/voice01prbg.jpg);
		}

		ul.hover_block li#voicepr02 {
		 background-image: url(../images/top/voice02prbg.jpg);
		 padding-bottom: 0;
		}
		
		ul.hover_block li#voicepr03 {
		 background-image: url(../images/top/voice03prbg.gif);
		}
		
		ul.hover_block li a {
			display: block;
			position: relative;
			overflow: hidden;
			height: 200px;
			width: 500px;
		}

		ul.hover_block li a { text-decoration: none; }

		ul.hover_block li img {
			position: absolute;
			top: 0;
			left: 185px;
			border: 0;
		}



/* about部分 */

#about01 {
 background-image: url(../images/about/about-urakawa.jpg);
 min-height: 320px;
}

#about02 {
 background-image: url(../images/about/about-bear.gif);
}

#about03 {
 background-image: url(../images/about/about-sengen.jpg);
}

#about04 {
 background-image: url(../images/about/about-pp.gif);
}

#about05 {
 background-image: url(../images/about/about-link.gif);
}

#about02 dl {
 width: 370px;
}

#about02 dl dt {
 float: left;
 width: 120px;
 padding-right: 10px;
}

#about02 dl dd {
 width: 240px;
 float: left;
}

#sengen01 {
 background-image: url(../images/about/sengen.jpg);
}

#pp01 {
 background-image: url(../images/about/pp.jpg);
}

#link01 {
 background-image: url(../images/about/link-design.gif);
}

#link02 {
 background-image: url(../images/about/link-service.gif);
}

.link #content div h3 {
 padding: 20px 0 0 0;
}

.link #content div p {
 padding: 0.5em 0;
}





/* menu部分 */

#menu01 {
 background-image: url(../images/menu/menu-seisaku.gif);
}

#menu02 {
 background-image: url(../images/menu/menu-unei.gif);
}

#menu03 {
 background-image: url(../images/menu/menu-consul.gif);
}

#menu04 {
 background-image: url(../images/menu/menu-wdh.gif);
}

#menu05 {
 background-image: url(../images/menu/menu-other.gif);
}

#menu06 {
 background-image: url(../images/menu/menu-price.gif);
}

#cms01 {
 background-image: url(../images/menu/cms.gif);
 min-height: 110px;
}

#blogcustomize01 {
 background-image: url(../images/menu/blog_customize.gif);
 min-height: 110px;
}

#shoppingcart01 {
 background-image: url(../images/menu/cart-customize.gif);
 min-height: 110px;
}

#mainte01 {
 background-image: url(../images/menu/unei.gif);
 min-height: 110px;
}

#wdh01 {
 background-image: url(../images/menu/wdh.gif);
 min-height: 110px;
}

#price01 {
 background-image: url(../images/menu/price.gif);
 min-height: 110px;
}

#discount01 {
 background-image: url(../images/menu/discount.gif);
 min-height: 110px;
}


/* voice部分 */

#voice01 {
 background-image: url(../images/voice/voice-01.jpg);
}

#voice02 {
 background-image: url(../images/voice/voice-02.jpg);
}

#voice03 {
 background-image: url(../images/voice/voice-03.jpg);
}

.voice #content h2,
.voice-matsui #content h2,
.voice-hashiguti #content h2,
.voice-jolinail #content h2 {
 margin-top: 0;
 padding-top: 5px;
 font-weight: normal;
}

.voice #content h2 a {
 color: #000000;
}

.voice-hashiguti #content h2 {
 padding-top: 0px;
}

.voice-matsui #content div h3,
.voice-hashiguti #content div h3,
.voice-jolinail #content div h3 {
 font-size: 1.5em;
 line-height: 1.2;
 font-weight: bold;
}

.voice-matsui #content div p img,
.voice-hashiguti #content div p img,
.voice-jolinail #content div p img {
 display: block;
 padding: 0 1em;
}

#content div h3#hb-comment {
 font-size: 0.9em;
 border-bottom: 1px solid #333333;
}

#othervoices h4 {
	font-weight: bold;
	font-size: 1.2em;
	font-family: "Courier New", Courier, monospace;
}

#othervoices ul {
	padding: 0;
	margin: 0;
}

#othervoices ul li {
	list-style: none;
	display:inline-block;
}


/* works部分 */

#works01 {
 background-image: url(../images/works/works-01.jpg);
}

#works02 {
 background-image: url(../images/works/works-02.jpg);
}

#works03 {
 background-image: url(../images/works/works-03.jpg);
}

#works04 {
 background-image: url(../images/works/works-04.jpg);
}

#works05 {
 background-image: url(../images/works/works-05.jpg);
}

#works06 {
 background-image: url(../images/works/works-06.jpg);
}

#works07 {
 background-image: url(../images/works/works-07.jpg);
}


/* contact部分 */

#contact01 {
 background-image: url(../images/contact/formbg.gif);
}

div#content div#contact02 {
 background-image: url(../images/contact/contact_tel.gif);
 background-position: 440px 40px;
}

div#content div#contact03 {
 background-image: url(../images/contact/contact_twitter.gif);
 background-position: 20px 80px;
}

#thanks01 {
 background-image: url(../images/contact/formbg.gif);
 background-position: -130px 40px;
}

.contact #content h2 {
 width: 110px;
 float: left;
 margin-top: 0.3em;
 padding-right: 20px;
 font-size: 1em;
 line-height: 1.3;
 min-height: 100px;
}

.contact #content div p,
.contact #content div form {
 width: 500px;
 float: right;
 padding: 0 0 0 0px;
}

#content div form dl {
 width: 500px;
 padding: 0;
}

#content div form dl dt {
 width: 110px;
 height: 24px;
 float: left;
 text-align: right;
 padding: 20px 20px 0 0;
}

#content div form dl dd {
 width: 370px;
 height: 24px;
 float: right;
 padding: 20px 0 0 0;
}

#content div form dl dd input,
#content div form dl dd textarea,
#content div form dl dd select {
 border: none;
 border-bottom: 3px solid #dddddd;
}

#content div form dl dd input,
#content div form dl dd select {
 height: 21px;
}

#contact01 form p{
 text-align: center;
 margin-top: 20px;
}

#content div form dl dt.message-height,
#content div form dl dd.message-height {
 height: 110px;
}

#form-ttl,
#form-name,
#form-email,
#form-tel {
 width: 330px;
 height: 20px;
 padding-top: 0;
}

#form-message {
 height: 110px;
 width: 330px;
}

.contact #content div#contact03 p {
 padding-bottom: 1em;
}

#content div#thanks01 p {
 padding: 20px 0 0 60px;
}


/* clearfix hack */
.clearfix:after {
 content: ".";
 display: block;
 height: 0;
 clear: both;
 visibility: hidden;
}
.clearfix{
 display: inline-block;
}
 /* hide mac ie \*/
  *html .clearfix {
   height: 1%;
  }
  .clearfix {
	display: block;
  }
 /* end hide */
 /* end clearfix hack */