/* ----------------------------------------------------------------------
 layout
---------------------------------------------------------------------- */
body { min-width:100%; border:none; }

#outer_wrap { position:relative; overflow:hidden; width:100%; background:#666; }
.inner_wrap { position:relative; width:100%; right:0; }

.open .inner_wrap { right:80%; border-right:1px solid #ccc; }

.open .inner_wrap:after { height:100%; content:''; width:12px; display:block; position:absolute; right:-12px; top:-5px;  background:url(img/side/nav_background.png) repeat-y -5px top; z-index:9; }

#contents { width:auto; margin:0; background:#fff; }
#main_col { width:100%; float:none; padding:20px 15px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }
#side_col { border-top:1px solid #ddd; width:100%; float:none; padding:20px 15px 0; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }
#side_col2 { border-top:1px solid #ddd; width:100%; float:none; padding:20px 15px 0; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }

.page-template-page-noside-php #main_col, .page-template-page-noside-nocomment-php #main_col
 { width:auto; float:none; padding:20px 15px; }



/* ----------------------------------------------------------------------
 header
---------------------------------------------------------------------- */
/* header */
#header_wrap { width:100%; min-width:100%; background:none; }
#header {
  width:100%; height:50px; position:relative; 
  -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; border-bottom:1px solid #ccc; box-shadow:0px 0px 0px 1px #fff inset, 0 0 5px rgba(0, 0, 0, 0.2);
  background:#f2f2f2; background: -webkit-linear-gradient(top, #ffffff, #f2f2f2); background: -moz-linear-gradient(top, #ffffff, #f2f2f2); background: -ms-linear-gradient(top, #ffffff, #f2f2f2); background: -o-linear-gradient(top, #ffffff, #f2f2f2); background: linear-gradient(to bottom, #ffffff, #f2f2f2); filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0, StartColorStr='#ffffff', EndColorStr='#f2f2f2');
}

/* logo */
#logo_text { position:absolute; top:15px; left:15px; margin:0; line-height:120%; float:none; font-size:16px; width:50%; font-weight:normal; }
#logo_text a { color:#333; text-decoration:none; display:block; }
#logo_text a:hover { text-decoration:underline; }
#logo_image img { height:35px; width:auto; line-height:40px; position:absolute; left:15px; top:7px; }



/* description */
#site_description { display:none; }


/* global menu */
#global_menu { height:100%; position:absolute; right:-80%; bottom:0px; top:-4px; width:80%; z-index:-9999; }
#global_menu li a, #global_menu .menu_home a { color:#ddd; display:block; padding:21px; font-size:11px; text-decoration:none; border-bottom:1px solid #777; }
#global_menu li a:hover, #global_menu .menu_home a:hover { color:#fff; background:#555; }
#global_menu li a strong { font-weight:normal; }
#global_menu li a span { display:none; }


/* global menu */
#menu_button { display:block; position:absolute; right:10px; top:14px; margin:0; display:block; width:24px; height:20px; background:url(img/header/menu_button.png) no-repeat left top; text-decoration:none; text-indent:100%; white-space:nowrap; overflow:hidden; }
#menu_button:hover { opacity:0.5; }
.open #menu_button { background-position:left bottom; }


/* social link */
#social_link { display:none; }
#social_link li { margin:16px 0 0 15px; }



/* ----------------------------------------------------------------------
 header contents
---------------------------------------------------------------------- */
#header_contents { height:auto; margin-top:0; }
.home #header_contents { height:auto; margin-top:0; padding:15px 0; }
.archive #header_contents { height:auto; margin-top:0; }
.page #header_contents { height:auto; margin-top:0; }
.home.header_image #header_contents { height:auto; background:none; padding:0; }


/* archive headline */
.archive_headline { width:auto; margin:0 auto; height:auto; line-height:150%; font-size:16px; padding:30px 15px; }
.archive_headline span { font-size:11px; color:#999; margin:0 0 0 15px; }


/* page title */
#page_title { width:auto; margin:0 auto; height:auto; line-height:150%; font-size:16px; font-weight:normal; padding:30px 15px; }


/* contents slider */
#content_slider { width:100%; height:auto; padding:0 15px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }
#content_slider .image img { width:100%; height:auto; display:block; float:none; }
#content_slider .post_data { float:none; padding:0; width:100%; height:auto; }
#content_slider .post_title { max-height:100%; }
#content_slider .post_meta_top { max-height:100%; }
#content_slider .post_excerpt { max-height:100%; font-size:11px; display:none; }
#content_slider a.link { float:none; position:relative; margin:0 0 15px 0; display:none; }
.flex-control-paging { position:relative; left:0; bottom:0; z-index:9; margin:0 auto; text-align:center; }
.flex-control-paging li { float:none; display:inline; margin:0 5px; }
.flex-control-paging li a { display:inline-block; }


/* header image */
#header_image { padding:0; width:100%; margin:0 auto; }
#header_image img { width:100%; height:auto; }


/* breadcrumb */
#bread_crumb { overflow:none; width:auto; padding:10px 15px; margin:0; height:auto; }
#bread_crumb li { float:left; margin:0 0 5px 0; font-size:10px; line-height:150%; }



/* ----------------------------------------------------------------------
 Index
---------------------------------------------------------------------- */

/* post list1 */
.post_list1 .post1 { border-bottom:1px dotted #ccc; padding:0 0 15px 0; margin:0 0 15px 0; }
.post_list1 .post1 .image { width:100%; height:auto; float:none; border:1px solid #ddd; margin:0 0 15px 0; }
.post_list1 .post1 .image img { width:100%; height:auto; }
.post_list1 .post1 .info { width:auto; float:none; }
.post_list1 .post2 { margin:0; }
.post_list1 .post2 li { border-top:none; border-bottom:1px dotted #ccc; float:none; width:auto; margin:0 0 10px 0; padding:0 0 10px 0; }
.post_list1 .post2 .image { margin:0 15px 0 0; }
.post_list1 .post2 .info { float:none; width:auto; }


/* post list2 */
.post_list2 li { margin:0 0 17px 0; }
.post_list2 .image { float:none; width:100%; height:auto; border:1px solid #ddd; margin:0 0 15px 0; }
.post_list2 .image img { width:100%; height:auto; display:block; }
.post_list2 .info { float:none; width:auto; }


/* post list3 */
.post_list3 { margin:5px 0 0 0; }
.post_list3 li { border-bottom:1px dotted #ccc; padding:0 0 10px 0; font-size:14px; float:none; width:100%; height:auto; margin:0 0 10px 0; }
.post_list3 .image { width:100px; height:auto; float:left; margin:0 10px 0 0; }
.post_list3 .image img { width:100%; height:auto; }
.post_list3 .title { height:auto; overflow:none; font-size:12px; }


/* post list5 */
.post_list5 .post_list_date { margin:4px 0 5px 0; float:none; }
.post_list5 .title { float:none; width:auto; margin:0; font-size:13px; line-height:160%; font-weight:normal; }


/* default post style */
#default_post_list_style .title { border-bottom:1px dotted #ccc; padding:0 0 15px 0; margin:0; }
#default_post_list_style .title h2 { width:auto; float:left; font-size:18px; line-height:140%; margin:-3px 0 0 55px; }
.no_date #default_post_list_style .title h2 { margin:-3px 0 0 0; }
#default_post_list_style .post_date { width:45px; height:45px; }
#default_post_list_style .post_date .date { top:9px; width:45px; }
#default_post_list_style .post_date .year { top:27px; width:45px;  }



/* ----------------------------------------------------------------------
 archive
---------------------------------------------------------------------- */
#category_desc:before { left:50%; }
#category_desc:after { left:50%; }

/* sort */
@media screen and (max-width:480px) {
 #sort_form label { display:none; }
}

/* post list1 */
#archive_post_list1 .image { float:none; width:100%; height:auto; margin:0 0 15px 0; }
#archive_post_list1 .image img { width:100%; height:auto; }



/* ----------------------------------------------------------------------
 single post page
---------------------------------------------------------------------- */
/* title and date */
#single_title { border-bottom:1px dotted #ccc; padding:0 0 15px 0; margin:0; }
#single_title h2 { width:auto; float:left; font-size:18px; line-height:140%; margin:-3px 0 0 55px; }
#post_single_date { width:45px; height:45px; }
#post_single_date .date { top:9px; width:45px; }
#post_single_date .year { top:27px; width:45px;  }

.no_date #single_title h2 { float:none; margin:0; }

/* to fix the bug on Android default browser */
.post_content pre { overflow:none; white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -webkit-pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word; }

/* others */
.post_content iframe, .post_content embed { max-width:100%; }

/* next prev post link */
#next_prev_link a { display:block; width:100%; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; }
#next_prev_link .prev_post a { width:100%; float:none; -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; margin-right:0; margin-bottom:-1px; position:relative; }
#next_prev_link .next_post a { float:none; text-align:right; -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; }

/* comment */
#comment_header li a, #comment_header li p { float:none; width:100%; }



/* ----------------------------------------------------------------------
 side
---------------------------------------------------------------------- */
/* free space */
.fixed_ad { position:relative; top:0px; height:auto; width:auto; }
.fixed_ad2 { position:relative; bottom:0px; height:auto; width:auto; }
.three_column .free_widget { padding:0; }
.three_column .fixed_ad { width:auto; }
.three_column .fixed_ad2 { width:auto; }



/* ----------------------------------------------------------------------
 footer
---------------------------------------------------------------------- */
/* recommend post */
#recommend_wrap { min-width:100%; height:auto; background:#eee; box-shadow:inset 0px 2px 4px 0 rgba(0,0,0,0.1); }
#recommend { width:auto; margin:0 15px; }
#recommend_post { width:100%; text-align:center; margin-left:0; }
#recommend_post a.image { width:100%; height:auto; }
#recommend_post a.image img { width:100%; height:auto; }
#recommend_post a.title { width:100%; }
#recommend_post .owl-wrapper-outer { width:100%; overflow:hidden; }
.owl-next { display:none; }
.owl-prev { display:none; }
.owl-theme .owl-controls{ margin-top:10px; text-align:center; }
.owl-theme .owl-controls .owl-page { display:inline-block; zoom:1; *display: inline;/*IE7 life-saver */ }
.owl-theme .owl-controls .owl-page span { display:block; width:12px; height:12px; margin:5px 7px; filter: Alpha(Opacity=50);/*IE7 fix*/ opacity: 0.5; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius:20px; background:#869791; }
.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span { filter: Alpha(Opacity=100);/*IE7 fix*/ opacity: 1; }


/* footer */
#footer_wrap { min-width:100%; }
#footer { width:auto; }

/* footer widget */
#footer_widget_area { font-size:10px; padding-top:30px; }
.footer_widget, .footer_widget.right_widget { float:none; margin:0 15px 30px; width:auto; }

/* copyright */
#copyright { text-align:center; padding:0 0 20px; font-size:11px; }