@charset "UTF-8";
/*ブレークポイント*/
/*調整用*/
html {
  width: 100%;
  height: 100%;
  position: relative; }

body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  min-height: 100%;
  color: #222;
  font-style: normal;
  font-size: 15px;
  line-height: 1.3;
  -webkit-text-size-adjust: 100%;
  position: relative;
  background: #fff;
  font-family: -apple-system, BlinkMacSystemFont, "メイリオ", Meiryo, "Helvetica Neue", "Segoe UI", sans-serif; }

/*iosスクロール対策*/
.displayContainer {
  height: 100vh;
  overflow: scroll;
  -webkit-overflow-scrolling: touch; }

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

/*文字折り返し*/
pre {
  white-space: pre;
  /* CSS 2.0 */
  white-space: pre-wrap;
  /* CSS 2.1 */
  white-space: pre-line;
  /* CSS 3.0 */
  white-space: -pre-wrap;
  /* Opera 4-6 */
  white-space: -o-pre-wrap;
  /* Opera 7 */
  white-space: -moz-pre-wrap;
  /* Mozilla */
  white-space: -hp-pre-wrap;
  /* HP Printers */
  word-wrap: break-word;
  /* IE 5+ */ }

/*clearfix
----------------------*/
.clearfix:after {
  content: "";
  display: block;
  clear: both; }

/*文字関係
----------------------*/
a {
  font-family: -apple-system, BlinkMacSystemFont, "メイリオ", Meiryo, "Helvetica Neue", "Segoe UI", sans-serif;
  text-decoration: none; }

p {
  font-family: -apple-system, BlinkMacSystemFont, "メイリオ", Meiryo, "Helvetica Neue", "Segoe UI", sans-serif;
  font-size: 15px;
  line-height: 1.4; }
  @media (min-width: 768px) {
    p {
      font-size: 15px;
      letter-spacing: 0.5px; } }

/*PC/SP出し分け
----------------------*/
.spOnly {
  display: block; }
  @media (min-width: 768px) {
    .spOnly {
      display: none; } }

.pcOnly {
  display: none; }
  @media (min-width: 768px) {
    .pcOnly {
      display: block; } }

/*hover*/
a:hover {
  opacity: 0.7;
  transition-duration: 0.6s; }

/*フォーム類初期化*/
input,
select,
button {
  font-family: -apple-system, BlinkMacSystemFont, "メイリオ", Meiryo, "Helvetica Neue", "Segoe UI", sans-serif;
  display: block;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
  border: none;
  text-align: left;
  font-size: 13px;
  background: none; }

textarea {
  font-family: -apple-system, BlinkMacSystemFont, "メイリオ", Meiryo, "Helvetica Neue", "Segoe UI", sans-serif;
  display: block;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
  border: none;
  resize: none;
  font-size: 13px;
  text-align: left; }

/*暗転背景
-----------------------*/
#overlay {
  width: 100%;
  height: 100%;
  background: #000;
  margin: auto;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: none;
  -ms-filter: alpha(opacity=0.9);
  -moz-opacity: 0.6;
  opacity: 0.6;
  z-index: 100; }

/*ヘッダー
-----------------------*/
/*sp*/
section.spHeader {
  width: 100%;
  height: 50px;
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
  display: block;
  background: #222;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100; }
  @media (min-width: 768px) {
    section.spHeader {
      display: none; } }
  section.spHeader h1 {
    width: 227px;
    height: 50px;
    margin: 0 auto;
    padding: 0 10px;
    box-sizing: border-box;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 0 0 2px 2px; }
    section.spHeader h1 img {
      width: 207px;
      height: auto;
      margin: auto;
      padding: 0;
      box-sizing: border-box;
      display: block;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0; }
  section.spHeader .menuBtn {
    width: 40px;
    height: 40px;
    margin: auto;
    padding: 0;
    display: block;
    box-sizing: border-box;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 5px;
    z-index: 100;
    cursor: pointer;
    display: block; }
    section.spHeader .menuBtn span {
      display: block;
      background: #fff;
      width: 20px;
      height: 3px;
      position: absolute;
      left: 0;
      right: 0;
      margin: auto;
      transition: all 0.3s;
      -webkit-transition: all 0.3s;
      -moz-transition: all 0.3s; }
      section.spHeader .menuBtn span:nth-child(1) {
        top: 10px; }
      section.spHeader .menuBtn span:nth-child(2) {
        top: 18px; }
      section.spHeader .menuBtn span:nth-child(3) {
        top: 18px; }
      section.spHeader .menuBtn span:nth-child(4) {
        top: 26px; }
    section.spHeader .menuBtn.open span:nth-child(1) {
      opacity: 0; }
    section.spHeader .menuBtn.open span:nth-child(2) {
      -webkit-transform: rotate(-135deg);
      transform: rotate(-135deg); }
    section.spHeader .menuBtn.open span:nth-child(3) {
      -webkit-transform: rotate(-225deg);
      transform: rotate(-225deg); }
    section.spHeader .menuBtn.open span:nth-child(4) {
      opacity: 0; }

/*導入文*/
p.introMsg {
  display: none; }
  @media (min-width: 768px) {
    p.introMsg {
      width: 100%;
      min-width: 960px;
      height: 20px;
      margin: 0 auto;
      padding: 0 10px;
      box-sizing: border-box;
      display: block;
      color: #fff;
      background: #222;
      font-size: 10px;
      line-height: 20px; } }

/*フッター
-----------------------*/
footer {
  width: 100%;
  height: auto;
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
  display: block;
  background: #222; }
  @media (min-width: 768px) {
    footer {
      min-width: 960px; } }
  footer section.copyRight {
    width: 100%;
    height: auto;
    margin: 0 auto;
    padding: 8px 0;
    box-sizing: border-box;
    display: block;
    background: #d8e2ea; }
    @media (min-width: 768px) {
      footer section.copyRight {
        padding: 20px 0; } }
    footer section.copyRight p {
      width: 100%;
      height: auto;
      margin: 0 auto;
      padding: 0;
      box-sizing: border-box;
      display: block;
      font-size: 13px;
      text-align: center; }
    footer section.copyRight br {
      display: block; }
      @media (min-width: 768px) {
        footer section.copyRight br {
          display: none; } }

/*spメニュー
----------------*/
nav.spMenu {
  width: 100%;
  height: auto;
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
  display: none;
  position: absolute;
  top: 50px;
  left: 0;
  z-index: 200; }
  nav.spMenu .scrollWrapper {
    height: 100vh;
    overflow: scroll;
    -webkit-overflow-scrolling: touch; }
  nav.spMenu .menuInner {
    width: 100%;
    height: auto;
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
    display: block;
    background: #222; }
    nav.spMenu .menuInner ul.menuWrapper {
      width: 100%;
      height: auto;
      margin: 0 auto;
      padding: 0;
      box-sizing: border-box;
      display: block; }
      nav.spMenu .menuInner ul.menuWrapper li {
        width: 100%;
        height: auto;
        margin: 0 auto;
        padding: 0;
        box-sizing: border-box;
        display: block;
        border-bottom: 1px solid #fff; }
        nav.spMenu .menuInner ul.menuWrapper li a {
          width: 100%;
          height: auto;
          margin: 0 auto;
          padding: 15px 10px;
          box-sizing: border-box;
          display: block;
          color: #fff;
          position: relative; }

/*pcメニュー
----------------*/
.pcHeader {
  display: none; }
  @media (min-width: 768px) {
    .pcHeader {
      width: 100%;
      min-width: 960px;
      height: 90px;
      margin: 0 auto;
      padding: 0;
      box-sizing: border-box;
      display: block;
      background: #222;
      box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.4);
      text-align: center;
      position: relative; }
      .pcHeader .headerInner {
        width: 960px;
        height: 90px;
        margin: 0 auto;
        padding: 0;
        box-sizing: border-box;
        display: block;
        position: relative; }
      .pcHeader h1 {
        width: 320px;
        height: 90px;
        margin: 0 auto;
        padding: 0;
        box-sizing: border-box;
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        border-radius: 0 0 2px 2px; }
        .pcHeader h1 img {
          width: 320px;
          height: auto;
          margin: auto;
          padding: 0;
          box-sizing: border-box;
          display: block;
          position: absolute;
          top: 0;
          bottom: 0;
          left: 15px;
          right: 0; }
      .pcHeader ul.menuWrapper {
        width: 555px;
        height: 90px;
        margin: auto;
        padding: 10px 0;
        box-sizing: border-box;
        display: inline-block;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0; }
        .pcHeader ul.menuWrapper li {
          width: 185px;
          height: 70px;
          margin: 0 auto;
          padding: 0 5px;
          box-sizing: border-box;
          display: block;
          text-align: center;
          float: left;
          position: relative;
          border-right: 1px dashed #fff; }
          .pcHeader ul.menuWrapper li:last-child {
            border: none; }
        .pcHeader ul.menuWrapper a {
          width: 100%;
          height: 100%;
          margin: 0 auto;
          text-decoration: none;
          font-size: 14px;
          font-weight: bold;
          display: block;
          position: relative;
          color: #fff;
          border-radius: 3px; }
          .pcHeader ul.menuWrapper a:hover {
            opacity: 1.0;
            background: #555; }
          .pcHeader ul.menuWrapper a p.menuTxt {
            width: 100%;
            height: auto;
            margin: 0 auto;
            padding: 0;
            box-sizing: border-box;
            display: block;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translateY(-50%) translateX(-50%); }
            .pcHeader ul.menuWrapper a p.menuTxt span.subTxt {
              width: 100%;
              height: auto;
              margin: 0 auto;
              padding: 0;
              box-sizing: border-box;
              display: block;
              font-size: 12px;
              font-weight: normal; } }

/* 下層ヘッダー
----------------*/
.pageHeader {
  width: 100%;
  height: 150px;
  margin: 0 auto;
  padding: 0;
  box-sizing: border-box;
  display: block;
  background: url(../img/lower_header.jpg) 50% 50% no-repeat;
  background-size: cover;
  position: relative; }
  @media (min-width: 768px) {
    .pageHeader {
      height: 200px;
      min-width: 960px; } }
  .pageHeader:after {
    content: "";
    width: 100%;
    height: auto;
    padding: 0;
    margin: auto;
    box-sizing: border-box;
    display: block;
    background: rgba(0, 0, 0, 0.5);
    background-size: cover;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0; }
  .pageHeader h2 {
    width: auto;
    height: auto;
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    z-index: 10; }
    .pageHeader h2 p.titleTxt {
      width: auto;
      height: auto;
      margin: 0 auto;
      padding: 0;
      box-sizing: border-box;
      display: inline-block;
      color: #fff;
      border-bottom: 1px solid #fff; }
    .pageHeader h2 p.subTxt {
      color: #fff; }

/*トップへ戻る*/
.backBtn {
  width: 40px;
  height: 40px;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  background: url(../img/btn_page_top.png) 50% 50% no-repeat #fff;
  background-size: 30px 30px;
  cursor: pointer;
  position: fixed;
  bottom: 5px;
  right: 5px;
  z-index: 90;
  border-radius: 2px;
  box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.4); }

.backBtn:hover {
  transition-duration: 0.6s;
  opacity: 0.7; }