/* ----------------------------------------------------------------------
 layout
---------------------------------------------------------------------- */
#header { width:100%; height:auto; min-height:47px; position:relative; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3); background:#fff; margin:0; z-index:10; -webkit-border-radius:0; -moz-border-radius:0; border-radius:0; }
#main_content { width:auto; margin:0; padding:30px 0 0; position:relative; background:none; }
#main_col_wrap { margin:0 10px 30px; background:rgba(183,193,197, 0.8); border:1px solid #cce5ed; -webkit-border-radius:15px; -moz-border-radius:15px; border-radius:15px; box-shadow:0 0 5px 0px rgba(0,0,0, 0.3), 0 0 5px 0px rgba(0,0,0, 0.2) inset; }
#main_col, .page-template-page-noside-php #main_col { background:#fff; width:auto; float:none; margin:10px; padding:40px 0 0 0; -moz-border-radius:10px; -khtml-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3); overflow:hidden; }
#side_col { background:#fff; width:auto; float:none; margin:0; padding:20px 30px; }
.page-template-page-noside-php #main_col_wrap { margin-bottom:0; }
.page-template-page-noside-php #main_content { background:none; }
.page-template-page-noside-php #main_col, .page-template-page-noside-php #content, .page-template-page-noside-php #side_col { width:auto; }
.page-template-page-noside-php #side_col { display:none; }

@media screen and (max-width:480px) {
  #main_col_wrap { margin:0 6px 30px; box-shadow:0 0 3px 0px rgba(0,0,0, 0.4); }
  #main_col, .page-template-page-noside-php #main_col { margin:4px; }
  #side_col { padding:20px 15px; }
}

body { position:relative; overflow:hidden; width:100%; min-width:100%; background-position:left top; -moz-background-size:100%; -webkit-background-size:100%; -o-background-size:100%; -ms-background-size:100%; background-size:100%; padding:0; }

#container {
  background:none; border:none; -webkit-border-radius:0; -moz-border-radius:0; border-radius:0; box-shadow:none;
  position:relative; width:100%; right:0;
  -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0);
  -webkit-transition: -webkit-transform 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000); -moz-transition: -moz-transform 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000); -o-transition: -o-transform 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000); transition: transform 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
  -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden;
}
.open #container { right:70%; }
.csstransforms .open #container { right:0; -webkit-transform: translate(-70%, 0); -moz-transform: translate(-70%, 0); -ms-transform: translate(-70%, 0); -o-transform: translate(-70%, 0); transform: translate(-70%, 0); }

@media screen and (max-width:480px) {
  .open #container { right:85%; }
  .csstransforms .open #container { right:0; -webkit-transform: translate(-85%, 0); -moz-transform: translate(-85%, 0); -ms-transform: translate(-85%, 0); -o-transform: translate(-85%, 0); transform: translate(-85%, 0); }
}




/* ----------------------------------------------------------------------
 header
---------------------------------------------------------------------- */
/* logo */
#logo_text { position:relative; top:0px; left:0px; }
#logo_text #logo { font-size:22px; line-height:47px; margin:0 0 0 15px; padding:0; font-weight:normal; float:left; }
#logo a { color:#333; text-decoration:none; display:block; }
#logo a:hover { }
#tagline { display:none; }



/* global menu */
#global_menu { position:absolute; right:-70%; top:0px; width:70%; height:100%; background:#8e979b; padding:0; z-index:10; margin:0; border:none; overflow:auto; }
#global_menu:before { content:''; display:block; border-left:1px solid #666; background:url(img/menu_shadow.png) repeat-y left top; position:fixed; top:0px; right:-17px; width:17px; height:100%; z-index:2; }

@media screen and (max-width:480px) {
  #global_menu { right:-85%; width:85%; }
}

#global_menu ul { display:block; margin:0; float:none; -moz-border-radius:0; -khtml-border-radius:0; -webkit-border-radius:0; border-radius:0; box-shadow:none; }
#global_menu ul ul { display:block; position:relative; top:0px; left:0px; margin:0; padding:0; }
#global_menu ul ul ul { left:0px; top:0; margin:0; }
#global_menu ul li { float:none; margin:0; padding:0; line-height:160%; }

#global_menu > ul { border-bottom:1px solid #aeb7bb; border-top:1px solid #666; }

#global_menu ul li a, #global_menu ul ul li a
  { font-size:12px; display:block; width:auto; height:auto; line-height:180%; padding:13px 2em 13px; margin:0; background:#8e979b; color:#fff; border-left:none; border-top:1px solid #aeb7bb; border-bottom:1px solid #666; text-align:left; text-decoration:none; }

#global_menu > ul > li > a:after { display:none; }

#global_menu ul li a:hover { background:#aeb7bb; color:#fff; }
#global_menu ul li li a { padding-left:3em; }
#global_menu ul li li li a { padding-left:4em; }
#global_menu ul li li li li a { padding-left:5em; }
#global_menu ul ul li a:hover { border-bottom:1px solid #666; }

#global_menu ul li.current-menu-item > a { background:#8e979b url(img/stripe2.png) left top; position:relative; color:#fff; }
#global_menu ul li.current-menu-item > a:hover { background:#aeb7bb url(img/stripe2.png) left top; color:#fff; }
#global_menu > ul > li.current-menu-item > a:after { display:none; }


/* search form */
#search_area_mobile { display:block; background:#8e979b; width:100%; height:47px; margin:0; -webkit-border-radius:0; -khtml-border-radius:0; -moz-border-radius:0; border-radius:0; }
#search_area_mobile .search_input input { font-size:12px; background:#8e979b; color:#fff; width:75%; height:47px; padding:0 1.7em; margin:0; border:none; border-right:1px solid #aeb7bb; box-sizing:border-box; }
#search_area_mobile .search_input input:hover, #search_area_mobile .search_input input:focus { background:#5a6164; color:#fff; }
#search_area_mobile .search_button input {
  text-indent:200%; white-space:nowrap; overflow:hidden; display:block;
  position:absolute; top:0px; right:0px; height:47px; width:25%; line-height:47px; border:none; border-left:1px solid #666;
  -webkit-border-radius:0; -khtml-border-radius:0; -moz-border-radius:0; box-shadow:none; border-radius:0; box-sizing:border-box;
  background:#8e979b url(img/search_on.png) no-repeat center; -moz-background-size:15px; -webkit-background-size:15px; -o-background-size:15px; -ms-background-size:15px; background-size:15px;
}
#search_area_mobile .search_button input:hover { cursor:pointer; background-color:#aeb7bb; }


/* menu button */
#menu_button { display:block; position:absolute; right:0; top:0; margin:0; width:50px; height:100%; text-decoration:none; color:#bbb; border-left:1px solid #ddd; }
#menu_button .title { display:none; }
#menu_button .icon:before { font-family:'icomoon-nt-ml'; content:"\e618"; font-size:34px; top:7px; right:-7px; position:relative; font-style:normal; }
#menu_button:hover { color:#fff; }
.open #menu_button { color:#bbb; }
.open #menu_button:hover { color:#fff; }


/* social link button */
#search_link_area { display:none; }





/* breadcrumb */
#bread_crumb { background:none; margin:-22px 0 6px 0; left:0px; bottom:0; overflow:none; height:auto; width:auto; border:none; }
#bread_crumb ol { margin:0; position:relative; padding:0 10px; }
#bread_crumb ol li { display:inline; margin:0 0 10px 0; padding:0; font-size:10px; line-height:0; }
#bread_crumb ol li a, #bread_crumb ol li span.last { background:none; margin:0 20px 0 0; height:20px; line-height:180%; color:#888; text-decoration:none; position:relative; padding:0; }
#bread_crumb ol li a:after { font-family:'icomoon-nt-ml'; color:#888; font-size:6px; display:inline-block; position:absolute; content:"\e612"; top:-3px; right:-15px; background:none; width:auto; height:auto; transform:none; }
#bread_crumb ol li a:before { display:none; }




/* ----------------------------------------------------------------------
 post list
---------------------------------------------------------------------- */

/* post tilte */
#post_list .title { margin:0 20px 5px; }

/* post meta top */
.post_meta_top { margin:0 20px 35px; }

/* post content */
#post_list .post_content { margin:0 20px 35px; }

/* post meta bottom */
.post_meta_bottom { font-size:11px; margin:0 20px 35px -1px; }
.post_meta_bottom ul { margin:0; padding:10px 20px 5px; }

/* page navi */
.page_navi { margin:0 20px 0; padding:0 0 50px; }

@media screen and (max-width:480px) {
  .page_navi { margin:0 15px 0; padding:0 0 50px; }
}


/* back home link */
.page_navi p.back { margin:20px 0 -20px; }

/* archive headline */
#archive_headline { padding:0 20px; margin:-20px 0 10px; background:none; color:#888; }
#archive_headline:after { display:none; }

@media screen and (max-width:480px) {
  #post_list .title { margin:0 15px 5px; }
  .post_meta_top { margin:0 15px 35px; }
  #post_list .post_content { margin:0 15px 10px; }
  .post_meta_bottom { margin:0 -1px 25px; border:none; box-shadow:none; border-bottom:1px dotted #ccc; background:#f7f7f7; -moz-border-radius:0; -khtml-border-radius:0; -webkit-border-radius:0; border-radius:0; }
  .post_meta_bottom ul { padding:13px 15px 8px; }
  #archive_headline { padding:0 15px; }
}




/* ----------------------------------------------------------------------
 article
---------------------------------------------------------------------- */

/* post content */
#article .post_content { margin:0 20px; }
#article.page > .post_content { margin:0 20px 20px; }

/* post tilte */
#article #post_title { margin:0 20px 5px; }
#article #page_title { margin:0 20px 12px; }

/* post meta top */
.post_meta_top { margin:0 20px 35px; }

@media screen and (max-width:480px) {
  #article .post_content { margin:0 15px; }
  .page #article .post_content { margin:0 15px 20px; }
  #article #post_title { margin:0 15px 5px; }
  #article #page_title { margin:0 15px 12px; }
  .post_meta_top { margin:0 15px 35px; }
}


/* author profile */
#author_avatar { width:10%; margin:0 5% 0 0; }
#author_avatar img { width:100%; height:auto; }
#author_info { width:85%; }

@media screen and (max-width:480px) {
  #author_profile { padding:10px; }
  #author_avatar { float:none; margin:0 auto; }
  #author_avatar img { width:70px; height:auto; margin:0 auto 10px; display:block; }
  #author_info { float:none; width:100%; font-size:12px; }
  #author_name { margin:0 0 8px 0; font-size:16px; text-align:center; }
}


/* related post*/
#related_post .headline { border-bottom:1px solid #ccc; margin:0 0 15px 0; padding:0 20px 8px; line-height:100%; }
#related_post ol { margin:0 20px; }
#related_post li.odd { margin-right:5%; }

@media screen and (max-width:480px) {
  #related_post .headline { padding:0 15px 8px; }
  #related_post ol { margin:0 15px; }
  #related_post li { display:block; width:100%; margin-right:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }
  #related_post li.odd { margint:0%; }
}


/* next prev post link */
#next_prev_post { margin:0; padding:0 20px; clear:both; width:100%; -webkit-box-sizing:border-box;
-moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }
#next_prev_post a { line-height:160%; font-size:11px; background:#f2f2f2; text-decoration:none; width:50%;  padding:10px 20px; position:relative; -webkit-box-sizing:border-box;
-moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }
#next_prev_post a.prev_post { margin-left:-1px; }
#next_prev_post a.next_post { }

@media screen and (max-width:480px) {
  #next_prev_post a { float:none; width:100%; }
  #next_prev_post a.prev_post { border-right:none; border-bottom:1px solid #fff; -moz-border-radius:4px 4px 0 0; -khtml-border-radius:4px 4px 0 0; -webkit-border-radius:4px 4px 0 0; border-radius:4px 4px 0 0; }
  #next_prev_post a.next_post { border-left:none; border-top:1px solid #fff; -moz-border-radius:0 0 4px 4px; -khtml-border-radius:0 0 4px 4px; -webkit-border-radius:0 0 4px 4px; border-radius:0 0 4px 4px; }
}




/* ----------------------------------------------------------------------
 side content
---------------------------------------------------------------------- */
.side_widget { margin:0 0 30px 0; float:left; width:46%; color:#444; }
.side_widget a { color:#444; }
.side_widget.odd { clear:left; margin-right:8%; }

@media screen and (max-width:665px) {
 .side_widget { width:auto; padding:0 0 40px 0; margin:0 0 40px 0; border-bottom:1px dotted #777; float:none; }
 .side_widget:last-child { border:none; margin:0; padding:0; }
 .side_widget.odd { margin-right:0; }
}

/* calendar widget */
#wp-calendar td a { -webkit-border-radius:4px; -khtml-border-radius:4px; -moz-border-radius:4px; border-radius:4px; }
#wp-calendar td#today { -webkit-border-radius:4px; -khtml-border-radius:4px; -moz-border-radius:4px; border-radius:4px; }




/* ----------------------------------------------------------------------
 footer
---------------------------------------------------------------------- */
#footer, .page-template-page-noside-php #footer { width:auto; min-height:40px; margin:0; padding:0; position:relative; -moz-border-radius:0; -khtml-border-radius:0; -webkit-border-radius:0; border-radius:0; }

#copyright { margin-top:21px; }

@media screen and (max-width:480px) {
  #copyright { margin-left:15px; }
  .no_credit #copyright { margin-top:22px; }
  .theme_author { display:none; }
}


/* return top */
#return_top { position:absolute; right:0px; top:0px; border-left:1px solid #aaa; width:60px; min-height:60px; background:url(img/return_top1.gif) no-repeat center center; -moz-border-radius:0; -khtml-border-radius:0; -webkit-border-radius:0; border-radius:0; }
#return_top:hover { background:url(img/return_top2.gif) no-repeat center center; }
@media screen and (max-width:480px) {
  #return_top { width:40px; }
}


/* ----------------------------------------------------------------------
 comment
---------------------------------------------------------------------- */
#comments { padding:0 20px; }
.page #comments { margin-bottom:50px; }
#comment_header { margin:0 -20px 30px; }
#comment_header .headline { margin:0 20px; }
#comment_header #comment_tab { right:20px; }
#comment_header #comment_tab li a { padding:10px 30px 12px; }
#comments .post_content { padding:0; margin:0; }
#submit_comment { width:100%; }
.comment_meta a { padding:3px 15px; }

@media screen and (max-width:480px) {
  #comments { padding:0 15px; }
  #comment_header { margin:0 -15px 30px; }
  #comment_header { border-bottom:none; margin:0 0px; position:relative; height:auto; }
  #comment_header .headline { position:relative; left:0px; bottom:0; margin:0 -15px 20px; padding:0 15px 8px; display:block; border-bottom:1px solid #ccc; }
  #comment_header #comment_tab { margin:0 0 30px 0; padding:0; position:relative; right:0px; bottom:0px; }
  #comment_header #comment_tab li { width:50%; font-size:10px; }
  #comment_header #comment_tab li a { padding:15px 0px 12px; text-align:center; }
  .commentlist .children { margin:0 0 0 0px; }
  .commentlist .avatar { width:35px; height:35px; }
  #has_avatar .main_comment { margin:0 0 10px 45px; }
  .comment_name_date span.comment-date { display:block; margin:7px 0 0 0; }
}



