@charset "utf-8";

/**** reset ****/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;}
table{border-collapse:collapse;border-spacing:0;}
caption,th{text-align:left;}
q:before,q:after{content:'';}
object,embed {vertical-align:top;}
hr,legend{display:none;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
img,abbr,acronym,fieldset{border:0;}
li{list-style-type:none;}

body{
font:20px/1.5 "メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;
color:#222;
background:url(images/bg.png) repeat-x;
}

body#toppage{
	background: url(images/sand.jpg) repeat;
}
#toppage2{
	background-image:url(images/bgtop.png);
	background-repeat: repeat-x;
}

.tsd{text-shadow: 1px 1px 3px #000; }
.h6_articleR{
	display: table;
	background:url('images/h6_bg1r.png') no-repeat bottom right;
}
.h6_articleL{
	display: table;
	background:url('images/h6_bg2.png') no-repeat bottom left;
}

.h6_fll{
float: left;
padding: 20px;
}
.h6_flr{
float: right;
padding: 20px;
}

#kyobn{
	padding:20px 0px;
	text-align: center;
}
#kyobn a{
	padding:0px 30px;
	-webkit-transition: 0.5s;
	   -moz-transition: 0.5s;
	    -ms-transition: 0.5s;
	     -o-transition: 0.5s;
	        transition: 0.5s;
}
#kyobn a:hover{
	opacity:0.75;
	-webkit-transition: 0.5s;
	   -moz-transition: 0.5s;
	    -ms-transition: 0.5s;
	     -o-transition: 0.5s;
	        transition: 0.5s;
}
#footer_bg{
	background: url('images/footer_end.jpg') repeat-x;
	height:250px;
	text-align: center;
}
.footer_contents{
	text-align: center;
	padding-top:100px;
}
.footer_contents a{
	color:#fff;
	padding:0px 20px;
	-webkit-transition: 0.5s;
	   -moz-transition: 0.5s;
	    -ms-transition: 0.5s;
	     -o-transition: 0.5s;
	        transition: 0.5s;
}
.footer_contents a:hover{
	color:#00f;
	-webkit-transition: 0.5s;
	   -moz-transition: 0.5s;
	    -ms-transition: 0.5s;
	     -o-transition: 0.5s;
	        transition: 0.5s;
}
.copy{
	font-size:12px;
	color:#fff;
	text-align: center;
	padding-top:35px;
}

a {color:#98c22d;text-decoration: none;}
a:hover {color:#7fa905;}
a:active, a:focus {outline:0;}
a img{border:none;}

/****** 見出し ******/
h1,h2,h3{font-family:"メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;}


/************************************************
/* レイアウト
*************************************************/
/* 全体 */
#wrapper{
width:960px;
margin:0 auto 30px;
}

/* ヘッダー */
#header{
position:relative;
height:65px;
}

/* フッター */
#footer{
clear: both;
color:#fff;
background:#000 url(images/footerbg.png) repeat-x;
}



/************************************************
/* ヘッダー
*************************************************/
/****** ロゴ ******/
p#logo{
position:absolute;
top:10px;
text-indent:100%;
white-space:nowrap;
overflow:hidden;
width:225px;
height:40px;
background:url(images/logo.png) no-repeat;
}

p#logo a{
display:block;
width:225px;
height:40px;
}

p#logo a:hover{cursor: pointer;}


/************************************************
/* メインナビゲーション
*************************************************/
#mainnav{
position:absolute;
top:20px;
right:-12px;
}

#mainnav li{float:left;}

#mainnav li a{
padding:0 12px;
color:#fff;
background:url(images/sp02.png) repeat-y;
font:normal 18px "メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;
}

#mainnav li:first-child a{background:none;}

#mainnav li a:hover{text-shadow:0px 1px 3px #333;}

#pageTop {
  position: fixed;
  bottom: 35px;
  right: 35px;
}
 
#pageTop a {
  display: block;
  z-index: 999;
  padding: 25px;
  border-radius: 35px;
  width: 35px;
  height: 35px;
  background-color: #9FD6D2;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  font-size: 14px;
}
 
#pageTop a:hover {
  text-decoration: none;
  opacity: 0.7;
}
/************************************************
/* メインイメージ
*************************************************/
#mainimg{
width:960px;
height:595px;
margin-bottom: 20px;
position: relative;
}

.expl{
position: absolute;
bottom: 10px;
right: 30px;
left: 310px;
}

.expl h1{
font-size:20px;
color: #2384C8;
text-align: right;
}

.expl h2{
padding:5px 0;
font-size:15px;
font-weight:normal;
color: #2384C8;
line-height: 18px;
}

.expl ul li{
float:left;
margin-right:20px;
text-indent:100%;
white-space:nowrap;
overflow:hidden;
width:180px;
height:50px;
background:url(images/btn1.png) no-repeat;
}

.expl ul li.btn2{background-image:url(images/btn2.png);}

.expl ul li:hover{
cursor: pointer;
background-position:0 -50px;
}

.expl ul li a{
display:block;
width:180px;
height:50px;
}


/**************************
/* トップページ　2つのボックス
**************************/




/**************************
/* トップページ　下部
**************************/
#boxcontainer2{
width:990px;
margin-right:-30px;
padding:10px 0;
background:url(images/sep.png) repeat-x;
}

#toppage #boxcontainer2{background-image:none;}

#boxcontainer2 .box{
float:left;
margin-right:20px;
width:470px;
overflow:hidden;
}

#boxcontainer2 .box h3.no2{background-image:url(images/no2.png);}
#boxcontainer2 .box h3.no3{background-image:url(images/no3.png);}



/************************************************
/* 記事
*************************************************/
h2.heading{
margin:30px 0;
padding:15px 0 5px 45px;
font-size:22px;
color:#ffffff;

background:url(images/hdbg.png) no-repeat 0 50%;
}

.article{
padding:30px 0 50px 0;
}

.article p{padding-bottom:10px;}
.article p.kabu{padding:0 10px 10px 30px;}


.article h3{
padding:20px 0 10px 5px;
margin-bottom:10px;
font-size:28px;
color:#2384C8;
text-shadow:1px 1px 1px #ccc;
background:url(images/h3.png) repeat-x 0 100%;
}
.article h4{
padding:10px 0 5px 0;
margin-bottom:10px;
font-size:18px;
color:#2384C8;
border-bottom:1px solid #DEA41A;
}
.article h5{
padding:10px 0 0 15px;
margin-bottom:3px;
font-size:18px;
color:#2384C8;
font-weight: normal;
}
.article h6{
width: 960px;
padding:12px 0 5px 0px;
margin-bottom:10px;
font-size:24px;
color:#2384C8;
border-bottom: 3px dashed #DEA41A;
/*background: url(images/ic01.gif) no-repeat left center;*/
}
.article h6:before{
	content:url(images/h6_icon.png);
	position: relative;
	top: 10px;
	padding:0px 5px;
}
img.alignleft{
float:left;
margin:0 15px 10px 0;
}

img.alignright{
float:right;
margin:0 0 10px 15px;
}

.wrap{
padding:10px 10px 5px;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
-moz-box-shadow:0 1px 3px #dcdcdc;
-webkit-box-shadow:0 1px 3px #dcdcdc;
-o-box-shadow:0 1px 3px #dcdcdc;
box-shadow:0 1px 3px #dcdcdc;
border:1px solid #dcdcdc;
background:url(images/wrap.png);
}


p.btnbig{
text-indent:100%;
white-space:nowrap;
overflow:hidden;
width:960px;
height:80px;
margin:20px 0 60px;
background:url(images/btnbig.png) no-repeat;
}

p.btnbig a{
display:block;
width:960px;
height:80px;
}

p.btnbig:hover{
cursor: pointer;
background-position:0 -80px;
}

p.danraku{
margin-bottom:30px;
}

/**** Clearfix ****/
.clearfix:before, .clearfix:after, .article:before, .article:after{content: ""; display: table;}
.clearfix:after, .article:after{clear: both;}
.clearfix, .article{zoom: 1;}


/************************************************
/* フッター
*************************************************/
#footer .inner{
margin:0 auto;
width:960px;
    position: fixed !important;  
    position: absolute;  
    bottom: 0;  
    left: 0;  
    width: 100%;  
    height: 150px;  
background-color: #6BBFE3( 0,0,255,0 );
    color: #6BBFE3; 
}  
p.btnbig_f{
text-indent:100%;
white-space:nowrap;
overflow:hidden;
width:960px;
height:120px;
margin:10px auto 10px;
background:url(images/btnbig.png) no-repeat;
}

p.btnbig_f a{
display:block;
width:960px;
height:120px;
}

p.btnbig_f:hover{
cursor: pointer;
background-position:0 -120px;
}
#footer ul{
float:left;
width:235px;
padding:30px 5px 10px 0;
overflow:hidden;
}

#footer ul li{padding:0 10px 5px 0;}

#footer ul li a{display:block;}

#footer ul li h3{
padding-bottom:3px;
margin-bottom:5px;
background:url(images/sep2.png) repeat-x 0 100%;
}

#footer a{color:#fff;}
#footer a:hover{color:#f7f7f7;}

address{
padding:5px;
clear:both;
text-align:center;
font-family:"メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;
}


/************************************************
/* 会社概要テーブル
*************************************************/
.ta01{
width: 100%;

border-collapse: separate;
border-spacing: 0px;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
}
.ta01 th{
width:25%;
padding:10px 10px 10px 20px;
text-align: left;
vertical-align: top;
color: #444;
background-color: #5FBED6;
border-left: 3px double #999;
border-top: 1px solid #fff;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
.ta01 td{
width:75%;
padding:10px 10px 10px 20px;
background-color: #fafafa;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}

/************************************************
/* 下部送料テーブル
*************************************************/
.ta02{
width: 100%;
border-collapse: separate;
border-spacing: 0px;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
margin-bottom: 10px;
}
.ta02 th{
width:80%;
padding:5px 5px 5px 15px;
text-align: left;
vertical-align: top;
color: #666;
font-weight: normal;
background-color: #5FBED6;
border-left: 1px solid #fff;
border-top: 1px solid #fff;
border-right: 1px solid #DEA41A;
border-bottom: 1px solid #DEA41A;
}
.ta02 td{
width:20%;
text-align: center;
padding:5px 5px 5px 5px;
background-color: #fafafa;
border-right: 1px solid #DEA41A;
border-bottom: 1px solid #DEA41A;
}

/************************************************
/* jqueryトップへ
*************************************************/
.crunchify-top:hover {
color: #fff !important;
background-color: #ed702b;
text-decoration: none;
}
 
.crunchify-top {
display: none;
position: fixed;
bottom: 10rem;
right: 1rem;
width: 3.2rem;
height: 3.2rem;
line-height: 3.2rem;
font-size: 1.4rem;
color: #fff;
background-color: rgba(0,0,0,0.3);
text-decoration: none;
border-radius: 3.2rem;
text-align: center;
cursor: pointer;
}