@charset "UTF-8";
@import url(style_pc.css);
@import url(animate.css);
@import url(js.css);
/*@import url(responsive.css);*/

a {
  color: #2fa1c1;
  text-decoration: none
}

@font-face {
  font-family: 'font1';
  src: url('03SmartFontUI.otf');
  src: local('hide from IE'), url('kanazawahonnmarugo.otf') format('opentype'), url('kanazawahonnmarugo.ttf') format('truetype');
}
@font-face {
  font-family: 'font2';
  src: url('03SmartFontUI.otf');
  src: local('hide from IE'), url('avenir-bold.otf') format('opentype'), url('avenir-bold.ttf') format('truetype');
}

body,
h1,h2,h2,h4,h5,h4,
dl,dt,dd,
p,blockquote,
form,fieldset,
table,th,td,ul,
img {
	margin: 0;
	padding: 0;
	font-size: 100%;
}


@media screen and (min-width:979px){
#page, #header, #main, #footer {
  position: relative
}

#header, #main, #footer {
  min-width: 1024px
}

.clear {
  clear: both;
  display: block;
  height: 0;
  overflow: hidden;
  visibility: hidden;
  width: 0
}
.clearfix:after {
  content: " ";
  display: block;
  clear: both
}
.m-top {
  margin-top: 0 !important
}
.m-bottom {
  margin-bottom: 0 !important
}
.scroll-point {
  margin-top: -1px;
  padding-top: 1px;
  display: block
}
.noscript {
  background: #f31c10;
  color: #fff;
  font-size: 14px;
  font-size: 1.4rem;
  text-align: center;
  width: 100%;
  padding: 8px 16px;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 999998
}
.anti-aliasing {
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
  -webkit-transform: scale(1, 1.01);
  transform: scale(1, 1.01)
}
.horizontal {
  text-align: justify;
  writing-mode: tb-rl;
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  -moz-writing-mode: vertical-rl;
  -o-writing-mode: vertical-rl
}
.content-width-s {
  max-width: 800px
}
.content-width-full {
  max-width: 1500px
}
.content-width-s, .content-width, .content-width-full {
  width: 96%;
  margin-left: auto;
  margin-right: auto
}
.common-ul {
  margin: 8px 0 24px;
  padding: 0
}
.common-ul ul {
  margin: 0 0 0 8px
}
.common-ul ul li {
  list-style-type: none;
  margin: 0;
  position: relative
}
.common-ul ul li:before {
  content: '';
  background: #222;
  width: 5px;
  height: 5px;
  display: inline-block;
  position: relative;
  left: -4px;
  top: -3px;
  border-radius: 100%
}
.common-ul.m-none {
  margin: 0
}
.common-ul.m-half {
  margin: 8px 0
}
.common-ul.p-inner {
  margin: 0 0 16px
}
.common-ol {
  margin: 8px 0 24px;
  padding: 0
}
.common-ol ol li {
  list-style-type: decimal;
  margin: 0 0 0 24px
}
.common-ol.m-half {
  margin: 8px 0
}
.common-ol.p-inner {
  margin: -8px 0 8px
}
.common-table {
  margin: 16px 0;
  padding: 0
}
.common-table table {
  border-collapse: separate;
  border-spacing: 1px
}
.common-table table tr th, .common-table table tr td {
  font-weight: normal;
  text-align: left;
  padding: 8px 24px
}
.common-table table tr th {
  background: #eaeaea;
  vertical-align: middle;
  letter-spacing: -0.06em;
  width: 156px
}
.common-table table tr td {
  background: #fafafa
}

.common-table table tr:last-child td {
  margin-bottom: 0
}
.attention {
  background: #f4f4f4;
  font-size: 15px;
  font-size: 1.5rem;
  margin: 8px 0;
  padding: 24px 40px 8px;
  position: relative
}
.attention:before {
  content: '';
  border: 0px solid transparent;
  border-color: transparent transparent #dbdbdb #dbdbdb;
  border-width: 14px;
  width: 0;
  height: 0;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2
}
.attention:after {
  content: '';
  border: 0px solid transparent;
  border-color: #fff #fff transparent transparent;
  border-width: 14px;
  width: 0;
  height: 0;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1
}
.btn {
  max-width: 280px;
  font-size: 15px;
  font-size: 1.5rem;
  font-weight: bold;
  text-align: center;
  margin: 8px auto;
  position: relative
}
.btn a {
  border: 1px solid #2fa1c1;
  background: #2fa1c1;
  color: #fff;
  font-size: 15px;
  font-size: 1.5rem;
  font-weight: normal;
  text-align: center;
  text-decoration: none;
  padding: 14px 16px;
  display: block;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  -webkit-transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1);
  transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1)
}
.btn a:before {
  content: "";
  background: #fff;
  width: 0;
  height: 1px;
  position: absolute;
  top: 50%;
  left: 56px;
  display: block;
  -webkit-transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1);
  transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1)
}
  .btn a:hover:before {
    content: "";
    width: 20px
  }
}
.btn.small {
  max-width: 240px
}
.btn.small a {
  font-size: 14px;
  font-size: 1.4rem;
  padding: 6px 16px
}
.white-btn, .black-btn {
  max-width: 240px;
  margin: 16px auto;
  position: relative
}
.white-btn a, .black-btn a {
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  margin: 0;
  padding: 6px 16px;
  display: block;
  position: relative;
  overflow: hidden;
  -webkit-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease
}
.white-btn a {
  border: 1px solid #fff;
  color: #fff
}
.white-btn a:before {
  content: "";
  border-bottom: 1px solid #fff;
  border-right: 1px solid #fff;
  width: 4px;
  height: 4px;
  position: absolute;
  top: 50%;
  right: 18px;
  margin: -2px 0 0;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease
}
.black-btn a {
  border: 1px solid #222;
  color: #222
}
.black-btn a:before {
  content: "";
  border-bottom: 1px solid #555;
  border-right: 1px solid #555;
  width: 4px;
  height: 4px;
  position: absolute;
  top: 50%;
  right: 18px;
  margin: -2px 0 0;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease
}
.rotate-btn {
  text-align: center;
  height: 44px;
  overflow: hidden
}
.rotate-btn a {
  text-align: center;
  text-decoration: none;
  line-height: 40px;
  width: 280px;
  height: 46px;
  position: relative;
  display: inline-block;
  -webkit-perspective: 300px;
  perspective: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden
}
.rotate-btn a:before, .rotate-btn a:after {
  content: "";
  display: block;
  position: absolute;
  z-index: -1
}
.rotate-btn a span.inner {
  background: #2fa1c1;
  color: #fff;
  text-align: center;
  line-height: 40px;
  width: 280px;
  height: 46px;
  position: absolute;
  display: block;
  pointer-events: none;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease
}
.rotate-btn a span.inner:nth-child(1) {
  border: 2px solid #274f52;
  background: #274f52;
  color: #fff;
  -webkit-transform: rotateX(90deg);
  transform: rotateX(90deg);
  -webkit-transform-origin: 50% 50% -23px;
  -moz-transform-origin: 50% 50% -23px;
  transform-origin: 50% 50% -23px
}
.rotate-btn a span.inner:nth-child(2) {
  border: 2px solid #2fa1c1;
  background: #2fa1c1;
  color: #fff;
  -webkit-transform: rotateX(0deg);
  transform: rotateX(0deg);
  -webkit-transform-origin: 50% 50% -23px;
  -moz-transform-origin: 50% 50% -23px;
  transform-origin: 50% 50% -23px
}
.rotate-btn a:hover span.inner {
  border: 2px solid #274f52
}
.rotate-btn a:hover span.inner:nth-child(1) {
  -webkit-transform: rotateX(0deg);
  transform: rotateX(0deg)
}
.rotate-btn a:hover span.inner:nth-child(2) {
  background: #274f52;
  -webkit-transform: rotateX(-90deg);
  transform: rotateX(-90deg)
}
.rotate-btn.small {
  height: 50px
}
.rotate-btn.small a {
  line-height: 48px;
  width: 220px;
  height: 54px
}
.rotate-btn.small a span.inner {
  line-height: 48px;
  width: 220px;
  height: 54px
}
.rotate-btn.small a span.inner:nth-child(1) {
  -webkit-transform-origin: 50% 50% -27px;
  -moz-transform-origin: 50% 50% -27px;
  transform-origin: 50% 50% -27px
}
.rotate-btn.small a span.inner:nth-child(2) {
  -webkit-transform-origin: 50% 50% -27px;
  -moz-transform-origin: 50% 50% -27px;
  transform-origin: 50% 50% -27px
}
.readmore {
  text-align: right;
  margin: 24px 0
}
.readmore a {
  color: #2fa1c1;
  font-size: 15px;
  font-size: 1.5rem;
  line-height: 1;
  text-decoration: none;
  padding: 0 12px 0 32px;
  display: inline-block;
  position: relative;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease
}
.readmore a:before {
  content: "";
  background: #2fa1c1;
  width: 24px;
  height: 1px;
  position: absolute;
  bottom: 3px;
  left: 0;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease
}
.readmore a:after {
  content: "";
  border-right: 1px solid #2fa1c1;
  width: 8px;
  height: 8px;
  position: absolute;
  bottom: -1px;
  left: 15px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease
}
  .readmore a:hover:before {
    width: 30px
  }
  .readmore a:hover:after {
    left: 21px
  }
}
.ta-center {
  text-align: center
}
.ta-left {
  text-align: left
}
.ta-right {
  text-align: right
}
.centering-block {
  font-weight: normal;
  text-align: center;
  margin-left: auto;
  margin-right: auto
}
.centering-block .centering-block-inner {
  text-align: left;
  display: inline-block
}
.long-url {
  word-break: break-all
}
.centering {
  text-align: center
}
.section-img.circle, .vertical-img.circle, .gallery-img.circle {
  overflow: hidden
}
.section-img.circle img, .vertical-img.circle img, .gallery-img.circle img {
  border-radius: 50%
}
.section-img.frame, .vertical-img.frame, .gallery-img.frame {
  border: 1px solid #dfdfdf;
  background: #fff;
  text-align: center;
  line-height: 0;
  padding: 2px;
  box-shadow: 0 4px 2px -2px rgba(0, 0, 0, 0.2)
}
.section-img.white-frame, .vertical-img.white-frame, .gallery-img.white-frame {
  line-height: 0;
  position: relative
}
.section-img.white-frame:before, .vertical-img.white-frame:before, .gallery-img.white-frame:before {
  content: '';
  box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.75) inset;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2
}
.section-img {
  text-align: center;
  margin: 0 auto
}
.section-img.left {
  text-align: left
}
.vertical-img.frame {
  margin: 0 0 8px
}
.img-attention {
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: normal;
  text-align: center
}
.link-img {
  -webkit-transition: opacity 0.1s ease;
  transition: opacity 0.1s ease
}
span.marker {
  background: linear-gradient(transparent 60%, #fcd5e6 60%);
  font-weight: bold;
  margin: 0 2px;
  padding: 0 2px
}
span.red-font {
  color: #f31c10;
  font-weight: bold
}
span.small-font {
  font-size: 13px;
  font-size: 1.3rem
}
span.big-font {
  color: #f31c10;
  font-size: 20px;
  font-size: 2rem;
  font-weight: bold
}
.bdrt-dashed, .bdrb-dashed {
  position: relative
}
.bdrt-dashed:before {
  top: 0
}
.bdrb-dashed:before {
  bottom: 0
}
.bdrt-dotted, .bdrb-dotted {
  position: relative
}
.bdrt-dotted:before {
  top: 0
}
.bdrb-dotted:before {
  bottom: 0
}
hr.space {
  border: none;
  background: none;
  margin: 0;
  padding: 24px 0
}
hr.space.double {
  padding: 48px 0
}
hr.hr {
  border: none;
  background: none;
  margin: 0;
  padding: 40px 0;
  position: relative
}
hr.hr:before {
  content: "";
  border-bottom: 3px double #dfdfdf;
  width: 100%;
  height: 1px;
  position: absolute;
  top: 50%;
  left: 0;
  margin: 3px 0 0
}
hr.line {
  border: none;
  border-bottom: 1px solid #222;
  margin: 48px auto;
  padding: 0;
  width: 960px;
  height: 1px;
  position: relative
}
hr.line:before, hr.line:after {
  content: '';
  background: #222;
  width: 5px;
  height: 5px;
  position: absolute;
  top: -1px;
  border-radius: 50%;
  z-index: 2
}
hr.line:before {
  left: 0
}
hr.line:after {
  right: 0
}
hr.flow-arrow {
  border: none;
  margin: 12px auto;
  padding: 0;
  width: 96px;
  height: 20px;
  position: relative
}
hr.flow-arrow:before {
  content: '';
  border: 0px solid transparent;
  border-color: #cbcbcb transparent transparent;
  border-width: 20px 48px;
  width: 0;
  height: 0;
  position: absolute;
  top: 50%;
  margin: -10px 0 0;
  left: 0;
  z-index: 2
}
.wave-t {
  position: relative
}
.wave-b {
  position: relative
}
.reflection {
  background: #fff;
  width: 30px;
  height: 100%;
  position: absolute;
  top: -180px;
  left: 0;
  display: block;
  opacity: 0;
  -webkit-animation: reflection 3.5s ease-in-out infinite;
  animation: reflection 3.5s ease-in-out infinite;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg)
}
@-webkit-keyframes reflection {
  0% {
    -webkit-transform: scale(0) rotate(45deg) translate3d(0, 0, 0);
    opacity: 0
  }
  80% {
    -webkit-transform: scale(0) rotate(45deg) translate3d(0, 0, 0);
    opacity: 0.25
  }
  81% {
    -webkit-transform: scale(4) rotate(45deg) translate3d(0, 0, 0);
    opacity: 0.5
  }
  100% {
    -webkit-transform: scale(50) rotate(45deg) translate3d(0, 0, 0);
    opacity: 0
  }
}
@keyframes reflection {
  0% {
    transform: scale(0) rotate(45deg) translate3d(0, 0, 0);
    opacity: 0
  }
  80% {
    transform: scale(0) rotate(45deg) translate3d(0, 0, 0);
    opacity: 0.25
  }
  81% {
    transform: scale(4) rotate(45deg) translate3d(0, 0, 0);
    opacity: 0.5
  }
  100% {
    transform: scale(50) rotate(45deg) translate3d(0, 0, 0);
    opacity: 0
  }
}
@import url(//fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900);
@import url(//fonts.googleapis.com/css?family=Quicksand:300,400,500,700);
@import url(//fonts.googleapis.com/css?family=Hind:300,400,500,600,700);
@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}
html {
  font-size: 62.5%;
  line-height: 1.75
}

body {
  color: #222;
  font-family: "Noto Sans Japanese", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo", "メイリオ", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: 400;
  letter-spacing: 0.075rem;
  margin: 0;
  padding: 0;
}
#page {
  background: #fff
}

.hd-h2 {
  border-left: 8px solid #2fa1c1;
  background: #f4f4f4;
  font-size: 22px;
  font-size: 2.2rem;
  letter-spacing: 0.04em;
  margin: 48px 0 24px;
  padding: 12px 16px;
  position: relative
}
.hd-h2:before {
  content: "";
  background: #dfdfdf;
  width: 100%;
  height: 1px;
  position: absolute;
  bottom: 0;
  left: 0
}
.hd-h3 {
  border-bottom: 1px solid #dfdfdf;
  color: #2fa1c1;
  font-size: 22px;
  font-size: 2.2rem;
  letter-spacing: 0.04em;
  margin: 40px 0 24px;
  padding: 22px 8px 22px 24px;
  position: relative
}
.hd-h3:before {
  content: "";
  background: #2fa1c1;
  width: 6px;
  height: 28px;
  position: absolute;
  top: 50%;
  left: 8px;
  margin: -13px 0 0
}
.hd-h4 {
  font-size: 17px;
  font-size: 1.7rem;
  font-weight: bold;
  margin: 40px 2px 16px;
  padding: 0 0 0 18px;
  position: relative
}
.hd-h4:before, .hd-h4:after {
  content: '';
  position: absolute;
  top: 50%;
  border-radius: 50%
}
.hd-h4:before {
  background: #2fa1c1;
  width: 12px;
  height: 12px;
  margin: -5px 0 0;
  left: 0
}
.hd-h4:after {
  background: #fff;
  width: 6px;
  height: 6px;
  margin: -2px 0 0;
  left: 3px
}
.hd-h5 {
  font-weight: bold;
  position: relative
}
.tel-number .inner {
  text-align: left;
  display: inline-block
}
.tel-number .inner .tel-number-wrapper {
  line-height: 1
}
.tel-number .inner .tel-number-wrapper span.icon {
  width: 14px;
  height: 24px;
  margin: 0 6px 0 4px;
  display: inline-block;
  position: relative;
  top: 2px
}
.tel-number .inner .tel-number-wrapper span.icon .icon-mobile {
  border-top: 3px solid #2fa1c1;
  border-left: 1px solid #2fa1c1;
  border-right: 1px solid #2fa1c1;
  border-bottom: 6px solid #2fa1c1;
  width: 14px;
  height: 24px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border-radius: 2px
}
.tel-number .inner .tel-number-wrapper span.icon .icon-mobile:before {
  content: '';
  background: #fff;
  width: 2px;
  height: 2px;
  position: absolute;
  bottom: -4px;
  left: 50%;
  margin: 0 0 0 -1px;
  border-radius: 50%
}
.tel-number .inner .tel-number-wrapper span.tel-number {
  color: #222;
  font-size: 32px;
  font-size: 3.2rem;
  font-weight: 400;
  font-family: "Hind", sans-serif
}
.tel-number .inner .header-tel-date {
  font-size: 13px;
  font-size: 1.3rem;
  line-height: 1.4
}
.tel-number .inner .header-tel-date span {
  background: #2fa1c1;
  color: #fff;
  font-size: 11px;
  font-size: 1.1rem;
  margin: 0 4px 0 0;
  padding: 0 8px;
  display: inline-block
}
.site-header {
  background: #fff;
  padding: 16px 0;
  height: 96px;
  position: relative;
  z-index: 600;
  width: 1000px;
  margin: 0 auto;
}
.site-header .site-header-inner .header-logo {
  width: 200px;
  margin: 0 40px 0 0;
  float: left
}
.site-header .site-header-inner .header-tel-wrapper {
  text-align: right;
  width: 432px 220px;
  float: right
}
.site-header .site-header-inner .header-tel-wrapper .header-tel {
  text-align: right;
  width: 400px;
  margin: 5px 32px 0 0;
  float: left
}
.site-header .site-header-inner .header-tel-wrapper .header-btn {
  width: 220px;
  float: right;
  margin: 4px 0 0;
}
.site-header .site-header-inner .header-tel-wrapper .header-btn a {
  background: #222;
  color: #fff;
  font-size: 13px;
  font-size: 1.3rem;
  font-weight: 900;
  letter-spacing: 0.2rem;
  text-align: center;
  text-decoration: none;
  padding: 14px 24px;
  display: block;
  position: relative;
  -webkit-transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1);
  transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1)
}
.site-header .site-header-inner .header-tel-wrapper .header-btn a:before {
  content: "";
  background: #fff;
  width: 0;
  height: 1px;
  position: absolute;
  top: 50%;
  left: 40px;
  display: block;
  -webkit-transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1);
  transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1)
}
  .site-header .site-header-inner .header-tel-wrapper .header-btn a:hover:before {
    content: "";
    width: 20px
  }
}
.slideshow-area {
  margin: 0;
  padding: 0;
  height: 800px;
  position: relative
}
@-webkit-keyframes copyFade1 {
  0% {
    opacity: 0;
    -webkit-filter: blur(24px);
    -webkit-transform: translate3d(0, 40px, 0)
  }
  100% {
    opacity: 1;
    -webkit-filter: blur(0);
    -webkit-transform: translate3d(0, 0, 0)
  }
}
@keyframes copyFade1 {
  0% {
    opacity: 0;
    filter: blur(24px);
    transform: translate3d(0, 40px, 0)
  }
  100% {
    opacity: 1;
    filter: blur(0);
    transform: translate3d(0, 0, 0)
  }
}
@-webkit-keyframes copyFade2 {
  0% {
    opacity: 0;
    -webkit-filter: blur(24px);
    -webkit-transform: translate3d(0, 40px, 0)
  }
  100% {
    opacity: 1;
    -webkit-filter: blur(0);
    -webkit-transform: translate3d(0, 0, 0)
  }
}
@keyframes copyFade2 {
  0% {
    opacity: 0;
    filter: blur(24px);
    transform: translate3d(0, 40px, 0)
  }
  100% {
    opacity: 1;
    filter: blur(0);
    transform: translate3d(0, 0, 0)
  }
}
.header-navigation-wrapper {
  background: #f9f9f9;
  height: 64px;
  position: relative;
  z-index: 700;
}
.header-navigation-wrapper .header-navigation {
  font-size: 0;
  text-align: center;
  margin: 0 auto;
  width: 1000px;
}
.header-navigation-wrapper .header-navigation > ul > li {
  width: 18.4%;
  float: left;
  position: relative
}
.header-navigation-wrapper .header-navigation > ul > li:before {
  content: '';
  background: #e0e0e0;
  width: 1px;
  height: 24px;
  position: absolute;
  top: 50%;
  left: 0;
  margin: -12px 0 0;
  z-index: 2
}
.header-navigation-wrapper .header-navigation > ul > li:last-child:after {
  content: '';
  background: #e0e0e0;
  width: 1px;
  height: 24px;
  position: absolute;
  top: 50%;
  right: 0;
  margin: -12px 0 0;
  z-index: 2
}
.header-navigation-wrapper .header-navigation > ul > li.home {
  width: 8%
}
.header-navigation-wrapper .header-navigation > ul > li.home a {
  padding: 12px 4px
}
.header-navigation-wrapper .header-navigation > ul > li.home .icon {
  width: 12px;
  height: 8px;
  margin: 18px auto 0;
  position: relative
}
.header-navigation-wrapper .header-navigation > ul > li.home .icon .icon-home:before {
  content: '';
  border: 0px solid transparent;
  border-color: transparent transparent #2fa1c1;
  border-width: 8px 10px;
  width: 0;
  height: 0;
  position: absolute;
  top: -16px;
  left: 50%;
  margin: 0 0 0 -10px;
  z-index: 2
}
.header-navigation-wrapper .header-navigation > ul > li.home .icon .icon-home .inner:before {
  content: '';
  background: #2fa1c1;
  width: 12px;
  height: 8px;
  position: absolute;
  bottom: 0;
  left: 50%;
  margin: 0 0 0 -6px;
  z-index: 1
}
.header-navigation-wrapper .header-navigation > ul > li.home .icon .icon-home .inner:after {
  content: '';
  background: #fff;
  width: 4px;
  height: 5px;
  position: absolute;
  bottom: 0;
  left: 50%;
  margin: 0 0 0 -2px;
  z-index: 2
}
.header-navigation-wrapper .header-navigation > ul > li > a {
  font-size: 15px;
  font-size: 1.5rem;
  color: #222;
  text-align: center;
  text-decoration: none;
  letter-spacing: -0.01em;
  padding: 18px 4px;
  height: 62px;
  display: block;
  position: relative;
  cursor: pointer
}
.header-navigation-wrapper .header-navigation > ul > li > a:before {
  content: "";
  background: #2fa1c1;
  width: 0;
  height: 1px;
  position: absolute;
  bottom: 0;
  left: 50%;
  z-index: 2;
  -webkit-transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1);
  transition: all 0.6s cubic-bezier(0.86, 0, 0.07, 1)
}
.header-navigation-wrapper .header-navigation > ul > li.active a:before {
  background: #2fa1c1
}
.header-navigation-wrapper .header-navigation > ul > li:last-child a:after {
  content: "";
  background: rgba(255, 255, 255, 0.25);
  width: 1px;
  height: 100%;
  position: absolute;
  top: 1px;
  right: 0;
  z-index: 2
}
.header-navigation-wrapper .header-navigation > ul > li span.child {
  text-align: center;
  width: 240px;
  margin: 0 0 0 -120px;
  padding: 0 0 0;
  height: 0;
  position: absolute;
  top: 100%;
  left: 50%;
  overflow: hidden;
  z-index: -1;
  opacity: 0;
  box-shadow: 0 0 6px rgba(39, 79, 82, 0.2);
  -webkit-transition: opacity, margin-top 0.2s ease;
  transition: opacity, margin-top 0.2s ease
}
.header-navigation-wrapper .header-navigation > ul > li span.child ul {
  background: #fcfcfc
}
.header-navigation-wrapper .header-navigation > ul > li span.child ul li {
  width: auto;
  float: none;
  padding: 0;
  display: block
}
.header-navigation-wrapper .header-navigation > ul > li span.child ul li a {
  border: none;
  border-bottom: 1px solid #fff;
  color: #222;
  font-size: 14px;
  font-size: 1.4rem;
  text-align: center;
  text-decoration: none;
  line-height: 0;
  height: auto;
  padding: 28px 0;
  display: block
}
.header-navigation-wrapper .header-navigation > ul > li span.child ul li a:before, .header-navigation-wrapper .header-navigation > ul > li span.child ul li a:after {
  content: none
}
.header-navigation-wrapper .header-navigation > ul > li span.child ul li:last-child a {
  border: none
}
.header-navigation-wrapper .header-navigation > ul > li span.child ul li ul {
  display: none
}
#main #main-inner {
  position: relative
}
#wrap {
  padding: 88px 0;
  position: relative
}
#wrap #wrap-inner {
  position: relative
}
#primary {
  width: 800px;
  margin-right: 40px;
  float: left
}
#secondary {
  width: 300px;
  float: right;
  padding: 0 0 80px
}
.page-title {
  text-align: center;
  margin: 80px 0 0 !important;
  position: relative
}
.page-title .jpn {
  font-size: 34px;
  font-size: 3.4rem;
  font-weight: 900;
  text-align: center;
  margin: 0 0 8px;
  display: block;
  position: relative
}
.page-title span.eng {
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: normal;
  font-family: "Roboto", sans-serif;
  text-transform: uppercase;
  display: block
}
.section-title {
  text-align: center;
  margin: 0 0 48px;
  padding: 0 16px 0 0
}
.section-title .icon {
  width: 40px;
  margin: 0 12px 0 0;
  display: inline-block;
  vertical-align: top;
  position: relative;
  top: 8px
}
.section-title .text {
  text-align: left;
  display: inline-block;
  vertical-align: top
}
.section-title .text .eng, .section-title .text .jpn {
  line-height: 1;
  display: block
}
.section-title .text .eng {
  color: #2fa1c1;
  font-size: 14px;
  font-size: 1.4rem;
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  text-transform: capitalize;
  margin: 0 0 8px 4px
}
.section-title .text .jpn {
  font-size: 30px;
  font-size: 3rem;
  font-weight: 700
}

.hd-bdr:before, .hd-bdr:after {
  content: '';
  width: 32px;
  height: 2px;
  position: absolute;
  bottom: 0;
  left: 50%;
  z-index: 2
}
.hd-bdr:before {
  background: #2fa1c1;
  margin: 0 0 0 -32px
}
.hd-bdr:after {
  background: #222;
  margin: 0
}
.section {
  margin: 0;
  padding: 0;
  position: relative
}
.section.post-section, .section.post-single-section {
  margin: 0;
  padding: 0
}
.section.bottom-none {
  padding-bottom: 0
}
.section.bottom-shadow {
  box-shadow: 0 32px 48px -48px rgba(0, 0, 0, 0.15)
}
.section.bg_darkgray {
  background: #efefef
}
.section.bg_gray {
  background: #fafafa
}
.philosophy-section .philosophy-wrapper .philosophy-text p {
  margin: 0 0 16px
}




#lineup-hd {
  font-size: 42px;
  font-size: 4.2rem;
  font-family: "Quicksand", sans-serif;
  font-weight: 100;
  text-align: center;
  margin: 80px 0 8px
}
#lineup-sub-hd {
  font-size: 16px;
  font-size: 1.6rem;
  text-align: center;
  margin: 0 0 48px;
  padding: 0 0 40px;
  position: relative
}
#lineup-sub-hd:before {
  content: '';
  background: #222;
  width: 64px;
  height: 1px;
  position: absolute;
  bottom: 0;
  left: 50%;
  margin: 0 0 0 -32px;
  z-index: 2
}
.lineup-section .lineup-wrapper {
  margin: 0 auto 24px
}
.lineup-section .lineup-wrapper .one-lineup a {
  color: #222;
  text-decoration: none;
  line-height: 0;
  margin: 0 0 8px;
  display: block;
  position: relative
}
.lineup-section .lineup-wrapper .one-lineup a .lineup-content {
  background: rgba(255, 255, 255, 0.75);
  line-height: 1.75;
  padding: 40px 32px 0;
  width: 90%;
  height: 90%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: 2;
  -webkit-transform: translateY(16px);
  transform: translateY(16px);
  opacity: 0;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease
}
.lineup-section .lineup-wrapper .one-lineup a .lineup-content .inner {
  -webkit-filter: blur(4px);
  filter: blur(4px);
  -webkit-transition: all 0.1s ease 0.3s;
  transition: all 0.1s ease 0.3s
}
.lineup-section .lineup-wrapper .one-lineup a .lineup-content .inner .lineup-title {
  font-size: 18px;
  font-size: 1.8rem;
  margin: 0 0 4px
}
.lineup-section .lineup-wrapper .one-lineup a .lineup-content .inner .lineup-catchcopy {
  font-size: 14px;
  font-size: 1.4rem
}
  .lineup-section .lineup-wrapper .one-lineup a:hover .lineup-content .inner {
    -webkit-filter: blur(0);
    filter: blur(0)
  }
}
.copyright-wrapper .copyright {
  border-top: 1px solid #dfdfdf;
  color: #6f6f6f;
  font-size: 11px;
  font-size: 1.1rem;
  font-family: "Roboto", sans-serif;
  font-weight: 600;
  text-align: center;
  padding: 48px 0;
  position: relative;
  z-index: 2
}
.pagetop-wrapper {
  display: none;
  position: fixed;
  bottom: 24px;
  right: 0;
  z-index: 800
}
.pagetop-wrapper .pagetop-inner {
  box-shadow: 0 0 24px rgba(0, 0, 0, 0.25)
}
.pagetop-wrapper .pagetop-inner .pagetop {
  margin: 0 0 4px
}
.pagetop-wrapper .pagetop-inner .pagetop a {
  background: #fff;
  color: #222;
  text-align: center;
  text-decoration: none;
  line-height: 10px;
  width: 64px;
  height: 64px;
  padding: 14px 0 0;
  display: block;
  -webkit-transition: all 0.1s ease;
  transition: all 0.1s ease
}
.pagetop-wrapper .pagetop-inner .pagetop a span.icon, .pagetop-wrapper .pagetop-inner .pagetop a span.text {
  display: block
}
.pagetop-wrapper .pagetop-inner .pagetop a span.icon {
  width: 12px;
  height: 12px;
  margin: 0 auto 14px;
  position: relative
}
.pagetop-wrapper .pagetop-inner .pagetop a span.icon .arrow-01:before, .pagetop-wrapper .pagetop-inner .pagetop a span.icon .arrow-02:before {
  content: '';
  border: 0 solid transparent;
  border-color: transparent transparent #f31c10 transparent;
  border-width: 12px;
  width: 0;
  height: 0;
  position: absolute;
  top: -12px;
  left: 50%;
  margin: 0 0 0 -12px;
  z-index: 3
}
.pagetop-wrapper .pagetop-inner .pagetop a span.icon .arrow-01:after, .pagetop-wrapper .pagetop-inner .pagetop a span.icon .arrow-02:after {
  content: '';
  border: 0 solid transparent;
  border-color: transparent transparent #fff transparent;
  border-width: 7px;
  width: 0;
  height: 0;
  position: absolute;
  bottom: 0;
  left: 50%;
  margin: 0 0 0 -7px;
  z-index: 3
}
.pagetop-wrapper .pagetop-inner .pagetop a span.icon .arrow-02:before {
  top: -4px
}
.pagetop-wrapper .pagetop-inner .pagetop a span.icon .arrow-02:after {
  bottom: -8px
}
.pagetop-wrapper .pagetop-inner .pagetop a span.text {
  font-size: 9px;
  font-family: "Roboto", sans-serif
}
/*スマホ　流れ*/
.header-navigation-wrapper .header-navigation > ul > li {
  width: 18.4%
}

.flow-section .flow-wrapper .one-flow {
  background: #fff;
  margin: 0rem 0rem 2.4rem 0rem;
  padding: 2.4rem 2.8rem 2.4rem 2.8rem
}
.flow-section .flow-wrapper .one-flow .flow-title {
  font-size: 17px;
  font-size: 1.7rem;
  font-weight: bold;
  text-align: center;
  margin: 0rem 0rem 1.2rem 0rem;
  height: 36px;
  position: relative
}
.flow-section .flow-wrapper .one-flow .flow-title .flow-title--num {
  background: #aedad0;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  font-family: "Roboto", sans-serif;
  text-align: center;
  line-height: 36px;
  width: 36px;
  height: 36px;
  margin: 0 8px 4px 0;
  display: inline-block;
  border-radius: 50%
}
.flow-section .flow-wrapper .one-flow .flow-title .flow-title--text {
  font-size: 17px;
  font-size: 1.7rem;
  line-height: 36px;
  display: inline-block
}
br.xs {
  display: none
}
br.sm {
  display: none
}
br.lg {
  display: inline
}
.show-xs, .show-sm, .hide-lg {
  display: none
}
.hide-xs, .hide-sm, .show-lg {
  display: block
}
.show-xs-inline, .show-sm-inline, .hide-lg-inline {
  display: none
}
.hide-xs-inline, .hide-sm-inline, .show-lg-inline {
  display: inline
}
.container:after {
  content: " ";
  display: block;
  clear: both
}
.row-48:after, .row-40:after, .row-32:after, .row-24:after, .row-16:after, .row-12:after, .row-8:after, .row-4:after, .row-2:after, .row-none:after {
  content: " ";
  display: block;
  clear: both
}
.row-48 {
  margin: 0 -4.8%
}
.row-48 > div {
  padding: 0 4.8%
}
.row-40 {
  margin: 0 -4.0%
}
.row-40 > div {
  padding: 0 4.0%
}
.row-32 {
  margin: 0 -3.2%
}
.row-32 > div {
  padding: 0 3.2%
}
.row-24 {
  margin: 0 -2.4%
}
.row-24 > div {
  padding: 0 2.4%
}
.row-16 {
  margin: 0 -1.6%
}
.row-16 > div {
  padding: 0 1.6%
}
.row-12 {
  margin: 0 -1.2%
}
.row-12 > div {
  padding: 0 1.2%
}
.row-8 {
  margin: 0 -0.8%
}
.row-8 > div {
  padding: 0 0.8%
}
.row-4 {
  margin: 0 -0.4%
}
.row-4 > div {
  padding: 0 0.4%
}
.row-2 {
  margin: 0 -0.2%
}
.row-2 > div {
  padding: 0 0.2%
}
.row-none {
  margin: 0
}
.row-none > div {
  padding: 0
}
.col-xs-24, .col-xs-23, .col-xs-22, .col-xs-21, .col-xs-20, .col-xs-19, .col-xs-18, .col-xs-17, .col-xs-16, .col-xs-15, .col-xs-14, .col-xs-13, .col-xs-12, .col-xs-11, .col-xs-10, .col-xs-9, .col-xs-8, .col-xs-7, .col-xs-6, .col-xs-5, .col-xs-4, .col-xs-3, .col-xs-2, .col-xs-1, .col-sm-24, .col-sm-23, .col-sm-22, .col-sm-21, .col-sm-20, .col-sm-19, .col-sm-18, .col-sm-17, .col-sm-16, .col-sm-15, .col-sm-14, .col-sm-13, .col-sm-12, .col-sm-11, .col-sm-10, .col-sm-9, .col-sm-8, .col-sm-7, .col-sm-6, .col-sm-5, .col-sm-4, .col-sm-3, .col-sm-2, .col-sm-1, .col-lg-24, .col-lg-23, .col-lg-22, .col-lg-21, .col-lg-20, .col-lg-19, .col-lg-18, .col-lg-17, .col-lg-16, .col-lg-15, .col-lg-14, .col-lg-13, .col-lg-12, .col-lg-11, .col-lg-10, .col-lg-9, .col-lg-8, .col-lg-7, .col-lg-6, .col-lg-5, .col-lg-4, .col-lg-3, .col-lg-2, .col-lg-1 {
  float: left
}
.col-xs-24.bdr-r, .col-xs-23.bdr-r, .col-xs-22.bdr-r, .col-xs-21.bdr-r, .col-xs-20.bdr-r, .col-xs-19.bdr-r, .col-xs-18.bdr-r, .col-xs-17.bdr-r, .col-xs-16.bdr-r, .col-xs-15.bdr-r, .col-xs-14.bdr-r, .col-xs-13.bdr-r, .col-xs-12.bdr-r, .col-xs-11.bdr-r, .col-xs-10.bdr-r, .col-xs-9.bdr-r, .col-xs-8.bdr-r, .col-xs-7.bdr-r, .col-xs-6.bdr-r, .col-xs-5.bdr-r, .col-xs-4.bdr-r, .col-xs-3.bdr-r, .col-xs-2.bdr-r, .col-xs-1.bdr-r, .col-sm-24.bdr-r, .col-sm-23.bdr-r, .col-sm-22.bdr-r, .col-sm-21.bdr-r, .col-sm-20.bdr-r, .col-sm-19.bdr-r, .col-sm-18.bdr-r, .col-sm-17.bdr-r, .col-sm-16.bdr-r, .col-sm-15.bdr-r, .col-sm-14.bdr-r, .col-sm-13.bdr-r, .col-sm-12.bdr-r, .col-sm-11.bdr-r, .col-sm-10.bdr-r, .col-sm-9.bdr-r, .col-sm-8.bdr-r, .col-sm-7.bdr-r, .col-sm-6.bdr-r, .col-sm-5.bdr-r, .col-sm-4.bdr-r, .col-sm-3.bdr-r, .col-sm-2.bdr-r, .col-sm-1.bdr-r, .col-lg-24.bdr-r, .col-lg-23.bdr-r, .col-lg-22.bdr-r, .col-lg-21.bdr-r, .col-lg-20.bdr-r, .col-lg-19.bdr-r, .col-lg-18.bdr-r, .col-lg-17.bdr-r, .col-lg-16.bdr-r, .col-lg-15.bdr-r, .col-lg-14.bdr-r, .col-lg-13.bdr-r, .col-lg-12.bdr-r, .col-lg-11.bdr-r, .col-lg-10.bdr-r, .col-lg-9.bdr-r, .col-lg-8.bdr-r, .col-lg-7.bdr-r, .col-lg-6.bdr-r, .col-lg-5.bdr-r, .col-lg-4.bdr-r, .col-lg-3.bdr-r, .col-lg-2.bdr-r, .col-lg-1.bdr-r {
  position: relative
}
.col-xs-24.bdr-r:before, .col-xs-23.bdr-r:before, .col-xs-22.bdr-r:before, .col-xs-21.bdr-r:before, .col-xs-20.bdr-r:before, .col-xs-19.bdr-r:before, .col-xs-18.bdr-r:before, .col-xs-17.bdr-r:before, .col-xs-16.bdr-r:before, .col-xs-15.bdr-r:before, .col-xs-14.bdr-r:before, .col-xs-13.bdr-r:before, .col-xs-12.bdr-r:before, .col-xs-11.bdr-r:before, .col-xs-10.bdr-r:before, .col-xs-9.bdr-r:before, .col-xs-8.bdr-r:before, .col-xs-7.bdr-r:before, .col-xs-6.bdr-r:before, .col-xs-5.bdr-r:before, .col-xs-4.bdr-r:before, .col-xs-3.bdr-r:before, .col-xs-2.bdr-r:before, .col-xs-1.bdr-r:before, .col-sm-24.bdr-r:before, .col-sm-23.bdr-r:before, .col-sm-22.bdr-r:before, .col-sm-21.bdr-r:before, .col-sm-20.bdr-r:before, .col-sm-19.bdr-r:before, .col-sm-18.bdr-r:before, .col-sm-17.bdr-r:before, .col-sm-16.bdr-r:before, .col-sm-15.bdr-r:before, .col-sm-14.bdr-r:before, .col-sm-13.bdr-r:before, .col-sm-12.bdr-r:before, .col-sm-11.bdr-r:before, .col-sm-10.bdr-r:before, .col-sm-9.bdr-r:before, .col-sm-8.bdr-r:before, .col-sm-7.bdr-r:before, .col-sm-6.bdr-r:before, .col-sm-5.bdr-r:before, .col-sm-4.bdr-r:before, .col-sm-3.bdr-r:before, .col-sm-2.bdr-r:before, .col-sm-1.bdr-r:before, .col-lg-24.bdr-r:before, .col-lg-23.bdr-r:before, .col-lg-22.bdr-r:before, .col-lg-21.bdr-r:before, .col-lg-20.bdr-r:before, .col-lg-19.bdr-r:before, .col-lg-18.bdr-r:before, .col-lg-17.bdr-r:before, .col-lg-16.bdr-r:before, .col-lg-15.bdr-r:before, .col-lg-14.bdr-r:before, .col-lg-13.bdr-r:before, .col-lg-12.bdr-r:before, .col-lg-11.bdr-r:before, .col-lg-10.bdr-r:before, .col-lg-9.bdr-r:before, .col-lg-8.bdr-r:before, .col-lg-7.bdr-r:before, .col-lg-6.bdr-r:before, .col-lg-5.bdr-r:before, .col-lg-4.bdr-r:before, .col-lg-3.bdr-r:before, .col-lg-2.bdr-r:before, .col-lg-1.bdr-r:before {
  content: '';
  background: #dfdfdf;
  width: 1px;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2
}
.col-lg-24 {
  width: 100%
}
.col-lg-23 {
  width: 95.83333333%
}
.col-lg-22 {
  width: 91.66666666%
}
.col-lg-21 {
  width: 87.5%
}
.col-lg-20 {
  width: 83.33333333%
}
.col-lg-19 {
  width: 79.16666666%
}
.col-lg-18 {
  width: 75%
}
.col-lg-17 {
  width: 70.83333333%
}
.col-lg-16 {
  width: 66.66666666%
}
.col-lg-15 {
  width: 62.5%
}
.col-lg-14 {
  width: 58.33333333%
}
.col-lg-13 {
  width: 54.16666666%
}
.col-lg-12 {
  width: 50%
}
.col-lg-12:nth-child(2n+1) {
  clear: both
}
.col-lg-11 {
  width: 45.83333333%
}
.col-lg-10 {
  width: 41.66666666%
}
.col-lg-9 {
  width: 37.5%
}
.col-lg-8 {
  width: 33.33333333%
}
.col-lg-8:nth-child(3n+1) {
  clear: both
}
.col-lg-7 {
  width: 29.16666666%
}
.col-lg-6 {
  width: 25%
}
.col-lg-6:nth-child(4n+1) {
  clear: both
}
.col-lg-5 {
  width: 20%
}
.col-lg-5:nth-child(5n+1) {
  clear: both
}
.col-lg-4 {
  width: 16.66666666%
}
.col-lg-4:nth-child(6n+1) {
  clear: both
}
.col-lg-3 {
  width: 12.5%
}
.col-lg-2 {
  width: 8.33333333%
}
.col-lg-2:nth-child(12n+1) {
  clear: both
}
.col-lg-1 {
  width: 4.16666666%
}
}