/* *****************************
 *
 * Import file to Scss or Sass.
 *
 **************************** */
/*include*/
/* *****************************
 *
 * Import file to Scss or Sass.
 *
 **************************** */
/* Reset Stylesheet v1.6.1 | html5doctor.com | http://richclarkdesign.com */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

nav ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
html body {
  margin: 0;
}
html body article, html body aside, html body details, html body figcaption, html body figure, html body footer,
html body header, html body hgroup, html body main, html body menu, html body nav, html body section, html body summary {
  display: block;
}
html body audio, html body canvas, html body progress, html body video {
  display: inline-block;
  vertical-align: baseline;
}
html body audio:not([controls]) {
  display: none;
  height: 0;
}
html body [hidden], html body template {
  display: none;
}
html body a {
  background-color: transparent;
}
html body a:active, html body a:hover {
  outline: 0;
}
html body abbr[title] {
  border-bottom: 1px dotted;
}
html body b,
html body strong {
  font-weight: bold;
}
html body dfn {
  font-style: italic;
}
html body h1 {
  font-size: 2em;
}
html body mark {
  background: #ff0;
  color: #000;
}
html body small {
  font-size: 80%;
}
html body sub,
html body sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
html body sup {
  top: -0.5em;
}
html body sub {
  bottom: -0.25em;
}
html body img {
  border: 0;
}
html body svg:not(:root) {
  overflow: hidden;
}
html body figure {
  margin: 1em 40px;
}
html body hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}
html body pre {
  overflow: auto;
}
html body code, html body kbd, html body pre, html body samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
html body button, html body input, html body optgroup, html body select, html body textarea {
  color: inherit;
  /* 1 */
  font: inherit;
  /* 2 */
  margin: 0;
  /* 3 */
}
html body button {
  overflow: visible;
}
html body button,
html body select {
  text-transform: none;
}
html body button,
html body html input[type="button"],
html body input[type="reset"],
html body input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */
}
html body button[disabled], html body html input[disabled] {
  cursor: default;
}
html body button::-moz-focus-inner, html body input::-moz-focus-inner {
  border: 0;
  padding: 0;
}
html body input {
  line-height: normal;
}
html body input[type="checkbox"],
html body input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}
html body input[type="number"]::-webkit-inner-spin-button,
html body input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
html body input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  /* 2 */
  box-sizing: content-box;
}
html body input[type="search"]::-webkit-search-cancel-button,
html body input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
html body fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}
html body legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */
}
html body textarea {
  overflow: auto;
}
html body optgroup {
  font-weight: bold;
}
html body table {
  border-collapse: collapse;
  border-spacing: 0;
}
html body td,
html body th {
  padding: 0;
}

/* *****************************
 *
 * Import file to Scss or Sass.
 *
 **************************** */
/*--- value ---*/
/*--- mixin ---*/
/*--- keyframe ---*/
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*--- html ---*/
html, body {
  /*--- box ---*/
  width: 100%;
  height: 100vh;
  margin: 0;
  padding: 0px;
  position: relative;
  animation: fadeIn 2s ease-in-out 0s 1 normal;
  -webkit-animation: fadeIn 2s ease-in-out 0s 1 normal;
  /*--- other common parts ---*/
}
html a, body a {
  text-decoration: none;
  color: #333;
  transition: 0.33s;
}
html a:hover, body a:hover {
  opacity: 0.5;
}
html li, body li {
  list-style: none;
  transition: 0.33s;
}
html section, html div, html ul, html li, html table, html tr, html td, html th, body section, body div, body ul, body li, body table, body tr, body td, body th {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
html .center, body .center {
  text-align: center;
}
html .red, body .red {
  color: #333;
  font-weight: bold;
}
html div.img, body div.img {
  line-height: 0;
}
html img, body img {
  width: 100%;
  vertical-align: bottom;
}
html ul.row, body ul.row {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: stretch;
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  -webkit-justify-content: flex-start;
  -webkit-align-items: stretch;
}
html dl.tb, body dl.tb {
  display: table;
  width: 100%;
}
html dl.tb dt, html dl.tb dd, body dl.tb dt, body dl.tb dd {
  display: table-cell;
}
html .button, body .button {
  text-align: center;
  background-color: #999;
  color: #fff;
  display: block;
  padding: 21px 42px;
  margin: 0 auto;
  border: none;
  transition: 0.33s;
}
html div.allwrap, body div.allwrap {
  width: 100%;
  position: relative;
}
html div.guide, body div.guide {
  display: none;
  z-index: 10;
  overflow: hidden;
  position: fixed;
  width: 100%;
  height: 100vh;
  padding: 12px;
}
html div.guide ul, body div.guide ul {
  left: auto;
  font-size: 0;
  margin-right: 0;
  padding: 0;
  letter-spacing: none;
}
html div.guide ul li, body div.guide ul li {
  display: inline-block;
  width: calc( ( 100% - 231px) / 12 );
  height: 100vh;
  background-color: rgba(157, 143, 158, 0.3);
}
html div.guide ul li:not(:last-child), body div.guide ul li:not(:last-child) {
  margin-right: 21px;
}

/* *****************************
 *
 * Import file to Scss or Sass.
 *
 **************************** */
body.ki-as {
  /*--- font ---*/
  font-family: "DIN Next LT Pro",'Asap','YuGothic', sans-serif;
  color: #1B1F43;
  font-size: 12px;
  line-height: 1.75;
  letter-spacing: 0.12em;
  font-feature-settings: "palt";
}
body.ki-as .lv1 {
  font-size: 24px;
  line-height: 1.75;
  font-weight: normal;
}
body.ki-as .lv2 {
  font-size: 18px;
  line-height: 1.75;
  font-weight: normal;
}
body.ki-as .lv3 {
  font-size: 14.4px;
  line-height: 1.75;
  font-weight: normal;
}
body.ki-as .cap {
  font-size: 9px;
  line-height: 1.75;
  font-weight: normal;
}
body.ki-as .show_pc, body.ki-as .show_tb, body.ki-as .show_sp {
  display: none;
}
@media screen and (min-width: 742px) {
  body.ki-as .show_pc, body.ki-as .show_tb {
    display: block;
  }
}
@media screen and (max-width: 741px) {
  body.ki-as .show_sp {
    display: block;
  }
}
body.ki-as .show {
  display: none;
}
body.ki-as div.allwrap .f {
  padding: 12px;
}
body.ki-as div.allwrap .wrap1 {
  width: 83%;
  width: calc( ( calc( ( 100% - 231px) / 12 ) + 21px ) * 10 - 21px );
  margin: 0 auto;
}
@media screen and (min-width: 742px) {
  body.ki-as div.allwrap .wrap1 {
    max-width: 768px;
  }
}
@media screen and (max-width: 741px) {
  body.ki-as div.allwrap .wrap1 {
    width: 90%;
  }
}
body.ki-as div.allwrap .wrap2 {
  width: 69%;
  width: calc( ( calc( ( 100% - 231px) / 12 ) + 21px ) * 8 - 21px );
  margin: 0 auto;
}
@media screen and (min-width: 742px) {
  body.ki-as div.allwrap .wrap2 {
    max-width: 600px;
  }
}
@media screen and (max-width: 741px) {
  body.ki-as div.allwrap .wrap2 {
    width: 75%;
  }
}
body.ki-as div.allwrap header nav ul.main {
  z-index: 100;
  position: fixed;
  top: 12px;
  right: 12px;
}
body.ki-as div.allwrap header nav ul.main li {
  margin-left: 42px;
}
body.ki-as div.allwrap header nav ul.main li:first-child {
  margin-left: 0;
}
body.ki-as div.allwrap header p.copy {
  position: fixed;
  left: 12px;
  bottom: 12px;
  color: #CCC5CD;
}
body.ki-as div.allwrap footer {
  background-color: #1B1F43;
  overflow: hidden;
  clear: both;
  z-index: 100;
  color: #705F77;
  padding: 21px 0;
}
body.ki-as div.allwrap footer div {
  width: 100%;
}
body.ki-as div.allwrap footer div ul {
  width: 50%;
  float: left;
}
body.ki-as div.allwrap footer div ul li {
  width: 18px;
  height: 18px;
  margin-right: 21px;
}
body.ki-as div.allwrap footer div ul li a {
  width: 100%;
}
body.ki-as div.allwrap footer div ul li a img {
  height: 100%;
}
body.ki-as div.allwrap footer div p.copy {
  width: 50%;
  float: right;
  text-align: right;
  color: #aaa;
}
body.ki-as div.allwrap nav.sub {
  position: absolute;
  z-index: 100;
}
body.ki-as div.allwrap nav.sub ul {
  position: fixed;
  top: calc(12px * 2.5);
  right: 12px;
}
body.ki-as div.allwrap nav.sub ul li {
  margin-left: 42px;
  opacity: 0.7;
}
body.ki-as div.allwrap div.contents {
  position: relative;
  z-index: 1;
  padding-top: 42px;
}
body.ki-as div.allwrap div.contents .lv1 {
  font-size: 16.8px;
  line-height: 1.75;
  margin-top: 42px;
  text-align: center;
}
body.ki-as div.allwrap div.contents .lv1 span {
  display: block;
  font-size: 13.2px;
  line-height: 1.75;
  color: #9D8F9E;
  font-weight: normal;
}
body.ki-as div.allwrap div.contents ul.inspire li {
  width: 30%;
  margin-bottom: 42px;
}
body.ki-as div.allwrap div.contents ul.inspire li:not(:nth-child(3n)) {
  margin-right: 5%;
}
body.ki-as div.allwrap div.contents ul.inspire li div.img {
  width: 100%;
  background-size: cover;
  background-position: center;
  border: 1px #CCC5CD dotted;
}
body.ki-as div.allwrap div.contents ul.inspire li div.img:before {
  content: "";
  display: block;
  padding-top: 66.666%;
}
body.ki-as div.allwrap div.contents ul.inspire li div.ttl {
  margin-top: 12px;
}
body.ki-as div.allwrap div.contents div.tasklist {
  width: 100%;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj {
  width: 100%;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj div.head {
  width: 100%;
  background-color: #1B1F43;
  color: #eee;
  padding: 42px 21px;
  display: table;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj div.head h2 {
  display: table-cell;
  width: 50%;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj div.head h2 span {
  display: block;
  font-size: 9.6px;
  line-height: 1.75;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj div.head div {
  display: table-cell;
  width: 25%;
  text-align: center;
  vertical-align: middle;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj div.head div a {
  width: 100%;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj div.head div a img {
  height: 40px;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj div.phase {
  border: 1px solid #CCC5CD;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj div.phase ul.row {
  margin-bottom: 0;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj div.phase ul.row li {
  box-sizing: border-box;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj div.phase ul.row li:nth-child(1) {
  width: 40%;
  vertical-align: middle;
  text-align: center;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj div.phase ul.row li:nth-child(2) {
  width: 60%;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj div.phase ul.row li dl {
  width: 100%;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj div.phase ul.row li dl dd {
  width: 33.333%;
  box-sizing: border-box;
  padding: 21px;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj div.phase ul.row li dl dd h4 {
  text-align: center;
}
body.ki-as div.allwrap div.contents div.tasklist div.pj div.phase ul.row li dl dd img {
  display: block;
  width: 50%;
  margin: 0 auto;
}
body.ki-as div.allwrap div.contents div.taskform {
  padding: calc( ( calc( ( 100% - 231px) / 12 ) + 21px ) * 1) calc( ( calc( ( 100% - 231px) / 12 ) + 21px ) * 2);
}
body.ki-as div.allwrap div.contents div.taskform dl.tb {
  border-top: #9D8F9E 1px solid;
}
body.ki-as div.allwrap div.contents div.taskform dl.tb:last-child {
  border-bottom: #9D8F9E 1px solid;
}
body.ki-as div.allwrap div.contents div.taskform dl.tb dt {
  width: 30%;
  margin-right: 21px;
  background-color: #CCC5CD;
  padding: 42px 21px;
}
body.ki-as div.allwrap div.contents div.taskform dl.tb dd {
  width: 70%;
  padding: 42px 21px;
}
body.ki-as div.allwrap div.contents div.taskform dl.tb dd div {
  margin-bottom: 42px;
}
body.ki-as div.allwrap div.contents div.taskform dl.tb dd div select {
  padding: 21px 42px;
}
body.ki-as div.allwrap div.contents div.taskform dl.tb dd div input[type="radio"] + div {
  display: none;
}
body.ki-as div.allwrap div.contents div.taskform dl.tb dd div input[type="radio"]:checked + div {
  display: block;
}
body.ki-as div.allwrap div.contents div.taskform dl.tb dd div input[type="text"] {
  width: 100%;
  padding: 12px;
}
body.ki-as div.allwrap div.contents form.inspire {
  padding: calc( ( calc( ( 100% - 231px) / 12 ) + 21px ) * 1) calc( ( calc( ( 100% - 231px) / 12 ) + 21px ) * 2);
}
body.ki-as div.allwrap div.contents form.inspire dl {
  padding: 21px 0;
  vertical-align: top;
}
body.ki-as div.allwrap div.contents form.inspire dl dt {
  width: 30%;
  vertical-align: top;
}
body.ki-as div.allwrap div.contents form.inspire dl dt h4 {
  line-height: 48px;
}
body.ki-as div.allwrap div.contents form.inspire dl dt h4 span.red {
  color: #B50C69;
}
body.ki-as div.allwrap div.contents form.inspire dl dd {
  width: 70%;
  vertical-align: top;
}
body.ki-as div.allwrap div.contents form.inspire dl dd input[type="url"], body.ki-as div.allwrap div.contents form.inspire dl dd textarea {
  width: 100%;
  background-color: #CCC5CD;
  border: none;
  line-height: 24px;
  padding: 12px;
  border-radius: 2px;
  box-sizing: border-box;
}
body.ki-as div.allwrap div.contents form.inspire dl dd textarea {
  resize: vertical;
}
body.ki-as div.allwrap div.contents form.inspire dl dd div.radiolist {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  -webkit-justify-content: flex-start;
  -webkit-align-items: flex-start;
}
body.ki-as div.allwrap div.contents form.inspire dl dd div.radiolist input[type="radio"] {
  display: none;
}
body.ki-as div.allwrap div.contents form.inspire dl dd div.radiolist label {
  box-sizing: border-box;
  text-align: center;
  width: 30%;
  transition: .2s;
  cursor: pointer;
  display: block;
  position: relative;
  padding: 10px;
  background-color: #CCC5CD;
  border-radius: 2px;
  margin-bottom: 5%;
}
body.ki-as div.allwrap div.contents form.inspire dl dd div.radiolist label:not(:nth-child(3n)) {
  margin-right: 5%;
}
body.ki-as div.allwrap div.contents form.inspire dl dd div.radiolist input[type="radio"]:checked + label {
  background-color: #705F77;
  color: #fff;
}
body.ki-as div.allwrap div.contents form.inspire dl dd input[type="file"] {
  display: none;
}
body.ki-as div.allwrap div.contents form.inspire dl dd label {
  text-align: center;
  transition: .2s;
  cursor: pointer;
  display: block;
  position: relative;
  padding: 10px;
  background-color: #fff;
  border-radius: 2px;
  box-shadow: 0px 2px 8px 0px #cecece;
  -moz-box-shadow: 0px 2px 8px 0px #cecece;
  -webkit-box-shadow: 0px 2px 8px 0px #cecece;
}
body.ki-as div.allwrap div.contents form.inspire div#msg {
  margin-top: 20px;
}
body.ki-as div.allwrap div.contents form.inspire div.submit {
  margin: 42px auto;
  text-align: center;
  cursor: pointer;
}
body.ki-as div.allwrap div.contents form.inspire div.submit input[type="submit"] {
  cursor: pointer;
  width: 40%;
  border: none;
  background-color: #705F77;
  color: #fff;
  padding: 20px;
  border-radius: 2px;
}
body.ki-as div.allwrap div.contents.top ul.main li {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: stretch;
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  -webkit-justify-content: flex-start;
  -webkit-align-items: stretch;
  align-items: center;
  -webkit-align-items: center;
  margin-bottom: 63px;
}
@media screen and (min-width: 742px) {
  body.ki-as div.allwrap div.contents.top ul.main li div.img {
    width: 66.666%;
    width: calc( ( calc( ( 100% - 231px) / 12 ) + 21px ) * 8 - 21px );
  }
}
@media screen and (max-width: 741px) {
  body.ki-as div.allwrap div.contents.top ul.main li div.img {
    width: 100%;
  }
}
body.ki-as div.allwrap div.contents.top ul.main li p {
  box-sizing: border-box;
  font-weight: bold;
  font-size: 16.8px;
  line-height: 1.75;
}
@media screen and (min-width: 742px) {
  body.ki-as div.allwrap div.contents.top ul.main li p {
    width: 33.333%;
    width: calc( ( calc( ( 100% - 231px) / 12 ) + 21px ) * 4 - 21px );
  }
}
@media screen and (max-width: 741px) {
  body.ki-as div.allwrap div.contents.top ul.main li p {
    width: 100%;
    padding: 21px;
  }
}
@media screen and (min-width: 742px) {
  body.ki-as div.allwrap div.contents.top ul.main li p .show {
    display: block;
  }
}
body.ki-as div.allwrap div.contents.top ul.main li p span.cap {
  display: block;
  color: #9D8F9E;
  letter-spacing: 0.1em;
  margin-top: 12px;
}
@media screen and (max-width: 741px) {
  body.ki-as div.allwrap div.contents.top ul.main li p span.cap {
    margin-bottom: 0;
  }
}
body.ki-as div.allwrap div.contents.top ul.main li p span.cap span.tag a {
  color: #9D8F9E;
}
body.ki-as div.allwrap div.contents.top ul.main li p a.toarticle {
  display: block;
  font-family: "Times New Roman", "YuMincho",serif;
  border: 1px #9D8F9E solid;
  font-weight: normal;
  font-size: 0.75em;
  padding: 12px 21px;
  text-align: center;
  margin-top: 21px;
  color: #705F77;
}
body.ki-as div.allwrap div.contents.top ul.main li p a.toarticle:hover {
  background-color: #705F77;
  color: #fff;
}
body.ki-as div.allwrap div.contents.top ul.main li:nth-child(2n-1) p {
  padding-left: 21px;
  padding-right: 8.3%;
}
body.ki-as div.allwrap div.contents.top ul.main li:nth-child(2n) p {
  padding-right: 21px;
  padding-left: 8.3%;
}
@media screen and (max-width: 741px) {
  body.ki-as div.allwrap div.contents.top ul.main li:nth-child(2n) {
    flex-direction: column-reverse;
    -webkit-flex-direction: column-reverse;
  }
}
body.ki-as div.allwrap div.contents.top div.archive {
  padding-top: 84px;
  padding-bottom: 84px;
  background-color: #eee;
}
body.ki-as div.allwrap div.contents.top div.archive h3 {
  font-size: 15.6px;
  line-height: 1.75;
  text-align: center;
  margin-bottom: 42px;
}
body.ki-as div.allwrap div.contents.top div.archive ul {
  width: 90%;
  margin: 0 auto;
}
@media screen and (min-width: 742px) {
  body.ki-as div.allwrap div.contents.top div.archive ul li {
    width: 33.333%;
  }
}
@media only screen and (max-width: 741px) {
  body.ki-as div.allwrap div.contents.top div.archive ul li {
    width: 50%;
  }
}
body.ki-as div.allwrap div.contents.top div.archive ul li p {
  font-weight: bold;
}
body.ki-as div.allwrap div.contents.top div.archive ul li p span.cap {
  display: block;
  color: #705F77;
  font-size: 0.75em;
  color: #705F77;
  letter-spacing: 0.1em;
  margin-top: 12px;
}
body.ki-as div.allwrap div.contents.blog {
  width: 100%;
}
body.ki-as div.allwrap div.contents.blog div.main {
  width: 100%;
  position: relative;
}
body.ki-as div.allwrap div.contents.blog div.main div.img {
  width: 100%;
  background-size: cover;
  background-position: center;
}
body.ki-as div.allwrap div.contents.blog div.main div.img:before {
  content: "";
  display: block;
}
@media screen and (max-width: 741px) {
  body.ki-as div.allwrap div.contents.blog div.main div.img:before {
    padding-top: 100%;
  }
}
@media screen and (min-width: 742px) {
  body.ki-as div.allwrap div.contents.blog div.main div.img:before {
    padding-top: 40%;
  }
}
body.ki-as div.allwrap div.contents.blog div.main div.ttl {
  position: absolute;
}
@media screen and (max-width: 741px) {
  body.ki-as div.allwrap div.contents.blog div.main div.ttl {
    bottom: 42px;
    right: 42px;
  }
}
@media screen and (min-width: 742px) {
  body.ki-as div.allwrap div.contents.blog div.main div.ttl {
    bottom: 42px;
    right: 63px;
  }
}
body.ki-as div.allwrap div.contents.blog div.main div.ttl p.cap {
  display: block;
  color: #fff;
  font-size: 9px;
  line-height: 1.75;
  letter-spacing: 0.3em;
  margin-bottom: 12px;
}
body.ki-as div.allwrap div.contents.blog div.main div.ttl p.cap span span.tag a {
  color: #fff;
}
body.ki-as div.allwrap div.contents.blog div.main div.ttl p {
  font-family: "DIN Next LT Pro", 'YuGothic', sans-serif;
  color: #fff;
  font-weight: bold;
  text-align: right;
}
body.ki-as div.allwrap div.contents.blog div.main div.ttl p .show {
  display: block;
}
@media screen and (max-width: 741px) {
  body.ki-as div.allwrap div.contents.blog div.main div.ttl p {
    font-size: 18px;
    line-height: 1.75;
  }
}
@media screen and (min-width: 742px) {
  body.ki-as div.allwrap div.contents.blog div.main div.ttl p {
    font-size: 24px;
    line-height: 1.75;
  }
}
body.ki-as div.allwrap div.contents.blog article {
  margin: 63px auto;
  margin-top: -12px;
}
@media screen and (max-width: 741px) {
  body.ki-as div.allwrap div.contents.blog article p {
    margin: 42px auto;
  }
  body.ki-as div.allwrap div.contents.blog article img {
    margin: 12px auto;
  }
  body.ki-as div.allwrap div.contents.blog article h3 + p {
    margin-top: 0;
  }
}
@media screen and (min-width: 742px) {
  body.ki-as div.allwrap div.contents.blog article p {
    margin: 63px auto;
  }
  body.ki-as div.allwrap div.contents.blog article img {
    margin: 21px auto;
  }
  body.ki-as div.allwrap div.contents.blog article h3 + p {
    margin-top: 12px;
  }
}
body.ki-as div.allwrap div.contents.blog article h2 {
  margin-top: 63px;
  font-size: 19.2px;
  line-height: 1.75;
}
body.ki-as div.allwrap div.contents.blog article h2 .show {
  display: block;
}
body.ki-as div.allwrap div.contents.blog article h2 span.cap {
  display: block;
  font-size: 9.6px;
  line-height: 1.75;
  color: #705F77;
  margin-bottom: 0;
}
body.ki-as div.allwrap div.contents.blog article h2 span.cap span.date {
  color: #705F77;
}
body.ki-as div.allwrap div.contents.blog div.relation {
  z-index: 80;
  padding-top: 84px;
  padding-bottom: 84px;
  background-color: #eee;
}
body.ki-as div.allwrap div.contents.blog div.relation h3 {
  font-size: 15.6px;
  line-height: 1.75;
  text-align: center;
  margin-bottom: 42px;
}
@media screen and (max-width: 741px) {
  body.ki-as div.allwrap div.contents.blog div.relation ul li {
    width: 47.5%;
  }
  body.ki-as div.allwrap div.contents.blog div.relation ul li:not(:nth-child(2n)) {
    margin-right: 5%;
  }
  body.ki-as div.allwrap div.contents.blog div.relation ul li:nth-child(3) {
    display: none;
  }
}
@media screen and (min-width: 742px) {
  body.ki-as div.allwrap div.contents.blog div.relation ul li {
    width: 30%;
  }
  body.ki-as div.allwrap div.contents.blog div.relation ul li:not(:nth-child(3n)) {
    margin-right: 5%;
  }
}
body.ki-as div.allwrap div.contents.blog div.relation ul li a h4 {
  margin-top: 5px;
  font-size: 9.6px;
  line-height: 1.75;
}
body.ki-as div.allwrap div.contents.blog div.relation ul li a h4 span.cap {
  display: block;
  color: #705F77;
}
body.ki-as div.allwrap div.contents.about div.main {
  width: 100%;
  position: relative;
}
body.ki-as div.allwrap div.contents.about div.main div.img {
  width: 100%;
  background-size: cover;
  background-position: center;
}
body.ki-as div.allwrap div.contents.about div.main div.img:before {
  content: "";
  display: block;
  padding-top: 40%;
}
body.ki-as div.allwrap div.contents.about div.main div.ttl {
  position: absolute;
  bottom: 42px;
  right: 63px;
}
@media screen and (max-width: 741px) {
  body.ki-as div.allwrap div.contents.about div.main div.ttl {
    bottom: 42px;
    right: 42px;
  }
}
body.ki-as div.allwrap div.contents.about div.main div.ttl p {
  font-size: 24px;
  font-family: "DIN Next LT Pro", 'YuGothic', sans-serif;
  color: #fff;
  text-align: right;
  font-weight: bold;
}
@media screen and (max-width: 741px) {
  body.ki-as div.allwrap div.contents.about div.main div.ttl p {
    font-size: 1.5em;
    line-height: 1.5em;
  }
}
body.ki-as div.allwrap div.contents.about div.main div.ttl p.cap {
  display: block;
  font-family: "DIN Next LT Pro", 'YuGothic', sans-serif;
  color: #fff;
  font-size: calc(12px* 0.75);
  letter-spacing: 0.3em;
  margin-bottom: 12px;
}
body.ki-as div.allwrap div.contents.about div.main div.ttl p.cap a {
  color: #fff;
}
body.ki-as div.allwrap div.contents.about div.name, body.ki-as div.allwrap div.contents.about div.desc {
  width: calc( ( calc( ( 100% - 231px) / 12 ) + 21px ) * 7 - 21px );
  margin: 42px auto;
}
@media screen and (max-width: 741px) {
  body.ki-as div.allwrap div.contents.about div.name, body.ki-as div.allwrap div.contents.about div.desc {
    width: calc( ( calc( ( 100% - 231px) / 12 ) + 21px ) * 10 - 21px );
  }
}
body.ki-as div.allwrap div.contents.about div.name h2, body.ki-as div.allwrap div.contents.about div.desc h2 {
  font-size: 18px;
  line-height: 1.75;
}
body.ki-as div.allwrap div.contents.about div.name h3, body.ki-as div.allwrap div.contents.about div.desc h3 {
  color: #9D8F9E;
}
body.ki-as div.allwrap div.contents.about div.history {
  margin-right: 42px;
  width: calc( ( calc( ( 100% - 231px) / 12 ) + 21px ) * 7 - 21px );
  margin: 0 auto;
}
@media screen and (max-width: 741px) {
  body.ki-as div.allwrap div.contents.about div.history {
    width: calc( ( calc( ( 100% - 231px) / 12 ) + 21px ) * 10 - 21px );
  }
}
body.ki-as div.allwrap div.contents.about div.history p {
  margin-bottom: 42px;
}
body.ki-as div.allwrap div.contents.about div.history dl {
  display: table;
  width: 100%;
  margin-bottom: 12px;
}
body.ki-as div.allwrap div.contents.about div.history dl dd, body.ki-as div.allwrap div.contents.about div.history dl dt {
  display: table-cell;
}
body.ki-as div.allwrap div.contents.about div.history dl dt {
  width: 20%;
}
body.ki-as div.allwrap div.contents.about div.history dl dd {
  width: 80%;
}
body.ki-as div.allwrap div.contents.about div.history dl dd span.jp {
  display: block;
  color: #9D8F9E;
  font-size: 9.6px;
  line-height: 1.75;
}

/* *****************************
 *
 * Import file to Scss or Sass.
 *
 **************************** */
/*--- html ---*/
html body.works div.allwrap {
  width: 80%;
  margin: 60px auto;
}
html body.works div.allwrap div.ttl {
  margin-bottom: 42px;
}
html body.works div.allwrap ul.image li {
  width: 30%;
  height: 300px;
  margin-bottom: 12px;
  overflow: hidden;
}
html body.works div.allwrap ul.image li:not(:nth-child(3n)) {
  margin-right: 5%;
}
html body.works div.allwrap ul.image li a {
  width: 100%;
  height: 100%;
  display: block;
}
