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

a {color:#ef017c;text-decoration: none;}
a:hover {color:#ca2970;}
a:active, a:focus {outline:0;}
a img{border:none;}


/************************************************
/* レイアウト
*************************************************/

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

/* フッター */
#footer{
clear: both;
padding:10px;
color:#fff;
text-align:center;
background:#ef017c;
}


/****** トップページ ******/
/* ヘッダー */
#toppage #header{width:100%;}

/* グリッド全体 */
#container{margin:10px auto 30px;}


/****** サブページ ******/
#header{
width:940px;
margin:0 auto;
}

#wrapper{
width:940px;
margin:20px auto;
}

#sidebar{
float:left;
margin:0;
padding-bottom:30px;
}

#main{
float:right;
width:600px;
padding:10px 13px;
margin-bottom:30px;
border-radius:6px;
-webkit-border-radius:6px;
-moz-border-radius:6px;
border:3px dotted #ca2970;
background: #fff;
}



/************************************************
/* 共通 ヘッダー
*************************************************/
/****** スローガン ******/
h1#slogan{
padding:10px 0;
font-size:12px;
color:#fff;
text-shadow: 1px 1px 1px #333;
}
/* トップページ */
#toppage h1#slogan{padding-left:40px;}



/****** ロゴ ******/
p#logo{
position:absolute;
top:55px;
text-indent:100%;
white-space:nowrap;
overflow:hidden;
width:245px;
height:37px;
background:url(images/logo.png) no-repeat;
}
/* トップページ */
#toppage p#logo{left:40px;}

p#logo a{
display:block;
width:245px;
height:37px;
}

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


/****** 電話番号 ******/
p#tel{
position:absolute;
bottom:10px;
right:-5px;
text-indent:100%;
white-space:nowrap;
overflow:hidden;
width:244px;
height:55px;
background:url(images/tel.png) no-repeat;
}
/* トップページ */
#toppage p#tel{right:36px;}


/************************************************
/* 共通 メインナビゲーション
*************************************************/
#mainnav{
position:absolute;
top:5px;
right:0;
}

#mainnav li{
display:inline;
padding-left:10px;
line-height:30px;
}

#mainnav li a{
padding:5px 0 5px 27px;
font-size:14px;
color:#fff;
background:url(images/bullet.png) no-repeat 0 50%;
}

#mainnav li a:hover{background-position: 5px 50%;}

/* トップページ */
#toppage #mainnav{right:40px;}


/************************************************
/* 共通 ページ上部に戻る
*************************************************/
p#toTop{
clear:both;
float:right;
width:10em;
padding:5px;
-moz-border-radius:5px 5px 0 0;
-webkit-border-radius:5px 5px 0 0;
border-radius:5px 5px 0 0;
text-align:center;
background:#ef017c;
}
/* トップページ */
#toppage p#toTop{margin-right:15px;}

*:first-child+html p#toTop{float:none;} /*IE 7*/

p#toTop a{color:#fff;}



/************************************************
/* 共通 サイドバー
*************************************************/
.submenu{
margin:15px 0;
border:3px dotted #ca2970;
background: #fff;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
}

.submenu h3{
margin:10px 0 5px;
padding:5px 10px 3px 30px;
text-shadow: 1px 1px 1px #ccc;
background:url(images/h3.png) no-repeat 5px 50%;
}

.submenu ul,.sidebar p{margin-bottom:10px;}

.submenu li{
padding:0 10px;
border-bottom:1px dotted #ccc;
}

.submenu li:last-child{border:0;}

.submenu li a{
padding:10px 0;
display:block;
}

.submenu li:hover{background:#fff;}



/************************************************
/* 共通 フッター
*************************************************/
#footer ul{text-align:center;}

#footer ul li{
display:inline;
padding:0 10px 0 11px;
border-left:1px solid #fff;
}

#footer ul li:first-child{border:0;}

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



/************************************************
/* サブページ
*************************************************/
.article{padding-bottom:20px;}

#main p{padding-bottom:10px;}

#main h2{
margin:5px 0;
padding:5px 0 5px 30px;
font-size:18px;
background:url(images/h2.png) no-repeat;
}

#main h3{
clear:both;
margin:10px 0;
padding:5px 10px 5px 25px;
font-size:16px;
text-shadow:1px 1px 1px #ccc;
border-bottom:1px solid #ef017c;
background:url(images/h3.png) no-repeat 0 50%;
}

#main p.date{
padding-bottom:20px;
text-align:right;
font:16px Georgia, "Times New Roman", Times, serif;
}

img.alignleft,img.alignright{
float:left;
padding: 4px;
margin: 0 10px 2px 0;
display: inline;
padding: 4px;
border:1px solid #fff;
-moz-box-shadow: 1px 1px 5px #ccc;
-webkit-box-shadow: 1px 1px 5px #ccc;
-o-box-shadow: 1px 1px 5px #ccc;
box-shadow: 1px 1px 5px #ccc;	
}

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

/* ページナビゲーション */
ul.pagenav{
width:600px;
padding:20px 0;
}

ul.pagenav li{
list-style: none;
float: left;
}

ul.pagenav li a{
padding:0 0 0 10px;
background:url(images/arrowL.png) no-repeat 0 50%;
}

ul.pagenav li.next{float:right;}

ul.pagenav li.next a{
padding:0 10px 0 0;
background:url(images/arrowR.png) no-repeat 100% 50%;
}


/************************************************
/* トップページ グリッド
*************************************************/
.grid {
float: left;
width:254px;
min-height:254px;
margin:10px;
padding:10px;
border:3px dotted #ca2970;
background: #fff;
border-radius:6px;
-webkit-border-radius:6px;
-moz-border-radius:6px;
}

/* サイドバーとバナーのみグリッドの枠なし その他調節 */
.sidebar, .banner{
width:280px;
margin: 10px;
padding:0;
border:0;
background:transparent;
}

.grid img{
display: block;
max-width:248px;
padding: 4px;
border:1px solid #ccc;
}

.sidebar img, .banner img{
max-width:280px;
padding:0;
border:0;
}

.sidebar a img:hover, .banner a img:hover{
opacity:.8;
-moz-opacity:0.8;
filter: alpha(opacity=80);
}

.grid h3{
margin:7px 0 3px;
text-shadow: 1px 1px 1px #ccc;
}

p.readon{margin-top:10px;}

p.readon a{
text-decoration:none;
padding:5px 10px;
position:relative;
display:inline-block;
text-shadow:0 1px 0 #fff;
-webkit-transition:border-color .218s;
-moz-transition:border .218s;
-o-transition:border-color .218s;
transition:border-color .218s;
background:#f3f3f3;
background:-webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
background:-moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
-o-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
border:solid 1px #dcdcdc;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
font-size:12px;
}

p.readon a:hover {
border-color:#ef017c;
-moz-box-shadow:0 2px 0 rgba(0, 0, 0, 0.2);
-webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
box-shadow:0 1px 2px rgba(0, 0, 0, 0.15);
}
p.readon a:active {color:#000; border-color:#444;}


/**** Transitions ****/
.transitions-enabled.masonry,
.transitions-enabled.masonry .masonry-brick {
-webkit-transition-duration: 0.7s;
-moz-transition-duration: 0.7s;
-o-transition-duration: 0.7s;
transition-duration: 0.7s;
}

.transitions-enabled.masonry {
-webkit-transition-property: height, width;
-moz-transition-property: height, width;
-o-transition-property: height, width;
transition-property: height, width;
}

.transitions-enabled.masonry.masonry-brick {
-webkit-transition-property: left, right, top;
-moz-transition-property: left, right, top;
-o-transition-property: left, right, top;
transition-property: left, right, top;
}

.transitions-enabled.infinite-scroll.masonry {
-webkit-transition-property: none;
-moz-transition-property: none;
-o-transition-property: none;
transition-property: none;
}


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