/* ##############################################################################

    KEYFRAMES

############################################################################## */

.fadein {
  opacity: 0;
  transform: translate(0, 32px);
  -moz-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  -webkit-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  -ms-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.fadein.scrollin {
  opacity: 1;
  transform: translate(0, 0);
}

.hero .fadein {
  opacity: 0;
  transform: translate(0, 0);
  -moz-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);
  -webkit-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);
  -ms-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.hero .fadein.scrollin {
  opacity: 1;
}

@-webkit-keyframes campaign {
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes campaign {
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

/* ##############################################################################

    COMMON

############################################################################## */

html {
  height: 100%;
  overflow-y: scroll;
}

body {
  min-width: 1060px;
  padding-top: 78px;
  overflow: hidden;
}

@media only screen and (max-width: 767px) {
  body {
    min-width: 0;
    padding-top: 0;
    padding-bottom: 56px;
  }
}

/* layout
**************************************** */

/* --- inner --- */
.inner {
  width: 90%;
  max-width: 1360px;
  margin: 0 auto;
}

.inner-sm {
  max-width: 1280px;
}

.inner-sm2 {
  max-width: 980px;
}

.inner-xs {
  max-width: 880px;
}

.inner-lg {
  width: calc(100% - 80px);
  max-width: none;
}

/* --- section_pdg --- */
.section_pdg {
  padding-top: 64px;
  padding-bottom: 64px;
}

.home main .section_pdg {
  padding-top: 80px;
  padding-bottom: 80px;
}

/* --- float --- */
.flt-rgt {
  float: right;
}

.flt-lft {
  float: left;
}

/* --- position --- */
.pos_rel {
  position: relative;
  z-index: 0;
}

/* --- margin --- */
.mgn-btm8 {
  margin-bottom: 8px;
}

.mgn-btm16 {
  margin-bottom: 16px;
}

.mgn-btm24 {
  margin-bottom: 24px;
}

.mgn-btm32 {
  margin-bottom: 32px;
}

.mgn-btm40 {
  margin-bottom: 40px;
}

.mgn-btm48 {
  margin-bottom: 48px;
}

.mgn-btm56 {
  margin-bottom: 56px;
}

.mgn-btm64 {
  margin-bottom: 64px;
}

.mgn-btm72 {
  margin-bottom: 72px;
}

.mgn-btm80 {
  margin-bottom: 80px;
}

.mgn-btm88 {
  margin-bottom: 88px;
}

.mgn-btm96 {
  margin-bottom: 96px;
}

/* --- pc or sp --- */
.pc-none,
.pc-none-inline,
.pc-none-table,
.pc-none-flex {
  display: none;
}

.sp-none {
  display: block;
}

.sp-none-inline {
  display: inline;
}

.sp-none-table {
  display: table;
}

.sp-none-flex {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

@media screen and (max-width: 767px) {
  .inner {
    width: 90%;
  }

  .mgn-btm16 {
    margin-bottom: 8px;
  }

  .mgn-btm24 {
    margin-bottom: 16px;
  }

  .mgn-btm32 {
    margin-bottom: 16px;
  }

  .mgn-btm40 {
    margin-bottom: 24px;
  }

  .mgn-btm48 {
    margin-bottom: 24px;
  }

  .mgn-btm56 {
    margin-bottom: 32px;
  }

  .mgn-btm64 {
    margin-bottom: 32px;
  }

  .mgn-btm72 {
    margin-bottom: 40px;
  }

  .mgn-btm80 {
    margin-bottom: 40px;
  }

  .mgn-btm88 {
    margin-bottom: 48px;
  }

  .sp-none,
  .sp-none-inline,
  .sp-none-table,
  .sp-none-flex {
    display: none;
  }

  .pc-none {
    display: block;
  }

  .pc-none-inline {
    display: inline;
  }

  .pc-none-table {
    display: table;
  }

  .pc-none-flex {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }

  /* --- section_pdg --- */
  .section_pdg {
    padding-top: 32px;
    padding-bottom: 32px;
  }

  .home main .section_pdg {
    padding-top: 40px;
    padding-bottom: 40px;
  }
}

/* flex
**************************************** */

/* --- ブロック要素 --- */
.flex {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

/* --- インライン要素 --- */
.flex-inline {
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

/* --- 逆向き --- */
.flex-reverse {
  -webkit-flex-direction: row-reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

/* --- 縦並び --- */
.flex-column {
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

/* --- 水平方向揃え --- */
.flex-j-start {
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.flex-j-end {
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.flex-j-ctr {
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.flex-j-between {
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.flex-j-around {
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
}

/* --- 垂直方向揃え --- */
.flex-a-start {
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.flex-a-end {
  -webkit-align-items: flex-end;
  -ms-flex-align: end;
  align-items: flex-end;
}

.flex-a-ctr {
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.flex-a-baseline {
  -webkit-align-items: baseline;
  -ms-flex-align: baseline;
  align-items: baseline;
}

.flex-a-stretch {
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}

/* --- 子要素の折り返し設定 --- */
.flex-c-nowrap {
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
}

.flex-c-wrap {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

/* --- 子要素の複数行設定 --- */
.flex-c-reverse {
  -webkit-flex-wrap: wrap-reverse;
  -ms-flex-wrap: wrap-reverse;
  flex-wrap: wrap-reverse;
}

.flex-c-start {
  -webkit-align-content: flex-start;
  -ms-flex-line-pack: start;
  align-content: flex-start;
}

.flex-c-start {
  -webkit-align-items: flex-start;
  -ms-flex-line-pack: start;
  align-content: flex-start;
}

.flex-c-end {
  -webkit-align-content: flex-end;
  -ms-flex-line-pack: end;
  align-content: flex-end;
}

.flex-c-ctr {
  -webkit-align-content: center;
  -ms-flex-line-pack: center;
  align-content: center;
}

.flex-c-baseline {
  -webkit-align-content: baseline;
  -ms-flex-line-pack: baseline;
  align-content: baseline;
}

.flex-c-stretch {
  -webkit-align-content: stretch;
  -ms-flex-line-pack: stretch;
  align-content: stretch;
}

/* --- ざっくりflexレイアウト --- */
.flex-col2,
.flex-col3,
.flex-col4 {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.flex-col2>* {
  width: 48.5%;
  margin-right: 3%;
  margin-bottom: 3%;
}

.flex-col2>*:nth-child(even) {
  margin-right: 0;
}

.flex-col3>* {
  width: 31.33%;
  margin-right: 3%;
  margin-bottom: 3%;
}

.flex-col3>*:nth-child(3n + 3) {
  margin-right: 0;
}

.flex-col4>* {
  width: 23.5%;
  margin-right: 2%;
  margin-bottom: 2%;
}

.flex-col4>*:nth-child(4n + 4) {
  margin-right: 0;
}

.flex-col4 p {
  font-size: 94%;
}

/* --- flex-main --- */
.flex-main {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.flex-main .txtarea {
  width: 45%;
  margin-left: 5%;
}

.flex-main .txtarea a {
  margin-top: 36px;
}

.flex-main .imgarea {
  position: relative;
  width: 50%;
}

.flex-main .imgarea-txt {
  position: absolute;
  left: -88px;
  bottom: -36px;
  font-size: 375%;
  line-height: 1;
}

.flex-main.flex-reverse .txtarea {
  margin-left: 0;
  margin-right: 5%;
}

.flex-main.flex-reverse .imgarea-txt {
  left: auto;
  right: -88px;
}

/* --- flex-main3 --- */
.flex-main3 .gap_bg {
  top: 376px;
  bottom: 32px;
}

.flex-main3 li {
  position: relative;
  counter-increment: num;
  padding: 0 24px 24px;
  line-height: 2.1;
  background-color: #fff;
}

.flex-main3 li .num {
  position: absolute;
  top: -1.05em;
  left: -8px;
  font-size: 400%;
  letter-spacing: -0.05em;
}

.flex-main3 li .num::before {
  content: counter(num, decimal-leading-zero);
}

.flex-main3 li img {
  margin-bottom: 30px;
}

.flex-main3 li .heading-2 {
  margin-bottom: 20px;
}

.flex-main3 li p:not(.num) {
  margin-bottom: 0.6em;
}

.flex-main3 .btn {
  margin-top: 24px;
}

@media screen and (max-width: 1580px) {
  .flex-main .imgarea-txt {
    left: -40px;
  }

  .flex-main.flex-reverse .imgarea-txt {
    right: -40px;
  }
}

@media screen and (max-width: 768px) {
  .flex-sp {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }

  /* --- 縦並び - sp --- */
  .flex-sp-block {
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  /* --- ざっくりflexレイアウト - sp --- */
  .flex-sp-col2>*,
  .flex-sp-col2.flex-col3>*:nth-child(3n + 3) {
    width: 48.5%;
    margin-right: 3%;
    margin-bottom: 3%;
  }

  .flex-sp-col2>*:nth-child(even) {
    margin-right: 0;
  }

  .flex-sp-col3>*,
  .flex-sp-col3.flex-col4>*:nth-child(4n + 4) {
    width: 31.33%;
    margin-right: 3%;
    margin-bottom: 3%;
  }

  .flex-sp-col3>*:nth-child(3n + 3) {
    margin-right: 0;
  }

  .flex-sp-block.flex-col2>*,
  .flex-sp-block.flex-col2.flex-col3>*:nth-child(3n + 3),
  .flex-sp-block.flex-col3>*,
  .flex-sp-block.flex-col3.flex-col4>*:nth-child(4n + 4),
  .flex-sp-block.flex-col4>*,
  .flex-sp-block.flex-col4.flex-col4>*:nth-child(4n + 4) {
    width: 100%;
    margin-right: 0;
  }

  /* --- flex-main --- */
  .flex-main.flex-sp-block {
    display: block;
  }

  .flex-main .txtarea {
    width: 100%;
    margin-left: 0;
  }

  .flex-main .heading-1 {
    line-height: 1.7;
    padding-bottom: 8px;
  }

  .flex-main .txtarea a {
    margin-top: 28px;
  }

  .flex-main.flex-reverse .txtarea {
    margin-right: 0;
    margin-left: 0;
  }

  .flex-main .imgarea {
    width: 111%;
    transform: translateX(-5%);
    margin-bottom: 48px;
  }

  .flex-main .imgarea-txt {
    bottom: -24px;
    left: 8px;
    font-size: 280%;
  }

  .flex-main.flex-reverse .imgarea-txt {
    right: 8px;
  }

  /* --- flex-main3 --- */
  .flex-main3 li {
    padding-top: 24px;
  }

  .flex-main3 li:first-of-type {
    margin-top: -16px;
  }

  .home .flex-main3 li:first-of-type {
    margin-top: -40px;
  }

  .flex-main3 li:not(:last-of-type) {
    margin-bottom: 24px;
  }

  .flex-main3 li .num {
    top: -0.5em;
    left: 4px;
  }

  .flex-main3 li img {
    margin-bottom: 24px;
  }

  .flex-main3 li .heading-2 {
    margin-bottom: 14px;
  }
}

@media screen and (max-width: 374px) {
  .flex-main .imgarea-txt {
    font-size: 232%;
  }
}

/* bg
**************************************** */
.bg-grn {
  background-color: #85c64c;
}

.bg-l_grn {
  background-color: #f1f9ea;
}

.bg-ylw {
  background-color: #f3df68;
}

.bg-l_ylw {
  background-color: #fefcf0;
}

.bg-red {
  background-color: #ee4242;
}

.bg-gry {
  background-color: #f5f5f5;
}

.gap_bg {
  position: absolute;
  top: 320px;
  left: 0;
  right: 0;
  bottom: -8px;
  z-index: -1;
  display: block;
}

@media only screen and (max-width: 767px) {
  .bg-l_grn {
    background-color: #e9f5de;
  }

  .bg-l_ylw {
    background-color: #fffbdf;
  }

  .gap_bg+.inner {
    padding-bottom: 32px;
  }
}

/* ttl
**************************************** */

/* --- page_ttl --- */
.page_ttl {
  position: relative;
}

.page_ttl-bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: calc(100% - 320px);
  background-image: url(../images/common/newsrelease_page_ttl.jpg);
  background-position: center left;
}

.page-water-package .page_ttl-bg {
  background-image: url(../images/water-package/water_page_ttl.jpg);
}

.page-gaihekitosou .page_ttl-bg {
  background-image: url(../images/common/gaihekitosou_page_ttl.jpg);
}

.page-takumi .page_ttl-bg {
  background-image: url(../images/takumi/takumi_page_ttl.jpg);
}

.page-sanpai .page_ttl-bg {
  background-image: url(../images/sanpai/sanpai_page_ttl.jpg);
}

.page-shindan .page_ttl-bg {
  background-image: url(../images/shindan/shindan_page_ttl.jpg);
}

.page-faq .page_ttl-bg {
  background-image: url(../images/common/faq_page_ttl.jpg);
}

.page-flow .page_ttl-bg {
  background-image: url(../images/flow/flow_page_ttl.jpg);
}

.page-sale .page_ttl-bg {
  background-image: url(../images/sale/sale_page_ttl.jpg);
}

.page-reason .page_ttl-bg {
  background-image: url(../images/reason/reason_page_ttl.jpg);
}

.page-company .page_ttl-bg {
  background-image: url(../images/company/company_page_ttl.jpg);
}

.page-menu .page_ttl-bg {
  background-image: url(../images/menu/menu_page_ttl.jpg);
}

.page-kitchen .page_ttl-bg {
  background-image: url(../images/menu/menu_kitchen_page_ttl.jpg);
}

.page-outerwall .page_ttl-bg {
  background-image: url(../images/menu/menu_outerwall_page_ttl.jpg);
}

.page-refurbish .page_ttl-bg {
  background-image: url(../images/menu/menu_refurbish_page_ttl.jpg);
}

.page-bath .page_ttl-bg {
  background-image: url(../images/menu/menu_bath_page_ttl.jpg);
}

.page-toilet .page_ttl-bg {
  background-image: url(../images/menu/menu_toilet_page_ttl.jpg);
  background-position: center 98%;
}

.page-others .page_ttl-bg {
  background-image: url(../images/menu/menu_others_page_ttl.jpg);
}

.page-blog .page_ttl-bg,
.archive- .page_ttl-bg,
.archive-blog .page_ttl-bg,
.single- .page_ttl-bg,
.single-blog .page_ttl-bg {
  background-image: url(../images/common/blog_page_ttl.jpg);
}

.archive-works .page_ttl-bg,
.single-works .page_ttl-bg {
  background-image: url(../images/common/works_page_ttl.jpg);
}

.page_ttl-txt {
  position: relative;
  padding: 120px 0 120px 80px;
}

.page_ttl-jp,
.page_ttl-en {
  display: block;
}

.page_ttl-jp {
  font-size: 350%;
  line-height: 2;
  letter-spacing: 0.1em;
  font-weight: normal;
  text-shadow: #fff 1px 1px 16px, #fff -1px 1px 16px, #fff 1px -1px 16px,
    #fff -1px -1px 16px, #fff 0 0 16px;
}

.page_ttl-en {
  padding-left: 6px;
  font-size: 120%;
  line-height: 1;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

@media screen and (max-width: 1440px) {
  .page_ttl-txt {
    padding: 120px 0;
  }
}

@media only screen and (max-width: 767px) {
  .page_ttl {
    margin-top: 5%;
  }

  .page_ttl-bg {
    width: calc(100% - 80px);
    background-size: cover;
  }

  .page_ttl-txt {
    padding: 80px 0;
  }

  .page_ttl-jp {
    font-size: 200%;
    line-height: 1.4;
    margin-bottom: 16px;
  }

  .page_ttl-en {
    padding-left: 2px;
    font-size: 80%;
  }
}

/* --- breadcrumbs --- */
#breadcrumbs {
  background-color: #fefcf0;
  padding-top: 8px;
  padding-bottom: 8px;
  margin-bottom: 40px;
  font-size: 85%;
}

#breadcrumbs a {
  color: #85c64c;
  text-decoration: underline;
}

#breadcrumbs a:hover {
  opacity: 0.6;
}

/* --- section_ttl --- */
.section_ttl {
  font-size: 237.5%;
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: 0.08em;
}

.section_ttl span {
  display: block;
  margin-top: 8px;
  font-size: 47.5%;
}

.section_ttl+p {
  transform: translateY(-16px);
}

@media all and (-ms-high-contrast: none) {

  .section_ttl.font-jp,
  .heading-1.font-jp,
  .heading-2.font-jp {
    transform: translateY(16px);
  }

  .section_ttl span {
    transform: translateY(-16px);
  }
}

/* --- heading --- */
.heading-1,
.heading-2,
.secTtl1,
.secTtl2 {
  font-weight: 500;
}

.heading-1,
.secTtl1 {
  font-size: 225%;
  line-height: 1.6;
  letter-spacing: 0.08em;
}

.heading-2,
.secTtl2 {
  font-size: 150%;
  line-height: 1.6;
  letter-spacing: 0.07em;
}

.heading-3 {
  font-size: 125%;
}

.heading-4 {
  font-size: 100%;
}

@media only screen and (max-width: 767px) {
  .section_ttl {
    font-size: 175%;
  }

  .section_ttl+p {
    padding-top: 12px;
  }

  .heading-1,
  .secTtl1 {
    font-size: 175%;
  }

  .heading-2,
  .secTtl2 {
    line-height: 1.7;
    font-size: 134%;
  }
}

/* txt
**************************************** */
.txt-lg {
  font-size: 107%;
}

.txt-sm {
  font-size: 93%;
}

.txt-ctr {
  text-align: center;
}

.txt-rgt {
  text-align: right;
}

.txt-grn {
  color: #85c64c;
}

.txt-ylw {
  color: #f3df68;
}

.txt-red {
  color: #ee4242;
}

.txt-attention {
  font-size: 88%;
  color: #999;
}

.txt-attention-kome {
  position: relative;
  padding-left: 1.4em;
}

.txt-attention-kome::before {
  content: "※";
  position: absolute;
  left: 0;
  top: 0;
}

.txtarea p:not(:last-child) {
  margin-bottom: 1em;
}

/* font
**************************************** */
.font-jp,
.secTtl1,
.secTtl2 {
  font-family: ryo-display-plusn, serif;
  font-style: normal;
}

.font-eng {
  font-family: lamar-pen, sans-serif;
  font-style: normal;
}

.font-eng2 {
  font-family: lato, sans-serif;
  font-style: normal;
}

@media only screen and (max-width: 767px) {
  .font-jp {
    font-weight: bold !important;
  }
}

/* table & list
**************************************** */
table {
  width: 100%;
}

/* --- table_default --- */
.table_default th,
.table_default td {
  padding: 16px 8px;
  vertical-align: top;
}

.table_default th {
  border-bottom: 2px solid #85c64c;
}

.table_default td {
  padding: 16px 24px;
  border-bottom: 1px solid #bbb;
  border-left: 8px solid #fff;
}

/* --- table_line --- */
.table_line th,
.table_line td {
  padding-left: 24px;
  padding-right: 24px;
}

.table_line th {
  padding-top: 8px;
  padding-bottom: 8px;
  background-color: #f1f1f1;
  border: 1px solid #bbb;
  font-size: 107%;
}

.table_line td {
  padding-top: 10px;
  padding-bottom: 10px;
  border: 1px solid #c2c2c2;
  font-size: 93%;
}

/* --- list ---- */
.list {
  list-style-type: none;
}

.list li:not(:last-child) {
  margin-bottom: 16px;
}

.list li {
  position: relative;
  padding-left: 1.4em;
}

.list-disc li::before,
.list-square li::before,
.list-circle li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.7em;
  width: 8px;
  height: 8px;
  border-radius: 6px;
  background-color: #82c647;
}

/* 数字付きリスト */
.list-num {
  padding-left: 1.4em;
  list-style-type: decimal;
}

.list-num li {
  padding-left: 0;
}

.list-num li::before {
  display: none;
}

/* 白丸付きリスト */
.list-circle li::before {
  border: 1px solid #82c647;
  background-color: transparent;
}

/* 四角付きリスト */
.list-square li::before {
  border-radius: 0;
  background-color: #82c647;
}

/* 入れ子のスタイル */
.list li ul {
  margin-top: 16px;
}

.list li ul li::before {
  width: 6px;
  height: 6px;
  top: 0.8em;
}

/* --- dlリスト --- */
.list-dl {
  position: relative;
  border-top: 1px solid #bbb;
}

.list-dl dt {
  position: absolute;
  width: 140px;
  padding-top: 20px;
  padding-left: 20px;
  padding-right: 16px;
  font-weight: 700;
}

.list-dl dd {
  padding-left: 140px;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-right: 16px;
  border-bottom: 1px solid #bbb;
}

/* --- example-list --- */
.example-list {
  display: inline-block;
  padding: 48px 80px;
  text-align: left;
}

.example-list li:not(:last-child) {
  margin-bottom: 8px;
}

.example-list::before {
  content: "";
  position: absolute;
  left: -80px;
  bottom: -32px;
  display: block;
  width: 130px;
  height: 102px;
  background-image: url(../images/common/example-list--deco1.png);
}

.example-list::after {
  content: "";
  position: absolute;
  top: -48px;
  right: -48px;
  display: block;
  width: 108px;
  height: 118px;
  background-image: url(../images/common/example-list--deco2.png);
}

@media all and (-ms-high-contrast: none) {
  .example-list {
    max-width: 1280px;
  }
}

/* --- img-list --- */
.img-list li {
  padding: 40px 16px;
  border-bottom: solid 1px #bbb;
  line-height: 2.1;
}

.img-list li:first-of-type {
  padding-top: 0;
}

.img-list li .imgarea {
  margin-right: 40px;
  border-radius: 50%;
  overflow: hidden;
}

.img-list li .txtarea {
  width: calc(100% - 240px);
}

/* --- flow-list --- */
.flow-list {
  counter-reset: num2;
  background-color: #fff;
  padding: 24px 64px 64px;
}

.flow-list li {
  position: relative;
  padding-left: 80px;
}

.flow-list li:not(:last-of-type) {
  margin-bottom: 40px;
}

.flow-list li::before {
  content: "";
  position: absolute;
  top: 52px;
  left: 24px;
  display: block;
  width: 0;
  height: calc(100% - 32px);
  border-left: 1px solid #ddd;
}

.flow-list h3::before {
  counter-increment: num2;
  content: counter(num2, decimal-leading-zero);
  position: absolute;
  top: -16px;
  left: -14px;
  display: block;
  padding-left: 8px;
  color: #85c64c;
  text-align: center;
  font-family: lamar-pen, sans-serif;
  font-style: normal;
  letter-spacing: -0.05em;
  font-size: 200%;
}

.flow-list .txtarea {
  width: 65%;
  margin-right: 5%;
}

.flow-list .txtarea p,
.flow-list .txtarea table {
  margin-bottom: 0.6em;
  font-size: 95%;
  line-height: 2;
}

.flow-list .imgarea {
  width: 30%;
}

@media only screen and (max-width: 767px) {

  /* --- table_default --- */
  .table_default th,
  .table_default td {
    display: block;
    text-align: left;
  }

  .table_default th {
    padding: 14px 16px 0;
    border-bottom: none;
  }

  .table_default td {
    padding: 8px 16px 14px;
    border-bottom: 1px solid #bbb;
    border-left: none;
  }

  /* --- table_line --- */
  .table_line th,
  .table_line td {
    padding-left: 8px;
    padding-right: 8px;
  }

  .table_line th {
    font-size: 100%;
  }

  /* --- example-list --- */
  .example-list {
    padding: 36px 32px 32px;
  }

  .example-list::before {
    left: -16px;
    bottom: -16px;
    width: 65px;
    height: 51px;
    background-size: contain;
  }

  .example-list::after {
    top: -16px;
    right: -16px;
    display: block;
    width: 54px;
    height: 59px;
    background-size: contain;
  }

  /* --- img-list --- */
  .img-list li {
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 24px 0;
    font-size: 94%;
    line-height: 2;
  }

  .img-list li .imgarea {
    width: 72px;
    margin-right: 24px;
  }

  .img-list li .txtarea {
    width: calc(100% - 96px);
  }

  /* --- flow-list --- */
  .flow-list {
    padding: 8px 16px 64px 12px;
  }

  .flow-list li {
    padding-left: 56px;
  }

  .flow-list li:not(:last-of-type) {
    margin-bottom: 32px;
  }

  .flow-list li::before {
    top: 48px;
    left: 24px;
    height: calc(100% - 16px);
  }

  .flow-list h3::before {
    top: -10px;
    left: -6px;
    font-size: 180%;
    font-weight: 500;
  }

  .flow-list .txtarea {
    width: 100%;
    margin-right: 0;
  }

  .flow-list .imgarea {
    width: 100%;
  }

  .flow-list .txtarea table {
    margin-bottom: 16px;
  }
}

/* btn
**************************************** */
.btn {
  position: relative;
  display: block;
  width: 280px;
  max-width: 100%;
  height: 56px;
  line-height: 52px;
  letter-spacing: 0.1em;
  font-size: 107%;
  text-align: center;
  background-color: #ee4242;
  border: solid 1px #ee4242;
  color: #fff;
}

.btn.flex {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.btn.mgn-auto {
  margin-right: auto;
  margin-left: auto;
}

.btn::before {
  content: "";
  position: absolute;
  top: calc(50% - 5px);
  right: 20px;
  display: block;
  width: 8px;
  height: 8px;
  border-top: solid 1px #fff;
  border-right: solid 1px #fff;
  transform: rotate(45deg);
  transition: all 0.4s ease-out;
}

.btn:hover {
  background-color: transparent;
  border: solid 1px #ee4242;
  color: #ee4242;
}

.btn:hover::before {
  border-top: solid 1px #ee4242;
  border-right: solid 1px #ee4242;
}

/* --- btn-gry --- */
.btn-gry {
  width: 100%;
  height: 80px;
  line-height: 76px;
  font-size: 125%;
  color: #000;
  border: none;
  background-color: #f1f1f1;
  border-radius: 40px;
}

.btn-gry::before {
  top: calc(50% - 6px);
  right: 40px;
  width: 10px;
  height: 10px;
  border-color: #000;
  color: #000;
}

.btn-gry:hover {
  border: none;
  border: none;
  color: #000;
  background-color: #ddd;
}

.btn-gry:hover::before {
  border-color: #000;
}

@media all and (-ms-high-contrast: none) {
  .btn-gry {
    line-height: 96px;
  }
}

@media only screen and (max-width: 767px) {
  .btn {
    margin-right: auto;
    margin-left: auto;
  }

  .btn-gry {
    height: 64px;
    line-height: 62px;
    font-size: 107%;
    border-radius: 32px;
  }

  .btn-gry::before {
    top: calc(50% - 5px);
    right: 20px;
    width: 8px;
    height: 8px;
  }
}

/* ##############################################################################

    HEADER

############################################################################## */

/* header
**************************************** */
.header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  min-width: 1060px;
  padding: 0;
  background: none;
  background-color: #fff;
  transition: all 0.4s ease-out;
}

.header--logo {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 20;
  width: 280px;
  padding: 19px;
  background-color: #fff;
  transition: all 0.4s ease-out;
}

.header--logo img {
  width: auto;
  height: 58px;
  transform: translateY(-2px);
  transition: all 0.4s ease-out;
}

.header--nav {
  width: calc(100% - 552px);
  margin-left: 300px;
  margin-right: 272px;
}

.header--flex {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 10;
}

.header--flex .header--flex_box {
  width: 136px;
  height: 98px;
  padding-bottom: 8px;
  text-align: center;
  font-weight: bold;
  transition: all 0.4s ease-out;
}



.header--flex .header--flex_box:hover {
  background-color: #f1d73d;
}

.header--flex p {
  width: 100%;
  font-size: 88%;
  line-height: 1.2;
  letter-spacing: 0.07em;
}

.header--flex p.cv_mail {
  width: 100%;
  font-size: 80%;
  line-height: 1.4;
  letter-spacing: 0.07em;
  margin-top: 0;
}

.header--flex_tel p {
  margin-top: -2px;
}

.header--flex_mail p {
  margin-top: -6px;
}

.header--flex .refusal-pc {
  background-color: #ee4242;
  color: #fff;
  width: 85%;
  padding: 4px 2px;
  text-align: center;
  margin: -8px auto 0;
  font-size: 78%;
  font-weight: bold;
}

.header--flex .refusal-sp {
  background-color: #ee4242;
  color: #fff;
  width: 85%;
  padding: 4px 2px;
  text-align: center;
  margin: 0 auto -6px;
  font-size: 78%;
  font-weight: bold;
  position: relative;
}

/*  --- fixed --- */
.header.fixed {
  box-shadow: 0 0 16px 0 rgba(13, 14, 18, 0.08);
}

.header.fixed .header--logo {
  width: 264px;
  padding: 13px 0;
}

.header.fixed .header--logo img {
  height: 52px;
}

.header.fixed .header--flex {
  box-shadow: 4px 4px 12px 0 rgba(13, 14, 18, 0.15);
}
.header .header--flex li:first-child {
  display: none;
}

@media all and (-ms-high-contrast: none) {

  .header--flex,
  .header--flex li {
    height: 98px;
  }
}

@media screen and (max-width: 1300px) {
  .header--logo {
    width: 240px;
  }

  .header--logo img {
    height: auto;
  }

  .header--nav {
    width: calc(100% - 468px);
    margin-left: 216px;
    margin-right: 272px;
  }
}

@media only screen and (max-width: 767px) {
  .header {
    position: absolute;
    min-width: 0;
  }

  .header--logo {
    width: 160px;
    padding: 12px;
  }

  .header--logo img {
    height: auto;
  }

  .header--flex {
    position: fixed;
    top: auto;
    bottom: 0;
    right: 56px;
    left: 0;
    z-index: 10;
  }

  .header--flex li {
    width: 100%;
  }

  .header--flex .header--flex_box {
    width: 100%;
    height: 56px;
    padding-bottom: 8px;
  }

  .header--flex p {
    width: auto;
    margin-left: 10px;
    font-size: 88%;
    text-align: left;
    line-height: 1.2;
  }

  .header--flex_tel img {
    transform: translateY(-3px);
  }

  .header--flex_mail img {
    transform: translateY(-7px);
  }

  .header--flex-list {
    align-items: flex-end;
  }
}

@media only screen and (max-width: 340px) {
  .header--flex p {
    margin-left: 6px;
    font-size: 80%;
    transform: translateY(-2px);
  }
}

@media only screen and (max-width: 767px) {

  .header--flex p.cv_mail {
    width: auto;
    font-size: 80%;
  }
}

/* gnav
**************************************** */
.gnav--list {
  position: relative;
  height: 78px;
}

.gnav--list>li>a {
  height: 78px;
  font-size: 94%;
}

.gnav--list>li>a,
.gnav--list-child p {
  position: relative;
  padding: 8px 40px;
  letter-spacing: 0.08em;
}

.gnav--list>li>a::before,
.gnav--list-child .content p::before {
  content: "";
  position: absolute;
  top: calc(50% - 6px);
  right: 12px;
  display: block;
  width: 7px;
  height: 7px;
  border-top: solid 1px #000;
  border-right: solid 1px #000;
  transform: rotate(135deg);
  opacity: 0.6;
  transition: all 0.4s ease-out;
}

.gnav--list>.hover>a,
.gnav--list-child a:hover p {
  color: #85c64c;
}

.gnav--list>.hover>a::before,
.gnav--list-child a:hover p::before {
  border-top-color: #85c64c;
  border-right-color: #85c64c;
}

.gnav--list-child .content p::before {
  top: calc(50% - 4px);
  transform: rotate(45deg);
}

.gnav--list>li:last-of-type>a {
  margin-right: 48px;
}

.gnav li:not(.gnav--works) .gnav--list-child .content p::before {
  display: none;
}

.gnav--list-child {
  position: fixed;
  top: 78px;
  right: 0;
  left: 0;
  z-index: 10;
  width: 100%;
  padding: 40px 32px 36px 48px;
  border-top: solid 1px #f2f2f2;
  transition: all 0.4s ease-out;
  transform: translateY(-8px);
  opacity: 0;
  pointer-events: none;
  box-shadow: 0 8px 8px 0 rgba(13, 14, 18, 0.02);
}

.gnav--list-child .content {
  width: calc(100% - 380px);
}

.gnav--list-child .section_ttl span {
  padding-top: 8px;
  font-size: 44%;
  font-weight: 700;
  letter-spacing: 0.15em;
}

.gnav--list-child li {
  width: 15.266%;
  max-width: 220px;
  margin: 0 0.7%;
  font-size: 88%;
  text-align: center;
  background-color: #fff;
}

.gnav--works .gnav--list-child li {
  width: 24%;
  max-width: none;
  margin: 8px 0.5%;
  padding: 8px 0;
  font-size: 100%;
}

.gnav--list .hover .gnav--list-child {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}

.gnav--list-child p {
  padding: 12px 0;
  line-height: 1.4;
  transition: all 0.4s ease-out;
}

.gnav--list-child img {
  transition: all 0.4s ease-out;
}

.gnav--list-child a:hover img {
  opacity: 0.6;
}

@media screen and (max-width: 1430px) {
  .gnav--list-child {
    padding: 28px 20px 24px;
  }

  .gnav--list-child .section_ttl {
    display: none;
  }

  .gnav--list-child .content {
    width: 100%;
  }
}

@media screen and (max-width: 1350px) {
  .gnav--list>li:last-of-type>a {
    margin-right: 8px;
  }
}

@media screen and (max-width: 1300px) {
  .gnav--list>li>a {
    padding: 8px 36px 8px 16px;
  }
}

@media screen and (max-width: 1224px) {

  .gnav--list>li>a,
  .gnav--list-child p {
    padding: 8px 16px;
  }

  .gnav--list>li>a::before {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .gnav {
    position: fixed;
    top: 100%;
    left: 0;
    right: 0;
    bottom: 56px;
    z-index: 9999;
    display: block;
    padding: 20px 16px;
    opacity: 0;
    pointer-events: none;
    transition: 0.4s ease-out;
    background-color: #e9f5de;
    overflow-y: scroll;
  }

  .header.active .gnav {
    top: 0;
    opacity: 1;
    pointer-events: all;
  }

  .gnav_btn {
    position: fixed;
    bottom: 0;
    right: 0;
    width: 56px;
    height: 56px;
    background-color: #000;
    z-index: 9999;
  }

  .gnav_btn--lines {
    position: relative;
    width: 28px;
    height: 20px;
  }

  .gnav_btn--lines span {
    transition: all 0.4s;
    box-sizing: border-box;
  }

  .gnav_btn--lines span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #fff;
  }

  .gnav_btn--lines span:nth-of-type(1) {
    top: 0;
    width: 70%;
  }

  .gnav_btn--lines span:nth-of-type(2) {
    top: 50%;
  }

  .gnav_btn--lines span:nth-of-type(3) {
    bottom: 0;
  }

  .header.active .gnav_btn--lines span:nth-of-type(1) {
    width: 100%;
    -webkit-transform: translateY(9px) rotate(-43deg);
    transform: translateY(9px) rotate(-43deg);
  }

  .header.active .gnav_btn--lines span:nth-of-type(2) {
    width: 0;
    opacity: 0;
  }

  .header.active .gnav_btn--lines span:nth-of-type(3) {
    -webkit-transform: translateY(-10px) rotate(43deg);
    transform: translateY(-10px) rotate(43deg);
  }

  .gnav--list {
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: auto;
  }

  .gnav--list li {
    width: 100%;
    margin-bottom: 8px;
    background-color: #fff;
  }

  .gnav--list>li>a {
    height: auto;
    padding: 12px 16px;
    font-size: 100%;
  }

  .gnav--list>li>a::before {
    top: calc(50% - 5px);
    right: 20px;
    display: block;
    width: 9px;
    height: 9px;
    transform: rotate(45deg);
  }

  .gnav li:not(.gnav--works) .gnav--list-child .content p::before {
    display: block;
  }

  .gnav--list-child .content p::before {
    right: 20px;
  }

  .gnav--list-child {
    position: static;
    top: auto;
    right: auto;
    width: auto;
    padding: 0;
    background-color: #fff;
    border-top: none;
    opacity: 1;
    pointer-events: auto;
    box-shadow: none;
    transform: translateY(0);
  }

  .gnav--list-child li,
  .gnav--works .gnav--list-child li {
    width: 100%;
    margin: 0;
    border-top: solid 1px #ddd;
    font-size: 88%;
    text-align: center;
  }

  .gnav--list-child li {
    max-width: none;
  }

  .gnav--list-child li a {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: left;
  }

  .gnav--list-child li img {
    width: 72px;
  }

  .gnav--list-child p {
    width: calc(100% - 72px);
  }

  .gnav--works .gnav--list-child li {
    padding: 0;
  }

  .gnav--list-child p:only-child {
    width: 100%;
    padding: 16px;
  }
}

/* ##############################################################################

    FOOTER

############################################################################## */
.footer {
  padding: 40px 0;
}

@media screen and (max-width: 1300px) {
  .footer>.flex {
    display: block;
  }
}

@media screen and (max-width: 767px) {
  .footer {
    padding: 40px 0 12px;
  }
}

/* foot--contact
**************************************** */
.foot--contact {
  margin-top: 48px;
  padding-top: 80px;
  overflow: hidden;
}

.home .foot--contact {
  margin-top: 0;
}

.foot--contact .inner {
  padding-bottom: 0;
}

.foot--contact .gap_bg {
  top: 148px;
  bottom: 0px;
  background-image: url(../images/common/home_contact-img01.png);
  background-position: left bottom;
  background-repeat: no-repeat;
}

.foot--contact .txtarea {
  width: calc(100% - 914px);
}

.foot--contact .formarea {
  width: 842px;
  padding: 64px;
  margin-top: 184px;
  margin-left: 72px;
  border: solid 2px #85c64c;
  background-color: #fff;
}

.foot--contact .formarea .campaign {
  position: absolute;
  top: -146px;
  right: -80px;
}

.foot--contact .formarea .ttl {
  position: absolute;
  top: -100px;
  left: 64px;
  display: block;
  width: 398px;
  padding: 10px 12px 14px;
  border: solid 2px #85c64c;
  background-color: #fff;
  text-align: center;
  font-weight: bold;
  line-height: 1.4;
}

.foot--contact .formarea .ttl img {
  display: inline-block;
  margin-right: 12px;
  transform: translateY(-4px);
}

.foot--contact .formarea .ttl p {
  font-size: 187%;
}

.foot--contact .formarea .ttl span {
  font-size: 88%;
}

.foot--contact .imgarea-txt {
  position: absolute;
  right: -88px;
  bottom: -36px;
  font-size: 375%;
  line-height: 1;
}

.foot--contact .formarea .ttl .refusal {
  background-color: #ee4242;
  color: #fff;
  padding: 4px 14px;
  text-align: center;
  font-weight: bold;
  font-size: 84%;
}

@media screen and (max-width: 1460px) {
  .foot--contact .formarea .campaign {
    right: -64px;
  }
}

@media screen and (max-width: 1358px) {
  .foot--contact .flex {
    display: block;
  }

  .foot--contact .txtarea {
    width: calc(100% - 240px);
  }

  .foot--contact .formarea {
    margin-top: 96px;
    margin-left: auto;
    margin-right: 0;
  }

  .foot--contact .formarea .campaign {
    right: -56px;
  }

  .foot--contact .imgarea-txt {
    right: -40px;
  }
}

@media screen and (max-width: 767px) {
  .grecaptcha-badge {
    visibility: hidden;
  }

  .foot--contact {
    margin-top: 16px;
    padding-top: 32px;
  }

  .foot--contact .gap_bg {
    top: 0px;
  }

  .foot--contact .txtarea {
    width: 100%;
  }

  .foot--contact .formarea {
    width: 100%;
    margin-top: 32px;
    padding: 16px;
  }

  .foot--contact .formarea .campaign {
    display: none;
  }

  .foot--contact .formarea .ttl {
    top: -48px;
    left: 12%;
    width: 76%;
    padding: 10px 0 14px;
  }

  .foot--contact .formarea .ttl p {
    font-size: 160%;
  }

  .foot--contact .imgarea-txt {
    right: 0;
    bottom: -22px;
    font-size: 275%;
  }

  .foot--contact .formarea .ttl img {
    width: 18px;
    margin-right: 8px;
    transform: translateY(-2px);
  }
}

@media screen and (max-width: 350px) {
  .foot--contact .formarea .ttl {
    left: 6%;
    width: 88%;
  }
}

/* foot--area
**************************************** */
.footer>.footer--area {
  padding: 16px 24px;
  margin-bottom: 32px;
  display: flex;
}

.footer--area .ttl {
  font-size: 125%;
  width: 120px;
}

.footer--area ul {
  width: calc(100% - 120px);
  max-width: 1200px;
}

.footer--area li {
  width: 11%;
  max-width: none;
  margin: 8px 0.5%;
  padding: 8px 0;
  text-align: center;
  background-color: #fff;
}

.footer--area li a:hover {
  color: #85c64c;
}

.footer--area li a:hover p::before {
  border-color: #85c64c;
}

.footer--area li a p {
  position: relative;
}

.footer--area li a p::before {
  content: "";
  position: absolute;
  top: calc(50% - 4px);
  right: 12px;
  display: block;
  width: 7px;
  height: 7px;
  border-top: solid 1px #000;
  border-right: solid 1px #000;
  transform: rotate(45deg);
  opacity: 0.6;
  transition: all 0.4s ease-out;
}

@media screen and (max-width: 767px) {
  .footer--area .ttl {
    text-align: center;
    margin-bottom: 8px;
  }

  .footer--area ul {
    width: 100%;
    justify-content: space-between;
  }

  .footer--area li {
    width: 48.5%;
  }
}

/* foot--access
**************************************** */
.access_content {
  padding-right: 28px;
}

.access_content .map {
  width: calc(100% - 292px);
  height: 200px;
  overflow: hidden;
}

.access_content .map iframe {
  width: 100%;
  transform: translateY(-204px);
}

.access_content .txtarea {
  width: 272px;
  margin-left: 20px;
}

.access_content .txtarea .ttl {
  margin-bottom: 16px;
  font-size: 125%;
  line-height: 1.6;
}

.access_content .txtarea .txt {
  font-size: 88%;
  line-height: 1.8;
}

.footer--sns {
  flex: 1;
  max-width: 800px;
}

.footer--sns .ig {
  display: flex;
  width: 240px;
  aspect-ratio: 276 / 109;
  margin-right: 10px;
  color: #fff;
  font-weight: bold;
}

.footer--sns .ig {
  position: relative;
  background: -webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
  background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
}

.footer--sns .ig::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: -webkit-linear-gradient(15deg,
      #ffdb2c,
      rgb(249, 118, 76) 25%,
      rgba(255, 77, 64, 0) 50%) no-repeat;
  background: linear-gradient(15deg,
      #ffdb2c,
      rgb(249, 118, 76) 25%,
      rgba(255, 77, 64, 0) 50%) no-repeat;
}

.footer--sns .ig img {
  margin-right: 12px;
  transform: translateY(-2px);
}

.footer--sns .ig:hover,
.footer--sns .blog:hover {
  opacity: 0.8;
}

.footer--sns .reform-guide {
  margin-right: auto;
}

.footer--sns .blog {
  position: relative;
  display: block;
  height: 64px;
  padding: 0 56px 0 40px;
  margin-top: 40px;
  margin-bottom: 12px;
  line-height: 1.4;
}

.footer--sns .blog::before {
  content: "";
  position: absolute;
  top: calc(50% - 5px);
  right: 24px;
  display: block;
  width: 9px;
  height: 9px;
  border-top: solid 1px #000;
  border-right: solid 1px #000;
  transform: rotate(45deg);
}

.footer--sns .imgarea-txt {
  position: absolute;
  top: -22px;
  left: -44px;
  color: #000;
  font-size: 200%;
}

.footer--sns .blog .blog_list {
  height: 100%;
}

.footer--sns .blog .date {
  margin-right: 16px;
  font-weight: bold;
}

.footer--sns .blog .ttl {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.footer--copyright {
  margin-top: 12px;
  text-align: right;
  line-height: 0.8;
  font-size: 75%;
}

.pbl {
  text-align: right;
  opacity: 0.5;
}

@media screen and (max-width: 1300px) {
  .footer--sns {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    width: 100%;
  }

  .footer--sns .blog {
    width: calc(100% - 520px);
    max-width: 560px;
    margin-bottom: 0;
    padding: 0 48px 0 24px;
  }

  .footer--sns .imgarea-txt {
    top: -22px;
    left: -16px;
  }
}

@media screen and (max-width: 767px) {
  .access_content {
    padding-right: 0;
    justify-content: space-between;
  }

  .access_content .txtarea,
  .access_content .map {
    width: 48%;
  }

  .access_content .map {
    height: 140px;
  }

  .access_content .map iframe {
    transform: translateY(-244px);
  }

  .access_content .txtarea {
    margin-top: 16px;
    margin-left: 0;
    order: 3;
  }

  .access_content .txtarea .ttl {
    margin-bottom: 12px;
    font-size: 115%;
  }

  .footer--sns {
    display: block;
  }

  .footer--sns .blog {
    width: 100%;
    margin-bottom: 10px;
  }

  .footer--copyright,
  .pbl {
    text-align: center;
  }

  .footer--sns > .flex-j-between {
    flex-wrap: wrap;
  }
  .footer--sns > .flex-j-between > div {
    width: 100%;
    margin-top: 1em;
  }

  .footer--sns .ig {
    /* width: calc(50% - 8px); */
    width: 100%;
    aspect-ratio: unset;
    height: 3.5rem;
    margin-right: 8px;
    margin-right: 0;
    text-align: center;
  }

  .footer--sns .ig img {
    margin-right: 0;
    transform: translateY(1px);
  }

  .footer--sns .reform-guide {
    width: 50%;
  }
  .footer--sns .reform-guide + div {
    width: 100%;
  }
}

/* ##############################################################################

    INDEX

############################################################################## */

/* hero
**************************************** */
.hero {
  position: relative;
  height: 824px;
  margin: 0 36px;
  /* background-image: url(../images/index/hero-bg.jpg); */
  background-repeat: no-repeat;
  background-position: center;
  background-color: rgba(0, 0, 0, 0.4);
}

.video_wrap {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  overflow: hidden;
}

.hero video {
  position: absolute;
  top: 50%;
  left: 50%;
  right: 0;
  bottom: 0;
  z-index: -1;
  width: 100%;
  min-width: 100%;
  min-height: 100%;
  transform: translate(-50%, -50%);
}

.hero--box {
  position: relative;
  width: 640px;
  height: 360px;
  padding-top: 64px;
  background-color: rgba(255, 255, 255, 0.86);
  border: solid 8px #85c64c;
  transform: translateY(-4px);
}

.hero--box::before,
.hero--box::after,
.hero--ttl::before {
  content: "";
  position: absolute;
  display: block;
  background-size: cover;
}

.hero--box::before {
  top: -32px;
  left: -38px;
  width: 94px;
  height: 102px;
  background-image: url(../images/index/hero-txt_deco01.png);
}

.hero--box::after {
  bottom: -56px;
  left: -144px;
  width: 912px;
  height: 218px;
  background-image: url(../images/index/hero-txt_deco02.png);
}

.hero--ttl {
  position: relative;
  display: inline-block;
  margin-bottom: 30px;
}

.hero--ttl::before {
  top: -130px;
  right: -136px;
  width: 152px;
  height: 156px;
  background-image: url(../images/index/hero-ttl_deco.png);
}

.hero--heading {
  font-size: 162%;
  letter-spacing: 0.1em;
}

.hero--txt {
  letter-spacing: 0.07em;
  line-height: 2.1;
}

.hero--campaign {
  position: absolute;
  right: 32px;
  bottom: 30px;
  opacity: 0;
  transform: translateY(24px);
  -webkit-animation: campaign 0.5s ease 2s 1 forwards;
  animation: campaign 0.5s ease 2s 1 forwards;
}

@media screen and (max-width: 1600px) {
  .hero video {
    width: auto;
    height: 100%;
  }
}

@media screen and (max-width: 1300px) {
  .hero--campaign {
    right: -24px;
    bottom: 24px;
  }
}

@media screen and (max-width: 767px) {
  .hero {
    height: 75vh;
    margin: 5% 3% 0;
    background-size: cover;
  }

  .video_wrap {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    overflow: hidden;
  }

  .video_wrap video {
    position: absolute;
    top: 50%;
    left: 50%;
    right: 0;
    bottom: 0;
    z-index: -1;
    width: 100%;
    height: auto;
    transform: translate(-50%, -50%);
    min-width: auto;
    min-height: auto;
  }

  .hero--box {
    width: auto;
    height: auto;
    padding: 48px 40px 44px;
    border-width: 5px;
    background-color: rgba(255, 255, 255, 0.9);
  }

  .hero--box::before {
    top: -16px;
    left: -19px;
    width: 47px;
    height: 51px;
  }

  .hero--box::after {
    bottom: -40px;
    left: calc(50% - 200px);
    width: 400px;
    height: 109px;
    background-size: 100% auto;
    background-repeat: no-repeat;
  }

  .hero--ttl {
    margin-bottom: 22px;
  }

  .hero--ttl img {
    width: 212px;
  }

  .hero--ttl::before {
    top: -65px;
    right: -68px;
    width: 76px;
    height: 78px;
  }

  .hero--heading {
    margin-bottom: 16px;
    font-size: 120%;
    line-height: 1.6;
  }

  .hero--campaign {
    position: absolute;
    right: -12px;
    bottom: 12px;
    width: 144px;
  }

  .hero--txt {
    font-size: 87%;
    line-height: 2;
  }
}

@media screen and (max-width: 320px) {
  .hero--box {
    padding: 40px 24px 36px;
  }

  .hero--ttl img {
    width: 184px;
  }
}

/* home_news
**************************************** */
.home_news {
  margin: 0 36px;
}

.home_news a {
  position: relative;
  display: block;
  padding: 20px 0;
}

.home_news a::before {
  content: "";
  position: absolute;
  top: calc(50% - 5px);
  right: 12px;
  display: block;
  width: 8px;
  height: 8px;
  border-top: solid 1px #000;
  border-right: solid 1px #000;
  transform: rotate(45deg);
}

.home_news dt {
  margin-right: 36px;
  font-weight: bold;
  transform: translateY(-1px);
}

@media screen and (max-width: 767px) {
  .home_news {
    margin: 0 3%;
    font-size: 94%;
  }

  .home_news a {
    padding: 16px 4px;
  }

  .home_news a::before {
    top: 26px;
    right: 14px;
  }

  .home_news dd {
    line-height: 1.7;
  }
}

/* home_about
**************************************** */

/* --- bnr_list --- */
.home_about .bnr_list02 {
  margin-bottom: 48px;
}

.home_about .bnr_list01 li {
  width: 32.333%;
  margin-right: 1%;
  margin-bottom: 1.5%;
}

.home_about .bnr_list02 li {
  width: 19%;
  margin-right: 1%;
  margin-bottom: 1.5%;
}

.home_about .bnr_list img,
.takumi_work .bnr_list img {
  position: absolute;
  left: 36px;
}

.home_about .bnr_list01 li:nth-of-type(1) img,
.takumi_work .bnr_list li:nth-of-type(1) img {
  top: calc(50% - 24px);
}

.home_about .bnr_list01 li:nth-of-type(2) img,
.takumi_work .bnr_list li:nth-of-type(2) img {
  top: calc(50% - 15px);
}

.home_about .bnr_list01 li:nth-of-type(3) img,
.takumi_work .bnr_list li:nth-of-type(3) img {
  top: calc(50% - 18px);
}

.home_about .bnr_list01 li:nth-of-type(4) img,
.home_about .bnr_list02 li:nth-of-type(1) img,
.takumi_work .bnr_list li:nth-of-type(4) img {
  top: calc(50% - 16px);
}

.home_about .bnr_list02 li:nth-of-type(2) img {
  top: calc(50% - 20px);
}

.home_about .bnr_list02 li:nth-of-type(3) img {
  top: calc(50% - 15px);
}

.home_about .bnr_list02 li:nth-of-type(4) img {
  top: calc(50% - 20px);
}

.home_about .bnr_list02 li:nth-of-type(5) img {
  top: calc(50% - 20px);
}

/* --- works_list --- */
.works_list {
  margin-left: 64px;
}

.works_list .imgarea {
  width: 280px;
  background-size: cover;
}

.works_list .imgarea::before {
  content: "";
  display: block;
  padding-top: 66%;
}

@media screen and (max-width: 1440px) {

  .home_about .bnr_list img,
  .takumi_work .bnr_list img {
    left: 20px;
  }
}

@media screen and (max-width: 1340px) {

  .home_about .bnr_list .sm-none,
  .takumi_work .bnr_list .sm-none {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .home_about .bnr_list .font-jp {
    font-family: "YuGothic", "游ゴシック", "ヒラギノ角ゴ Pro W3",
      "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック",
      sans-serif;
    font-weight: 500 !important;
    letter-spacing: 0.08em;
  }

  .home_about .bnr_list01 {
    padding-top: 0;
  }

  .home_about .bnr_list02 {
    margin-bottom: 32px;
  }

  .home_about .bnr_list01 li,
  .home_about .bnr_list02 li {
    width: 48%;
    margin-right: 2%;
    margin-bottom: 12px;
  }

  .home_about .bnr_list01 li:nth-of-type(even),
  .home_about .bnr_list02 li:nth-of-type(odd) {
    margin-right: 0;
  }

  .home_about .bnr_list01 a,
  .home_about .bnr_list02 a {
    padding-left: 8px;
  }

  .home_about .bnr_list img,
  .takumi_work .bnr_list img {
    transform: scale(0.7, 0.7);
  }

  .home_about .bnr_list img,
  .takumi_work .bnr_list img {
    left: 22px;
  }

  .home_about .bnr_list01 li:nth-of-type(1) img,
  .takumi_work .bnr_list li:nth-of-type(1) img {
    left: 16px;
  }

  .home_about .bnr_list01 li:nth-of-type(2) img,
  .takumi_work .bnr_list li:nth-of-type(2) img {
    left: 10px;
  }

  .home_about .bnr_list01 li:nth-of-type(3) img,
  .takumi_work .bnr_list li:nth-of-type(3) img {
    left: 10px;
  }

  .works_list .imgarea {
    width: 180px;
  }
}

@media screen and (max-width: 375px) {

  .home_about .bnr_list01 a,
  .home_about .bnr_list02 a {
    padding-left: 0;
    padding-right: 8px;
  }

  .home_about .bnr_list img,
  .takumi_work .bnr_list img {
    display: none;
  }
}

/* home_plan
**************************************** */
.home_plan {
  padding-top: 24px;
  padding-bottom: 40px;
}

.home_plan li {
  padding-top: 10px;
}

.home_plan li .heading-2 .deco-slash::before,
.home_plan li .heading-2 .deco-slash::after {
    position: absolute;
    top: 0;
    height: 100%;
    content: '';
}

.home_plan li .heading-2 .deco-slash::before {
    border-left: solid 2px #85c64c;
    left: -16px;
    transform: rotate(-24deg);
}

.home_plan li .heading-2 .deco-slash::after {
    border-right: solid 2px #85c64c;
    right: -16px;
    transform: rotate(24deg);
}

.home_plan li .plan-price{
  width: max-content;
  margin-left: auto;
  margin-right: auto;
  background: linear-gradient(transparent 68%, #f3df68 68%);
  background: -webkit-linear-gradient(transparent 68%, #f3df68 68%);
}

@media screen and (max-width: 767px) {
  .home_plan {
    padding-bottom: 32px;
  }
  .home_plan .flex-col3 li {
    padding-top: 38px;
  }
}

/* home_showroom
**************************************** */
.home_showroom {
  padding-top: 80px;
}

.home_showroom .flex-main a {
  margin-top: 0;
}

.home_showroom .refusal {
  font-size: 80%;
  color: #707070;
}

@media screen and (max-width: 767px) {
  .home_showroom {
    padding-top: 32px;
  }
}

/* home_bnr
**************************************** */
.home_bnr {
  padding-top: 80px;
  margin-bottom: 56px;
}

.home_bnr .gap_bg {
  top: 152px;
  bottom: -32px;
}

.home_bnr li {
  width: calc(50% - 20px);
  margin-bottom: 40px;
}

.home_bnr li:nth-of-type(odd) {
  margin-right: 40px;
}

.home_bnr a:hover {
  opacity: 0.7;
}

@media screen and (max-width: 767px) {
  .home_bnr {
    padding-top: 32px;
    margin-bottom: 0;
  }

  .home_bnr .gap_bg {
    bottom: -16px;
  }

  .home_bnr li {
    width: 100%;
    margin-bottom: 16px;
  }

  .home_bnr li:nth-of-type(odd) {
    margin-right: 0;
  }

  .home_bnr li:last-of-type {
    margin-bottom: 0;
  }
}

/* home_estimate
**************************************** */
.home_estimate {
  padding-top: 88px;
  padding-bottom: 40px;
}

.home_estimate.flex-main3 .gap_bg {
  top: 440px;
}

.home_estimate .flex-col2 .flex-col2>* {
  margin-bottom: 0;
}

@media screen and (max-width: 767px) {
  .home_estimate {
    padding-top: 72px;
  }

  .home .home_estimate.flex-main3 li {
    margin-top: -12px;
    margin-bottom: 8px;
    padding: 0 16px 12px;
  }

  .home_estimate .flex-col2 .heading-3 {
    padding-top: 16px;
    text-align: center;
    line-height: 1.6;
  }

  .home_estimate .flex-col2 p {
    font-size: 87%;
    line-height: 2;
  }
}

/* ##############################################################################

    PAGE

############################################################################## */

/* reason
**************************************** */

/* --- reason_point --- */
.reason_point .flex-main {
  margin-bottom: 96px;
}

.reason_point .flex-main .imgarea-txt {
  left: -40px;
  bottom: -48px;
  font-size: 640%;
}

.reason_point .flex-main.flex-reverse .imgarea-txt {
  left: auto;
  right: -40px;
}

/* --- reason_comment --- */
.reason_comment {
  padding-top: 0;
}

@media screen and (max-width: 767px) {
  .reason_point .flex-main {
    margin-bottom: 48px;
  }

  .reason_point .flex-main .imgarea-txt {
    left: 12px;
    bottom: -32px;
    font-size: 400%;
  }

  .reason_point .flex-main.flex-reverse .imgarea-txt {
    left: auto;
    right: 12px;
  }
}

/* water-package
**************************************** */

/* --- water-package_about --- */
.water-package_about {
  padding-bottom: 0;
}

.water-package_menu {
  padding: 48px 64px 56px;
  border: solid 5px #40b6ee;
  letter-spacing: 0.06em;
  background-color: rgba(64, 182, 238, 0.03);
}

.water-package_menu strong {
  font-weight: bold;
}

.water-package_menu .heading-2 {
  color: #079ee6;
  font-weight: bold;
}

.water-package_menu .heading-2 strong {
  font-size: 200%;
  color: #079ee6;
}

.water-package_menu .txt-lg {
  display: inline-block;
  padding: 0 4px;
  transform: translateY(4px);
  font-size: 162%;
  line-height: 1;
}

.water-package_menu .point_list {
  display: inline-block;
  text-align: left;
  font-size: 163%;
}

.water-package_menu .point_list li {
  position: relative;
  padding-left: 36px;
  line-height: 2;
}

.water-package_menu .point_list li::before {
  content: "";
  position: absolute;
  top: calc(50% - 16px);
  left: 0;
  display: block;
  width: 14px;
  height: 24px;
  transform: rotate(-135deg);
  border-top: solid 3px #ee4242;
  border-left: solid 3px #ee4242;
}

.water-package_menu .toclas_txt {
  padding: 6px 24px;
  border-radius: 16px;
  font-size: 163%;
  background-color: #ffeda4;
  text-shadow: #fff 2px 0, #fff -2px 0, #fff 0 -2px, #fff 0 2px, #fff 2px 2px,
    #fff -2px 2px, #fff 2px -2px, #fff -2px -2px, #fff 1px 2px, #fff -1px 2px,
    #fff 1px -2px, #fff -1px -2px, #fff 2px 1px, #fff -2px 1px, #fff 2px -1px,
    #fff -2px -1px;
}

.water-package_menu .toclas_txt img {
  margin-right: 8px;
}

@media screen and (max-width: 767px) {
  .water-package_about p.txt-ctr {
    text-align: left;
  }

  .water-package_menu {
    width: 100%;
    padding: 24px 24px 24px;
    border: solid 3px #40b6ee;
    background-color: rgba(64, 182, 238, 0.03);
  }

  .water-package_menu .heading-2 strong {
    font-size: 140%;
  }

  .water-package_menu .point_list {
    font-size: 114%;
  }

  .water-package_menu .point_list li {
    padding-left: 24px;
    line-height: 1.4;
  }

  .water-package_menu .point_list li:not(:last-of-type) {
    margin-bottom: 12px;
  }

  .water-package_menu .point_list li::before {
    top: calc(50% - 10px);
    width: 8px;
    height: 18px;
  }

  .water-package_menu .toclas_txt {
    padding: 6px;
    border-radius: 8px;
    font-size: 114%;
  }

  .water-package_menu .toclas_txt img {
    width: 56px;
    margin-right: 6px;
    transform: translateY(-4px);
  }
}

@media screen and (max-width: 340px) {
  .water-package_menu .heading-2 strong {
    font-size: 120%;
  }
}

/* flow
**************************************** */

/* --- reform_flow --- */
.reform_flow {
  padding-top: 0;
}

.reform_flow .heading-2 {
  font-size: 200%;
}

.reform_flow .flow-list h3::before {
  top: -15px;
  left: -16px;
  font-size: 175%;
}

.reform_flow .flow-list li::before {
  top: 68px;
  height: calc(100% - 48px);
}

@media all and (-ms-high-contrast: none) {

  .reform_flow .flow-list h3::before,
  .shindan_flow .flow-list h3::before {
    top: -32px;
    left: -88px;
    font-size: 56px;
  }
}

@media screen and (max-width: 767px) {
  .reform_flow .heading-2 {
    font-size: 134%;
  }

  .reform_flow .heading-3 {
    font-size: 107%;
  }

  .reform_flow .flow-list h3::before {
    top: -10px;
    left: -4px;
  }

  .reform_flow .flow-list li::before {
    top: 48px;
    height: calc(100% - 24px);
  }
}

/* takumi
**************************************** */

/* --- takumi_work --- */
.takumi_work .inner,
.takumi_other .inner,
.sanpai_faq .inner {
  padding: 24px 0 12px;
}

.takumi_work .btn {
  background-color: #fff;
}

.takumi_work .btn p {
  margin-left: 16px;
}

/* --- takumi_muku --- */
.takumi_muku .list {
  margin-bottom: 1em;
}

.takumi_muku .list li {
  line-height: 1.8;
}

.takumi_muku .list li:not(:last-child) {
  margin-bottom: 12px;
}

@media screen and (max-width: 767px) {

  .takumi_work p.txt-ctr,
  .takumi_other p.txt-ctr,
  .takumi_other .heading-2 {
    text-align: left;
  }
}

/* company
**************************************** */

/* --- company_about --- */
.company_about th {
  width: 11em;
}

.company_about iframe {
  display: block;
  margin-top: 12px;
  max-width: 804px;
}

.company_about img {
  width: calc(25% - 8px);
  margin: 4px;
  border: solid 1px #ddd;
}

.company_about .refusal {
  font-size: 82%;
  color: #707070;
}

@media all and (-ms-high-contrast: none) {
  .company_about .table_default td {
    max-width: 804px;
  }
}

@media screen and (max-width: 767px) {
  .company_about th {
    width: auto;
  }

  .company_about iframe {
    height: 280px;
    margin-top: 14px;
    margin-bottom: 8px;
  }

  .company_about img {
    width: calc(33.333% - 6px);
    margin: 4px 3px 4px 0;
  }

  .company_about img:nth-of-type(3n) {
    margin-right: 0px;
  }
}

/* sanpai
**************************************** */

/* --- sanpai--flow --- */
.sanpai_flow--step_wrap::before,
.sanpai_flow--step_wrap::after {
  content: "";
  position: absolute;
  top: 0;
  z-index: -1;
  display: block;
  width: 0;
  height: calc(100% - 24px);
  border-left-style: solid;
  border-left-width: 4px;
}

.sanpai_flow--step_wrap::before {
  left: 24px;
  border-left-color: #85c64c;
}

.sanpai_flow--step_wrap::after {
  left: calc(51.5% + 24px);
  border-left-color: #f3df68;
}

.sanpai_flow--step {
  z-index: 1;
}

.sanpai_flow--step .name {
  padding: 16px;
}

.sanpai_flow--step .child {
  padding: 24px 24px 28px;
  margin-bottom: 24px;
  border: solid 1px #ddd;
}

.sanpai_flow--step .child:not(.bg-l_ylw):not(.bg-l_grn) {
  background-color: #fff;
}

.sanpai_flow--step .child:only-child {
  width: 100%;
}

.sanpai_flow--step .ttl {
  text-align: center;
}

.sanpai_flow--step .txt {
  padding-top: 4px;
  line-height: 2;
  text-align: center;
}

/* --- sanpai_detail --- */
.sanpai_detail li {
  padding-top: 24px;
  background-color: #f1f1f1;
}

/* --- sanpai_faq --- */
.sanpai_faq h3:not(:first-of-type) {
  padding-top: 40px;
}

.sanpai_faq dl {
  padding: 32px 40px 40px;
  margin-bottom: 16px;
  background-color: #fff;
}

/* --- sanpai_corp --- */
.sanpai_corp {
  padding-bottom: 0;
}

.sanpai_corp2 li {
  padding-top: 24px;
}

.sanpai_corp2 li:first-of-type {
  width: 100%;
}

.sanpai_corp2 .flex-col2>*:nth-child(odd) {
  margin-right: 0;
}

.sanpai_corp2 .flex-col2>*:nth-child(even) {
  margin-right: 3%;
}

@media all and (-ms-high-contrast: none) {
  .sanpai_flow--step .name {
    padding: 24px 16px 8px;
  }
}

@media screen and (max-width: 767px) {
  .sanpai_flow--step .child {
    padding: 16px 16px 18px;
    margin-bottom: 24px;
    border: solid 1px #ddd;
  }

  .sanpai_flow--step .heading-2 {
    text-align: left;
    font-size: 120%;
  }

  .sanpai_flow--step .txt {
    text-align: left;
  }

  .sanpai_detail li,
  .sanpai_faq dl {
    padding: 20px 20px 16px;
  }
}

/* sale
**************************************** */

/* --- sale_about --- */
.sale_about {
  padding-top: 0;
}

.sale_about .gap_bg {
  top: 560px;
}

.sale_about--lsit .heading-3 {
  line-height: 1.8;
  letter-spacing: 0.07em;
  font-weight: 500;
}

/* --- sale_example --- */
.sale_example {
  padding-bottom: 40px;
}

.item_list dl {
  padding: 24px 16px;
  border: solid 1px #ddd;
}

.item_list dl>* {
  margin-bottom: 0;
}

.item_list .imgarea {
  padding-right: 8px;
}

.item_list .name {
  min-height: 5.5em;
  margin-bottom: 4px;
  line-height: 1.8;
}

.item_list .price {
  line-height: 1.5;
  text-align: right;
}

.item_list .price i {
  font-style: normal;
  text-decoration: line-through;
}

.item_list .price span {
  font-size: 144%;
  font-weight: bold;
}

.item_list .off {
  position: absolute;
  top: -16px;
  left: -16px;
  width: 72px;
  height: 72px;
  border-radius: 36px;
  padding-top: 12px;
  padding-left: 2px;
  color: #fff;
  font-weight: bold;
  text-align: center;
  line-height: 1.1;
}

.item_list .off span {
  font-size: 160%;
}

/* --- sale_maker --- */
.sale_maker img {
  height: auto;
  margin: 4px;
  border: solid 1px #ddd;
}

@media screen and (max-width: 767px) {

  .sale_about p.txt-ctr,
  .sale_about .heading-3 {
    text-align: left;
  }

  .sale_maker .flex-j-ctr {
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }

  .item_list dl {
    padding: 16px 12px;
    font-size: 94%;
  }

  .item_list .imgarea {
    padding-right: 16px;
  }

  .item_list .name {
    min-height: 0;
  }

  .item_list .off {
    position: absolute;
    top: -4px;
    left: -8px;
    width: 64px;
    height: 64px;
    padding-top: 10px;
  }

  .sale_maker .flex {
    display: block;
    overflow: hidden;
  }

  .sale_maker img {
    float: left;
    width: calc(33.333% - 8px);
  }
}

/* menu
**************************************** */

.page-menu .flex-main3 .gap_bg {
  bottom: 0;
}

/* --- menu_btn --- */
.menu_btn .section_txt {
  font-size: 108%;
}

.menu_btn li {
  padding-top: 24px;
  margin-bottom: 4%;
}

.menu_btn li .num {
  top: calc(32px - 1.15em);
}

/* --- img-list --- */
.page-menu .img-list .imgarea {
  border-radius: 0;
}

/* --- menu_works --- */
.menu_works--list li {
  padding: 28px 24px;
  background-color: #fff;
}

.menu_works--list .imgarea {
  position: relative;
  background-size: cover;
  background-position: center;
  transition: all 0.4s ease-out;
}

.menu_works--list .imgarea::before {
  content: "";
  display: block;
  padding-top: 64%;
}

.menu_works--list .heading-3 {
  padding: 4px 0;
  line-height: 1.9;
  font-weight: 500;
}

.menu_works--list p {
  line-height: 2.1;
}

.menu_works--list li a:hover .imgarea {
  opacity: 0.7;
}

/* --- menu_txt --- */
.menu_txt .txtarea {
  width: calc(100% - 318px);
  margin-left: 56px;
}

@media screen and (max-width: 767px) {

  .menu_btn .section_txt,
  .menu_about p.txt-ctr {
    text-align: left;
  }

  .menu_btn li .num {
    top: -0.5em;
  }

  .menu_txt .example-list img {
    width: 200px;
  }

  .page-menu .img-list .imgarea {
    margin-top: 6px;
  }

  .menu_works .gap_bg {
    top: 200px;
  }

  .menu_works--list li {
    padding: 0;
  }

  .menu_works--list .heading-3 {
    margin-bottom: 0;
    padding: 6px 16px 12px;
    line-height: 1.7;
    font-size: 94%;
    font-family: "YuGothic", "游ゴシック", "ヒラギノ角ゴ Pro W3",
      "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック",
      sans-serif;
    font-weight: 500 !important;
  }

  .menu_works--list p {
    display: none;
  }

  .menu_txt .txtarea {
    width: 100%;
    margin-top: 24px;
    margin-left: 0;
  }

  .menu_list th:nth-of-type(2) {
    width: 6.5em;
  }
}

/* mohayashinchiku
**************************************** */

.page-mohayashinchiku .page_ttl,
#mohayaReason #wrap {
  display: none;
}

/* --- mohayaHead --- */
.mohayaHead,
.mohayaHero {
  position: relative;
  overflow: hidden;
}

.mohayaHead {
  padding: 20px 0;
  z-index: 1;
}

.mohayaHead::before,
.mohayaHero::before {
  content: "";
  position: absolute;
  width: 1600px;
  height: 100%;
  top: 0;
  left: 50%;
  margin-left: -800px;
}

.mohayaHead::before {
  background: linear-gradient(to right,
      transparent,
      #fff 20%,
      #fff 80%,
      transparent);
  background: -webkit-linear-gradient(left,
      rgba(255, 255, 255, 0),
      #fff 20%,
      #fff 80%,
      rgba(255, 255, 255, 0));
  background: -moz-linear-gradient(left,
      rgba(255, 255, 255, 0),
      #fff 20%,
      #fff 80%,
      rgba(255, 255, 255, 0));
  z-index: -1;
}

/* --- mohayaHero --- */
.mohayaHero {
  padding-top: 24px;
  box-sizing: border-box;
  background: url(../images/mohayashinchiku/bg_hero.jpg) no-repeat center;
}

.mohayaHero::before {
  background: linear-gradient(to right,
      #fff,
      transparent 15%,
      transparent 85%,
      #fff);
  background: -webkit-linear-gradient(left,
      #fff,
      rgba(255, 255, 255, 0) 15%,
      rgba(255, 255, 255, 0) 85%,
      #fff);
  background: -moz-linear-gradient(left,
      #fff,
      rgba(255, 255, 255, 0) 15%,
      rgba(255, 255, 255, 0) 85%,
      #fff);
}

.mohayaTtl {
  margin-top: 10px;
  margin-left: -90px;
  padding-bottom: 20px;
  background: url(../images/mohayashinchiku/deco_line.png) no-repeat right 174px bottom;
}

.mohayaHero p {
  margin-left: -90px;
}

.mohayaHero h2 {
  margin-top: -150px;
  padding-bottom: 30px;
}

/* --- mohayaNav --- */
.mohayaNav {
  background: #efead4;
}

.mohayaNav ul {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: center;
  justify-content: center;
}

.mohayaNav a {
  position: relative;
  display: block;
  padding: 12px 28px 12px 12px;
  font-size: 105%;
}

.mohayaNav a::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 2px;
  right: 10px;
  margin: auto;
  width: 6px;
  height: 6px;
  border-top: 2px solid #f05857;
  border-right: 2px solid #f05857;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}

.mohayaNav a:hover {
  color: inherit;
  background: #bfbb98;
}

/* --- mohayaReason --- */
#mohayaReason h2 {
  margin-left: 40px;
}

#mohayaReason li,
#mohayaFaq li {
  position: relative;
  padding: 40px 64px 72px;
}

#mohayaReason li::before,
#mohayaReason li::after,
#mohayaFaq li::before,
#mohayaFaq li::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

#mohayaReason li::before,
#mohayaFaq li::before {
  width: calc(100% - 32px);
  height: calc(100% - 32px);
  background: #fff;
  z-index: -1;
  transform: skew(-0.5deg, 0.5deg);
}

#mohayaReason li::after,
#mohayaFaq li::after {
  width: 100%;
  height: 100%;
  background: #dff092;
  z-index: -2;
  transform: skew(-0.5deg);
}

#mohayaFaq li:nth-child(even)::after,
#mohayaReason li:nth-child(even)::after {
  background: #e2c2b5;
}

.img-reason01 {
  position: absolute;
  top: 56px;
  bottom: 0;
  right: 16px;
  margin: auto;
  z-index: -1;
}

/* --- mohayaContact --- */
#mohayaContact {
  background: url(../images/mohayashinchiku/bg_contact.jpg) no-repeat center/cover;
}

#mohayaContact .inner {
  max-width: 1080px;
  padding-top: 24px;
  padding-bottom: 24px;
}

#mohayaContact ul {
  display: -webkit-flex;
  display: flex;
  justify-content: -webkit-space-between;
  justify-content: space-between;
}

#mohayaContact a {
  position: relative;
  display: block;
}

#mohayaContact a:hover img {
  opacity: 1 !important;
}

#mohayaContact a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0);
  border-radius: 10px;
}

#mohayaContact a:hover::before {
  background: rgba(255, 255, 255, 0.3);
}

/* --- mohayaCase --- */
#mohayaCase h2 {
  margin-left: 24px;
  margin-bottom: 120px;
}

.mohayaCase,
.mohayaFlow,
.mohayaMaker {
  position: relative;
  background: url(../images/mohayashinchiku/bg_wood.jpg);
  padding: 24px 18px;
  border-radius: 8px;
  z-index: -1;
}

.mohayaCase::before {
  position: absolute;
  top: -85px;
  left: 0;
  right: 0;
  margin: auto;
  text-align: center;
  z-index: 2;
}

.mohayaCase:nth-of-type(1)::before {
  content: url(../images/mohayashinchiku/num_case01.png);
}

.mohayaCase:nth-of-type(2)::before {
  content: url(../images/mohayashinchiku/num_case02.png);
}

.mohayaCase:nth-of-type(3)::before {
  content: url(../images/mohayashinchiku/num_case03.png);
}

.box-mohayaCase,
.box-mohayaFlow,
.box-mohayaMaker {
  position: relative;
  background: #fbfbf9;
  padding: 80px 24px 40px;
  z-index: 1;
}

.mohayaCase:first-of-type .box-mohayaCase {
  padding: 80px 48px 40px;
}

.box-mohayaCase::before,
.box-mohayaFlow::before,
.box-mohayaMaker::before {
  content: url(../images/mohayashinchiku/deco_paper.png);
  position: absolute;
  top: 0;
  right: 0;
  padding-right: 8px;
  background: linear-gradient(to bottom, #fbfbf9, #fbfbf9 80%, transparent 95%);
  background: -webkit-linear-gradient(top,
      #fbfbf9,
      #fbfbf9 80%,
      rgba(255, 255, 255, 0) 95%);
  background: -moz-linear-gradient(top,
      #fbfbf9,
      #fbfbf9 80%,
      rgba(255, 255, 255, 0) 95%);
}

.box-mohayaCase::after,
.box-mohayaFlow::after,
.box-mohayaMaker::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  background: #fff;
  box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);
  z-index: -1;
}

.mohayaCase h3 {
  padding-bottom: 56px;
  background: url(../images/mohayashinchiku/deco_line.png) no-repeat center bottom;
}

.mohayaCase ul,
.mohayaKominka ul {
  display: -webkit-flex;
  display: flex;
  flex-wrap: -webkit-wrap;
  flex-wrap: wrap;
}

.mohayaCase li,
.mohayaKominka li {
  width: calc(50% - 40px);
  margin: 0 72px 72px 0;
}

.mohayaCase li:nth-last-child(-n + 2),
.mohayaKominka li:nth-last-child(-n + 2) {
  margin: 0 72px 0 0;
}

.mohayaCase li:nth-child(2n),
.mohayaKominka li:nth-child(2n) {
  margin: 0 0 72px;
}

.mohayaCase li:last-child,
.mohayaKominka li:last-child {
  margin: 0;
}

.mohayaCase .list-mohayaCase {
  width: calc(50% - 26px);
  margin: 0 10px 10px 0;
}

.mohayaCase:last-of-type .list-mohayaCase {
  width: calc(50% - 20px);
}

.mohayaCase .list-mohayaCase:nth-last-child(-n + 2) {
  margin: 0 10px 0 0;
}

.mohayaCase .list-mohayaCase:nth-child(2n) {
  margin: -6px 0 10px;
  width: 50%;
}

.mohayaCase .list-mohayaCase:last-child {
  margin: -6px 0 0;
}

.mohayaCase:last-of-type .list-mohayaCase:nth-child(2) {
  margin: 0 0 10px;
}

/* --- mohayaKominka --- */
.mohayaKominka {
  background: url(../images/mohayashinchiku/bg_kominka.jpg);
  border-radius: 8px;
  padding: 24px 12px;
}

.box-mohayaKominka {
  position: relative;
  background: url(../images/mohayashinchiku/bg_square.jpg);
  border-radius: 8px;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
  padding: 80px 0;
}

.box-mohayaKominka:first-of-type {
  padding: 40px 48px 80px;
}

.box-mohayaKominka:last-of-type {
  padding: 80px 0 56px;
}

.box-mohayaKominka::before,
.box-mohayaKominka::after {
  content: url(../images/mohayashinchiku/deco_ring.png);
  position: absolute;
  bottom: -53px;
  z-index: 1;
}

.box-mohayaKominka::before {
  left: 240px;
}

.box-mohayaKominka::after {
  right: 240px;
}

.box-mohayaKominka:last-of-type::before,
.box-mohayaKominka:last-of-type::after {
  display: none;
}

.box-mohayaKominka:first-of-type h3 {
  padding-bottom: 30px;
  background: url(../images/mohayashinchiku/deco_line.png) no-repeat center bottom;
}

.img-mohayaKominka {
  position: relative;
}

.img-mohayaKominka::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 36px 30px 0 30px;
  border-color: #fff transparent transparent transparent;
}

/* --- mohayaFlow --- */
#mohayaFlow h2 {
  margin-left: 100px;
}

.box-mohayaFlow {
  padding: 80px 56px;
}

#mohayaFlow li {
  position: relative;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
}

#mohayaFlow li::before {
  content: url(../images/mohayashinchiku/deco_arrow.png);
  position: absolute;
  bottom: -80px;
  left: 0;
  right: 0;
  margin: auto;
  text-align: center;
}

#mohayaFlow li:last-child::before {
  display: none;
}

#mohayaFlow .lft {
  margin-right: 56px;
}

/* --- mohayaFaq --- */
#mohayaFaq .inner {
  max-width: 1080px;
}

#mohayaFaq h2 {
  margin-left: 64px;
}

#mohayaFaq li {
  padding: 72px 64px;
}

.box-mohayaFaq {
  display: -webkit-flex;
  display: flex;
}

.box-mohayaFaq:first-of-type {
  -webkit-align-items: center;
  align-items: center;
  padding-bottom: 48px;
  background: url(../images/mohayashinchiku/deco_line.png) no-repeat center bottom;
}

#mohayaFaq .lft {
  margin-right: 48px;
}

/* --- mohayaList --- */
#mohayaList .inner {
  max-width: 1080px;
}

#mohayaList ul {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}

#mohayaList li {
  position: relative;
  width: calc(100% / 4 - 8px);
  height: 180px;
  margin: 0 10px 10px 0;
  overflow: hidden;
}

#mohayaList li:nth-last-child(-n + 4) {
  margin: 0 10px 0 0;
}

#mohayaList li:nth-child(4n) {
  margin: 0 0 10px;
}

#mohayaList li:last-child {
  margin: 0;
}

#mohayaList li::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0);
  -webkit-transition: all 0.4s ease-out;
  -moz-transition: all 0.4s ease-out;
  -o-transition: all 0.4s ease-out;
  transition: all 0.4s ease-out;
}

#mohayaList li:hover::before {
  background: rgba(0, 0, 0, 0.6);
}

#mohayaList li a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

#mohayaList .eyecatch {
  width: 100%;
  height: 100%;
  -webkit-transition: all 0.4s ease-out;
  -moz-transition: all 0.4s ease-out;
  -o-transition: all 0.4s ease-out;
  transition: all 0.4s ease-out;
}

#mohayaList li:hover .eyecatch {
  width: 110%;
  height: 110%;
}

#mohayaList h3 {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #fff;
  padding: 10px;
  transform: translate(-100%, 0);
  -webkit-transition: all 0.4s 0.2s ease-out;
  -moz-transition: all 0.4s 0.2s ease-out;
  -o-transition: all 0.4s 0.2s ease-out;
  transition: all 0.4s 0.2s ease-out;
}

#mohayaList li:hover h3 {
  transform: translate(0, 0);
}

.btn-mohayaList {
  position: relative;
  display: table;
  margin: 0 auto;
  font-size: 160%;
  font-weight: bold;
  text-align: center;
  padding: 12px 80px;
  color: #6f3f1b;
  border: 4px solid #6f3f1b;
}

.btn-mohayaList::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 32px;
  margin: auto;
  width: 8px;
  height: 8px;
  border-top: 4px solid #6f3f1b;
  border-right: 4px solid #6f3f1b;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.btn-mohayaList:hover {
  background: #6f3f1b;
  color: #fff;
}

.btn-mohayaList:hover::before {
  border-top: 4px solid #fff;
  border-right: 4px solid #fff;
}

/* --- mohayaMaker --- */
#mohayaMaker h2 {
  margin-left: 80px;
}

.box-mohayaMaker {
  padding: 100px;
}

#mohayaMaker ul {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}

#mohayaMaker li {
  width: calc(100% / 4 - 8px);
  margin: 0 10px 10px 0;
}

#mohayaMaker li:nth-last-child(-n + 4) {
  margin: 0 10px 0 0;
}

#mohayaMaker li:nth-child(4n) {
  margin: 0 0 10px;
}

#mohayaMaker li:last-child {
  margin: 0;
}

@media screen and (max-width: 767px) {
  .page-mohayashinchiku .mgnBtm10 {
    margin-bottom: 5px;
  }

  .page-mohayashinchiku .mgnBtm15 {
    margin-bottom: 7.5px;
  }

  .page-mohayashinchiku .mgnBtm20 {
    margin-bottom: 10px;
  }

  .page-mohayashinchiku .mgnBtm30 {
    margin-bottom: 15px;
  }

  .page-mohayashinchiku .mgnBtm40 {
    margin-bottom: 20px;
  }

  .page-mohayashinchiku .mgnBtm50 {
    margin-bottom: 25px;
  }

  .page-mohayashinchiku .mgnBtm60 {
    margin-bottom: 30px;
  }

  .page-mohayashinchiku .mgnBtm70 {
    margin-bottom: 35px;
  }

  .page-mohayashinchiku .mgnBtm80 {
    margin-bottom: 40px;
  }

  .page-mohayashinchiku .mgnBtm90 {
    margin-bottom: 45px;
  }

  .page-mohayashinchiku .mgnBtm100 {
    margin-bottom: 50px;
  }

  .page-mohayashinchiku * {
    font-weight: bold;
  }

  .page-mohayashinchiku article {
    font-size: 13px;
  }

  .page-mohayashinchiku article .inner {
    width: 100%;
    padding: 10px;
  }

  .page-mohayashinchiku article h2 {
    margin-left: 0 !important;
  }

  .page-mohayashinchiku article h3,
  .page-mohayashinchiku article p {
    line-height: 1.5;
  }

  .page-mohayashinchiku article h3 {
    color: #72c135;
    font-size: 180%;
  }

  .page-mohayashinchiku article p {
    font-size: 110%;
  }

  /*mohayaHead*/
  .mohayaHead {
    padding: 20px 10px;
    transform: translateY(72px);
  }

  .mohayaHead::before {
    width: 100%;
    left: 0;
    margin-left: 0;
  }

  .mohayaHead img {
    width: 300px;
    height: 34.78px;
  }

  /*mohayaHero*/
  .mohayaHero {
    padding-top: 75px;
    background: url(../images/mohayashinchiku/bg_hero_sp.jpg) no-repeat center/cover;
  }

  .mohayaHero::before {
    display: none;
  }

  .mohayaTtl {
    position: relative;
    margin-top: -8px;
    margin-left: 0;
    background: url(../images/mohayashinchiku/deco_line.png) no-repeat center bottom/200%;
    z-index: 1;
  }

  .mohayaHero p {
    margin-left: 0;
  }

  .mohayaHero p img {
    max-width: 125%;
    margin-left: -15%;
  }

  .mohayaHero h2 {
    margin-top: -125px;
    padding-bottom: 20px;
  }

  .mohayaHero h2 img {
    width: 75%;
  }

  /*mohayaNav*/
  .mohayaNav ul {
    padding: 0 10px;
  }

  .mohayaNav li {
    width: 100%;
  }

  .mohayaNav a {
    text-align: center;
    padding: 10px 16px 10px 10px;
  }

  .mohayaNav a::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    background-image: -moz-linear-gradient(left,
        #fff,
        #fff 40%,
        rgba(0, 0, 0, 0) 40%,
        rgba(0, 0, 0, 0) 100%);
    background-image: -o-linear-gradient(left,
        #fff,
        #fff 40%,
        rgba(0, 0, 0, 0) 40%,
        rgba(0, 0, 0, 0) 100%);
    background-image: -webkit-linear-gradient(left,
        #fff,
        #fff 40%,
        rgba(0, 0, 0, 0) 40%,
        rgba(0, 0, 0, 0) 100%);
    background-image: linear-gradient(to right,
        #fff,
        #fff 40%,
        rgba(0, 0, 0, 0) 40%,
        rgba(0, 0, 0, 0) 100%);
    background-size: 4px 4px;
    width: 100%;
    height: 2px;
  }

  .mohayaNav li:last-child a::after {
    display: none;
  }

  /*mohayaReason*/
  #mohayaReason ul,
  #mohayaFlow ol {
    counter-reset: num;
  }

  #mohayaReason li::before,
  #mohayaFaq li::before {
    width: calc(100% - 16px);
    height: calc(100% - 16px);
  }

  #mohayaReason li,
  #mohayaFaq li {
    padding: 32px;
  }

  #mohayaReason li:first-child {
    padding: 32px 32px 120px;
  }

  #mohayaReason li h3 {
    position: relative;
  }

  #mohayaReason li h3::before,
  #mohayaFlow li h3::before {
    counter-increment: num;
    content: counter(num, decimal-leading-zero);
  }

  #mohayaReason li h3::before {
    position: absolute;
    top: -64px;
    left: -12px;
    margin-right: 8px;
    color: #5a3d24;
    font-size: 200%;
    text-shadow: 2px 2px 0 #fff, -2px 2px 0 #fff, 2px -2px 0 #fff,
      -2px -2px 0 #fff;
  }

  #mohayaReason p {
    color: #5a3d24;
  }

  .img-reason01 {
    top: inherit;
    bottom: -12px;
    width: auto;
    height: 170px;
  }

  /*mohayaContact*/
  #mohayaContact ul {
    display: block;
  }

  #mohayaContact li {
    margin-bottom: 10px;
  }

  #mohayaContact li:last-child {
    margin-bottom: 0;
  }

  /*mohayaCase*/
  #mohayaCase h2 {
    margin-bottom: 64px;
  }

  .mohayaCase::before {
    transform: scale(0.5);
    top: -72px;
  }

  .mohayaCase:first-of-type::before {
    top: -80px;
  }

  .mohayaCase,
  .mohayaFlow,
  .mohayaMaker {
    padding: 12px 10px;
  }

  .box-mohayaCase,
  .box-mohayaFlow,
  .box-mohayaMaker {
    padding: 56px 16px 20px 8px;
  }

  .mohayaCase:first-of-type .box-mohayaCase {
    padding: 56px 20px 20px 12px;
  }

  .box-mohayaCase::before,
  .box-mohayaFlow::before,
  .box-mohayaMaker::before {
    transform: scale(0.5) translate(48px, -42px);
    padding-right: 16px;
  }

  .mohayaCase h3 {
    padding-bottom: 25px;
    background: url(../images/mohayashinchiku/deco_line.png) no-repeat center bottom/210%;
  }

  .mohayaCase ul,
  .mohayaKominka ul {
    display: block;
  }

  .mohayaCase li,
  .mohayaCase li:nth-last-child(-n + 2),
  .mohayaCase li:nth-child(2n),
  .mohayaCase .list-mohayaCase,
  .mohayaCase .list-mohayaCase:nth-last-child(-n + 2),
  .mohayaCase .list-mohayaCase:nth-child(2n),
  .mohayaCase:last-of-type .list-mohayaCase,
  .mohayaKominka li,
  .mohayaKominka li:nth-last-child(-n + 2),
  .mohayaKominka li:nth-child(2n) {
    width: 100%;
    margin: 0 0 16px;
  }

  .mohayaCase li:last-child,
  .mohayaKominka li:last-child .mohayaCase .list-mohayaCase:last-child {
    margin: 0;
  }

  .mohayaCase li p:last-child {
    text-align: left;
  }

  .mohayaCase .list-mohayaCase {
    padding: 16px;
    background: #fffdec;
    box-sizing: border-box;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
  }

  .mohayaCase .list-mohayaCase::before {
    content: "";
    display: block;
    margin: 0 auto 7.5px;
    width: 160px;
    height: 120px;
  }

  .mohayaCase .list-mohayaCase:nth-child(1)::before {
    background: url(../images/mohayashinchiku/img_case02-1_sp.jpg) no-repeat left/cover;
  }

  .mohayaCase .list-mohayaCase:nth-child(2)::before {
    background: url(../images/mohayashinchiku/img_case02-2_sp.jpg) no-repeat left/cover;
  }

  .mohayaCase .list-mohayaCase:nth-child(3)::before {
    background: url(../images/mohayashinchiku/img_case02-3_sp.jpg) no-repeat left/cover;
  }

  .mohayaCase .list-mohayaCase:nth-child(4)::before {
    background: url(../images/mohayashinchiku/img_case02-4_sp.jpg) no-repeat left/cover;
  }

  .mohayaCase:last-of-type .list-mohayaCase:nth-child(1)::before {
    background: url(../images/mohayashinchiku/img_case03-1_sp.jpg) no-repeat left/cover;
  }

  .mohayaCase:last-of-type .list-mohayaCase:nth-child(2)::before {
    background: url(../images/mohayashinchiku/img_case03-2_sp.jpg) no-repeat left/cover;
  }

  .mohayaCase:last-of-type .list-mohayaCase:nth-child(3)::before {
    background: url(../images/mohayashinchiku/img_case03-3_sp.jpg) no-repeat left/cover;
  }

  .mohayaCase:last-of-type .list-mohayaCase:nth-child(4)::before {
    background: url(../images/mohayashinchiku/img_case03-4_sp.jpg) no-repeat left/cover;
  }

  /*mohayaKominka*/
  .mohayaKominka {
    padding: 12px 10px;
  }

  .box-mohayaKominka {
    position: relative;
    padding: 24px 0;
  }

  .box-mohayaKominka:first-of-type {
    padding: 12px 16px 24px;
  }

  .box-mohayaKominka:last-of-type {
    padding: 24px 0 32px;
  }

  .box-mohayaKominka::before,
  .box-mohayaKominka::after {
    transform: scale(0.5);
    bottom: -46px;
  }

  .box-mohayaKominka:first-of-type h3 {
    padding-bottom: 15px;
  }

  .img-mohayaKominka::before {
    top: -1px;
    border-width: 18px 15px 0 15px;
  }

  #mohayaKominka p {
    text-align: left;
  }

  .box-mohayaKominka:nth-of-type(2) p:last-child,
  .box-mohayaKominka:nth-of-type(3) p:last-child {
    padding: 0 16px;
  }

  /*mohayaFlow*/
  #mohayaFlow .lft {
    display: none;
  }

  #mohayaFlow h3 {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    font-size: 160%;
  }

  #mohayaFlow h3::before {
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    margin-right: 12px;
    font-size: 120%;
    width: 1.5em;
    height: 1.5em;
    color: #fff;
    background: #f05553;
  }

  #mohayaFlow li::before {
    transform: scale(0.5);
    bottom: -56px;
  }

  /*mohayaFaq*/
  #mohayaFaq .lft {
    margin-right: 16px;
    width: 32px;
  }

  #mohayaFaq .rgt {
    width: calc(100% - 32px);
  }

  .box-mohayaFaq:first-of-type {
    padding-bottom: 25px;
  }

  #mohayaFaq li {
    padding: 24px;
  }

  #mohayaFaq h3 {
    font-size: 160%;
  }

  /*mohayaList*/
  #mohayaList li,
  #mohayaList li:nth-last-child(-n + 4),
  #mohayaList li:nth-child(4n) {
    width: calc(50% - 4px);
    height: 35vw;
    margin: 0 8px 8px 0;
  }

  #mohayaList li:nth-last-child(-n + 2) {
    margin: 0 8px 0 0;
  }

  #mohayaList li:nth-child(2n) {
    margin: 0 0 8px;
  }

  #mohayaList li:last-child {
    margin: 0;
  }

  #mohayaList h3 {
    font-size: 100%;
  }

  .btn-mohayaList {
    display: block;
    border: 2px solid #6f3f1b;
    font-size: 140%;
  }

  .btn-mohayaList::before {
    width: 6px;
    height: 6px;
    border-top: 2px solid #6f3f1b;
    border-right: 2px solid #6f3f1b;
  }

  .btn-mohayaList:hover::before {
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
  }

  /*mohayaMaker*/
  #mohayaMaker li,
  #mohayaMaker li:nth-last-child(-n + 4),
  #mohayaMaker li:nth-child(4n) {
    width: calc(50% - 4px);
    margin: 0 8px 8px 0;
  }

  #mohayaMaker li:nth-last-child(-n + 2) {
    margin: 0 8px 0 0;
  }

  #mohayaMaker li:nth-child(2n) {
    margin: 0 0 8px;
  }

  #mohayaMaker li:last-child {
    margin: 0;
  }
}

/* gaihekitosou
**************************************** */

/* --- simulation-item --- */
.page-gaihekitosou input:not(.btn) {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.page-gaihekitosou .btn {
  cursor: pointer;
  text-decoration: none;
  transition: all 0.4s ease-out;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: 0;
  outline: none;
}

.page-gaihekitosou input[type="radio"] {
  display: inline-block;
  margin-right: 6px;
}

.page-gaihekitosou input[type="radio"]+label {
  position: relative;
  display: inline-block;
  margin-right: 12px;
  font-size: 14px;
  line-height: 1.3em;
  text-indent: 0.5em;
  cursor: pointer;
}

.page-gaihekitosou input[type="radio"] {
  display: none;
  margin: 0;
}

.page-gaihekitosou input[type="radio"]+label {
  padding: 0 0 0 20px;
}

.page-gaihekitosou input[type="radio"]+label::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 18px;
  height: 18px;
  margin-top: -9px;
  background: #fff;
}

.page-gaihekitosou input[type="radio"]+label::before {
  border: 2px solid #ccc;
  border-radius: 30px;
}

.page-gaihekitosou input[type="radio"]:checked+label::after {
  content: "";
  position: absolute;
  top: 50%;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
}

.page-gaihekitosou input[type="radio"]:checked+label::after {
  left: 5px;
  width: 8px;
  height: 8px;
  margin-top: -4px;
  background: #85c64c;
  border-radius: 8px;
}

.page-gaihekitosou input.e1_space {
  width: 120px;
  padding: 0 10px;
  height: 30px;
  border: 1px solid #dfdfdf;
  background-color: #fff;
  margin: -3px 5px 0 0;
  text-indent: 0.5em;
  font-size: 116%;
  text-align: right;
}

.simulation-item {
  width: 25%;
  float: left;
  margin: 0 0 10px;
}

.little {
  font-size: 85%;
  color: #888;
  white-space: nowrap;
}

.simulation-ttl .little {
  font-size: 70%;
  color: #666;
  margin: 0 0 0 10px;
}

.page-gaihekitosou .bg-gry {
  padding: 24px 40px 12px;
}

/* --- simulation-result -- */
.simulation-result-wrap {
  position: relative;
  padding: 64px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: #fbfaf8;
  box-shadow: 5px 5px 15px -5px rgba(0, 0, 0, 0.1);
}

.simulation-result-wrap {
  display: none;
}

.result-area-list:nth-of-type(1) {
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid #e2e1c4;
}

.result-area-list:nth-of-type(2) {
  margin-bottom: 56px;
}

.result-area-list.list li:not(:last-child) {
  margin-bottom: 4px;
}

.result-total {
  position: absolute;
  bottom: 0;
  right: 20px;
  background: #fff;
  padding: 10px 20px;
  border-radius: 5px;
  font-weight: bold;
  font-size: 125%;
  color: #ee4242;
}

.simulation-result-table {
  width: 100%;
  border-radius: 5px;
  overflow: hidden;
  box-shadow: 0 0 0 1px #e8e8e8;
  background: #fff;
}

.simulation-result-table thead {
  background: #e2dbce;
  font-size: 115%;
}

.simulation-result-table-line {
  height: 40px;
}

.simulation-result-table-line:nth-of-type(even) {
  background: #f5f3f1;
}

.simulation-result-table-cell {
  vertical-align: middle;
  padding: 0 10px;
  border-right: 1px solid #e8e8e8;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

td.simulation-result-table-cell {
  font-size: 91%;
}

td.simulation-result-table-cell:first-child {
  padding: 0 10px 0 20px;
  width: 200px;
}

td.simulation-result-table-cell:first-child.t-bold {
  padding: 0 10px;
}

td.simulation-result-table-cell:last-child {
  border: none;
  text-align: right;
}

td.simulation-result-table-cell:nth-child(2),
.simulation-result-table-cell:nth-child(3).ta-right {
  text-align: right;
}

.simulation-result-table-cell:nth-child(3) {
  text-align: center;
}

.simulation-result-table .ti-1 {
  margin: 0 0 0 5px;
  font-size: 83%;
  color: #999;
}

.t-bold {
  font-weight: bold;
  color: #ee4242;
  font-size: 109% !important;
}

td.simulation-result-table-cell.t-bold-black {
  padding: 0 10px;
  font-size: 109%;
  font-weight: bold;
}

.border-btm-light {
  border-bottom: 2px solid #ccc;
}

.border-btm-bold {
  border-bottom: 4px solid #ccc;
}

.result42 {
  margin: 0 0 0 10px;
  float: right;
}

@media screen and (max-width: 767px) {
  .page-gaihekitosou .bg-gry {
    padding: 20px 20px 12px;
  }

  .simulation-item {
    width: 100%;
  }

  .simulation-item br {
    display: none;
  }

  .simulation-item .little {
    padding-left: 2px;
  }

  .simulation-result-wrap {
    padding: 32px 24px;
  }

  .simulation-result-wrap .section_ttl {
    font-size: 134%;
  }

  .result-total {
    position: static;
    font-size: 114%;
    transform: translateY(-40px);
  }

  .simulation-result-table {
    width: 110% !important;
    margin-left: -5%;
    font-size: 80%;
  }

  .simulation-result-table-cell,
  td.simulation-result-table-cell.t-bold-black {
    padding: 0 2px;
  }

  .simulation-result-table thead,
  td.simulation-result-table-cell.t-bold-black {
    font-size: 100%;
  }

  td.simulation-result-table-cell:first-child {
    width: 7em;
    padding: 0 2px;
  }

  .t-bold {
    font-size: 100% !important;
  }
}

/* sense club
**************************************** */
.pointArea {
  background: url(../images/senseclub/point_bg.png);
  padding: 50px 50px 80px;
  height: 580px;
  box-sizing: border-box;
  background-repeat: no-repeat;
}

.senseContents {
  overflow: hidden;
}

.senseContents img.fltRgt {
  margin: 0 20px 10px;
  box-sizing: border-box;
  border: 3px solid #fff;
  box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, 0.1);
  width: 180px;
}

.senseContents p {
  padding-left: 20px;
}

.senseContents h4 {
  font-size: 190%;
  line-height: 1.3;
  margin-bottom: 10px;
  color: #fff;
  text-shadow: 1px 1px 1px #af2933;
  min-height: 130px;
  box-sizing: border-box;
  padding: 30px 20px 20px 130px;
}

.senseContents h4.sense01 {
  background: url(../images/senseclub/sense_01_big.png) top left no-repeat;
}

.senseContents h4.sense02 {
  background: url(../images/senseclub/sense_02_big.png) top left no-repeat;
}

.senseContents h4.sense03 {
  background: url(../images/senseclub/sense_03_big.png) top left no-repeat;
}

.senseContents h4.sense04 {
  background: url(../images/senseclub/sense_04_big.png) top left no-repeat;
}

.senseContents h4.sense05 {
  background: url(../images/senseclub/sense_05_big.png) top left no-repeat;
}

.senseContents h5 {
  padding-left: 20px;
  margin-bottom: 10px;
}

#mainColumn .senseContents p.grayBox {
  margin: 0 0 10px 20px;
  width: 470px;
  font-size: 94%;
  line-height: 1.4;
  padding: 15px 20px;
  background: #f6f6f6;
}

/* dr.reform
**************************************** */
.drContents img.fltRgt {
  margin: 0 0 10px 10px;
  border: 3px solid #fff;
  box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, 0.1);
}

.drVoice img {
  margin: 0 20px 0 0;
  border: 5px solid #fff;
}

#mainColumn .drContents .fRed,
#mainColumn .drContents strong {
  font-weight: normal;
  color: #000;
}

#mainColumn .drContents .reasonContents .fRed,
#mainColumn.drContents .reasonContents strong {
  font-weight: bold;
  color: #5f634c;
}

#mainColumn .drContents .reasonOthers .whiteBox p .fRed,
#mainColumn .drContents .reasonOthers .whiteBox p strong {
  font-weight: bold;
}

/* thanks
**************************************** */
@media only screen and (max-width: 767px) {
  #thanks .txt-ctr {
    text-align: left;
  }

  #thanks br {
    display: none;
  }
}

/* ##############################################################################

    ARCHIVE

############################################################################## */

/* main_column
**************************************** */
.main_column {
  flex: 1;
  width: calc(100% - 334px);
  margin-right: 80px;
}

/* --- post --- */
.post {
  position: relative;
}

.posts-blog .post {
  transition: all 0.4s ease-out;
}

.posts-blog .post:hover {
  opacity: 0.7;
}

.post--link::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.post--date {
  font-weight: bold;
  font-size: 85%;
}

.cat_list {
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.post .post--img img {
  overflow: hidden;
  border-radius: 3px;
}

.cat_list a {
  display: inline-block;
  vertical-align: middle;
  border: solid 1px #f3df68;
  background: #fefcf0;
  line-height: 1;
  padding: 8px 12px;
  font-size: 85%;
  border-radius: 2px;
  float: left;
  margin-right: 8px;
  margin-bottom: 8px;
  white-space: nowrap;
}

.cat_list a:hover {
  background: #f3df68;
}

.archive-works .post--txt p {
  display: inline;
  margin-bottom: 0;
}

.archive-works .post--txt strong {
  color: #000 !important;
}

@media screen and (max-width: 1170px) {
  .post--info.flex {
    display: block;
  }
}

@media screen and (max-width: 767px) {
  .main_column {
    width: 100%;
    margin-right: 0;
  }

  .post--info {
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
  }
}

/* table_of_contents
**************************************** */
#toc_container {
  position: relative;
  border: 1px solid #f3df68;
  padding-top: 16px;
  padding-bottom: 16px;
  padding-left: 24px;
  padding-right: 24px;
  margin-top: 56px;
  margin-bottom: 80px;
  font-size: 95%;
  background-color: #fefcf0;
}

#toc_container .toc_title {
  padding-bottom: 6px;
  border-bottom: 1px solid #f3df68;
  font-family: ryo-display-plusn, serif;
  font-style: normal;
  font-weight: bold;
  font-size: 129%;
}

#toc_container .toc_list li {
  list-style-type: none;
}

#toc_container .toc_list>li {
  margin-left: 0;
}

#toc_container .toc_list li a {
  text-decoration: none;
  color: #000;
}

#toc_container .toc_list li a .toc_number{
  color: #85c64c;
  font-weight: bold;
}

#toc_container .toc_list li a:hover {
  opacity: .6;
}

#toc_container .toc_list li ul {
  margin: .4em 0;
}

#toc_container .toc_list li ul li {
  margin-left: 1em;
}

@media screen and (max-width: 767px) {
  #toc_container .toc_title {
  font-size: 120%;
  }
}

/* side_column
**************************************** */
.side_column {
  width: 264px;
}

.side_section {
  padding: 40px 28px;
}

.side_section:not(:last-child) {
  margin-bottom: 32px;
}

.side--ttl {
  font-size: 120%;
  letter-spacing: 0.07em;
  font-weight: 500;
  line-height: 1;
  margin-bottom: 24px;
}

.side--ttl small {
  font-size: 62%;
  opacity: 0.5;
  letter-spacing: 0.15em;
  display: block;
  line-height: 1;
  margin-top: 16px;
  font-weight: bold;
}

.side--list li {
  line-height: 1.6;
  font-size: 94%;
}

.side--list.list li:not(:last-child) {
  margin-bottom: 12px;
}

.side--list.list li::before {
  top: 0.6em;
  width: 6px;
  height: 6px;
}

.side--list.list a:hover {
  opacity: 0.6;
}

/* --- post --- */
.posts-side .post:not(:last-child) {
  margin-bottom: 16px;
}

.posts-side .post--img ,
.posts-side .post--img-logo {
  margin-left: 16px;
  border-radius: 3px;
  width: 64px;
  height: 64px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.posts-side .post--img-logo {
  background-size:  90% auto;
  background-color: #fff;
}

.posts-side .txtarea {
  flex: 1;
}

.posts-side .post {
  transition: all 0.4s ease-out;
}

.posts-side .post:hover {
  opacity: 0.6;
}

.posts-side .post--date {
  margin-bottom: 0;
  font-size: 75%;
  color: #aaa;
}

.posts-side .post--ttl {
  font-size: 88%;
  font-weight: 500;
  line-height: 1.6;
}

/* --- archive --- */
.side_column .archive_list--ttl::after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-top: 1px solid;
  border-right: 1px solid;
  transform: rotate(135deg);
  transition: 0.4s ease-out;
}

.side_column .archive_list--ttl.active::after {
  transform: rotate(315deg);
}

.side_column .archive_month {
  display: none;
}

@media screen and (max-width: 767px) {
  .side_column {
    width: 100%;
  }
}

/* --- archive-pulldown --- */
.archive-pulldown {
  position: relative;
  margin-left: auto;
  z-index: 1;
}

.archive-pulldown .archive_list {
  position: relative;
  font-size: 92%;
}

.archive-pulldown .archive_list:not(:last-child) {
  margin-right: 24px;
}

.archive-pulldown .archive_list a {
  display: block;
  padding: 2px 16px;
  text-align: left;
}

.archive-pulldown .archive_list a:not(:last-child) {
  border-bottom: 1px solid #eee;
}

.archive-pulldown .archive_list--label {
  margin-right: 8px;
}

.archive-pulldown .archive_list--btn {
  cursor: pointer;
  border: none;
  outline: none;
  appearance: none;
  padding: 8px 54px 8px 32px;
  background-color: #fff;
  border: 1px solid #ccc;
}

.archive-pulldown .archive_list--btn::after {
  content: "";
  position: absolute;
  top: 9px;
  right: 10px;
  display: block;
  width: 10px;
  height: 10px;
  border-bottom: 2px solid #333;
  border-right: 2px solid #333;
  transform: rotate(45deg);
  transition: 0.2s ease-out;
  transform-origin: 50% 50%;
}

.archive-pulldown .active .archive_list--btn::after {
  top: 14px;
  transform: rotate(225deg);
}

.archive-pulldown .archive_list--menu {
  position: absolute;
  z-index: 1;
  width: 100%;
  background: #fff;
  border: 1px solid #ccc;
  visibility: hidden;
  opacity: 0;
  transition: 0.2s ease-out;
}

.archive-pulldown .active .archive_list--menu {
  visibility: visible;
  opacity: 1;
}

/* blog
**************************************** */
.posts-blog .post {
  padding-bottom: 48px;
  padding-top: 48px;
  border-bottom: 1px solid #e5e5e5;
}

.posts-blog .post:first-child {
  padding-top: 0;
}

.posts-blog .post--txtarea {
  flex: 1;
}

.posts-blog .post--date {
  margin-right: 16px;
  margin-bottom: 4px;
}

.posts-blog .cat_list a {
  padding: 6px 10px;
  font-size: 79%;
}

.posts-blog .post--img {
  padding-left: 40px;
}

.posts-blog .post--img {
  max-height: 280px;
  overflow: hidden;
}

.posts-blog .post--img img {
  width: 280px;
  height: auto;
}

.posts-blog .heading-2 {
  font-size: 168%;
}

@media screen and (max-width: 1100px) {

  .archive-blog .inner.flex,
  .single-blog .inner.flex {
    display: block;
  }
}

@media screen and (max-width: 768px) {
  .side_section {
    padding: 32px 24px;
  }

  .side--ttl {
    font-size: 134%;
    text-align: center;
  }

  .posts-blog .post {
    display: block;
    padding-top: 24px;
    padding-bottom: 24px;
  }

  .posts-blog .post--img {
    padding-left: 0;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 16px;
    text-align: center;
  }

  .posts-blog .post--img img {
    width: auto;
    max-width: 100%;
  }

  .posts-blog .heading-2 {
    padding: 4px 0;
    font-size: 134%;
  }
}

/* news
**************************************** */

/* --- news--archive --- */
.news--archive {
  padding-top: 20px;
  padding-bottom: 20px;
  background-color: #111;
}

.news--archive li {
  margin-left: 8px;
  margin-right: 8px;
}

.news--archive a {
  color: #fff;
}

/* --- newsrelease_list --- */
.newsrelease_list .post {
  padding: 16px 20px;
  margin-bottom: 0;
  border-bottom: 1px solid #dedede;
}

.newsrelease_list .post .date {
  margin-right: 16px;
  transform: translateY(1px);
  font-weight: bold;
  font-size: 85%;
}

.newsrelease_list .post a {
  display: block;
  text-decoration: underline;
}

.newsrelease_list .post a:hover {
  opacity: 0.7;
}

@media screen and (max-width: 768px) {
  .newsrelease_list .post {
    display: block;
  }

  .newsrelease_list .post--date {
    display: inline-block;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-right: 16px;
    padding-left: 16px;
    margin-bottom: 8px;
  }
}

/* ##############################################################################

    SINGLE

############################################################################## */
.blog--info strong {
  color: #000 !important;
}

.writer {
  padding-top: 64px;
}

.writerprofile {
  margin-bottom: 64px;
  border: solid 1px #ddd;
  padding: 48px 30px;
}

.writerprofile .writer--ttl {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: -26px;
  width: max-content;
  padding: 4px 16px;
}

.writerprofile .writer--cont {
  width: 100%;
  justify-content: space-between;
}

.writerprofile .writer--text .name {
  font-size: 125%;
  font-weight: bold;
  margin-bottom: 16px;
  padding-bottom: 8px;
  border-bottom: 2px solid #f3df68;
}

.wp-pagenavi {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  display: -webkit-flex;
  -webkit-flex-wrap: wrap;
  -webkit-justify-content: center;
  padding-top: 80px;
}

.wp-pagenavi>* {
  margin: 0 6px;
}

.wp-pagenavi .current,
.wp-pagenavi a {
  position: relative;
  max-width: 41.5%;
  display: inline-block;
  vertical-align: top;
  border: solid 1px #f1f1f1;
  background: #f1f1f1;
  line-height: 1.4;
  padding: 8px 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wp-pagenavi .current {
  background-color: transparent;
  border: solid 1px #ddd;
}

.wp-pagenavi a:hover {
  border: solid 1px #f3df68;
  background: #fefcf0;
}

@media only screen and (max-width: 1340px) {

  .wp-pagenavi .current,
  .wp-pagenavi a {
    max-width: 37%;
  }
}

@media only screen and (max-width: 767px) {
  .single .section_ttl {
    font-size: 168%;
  }

  .writer {
    padding-top: 56px;
  }

  .writerprofile {
    padding-top: 48px;
    margin-bottom: 32px;
  }

  .writerprofile .writer--ttl {
    top: -22px;
    left: 0;
    right: 0;
    margin: 0 auto;
    font-size: 110%;
  }

  .writerprofile .writer--cont {
    align-items: center;
  }

  .writerprofile .writer--img {
    width: 65%;
    text-align: center;
    margin-bottom: 16px;
  }

  .writerprofile .writer--text {
    width: 100%;
  }

  .wp-pagenavi {
    padding-top: 32px;
    margin-bottom: 40px;
    font-size: 87%;
  }

  .single .wp-pagenavi {
    font-size: 100%;
    text-align: center;
  }

  .wp-pagenavi .current,
  .wp-pagenavi a {
    padding: 4px 8px;
    margin: 0 4px 8px;
  }

  .single .wp-pagenavi .current,
  .single .wp-pagenavi a {
    padding: 8px 8px;
  }

  .single .wp-pagenavi a {
    width: 100%;
    max-width: 100%;
    margin-bottom: 8px;
  }
}

/* ##############################################################################

    FORMY

############################################################################## */
#formy_form table {
  width: 100%;
}

#formy_form th,
#formy_form td {
  padding: 16px;
  vertical-align: middle;
  border-bottom: solid 1px #eee;
}

#formy_form th {
  font-weight: normal;
  white-space: nowrap;
  text-align: left;
  width: 34%;
}

#formy_form table input[type="text"],
#formy_form table input[type="email"],
#formy_form table input[type="tel"],
#formy_form table input[type="date"],
#formy_form table input[type="password"],
#formy_form table textarea {
  width: 100%;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  vertical-align: bottom;
}

#formy_form table input[type="text"],
#formy_form table input[type="email"],
#formy_form table input[type="tel"],
#formy_form table input[type="date"],
#formy_form table input[type="password"],
#formy_form select,
#formy_form textarea {
  margin: 0;
  padding: 5px 15px;
  border: 1px solid #bbb;
  font: inherit;
  font-size: 100%;
}

#formy_form textarea {
  height: 100px;
}

#formy_form select {
  height: 40px;
}

#formy_form ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

#formy_form input:hover {
  opacity: 1;
}

#formy_form textarea:hover {
  opacity: 1;
}

#formy_form input:focus {
  outline: none;
}

#formy_form .parsley-validated {
  background-color: #eee;
}

#formy_form .parsley-error {
  background-color: #fee;
}

#formy_form .parsley-success {
  background-color: #fff;
}

.help_text {
  display: block;
  padding-top: 8px;
  font-size: 85%;
  line-height: 1.6;
  color: #999;
}

.hidden_help {
  display: none;
}

.recaptcha_policy {
  padding-top: 8px;
  font-size: 72%;
  line-height: 1.6;
  color: #999;
}

.recaptcha_policy a {
  color: #99b8fd;
}

.formy_privacy div {
  overflow-y: scroll;
  height: 140px;
  border: solid 1px #ccc;
  font-size: 85%;
  padding: 8px 16px;
}

.requiredIcon {
  background: #f3df68;
  color: #000;
  margin: 0 0 0 1em;
  font-size: 70%;
  padding: 2px 5px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  float: right;
}

#formy_btn {
  padding-top: 32px;
  text-align: center;
}

#formy_btn input {
  min-width: 220px;
  padding: 16px 32px;
  margin-right: 4px;
  margin-left: 4px;
  border: none;
  border-radius: 3px;
  color: #fff;
  font-size: inherit;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

#formy_form span input[type="radio"],
#formy_form span input[type="checkbox"] {
  display: none !important;
}

#formy_form span label {
  height: 40px;
  line-height: 40px;
  display: inline-block;
  vertical-align: top;
  position: relative;
  padding: 0 8px 0 40px;
  cursor: pointer;
}

#formy_form span label:hover {
  opacity: 1;
}

#formy_form span .wpcf7-list-item-label::before {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  border: 1px solid #788b93;
  left: 16px;
  top: 12px;
}

#formy_form span input[type="radio"]+.wpcf7-list-item-label::before {
  border-radius: 10px;
}

#formy_form span input[type="radio"]:checked+.wpcf7-list-item-label,
#formy_form span input[type="checkbox"]:checked+.wpcf7-list-item-label,
#formy_form span input+input+.wpcf7-list-item-label {
  color: #ee4242;
  font-weight: bold;
}

#formy_form span input[type="radio"]:checked+.wpcf7-list-item-label::before,
#formy_form span input[type="checkbox"]:checked+.wpcf7-list-item-label::before,
#formy_form span input+input+.wpcf7-list-item-label::beforev {
  border-color: #ee4242;
}

#formy_form span input[type="radio"]:checked+.wpcf7-list-item-label::after,
#formy_form span input[type="checkbox"]:checked+.wpcf7-list-item-label::after,
#formy_form span input+input+.wpcf7-list-item-label::after {
  content: "";
  width: 10px;
  height: 18px;
  top: 4px;
  left: 20px;
  border-right: 2px solid #ee4242;
  border-bottom: 2px solid #ee4242;
  display: block;
  position: absolute;
  z-index: 10;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.formy_confirm {
  background-color: #4dbaff;
}

.formy_submit_disabled {
  background-color: #ccc;
}

#formy_btn .formy_submit_disabled:hover {
  opacity: 1;
  cursor: default;
}

.autoConfirmBack {
  background-color: #aaa;
}

.formy_send {
  background-color: #ff6600;
}

#total_required {
  padding: 16px;
  color: #f55555;
  text-align: center;
}

@media only screen and (max-width: 767px) {
  #formy_form {
    padding: 0 16px;
  }

  #formy_form th,
  #formy_form td {
    display: block;
    width: auto;
    padding-left: 0;
    padding-right: 0;
  }

  #formy_form th {
    border-bottom: none;
    padding-bottom: 8px;
    white-space: normal;
    font-weight: bold;
  }

  #formy_form td {
    padding-top: 0;
  }

  #formy_btn {
    padding-top: 8px;
  }

  #formy_btn input {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
    background-size: contain;
    background-position: center;
  }

  #formy_form span label {
    height: 36px;
    line-height: 36px;
  }

  #formy_form span .wpcf7-list-item-label::before {
    top: 10px;
  }

  #formy_form span input[type="radio"]:checked+.wpcf7-list-item-label::after,
  #formy_form span input[type="checkbox"]:checked+.wpcf7-list-item-label::after,
  #formy_form span input+input+.wpcf7-list-item-label::after {
    top: 2px;
  }
}

/* --- cf7 --- */
#wpcf7-submit_btn {
  padding-left: 16px;
  text-align: center;
}

.wpcf7-confirm,
.wpcf7-submit,
.wpcf7-back {
  display: inline-block;
  min-width: 240px;
  padding: 16px 32px;
  margin: 40px 4px 0;
  border: none;
  border-radius: 3px;
  background-color: #ee4242;
  color: #fff;
  font-size: inherit;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  letter-spacing: 0.05em;
  transition: all 0.4s ease-out;
}

#formy_form input[type="submit"]:hover {
  opacity: 0.8;
}

.wpcf7-back {
  background-color: #ccc;
}

.first.wpcf7-list-item {
  padding-top: 0;
}

.wpcf7c-conf {
  background-color: #fff;
  border: none !important;
}

div.wpcf7-validation-errors,
div.wpcf7-acceptance-missing {
  border: 1px solid #ee4242;
  background-color: #ee4242;
  color: #fff;
  font-size: .85em;
  font-weight: bold;
}

#formy_form .privacy {
  overflow-y: scroll;
  height: 140px;
  border: solid 1px #ccc;
  font-size: 94%;
  line-height: 1.8;
  padding: 10px 16px;
}

#formy_form .privacy p {
  margin-bottom: 1em;
}

span.wpcf7-list-item {
  display: block;
  margin-left: -12px;
  white-space: nowrap;
}

span.wpcf7-list-item label {
  cursor: pointer;
}

@media screen and (max-width: 767px) {
  .wpcf7-submit_btn input {
    width: 100%;
    margin-bottom: 8px;
  }

  .wpcf7-confirm,
  .wpcf7-submit,
  .wpcf7-back {
    min-width: 180px;
    margin-top: 24px;
  }

  div.wpcf7 input[type="file"] {
    font-size: 12px;
  }

  #formy_form .privacy {
    line-height: 2;
    font-size: 87%;
  }

  span.wpcf7-list-item {
    font-size: 94%;
  }
}

@media screen and (max-width: 340px) {
  span.wpcf7-list-item {
    font-size: 88%;
  }
}

@media screen and (max-width: 320px) {
  div.wpcf7 input[type="file"] {
    font-size: 10px;
  }
}

span.wpcf7-not-valid-tip {
  margin-top: .5em;
  padding: .25em 1em;
  background-color: #ee4242;
  color: #fff;
  font-weight: bold;
  font-size: .85em;
}