@charset "UTF-8";

/*------------------------------------------------------------------------------
  bottom-common
------------------------------------------------------------------------------*/
/* ttl */
.ttl-style01 {
  margin-bottom: 40px;
}

.ttl-style01 .small {
  display: block;
  font-size : 13px;
  letter-spacing : 2px;
}

.ttl-style02 {
  border-bottom: 1px solid #231815;
  font-family: 'mplus-2p-bold';
  font-size: 20px;
  margin: 65px 0 20px;
}

.ttl-style01 + .ttl-style02 {
  margin-top: 0;
}

.ttl-style03 {
  margin-bottom: 15px;
  text-align: center;
}

.ttl-style03 .small {
  display: block;
  font-family: 'mplus-2p-regular';
  font-size: 13px;
  letter-spacing: 2px;
}

/* kv-style01 */
.kv-style01 {
  background: #696E71;
}

.kv-style01 .inner-block {
  background: no-repeat right top;
  background-size: auto 100%;
  padding: 50px 10px;
}

.top .kv-style01 .inner-block { background-image: url(../../img/top/product-ttl-img.jpg); }
.about .kv-style01 .inner-block { background-image: url(../../img/about/kv-2.jpg); }
.contact .kv-style01 .inner-block { background-image: url(../../img/contact/kv-2.jpg); }

/* kv-style02 */
.kv-style02 {
  background: rgba(56, 65, 93, 1);
  background: -moz-linear-gradient(50% 0% -90deg,rgba(91, 99, 122, 1) 0%,rgba(56, 65, 93, 1) 100%);
  background: -webkit-linear-gradient(-90deg, rgba(91, 99, 122, 1) 0%, rgba(56, 65, 93, 1) 100%);
  background: -webkit-gradient(linear,50% 0% ,50% 100% ,color-stop(0,rgba(91, 99, 122, 1) ),color-stop(1,rgba(56, 65, 93, 1) ));
  background: -o-linear-gradient(-90deg, rgba(91, 99, 122, 1) 0%, rgba(56, 65, 93, 1) 100%);
  background: -ms-linear-gradient(-90deg, rgba(91, 99, 122, 1) 0%, rgba(56, 65, 93, 1) 100%);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#5B637A', endColorstr='#38415D' ,GradientType=0)";
  background: linear-gradient(180deg, rgba(91, 99, 122, 1) 0%, rgba(56, 65, 93, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5B637A',endColorstr='#38415D' , GradientType=0);
}

@media (min-width: 1000px) {
  .kv-style02 .img-box {
    min-height: 250px;
  }
}

@media (min-width: 641px) {
  .kv-style02 .img-box {
    float: left;
    width: 66%;
  }

  .kv-style02 .ttl {
    box-sizing: border-box;
    float: right;
    padding-left: 15px;
    position: relative;
    width: 34%;
  }

  .kv-style02 .ttl .style {
    position: absolute;
    left: 15px;
    bottom: 10px;
  }
}

.kv-style02 {
  margin-bottom: 40px;
}

.kv-style02 .ttl span {
  display: block;
  line-height: 1;
}

.kv-style02 .ttl .main {
  padding-top: 30%;
}

/* btn */
.btn-style01 a {
  background: url(../img/arrow-right.svg) no-repeat 20px center #CA1E23;
  background-size: 25px 20px;
  box-sizing: border-box;
  color: #fff;
  display: inline-block;
  font-size: 20px;
  font-family: 'mplus-2p-bold';
  line-height: 54px;
  text-align: center;
  text-indent: 10px;
  width: 250px;
}

/*------------------------------------------------------------------------------
  top
------------------------------------------------------------------------------*/

/* mv */
.slides li:not(:first-child) {
  display: none;
}

.top #mv {
  position: relative;
}

.top #mv img {
  height: auto;
  width: 100%;
}

.top #mv .slider-fade {
  -webkit-animation: splashAfter 1s forwards;
  animation: splashAfter 1s forwards;
  -webkit-animation-delay: 9s;
  animation-delay: 9s;
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.splash .letter path {
  fill: #00316d;
  fill-rule: evenodd;
}

.splash .letter-all path {
  fill: #152041;
  fill-rule: evenodd;
  opacity: 0.85;
}

.top #mv .splash {
  -webkit-animation: splash 1s forwards;
  animation: splash 1s forwards;
  -webkit-animation-delay: 9s;
  animation-delay: 9s;
  overflow: hidden;
  position: relative;
}

.top #mv .splash .bg {
  -webkit-animation: fadeIn 0.2s forwards;
  animation: fadeIn 0.2s forwards;
  overflow: hidden;
  position: relative;
}

.top #mv .splash .bg:after {
  -webkit-animation: bgMove 10s ease-in-out forwards;
  animation: bgMove 10s ease-in-out forwards;
  background: url(../../img/mv/bg.jpg) no-repeat center center;
  background-size: cover;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.top #mv .splash .letter-all {
  position: absolute;
  top: 0;
  left: 0;
  height: auto;
  width: 100%;
}

.top #mv .splash .letter-all path {
  -webkit-animation: letterAll 10s forwards;
  animation: letterAll 10s forwards;
  fill: transparent;
}

.top #mv .splash .letter {
  -webkit-animation: letterCreate 4s forwards;
  animation: letterCreate 4s forwards;
  -webkit-transform: scale(0.5,0.5) translateY(-1000%) rotateZ(-90deg);
  transform: scale(0.5,0.5) translateY(-1000%) rotateZ(-90deg);
  position: absolute;
  height: 31%;
  opacity: 0;
}

.top #mv .splash #letter7,
.top #mv .splash #letter8,
.top #mv .splash #letter9,
.top #mv .splash #letter10,
.top #mv .splash #letter11,
.top #mv .splash #letter12,
.top #mv .splash #letter13 {
  -webkit-animation: letterFuture 2s forwards;
  animation: letterFuture 2s forwards;
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s;
  -webkit-transform: scale(0.2,0.2);
  transform: scale(0.2,0.2);
}

.top #mv .splash .letter path {
  -webkit-animation: stroke 4s forwards;
  animation: stroke 4s forwards;
  fill: transparent;
}

@-webkit-keyframes splash {
  to { opacity: 0; }
}

@keyframes splash {
  to { opacity: 0; }
}

@-webkit-keyframes splashAfter {
  to { opacity: 1; }
}

@keyframes splashAfter {
  to { opacity: 1; }
}

@-webkit-keyframes bgMove {
  0% {
    -webkit-transform: scale(1.1,1.1) translate(-3%,-3%);
  }
  100% {
    -webkit-transform: scale(1.1,1.1) translate(3%,3%);
  }
}

@keyframes bgMove {
  0% {
    transform: scale(1.1,1.1) translate(-3%,-3%);
  }
  100% {
    transform: scale(1.1,1.1) translate(3%,3%);
  }
}

@-webkit-keyframes letterAll {
  35% { fill: transparent; }
  50% { fill: #fbbe42; }
  70% { fill: #f1714f; }
  90% { fill: #fbf246; }
  100% { fill: #152041; }
}

@keyframes letterAll {
  35% { fill: transparent; }
  50% { fill: #fbbe42; }
  70% { fill: #f1714f; }
  90% { fill: #fbf246; }
  100% { fill: #152041; }
}

@-webkit-keyframes letterCreate {
  0% {
    opacity: 0;
  }
  10% {
    -webkit-animation-timing-function: cubic-bezier(0,1.34,.36,.97);
    opacity: 0;
    -webkit-transform: scale(0.5,0.5) translateY(-1000%) rotateZ(-10deg);
  }
  20% {
    opacity: 1;
    -webkit-transform: scale(1,1) translate(0,0) rotateZ(3deg);
  }
  25%,100% {
    opacity: 1;
    -webkit-transform: scale(1,1) translate(0,0) rotateZ(0);
  }
}

@keyframes letterCreate {
  0% {
    opacity: 0;
  }
  10% {
    animation-timing-function: cubic-bezier(0,1.34,.36,.97);
    opacity: 0;
    transform: scale(0.5,0.5) translateY(-1000%) rotateZ(-10deg);
  }
  20% {
    opacity: 1;
    transform: scale(1,1) translate(0,0) rotateZ(3deg);
  }
  25%,100% {
    opacity: 1;
    transform: scale(1,1) translate(0,0) rotateZ(0);
  }
}

@-webkit-keyframes letterFuture {
  0% {
    -webkit-animation-timing-function: cubic-bezier(0,.8,.5,1.5);
    opacity: 0;
  }
  50% {
    opacity: 1;
    -webkit-transform: scale(1,1) translate(0,0) rotateZ(0);
  }
  55%,100% {
    opacity: 1;
    -webkit-transform: scale(1,1) translate(0,0) rotateZ(0);
  }
}

@keyframes letterFuture {
  0% {
    animation-timing-function: cubic-bezier(0,.8,.5,1.5);
    opacity: 0;
  }
  50% {
    opacity: 1;
    transform: scale(1,1) translate(0,0) rotateZ(0);
  }
  55%,100% {
    opacity: 1;
    transform: scale(1,1) translate(0,0) rotateZ(0);
  }
}

@-webkit-keyframes stroke {
  60% { fill: #00316d; }
  70% { fill: #00bcd4; }
  80% { fill: #00316d; }
  100% { fill: transparent; }
}

@keyframes stroke {
  60% { fill: #00316d; }
  70% { fill: #00bcd4; }
  80% { fill: #00316d; }
  100% { fill: transparent; }
}

.top #mv .splash #letter1 {
  top: 10.3%;
  left: 10%;
  width: 13%;
}

.top #mv .splash #letter2 {
  top: 10.3%;
  left: 24.5%;
  width: 13%;
}

.top #mv .splash #letter3 {
  top: 10.3%;
  left: 37.5%;
  width: 13%;
}

.top #mv .splash #letter4 {
  top: 10.3%;
  left: 50.3%;
  width: 15.3%;
}

.top #mv .splash #letter5 {
  top: 10.4%;
  left: 64.3%;
  width: 15.3%;
}

.top #mv .splash #letter6 {
  top: 10.1%;
  left: 79.5%;
  width: 10.5%;
}

.top #mv .splash #letter7 {
  top: 36%;
  left: 10%;
  width: 16%;
}

.top #mv .splash #letter8 {
  top: 61.5%;
  left: 9.6%;
  width: 10.5%;
  height: 30%;
}

.top #mv .splash #letter9 {
  top: 59.3%;
  left: 21.6%;
  width: 12.8%;
  height: 35%;
}

.top #mv .splash #letter10 {
  top: 61.5%;
  left: 35.8%;
  width: 12.8%;
}

.top #mv .splash #letter11 {
  top: 59.3%;
  left: 50.2%;
  width: 12.8%;
  height: 35%;
}

.top #mv .splash #letter12 {
  top: 61%;
  left: 65.5%;
  width: 12%;
}

.top #mv .splash #letter13 {
  top: 61%;
  left: 79.5%;
  width: 10.5%;
}

.top #mv .splash #letter1,
.top #mv .splash #letter3 {
  -webkit-animation-delay: 0.1s;
  animation-delay: 0.1s;
}

.top #mv .splash #letter4 {
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}

.top #mv .splash #letter2,
.top #mv .splash #letter5 {
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
}

.top #mv .splash #letter6 {
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.6s;
}

/* top-lead */
.top-lead .ttl {
  margin: 50px 0 -110px -70px;
  position: relative;
  z-index: 1;
}

.top-lead .slider-slide {
  padding-bottom: 20px;
  position: relative;
}

.top-lead .slider-slide img {
  height: auto;
  width: 100%;
}

.top-lead .flex-control-nav {
  line-height: 1;
  position: absolute;
  bottom: 0;
  right: 0;
  margin: 0;
  padding: 0;
}

.top-lead .flex-control-nav li {
  display: inline-block;
}

.top-lead .flex-control-nav li + li {
  margin-left: 3px;
}

.top-lead .flex-control-nav li a {
  background: #c9cacb;
  display: block;
  text-indent: -9999px;
  width: 9px;
  height: 9px;
}

.top-lead .flex-control-nav li .flex-active {
  background: #231815;
}

.top-lead .flex-nav-prev,
.top-lead .flex-nav-next {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.top-lead .flex-nav-prev a,
.top-lead .flex-nav-next a {
  background: no-repeat center center;
  display: block;
  text-indent: -9999px;
  width: 45px;
  height: 45px;
}

.top-lead .flex-nav-prev { left: -75px; }
.top-lead .flex-nav-next { right: -75px; }

.top-lead .flex-nav-prev a { background-image: url(../img/slider-prev.png); }
.top-lead .flex-nav-next a { background-image: url(../img/slider-next.png); }

@media (max-width: 1170px) {
  .top-lead .ttl {
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
    margin: 50px 0 -110px 0;
  }

  .top-lead .flex-nav-prev,
  .top-lead .flex-nav-next {
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
  }

  .top-lead .flex-nav-prev { left: 30px; }
  .top-lead .flex-nav-next { right: 30px; }
}

/* top-news */
.top-news {
  margin: 40px 0 70px;
}

@media (min-width: 641px) {
  .top-news .outer {
    display: table;
    box-sizing: border-box;
    width: 100%;
  }

  .top-news .ttl,
  .top-news .news-div {
    display: table-cell;
    vertical-align: top;
  }

  .top-news .ttl {
    padding-right: 2%;
    width: 28%;
  }

  .top-news .news-div {
    width: 70%;
  }
}

.top-news .outer {
  border: 4px solid #b5b5b6;
  padding: 40px 30px;
}

.top-news .news-ul {
  height: 180px;
  overflow: auto;
}

.news-ul {
  line-height: 1.5;
}

.news-ul li + li {
  margin-top: 25px;
}

.news-ul li .text {
  display: block;
}

/* top-gallery */
.top-gallery {
  background: #696E71;
}

.top-gallery .txt-box {
  color: #fff;
  padding: 40px 0;
  position: relative;
}

.top-gallery .txt-box .ttl {
  padding-bottom: 30px;
}

.top-gallery .txt-box .txt {
  font-family : 'mplus-2p-medium';
  font-size : 17px;
  line-height : 1.5;
  letter-spacing : 1px;
  margin-bottom: 30px;
}

@media (min-width: 880px) {
  .top-gallery .txt-box .btn {
    position: absolute;
    bottom: 40px;
    left: 0;
  }
}

.top-gallery .txt-box .btn a {
  background : #231815;
  display: block;
  line-height: 1;
  padding: 10px 0;
  text-align: center;
  width: 195px;
}

.top-gallery .txt-box .btn a img {
  height: 18px;
  width: auto;
}

@media (min-width: 641px) {
  .top-gallery .txt-box {
    float: left;
    width: 53%;
  }
  .top-gallery .img-box {
    float: right;
    text-align: right;
    width: 45%;
  }
}

/* top-action */
.top-action {
  margin: 70px 0 80px;
}

.top-action .ttl {
  margin-bottom: 40px;
}

.top-action li {
  background: no-repeat center center;
  background-size: cover;
  box-sizing: border-box;
  color: #fff;
  float: left;
  font-family : 'mplus-2p-medium';
  font-size : 18px;
  letter-spacing: -1px;
}

.top-action li:nth-child(1) { background-image: url(../../img/top/action01.jpg); }
.top-action li:nth-child(2) { background-image: url(../../img/top/action02.jpg); }
.top-action li:nth-child(3) { background-image: url(../../img/top/action03.jpg); }
.top-action li:nth-child(4) { background-image: url(../../img/top/action04.jpg); }
.top-action li:nth-child(5) { background-image: url(../../img/top/action05.jpg); }
.top-action li:nth-child(6) { background-image: url(../../img/top/action06.jpg); }
.top-action li:nth-child(7) { background-image: url(../../img/top/action07.jpg); }
.top-action li:nth-child(8) { background-image: url(../../img/top/action08.jpg); }
.top-action li:nth-child(9) { background-image: url(../../img/top/action09.jpg); }

@media (min-width: 860px) {
  .top-action li {
    margin-right: 30px;
    min-height: 303px;
    padding: 35px 20px 30px;
    width: -webkit-calc( (100% - 60px) / 3 );
    width: calc( (100% - 60px) / 3 );
  }

  .top-action li:nth-child(3n) {
    margin-right: 0;
  }

  .top-action li:nth-child(n+4) {
    margin-top: 30px;
  }
}

@media (max-width: 859px) {
  .top-action li {
    font-size: 16px;
    margin-right: 10px;
    min-height: 253px;
    padding: 20px 15px 15px;
    width: -webkit-calc( (100% - 10px) / 2 );
    width: calc( (100% - 10px) / 2 );
  }

  .top-action li:nth-child(2n) {
    margin-right: 0;
  }

  .top-action li:nth-child(n+3) {
    margin-top: 10px;
  }
}

.top-action li img {
  display: block;
  margin-bottom: 25px;
}

/* top-product */
.top-product .sub-ttl {
  margin: 60px 0 30px;
  text-align: center;
}

.top-product .sub-ttl .small {
  display: block;
  font-family : 'mplus-2p-regular';
  font-size : 13px;
  letter-spacing : 2px;
}

@media (min-width: 641px) {
  .top-product .project-ul li {
    float: left;
  }

  .top-product .project-ul li {
    margin-right: 39px;
    width: -webkit-calc( (100% - 80px) / 3 );
    width: calc( (100% - 80px) / 3 );
  }

  .top-product .project-ul li:nth-child(3n) {
    margin-right: 0;
  }

  .top-product .project-ul li:nth-child(n+4) {
    margin-top: 40px;
  }
}

/*------------------------------------------------------------------------------
  message
------------------------------------------------------------------------------*/
.message .bg-wrapper {
  background: url(../../img/message/message-bg.jpg) no-repeat center top;
  background-size: cover;
  color: #fff;
  font-size: 15px;
  font-family: "游明朝 Demibold","Yu Mincho Demibold",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
  text-align: center;
}

.message .bg-wrapper p {
  line-height: 2;
}

.message .cnt01 {
  padding: 120px 0 155px;
}

.message .cnt01 .ttl {
  margin-bottom: 60px;
}

.message .cnt01 .ttl span {
  display: block;
}

.message .cnt01 .ttl .ico {
  margin-bottom: 90px;
}

.message .cnt02 .inner-block {
  background: url(../../img/message/bg-illust01.png) no-repeat 80% top;
}

.message .cnt02 .ttl {
  margin-bottom: 30px;
}

.message .cnt02 .indent {
  height: 0;
  margin: 0;
  text-indent: -9999px;
}

.message .cnt03 {
  color : #231815;
  padding-bottom: 50px;
}

.message .cnt03 .inner-block {
  background: url(../../img/message/bg-illust02.png) no-repeat 80% bottom;
  padding: 100px 10px 40px;
}

.message .cnt03 .ttl {
  margin-bottom: 40px;
}

/*------------------------------------------------------------------------------
  works
------------------------------------------------------------------------------*/
.works-ul li {
  box-sizing: border-box;
  border: 1px solid #898989;
  float: left;
}

@media (min-width: 790px) {
  .works-ul li {
    margin-right: 20px;
    width: -webkit-calc( (100% - 60px) / 4 );
    width: calc( (100% - 60px) / 4 );
  }

  .works-ul li:nth-child(4n) {
    margin-right: 0;
  }

  .works-ul li:nth-child(n+5) {
    margin-top: 40px;
  }
}

@media (max-width: 789px) and (min-width: 641px) {
  .works-ul li {
    margin-right: 10px;
    width: -webkit-calc( (100% - 30px) / 4 );
    width: calc( (100% - 30px) / 4 );
  }

  .works-ul li:nth-child(4n) {
    margin-right: 0;
  }

  .works-ul li:nth-child(n+5) {
    margin-top: 10px;
  }
}

.works-ul li a {
  display: block;
}

.works-ul li .img {
  height: 220px;
  overflow: hidden;
  position: relative;
  vertical-align: middle;
}

@media (min-width: 1000px) {
  .works-ul li .img {
    min-height: 185px;
  }
}

.works-ul li .img:before {
  background : url(../../img/works/soldout.png) no-repeat 97% center rgba(152, 30, 35, 0.8);
  background-size: auto 11px;
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 20px;
  z-index: 10;
}

.works-ul li .img img {
  top: -100%;
  left: -100%;
  right: -100%;
  bottom: -100%;
  height: auto;
  position: absolute;
  min-height: 100%;
  min-width: 100%;
  max-width: 300px;
  margin: auto;
  width: auto;
  vertical-align: middle;
  z-index: 9;
}

.works-ul li .txt {
  padding: 13px 10px 10px;
}

.works-ul li .txt span {
  display: block;
  line-height: 1.5;
}

.works-ul li .txt p:not(.ttl) {
  font-size: 12px;
}

.works-ul li .txt .ttl {
  color : #406398;
  font-family: "游明朝 Demibold","Yu Mincho Demibold",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
  font-size : 20px;
  line-height: 1.3;
  margin-bottom: 20px;
}

.works-ul li .txt .time {
  font-size: 16px;
}

.works-ul li .txt .access {
  display: table-cell;
  vertical-align: bottom;
  padding-bottom: 1em;
}

/*------------------------------------------------------------------------------
  project
------------------------------------------------------------------------------*/
.project-ttl {
  margin: 60px 0 20px;
}

.ttl-style01 + .project-ttl {
  margin-top: 0;
}

.project-ttl span {
  background : #000;
  border-radius: 3px;
  color: #fff;
  display: inline-block;
  font-family: "游明朝 Demibold","Yu Mincho Demibold",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
  font-size : 14px;
  line-height: 26px;
  text-align: center;
  min-width: 215px;
}

@media (min-width: 641px) {
  .project-lineup-ul li {
    float: left;
  }
}

@media (min-width: 860px) {
  .project-lineup-ul li {
    margin-right: 70px;
    width: -webkit-calc( (100% - 70px) / 2 );
    width: calc( (100% - 70px) / 2 );
  }

  .project-lineup-ul li:nth-child(2n) {
    margin-right: 0;
  }

  .project-lineup-ul li:nth-child(n+3) {
    margin-top: 40px;
  }
}

@media (max-width: 859px) and (min-width: 641px) {
  .project-lineup-ul li {
    margin-right: 20px;
    width: -webkit-calc( (100% - 20px) / 2 );
    width: calc( (100% - 20px) / 2 );
  }

  .project-lineup-ul li:nth-child(2n) {
    margin-right: 0;
  }

  .project-lineup-ul li:nth-child(n+3) {
    margin-top: 20px;
  }
}

.project-lineup-ul li {
  border: 1px solid #898989;
  box-sizing: border-box;
}

.project-lineup-ul li a {
  display: block;
  height: 100%;
}

.project-lineup-ul li .img {
  position: relative;
}

@media (min-width: 1000px) {
  .project-lineup-ul li .img {
    min-height: 217px;
  }
}

.project-lineup-ul li .img {
  height: 220px;
  overflow: hidden;
  position: relative;
}

.project-lineup-ul li .img img {
  top: -100%;
  left: -100%;
  right: -100%;
  bottom: -100%;
  height: auto;
  position: absolute;
  min-height: 100%;
  min-width: 100%;
  max-width: 500px;
  margin: auto;
  width: auto;
  vertical-align: middle;
}

.project-lineup-ul li .img .cap {
  color: #fff;
  font-family: "游明朝 Demibold","Yu Mincho Demibold",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
  font-size: 14px;
  letter-spacing : 2px;
  line-height: 1.5;
  position: absolute;
  left: 15px;
  bottom: 15px;
}

.project-lineup-ul li .txt {
  padding: 10px 10px 15px 15px;
  position: relative;
}

.project-lineup-ul li .txt .btn {
  line-height: 1;
  position: absolute;
  top: 10px;
  right: 10px;
}

.project-lineup-ul li .txt .btn a {
  display: block;
}

.project-lineup-ul li .txt .btn img {
  height: 19px;
  width: auto;
}

.project-lineup-ul li .txt .ttl {
  color: #406398;
  display: block;
  font-family: "游明朝 Demibold","Yu Mincho Demibold",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
  font-size : 26px;
  line-height: 1.3;
  margin-bottom: 10px;
  padding-right: 60px;
}

.project-lineup-ul li .txt .ttl .new {
  background : #E88122;
  box-sizing: border-box;
  display: inline-block;
  margin-left: 7px;
  line-height: 1;
  padding-top: 2px;
  position: relative;
  top: 7px;
  text-align: center;
  height: 15px;
  width: 38px;
}

.project-lineup-ul li .txt .ttl .new img {
  height: 10px;
  width: auto;
}

.project-lineup-ul li .txt table {
  width: 100%;
}

.project-lineup-ul li .txt table th,
.project-lineup-ul li .txt table td {
  font-size: 12px;
  line-height: 1.3;
  padding-top: 5px;
  text-align: left;
  vertical-align: top;
}

.project-lineup-ul li .txt table th {
  width: 18%;
}

.project-lineup-ul li .txt table th img {
  padding-top: 3px;
  height: 12px;
  width: auto;
}

.project-lineup-ul li .ttl .small {
  font-size: 10px;
}

/*------------------------------------------------------------------------------
  product
------------------------------------------------------------------------------*/
.product-ttl {
  margin: 60px 0 20px;
}

.ttl-style01 + .product-ttl {
  margin-top: 0;
}

.product-ttl span {
  background : #fff;
  border: 1px solid #000;
  border-radius: 3px;
  color: #000;
  display: inline-block;
  font-family: "游明朝 Demibold","Yu Mincho Demibold",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
  font-size : 14px;
  line-height: 26px;
  text-align: center;
  min-width: 215px;
}

.product-ul li {
  box-sizing: border-box;
  box-shadow: 0.5px 2px 3px rgba(0, 0, 0, 0.3);
  float: left;
}

@media (min-width: 790px) {
  .product-ul li {
    margin-right: 20px;
    width: -webkit-calc( (100% - 80px) / 5 );
    width: calc( (100% - 80px) / 5 );
  }

  .product-ul li:nth-child(5n) {
    margin-right: 0;
  }

  .product-ul li:nth-child(n+6) {
    margin-top: 20px;
  }
}

@media (max-width: 789px) and (min-width: 641px) {
  .product-ul li {
    margin-right: 10px;
    width: -webkit-calc( (100% - 30px) / 4 );
    width: calc( (100% - 30px) / 4 );
  }

  .product-ul li:nth-child(4n) {
    margin-right: 0;
  }

  .product-ul li:nth-child(n+5) {
    margin-top: 10px;
  }
}

.product-ul li a {
  display: block;
}

@media (min-width: 641px) {
  .product-ul li a:hover {
    background: rgba(0,0,0,0.1);
    opacity: 1;
  }
}

.product-ul li .img {
  height: 220px;
  overflow: hidden;
  position: relative;
}

.product-ul li .img img {
  top: -100%;
  left: -100%;
  right: -100%;
  bottom: -100%;
  height: auto;
  position: absolute;
  min-height: 100%;
  min-width: 100%;
  max-width: 250px;
  margin: auto;
  width: auto;
  vertical-align: middle;
}

.product-ul li .txt {
  padding: 15px 10px 10px;
  text-align: center;
}

.product-ul li .txt span {
  display: block;
  line-height: 1.3;
}

.product-ul li .txt .ttl {
  font-size : 18px;
  font-family: 'mplus-2p-bold';
  letter-spacing: -0.05em;
  line-height: 1.2;
  padding-bottom: 30px;
}

.product-ul li .txt .access {
  font-size : 12px;
  padding-bottom: 10px;
}

.product-ul li .txt .number {
  font-size : 14px;
}

/*------------------------------------------------------------------------------
  about
------------------------------------------------------------------------------*/
.about .cnt01 {
  padding: 45px 0 0;
}

.about .cnt01 .table-box {
  background: url(../../img/about/outline-bg.jpg) no-repeat center center;
  background-size: cover;
  box-sizing: border-box;
  margin: auto;
  padding: 48px 40px;
  max-width: 670px;
}

.about .cnt01 .table-box table {
  color: #fff;
  font-size: 12px;
  line-height: 1.6;
}

.about .cnt01 .table-box table th {
  font-weight: normal;
  padding: 12px 30px 12px 0;
  position: relative;
  text-align: right;
}

.about .cnt01 .table-box table th:before {
  background: #fff;
  content: "";
  display: block;
  width: 2px;
  height: -webkit-calc(100% - 24px);
  height: calc(100% - 24px);
  position: absolute;
  top: 12px;
  right: 0;
}

.about .cnt01 .table-box table td {
  padding: 12px 0 12px 30px;
}

.about .cnt02 {
  padding: 65px 0 0;
}

.about .cnt02 .map {
  border: 1px solid #7f614a;
  margin: auto;
  max-width: 670px;
  height: 670px;
}

/*------------------------------------------------------------------------------
  privacy
------------------------------------------------------------------------------*/
.privacy .cnt01 {
  padding: 45px 0 0;
}

.privacy .privacy-box dl dt,
.privacy .privacy-box dl dd {
  margin: 0;
}

.privacy .privacy-box dl dt {
  font-family: 'mplus-2p-bold';
  font-size: larger;
  line-height: 1.4;
  padding: 15px 0 0;
}

.privacy .privacy-box dl dd {
  border-bottom: 1px solid #b5b5b5;
  padding: 15px 0;
}

.privacy .privacy-box ol {
  list-style: none;
  margin: 0;
  padding: 0;
}

.privacy .cnt01 a {
  color: #CA1E23;
}

.privacy .cnt01 .update {
  text-align: right;
}

/*------------------------------------------------------------------------------
  contact
------------------------------------------------------------------------------*/
.contact .cnt01 {
  padding: 45px 0 0;
}

.contact-ttl {
  font-family: 'mplus-2p-bold';
  font-size: 20px;
  line-height: 1.4;
  margin: 0 0 15px;
}

.contact .tel-box .tel {
  font-family: 'mplus-2p-bold';
  font-size: 30px;
  line-height: 1;
  margin-top: -10px;
}

.contact .tel-box .tel a,
.contact .tel-box .tel span {
  font-size: 40px;
}

.contact .tel-box,
.contact .form-box {
  padding: 30px 0;
}

.contact .form-box {
  border-top: 1px solid #b5b5b5;
  padding-bottom: 0;
}

.contact .form-box .table-style01 th,
.contact .form-box .table-style01 td {
  padding: 20px;
}

.contact .form-box .table-style01 th {
  width: 14em;
}

.contact .form-box .wide {
  text-align: center;
}

.contact .form-box .red {
  color: #CA1E23;
}

.contact .form-box .req {
  color: #CA1E23;
  display: inline-block;
  font-size: 12px;
  margin-left: 10px;
}

.contact .form-box input:not([type="radio"]),
.contact .form-box textarea {
  border: 1px solid #ccc;
  box-sizing: border-box;
  padding: 10px;
  width: 100%;
}

.contact .form-box label {
  cursor: pointer;
  font-size: 16px;
}

.contact .form-box label + label {
  margin-left: 20px;
}

.contact .form-box input[type="radio"] {
  margin-right: 5px;
  vertical-align: middle;
}

.contact .form-box input[type="text"].postal-code {
  width: 140px;
  margin: 0 0 10px 10px;
  vertical-align: 0;
}

#wrapper.contact .form-box [type="submit"] {
  background: url(../img/arrow-right.svg) no-repeat 20px center #CA1E23;
  background-size: 25px 20px;
  box-sizing: border-box;
  border: none;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-size: 20px;
  font-family: 'mplus-2p-bold';
  line-height: 54px;
  text-align: center;
  text-indent: 10px;
  width: 250px;
}

#wrapper.contact .form-box [type="submit"].submitBack {
  background-color: #999;
}

#wrapper.contact .form-box [type="submit"] + [type="submit"] {
  margin: 0 0 0 20px;
}

@media (min-width: 641px) {
  #wrapper.contact .form-box [type="submit"]:hover {
    opacity: 0.7;
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
  }
}

.contact .form-box .btn-area {
  margin: 30px 0 0;
  text-align: center;
}

/*------------------------------------------------------------------------------
  detail
------------------------------------------------------------------------------*/
@media (min-width: 641px) {
  .detail .content .inner-block {
    max-width: 880px;
  }
  .carousel img {
    width: 100%;
  }
}

.kv-slide {
  margin-bottom: 70px;
}

.carousel-cell {
  width: 70%;
}

.flickity-prev-next-button {
  width: 60px;
  height: 80px;
}

.flickity-prev-next-button,
.flickity-prev-next-button:hover {
  background: none;
}

.flickity-prev-next-button:hover .arrow {
  fill: rgba(255,255,255,1);
}

.flickity-prev-next-button svg {
  position: static;
  width: 100%;
  height: 100%;
}

.flickity-prev-next-button .arrow {
  fill: rgba(255,255,255,0.7);
}

.flickity-prev-next-button.next {
  right: 10%;
}

.flickity-prev-next-button.previous {
  left: 10%;
}

@media (max-width: 800px) {
  .flickity-prev-next-button {
    width: 40px;
    height: 50px;
  }
}

.detail .ttl-style03 {
  margin: 80px 0 15px;
}

.detail .plan + .plan {
  margin: 40px 0 0;
}

.detail .summary {
  border: 2px solid #000;
  padding: 20px 40px;
}

.detail .summary table {
  width: 100%;
}

@media (min-width: 641px) {
  .detail .summary table:nth-child(odd) {
    float: left;
    width: 56%;
  }

  .detail .summary table:nth-child(even) {
    float: right;
    width: 40%;
  }
}

.detail .summary table th,
.detail .summary table td {
  padding: 12px 30px;
}

.detail .summary table tbody th {
  font-weight: normal;
  position: relative;
  text-align: left;
  width: 4em;
}

.detail .summary table tbody th:before {
  background: #000;
  content: "";
  display: block;
  width: 2px;
  height: -webkit-calc(100% - 24px);
  height: calc(100% - 24px);
  position: absolute;
  top: 12px;
  right: 0;
}

.detail .topics {
  text-align: center;
}

.detail .topics .copy,
.detail .topics .price {
  font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","游ゴシック Medium","Yu Gothic Medium",YuGothic,"メイリオ",Meiryo,Osaka,sans-serif;
  font-weight: bold;
}

.detail .topics .copy,
.detail .topics .price {
  font-size: 30px;
  line-height: 1.4;
}

.detail .topics .price .red {
  color: #ca1e23;
}

.detail .topics .btn-box a + a {
  margin-left: 20px;
}

.detail .caution {
  font-size: 12px;
  line-height: 1.3;
  margin: 20px 0 0;
}

@media (min-width: 641px) {
  .detail .plan .img-box {
    float: left;
    width: 40%;
  }

  .detail .plan .table-box {
    float: right;
    width: 50%;
  }
}

.table-style01 {
  width: 100%;
}

.table-style01 th,
.table-style01 td {
  border: 1px solid #b5b5b5;
  padding: 10px 15px;
}

.table-style01 thead th {
  background: #808080;
  color: #fff;
  font-size: 20px;
}

.table-style01 tbody th {
  background: #d8d8d8;
  font-weight: normal;
  text-align: left;
  width: 10em;
}

.eqp-ul li {
  box-sizing: border-box;
  border: 1px solid #898989;
  float: left;
  padding: 4px;
}

.eqp-ul li .ttl {
  font-size: 18px;
  font-weight: bold;
  padding: 6px 6px 0;
  text-align: center;
}

.eqp-ul li .txt {
  font-size: 13px;
  padding: 10px 6px 6px;
  word-wrap: break-word;
}

@media (min-width: 790px) {
  .eqp-ul li {
    margin-right: 40px;
    width: -webkit-calc( (100% - 80px) / 3 );
    width: calc( (100% - 80px) / 3 );
  }

  .eqp-ul li:nth-child(3n) {
    margin-right: 0;
  }

  .eqp-ul li:nth-child(n+4) {
    margin-top: 40px;
  }
}

@media (max-width: 789px) and (min-width: 641px) {
  .eqp-ul li {
    margin-right: 10px;
    width: -webkit-calc( (100% - 20px) / 3 );
    width: calc( (100% - 20px) / 3 );
  }

  .eqp-ul li:nth-child(3n) {
    margin-right: 0;
  }

  .eqp-ul li:nth-child(n+4) {
    margin-top: 10px;
  }
}

.detail .access .map {
  height: 600px;
}

#wrapper .not-found {
  font-size: 16px;
  margin: 50px 0 0;
}

/*------------------------------------------------------------------------------
  clearfix
------------------------------------------------------------------------------*/
.detail .summary:after,
.detail .plan:after {
  clear: both;
  content: "";
  display: block;
  height: 0;
  font-size: 0;
  visibility: hidden;
  overflow: hidden;
}