@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:15px/1.5 verdana,"ヒラギノ丸ゴ ProN W4","Hiragino Maru Gothic ProN","メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
color:#222;
background:url(images/bg.jpg) center;
}

body#toppage{background-image:url(images/bg.jpg)}

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

a img:hover{
-moz-box-shadow:2px 2px 3px #ccc;
-webkit-box-shadow:2px 2px 3px #ccc;
-o-box-shadow: 2px 2px 3px #ccc;
box-shadow: 2px 2px 3px #ccc;
}


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

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

#main{
}

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



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

p#logo a{
display:block;
width:960px;
height:200px;
}

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


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

#mainnav li{float:left;}

#mainnav li a{
padding:0 10px;
color:#fff;
font-size:14px;
border-left:1px solid #fff;
}

#mainnav li:first-child a{border:0;}

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


/************************************************
/* メインイメージ
*************************************************/
#mainImg{
width:960px;
height:445px;
background:url(images/mainImg.png) no-repeat;
}

.expl{padding:200px 90px 0 415px;}

.expl h1{
font-size:28px;
}

.expl h2{
padding:30px 0;
font-size:14px;
font-weight:normal;
}

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


/**************************
/* トップページ　3つのボックス
**************************/
#boxContainer{
width:990px;
margin-right:-30px;
padding:40px 0;
background:url(images/sep.png) repeat-x;
}

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

#boxContainer .box{
float:left;
margin-right:30px;
width:300px;
overflow:hidden;
}

#boxContainer .box h3{
padding:12px 0 12px 45px;
font-size:16px; 
background:url(images/no1.png) no-repeat;
}

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


/************************************************
/* 記事
*************************************************/
h2.heading{
margin:30px 0;
padding:5px 0 5px 40px;
font-size:22px;
color:#ef017c;
text-shadow:1px 1px 1px #ccc;
background:url(images/h2.png) no-repeat 0 50%;
}

.article{
padding:30px 0;
background:url(images/sep.png) repeat-x;
}

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

.article h3{
padding:0 0 5px;
margin-bottom:10px;
font-size:18px;
color:#ef017c;
text-shadow:1px 1px 1px #ccc;
background:url(images/h3.png) repeat-x 0 100%;
}

img.alignleft{float:left;}

img.alignright{float:right;}

.wrap{
padding:10px 10px 5px;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
-moz-box-shadow:0 1px 5px #dcdcdc;
-webkit-box-shadow:0 1px 5px #dcdcdc;
-o-box-shadow:0 1px 5px #dcdcdc;
box-shadow:0 1px 5px #dcdcdc;
border:1px solid #e6e6e6;
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;
}



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

#footer ul{
float:left;
width:235px;
padding:30px 5px 10px 0;
overflow:hidden;
}

#footer ul li{padding:0 5px 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;
}