@charset "utf-8";

img, object, embed, video {
	max-width: 100%;
}
/* IE 6 では最大幅がサポートされていないため、デフォルトで幅 100% に設定される */
.ie6 img {
	width:100%;
}

/*
	Dreamweaver 可変グリッドプロパティ
	----------------------------------
	dw-num-cols-mobile:		4;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	12;
	dw-gutter-percentage:	25;
	
	以下からヒントを入手 : Ethan Marcotte 氏の「レスポンシブ Web デザイン」 
	http://www.alistapart.com/articles/responsive-web-design
	
	および Joni Korpi 氏の「Golden Grid System」
	http://goldengridsystem.com/ 
*/

.fluid {
	clear: both;
	margin-left: auto;
	margin-right:auto;
	width: 100%;
	float: left;
	display: block;
}

.fluidList {
    list-style:none;
    list-style-image:none;
    margin:0;
    padding:0;        
}


/*********************************************************************************
 モバイルレイアウト : -480 px 
	**********************************************************************************/

  
.gridContainer {
	margin-left: auto;
	margin-top:10px;
	margin-right: auto;
	width: 86.45%;
	padding-left: 2.275%;
	padding-right: 2.275%;
	clear: none;
	float: none;
}
#div1 {
	text-align:center;
}

#div1 h1{display:none;}

#div1 h2{font-size:12px;
font-weight:normal;
color:#333;}


#div2 {
	text-align:center;
}

#div3 {
text-align:center;
}



#div3 nav{
width:100%;}
			
	
#div3 nav ul li{
	list-style:none;
padding-bottom:10px;
}

#div3 nav ul li a,
#div3 nav ul li a:visited{
	display: block;
	text-decoration: none;
	font-size: 14px;
	line-height: 14px;
	height: 20px;
	width: 160px;
	color: #333;
	background-image: url(img/tri1-off.png);
	background-repeat: no-repeat;
	background-position: left 10px;	
text-align:left;
padding-left:20px;
	padding-top: 10px;

}


#div3 nav ul li a:hover{
	border-bottom:8px solid #CCC;
	color:#C60;
		background-image: url(img/tri1.png);}
		
#div4 {
text-align: center;
margin-top:20px;
}

#div5 {
	padding-top:30px;
text-align:center;}

#div5 a{
	filter:alpha(opacity=50);
	-moz-opacity: 0.5;
	opacity: 0.5;
}

#div5 a:hover {
	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
}





#footer{
    height:15px;
				width:100%;
					color:#FFF;
					background-color:#333;
					text-align:center;

}
.zeroMargin_mobile {
margin-left: 0;
}
.hide_mobile {
display: none;
}

}

/*********************************************************************************
 タブレットレイアウト : 481 px ～ 768 px。 
	**********************************************************************************/

@media only screen and (min-width: 481px) {

.gridContainer {
	width: 90.675%;
	padding-left: 1.1625%;
	padding-right: 1.1625%;
	clear: none;
	float: none;
	margin-left: auto;
}
#div1 {
}
#div2 {
}
#div3 {
}
#div4 {
}
.zeroMargin_tablet {
margin-left: 0;
}
.hide_tablet {
display: none;
}

}

/*********************************************************************************
デスクトップレイアウト : 769 px ～最大 1232 px
	**********************************************************************************/


@media only screen and (min-width: 769px) {

.gridContainer {
	width: 88.5%;
	max-width: 1232px;
	padding-left: 0.75%;
	padding-right: 0.75%;
		margin-top:100px;
	clear: none;
	float: none;
	margin-left: auto;

}
#div1 {
}
#div2 {
}
#div3 {
padding:0px;

}
#div3 li{}

#div4 {

}
.zeroMargin_desktop {
margin-left: 0;
}
.hide_desktop {
display: none;
}

#footer{
    height:100px;
				width:100%;
     position:absolute;
     bottom:0;
					color:#FFF;
					background-color:#333;
					text-align:center;
					padding-top:20px;
}









#div3 nav{
margin-top:30px;
	position:relative;
 overflow:hidden;
	height:60px;
width:100%;}
			
#div3 nav ul{
position:relative;
left:50%;
float:left;
}
	
#div3 nav ul li{
	list-style:none;
	float:left;
margin-right:10px;
	position:relative;
left:-50%;
padding-bottom:10px;
}

#div3 nav ul li a,
#div3 nav ul li a:visited{
	display: block;
	text-decoration: none;
	font-size: 14px;
	line-height: 14px;
	height: 20px;
	width: 160px;
	color: #333;
	background-image: url(img/tri1-off.png);
	background-repeat: no-repeat;
	background-position: left 10px;	
text-align:left;
padding-left:20px;
	padding-top: 10px;

}


#div3 nav ul li a:hover{
	border-bottom:8px solid #CCC;
	color:#C60;
		background-image: url(img/tri1.png);}

}


/*pageslide設定*/

        
#pageslide {
            /* These styles MUST be included. Do not change. */
            display: none;
            position: absolute;
            position: fixed;
            top: 0;
            height: 100%;
            z-index: 999999;

            /* Specify the width of your pageslide here */
            width: 400px;
            padding: 20px;

            /* These styles are optional, and describe how the pageslide will look */
            background-color: #333;
            color: #FFF;
            -webkit-box-shadow: inset 0 0 5px 5px #222;
            -moz-shadow: inset 0 0 5px 5px #222;
            box-shadow: inset 0 0 5px 5px #222;
        }
        
#secondary,
#about,#works
 { display:none ; color: #EFEFEF; }

#about h2,
#works h2,
#inquiry h2 { color: #FFF; }

body#contents{color:#FFF;
font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
line-height:150%;
font-size:12px;}

#contents h2{
font-size:16px;
color:#FFF;
border-bottom:1px dashed #999;
padding-bottom:5px;}

#contents h3{
	font-weight:bold;
font-size:14px;
color:#CCC;}

#contents a{
	color:#FFF;}

/*問い合わせフォーム*/
textarea,input.w300{width:240px;}
th{width:120px;
font-size:10px;
font-weight:normal;
color:#FFF;}



/*ボタン処理*/
 .btn {

      display: inline-block;

      padding: 4px 10px 4px;

      margin-bottom: 0;

      font-size: 13px;

      line-height: 18px;

      color: #333333;

      text-align: center;

      text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);

      vertical-align: middle;

      background-color: #f5f5f5;

      background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);

      background-image: -ms-linear-gradient(top, #ffffff, #e6e6e6);

      background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));

      background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);

      background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);

      background-image: linear-gradient(top, #ffffff, #e6e6e6);

      background-repeat: repeat-x;

      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);

      border-color: #e6e6e6 #e6e6e6 #bfbfbf;

      border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);

      filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);

      border: 1px solid #ccc;

      border-bottom-color: #bbb;

      -webkit-border-radius: 4px;

      -moz-border-radius: 4px;

      border-radius: 4px;

      -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);

      -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);

      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);

      cursor: pointer;

      filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);

      *margin-left: .3em;

    }

    .btn:hover,
    .btn:active,
    .btn.active,
    .btn.disabled,
    .btn[disabled] {
      background-color: #e6e6e6;
    }

    .btn:active, .btn.active {

      background-color: #cccccc \9;

    }

    .btn:first-child {

      *margin-left: 0;
    }

    .btn:hover {
      color: #333333;
     text-decoration: none;
      background-color: #e6e6e6;
      background-position: 0 -15px;
      -webkit-transition: background-position 0.1s linear;
      -moz-transition: background-position 0.1s linear;
      -ms-transition: background-position 0.1s linear;
      -o-transition: background-position 0.1s linear;
      transition: background-position 0.1s linear;

    }

    .btn:focus {

      outline: thin dotted #333;

      outline: 5px auto -webkit-focus-ring-color;

      outline-offset: -2px;

    }

    .btn.active, .btn:active {
      background-image: none;
      -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
      -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
      box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
      background-color: #e6e6e6;
      background-color: #d9d9d9 \9;
      outline: 0;
    }

a.btn {text-decoration:none;}


/*会社概要テーブル*/
table.about th{text-align:left;
font-size:12px;
width:90px;
}

table.about th,table.about td{
	padding-bottom:4px;
	padding-top:4px;
	border-bottom:1px dotted #999999;}
	
#contents	table.about ul li{margin-left:-20px;}