@charset "utf-8";

/* @page */
main.page section h2 {
  margin:16px;
  text-align:center;
  font-family:"MatissePro-B";
  font-size:175%;
  line-height:1.8;
}
main.page section h2 .small {
  font-size:75%;
}
main.page .page_inner {
  overflow:hidden;
  width:66.66%;
  margin:0 auto;
  padding-bottom:32px;
}
main.page section.area {
  margin-top:0;
  padding:16px 0;
  background-color:rgba(0,132,172,1);
  color:#fff;
}
main.page section.area .left {
  text-align:center;
}
main.page section.area .left img {
  max-width:50%;
}
main.page section.area .right p {
  margin-top:64px;
  font-size:125%;
  font-weight:bold;
}
main.page section.area .right p span.small {
  font-size:75%;
  font-weight:normal;
}

/* @about */
main.about #s01 h3 {
  margin-top:32px;
  border:solid #aaa 6px;
  padding:12px 0;
  text-align:center;
  font-size:125%;
  background-color:rgba(0,99,189,1);
  color:#fff;
}
main.about #s01 p {
  margin:16px;
  text-align:center;
}
main.about #s01 p img {
  max-width:90%;
  margin:16px;
}
main.about #s02 {
  position:relative;
  overflow:hidden;
  margin-bottom:0;
  padding-top:200px;
  padding-bottom:32px;
}
main.about #s02 div.bg {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:-1;
}
main.about #s02 div.bg img {
  width:100%;
}
main.about #s02 table {
  width:640px;
  max-width:100%;
  margin:32px auto;
  border-collapse:collapse;
}
main.about #s02 table th,
main.about #s02 table td {
  padding:16px;
  border-bottom:solid #000 1px;
}
main.about #s02 table th {
  text-align:right;
}

/* @works */
main.works #s01 .works_list p {
  text-align:center;
}
main.works #s01 .works_list ul {
  margin:32px;
}
main.works #s01 .works_list li {
  clear:both;
  overflow:hidden;
  margin-bottom:16px;
  padding:16px;
  transition:0.2s;
}
main.works #s01 .works_list li:hover {
  background-color:#ccc;
  transition:0.2s;
}
main.works #s01 .works_list li img {
  float:left;
  width:33.33%;
  margin-right:16px;
}
main.works #s01 .works_list li span.title {
  display:block;
  overflow:hidden;
  box-sizing:border-box;
  margin-right:16px;
  margin-bottom:16px;
  padding:4px 8px;
  border-bottom:solid #0063be 3px;
  font-size:125%;
  font-weight:bold;
  color:#0063be;
}
main.works #s01 .works_list li span.month,
main.works #s01 .works_list li span.category {
  padding:8px;
}
main.works #s01 .works_list li span.text {
  display:block;
  overflow:hidden;
  padding:8px;
}
main.works #s01 .works_detail .main table {
  width:100%;
}
main.works #s01 .works_detail .main td.only {
  width:50%;
}
main.works #s01 .works_detail .main th,
main.works #s01 .works_detail .photos h3 {
  margin:16px;
  text-align:center;
  font-family:"MatissePro-B";
  font-size:150%;
}
main.works #s01 .works_detail .main img {
  width:100%;
}
main.works #s01 .works_detail .photos {
  overflow:hidden;
}
main.works #s01 .works_detail .photos ul li {
  float:left;
  box-sizing:border-box;
  width:33.33%;
  padding:0 4px;
  margin-bottom:8px;
  transition:0.2s;
}
main.works #s01 .works_detail .photos ul li:hover {
  opacity:0.7;
  transition:0.2s;
}
main.works #s01 .works_detail .photos img {
  width:100%;
}
main.works #s01 .works_detail .data {
  clear:both;
  margin:80px 0;
  padding:16px;
  text-align:center;
  background-color:rgba(0,66,126,1);
  color:#fff;
}
main.works #s01 .works_detail .data span.title {
  font-size:125%;
  font-weight:bold;
}
main.works #s01 .works_detail .data span.month {
  padding-right:16px;
  border-right:solid #fff 1px;
}
main.works #s01 .works_detail .data span.category {
  margin-left:16px;
}

/* @flow */
main.flow #s01 h3 {
  margin-top:32px;
  border:solid #0063be 6px;
  padding:12px 0;
  text-align:center;
  font-size:125%;
  font-weight:bold;
  color:#0063be;
}
main.flow #s01 p {
  margin:16px;
  text-align:center;
}
main.flow a.more {
  width:50%;
  margin:48px auto;
}
main.flow h4 {
  width:50%;
  margin:0 auto;
  margin-top:32px;
  text-align:center;
  font-size:125%;
  background-color:#0063be;
  color:#fff;
}
main.flow .flow_inner figure figcaption {
  text-align:center;
}
main.flow .flow_inner figure img {
  width:100%;
}
main.flow .flow_inner >figure {
  width:66.66%;
  margin:0 auto;
  text-align:center;
}
main.flow .flow_inner ul li {
  display:table-cell;
  box-sizing:border-box;
  width:33.33%;
  padding:8px;
}
main.flow .photos {
  text-align:center;
}
main.flow .photos img {
  box-sizing:border-box;
  width:30%;
  padding:0 4px;
}

/* @news */
main.news #s01 .page_inner {
  position:relative;
  overflow:hidden;
  height:auto;
  margin-top:64px;
}
main.news #s01 .posts {
  float:right;
  overflow:hidden;
  box-sizing:border-box;
  width:66.66%;
  padding:32px;
}
main.news #s01 .posts .head {
  overflow:hidden;
  box-sizing:border-box;
  padding:4px 8px;
  border-bottom:solid #0063be; 1px;
  color:#0063be;
}
main.news #s01 .posts .head .date {
  margin-right:8px;
  font-size:125%;
}
main.news #s01 .posts .head .title {
  font-size:125%;
}
main.news #s01 .posts .head .category {
  display:block;
  float:right;
  padding:0 16px;
  background-color:#0063be;
  color:#fff;
}
main.news #s01 .posts .body {
  padding:32px 16px;
  margin-bottom:48px;
}
main.news #s01 .posts .body img,
main.news #s01 .posts .body object {
  max-width:100%;
  margin-bottom:32px;
}
main.news #s01 .posts .body a {
  color:#0063be;
  text-decoration:underline;
}
main.news #s01 .posts .body a:hover {
  opacity:0.7;
}
main.news #s01 aside {
  position:absolute;
  top:0;
  left:0;
  box-sizing:border-box;
  width:33.33%;
  height:100%;
  padding:16px;
  text-align:center;
  background-color:#0063be;
  color:#fff;
}
main.news #s01 aside p.title {
  padding:8px 0;
  border-bottom:solid #fff 1px;
  font-family:"MatissePro-B";
  font-size:125%;
}
main.news #s01 aside ul {
  margin-bottom:48px;
}
main.news #s01 aside ul li a {
  display:block;
  padding:16px 0;
  color:#fff;
  transition:0.2s;
}
main.news #s01 aside ul li a:hover {
  background-color:#fff;
  color:#0063be;
  transition:0.2s;
}