@charset "UTF-8";
@-ms-viewport {
  width: device-width; }

/*--------------------------------------------------------------------------
CSS　カスタム設定(style.css)ver.1 2022.10.05
--------------------------------------------------------------------------*/
/*■■■■■■ 基本設定 ■■■■■■■*/
/*■■■■■■ loading ■■■■■■■*/
#loading {
  width: 100vw;
  height: 100vh;
  -webkit-transition: all 1s;
  -o-transition: all 1s;
  transition: all 1s;
  background-color: #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-flow: column;
  flex-flow: column;
  top: 0;
  left: 0;
  z-index: 9999; }
  #loading img {
    margin: auto; }

.loaded {
  opacity: 0;
  visibility: hidden; }

.loading-box {
  margin: auto;
  width: 200px;
  text-align: center; }

.flashing {
  margin: 0 0 10px; }
  .flashing img {
    width: 120px;
    heifht: auto; }

.animation-box {
  width: 400px;
  height: 4px;
  background: #FF0199;
  -webkit-animation-name: loadbar-animation;
  animation-name: loadbar-animation;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite; }

@-webkit-keyframes loadbar-animation {
  from {
    width: 0; }
  to {
    width: 200px; } }

@keyframes loadbar-animation {
  from {
    width: 0; }
  to {
    width: 200px; } }

/*■■■■■■ fadein ■■■■■■■*/
.fade-in {
  opacity: 0;
  -webkit-transition-duration: 1000ms;
  -o-transition-duration: 1000ms;
  transition-duration: 1000ms; }

.fade-in {
  opacity: 0;
  -webkit-transform: translateY(20px);
  -ms-transform: translateY(20px);
  transform: translateY(20px);
  -webkit-transition: opacity 1s ease-out, -webkit-transform 1s ease-out;
  transition: opacity 1s ease-out, -webkit-transform 1s ease-out;
  -o-transition: opacity 1s ease-out, transform 1s ease-out;
  transition: opacity 1s ease-out, transform 1s ease-out;
  transition: opacity 1s ease-out, transform 1s ease-out, -webkit-transform 1s ease-out; }

.fade-in.show {
  opacity: 1;
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0); }

.fade-in-up {
  -webkit-transform: translate(0, 60px);
  -ms-transform: translate(0, 60px);
  transform: translate(0, 60px); }

.fade-in-down {
  -webkit-transform: translate(0, -60px);
  -ms-transform: translate(0, -60px);
  transform: translate(0, -60px); }

.fade-in-left {
  -webkit-transform: translate(-60px, 0);
  -ms-transform: translate(-60px, 0);
  transform: translate(-60px, 0); }

.fade-in-right {
  -webkit-transform: translate(60px, 0);
  -ms-transform: translate(60px, 0);
  transform: translate(60px, 0); }

.scroll-in {
  opacity: 1;
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0); }

/*タイプ入力風*/
#typewriter {
  display: inline-block;
  white-space: nowrap;
  /* 改行を防ぐ */
  overflow: hidden;
  /* はじめは非表示 */
  border-right: 2px solid #fff;
  /* タイプライターのカーソル風 */
  padding-right: 5px;
  -webkit-animation: blinkCursor 0.8s infinite;
  animation: blinkCursor 0.8s infinite; }

@-webkit-keyframes blinkCursor {
  50% {
    border-color: transparent; } }

@keyframes blinkCursor {
  50% {
    border-color: transparent; } }

.typewriter-span, .typewriter-x {
  opacity: 0;
  -webkit-transition: opacity 0.3s;
  -o-transition: opacity 0.3s;
  transition: opacity 0.3s; }

/*■■■■■■ 主要タグ設定 ■■■■■■■*/
a:link, a:visited {
  color: #F380C5;
  -webkit-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s; }

a:hover, a:active {
  color: #000;
  -webkit-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s; }

/*■■■■■■ 汎用設定 ■■■■■■■*/
/*■■■■■■■ MAIN IMG ■■■■■■*/
.header-img-block_s {
  width: 100%;
  height: 0;
  margin: 0;
  padding: 28.125% 0 0 0;
  position: relative; }

.bg-contact-img {
  background: url(../images/contact-img.jpg) center center no-repeat;
  background-size: cover; }

.bg-main {
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(30%, #f380c5), to(#ff0199));
  background-image: -webkit-linear-gradient(top, #f380c5 30%, #ff0199);
  background-image: -o-linear-gradient(top, #f380c5 30%, #ff0199);
  background-image: linear-gradient(180deg, #f380c5 30%, #ff0199);
  color: #FFF; }

.bg-sub {
  background-image: repeating-linear-gradient(-45deg, rgba(50, 50, 50, 0.15) 0px, rgba(50, 50, 50, 0.15) 20px, rgba(80, 80, 80, 0) 20px, rgba(80, 80, 80, 0) 40px), -webkit-gradient(linear, left top, left bottom, color-stop(30%, rgba(150, 150, 150, 0.6)), to(#646464));
  background-image: -webkit-repeating-linear-gradient(135deg, rgba(50, 50, 50, 0.15) 0px, rgba(50, 50, 50, 0.15) 20px, rgba(80, 80, 80, 0) 20px, rgba(80, 80, 80, 0) 40px), -webkit-linear-gradient(top, rgba(150, 150, 150, 0.6) 30%, #646464);
  background-image: -o-repeating-linear-gradient(135deg, rgba(50, 50, 50, 0.15) 0px, rgba(50, 50, 50, 0.15) 20px, rgba(80, 80, 80, 0) 20px, rgba(80, 80, 80, 0) 40px), -o-linear-gradient(top, rgba(150, 150, 150, 0.6) 30%, #646464);
  background-image: repeating-linear-gradient(-45deg, rgba(50, 50, 50, 0.15) 0px, rgba(50, 50, 50, 0.15) 20px, rgba(80, 80, 80, 0) 20px, rgba(80, 80, 80, 0) 40px), linear-gradient(180deg, rgba(150, 150, 150, 0.6) 30%, #646464);
  color: #FFF; }

.bg-pink {
  background: url(../images/bg-pink.jpg) center center no-repeat;
  background-size: cover; }

.bg-map {
  background: url(../images/bg-map.jpg) center center no-repeat;
  background-size: cover; }

.bg-recommend {
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(30%, #ff0199), to(black));
  background-image: -webkit-linear-gradient(top, #ff0199 30%, black);
  background-image: -o-linear-gradient(top, #ff0199 30%, black);
  background-image: linear-gradient(180deg, #ff0199 30%, black);
  position: relative; }

.bg-recommend:after {
  content: "";
  margin-left: -50px;
  width: 0;
  height: 0;
  position: absolute;
  left: 50%;
  bottom: -99px;
  border-style: solid;
  border-width: 50px 50px;
  border-color: #000 transparent transparent transparent; }

.header-img-ti {
  font-size: 8.5rem;
  line-height: 1.2;
  font-weight: bold;
  font-family: serif;
  color: #FFF;
  position: absolute;
  top: 20px;
  left: 20px;
  opacity: 0.7; }
  .header-img-ti span {
    margin: 20px 0 0 0;
    display: block;
    font-size: 30px; }

/*■■■■■■ CONTENTS MAIN ■■■■■■■*/
.main-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 100vh;
  /* ビューポート全体の高さ */ }

/* ヘッダー画像のブロック */
.header-main-img-block {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  /* 余ったスペースを埋める */
  width: 100%;
  background: url(../images/main-img.jpg) bottom center no-repeat;
  background-size: cover;
  position: relative; }

/*画像上文字*/
.head-main-read {
  color: #FFF;
  font-size: 4rem;
  line-height: 1.4;
  font-weight: 600;
  position: absolute;
  bottom: 50%;
  font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
  display: block;
  width: 100%;
  text-align: center;
  text-shadow: 1px 1px 10px #000; }

/* リード部分のブロック */
.read-contents-block {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  /* 縮小せずそのままの高さを確保 */
  padding: 30px 0;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(30%, #1e1e1e), to(black));
  background-image: -webkit-linear-gradient(top, #1e1e1e 30%, black);
  background-image: -o-linear-gradient(top, #1e1e1e 30%, black);
  background-image: linear-gradient(180deg, #1e1e1e 30%, black);
  color: #FFF; }

.contents-block {
  margin: 0;
  padding: 30px 0; }

.main-title {
  margin: 0 0 10px;
  font-size: 3.0rem;
  font-weight: 400; }
  .main-title span.typewriter-span {
    margin: 0 5px;
    display: inline-block;
    padding: 6px 15px 8px;
    background-color: #fff;
    border-radius: 10px;
    color: #FF0199;
    font-weight: 700;
    line-height: 1;
    -webkit-filter: drop-shadow(#FF0199 0 0 0.5rem);
    filter: drop-shadow(#FF0199 0 0 0.5rem); }
  .main-title span.typewriter-x {
    color: #fff; }

.main-read {
  font-size: 1.6rem;
  font-weight: 500; }

.sub-title {
  margin: 20px auto 0;
  padding: 5px 60px;
  font-size: 2.4rem;
  color: #FFF;
  background-color: #000;
  display: inline-block;
  border-radius: 5rem; }

.sub-title_p {
  margin: 20px auto 0;
  padding: 4px 60px 6px;
  font-size: 2.4rem;
  color: #FFF;
  background-color: #FF0199;
  display: inline-block;
  border-radius: 5rem; }

.sub-title_arrow {
  margin: 20px auto 0;
  padding: 4px 60px 6px;
  font-size: 2.4rem;
  line-height: 1.2;
  font-weight: 600;
  color: #000;
  background-color: #FFF;
  display: inline-block;
  border-radius: 5rem;
  position: relative; }

.sub-title_arrow:after {
  content: "";
  margin-left: -20px;
  width: 0;
  height: 0;
  position: absolute;
  left: 50%;
  bottom: -49px;
  border-style: solid;
  border-width: 25px 20px;
  border-color: #FFF transparent transparent transparent; }

/*■■■■■■ 思い ■■■■■■■*/
.text-top-read {
  margin: 60px 0;
  font-size: 2.2rem;
  line-height: 2;
  font-weight: 600;
  color: #663333; }

/*■■■■■■ 事業内容 ■■■■■■■*/
.product-flex-box {
  margin: 40px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }

.product-card {
  padding: 30px 15px;
  background: rgba(150, 150, 150, 0.1);
  border: 3px solid #666;
  border-radius: 2rem;
  width: 100%;
  height: 100%; }
  .product-card img {
    width: 140px; }

.product-card__title {
  margin: 20px 0;
  font-size: 3.2rem;
  line-height: 1.2;
  font-weight: 800;
  color: #FF0199; }
  .product-card__title small {
    font-size: 2.2rem; }

.product-card__read {
  font-size: 1.8rem;
  font-weight: 700; }

.product-card__description {
  margin: 20px 10px 0;
  padding: 0 0 0 1.8rem;
  text-align: left; }
  .product-card__description li {
    margin: 0 0 10px 0;
    line-height: 1.2;
    position: relative;
    text-indent: -1.2em; }
  .product-card__description li:before {
    content: '● ';
    color: #FF0199; }

/*オンラインコミュニティ　Re:Liveナビ*/
.btn-box a {
  margin: 0 auto 20px;
  padding: 15px 60px;
  display: inline-block;
  font-size: 3.4rem;
  font-weight: 800;
  border-radius: 2rem;
  position: relative; }
  .btn-box a small {
    font-size: 1.6rem;
    line-height: 1.2;
    font-weight: 600;
    display: block;
    color: #F380C5; }

.btn-box > a:link, .btn-box > a:visited {
  color: #FFF;
  background-color: #FF0199;
  border: 3px solid #F380C5; }
  .btn-box > a:link small, .btn-box > a:visited small {
    color: #FFF; }

.btn-box > a:hover, .btn-box > a:active {
  color: #FFF;
  border: 3px solid #FF0199;
  background-color: #F380C5; }

.btn-box a:after {
  content: '';
  margin: 0 0 -3px 10px;
  display: inline-block;
  background-image: url("../images/common/dot-ext-link.png");
  width: 30px;
  height: 30px;
  background-size: cover; }

/*■■■■■■ こんな人におススメ ■■■■■■■*/
.recommend-flex-box {
  margin: 40px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }

.recommend-card {
  padding: 30px 15px;
  background: rgba(255, 255, 255, 0.9);
  border: 3px solid #F380C5;
  border-radius: 2rem;
  width: 100%;
  height: 100%; }
  .recommend-card img {
    width: 140px; }

.recommend-card__title {
  margin: 20px 0;
  padding: 10px;
  background-color: #FF0199;
  font-size: 3.2rem;
  line-height: 1.2;
  font-weight: 800;
  color: #FFF; }
  .recommend-card__title small {
    font-size: 2.2rem; }

.recommend-card__read {
  font-size: 1.8rem;
  font-weight: 700; }

.recommend-card__description {
  margin: 20px 10px 0;
  padding: 0 0 0 1.8rem;
  text-align: left;
  color: #000; }
  .recommend-card__description li {
    margin: 0 0 10px 0;
    line-height: 1.2;
    position: relative;
    text-indent: -1.2em; }
  .recommend-card__description li:before {
    content: '● ';
    color: #FF0199; }

/*■■■■■■ 実績紹介 ■■■■■■■*/
.support-box {
  margin: 50px 0 0 0;
  padding: 40px 20px;
  border-radius: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  background-color: #FFF;
  color: #222;
  position: relative;
  -webkit-filter: drop-shadow(#E576BD 0 0 0.5rem);
  filter: drop-shadow(#E576BD 0 0 0.5rem); }

.support-ti {
  padding: 5px 30px;
  height: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  background-color: #FF0199;
  font-size: 2.4rem;
  color: #FFF;
  font-weight: 600;
  position: absolute;
  z-index: 40;
  top: -30px;
  left: 0; }

.support-ti:after {
  content: "";
  margin-left: -10px;
  width: 0;
  height: 0;
  position: absolute;
  right: -49px;
  bottom: 0;
  border-style: solid;
  border-width: 25px 25px;
  border-color: transparent transparent #FF0199 #FF0199; }

.support-icon {
  margin: auto;
  padding: 0 20px; }
  .support-icon img {
    width: 140px;
    height: auto; }

.support-list {
  margin: auto;
  text-align: left; }
  .support-list dt {
    padding: 10px 0 0 0;
    font-size: 1.8rem; }
  .support-list dt:before {
    content: '● ';
    color: #FF0199; }
  .support-list dd {
    padding: 0 0 10px 1.8rem; }

/*■■■■■■ 会社概要 ■■■■■■■*/
.profile {
  margin: 20px auto;
  widht: auto;
  font-size: 1.8rem; }
  .profile th {
    padding: 5px;
    color: #FF0199;
    text-align: right; }
  .profile td {
    padding: 5px;
    text-align: left;
    font-weight: 600; }
    .profile td br {
      display: none; }

/*■■■■■■ メールフォーム ■■■■■■■*/
.mfp_rows {
  clear: both; }

.mfp_rows:after {
  content: "";
  clear: both;
  height: 0;
  display: block;
  visibility: hidden; }

.mfp_rows input[type="text"],
.mfp_rows input[type="email"],
.mfp_rows input[type="tel"],
.mfp_rows input[type="number"],
.mfp_rows input[type="date"],
.mfp_rows input[type="file"],
.mfp_rows select,
.mfp_rows button,
form#mailformpro .mfp_rows label {
  width: 100%;
  min-width: 100%;
  word-break: break-all;
  white-space: normal; }

.mfp_rows textarea {
  width: 100%;
  min-width: 100%; }

.mfp_rows .mfp_col1, .mfp_rows .mfp_col2, .mfp_rows .mfp_col3, .mfp_rows .mfp_col4, .mfp_rows .mfp_col5, .mfp_rows .mfp_col6, .mfp_rows .mfp_col7, .mfp_rows .mfp_col8, .mfp_rows .mfp_col9, .mfp_rows .mfp_col10, .mfp_rows .mfp_col25 {
  float: left;
  padding: 0 1.5%; }

.mfp_rows .mfp_col1 {
  width: 10%; }

.mfp_rows .mfp_col2 {
  width: 20%; }

.mfp_rows .mfp_col3 {
  width: 30%; }

.mfp_rows .mfp_col4 {
  width: 40%; }

.mfp_rows .mfp_col5 {
  width: 50%; }

.mfp_rows .mfp_col6 {
  width: 60%; }

.mfp_rows .mfp_col7 {
  width: 70%; }

.mfp_rows .mfp_col8 {
  width: 80%; }

.mfp_rows .mfp_col9 {
  width: 90%; }

.mfp_rows .mfp_col10 {
  width: 100%; }

.mfp_rows .mfp_col25 {
  width: 25%; }

/*■■■■■■ プライバシーポリシー ■■■■■■■*/
.pp-box {
  margin: 20px 0; }
  .pp-box dt {
    margin: 10px 0 5px;
    font-size: 1.8rem;
    border-bottom: 6px solid #F380C5;
    display: inline-block; }
  .pp-box dd {
    padding: 0 0 15px;
    margin: 0 0 15px 0;
    border-bottom: 1px dotted #333; }
    .pp-box dd ul {
      margin: 10px 0 0 2rem;
      list-style-type: disc; }

.btn-normal {
  margin: 10px auto;
  display: inline-block;
  padding: 10px 30px;
  border-radius: 5rem;
  background-color: #CCC;
  font-weight: 600; }

.btn-normal:hover {
  background-color: #F380C5; }

/*===============================
■■　スマホ用　■■
===============================*/
/*------------(XS)------------*/
@media (min-width: 320px) and (max-width: 566px) {
  /*■■■■■■ メインイメージ（XS） ■■■■■■■*/
  .main-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100vh;
    /* ビューポート全体の高さ */ }
  /* ヘッダー画像のブロック */
  .header-main-img-block {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    /* 余ったスペースを埋める */
    width: 100%;
    background: url(../images/main-img.jpg) center center no-repeat;
    background-size: cover; }
  /*画像上文字*/
  .head-main-read {
    font-size: 2.4rem;
    bottom: 50%;
    text-shadow: 0 0 10px #000; }
  .sub-title_arrow {
    padding: 6px 60px 8px;
    font-size: 2rem;
    line-height: 1.4; }
  /*■■■■■■ キャッチコピー（XS） ■■■■■■■*/
  .main-title {
    margin: 0 0 5px;
    font-size: 2rem;
    font-weight: 400; }
    .main-title span.typewriter-span {
      margin: 0 5px;
      display: block;
      padding: 6px 15px;
      background-color: #fff;
      border-radius: 10px;
      color: #FF0199;
      font-weight: 700;
      line-height: 1;
      -webkit-filter: drop-shadow(#FF0199 0 0 0.5rem);
      filter: drop-shadow(#FF0199 0 0 0.5rem); }
    .main-title span.typewriter-x {
      color: #fff; }
  .main-read {
    margin: 20px 0 0 0;
    font-size: 1.6rem;
    font-weight: 500; }
  .sub-title {
    margin: 20px auto 0;
    padding: 5px 60px;
    font-size: 2.0rem;
    color: #FFF;
    background-color: #000;
    display: inline-block;
    border-radius: 5rem; }
  .sub-title_p {
    margin: 20px auto 0;
    padding: 5px 60px;
    font-size: 2.0rem;
    color: #FFF;
    background-color: #FF0199;
    display: inline-block;
    border-radius: 5rem; }
  /*■■■■■■ 思い(XS) ■■■■■■■*/
  .text-top-read {
    margin: 30px 0;
    font-size: 1.6rem;
    line-height: 1.6;
    font-weight: 600;
    color: #663333; }
  /*■■■■■■ 事業内容（XS） ■■■■■■■*/
  .product-flex-box {
    margin: 40px 0 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .product-card {
    margin: 0 0 20px;
    padding: 30px 15px;
    background: rgba(150, 150, 150, 0.1);
    border: 3px solid #666;
    border-radius: 2rem;
    width: 100%;
    height: auto; }
    .product-card img {
      width: 100px; }
  .product-card__title {
    margin: 20px 0;
    font-size: 2.4rem;
    line-height: 1.2;
    font-weight: 800;
    color: #FF0199; }
    .product-card__title small {
      font-size: 1.8rem; }
  .product-card__read {
    font-size: 1.8rem;
    font-weight: 700; }
  .product-card__description {
    margin: 20px 10px 0;
    padding: 0 0 0 1.8rem;
    text-align: left; }
    .product-card__description li {
      margin: 0 0 10px 0;
      line-height: 1.2;
      position: relative;
      text-indent: -1.2em; }
    .product-card__description li:before {
      content: '● ';
      color: #FF0199; }
  /*オンラインコミュニティ　Re:Liveナビ*/
  .btn-box a {
    padding: 10px 30px;
    font-size: 2.8rem; }
  .btn-box a:after {
    margin: 0 0 -2px 10px;
    width: 26px;
    height: 26px; }
  /*■■■■■■ こんな人におススメ(XS) ■■■■■■■*/
  .recommend-flex-box {
    margin: 40px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .recommend-card {
    margin: 0 0 20px;
    padding: 30px 15px;
    background: rgba(255, 255, 255, 0.9);
    border: 3px solid #F380C5;
    border-radius: 2rem;
    width: 100%;
    height: auto; }
    .recommend-card img {
      width: 140px; }
  .recommend-card__title {
    margin: 20px 0;
    padding: 10px;
    background-color: #FF0199;
    font-size: 2.4rem;
    line-height: 1.2;
    font-weight: 800;
    color: #FFF; }
    .recommend-card__title small {
      font-size: 2.2rem; }
  .recommend-card__read {
    font-size: 1.8rem;
    font-weight: 700; }
  .recommend-card__description {
    margin: 20px 10px 0;
    padding: 0 0 0 1.8rem;
    text-align: left;
    color: #000; }
    .recommend-card__description li {
      margin: 0 0 10px 0;
      line-height: 1.2;
      position: relative;
      text-indent: -1.2em; }
    .recommend-card__description li:before {
      content: '● ';
      color: #FF0199; }
  /*■■■■■■ 実績紹介(XS) ■■■■■■■*/
  .support-box {
    margin: 50px 0 0 0;
    padding: 40px 20px;
    border-radius: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    background-color: #FFF;
    color: #222;
    position: relative; }
  .support-ti {
    padding: 9px 30px;
    height: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #FF0199;
    font-size: 1.6rem;
    line-height: 1.2;
    color: #FFF;
    font-weight: 600;
    position: absolute;
    z-index: 40;
    top: -30px;
    left: 0; }
  .support-icon {
    margin: auto; }
    .support-icon img {
      width: 140px;
      height: auto; }
  .support-list {
    margin: auto;
    text-align: left; }
    .support-list dt {
      padding: 10px 0 5px 0;
      font-size: 1.8rem;
      line-height: 1.4; }
    .support-list dd {
      padding: 0 0 10px 0; }
  /*■■■■■■ 会社概要(XS) ■■■■■■■*/
  .profile {
    margin: 20px auto;
    widht: auto;
    font-size: 1.8rem; }
    .profile th {
      padding: 10px 0 0;
      color: #FF0199;
      text-align: center;
      display: block; }
    .profile td {
      padding: 0 0 10px;
      text-align: center;
      font-weight: 600;
      display: block; }
      .profile td br {
        display: block; } }

/*xs*/
/*------------(SM)------------*/
@media (min-width: 567px) and (max-width: 767px) {
  /*■■■■■■ メインイメージ（XS） ■■■■■■■*/
  /*画像上文字*/
  .head-main-read {
    font-size: 3rem;
    bottom: 40%;
    text-shadow: 0 0 10px #000; }
  /*■■■■■■ キャッチコピー（SM） ■■■■■■■*/
  .main-title {
    margin: 0 0 5px;
    font-size: 2.6rem;
    font-weight: 400; }
    .main-title span.typewriter-span {
      margin: 0 5px;
      display: block;
      padding: 6px 15px;
      background-color: #fff;
      border-radius: 10px;
      color: #FF0199;
      font-weight: 700;
      line-height: 1;
      -webkit-filter: drop-shadow(#FF0199 0 0 0.5rem);
      filter: drop-shadow(#FF0199 0 0 0.5rem); }
  .main-read {
    margin: 20px 0 0 0;
    font-size: 1.6rem;
    font-weight: 500; }
  .sub-title {
    margin: 20px auto 0;
    padding: 5px 60px;
    font-size: 2.4rem;
    color: #FFF;
    background-color: #000;
    display: inline-block;
    border-radius: 5rem; }
  .sub-title_p {
    margin: 20px auto 0;
    padding: 5px 60px;
    font-size: 2.4rem;
    color: #FFF;
    background-color: #FF0199;
    display: inline-block;
    border-radius: 5rem; }
  /*■■■■■■ 事業内容（SM） ■■■■■■■*/
  .product-flex-box {
    margin: 40px 0 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .product-card {
    margin: 0 0 20px;
    padding: 30px 15px;
    background: rgba(150, 150, 150, 0.1);
    border: 3px solid #666;
    border-radius: 2rem;
    width: 100%;
    height: auto; }
    .product-card img {
      width: 140px; }
  .product-card__title {
    margin: 20px 0;
    font-size: 3.4rem;
    line-height: 1.2;
    font-weight: 800;
    color: #FF0199; }
    .product-card__title small {
      font-size: 2rem; }
  .product-card__read {
    font-size: 2rem;
    font-weight: 700; }
  .product-card__description {
    margin: 20px 10px 0;
    padding: 0 0 0 1.8rem;
    text-align: left; }
    .product-card__description li {
      margin: 0 0 10px 0;
      line-height: 1.2;
      position: relative;
      text-indent: -1.2em; }
    .product-card__description li:before {
      content: '● ';
      color: #FF0199; }
  /*■■■■■■ こんな人におススメ(SM) ■■■■■■■*/
  .recommend-flex-box {
    margin: 40px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .recommend-card {
    margin: 0 0 20px;
    padding: 30px 15px;
    background: rgba(255, 255, 255, 0.9);
    border: 3px solid #F380C5;
    border-radius: 2rem;
    width: 100%;
    height: auto; }
    .recommend-card img {
      width: 140px; }
  .recommend-card__title {
    margin: 20px 0;
    padding: 10px;
    background-color: #FF0199;
    font-size: 3.2rem;
    line-height: 1.2;
    font-weight: 800;
    color: #FFF; }
    .recommend-card__title small {
      font-size: 2.2rem; }
  .recommend-card__description {
    margin: 20px 10px 0;
    padding: 0 0 0 1.8rem;
    text-align: left;
    color: #000; }
    .recommend-card__description li {
      margin: 0 0 10px 0;
      line-height: 1.2;
      position: relative;
      text-indent: -1.2em; }
    .recommend-card__description li:before {
      content: '● ';
      color: #FF0199; }
  /*■■■■■■ 実績紹介(SM) ■■■■■■■*/
  .support-box {
    margin: 50px 0 0 0;
    padding: 40px 20px;
    border-radius: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    background-color: #FFF;
    color: #222;
    position: relative; }
  .support-ti {
    padding: 9px 30px;
    height: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #FF0199;
    font-size: 1.6rem;
    line-height: 1.2;
    color: #FFF;
    font-weight: 600;
    position: absolute;
    z-index: 40;
    top: -30px;
    left: 0; }
  .support-icon {
    margin: auto; }
    .support-icon img {
      width: 140px;
      height: auto; }
  .support-list {
    margin: auto;
    text-align: left; }
    .support-list dt {
      padding: 10px 0 5px 0;
      font-size: 1.8rem;
      line-height: 1.4; }
    .support-list dd {
      padding: 0 0 10px 0; } }

/*SM*/
/*------------(MD)------------*/
@media (min-width: 768px) and (max-width: 1023px) {
  /*■■■■■■ メインリード（MD） ■■■■■■■*/
  .main-title {
    margin: 0 0 5px;
    font-size: 3rem;
    font-weight: 400; }
    .main-title span.typewriter-span {
      margin: 0 5px;
      display: block;
      padding: 6px 15px;
      background-color: #fff;
      border-radius: 10px;
      color: #FF0199;
      font-weight: 700;
      line-height: 1;
      -webkit-filter: drop-shadow(#FF0199 0 0 0.5rem);
      filter: drop-shadow(#FF0199 0 0 0.5rem); }
  /*■■■■■■ 思い（MD） ■■■■■■■*/
  .text-top-read {
    margin: 40px 0;
    padding: 0;
    font-size: 1.8rem;
    line-height: 2;
    font-weight: 600;
    color: #663333; }
  /*■■■■■■ 事業内容（MD） ■■■■■■■*/
  .product-flex-box {
    margin: 40px 0 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .product-card {
    margin: 0 0 20px;
    padding: 30px 15px;
    background: rgba(150, 150, 150, 0.1);
    border: 3px solid #666;
    border-radius: 2rem;
    width: 100%;
    height: auto; }
    .product-card img {
      width: 140px; }
  .product-card__title {
    margin: 20px 0;
    font-size: 3.4rem;
    line-height: 1.2;
    font-weight: 800;
    color: #FF0199; }
    .product-card__title small {
      font-size: 2rem; }
  .product-card__read {
    font-size: 2rem;
    font-weight: 700; }
  .product-card__description {
    margin: 20px 10px 0;
    padding: 0 0 0 1.8rem;
    text-align: left; }
    .product-card__description li {
      margin: 0 0 10px 0;
      line-height: 1.2;
      position: relative;
      text-indent: -1.2em; }
    .product-card__description li:before {
      content: '● ';
      color: #FF0199; }
  /*■■■■■■ こんな人におススメ(MD) ■■■■■■■*/
  .recommend-flex-box {
    margin: 40px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; }
  .recommend-card {
    margin: 0 0 20px;
    padding: 30px 15px;
    background: rgba(255, 255, 255, 0.9);
    border: 3px solid #F380C5;
    border-radius: 2rem;
    width: 100%;
    height: auto; }
    .recommend-card img {
      width: 140px; }
  .recommend-card__title {
    margin: 20px 0;
    padding: 10px;
    background-color: #FF0199;
    font-size: 3.2rem;
    line-height: 1.2;
    font-weight: 800;
    color: #FFF; }
    .recommend-card__title small {
      font-size: 2.2rem; }
  .recommend-card__description {
    margin: 20px 10px 0;
    padding: 0 0 0 1.8rem;
    text-align: left;
    color: #000; }
    .recommend-card__description li {
      margin: 0 0 10px 0;
      line-height: 1.2;
      position: relative;
      text-indent: -1.2em; }
    .recommend-card__description li:before {
      content: '● ';
      color: #FF0199; } }

/*MD*/
/*------------(LG)------------*/
/*LG*/
/*------------(XL)------------*/
@media (min-width: 1216px) {
  .header-img-block {
    width: 100%;
    height: 0;
    margin: 0;
    padding: 46.25% 0 0 0;
    position: relative; } }

/*XL*/