/*
 * RGBAPNG
 */
/*
 * Grid System
 */
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.home #header {
  height: 100%;
}
.home #header .billboard {
  overflow: hidden;
  position: relative;
  height: 600px;
  background: #333 url('/wp-content/themes/hassen/assets/img/home/billboard-bg.jpg?1414306613') repeat 0 0;
}
.home #header .billboard .site-logo {
  position: absolute;
  z-index: 750;
  top: 30px;
  left: 0;
  right: 0;
  bottom: auto;
  margin: auto;
  width: 58.75em;
  height: 72px;
}
.home #header .billboard .site-logo h1 {
  overflow: hidden;
  background-image: url('/wp-content/themes/hassen/assets/img/common/logo/header-home.png?1414330004');
  background-repeat: no-repeat;
  background-position: 50% 50%;
  width: 200px;
  height: 72px;
}
.home #header .billboard .site-logo h1:before {
  content: "";
  display: block;
  width: 0;
  height: 100%;
}
.home #header .billboard .carousel {
  z-index: 500 !important;
}
.home #header .billboard .carousel img {
  visibility: hidden;
  float: left;
  box-shadow: 0 0 6px 1px rgba(0, 0, 0, 0.5);
}
.home #header .site-nav {
  position: relative;
  z-index: 1000;
  margin-top: -2px;
  box-shadow: 0 -6px 6px -6px rgba(0, 0, 0, 0.5);
}

.home #main {
  margin-top: 3em;
  margin-bottom: 3em;
}
.home #main .shin-banner {
  cursor: pointer;
  overflow: hidden;
  border-radius: 4px;
  margin-bottom: 50px;
  width: 940px;
  height: 100px;
  transition-property: height;
  transition-duration: 500ms;
}
.home #main .shin-banner.open {
  transition-property: height;
  height: 590px;
}
.home #main .page-content {
  float: left;
  display: block;
  margin-right: 2.12766%;
  width: 68.08511%;
}
.home #main .page-content:last-child {
  margin-right: 0;
}
.home #main .page-content .news header {
  padding-bottom: 1.5em;
  position: relative;
  background: transparent url('/wp-content/themes/hassen/assets/img/common/border/dotted-640.png?1412412173') no-repeat bottom left;
}
.home #main .page-content .news header h1 {
  overflow: hidden;
  background-image: url('/wp-content/themes/hassen/assets/img/home/news-heading.png?1411768606');
  background-repeat: no-repeat;
  background-position: 50% 50%;
  width: 200px;
  height: 22px;
}
.home #main .page-content .news header h1:before {
  content: "";
  display: block;
  width: 0;
  height: 100%;
}
.home #main .page-content .news header .news-list {
  position: absolute;
  top: 3px;
  left: 0;
  width: 100%;
  font-size: 15px;
  line-height: 22px;
  vertical-align: middle;
  text-align: right;
}
.home #main .page-content .news header .news-list:before {
  display: inline-block;
  margin-right: 5px;
  content: url('/wp-content/themes/hassen/assets/img/common/icon/list.png?1414330597');
}
.home #main .page-content .news header .news-list a {
  color: #545454;
}
.home #main .page-content ul {
  padding-top: 1.5em;
}
.home #main .page-content ul li article {
  display: table;
  width: 100%;
  font-size: 15px;
}
.home #main .page-content ul li article time {
  display: table-cell;
  width: 26%;
}
.home #main .page-content ul li article .title {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: table-cell;
  width: 74%;
}
.home #main .page-sidebar {
  margin-top: 0em;
  float: left;
  display: block;
  margin-right: 2.12766%;
  width: 29.78723%;
  margin-left: 0%;
  margin-right: 0;
}
.home #main .page-sidebar:last-child {
  margin-right: 0;
}
.home #main .page-sidebar #works {
  overflow: hidden;
  position: relative;
  float: right;
  width: 250px;
}
.home #main .page-sidebar #works .carousel {
  overflow: hidden;
}
.home #main .page-sidebar #works .carousel figure {
  float: left;
}
.home #main .page-sidebar #works .carousel figure figcaption a {
  display: block;
  padding: 8px;
  width: 100%;
  color: #444;
  font-size: 14px;
  text-align: center;
  background-color: #f1f0e8;
}
.home #main .page-sidebar #works .carousel figure figcaption a:hover {
  background-color: #eae9df;
  text-decoration: none;
}
.home #main .page-sidebar #works .progress-bar {
  position: absolute;
  top: 155px;
  left: 0;
  width: 0%;
  height: 3px;
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAQAAAAnOwc2AAAAE0lEQVR4nGNiMMaETAxYwFARBACWWQITALxvDAAAAABJRU5ErkJggg==');
  background: rgba(0, 0, 0, 0.2);
}
