@charset "UTF-8";
/**
 *
 *  コンテンツ共通
 *
 */
/*--------------------------------------------------------------------------
   webfont
---------------------------------------------------------------------------*/
.fontSans {
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif; }

.fontSerif {
  font-family: "Noto Serif JP", "ヒラギノ明朝 Pro W3", "Hiragino Kaku Mincho Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif; }

.fontDinSans {
  font-family: "din-condensed", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
  font-weight: 400;
  line-height: 1;
  white-space: nowrap; }

.fontDinSansLight {
  font-family: "din-condensed", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
  font-weight: 300;
  line-height: 1;
  white-space: nowrap; }

.fontVollkorn {
  font-family: "Vollkorn", "ヒラギノ明朝 Pro W3", "Hiragino Kaku Mincho Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif; }

/*--------------------------------------------------------------------------
   Container
---------------------------------------------------------------------------*/
#Container {
  width: 100%;
  overflow: hidden;
  background-color: #FFFFFF; }
  @media screen and (max-width: 960px) {
    #Container {
      width: 100%;
      min-width: 100%; } }

/*--------------------------------------------------------------------------
   Loading
---------------------------------------------------------------------------*/
#Loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  display: none; }
  #Loading .bg1 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 25.1%;
    background-color: #FFFFFF; }
  #Loading .bg2 {
    position: absolute;
    top: 25%;
    left: 0;
    width: 100%;
    height: 25.1%;
    background-color: #FFFFFF; }
  #Loading .bg3 {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 25.1%;
    background-color: #FFFFFF; }
  #Loading .bg4 {
    position: absolute;
    top: 75%;
    left: 0;
    width: 100%;
    height: 25.1%;
    background-color: #FFFFFF; }
  #Loading .box {
    position: absolute;
    width: 120px;
    height: 134px;
    top: 50%;
    left: 0;
    right: 0;
    margin: auto;
    transform: translateY(-50%); }
    @media screen and (max-width: 960px) {
      #Loading .box {
        width: 16.0vw;
        height: 17.86667vw; } }
    #Loading .box .flower {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 50%;
      left: 0;
      right: 0;
      transform: translateY(-50%);
      margin: auto; }
      #Loading .box .flower span {
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0; }
    #Loading .box .loader {
      color: #EEEEEE;
      font-size: 18px;
      width: 1em;
      height: 1em;
      position: absolute;
      top: 50%;
      left: 0;
      right: 0;
      margin: auto;
      border-radius: 50%;
      text-indent: -9999em;
      -webkit-animation: load4 1.3s infinite linear;
      animation: load4 1.3s infinite linear;
      transform: translateY(-50%) translateZ(0); }
      @media screen and (max-width: 960px) {
        #Loading .box .loader {
          font-size: 4.8vw; } }

@-webkit-keyframes load4 {
  0%,
  100% {
    box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0; }
  12.5% {
    box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em; }
  25% {
    box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em; }
  37.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em; }
  50% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em; }
  62.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em; }
  75% {
    box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0; }
  87.5% {
    box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em; } }

@keyframes load4 {
  0%,
  100% {
    box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0; }
  12.5% {
    box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em; }
  25% {
    box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em; }
  37.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em; }
  50% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em; }
  62.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em; }
  75% {
    box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0; }
  87.5% {
    box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em; } }

/*--------------------------------------------------------------------------
   共通ブロック
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
   Content
---------------------------------------------------------------------------*/
#Content {
  position: relative;
  width: 100%;
  margin: 0 auto;
  overflow: hidden;
  box-sizing: border-box;
  background-color: #FFFFFF; }
  @media screen and (max-width: 960px) {
    #Content {
      width: 100%; } }

#Contents {
  width: 66.42851vw;
  margin: 7.14285vw auto;
  box-sizing: border-box; }
  @media screen and (max-width: 960px) {
    #Contents {
      width: 78.66667vw;
      margin: 10.66667vw auto; } }

/*--------------------------------------------------------------------------
   Common__Mv
---------------------------------------------------------------------------*/
.Common__MvNone {
  position: relative; }

.Common__Mv1 {
  position: relative;
  z-index: 9;
  width: 100%;
  height: 375px; }
  @media screen and (max-width: 960px) {
    .Common__Mv1 {
      height: 76.0vw; } }
  .Common__Mv1:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 240px;
    background-color: #F4F6F9;
    z-index: 1; }
    @media screen and (max-width: 960px) {
      .Common__Mv1:before {
        height: 64.0vw; } }
  .Common__Mv1 .inner {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 2; }
    .Common__Mv1 .inner .ttl {
      position: absolute;
      font-family: 'Vollkorn', serif;
      font-size: 60px;
      z-index: 2;
      top: 90px;
      left: 10vw;
      margin-bottom: 40px; }
      @media screen and (max-width: 960px) {
        .Common__Mv1 .inner .ttl {
          top: 8.0vw;
          left: 6.66667vw;
          font-size: 10.13333vw; } }
    .Common__Mv1 .inner .bt {
      position: absolute;
      width: 215px;
      top: 200px;
      left: 10vw;
      z-index: 2; }
      @media screen and (max-width: 960px) {
        .Common__Mv1 .inner .bt {
          width: 36.0vw;
          top: 26.66667vw;
          left: 6.66667vw; } }
      .Common__Mv1 .inner .bt a {
        padding: 20px; }
        @media screen and (max-width: 960px) {
          .Common__Mv1 .inner .bt a {
            font-size: 3.73333vw;
            padding: 5.33333vw; } }
    .Common__Mv1 .inner .pic {
      position: absolute;
      bottom: 0;
      right: 0;
      width: auto;
      height: 335px;
      z-index: 1; }
      @media screen and (max-width: 960px) {
        .Common__Mv1 .inner .pic {
          width: 86.66667vw;
          height: auto; } }

.Common__Mv2 {
  position: relative;
  z-index: 9;
  width: 100%;
  height: 300px;
  padding-top: 50px;
  box-sizing: border-box; }
  @media screen and (max-width: 960px) {
    .Common__Mv2 {
      height: 80.0vw;
      padding-top: 8.0vw; } }
  .Common__Mv2:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 240px;
    background-color: #F4F6F9;
    z-index: 1; }
    @media screen and (max-width: 960px) {
      .Common__Mv2:before {
        height: 72.0vw; } }
  .Common__Mv2 .inner {
    position: relative;
    width: 75vw;
    height: 250px;
    z-index: 2;
    background: linear-gradient(90deg, #575757, #93928F);
    background-color: #575757; }
    @media screen and (max-width: 960px) {
      .Common__Mv2 .inner {
        width: 89.33333vw;
        height: 72.0vw; } }
    .Common__Mv2 .inner .ttl {
      position: absolute;
      font-family: 'Vollkorn', serif;
      font-size: 60px;
      z-index: 2;
      top: 40px;
      left: 10vw;
      margin-bottom: 40px;
      color: #FFFFFF; }
      @media screen and (max-width: 960px) {
        .Common__Mv2 .inner .ttl {
          top: 13.33333vw;
          left: 6.66667vw;
          font-size: 10.13333vw; } }
    .Common__Mv2 .inner .bt {
      position: absolute;
      width: 215px;
      top: 150px;
      left: 10vw;
      z-index: 2;
      background: none;
      border: 1px solid #FFFFFF; }
      @media screen and (max-width: 960px) {
        .Common__Mv2 .inner .bt {
          width: 36.0vw;
          top: auto;
          bottom: 13.33333vw;
          left: 6.66667vw; } }
      .Common__Mv2 .inner .bt a {
        padding: 20px;
        background: none; }
        @media screen and (max-width: 960px) {
          .Common__Mv2 .inner .bt a {
            font-size: 3.73333vw;
            padding: 5.33333vw; } }

/*--------------------------------------------------------------------------
   Breadcrumb
---------------------------------------------------------------------------*/
.Common__Breadcrumb {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 79vw;
  display: flex;
  align-items: center;
  font-size: 12px;
  margin: auto;
  padding: 15px 0;
  box-sizing: border-box;
  z-index: 10; }
  @media screen and (max-width: 960px) {
    .Common__Breadcrumb {
      display: none; } }
  .Common__Breadcrumb li {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 70%; }
  .Common__Breadcrumb a {
    display: inline-block; }
    .Common__Breadcrumb a:after {
      display: inline-block;
      content: "";
      position: relative;
      top: 50%;
      left: 0;
      margin: auto;
      width: 5px;
      height: 5px;
      border-top: 1px solid #000000;
      border-right: 1px solid #000000;
      transform: translateY(-50%) rotate(45deg);
      margin-left: 10px;
      margin-right: 10px;
      box-sizing: border-box; }
      @media screen and (max-width: 960px) {
        .Common__Breadcrumb a:after {
          margin-left: 1.33333vw;
          margin-right: 1.33333vw;
          width: 0.66667vw;
          height: 0.66667vw; } }
    .Common__Breadcrumb a:hover {
      transition: all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000); }

/*--------------------------------------------------------------------------
   共通パーツ　リンク
---------------------------------------------------------------------------*/
.Common__Bt {
  width: 350px;
  margin: auto; }
  @media screen and (max-width: 960px) {
    .Common__Bt {
      width: 100%;
      margin: 0 auto; } }
  .Common__Bt a {
    box-sizing: border-box;
    padding: 30px;
    display: inline-block;
    width: 100%;
    height: 100%;
    color: #FFFFFF;
    background-color: #444444;
    text-align: center;
    line-height: 1; }
    @media screen and (max-width: 960px) {
      .Common__Bt a {
        padding: 6.66667vw; } }
    .Common__Bt a:hover {
      opacity: 0.8;
      transition: all 0.3s cubic-bezier(0.230, 1.000, 0.320, 1.000); }

.Common__BtBlank a {
  position: relative; }
  .Common__BtBlank a:after {
    content: "";
    display: block;
    width: 12px;
    height: 12px;
    position: absolute;
    top: 50%;
    right: 30px;
    transform: translateY(-50%);
    background-image: url("../../images/common/ico_blank.png");
    background-repeat: no-repeat;
    background-size: cover; }
    @media screen and (max-width: 960px) {
      .Common__BtBlank a:after {
        width: 3.2vw;
        height: 3.2vw;
        right: 6.66667vw; } }

/*--------------------------------------------------------------------------
   共通パーツ　その他
---------------------------------------------------------------------------*/
.common-sup {
  font-size: 60%;
  vertical-align: top;
  position: relative;
  top: 0; }

.common-sub {
  font-size: 60%;
  vertical-align: bottom;
  position: relative;
  top: 0; }

.common-indent1 {
  padding-left: 1em;
  text-indent: -1em; }

.common-indent1-5 {
  padding-left: 1.5em;
  text-indent: -1.5em; }

.common-indent2 {
  padding-left: 2em;
  text-indent: -2em; }

.common-indent2-5 {
  padding-left: 2.5em;
  text-indent: -2.5em; }