@charset "UTF-8";
@import url("https://fonts.googleapis.com/earlyaccess/roundedmplus1c.css");
/*
100=Thin (Hairline)
300=Light
400=Normal
500=Medium
700=Bold
800=Extra Bold (Ultra Bold)
900=Black (Heavy)
*/
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
/*フォントウェイト　100,300,350,400,500,700,900*/
body {
  font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-size: 18px;
  color: #2F3031;
  /*メインで使用するフォントが明朝体のとき
  font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
  */
  /*メインで使用するフォントが丸ゴシックのとき
  font-family: "Rounded Mplus 1c",'Avenir','Helvetica Neue','Helvetica','Arial','Hiragino Sans','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';*/
  /*メインで使用するフォントはNotoSansのとき
  font-family: 'Noto Sans Japanese', sans-serif;*/ }

img {
  max-width: 100%;
  height: auto; }

a:hover {
  text-decoration: none; }

/*/////////////////////////////
共通装飾クラス
/////////////////////////////*/
.contentswrap {
  max-width: 870px;
  margin: 0 auto;
  width: 92%; }

.txt {
  line-height: 1.8; }
  @media screen and (max-width: 767px) {
    .txt {
      font-size: 15px; } }

.centerTxt {
  text-align: center; }

.dflex {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap; }

/*/////////////////////////////
共通レイアウト
/////////////////////////////*/
#header {
  text-align: center;
  height: 66px;
  background: #fff;
  position: fixed;
  width: 100%;
  padding-top: 14px;
  border-bottom: 1px solid #23B3BD;
  z-index: 10; }
  @media screen and (max-width: 767px) {
    #header {
      height: 50px; } }
  #header img {
    max-width: 220px;
    height: auto; }
    @media screen and (max-width: 767px) {
      #header img {
        width: 60%;
        max-width: 140px; } }

.ttl_app {
  text-align: center;
  margin-bottom: 30px;
  font-weight: bold; }
  @media screen and (max-width: 767px) {
    .ttl_app {
      font-size: 16px;
      margin-bottom: 10px; } }
  .ttl_app span.small {
    display: block;
    font-size: 16px; }
  .ttl_app span:not(.small) {
    color: #23B3BD;
    font-family: "秀英丸ゴシック B"; }
    @media screen and (max-width: 767px) {
      .ttl_app span:not(.small) {
        display: block;
        font-size: 25px; } }

.btn {
  display: inline-block;
  border: 1px solid #2F3031;
  padding: 10px 50px;
  border-radius: 25px;
  font-size: 14px;
  position: relative;
  background: #fff; }
  @media screen and (max-width: 767px) {
    .btn {
      padding: 10px;
      display: block;
      letter-spacing: -0.05rem; } }
  .btn:after {
    display: block;
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 0 8px 14px;
    border-color: transparent transparent transparent #23B3BD;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%); }
  .btn:hover {
    transform: scale(1.05); }
    @media screen and (max-width: 767px) {
      .btn:hover {
        transform: none; } }

.pagelink:before {
  content: " ";
  margin-top: -65px;
  height: 65px;
  display: block;
  visibility: hidden; }
  @media screen and (max-width: 767px) {
    .pagelink:before {
      margin-top: -50px;
      height: 50px; } }

#app_ctnts .dflex {
  align-items: center;
  justify-content: center;
  margin-bottom: 30px; }
  @media screen and (max-width: 767px) {
    #app_ctnts .dflex {
      margin-bottom: 20px; } }
  #app_ctnts .dflex figure {
    max-width: 120px; }
  #app_ctnts .dflex div {
    margin-left: 50px;
    text-align: center; }
    @media screen and (max-width: 767px) {
      #app_ctnts .dflex div {
        margin-left: 5%; } }
    #app_ctnts .dflex div p {
      font-size: 15px;
      color: #23B3BD;
      font-weight: bold;
      letter-spacing: -.05rem;
      position: relative;
      font-family: "秀英丸ゴシック B"; }
      @media screen and (max-width: 767px) {
        #app_ctnts .dflex div p {
          margin-top: 40px; } }
      #app_ctnts .dflex div p:before {
        display: inline-block;
        content: '';
        border-left: 1px solid #23B3BD;
        height: 20px;
        width: 1px;
        transform: rotate(-30deg);
        vertical-align: middle;
        margin-right: 20px; }
        @media screen and (max-width: 767px) {
          #app_ctnts .dflex div p:before {
            height: 40px;
            display: block;
            position: absolute;
            left: 15px;
            top: 0;
            transform: rotate(-20deg); } }
      #app_ctnts .dflex div p:after {
        display: inline-block;
        content: '';
        border-left: 1px solid #23B3BD;
        height: 20px;
        width: 1px;
        transform: rotate(30deg);
        vertical-align: middle;
        margin-left: 20px; }
        @media screen and (max-width: 767px) {
          #app_ctnts .dflex div p:after {
            height: 40px;
            display: block;
            position: absolute;
            right: 15px;
            top: 0;
            transform: rotate(20deg); } }
    #app_ctnts .dflex div img {
      display: block;
      margin: 15px auto;
      max-width: 155px; }
      @media screen and (max-width: 767px) {
        #app_ctnts .dflex div img.sp {
          display: none; } }
#app_ctnts .btn {
  margin-bottom: 40px; }
  #app_ctnts .btn:hover {
    transform: scale(1.05); }
#app_ctnts > p {
  font-size: 15px;
  margin-bottom: 30px;
  letter-spacing: -.05rem;
  font-weight: bold; }
  @media screen and (max-width: 767px) {
    #app_ctnts > p {
      text-align: left; } }
#app_ctnts .catch {
  color: #23B3BD;
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 20px;
  position: relative;
  font-family: "秀英丸ゴシック B"; }
  @media screen and (max-width: 767px) {
    #app_ctnts .catch {
      text-align: center;
      font-size: 18px; } }
  #app_ctnts .catch:before {
    display: inline-block;
    content: '';
    border-left: 1px solid #23B3BD;
    height: 30px;
    width: 1px;
    transform: rotate(-30deg);
    vertical-align: middle;
    margin-right: 50px; }
    @media screen and (max-width: 767px) {
      #app_ctnts .catch:before {
        height: 70px;
        display: block;
        position: absolute;
        left: 0;
        top: 20px;
        transform: rotate(-15deg); } }
  #app_ctnts .catch:after {
    display: inline-block;
    content: '';
    border-left: 1px solid #23B3BD;
    height: 30px;
    width: 1px;
    transform: rotate(30deg);
    vertical-align: middle;
    margin-left: 50px; }
    @media screen and (max-width: 767px) {
      #app_ctnts .catch:after {
        height: 70px;
        display: block;
        position: absolute;
        right: 0;
        top: 20px;
        transform: rotate(15deg); } }
  #app_ctnts .catch span {
    font-size: 15px; }
    @media screen and (max-width: 767px) {
      #app_ctnts .catch span {
        font-size: 12px; } }
#app_ctnts .txt {
  margin-top: 30px; }
  @media screen and (max-width: 767px) {
    #app_ctnts .txt {
      margin-top: 20px; } }
@media screen and (max-width: 767px) {
  #app_ctnts .qr {
    display: none !important; } }

#attention {
  font-size: 11px;
  margin-top: 30px;
  line-height: 1.6; }

#footer {
  text-align: center;
  font-size: 12px;
  font-weight: bold;
  padding: 20px 2%; }
  @media screen and (max-width: 767px) {
    #footer {
      margin-bottom: 100px; } }

#btnDL {
  position: fixed;
  bottom: 0;
  right: 5px;
  width: 95px;
  line-height: 0;
  z-index: 10;
  text-align: right; }

/*# sourceMappingURL=layout.css.map */
