無料ブログ作成ならJUGEM(ジュゲム)

ホーム

テンプレートHTML・CSSについて: 公開されているテンプレートのHTMLに{ad}タグがないものありますので、エラーが表示された場合は{ad}タグを追加してご利用ください。
テンプレートの利用について: 弊社が著作権を所有する画像等以外のテンプレートに関する著作権は制作者にあります。弊社提供以外のブログサービスで利用した場合は、その都度制作者の方にご確認ください。

テンプレート名 : Blackboard

HTML・CSSをコピーして使う

HTML

<!DOCTYPE html>
<html>
    
    <head>
        <meta charset="{site_encoding}">
        <link rel="stylesheet" href="{site_css}" type="text/css">
        
        
        <title>{site_title}</title>
        <link rel="alternate" type="application/rss+xml" title="RSS" href="{site_rss}">
        <link rel="alternate" type="application/atom+xml" href="{site_atom}">
        <link rel="alternate" media="handheld" type="application/xhtml+xml" href="{mobile_url}">
        <link type="text/css" href="{gmo_header_css}" rel="stylesheet" media="screen,print">
        <script src="./template/js/cookie.js"></script>
        
        
        <script type="text/javascript">
			function SelectAll(id)
			{
			document.getElementById(id).focus();
			document.getElementById(id).select();
			}
        </script>
        
        
        <script type="text/javascript">
			WebFontConfig = {
				google: { families: [ 'Indie+Flower::latin' ] }
			};
			(function() {
				var wf = document.createElement('script');
				wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
				'://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
				wf.type = 'text/javascript';
				wf.async = 'true';
				var s = document.getElementsByTagName('script')[0];
				s.parentNode.insertBefore(wf, s);
			})();
        </script>
        
        
        
        
        
    </head>

    <body id="{index}{search}{pid_num}{day_yyyymmdd}{day_mmdd}{month_yyyymm}{cid_num}{page_id_num}{eid_num}" class="{pid}{day_dd}{day}{month_mm}{month}{cid}{page}{eid}">
        <header role="banner" id="main-header" class="main-container">
            <h1 id="blog-title" class="title">
                {blog_name}
            </h1>
            <p id="blog-description" class="small">{blog_description}</p>
            
            <nav role="navigation" id="calendar">
                <p id="current-calendar">{calendar_str_yearmonth}</p>
                <a href="./?month={calendar_prev_year}{calendar_prev_month}" title="{calendar_prev_year}年{calendar_prev_month}月の投稿へ">&#9668;&#9668;</a> {calendar_horizontal_only_addzero} <a href="./?month={calendar_next_year}{calendar_next_month}" title="{calendar_next_year}年{calendar_next_month}月の投稿へ">&#9658;&#9658;</a>
            </nav>
            
        </header>
    
        <div id="wrapper">
    
            <div id="main">
        
    
                <div id="main-left">
    
                    
                    <nav role="navigation" id="entry-nav">
                        <a href="{prev_permalink}" title="前のエントリー『{prev_title}』">&#9668;&#9668;</a>  | <a href="./" title="ホームへ">&#9651;</a> | <a href="{next_permalink}" title="次のエントリー『{next_title}』">&#9658;&#9658;</a>
                    </nav>
                    
                    
                    <article role="main" class="entry-anchor{entry_number_cycle} entry">
                        <header class="entry-header">
                            <h2 class="entry-title title "><a href="./?eid={entryarea_id}" title="『{entry_title}』を読む">{entry_title}</a></h2>
                        </header>
                        <footer role="contentinfo" class="entry-footer">
                            <ul class="entry-info">
                                <li><span class="label">Date:</span> {entry_eng_week_short}., {entry_year}/{entry_month}/{entry_day} | {entry_time_only}</li>
                                <li><span class="label">Author:</span> {user_name}</li>
                                <li><span class="label">Category:</span> {category_name}</li>
                            </ul>
                        </footer>
                        <div class="entry-body">
                            {entry_description}
                            
                            <nav role="navigation" class="morelink">
                                <a href="./?eid={entry_sequel_id}#sequel" title="続きを読む">Read On &#9658;&#9658;</a>
                            </nav>
                            
                            
                            {entry_sequel_text}
                            
                        </div>
                        <aside id="entry-status-{entryarea_id}" class="entry-status">
                            <ul class="entry-status-list">
                                <li>{comment_num_only} 件の<a href="./?eid={entryarea_id}#comments" title="このエントリーに寄せられた {comment_num_only} 件のコメントを見る">コメント</a></li>
                                <li>{trackback_num_only} 件の<a href="./?eid={entryarea_id}#trackbacks" title="このエントリーに寄せられた {trackback_num_only} 件のトラックバックを見る">トラックバック</a></li>
                            </ul>
                        </aside>
                    </article>
                    <div id="edit">
                        <p id="edit-link" class="invisible"><a href="./manage/?mode=write&eid={entryarea_id}">エントリーを編集 <span class="dingbat">&#10000;</span></a></p>
                    </div>
                    
    
                    
                    <section role="complementary" class="comment-part feedback-part">
                        <a id="comments"></a>
                        <h3 class="title">コメント</h3>
                        <section class="feedback-body">
                            <ol id="comment-list" class="feedback-list">
                            
                                <li id="comment-{comment_id}" class="comment-anchor{comment_number_cycle} comment">
                                    <h5 id="comment-title-{comment_id}" class="title">From: <span class="handwriting"><a href="{comment_url}" target="_blank" rel="bookmark nofollow">{comment_name_only}</a></span></h5>
                                    <p class="comment-body">{comment_description}</p>
                                    <p class="comment-date"><small>{comment_year}/{comment_month}/{comment_day} | {comment_hour_24}:{comment_minute}</small></p>
                                </li>
                            
                            </ol>
                        </section>
                        <aside id="comment-form">
                            <h4 class="title">コメントを残す</h4>
    
                            <form name="comment_area" id="comment_area" action="./?mode=comment" method="post">
                                <input type="hidden" name="entry_id" value="{entry_id}" class="input">
    
                                <p id="comment-form-name"><label for="name">Name:</label><br>
                                <input type="text" tabindex="1" name="name" id="name" value="{cookie_name}" class="input handwriting"></p>
    
                                <p id="comment-form-email"><label for="email">E-mail:</label><br>
                                <input type="text" tabindex="2" name="email" id="email" value="{cookie_email}" class="input handwriting"></p>
    
                                <p id="comment-form-url"><label for="url">Website:</label><br>
    
                                <input type="text" tabindex="3" name="url" id="url" value="{cookie_url}" class="input handwriting"></p>
    
                                <p id="comment-form-comment"><label for="description">Comment:</label><br>
                                <textarea tabindex="4" id="description" name="description" rows="5" class="handwriting"></textarea></p>
                                <p id="comment-form-cookie"><input tabindex="7" type="checkbox" name="set_cookie" value="1" id="set_cookie"> <label for="set_cookie">入力情報を登録しますか？</label></p>
                                <p id="comment-form-submit"><input tabindex="6" type="submit" value="投稿"  id="comment-submit" onclick="javascript:setval();"></p>
                            </form>
                        </aside>
    
                    </section>
                    
    
                    
                    <section role="complementary" class="trackback-part feedback-part">
                        <a id="trackbacks"></a>
                        <h3 class="title">トラックバック</h3>
                        <section class="feedback-body">
                            <ol id="trackback-list" class="feedback-list">
                                <li id="trackback-{trackback_id}" class="trackback-anchor{trackback_number_cycle} trackback">
                                    <blockquote>
                                        <h5 id="trackback-title-{trackback_id}" class="title">{trackback_title}</h5>
                                           <p class="trackback-body">{trackback_excerpt}</p>
                                        <cite>{trackback_blog_name}</cite>
                                        <p class="trackback-date"><small>{trackback_year}/{trackback_month}/{trackback_day} | {trackback_hour_24}:{trackback_minute}</small></p>
                                    </blockquote>
                                </li>
                            </ol>
                        </section>
                        <aside id="trackback-info">
                            <h4 id="trackback-info-title" class="title">この記事へのトラックバックURL</h4>
                            <p id="trackback-info-url"><input type="text" id="trackback-url" onClick="SelectAll('trackback-url');" value="{trackback_url}" class="handwriting"></p>
                        </aside>
                    </section>
                    
    
                    
                    <nav role="navigation" id="pager">
                        <a href="{first_page_url}" title="最初のページへ">|&#9668;&#9668;</a> | <a href="{pager_url}" class="pager{pager_class}">{pager_num}</a> | <a href="{last_page_url}" title="最後のページへ">&#9658;&#9658;|</a>
                    </nav>
                    
    
                    
                    <article role="main" id="entry-profile" class="entry">
                        <h2 class="title">About {profile_name}</h2>
                        <div class="entry-body">
                            {profile_description}
                        </div>
                    </article>
                    
    
                </div>
    
                <div id="main-right">
                    <nav role="navigation" id="side">
    
                        
                        <section id="widget-profile" class="widget">
                            <h2 class="title handwriting">Author</h2>
                            <ul>
                            
                                <li><b><a href="./?pid={user_item_id}" title="{user_item_name} のプロフィールへ">{user_item_name}</a></b></li>
                            
                            </ul>
                        </section>
                        
    
                        
                        <section id="widget-mobile" class="widget">
                            <h2 class="title handwriting">Mobile</h2>
                            <div id="qrcode">{site_qrcode}</div>
                        </section>
    
                        
                        <section id="widget-search" class="widget">
                            <h2 class="title handwriting">Search</h2>
                            <form method="get" action="./" id="searchform">
                                <p id="form-search-label"><label for="search">Search for:</label></p>
                                <p id="form-search-words"><input type="text" id="search" name="search" class="search handwriting"></p>
                                <p id="form-search-submit"><input type="submit" value="Search"></p>
                            </form>
                        </section>
    
                        
                        <section id="widget-latest" class="widget">
                            <h2 class="title handwriting">Latest Entries</h2>
                            <ul>
                            
                                <li>
                                    <header class="widget-list-header">
                                        <h3 class="title"><a href="./?eid={latest_entry_item_id}" title="エントリー『{latest_entry_item_title}』へ">{latest_entry_item_title}</a></h3>
                                    </header>
                                    <footer class="widget-list-footer">
                                        <p class="widget-list-info"><small>{latest_entry_item_year}/{latest_entry_item_month}/{latest_entry_item_day}</small></p>
                                    </footer>
                                </li>
                            
                            </ul>
                        </section>
                        
    
                        
                        <section id="widget-category" class="widget">
                            <h2 class="title handwriting">Categories</h2>
                            <ul>
                            
                                <li>
                                    <header class="widget-list-header">
                                        <h3 class="title"><a href="./?cid={category_item_id}" title="『{category_item_name}』に含まれる {category_item_num} 件のエントリーを見る">{category_item_name}</a></h3>
                                    </header>
                                    <footer class="widget-list-footer">
                                        <p class="widget-list-info"><small>{category_item_num} Entries</small></p>
                                    </footer>
                                </li>
                            
                            </ul>
                        </section>
                        
    
                        
                        <section id="widget-archive" class="widget">
                            <h2 class="title handwriting">Archives</h2>
                            <ul>
                            
                                <li>
                                    <header class="widget-list-header">
                                        <h3 class="title"><a href="./?month={archives_item_id}" title="{archives_item_year}年{archives_item_num_month}月に投稿された {archives_item_num} 件のエントリーを見る">{archives_item_eng_month} {archives_item_year}</a></h3>
                                    </header>
                                    <footer class="widget-list-footer">
                                        <p class="widget-list-info"><small>{archives_item_num} Entries</small></p>
                                    </footer>
                                </li>
                            
                            </ul>
                        </section>
                        
    
    
    
                        
                        <section id="widget-freespace1" class="widget-freespace widget">
                            <h2 class="title handwriting">{freespace_title1}</h2>
                            <div class="freespace-content">
                                {freespace_contents1}
                            </div>
                        </section>
                        
    
                        
                        <section id="widget-freespace2" class="widget-freespace widget">
                            <h2 class="title handwriting">{freespace_title2}</h2>
                            <div class="freespace-content">
                                {freespace_contents2}
                            </div>
                        </section>
                        
    
                        
                        <section id="widget-freespace3" class="widget-freespace widget">
                            <h2 class="title handwriting">{freespace_title3}</h2>
                            <div class="freespace-content">
                                {freespace_contents3}
                            </div>
                        </section>
                        
    
                        
                        <section id="widget-freespace3" class="widget-freespace widget">
                            <h2 class="title handwriting">{freespace_title4}</h2>
                            <div class="freespace-content">
                                {freespace_contents4}
                            </div>
                        </section>
                        
    
                        
                        <section id="widget-freespace5" class="widget-freespace widget">
                            <h2 class="title handwriting">{freespace_title5}</h2>
                            <div class="freespace-content">
                                {freespace_contents5}
                            </div>
                        </section>
                        
    
    
    
                        
                        <section id="widget-comment" class="widget">
                            <h2 class="title handwriting">Latest Commented Entries</h2>
                            <ul>
                            
                                <li>									<header class="widget-list-header">
                                    <h3 class="title"><a href="./?eid={recent_comment_item_entry_id}">{recent_comment_item_title}</a></h3>
                                    </header>
                                    <footer class="widget-list-footer">
                                        <p class="widget-list-info"><small>From <b>{recent_comment_item_name}</b> on <a href="./?eid={recent_comment_item_entry_id}#comment-{recent_comment_item_comment_id}" title="エントリー『{recent_comment_item_title}』へのコメント">{recent_comment_item_year}/{recent_comment_item_month}/{recent_comment_item_day}</a></small></p>
                                    </footer>
                                </li>
                            
                            </ul>
                        </section>
                        
    
                        
                        <section id="widget-trackback" class="widget">
                            <h2 class="title handwriting">Latest Trackback</h2>
                            <ul>
                            
                                <li>
                                    <header class="widget-list-header">
                                        <h3 class="title"><a href="./?eid={recent_trackback_item_entry_id}">{recent_trackback_item_title}</a></h3>
                                    </header>
                                    <footer class="widget-list-footer">
                                        <p class="widget-list-info"><small>From <b>{recent_trackback_item_blog_name}</b> on <a href="./?eid={recent_trackback_item_entry_id}#trackback-{recent_trackback_item_trackback_id}" title="エントリー『{recent_trackback_item_title}』へのトラックバック">{recent_trackback_item_year}/{recent_trackback_item_month}/{recent_trackback_item_day}</a></small></p>
                                    </footer>
                                </li>
                            
                            </ul>
                        </section>
                        
    
                        
                        <section id="widget-link" class="widget">
                            <h2 class="title handwriting">Links</h2>
                            <ul>
                            
                                <li><a href="{link_item_url}">{link_item_name}</a></li>
                            
                            </ul>
                        </section>
                        
    
                        {ad}
    
                    </nav>
                </div>
    
            <div class="clearfix"></div>
            </div>
    
        </div>
    
        <footer role="contentinfo" id="main-footer" class="main-container">
            <p id="credit"><small>{copyright}</small></p>
        </footer>
    
    </body>

</html>

CSS

@charset = "UTF-8";
/**************************************************
*
* 作成日: 2012/04/23
* テンプレート名: Blackboard
* by: Krista (http://krista.jugem.jp/)
*
**************************************************/

/* =========== Reset =========== */
/* HTML5 Boilerplate */
/**************************************************
*
*Thanks to HTML5 Boilerplate (see: http://html5boilerplate.com/ )
*
**************************************************/

article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{ display: block; }audio,canvas,video{ display: inline-block; *display: inline; *zoom: 1; }audio:not([controls]){ display: none; }[hidden]{ display: none; }html{ font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }html,button,input,select,textarea{ font-family: sans-serif; color: #222; }body{ margin: 0; font-size: 1em; line-height: 1.4; }::-moz-selection{ background: #fe57a1; color: #fff; text-shadow: none; }::selection{ background: #fe57a1; color: #fff; text-shadow: none; }a{ color: #00e; }
a:visited{ color: #551a8b; }a:hover{ color: #06e; }a:focus{ outline: thin dotted; }a:hover,a:active{ outline: 0; }abbr[title]{ border-bottom: 1px dotted; }b,strong{ font-weight: bold; }blockquote{ margin: 1em 40px; }dfn{ font-style: italic; }hr{ display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }ins{ background: #ff9; color: #000; text-decoration: none; }mark{ background: #ff0; color: #000; font-style: italic; font-weight: bold; }pre,code,kbd,samp{ font-family: monospace,serif; _font-family: 'courier new',monospace; font-size: 1em; }pre{ white-space: pre; white-space: pre-wrap; word-wrap: break-word; }q{ quotes: none; }q:before,q:after{ content: ""; content: none; }small{ font-size: 85%; }sub,sup{ font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }sup{ top: -0.5em; }sub{ bottom: -0.25em; }ul,ol{ margin: 1em 0; padding: 0 0 0 40px; }dd{ margin: 0 0 0 40px; }nav ul,nav ol{ list-style: none; list-style-image: none; margin: 0; padding: 0; }img{ border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }svg:not(:root){ overflow: hidden; }figure{ margin: 0; }form{ margin: 0; }fieldset{ border: 0; margin: 0; padding: 0; }label{ cursor: pointer; }legend{ border: 0; *margin-left: -7px; padding: 0; white-space: normal; }button,input,select,textarea{ font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }button,input{ line-height: normal; }button,input[type="button"],input[type="reset"],input[type="submit"]{ cursor: pointer; -webkit-appearance: button; *overflow: visible; }
button[disabled],input[disabled]{ cursor: default; }input[type="checkbox"],input[type="radio"]{ box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }input[type="search"]{ -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }input[type="search"]::-webkit-search-decoration,input[type="search"]::-webkit-search-cancel-button{ -webkit-appearance: none; }button::-moz-focus-inner,input::-moz-focus-inner{ border: 0; padding: 0; }textarea{ overflow: auto; vertical-align: top; resize: vertical; }input:valid,textarea:valid{  }input:invalid,textarea:invalid{ background-color: #f0dddd; }table{ border-collapse: collapse; border-spacing: 0; }td{ vertical-align: top; }.chromeframe{ margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }@media only screen and (min-width: 35em){}.ir{ display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }.ir br{ display: none; }.hidden{ display: none !important; visibility: hidden; }.visuallyhidden{ border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{ clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }.invisible{ visibility: hidden; }.clearfix:before,.clearfix:after{ content: ""; display: table; }.clearfix:after{ clear: both; }.clearfix{ *zoom: 1; }@media print{*{ background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; }a,a:visited{ text-decoration: underline; }a[href]:after{ content: " (" attr(href) ")"; }abbr[title]:after{ content: " (" attr(title) ")"; }.ir a:after,a[href^="javascript:"]:after,a[href^="#"]:after{ content: ""; }pre,blockquote{ border: 1px solid #999; page-break-inside: avoid; }thead{ display: table-header-group; }tr,img{ page-break-inside: avoid; }img{ max-width: 100% !important; }@page{ margin: 0.5cm; }p,h2,h3{ orphans: 3; widows: 3; }h2,h3{ page-break-after: avoid; }}

/* 作者の好みにより追加 */
p,dd,ul,ol {margin:0;padding:0;}
h1,h2,h3,h4,h5,h6 {font-size:1em;font-weight:bold;}

/* =========== / Reset =========== */

/* =========== Google WebFonts ========== */
.wf-loading h1#blog-title {
	font-family: 'メイリオ','Meiryo', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS P Gothic', 'Osaka', 'Helvetica', 'Arial', 'Gothic', sans-serif;
	font-size: 180%;
}
.wf-inactive h1#blog-title {
	font-family: 'メイリオ','Meiryo', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS P Gothic', 'Osaka', 'Helvetica', 'Arial', 'Gothic', sans-serif;
	font-size: 180%;
}
.wf-active h1#blog-title {
	font-family: 'Indie Flower', 'メイリオ','Meiryo', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS P Gothic', 'Osaka', 'Helvetica', 'Arial', 'Gothic', sans-serif;
	font-size: 300%;
	font-weight: normal;
	line-height: 1;
	margin-bottom: 0;
}
.wf-loading .handwriting {
	font-family: 'メイリオ','Meiryo', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS P Gothic', 'Osaka', 'Helvetica', 'Arial', 'Gothic', sans-serif;
}
.wf-inactive .handwriting {
	font-family: 'メイリオ','Meiryo', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS P Gothic', 'Osaka', 'Helvetica', 'Arial', 'Gothic', sans-serif;
}
.wf-active .handwriting {
	font-family: 'Indie Flower', 'メイリオ','Meiryo', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS P Gothic', 'Osaka', 'Helvetica', 'Arial', 'Gothic', sans-serif;
	font-size: 160%;
	line-height: 1;
}

/* =========== / Google WebFonts ========== */

/* =========== Template Styles ========== */

/**************************************************
*
*Common
*
**************************************************/

/* Body */
body {
	margin: 0;
	padding: 0;
	color: #003366;
	font-family: 'メイリオ','Meiryo', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'ＭＳ Ｐゴシック', 'MS P Gothic', 'Osaka', 'Helvetica', 'Arial', 'Gothic', sans-serif;
	font-size: 12px;
	line-height: 1.4;
	/* Gradient fallback */
	background-color: transparent;
	/* Gradient Safari 4-5, Chrome 1-9 */
	/* Gradient Can't specify a percentage size? Laaaaaame. */
	background: -webkit-gradient(radial, center center, 0, center center, 460, from(#638773) to(#314841));
	/* Gradient Safari 5.1+, Chrome 10+ */
	background: -webkit-radial-gradient(circle, #638773, #314841);
	/* Gradient Firefox 3.6+ */ 
	background: -moz-radial-gradient(circle, #638773, #31484);
	/* Gradient IE 10 */ 
	background: -ms-radial-gradient(circle, #638773, #314841);
	/* Opera cannot do radial gradients yet */
}

/* Link */
a,
a:visited {
	color: #CC3399;
	text-decoration: none;
}
a:hover,
a:active {
	color: #999999;
	text-decoration: underline;
}
#main-header a,
#main-header a:visited,
#main-footer a,
#main-footer a:visited {
	color: #FFFFCC;
	font-weight: bold;
	text-decoration: none;
}
#main-header a:hover,
#main-header a:active,
#main-footer a:hover,
#main-footer a:visited {
	color: #FFF;
	font-weight: bold;
	text-decoration: underline;
}
.handwriting a,
.handwriting a:visited {
	color: inherit;
	text-decoration: underline;
}
.handwriting a:hover,
.handwriting a:active {
	color: #999999;
	text-decoration: none;
}
 /* Images */
img {
	 max-width: 80%;
	 height: auto;
	 margin: 1.5em auto;
	 padding: 0.5em;
	 background: #EEE;
	-webkit-box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.5);
	-moz-box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.5);
	box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.5);
}

/* Form Elements */
input[type="text"] {
	clear: both;
	padding: 0 0.75em;
	margin: 0.25em 0;
	border: solid medium #699;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	background: #FFF;
}
input[type="text"]:hover,
input[type="text"]:focus {
	background: #FFFFCC;
	border-color: #C39;
}
textarea {
	width: 90%;
	padding: 0.5em;
	border: solid medium #699;
	-webkit-border-radius: 15px;
	-moz-border-radius:15px;
	border-radius: 15px;
	background:#FFF;
}
textarea:hover,
textarea:focus {
	background: #FFFFCC;
	border-color: #C39;
}
input[type="submit"] {
	margin: 0.25em;
	padding: 0.25em 0.75em;
	border: solid thin #06F;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	font-weight: bold;
	color: #FFF;
	cursor: hand;
	cursor: pointer;
	/* Gradient fallback */
	background-color: #9FF;
	/* Gradient Safari 4-5, Chrome 1-9 */
	/* Gradient Can't specify a percentage size? Laaaaaame. */
	background: -webkit-gradient(radial, center center, 0, center center, 460, from(#6CF) to(#09F));
	/* Gradient Safari 5.1+, Chrome 10+ */
	background: -webkit-radial-gradient(circle, #6CF, #09F);
	/* Gradient Firefox 3.6+ */ 
	background: -moz-radial-gradient(circle, #6CF, #09F);
	/* Gradient IE 10 */ 
	background: -ms-radial-gradient(circle, #6CF, #09F);
	/* Opera cannot do radial gradients yet */
}
input[type="submit"]:hover,
input[type="submit"]:focus {
	border-color: #C39;
	/* Gradient fallback */
	background-color: #F39;
	/* Gradient Safari 4-5, Chrome 1-9 */
	/* Gradient Can't specify a percentage size? Laaaaaame. */
	background: -webkit-gradient(radial, center center, 0, center center, 460, from(#F9F) to(#F39));
	/* Gradient Safari 5.1+, Chrome 10+ */
	background: -webkit-radial-gradient(circle, #F9F, #F39);
	/* Gradient Firefox 3.6+ */ 
	background: -moz-radial-gradient(circle, #F9F, #F39);
	/* Gradient IE 10 */ 
	background: -ms-radial-gradient(circle, #F9F, #F39);
	/* Opera cannot do radial gradients yet */
	color: #000;
}

/* Wrapper */
#wrapper {
	padding: 3em;
	background: #FFF;
	-webkit-box-shadow: 7px 7px 5px rgba(25, 25, 25, 0.75);
	-moz-box-shadow: 7px 7px 5px rgba(25, 25, 25, 0.75);
	box-shadow: 7px 7px 5px rgba(25, 25, 25, 0.75);
}

/**************************************************
*
*Architecture
*
**************************************************/
#main-header,
#wrapper,
#main-footer {
	width: 94%;
	max-width: 1000px;
	margin: 1em auto;
}
#main-left {
	width: 66%;
	float: left;
}
#main-right {
	width: 30%;
	float: right;
}

/**************************************************
*
*Main Header
*
**************************************************/
#main-header {
	color: #FFF;
	text-align: center;
}

#calendar {
	text-align: center;
	margin: 1.5em 0;
}
p#current-calendar {
	font-weight: bold;
}

/**************************************************
*
*Main Left
*
**************************************************/
/* Entry Navigation */
#entry-nav {
	text-align: right;
}

/* +++++ Entries +++++ */
.entry,
#comment-form {
	background-color: #FFF;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-box-shadow: 2px 2px 7px rgba(50, 50, 50, 0.75);
	-moz-box-shadow: 2px 2px 7px rgba(50, 50, 50, 0.75);
	box-shadow: 2px 2px 7px rgba(50, 50, 50, 0.75);
}
.entry-header,
#comment-form h4.title {
	border-bottom: solid medium #699;
}

/* Entry */
.entry {
	padding: 3em 1.5em 2em 1.5em;
	margin-bottom: 3em;
}
.entry-anchor0 {
}
.entry-anchor1 {
}
.entry-header h2.entry-title {
	font-size: 140%;
}
.entry-footer {
	text-align: right;
	margin-bottom: 1.5em;
}
.entry-footer ul.entry-info {
	list-style-type: none;
	line-height: 1.2;
}
.entry-status {
	border-top: solid thin #699;
	margin-top: 1.5em;
	padding-top: 1.5em;
}
.entry-status ul.entry-status-list {
	list-style-type: none;
}
.morelink {
	text-align: right;
}

/* +++++ Feedback +++++ */
#comment-list,
#trackback-list,
#comment-form,
#trackback-info {
	width: 75%;
	margin: 1.5em auto;
}
/* Comments */
#comment-list {
	list-style-type: none;
	margin-top: 2em;
}
#comment-list li {
	padding: 3em 1.5em 2em 1.5em;
	margin-top: -2em;
}
#comment-list li h5.title {
	text-align: right;
}
#comment-list li p.comment-body {
}
#comment-list li p.comment-date {
	text-align: right;
}
.comment {
	-webkit-box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.5);
	-moz-box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.5);
	box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.5);
}
.comment-anchor {
	display: none;
}
.comment-anchor0 {
	background: #FFE1E1;
	margin-left: -1.5em;
}
.comment-anchor1 {
	background: #E8E8FF;
	margin-right: -1.5em;
}

/* Comment Form */
#comment-form {
	margin: 1.5em 0;
	width: 75%;
	margin: 1.5em auto;
	padding: 3em 1.5em 2em 1.5em;
}
#comment-form input[type="text"]#name {
	width: 30%;
	max-width: 200px;
}
#comment-form input[type="text"]#email,
#comment-form input[type="text"]#url {
	width: 65%;
	max-width: 450px;
}
#comment-form-cookie {
	margin-top: 1em;
	text-align: center;
}
#comment-form-submit {
	text-align: center;
}

/* Trackbacks */
#trackback-list {
	list-style-type: none;
	margin-top: 2em;
}
#trackback-list li {
	padding: 3em 1.5em 2em 1.5em;
	margin-top: -2em;
}
#trackback-list blockquote {
}
#trackback-list blockquote cite {
}
#trackback-list li h5 {
	border-bottom: solid medium #699;
}
#trackback-list li p.trackback-body {
}
#trackback-list li p.trackback-date {
	text-align: right;
}
.trackback {
	-webkit-box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.5);
	-moz-box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.5);
	box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.5);
}
.trackback-anchor {
	display: none;
}
.trackback-anchor0 {
	background: #FFE1E1;
	margin-left: -1.5em;
}
.trackback-anchor1 {
	background: #E8E8FF;
	margin-right: -1.5em;
}
#trackback-info input[type="text"]#trackback-url {
	width: 65%;
	max-width: 450px;
}

/* +++++ Other +++++ */

/* Edit Link */
#edit {
	text-align: right;
	font-size: 85%;
	line-height: 1;
	margin-top: -2em;
	margin-bottom: 2em;
}
#edit #edit-link span.dingbat {
	font-size: 300%;
	position: relative;
	top: 0.15em;
}
body.eid #edit #edit-link.invisible {
	visibility: visible;
}
#edit #edit-link a,
#edit #edit-link a:visited {
	color: #999;
	text-decoration: none;
}
#edit #edit-link a:hover,
#edit #edit-link a:active {
	color: #CC3399;
	text-decoration: none;
}
/* Pager */
#pager {
	text-align: center;
}
a.pagercurrent {
	font-weight:bold;
}

/**************************************************
*
*Entry Body
*
**************************************************/
.entry-body h1 {
	font-size: 200%;
	border-left: solid thick #C39;
	padding-left: 0.5em;
}
.entry-body h2 {
	font-size: 180%;
	border-left: solid thick #C39;
	padding-left: 0.5em;
}
.entry-body h3 {
	font-size: 160%;
	border-left: solid thick #C39;
	padding-left: 0.5em;
}
.entry-body h4 {
	font-size: 140%;
	border-left: solid thick #C39;
	padding-left: 0.5em;
}
.entry-body h5 {
	font-size: 120%;
	border-left: solid thick #C39;
	padding-left: 0.5em;
}
.entry-body h6 {
	font-size: 100%;
	border-left: solid thick #C39;
	padding-left: 0.5em;
}
.entry-body ol,
.entry-body ul,
.entry-body dd {
	margin-left: 1.5em;
}
.entry-body ol {
	list-style-type: decimal;
}
.entry-body ol ol {
	list-style-type: upper-roman;
}
.entry-body ol ol ol {
	list-style-type: upper-alpha;
}
.entry-body ol ol ol ol {
	list-style-type: decimal-leading-zero;
}
.entry-body ol ol ol ol ol {
	list-style-type: lower-roman;
}
.entry-body ol ol ol ol ol ol {
	list-style-type: lower-alpha;
}
.entry-body ul,
.entry-body ul ul ul ul {
	list-style-type: disc;
}
.entry-body ul ul,
.entry-body ul ul ul ul ul {
	list-style-type: circle;
}
.entry-body ul ul ul,
.entry-body ul ul ul ul ul ul {
	list-style-type: square;
}
.entry-body dt {
	font-weight: bold;
}
.entry-body blockquote {
	margin: 1em 1.5em;
	padding: 1.5em;
	border-left: solid thick #FFE1D7;
}
.entry-body blockquote cite {
	font-weight: bold;
	color: #999;
}
.entry-body blockquote footer {
	text-align: right;
}
.entry-body 
.entry-body em,
.entry-body i {
	text-decoration: underline;
}
.entry-body ins {
	background-color: #FCC;
}
.entry-body s,
.entry-body del {
	text-decoration: line-through;
}
.entry-body abbr {
	cursor: help;
	border-bottom: 1px dashed #000;
}
.entry-body bdo[dir="rtl"] {
	direction: rtl;
	unicode-bidi: bidi-override;
}
.entry-body pre	{
	margin: 1em 1.5em;
	padding: 0.5em;
	border: solid thick #FFE1D7;
}

/**************************************************
*
*Main Right
*
**************************************************/
.links,
.widget {
	margin-bottom: 3em;
	background: #FF9;
	padding: 3em 1.5em 2em 1.5em;
	-webkit-box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.5);
	-moz-box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.5);
	box-shadow: 1px 1px 5px rgba(50, 50, 50, 0.5);
}
.widget h2.title {
	border-bottom: solid medium #699;
}
.widget ul {
	line-height: 1.2;
}
.widget-list-footer {
	text-align: right;
	border-bottom: dotted thin #699;
}

/* Search */
input[type="text"]#search {
	width: 90%;
}
#form-search-submit {
	text-align: right;
}

/* Free Space */
.widget-freespace {
	background-color: #FFF;
}
.freespace-content h1 {
	font-size: 160%;
}
.freespace-content h2 {
	font-size: 120%;
}
.freespace-content h3 {
	font-size: 100%;
}
.freespace-content dt {
	font-weight: bold;
}
 {
	margin-left: 1em;
}
.freespace-content ul,
.freespace-content ol {
	margin-left: 1.5em;
}
.freespace-content ul ul,
.freespace-content ul ul ul,
.freespace-content ul ul ul ul,
.freespace-content ul ul ul ul ul,
.freespace-content ul ul ul ul ul ul,
.freespace-content ol ol,
.freespace-content ol ol ol,
.freespace-content ol ol ol ol,
.freespace-content ol ol ol ol ol,
.freespace-content ol ol ol ol ol ol,
.freespace-content dd {
	margin-left: 1em;
}
.freespace-content ul,
.freespace-content ul ul ul ul {
	list-style-type: disc;
}
.freespace-content ul ul,
.freespace-content ul ul ul ul ul {
	list-style-type: circle;
}
.freespace-content ul ul ul,
.freespace-content ul ul ul ul ul ul {
	list-style-type: square;
}
.freespace-content ol,
.freespace-content ol ol ol ol {
	list-style-type: decimal;
}
.freespace-content ol ol,
.freespace-content ol ol ol ol ol {
	list-style-type: upper-roman;
}
.freespace-content ol ol ol,
.freespace-content ol ol ol ol ol ol {
	list-style-type: upper-alpha;
}
.freespace-content blockquote {
	margin: 1em;
	padding: 1em;
	border-left: solid thick #FFE1D7;
}
.freespace-content blockquote cite {
	font-weight: bold;
	color: #999;
}
.freespace-content blockquote footer {
	text-align: right;
}

/**************************************************
*
*Main Footer
*
**************************************************/
#main-footer {
	color: #FFF;
	text-align: center;
}
/* =========== / Template Styles ========== */

高品質デザイン選び放題で、あなた好みのブログに。今すぐブログ作成！: 今すぐ 無料ブログ をはじめよう！ ≫ブログ作成