@charset "utf-8"; 

/* サイト共通のデザイン（レイアウト、ヘッダー、フッター、ナビゲーション）を記述する。 */

body { color:#123; font:13px/1.5 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; -webkit-text-size-adjust: none; }


/* レイアウト */
img{ max-width : 100%}

#container { width: 960px; background-color: #fff; margin: 0 auto; }

#sidebar { float: left; width: 200px; padding:0 0 10px; background-color:#ddd; }
#sidebar_top { float: left; width: 200px; padding:0 0 10px; background-color:#fff; margin:0}

main#one { float:none; width:960px; margin:0; } /* 1カラム */
main { float: left; width: 750px; margin-left:10px; padding:0;} /* 2カラム */
main#three { float: left; width: 560px; margin-left:10px; padding: 10px 0; background-color:#bbb; } /* 3カラム */

#sidebar2 { float: left; width: 180px; margin-left:10px; padding:0 0 10px; background-color:#ddd; }

/* ヘッダー */
header { background-color:#FFFFFF; }
header h1 { padding:0; }

/* パンクズ */
/*
#breadcrumbs{ background: #eee; border-width: 1px; border-style: solid; border-color: #f5f5f5 #e5e5e5 #ccc; border-radius: 5px; box-shadow: 0 0 2px rgba(0,0,0,.2); overflow: hidden; width: 100%; list-style-type:none; }
#breadcrumbs li{ float: left; }
#breadcrumbs a{ padding: .7em 1em .7em 2em; float: left; text-decoration: none; color: #444; position: relative; text-shadow: 0 1px 0 rgba(255,255,255,.5); background-color: #ddd; background-image: linear-gradient(to right, #f5f5f5, #ddd); }
#breadcrumbs li:first-child a{ padding-left: 1em; border-radius: 5px 0 0 5px; }
#breadcrumbs a:hover{ background: #fff; }
#breadcrumbs a::after,
#breadcrumbs a::before{ content: ""; position: absolute; top: 50%; margin-top: -1.5em; border-top: 1.5em solid transparent; border-bottom: 1.5em solid transparent; border-left: 1em solid; right: -1em; }
#breadcrumbs a::after{ z-index: 2; border-left-color: #ddd; }
#breadcrumbs a::before{ border-left-color: #ccc; right: -1.1em; z-index: 1; }
#breadcrumbs a:hover::after{ border-left-color: #fff; }
#breadcrumbs .current,
#breadcrumbs .current:hover{ font-weight: bold; background: none; }
#breadcrumbs .current::after,
#breadcrumbs .current::before{ content: normal; }
*/
#breadcrumbs { margin:10px 0; padding:0; line-height:1; }
#breadcrumbs li { list-style-type:none; display:inline; }
#breadcrumbs li a { text-decoration:none; padding:5px 15px 5px 5px; background:url('icon-arrow-right.png') no-repeat right center; }
#breadcrumbs li.last a { color:#333; background:none; }

/* ブロック */
section, article { margin:0 15px 2em; padding:0; background-color:#fff; }

/* ページトップ */
#page-top { position: fixed; bottom: 20px; right: 20px; }
#page-top a { display: block; background:url('pagetop.png') no-repeat; text-indent:100%; white-space:nowrap; overflow:hidden; width:60px; height:60px; filter: alpha(opacity=60); -moz-opacity:0.6; opacity:0.6; }
#page-top a:hover { filter: alpha(opacity=100); -moz-opacity:1; opacity:1; }


/* フッター */
footer { clear:both; padding:0.5em 0; background:#333; border-top:2px solid #ccc; color:#ccc; }
address { text-align:right; margin:0.5em; font-style:normal; }
address dt { font-weight:bold; }




/* モニター幅960px以下 */
@media only screen and (max-width:960px) { 

}


/* スマートフォン 横(ランドスケープ) タブレット*/
@media only screen and (max-width:768px) { 
#container { width:100%; }

#sidebar { float:none; width:100%; }
#sidebar nav li { float:left; }
#sidebar div { float:left; }

main#one { float:none; width:100%; margin-left:0; }
main { float:none; width:100%; margin-left:0; }
main#three { float:none; width:100%; margin-left:0; }

#sidebar2 { float:none; width:100%; display:none; }
#sidebar2 nav li { float:left; }
#sidebar2 div { float:left; }

#sidebar_top { float:none; width:100%;}

.dn768 { display:none}
}


/* スマートフォン 縦(ポートレート) */
@media only screen and (max-width:480px) { 
#breadcrumbs { display:none; }
.spnone { display:none; }
}