@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;}

img,abbr,acronym,fieldset{border:0;}
li{list-style-type:none;}

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

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



/************************************************
/* テスト
*************************************************/
img {
max-width : 100% ;
height : auto ;
}

body { -webkit-text-size-adjust : 100%!important ; }


#wrap { overflow : hidden ; }












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;}


/* 追加分 */
body#toppage{
	background: url(images/sand.jpg) repeat;
}
.tsd{text-shadow: 1px 1px 3px #000; }
.h6_fll{text-align: center;}
.h6_flr{text-align: center;}
#kyobn{text-align: center;padding:10px 15px;}
#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:16px;
	color:#fff;
	text-align: center;
	padding-top:35px;
}
/************************************************
/* レイアウト
*************************************************/
/* 全体 */
#wrapper{
width:960px;
margin:0 auto;
padding-bottom:100px;
}

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

/* フッター */
#footer{
width:960px;
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/sep2.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;}


/************************************************
/* メインイメージ
*************************************************/


#mainimg{
width:100%;
/*height:595px;*/
margin-bottom: 20px;
position: relative;
}

.expl{
position: absolute!important;
bottom: 10px;
right: 30px;
left: 100px;
}

.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{
margin-top: 30px;
margin-bottom: 30px;
}


#boxcontainer .box{
margin:0;
}

/************************************************
/* 記事
*************************************************/
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 20px 30px 20px;
}
.article img{
    max-width: 100%;
    height: auto;
}
.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{
padding:12px 0 5px 40px;
margin-bottom:10px;
font-size:24px;
color:#2384C8;
border-bottom:1px solid #DEA41A;
background: url(images/h6_icon.png) no-repeat left center;
}

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:100%;
height:auto;
margin:20px 0 60px;
background:url(images/btnbig.png) no-repeat;
}

p.btnbig a{
display:block;
width:100%;
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;
    position: fixed !important;  
    position: absolute;  
    bottom: 0;  
    left: 0;  
    width: 100%;  
    height: 150px;  
background-color: #6BBFE3( 0,0,255,0 );
    color: #fff; 
}  
p.btnbig_f{
text-indent:100%;
white-space:nowrap;
overflow:hidden;
width: 100%;
height:120px;
margin:10px auto 10px;
background:url(images/btnbig.png) no-repeat;
}

p.btnbig_f a{
display:block;
width: 100%;
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: 5.2rem;
height: 5.2rem;
line-height: 5.2rem;
font-size: 2.4rem;
color: #fff;
background-color: rgba(0,0,0,0.3);
text-decoration: none;
border-radius: 3.2rem;
text-align: center;
cursor: pointer;
}