@charset "UTF-8";
.cmshtml {
  /**
* Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
* http://cssreset.com*/
  /* HTML5 display-role reset for older browsers */
  /* CSS Document */
  /*html{
	font-size: 62.5%;
}*/
  /*jsコピペ*/
  /*ナビゲーション部分*/
  /*OPEN時の動き*/
  /*トグルボタンのスタイルを指定*/
  /* 2番目と3番目のspanを45度に */
  /*loading*/
  /*-------------見出しデザインストックclassに「title」とつける-------------*/
  /*下線*/
  /*左線に塗り*/
  /*左線のみ*/
  /*途中で色が変わる下線*/
  /*平行四辺形*/
  /*丸の見出し*/
  /*英字の見出し  data-label="GREETING" など属性追加する必要アリ*/
  /*横線の見出し*/
  /* 左右に横線 */
  /*下線ある見出し*/
  /*斜め線の見出し*/
  /* 左右に横線 */
  /*-------------list designリストデザインストックclassに「list」とつける-------------*/
  /*table*/
  /*news*/
  /*ドット*/
  /*提供サービス service*/
  /*求人*/
  /*お問い合わせ*/
  /*ここまで*/
  /* animation */
}

.cmshtml, .cmsbody, .cmshtml div, .cmshtml span, .cmshtml applet, .cmshtml object, .cmshtml iframe,
.cmshtml h1, .cmshtml h2, .cmshtml h3, .cmshtml h4, .cmshtml h5, .cmshtml h6, .cmshtml p, .cmshtml blockquote, .cmshtml pre,
.cmshtml a, .cmshtml abbr, .cmshtml acronym, .cmshtml address, .cmshtml big, .cmshtml cite, .cmshtml code,
.cmshtml del, .cmshtml dfn, .cmshtml em, .cmshtml img, .cmshtml ins, .cmshtml kbd, .cmshtml q, .cmshtml s, .cmshtml samp,
.cmshtml small, .cmshtml strike, .cmshtml strong, .cmshtml sub, .cmshtml sup, .cmshtml tt, .cmshtml var,
.cmshtml b, .cmshtml u, .cmshtml i, .cmshtml center,
.cmshtml dl, .cmshtml dt, .cmshtml dd, .cmshtml ol, .cmshtml ul, .cmshtml li,
.cmshtml fieldset, .cmshtml form, .cmshtml label, .cmshtml legend,
.cmshtml table, .cmshtml caption, .cmshtml tbody, .cmshtml tfoot, .cmshtml thead, .cmshtml tr, .cmshtml th, .cmshtml td,
.cmshtml article, .cmshtml aside, .cmshtml canvas, .cmshtml details, .cmshtml embed,
.cmshtml figure, .cmshtml figcaption, .cmshtml footer, .cmshtml header, .cmshtml hgroup,
.cmshtml menu, .cmshtml nav, .cmshtml output, .cmshtml ruby, .cmshtml section, .cmshtml summary,
.cmshtml time, .cmshtml mark, .cmshtml audio, .cmshtml video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
}

.cmshtml article, .cmshtml aside, .cmshtml details, .cmshtml figcaption, .cmshtml figure,
.cmshtml footer, .cmshtml header, .cmshtml hgroup, .cmshtml menu, .cmshtml nav, .cmshtml section {
  display: block;
}

.cmshtml ol, .cmshtml ul {
  list-style: none;
  margin: 0;
  padding: 0;
  border: 0;
}

.cmshtml blockquote, .cmshtml q {
  quotes: none;
}

.cmshtml blockquote:before, .cmshtml blockquote:after,
.cmshtml q:before, .cmshtml q:after {
  content: '';
  content: none;
}

.cmshtml table {
  border-collapse: collapse;
  border-spacing: 0;
}

.cmshtml * {
  box-sizing: border-box;
}

.cmshtml img {
  vertical-align: bottom;
}

.cmshtml h1 {
  display: none;
}

.cmsbody {
  line-height: 1.9;
  font-size: 1.0rem;
  font-family: "Zen Maru Gothic", serif;
  /*font-family: 'Open Sans', sans-serif;*/
  margin: 0 auto;
  color: #555;
  background-color: #FAF2F2;
}

.cmshtml a {
  text-decoration: none;
  color: #555;
}

.cmshtml .logo {
  display: block;
  padding: 10px 50px;
}

.cmshtml .detail .logo {
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
}

.cmshtml .name {
  font-size: 1.5rem;
  font-weight: bold;
  color: #813045;
}

.cmshtml nav {
  /*width: 100%;*/
  /*height: 70px;*/
  position: relative;
  /*background: #F6F6F6;*/
}

.cmshtml .drawer {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  position: relative;
  height: 70px;
  padding: 0 1em;
}

.cmshtml .menu ul .menu-item {
  display: block;
  padding: 1.2em;
  /*border-bottom: 1px dotted #CCC;*/
  color: #3f3f3f;
  text-decoration: none;
  font-weight: bold;
}

.cmshtml .menu ul .blue-txt a {
  color: #E44089;
}

.cmshtml .menu ul .menu-item :hover,
.cmshtml footer .fnav-item a:hover {
  color: #813045;
  transition: 0.5em;
}

.cmshtml .menu {
  text-align: center;
}

.cmshtml .menu ul {
  display: flex;
  height: 120px;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  background-color: #FAF2F2;
  margin: 0 0 0 auto;
  padding: 0 10px;
}

.cmshtml .menu-col2 {
  display: none;
}

.cmshtml .menu.active {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);
  /*中身を表示（右へスライド）*/
}

.cmshtml .tel {
  font-size: 2.0rem;
  color: #E44089;
}

.cmshtml .Toggle {
  display: block;
  position: fixed;
  /* bodyに対しての絶対位置指定 */
  top: 0;
  right: 0;
  width: 50px;
  height: 50px;
  cursor: pointer;
  z-index: 1000;
  background-color: #E44089;
}

.cmshtml .Toggle span {
  display: block;
  position: absolute;
  left: 8px;
  width: 35px;
  border-bottom: solid 4px #fff;
  border-radius: 5px;
  -webkit-transition: .35s ease-in-out;
  /*変化の速度を指定*/
  -moz-transition: .35s ease-in-out;
  /*変化の速度を指定*/
  transition: .35s ease-in-out;
  /*変化の速度を指定*/
}

.cmshtml .Toggle span:nth-child(1) {
  top: 9px;
}

.cmshtml .Toggle span:nth-child(2) {
  top: 22px;
}

.cmshtml .Toggle span:nth-child(3) {
  top: 36px;
}

.cmshtml .Toggle.active span:nth-child(1) {
  top: 20px;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.cmshtml .Toggle.active span:nth-child(2),
.cmshtml .Toggle.active span:nth-child(3) {
  top: 20px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
}

.cmshtml .Toggle {
  display: none;
}

@media (max-width: 850px) {
  .cmshtml .fnav-ul {
    display: flex;
    justify-content: center;
    -webkit-justify-content: center;
    flex-direction: column;
    align-items: center;
    margin: 0 auto;
  }
}

@media (min-width: 599px) {
  .cmshtml {
    /*nav{
 display: flex;

}*/
  }
  .cmshtml .tel-icon, .cmshtml .pc-none {
    display: none;
  }
  .cmshtml .menu {
    /*width: 100%;*/
    background-color: transparent;
    margin-top: 0;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  .cmshtml .menu ul .menu-item:hover {
    background-color: transparent;
  }
}

@media screen and (max-width: 768px) {
  .cmshtml #header,
.cmshtml #header:before {
    height: 90vh;
  }
}

@media (max-width: 1230px) {
  .cmshtml .Toggle {
    display: block;
  }
  .cmshtml .tel-icon {
    display: block;
    position: fixed;
    top: 0;
    right: 50px;
    width: 50px;
    height: 50px;
    background-color: #37a3d0;
    text-align: center;
    line-height: 47px;
    z-index: 999;
    border-radius: 0 0 0 5px;
  }
  .cmshtml .header .col2 {
    width: auto;
  }
  .cmshtml .menu {
    display: block;
    transition: .5s ease;
    /*滑らかに表示*/
    -webkit-transform: translateX(-500%);
    transform: translateX(-500%);
    /*左に隠しておく*/
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 999;
    background-color: #FAF2F2;
  }
  .cmshtml .menu ul {
    display: block;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    padding: 50px 0 0;
    height: 100vh;
  }
  .cmshtml .menu ul .menu-item {
    display: block;
    font-weight: bold;
    padding: 1.0em;
    border-bottom: 1px dotted #CCC;
    color: #3f3f3f;
    text-decoration: none;
  }
  .cmshtml .menu-col2 {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 0;
  }
  .cmshtml .menu-col2 .name {
    text-align: left;
    padding: 0 0 0 15px;
  }
}

.cmshtml .loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 12000;
  background-color: #0DAF62;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: fadeOut 1.5s 2.5s forwards;
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    visibility: hidden;
  }
}

.cmshtml .loading__logo {
  opacity: 0;
  animation: logo_fade 2s 0.5s forwards;
  width: 175px;
}

@keyframes logo_fade {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }
  60% {
    opacity: 1;
    transform: translateY(0);
  }
  100% {
    opacity: 0;
  }
}

.cmshtml .loader,
.cmshtml .loader:before,
.cmshtml .loader:after {
  background: #ffffff;
  -webkit-animation: load1 1s infinite ease-in-out;
  animation: load1 1s infinite ease-in-out;
  width: 1em;
  height: 4em;
}

.cmshtml .loader {
  color: #ffffff;
  text-indent: -9999em;
  margin: 88px auto;
  position: relative;
  font-size: 11px;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

.cmshtml .loader:before,
.cmshtml .loader:after {
  position: absolute;
  top: 0;
  content: '';
}

.cmshtml .loader:before {
  left: -1.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.cmshtml .loader:after {
  left: 1.5em;
}

@-webkit-keyframes load1 {
  0%,
80%,
100% {
    box-shadow: 0 0;
    height: 4em;
  }
  40% {
    box-shadow: 0 -2em;
    height: 5em;
  }
}

@keyframes load1 {
  0%,
80%,
100% {
    box-shadow: 0 0;
    height: 4em;
  }
  40% {
    box-shadow: 0 -2em;
    height: 5em;
  }
}

.cmshtml .loaded {
  opacity: 0;
  visibility: hidden;
}

.cmshtml header {
  display: block;
  position: relative;
}

.cmshtml .logo-img img {
  width: 100px;
}

.cmshtml .header-logo {
  padding: 10px 60px;
  border-radius: 5px;
}

.cmshtml h1 a {
  display: block;
  width: 248px;
  height: 60px;
  text-indent: -1000em;
  background-repeat: no-repeat;
  overflow: hidden;
  background: url("../img/logo.jpg"), no-repeat;
  background-size: contain;
}

.cmshtml header .col2 {
  width: 100%;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  font-family: "Zen Maru Gothic", serif;
}

.cmshtml .col2-wrp-center {
  display: flex;
  justify-content: center;
  row-gap: 50px;
  flex-wrap: wrap;
}

.cmshtml .col2-wrp-center li {
  margin: 0 5% 0 0;
}

.cmshtml .col2-wrp-center picture img {
  width: calc(350vw / 12.80);
}

.cmshtml .col2-wrp-center li:nth-child(3n) {
  margin: 0;
}

.cmshtml .number-decoration {
  position: absolute;
  top: -15px;
  left: -10px;
  color: white;
  background-color: #0BB063;
  padding: 5px;
  font-size: 1.7rem;
  z-index: 2;
  border-radius: 2.0rem 0 2.0rem 0;
}

.cmshtml .feature-list {
  align-items: stretch;
}

.cmshtml .feature-list-item .picture {
  width: 100%;
}

.cmshtml .feature-list-item .picture img {
  width: 100%;
  border-radius: 20px;
}

.cmshtml .feature-list .feature-list-item {
  display: flex;
  flex-direction: column;
}

.cmshtml .feature-list .feature-list-item:nth-child(2n) .number-decoration {
  background-color: #FFA51F;
}

.cmshtml .feature-list .feature-list-item .feature-list-item-txt {
  background-color: #BBDEC0;
  padding: 10px 17px;
  border-radius: 0 0 20px 20px;
  position: relative;
}

.cmshtml .feature-list .feature-list-item:nth-child(2n) .feature-list-item-txt {
  background-color: #FFCB7D;
}

.cmshtml header .contact {
  width: 230px;
}

.cmshtml .division-list .division-item {
  text-align: center;
  background-color: #EBFBED;
  border-radius: 20px;
}

.cmshtml .division-item:nth-child(2n) {
  background-color: #FFF1DD;
}

.cmshtml .division-item a {
  display: block;
  padding: 20px;
  color: #3f3f3f;
}

.cmshtml .division-item a:hover {
  box-shadow: 0px 0px 15px #0DAF62;
  border-radius: 20px;
  transition: 0.5s;
}

.cmshtml .division-item:nth-child(2n) a:hover {
  box-shadow: 0px 0px 15px #ffa51e;
}

.cmshtml .division-list-txt {
  position: relative;
}

.cmshtml .feature-list-item:nth-child(2n) .feature-list-item-txt::before,
.cmshtml .feature-list-item .feature-list-item-txt::before {
  top: 0;
  bottom: 0;
  right: 20px;
}

.cmshtml .division-item:nth-child(2n) .division-list-txt::before,
.cmshtml .division-list-txt::before {
  top: 0;
  bottom: 0;
  right: 10px;
}

.cmshtml .feature-list-item .feature-list-item-txt::before,
.cmshtml .division-list-txt::before {
  /* くの字の表示設定 */
  content: "";
  margin: auto;
  position: absolute;
  width: 5px;
  /* くの字を山なりに見た時、左側の長さ */
  height: 5px;
  /* くの字を山なりに見た時、右側の長さ */
  border-top: 2px solid #0DAF62;
  /* くの字を山なりに見た時、左側の太さと色 */
  border-right: 2px solid #0DAF62;
  /* くの字を山なりに見た時、右側の太さと色 */
  transform: rotate(45deg);
  /* くの字の向き */
}

.cmshtml .feature-list-item:nth-child(2n) .feature-list-item-txt::before,
.cmshtml .division-item:nth-child(2n) .division-list-txt::before {
  /* くの字の表示設定 */
  content: "";
  margin: auto;
  width: 5px;
  /* くの字を山なりに見た時、左側の長さ */
  height: 5px;
  /* くの字を山なりに見た時、右側の長さ */
  border-top: 2px solid #FFA51F;
  /* くの字を山なりに見た時、左側の太さと色 */
  border-right: 2px solid #FFA51F;
  /* くの字を山なりに見た時、右側の太さと色 */
  transform: rotate(45deg);
  /* くの字の向き */
}

.cmshtml .division-list img {
  height: 80px;
}

.cmshtml .division-list img {
  height: 80px;
}

.cmshtml .decoration {
  font-family: "Zen Maru Gothic", serif;
  font-weight: 500;
  font-style: normal;
}

.cmshtml h2 {
  font-size: 2.3rem;
  margin: 0 0 25px;
}

.cmshtml h3 {
  font-size: 1.9rem;
}

.cmshtml h4 {
  font-size: 1.728rem;
}

.cmshtml h5 {
  font-size: 1.44rem;
}

.cmshtml h6 {
  font-size: 1.2rem;
}

.cmshtml .underline_title {
  font-family: "Zen Maru Gothic", serif;
  font-weight: 500;
  font-style: normal;
  border-bottom: solid 3px #0DAF62;
}

.cmshtml .leftline-painting_title {
  padding: 0 0.5em;
  /*文字周りの余白*/
  color: #494949;
  /*文字色*/
  background: #eff7f0;
  /*背景色*/
  border-left: solid 5px #0DAF62;
  /*左線（実線 太さ 色）*/
}

.cmshtml .leftline_title {
  padding: 0 0.5em;
  margin: 0.5rem 0;
  background: transparent;
  border-left: solid 5px #0DAF62;
}

.cmshtml .double-underline_title {
  font-family: "Zen Maru Gothic", serif;
  font-weight: 500;
  margin: 0 0 0.5rem;
  border-bottom: solid 3px #eeeeee;
  position: relative;
}

.cmshtml .double-underline_title:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #0DAF62;
  bottom: -3px;
  width: 20%;
}

.cmshtml .parallelogram_title {
  position: relative;
  padding: 5px 26px 5px 42px;
  background: #fff0d9;
  color: #2d2d2d;
  margin-left: -33px;
  line-height: 1.3;
  border-bottom: solid 3px orange;
  z-index: -2;
}

.cmshtml .parallelogram_tittle:before {
  position: absolute;
  content: '';
  left: -2px;
  top: -2px;
  width: 0;
  height: 0;
  border: none;
  border-left: solid 40px white;
  border-bottom: solid 79px transparent;
  z-index: -1;
}

.cmshtml .parallelogram_tittle:after {
  position: absolute;
  content: '';
  right: -3px;
  top: -7px;
  width: 0;
  height: 0;
  border: none;
  border-left: solid 40px transparent;
  border-bottom: solid 79px white;
  z-index: -1;
}

.cmshtml .heading-29 {
  display: inline-block;
  position: relative;
  margin: calc(3.5em / 2) 0 calc(3.5em / 4) calc(3.5em / 2);
  line-height: 1;
}

.cmshtml .heading-29::before {
  position: absolute;
  bottom: calc(-3.5em / 4);
  left: calc(-3.5em / 2);
  z-index: -1;
  width: 3.5em;
  height: 3.5em;
  border-radius: 50%;
  background: #ffdabc;
  content: '';
}

.cmshtml .heading-28 {
  font-weight: bold;
  letter-spacing: .04em;
  text-align: center;
}

.cmshtml .heading-28::before {
  display: block;
  font-weight: 700;
  font-size: .75rem;
  line-height: 1.5;
  letter-spacing: .02em;
  content: attr(data-label);
  color: #E44089;
}

.cmshtml .heading-27 {
  align-items: center;
  /* 横線を上下中央 */
  display: flex;
  /* 文字と横線を横並び */
  justify-content: center;
  /* 文字を中央寄せ */
}

.cmshtml .heading-27::before,
.cmshtml .heading-27::after {
  background-color: #E44089;
  /* 横線の色 */
  content: "";
  height: 3px;
  /* 横線の高さ */
  width: 60px;
  /* 横線の長さ */
}

.cmshtml .heading-27::before {
  margin-right: 15px;
  /* 文字との余白 */
}

.cmshtml .heading-27::after {
  margin-left: 15px;
  /* 文字との余白 */
}

.cmshtml .heading-26 {
  position: relative;
  padding: 1.5rem 0;
  text-align: center;
}

.cmshtml .heading-26:before {
  position: absolute;
  bottom: 10px;
  left: calc(50% - 30px);
  width: 60px;
  height: 5px;
  content: '';
  border-radius: 3px;
  background: #E44089;
}

.cmshtml .heading-25 {
  align-items: center;
  /* 横線を上下中央 */
  display: flex;
  /* 文字と横線を横並び */
  justify-content: center;
  /* 文字を中央寄せ */
}

.cmshtml .heading-25::before,
.cmshtml .heading-25::after {
  background-color: #E44089;
  /* 横線の色 */
  content: "";
  height: 3px;
  /* 横線の高さ */
  width: 60px;
  /* 横線の長さ */
}

.cmshtml .heading-25::before {
  margin-right: 15px;
  /* 文字との余白 */
  transform: rotate(45deg);
  /*角度調整*/
}

.cmshtml .heading-25::after {
  margin-left: 15px;
  /* 文字との余白 */
  transform: rotate(-45deg);
  /*角度調整*/
}

.cmshtml ul.cp_list {
  position: relative;
  padding: 0.5em;
  border: solid 1px #0DAF62;
  list-style-type: none;
}

.cmshtml ul.cp_list li {
  padding: 0.5em 0 0.5em 1.4em;
  line-height: 1.5;
  border-bottom: 1px dashed #0DAF62;
}

.cmshtml ul.cp_list li::before {
  position: absolute;
  content: "";
}

.cmshtml ul.cp_list {
  position: relative;
  padding: 0.5em;
  border: solid 1px #0DAF62;
  list-style-type: none;
}

.cmshtml ul.cp_list li {
  padding: 0.5em 0 0.5em 1.4em;
  line-height: 1.5;
  border-bottom: 1px dashed #0DAF62;
}

.cmshtml ul.cp_list li::before {
  position: absolute;
  content: "\002713";
  color: #0DAF62;
  font-weight: bold;
  left: 0.5em;
}

.cmshtml ul.cp_list li:last-of-type {
  border-bottom: none;
}

.cmshtml .radius-img img {
  width: 100%;
  border-radius: 30px;
}

.cmshtml .col2-lft {
  display: flex;
  -webkit-display: flex;
  justify-content: left;
  -webkit-justify-content: left;
}

.cmshtml .col2-lft .name {
  padding: 0 0 0 15px;
}

.cmshtml .col2-lft .sns-icon {
  padding: 0 0 0 15px;
}

.cmshtml .col2-lft .sns-icon img {
  width: 40px;
}

.cmshtml .detail a {
  color: #0BB063;
}

@media (min-width: 601px) {
  .cmshtml .menu-content {
    display: flex;
  }
}

.cmshtml .col2 {
  display: flex;
  -webkit-display: flex;
  justify-content: center;
  -webkit-justify-content: center;
}

.cmshtml .col2-align {
  display: flex;
  -webkit-display: flex;
  justify-content: center;
  -webkit-justify-content: center;
  align-items: center;
}

.cmshtml .col2-btw {
  display: flex;
  -webkit-display: flex;
  justify-content: space-between;
  -webkit-justify-content: space-between;
}

.cmshtml .col2-ard {
  display: flex;
  -webkit-display: flex;
  justify-content: space-around;
  -webkit-justify-content: space-around;
}

.cmshtml .reverse {
  flex-direction: row-reverse;
}

.cmshtml .w28percent {
  width: 28%;
  position: relative;
  z-index: 1;
}

.cmshtml .w30percent {
  width: 30%;
  position: relative;
}

.cmshtml .w33percent {
  width: 33%;
}

.cmshtml .w40percent {
  width: 40%;
}

.cmshtml .w45percent {
  width: 45%;
}

.cmshtml .w50percent {
  width: 50%;
}

.cmshtml .w60percent {
  width: 60%;
}

.cmshtml .w65percent {
  width: 65%;
}

.cmshtml .w65percent img {
  width: 100%;
}

.cmshtml .w70percent {
  width: 70%;
}

.cmshtml .w100percent {
  width: 100%;
}

.cmshtml .w100percent img {
  width: 100%;
  border-radius: 20px;
}

.cmshtml .m-t_b10 {
  margin: 10px 0;
}

.cmshtml .mt_10 {
  margin: 10px 0 0;
}

.cmshtml .mt_20 {
  margin: 20px 0 0;
}

.cmshtml .mt_35 {
  margin: 35px 0 0;
}

.cmshtml .mt_40 {
  margin: 40px 0 0;
}

.cmshtml .mt_80 {
  margin: 80px 0 0;
}

.cmshtml .mb_10 {
  margin: 0 0 10px;
}

.cmshtml .mb_40 {
  margin: 0 0 40px;
}

.cmshtml .fnav-list {
  color: #ffffff;
  max-width: 950px;
  margin: 0 auto;
  text-align: left;
}

.cmshtml .gradient {
  background: linear-gradient(rgba(89, 167, 211, 0.6), rgba(40, 191, 239, 0));
  width: 100%;
  height: 70px;
}

.cmshtml .vertical {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  position: absolute;
  font-weight: bold;
  top: 0px;
  right: 25px;
  text-align: left;
}

.cmshtml .youtube {
  margin: 30px 0 0;
}

.cmshtml .scroll-x {
  overflow-x: scroll;
}

.cmshtml footer .schedule {
  margin: 15px 0;
}

.cmshtml .fnav-item a {
  display: block;
  color: #3f3f3f;
}

.cmshtml .subvisual-bg img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

.cmshtml .subvisual-bg {
  width: 90%;
  height: 320px;
  overflow: hidden;
  border-radius: 4.0rem 1.0rem 4.0rem 1.0rem;
  margin: 0 auto;
}

.cmshtml .subvisual,
.cmshtml .mainvisual {
  position: relative;
  /*z-index: -1;
    --mask: radial-gradient(30px at bottom,#0000 97%,#000) 50% / 55.5px 100%;
    -webkit-mask: var(--mask);
            mask: var(--mask);*/
}

.cmshtml .mainvisual::before {
  content: "";
  width: 100%;
  height: 60px;
  position: absolute;
  left: 0;
  bottom: 0;
  background-image: url("../img/bg_001.png");
  background-repeat: repeat-x;
  background-size: 836px 60px;
  z-index: 1;
}

.cmshtml .mainvisual .leaves {
  position: absolute;
  bottom: 0;
  left: -18px;
  z-index: 2;
}

.cmshtml .leaves img {
  width: 200px;
}

.cmshtml .greeting .leaves {
  position: absolute;
  bottom: 0;
  right: -155px;
  z-index: 1;
}

.cmshtml .greeting {
  overflow: hidden;
}

@keyframes sway {
  from {
    transform: translateX(0px) rotate(7deg);
  }
  /*to {
    transform: translateX(50px) rotate(-45deg);
  }*/
}

.cmshtml .subvisual .catch-copy {
  position: absolute;
  right: 11%;
  bottom: 34%;
  z-index: 5;
  font-size: 2.5rem;
  color: #fff;
  font-weight: bold;
  text-shadow: 0 0 15px #333;
}

.cmshtml .mainvisual .catch-copy {
  position: absolute;
  left: 10%;
  bottom: 40%;
  z-index: 5;
  font-size: 2.5rem;
  color: #fff;
  font-weight: bold;
  text-shadow: 0 0 5px #333;
  -ms-writing-mode: tb-rl;
}

.cmshtml .mainvisual .catch-copy .sub {
  font-size: 1.2rem;
}

.cmshtml .mainvisual .schedule-area {
  position: absolute;
  bottom: 5%;
  right: 0;
  z-index: 5;
  background-color: #fff;
  border-radius: 30px 0 0 30px;
}

.cmshtml .detail .schedule-area {
  padding: 15px 0;
  background-color: #FDFCEE;
  border-radius: 20px;
  font-size: 0.8rem;
}

.cmshtml .detail .schedule tbody {
  font-size: 0.9rem;
}

.cmshtml .detail .schedule th {
  padding: 0.3rem 0;
}

.cmshtml .schedule {
  /*width: 530px;
  border-radius: 10px;*/
  margin: 1.0rem 3.5rem 1.0rem 2.0rem;
}

.cmshtml .detail .schedule {
  margin: 0;
}

.cmshtml .detail .schedule th {
  width: 5%;
  padding: 0;
}

.cmshtml .detail .schedule td {
  padding: 0;
}

.cmshtml .schedule tbody {
  border: 0;
  text-align: center;
  font-size: 1rem;
  font-family: "Zen Maru Gothic", serif;
}

.cmshtml .schedule tr > * {
  padding: 0.5rem 1rem;
  border: none;
}

.cmshtml .schedule th {
  padding: 0.5rem 0.8rem;
}

.cmshtml .schedule td {
  padding: 0.5rem 0.8rem;
}

.cmshtml .fnav-ul {
  display: flex;
  justify-content: center;
  -webkit-justify-content: center;
  align-items: center;
  margin: 0 auto;
}

.cmshtml footer .fnav-item a {
  display: block;
  padding: 20px 10px;
}

.cmshtml .radius-table {
  border-radius: 10px;
  border-spacing: 0;
  border: none;
  border-left: 1px solid #999;
  border-top: 1px solid #999;
}

.cmshtml .radius-table tr > * {
  padding: 5px 10px;
  border: none;
  border-right: 1px solid #999;
  border-bottom: 1px solid #999;
}

.cmshtml .radius-table tr:first-child > *:first-child {
  border-radius: 10px 0 0 0;
}

.cmshtml .radius-table tr:first-child > *:last-child {
  border-radius: 0 10px 0 0;
}

.cmshtml .radius-table tr:last-child > *:first-child {
  border-radius: 0 0 0 10px;
}

.cmshtml .radius-table tr:last-child > *:last-child {
  border-radius: 0 0 10px 0;
}

.cmshtml .grid2 {
  display: flex;
}

.cmshtml small {
  display: block;
  background: #FAF2F2;
  padding: 20px 0;
  text-align: center;
  font-weight: 500;
}

.cmshtml .fixed-bt {
  position: fixed;
  bottom: 0;
  width: 100%;
  background: #ffffff;
  z-index: 4;
}

.cmshtml .white-txt {
  color: #fff;
}

.cmshtml .gray-txt {
  color: #c2bdbb;
}

.cmshtml .text-odd {
  max-width: calc(100% - (60% - (30rem / 2)));
  width: calc(100% - 2rem);
  margin-right: 0;
  margin-left: auto;
  padding: 3rem;
  padding-right: calc(30% - (30rem / 2) - 2rem);
  border-right: solid #d5eef2;
  border-right-width: calc(2rem + 2rem);
  border-radius: 5px 0 0 5px;
  background-color: #d5eef2;
}

.cmshtml .text-even {
  max-width: calc(100% - (60% - (30rem / 2)));
  width: calc(100% - 2rem);
  margin-left: 0;
  margin-right: auto;
  padding: 3rem;
  padding-left: calc(30% - (30rem / 2) - 2rem);
  border-left: solid #d5eef2;
  border-left-width: calc(2rem + 2rem);
  background-color: #d5eef2;
  border-radius: 0 5px 5px 0;
}

.cmshtml .picture {
  position: relative;
  padding: 10px 0;
}

.cmshtml .picture-item {
  position: absolute;
  top: 15px;
  right: -10px;
}

.cmshtml .picture-item img {
  width: 350px;
  border-radius: 5px;
}

.cmshtml .marker {
  background: linear-gradient(transparent 60%, #ff6 60%);
}

.cmshtml .txt2rem {
  font-size: 2.0rem;
}

.cmshtml .txt08rem {
  font-size: 0.8rem;
}

.cmshtml .news .heading-26 {
  padding: 0 0 1.5rem;
}

.cmshtml .news-list {
  max-width: 800px;
  height: 150px;
  margin: 0 auto;
  overflow-y: scroll;
  border-radius: 5px;
}

.cmshtml .news-list li {
  max-width: 608px;
  white-space: nowrap;
  overflow-x: hidden;
  text-overflow: ellipsis;
  padding: 20px;
  margin: 0 auto;
  border-bottom: 1px solid #b3b3b3;
}

.cmshtml .news-item {
  border-bottom: 1px solid #f5f5f5;
}

.cmshtml .news-list time {
  padding: 0 10px 0 0;
}

.cmshtml .news .p-t_b70 {
  padding: 70px 0 100px;
}

.cmshtml .dec-left {
  position: absolute;
  bottom: 60px;
  right: 300px;
  transform: rotate(-10deg);
}

.cmshtml .dec-right {
  position: absolute;
  bottom: 60px;
  left: 300px;
  transform: rotate(10deg);
}

@media (max-width: 1050px) {
  .cmshtml .dec-left {
    display: none;
    bottom: 60px;
    left: 0px;
  }
  .cmshtml .dec-right {
    display: none;
    bottom: 60px;
    right: 0;
  }
}

.cmshtml .wave-upper {
  position: relative;
}

.cmshtml .wave-upper::before {
  display: inline-block;
  content: "";
  width: 100%;
  height: 243px;
  background-image: url(../img/waves.svg);
  background-position: bottom center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  /* background-position-x:center;*/
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 0;
}

.cmshtml .wave-below {
  position: relative;
}

.cmshtml .wave-below::before {
  display: inline-block;
  content: "";
  width: 100%;
  height: 100%;
  background-image: url(../img/bg_01.png);
  background-position: bottom center;
  background-repeat: no-repeat;
  background-position-x: center;
  background-size: contain;
  position: absolute;
  top: 0;
  z-index: -1;
  transform: rotateX(180deg);
}

.cmshtml .bg_skew_dot {
  background-color: #fff;
  background-image: radial-gradient(#eeeeee 20%, transparent 20%), radial-gradient(#eeeeee 20%, transparent 20%);
  background-size: 10px 10px;
  background-position: 0 0, 40px 40px;
}

.cmshtml .bg-circle {
  background-image: url(../img/bg_02.png);
  background-position: bottom 5px left;
  background-repeat: no-repeat;
}

.cmshtml .bg-illustration01 {
  background-image: url(../img/bg_005.png);
}

.cmshtml .bg-illustration02 {
  background-image: url(../img/bg_003.png);
}

.cmshtml .bg-gray {
  background-color: #ebebeb;
}

.cmshtml .bg-yellow {
  background-color: #FDFCEE;
}

.cmshtml .bg-town {
  background-position: left 0 bottom 0;
  background-repeat: repeat-x;
  background-image: url(../img/bg_003.png);
}

.cmshtml .bg-blue-squair {
  background: url(../img/bg_001.png) no-repeat;
  background-size: contain;
}

.cmshtml .bg-gray-squair {
  background: url(../img/bg_007.png) no-repeat;
  background-size: contain;
}

.cmshtml .bg-gray {
  background-color: #f9f9f9;
}

.cmshtml .bg-main {
  background-color: #37a3d0;
}

.cmshtml .bg-img01 .bg-darken, .cmshtml .bg-img02 .bg-darken {
  height: 200px;
  line-height: 200px;
}

.cmshtml .bg-darken {
  background-color: rgba(0, 0, 0, 0.4);
  background-blend-mode: darken;
  color: #fff;
  font-weight: bold;
  text-align: center;
}

.cmshtml .bg-teeth {
  background: url(../img/bg_02.svg) no-repeat;
  background-position: bottom 0 right 10%;
}

.cmshtml .blue-txt {
  color: #0DAF62;
}

.cmshtml .light-blue-txt {
  color: #b8ffed;
}

.cmshtml .w950 {
  max-width: 950px;
  margin: 0 auto;
}

.cmshtml .w1000 {
  width: 90%;
  max-width: 1280px;
  margin: 0 auto;
}

.cmshtml .w240 {
  width: 240px;
}

.cmshtml .font-Zen-Maru {
  font-family: "Zen Maru Gothic", serif;
}

.cmshtml .google-map {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 75%;
  /* 比率を4:3に固定 */
}

.cmshtml .google-map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.cmshtml .step {
  margin: 15px 0;
  background-color: #d5eef2;
  border: #fff 1px solid;
  border-radius: 5px;
  padding: 15px 20px;
  font-family: "Zen Maru Gothic", serif;
  font-weight: bold;
}

.cmshtml .contact .p-t_b100 {
  padding: 140px 0 100px;
}

.cmshtml .p-t_b100 {
  padding: 100px 0;
}

.cmshtml .p-t_b70 {
  padding: 70px 0;
}

.cmshtml .p-t_b20 {
  padding: 20px 0;
}

.cmshtml .p-t70 {
  padding: 70px 0 0;
}

.cmshtml .p-t30 {
  padding: 30px 0 0;
}

.cmshtml .p-10 {
  padding: 10px;
}

.cmshtml .italic {
  font-style: italic;
}

.cmshtml .bold {
  font-weight: bold;
}

.cmshtml .center {
  text-align: center;
}

.cmshtml .right {
  text-align: right;
}

.cmshtml .left {
  text-align: left;
}

.cmshtml .service {
  background-image: url("../img/bg_004.png");
}

.cmshtml .pallax {
  background-attachment: fixed;
  background-size: cover;
}

.cmshtml .recruit {
  background-image: url("../img/bg_002.png");
  color: #fff;
}

.cmshtml .arch {
  position: relative;
  padding: 1.2rem;
  text-align: center;
  border: 2px solid #E44089;
  background: #fff;
}

.cmshtml .arch:before,
.cmshtml .arch:after {
  position: absolute;
  content: '';
}

.cmshtml .arch:before {
  top: -36%;
  left: calc(50% - 25%);
  width: 50%;
  height: 90%;
  border: 2px solid #E44089;
  border-radius: 50%;
  background: #fff;
}

.cmshtml .contact {
  background-color: #fff;
}

@media (max-width: 900px) {
  .cmshtml .arch:before {
    display: none;
  }
  .cmshtml .contact h2 {
    margin-top: 0 !important;
  }
  .cmshtml .contact .heading-26 {
    padding: 0 0 1.5rem;
  }
  .cmshtml .contact .p-t_b100 {
    padding: 100px 0;
  }
}

.cmshtml .arch:after {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
}

.cmshtml .arch > * {
  position: relative;
  z-index: 1;
}

.cmshtml .contact .heading-26 {
  position: relative;
  z-index: 1;
}

.cmshtml .contact h2 {
  margin-top: -112px;
}

.cmshtml .arch-content {
  margin: 30px 0 0;
}

.cmshtml .access {
  padding: 70px 0 100px;
}

.cmshtml .inline-block {
  display: inline-block;
}

.cmshtml .center-btn-area {
  display: block;
  text-align: center;
}

.cmshtml .more-btn a {
  display: block;
  margin: 20px 0;
  max-width: 600px;
  padding: 13px 80px;
  text-align: center;
  border: #FAC090 2px solid;
  box-sizing: content-box;
  color: #FAC090;
  background: #ffffff;
  border-radius: 50px;
  text-align: center;
  font-weight: bold;
  font-family: "Zen Maru Gothic", serif;
  position: relative;
}

.cmshtml .more-btn a::before {
  /* くの字の表示設定 */
  content: "";
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 10px;
  width: 5px;
  /* くの字を山なりに見た時、左側の長さ */
  height: 5px;
  /* くの字を山なりに見た時、右側の長さ */
  border-top: 2px solid #FAC090;
  /* くの字を山なりに見た時、左側の太さと色 */
  border-right: 2px solid #FAC090;
  /* くの字を山なりに見た時、右側の太さと色 */
  transform: rotate(45deg);
  /* くの字の向き */
}

.cmshtml header .line-btn {
  margin: 0;
}

.cmshtml .line-btn{
  display: block;
  margin: 20px 0;
  padding: 13px 80px;
  text-align: center;
  border: #07c655 2px solid;
  box-sizing: content-box;
  color: #07c655 !important;
  background: #ffffff;
  border-radius: 50px;
  text-align: center;
  font-weight: bold;
  font-family: "Zen Maru Gothic", serif;
  position: relative;
  background-image: url("../img/ic_002.png");
  background-repeat: no-repeat;
  background-position: left 20px top 9px;
  background-size: 39px 39px;
}

.cmshtml .line-btn::before {
  /* くの字の表示設定 */
  content: "";
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 10px;
  width: 5px;
  /* くの字を山なりに見た時、左側の長さ */
  height: 5px;
  /* くの字を山なりに見た時、右側の長さ */
  border-top: 2px solid #07c655;
  /* くの字を山なりに見た時、左側の太さと色 */
  border-right: 2px solid #07c655;
  /* くの字を山なりに見た時、右側の太さと色 */
  transform: rotate(45deg);
  /* くの字の向き */
}

.cmshtml .line-btn:hover::before {
  /* くの字の表示設定 */
  content: "";
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 10px;
  width: 5px;
  /* くの字を山なりに見た時、左側の長さ */
  height: 5px;
  /* くの字を山なりに見た時、右側の長さ */
  border-top: 2px solid #ffffff !important;
  /* くの字を山なりに見た時、左側の太さと色 */
  border-right: 2px solid #ffffff !important;
  /* くの字を山なりに見た時、右側の太さと色 */
  transform: rotate(45deg);
  /* くの字の向き */
  transition: 0.5s;
}

.cmshtml .line-btn:hover {
  background-image: url("../img/ic_005.png") !important;
  background-repeat: no-repeat !important;
  background-position: left 20px top 9px !important;
  background-size: 39px 39px !important;
  background: #07c655;
  color: #ffffff !important;
  transition: 0.5s;
}

.cmshtml .cv-btn a {
  display: inline-block;
  height: 40px;
  line-height: 40px;
  margin: 20px 0;
  padding: 0 40px 0 50px;
  box-sizing: content-box;
  border: #FAC090 2px solid;
  color: #FAC090;
  background-color: #ffffff;
  border-radius: 50px;
  text-align: center;
  font-weight: bold;
  font-family: "Zen Maru Gothic", serif;
  position: relative;
  background-image: url("../img/ic003.png");
  background-repeat: no-repeat;
  background-position: top 9px left 13px;
  background-size: 25px;
}

.cmshtml .cv-btn a::before {
  /* くの字の表示設定 */
  content: "";
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 10px;
  width: 5px;
  /* くの字を山なりに見た時、左側の長さ */
  height: 5px;
  /* くの字を山なりに見た時、右側の長さ */
  border-top: 2px solid #FAC090;
  /* くの字を山なりに見た時、左側の太さと色 */
  border-right: 2px solid #FAC090;
  /* くの字を山なりに見た時、右側の太さと色 */
  transform: rotate(45deg);
  /* くの字の向き */
}

.cmshtml .cv-btn a:hover,
.cmshtml .cv-btn a:active,
.cmshtml .more-btn a:hover,
.cmshtml .more-btn a:active {
  color: #fff;
  background-color: #FAC090;
  transition: 0.5s;
}

.cmshtml .cv-btn a:hover::before,
.cmshtml .cv-btn a:active::before,
.cmshtml .more-btn a:hover::before,
.cmshtml .more-btn a:active::before {
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transition: 0.5s;
}

.cmshtml .contact-btn:hover,
.cmshtml .contact-btn:active,
.cmshtml .recrute-btn:hover,
.cmshtml .recrute-btn:active,
.cmshtml .contact-btn-gray:hover {
  opacity: 0.7;
  transition: 0.5s;
}

.cmshtml .gnav-list a:hover,
.cmshtml .fnav-list a:hover {
  text-decoration: underline;
}

.cmshtml .icon-item {
  padding: 0 0 30px;
}

.cmshtml .icon-item img {
  width: 25px;
}

.cmshtml .footer-list {
  display: flex;
  flex-wrap: wrap;
}

.cmshtml .footer-list .footer-list-item {
  flex: 1 1 100%;
  font-weight: 500;
}

.cmshtml .footer-list-child {
  display: flex;
  flex-wrap: wrap;
}

.cmshtml .footer-list-child-item {
  flex: 0 1 25%;
}

.cmshtml .footer .col2-lft {
  align-items: center;
}

@media (max-width: 980px) {
  .cmshtml .col2 {
    /*flex-direction: column;*/
  }
  .cmshtml .w950 {
    width: 90%;
  }
  .cmshtml .sp-center {
    text-align: center;
  }
  .cmshtml .w45percent, .cmshtml .w50percent, .cmshtml .w70percent {
    width: 100%;
  }
  .cmshtml .reverse .picture-item,
.cmshtml .picture-item {
    position: static;
    text-align: center;
  }
  .cmshtml .picture-item img {
    width: 80%;
    border-radius: 5px 5px 0 0;
  }
  .cmshtml .text-odd {
    max-width: 80%;
    width: 80%;
    margin: auto;
    padding: 2rem;
    border: 0;
    border-radius: 0 0 5px 5px;
  }
  .cmshtml .text-even {
    max-width: 80%;
    width: 80%;
    margin: auto;
    padding: 2rem;
    border: 0;
    border-radius: 0 0 5px 5px;
  }
  .cmshtml .text {
    max-width: 80%;
    margin: 0 auto;
    padding: 40px 50px;
  }
  .cmshtml .dec-left {
    display: none;
    bottom: 60px;
    left: 40px;
  }
  .cmshtml .dec-right {
    display: none;
    bottom: 60px;
    left: 540px;
  }
}

@media (max-width: 900px) {
  .cmshtml {
    /*menu*/
    /*footer*/
  }
  .cmshtml .tb-none {
    display: none;
  }
  .cmshtml .subvisual .catch-copy,
.cmshtml .mainvisual .catch-copy {
    bottom: 30%;
    left: 10%;
    z-index: 7;
    font-size: 2rem;
  }
  .cmshtml .subvisual-bg {
    width: 90%;
    height: 190px;
    overflow: hidden;
    border-radius: 2.0rem;
    margin: 0 auto;
  }
  .cmshtml .menu-btn {
    right: 30px;
  }
  .cmshtml .inline-block {
    display: block;
  }
  .cmshtml .gnav-list {
    padding: 0 0 50px;
  }
  .cmshtml .gnavi-logo {
    margin: 0;
    display: none;
  }
  .cmshtml .detail .logo {
    grid-template-columns: 1fr 1fr;
  }
  .cmshtml .col2-wrp-center .w28percent {
    width: 100%;
  }
  .cmshtml footer .fnav-item a {
    padding: 15px 20px;
    color: #333;
  }
  .cmshtml .fnav-list .line {
    display: block;
    padding: 10px 5%;
  }
  .cmshtml .mid-gul {
    margin: 0 0 0 15px;
  }
  .cmshtml .fnav-logo img {
    width: 40%;
  }
  .cmshtml .col2-btw {
    flex-direction: column;
  }
  .cmshtml .w65percent {
    width: 100%;
  }
  .cmshtml .w30percent {
    width: 80%;
    margin: 0 auto;
  }
}

@media (max-width: 601px) {
  .cmshtml header .col2-ard {
    display: block;
    padding: 10px;
  }
  .cmshtml header .name {
    font-size: 1.0rem;
    font-weight: bold;
  }
  .cmshtml .detail .name {
    font-size: 1.5rem;
  }
  .cmshtml .detail .small {
    font-size: 0.8rem;
    text-align: left;
  }
  .cmshtml .logo-img img {
    width: 69px;
  }
  .cmshtml footer .logo-img img {
    width: 100px;
  }
  .cmshtml .logo {
    display: block;
    padding: 10px 10px;
  }
  .cmshtml .detail .logo {
    display: block;
    padding: 0;
  }
  .cmshtml .mainvisual .leaves {
    bottom: -29px;
  }
  .cmshtml .heading-27::before,
.cmshtml .heading-27::after {
    content: "";
    width: 30px;
    /* 横線の長さ */
  }
  .cmshtml .heading-27::before {
    margin-right: 10px;
    /* 文字との余白 */
  }
  .cmshtml .heading-27::after {
    margin-left: 10px;
    /* 文字との余白 */
  }
  .cmshtml .more-btn a {
    padding: 10px 50px;
  }
  .cmshtml h2 {
    margin: 0 0 10px;
  }
  .cmshtml .leaves img {
    width: 100px;
  }
  .cmshtml .greeting .leaves {
    bottom: 0;
    right: -78px;
  }
  .cmshtml .subvisual .catch-copy,
.cmshtml .mainvisual .catch-copy {
    /*right: 8%;*/
    left: 5%;
    bottom: 20%;
    font-size: 1.9rem;
  }
  .cmshtml .mainvisual .catch-copy .sub {
    font-size: .8rem;
  }
  .cmshtml .col2-wrp-center li {
    margin: 10px 0;
  }
  .cmshtml .col2-wrp-center picture img {
    width: calc(350vw / 12.80);
  }
  .cmshtml .col2-wrp-center li:nth-child(3n) {
    margin: 10px 0;
  }
  .cmshtml .division-list .w30percent {
    width: 80%;
  }
  .cmshtml .c-hamburger-menu__button {
    position: fixed;
    top: 0;
    right: 0;
  }
  .cmshtml .sp-none {
    display: none;
  }
  .cmshtml .col2-align {
    flex-direction: column;
  }
  .cmshtml .grid2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .cmshtml .p-t_b100 {
    padding: 55px 0;
  }
  .cmshtml .p-t_b70 {
    padding: 40px 0;
  }
  .cmshtml .picture-item img {
    width: 90%;
  }
  .cmshtml .text {
    max-width: 100%;
    padding: 20px 20px;
  }
  .cmshtml .w30percent {
    width: 80%;
    margin: 0 auto;
  }
  .cmshtml .greeting .more-btn {
    margin: 20px auto;
  }
  .cmshtml .dec-left {
    display: none;
    bottom: 0;
    left: -15px;
    transform: rotate(-10deg);
  }
  .cmshtml .text-odd {
    max-width: 90%;
    width: 90%;
    margin: auto;
    padding: 1.5rem;
    border: 0;
  }
  .cmshtml .text-even {
    max-width: 90%;
    width: 90%;
    margin: auto;
    padding: 1.5rem;
    border: 0;
  }
  .cmshtml .icon-item {
    padding: 0 15px 30px;
  }
  .cmshtml .footer-list-child-item {
    flex: 0 1 100%;
  }
  .cmshtml .detail .schedule-area {
    padding: 20px 0 10px;
    font-size: 0.8rem;
  }
  .cmshtml .bg-circle {
    background-image: url(../img/bg_02.png);
    background-position: bottom 250px left 10px;
    background-repeat: no-repeat;
  }
}

.cmshtml .demo_stage {
  /*ブラウザでの猫と草の位置*/
  position: relative;
}

.cmshtml .demo_item {
  /*ねこの画像サイズ*/
  width: 150px;
  display: block;
  position: relative;
  bottom: 30px;
  cursor: pointer;
}

.cmshtml .demo_item.anime {
  /*ねこ画像の上下の動き*/
  animation-name: upDown;
  animation-iteration-count: infinite;
  animation-duration: 0.1s;
  animation-direction: alternate;
  animation-timing-function: steps(2);
  transition-duration: .3s;
  transition-property: transform;
}

.cmshtml .demo_wrap {
  /*往復のスピードと位置*/
  display: block;
  position: absolute;
  top: 20px;
  animation-fill-mode: forwards;
  animation-timing-function: linear;
  animation-duration: 15s;
  animation-iteration-count: 1;
  margin-right: -25px;
}

.cmshtml .demo_wrap[data-order="left"] {
  /*左に行く*/
  animation-name: GoLeft;
}

.cmshtml .demo_wrap[data-order="right"] {
  /*右に行く*/
  animation-name: GoRight;
}

.cmshtml [data-order="right"] > .demo_item {
  /*反転する*/
  transform: rotateY(180deg);
}

@keyframes GoLeft {
  /*反転の位置*/
  0% {
    right: 10%;
  }
  100% {
    right: 90%;
  }
}

@keyframes GoRight {
  /*反転の位置*/
  0% {
    right: 90%;
  }
  100% {
    right: 10%;
  }
}

@keyframes upDown {
  /*上下の数値*/
  0% {
    top: 0;
  }
  100% {
    top: 3px;
  }
}